feat(partner): 优化合作伙伴表单的授权级别逻辑

- 在添加和编辑页面中,根据授权级别动态显示必填字段
- 当授权级别为"04"时,隐藏联系邮箱和系统用户相关字段的必填标志
- 使用 jQuery 优化了代码结构,提高了页面加载和交互性能
dev_1.0.0
chenhao 2025-09-15 14:52:31 +08:00
parent 436fed388f
commit e716fbf0b6
2 changed files with 375 additions and 337 deletions

View File

@ -1,178 +1,195 @@
<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org" >
<head>
<th:block th:include="include :: header('新增代理商管理')" />
</head>
<body class="white-bg">
<div class="wrapper wrapper-content animated fadeInRight ibox-content">
<div id="showTitle" class="col-xs-12"><label class="col-sm-12 control-label" style=" text-align: center;
font-size: 20px;
color: #f8ac59;">创建代理商之前请先创建代理商用户</label></div>
<form class="form-horizontal m" id="form-partner-add">
<div class="col-xs-6">
<div class="form-group">
<label class="col-sm-4 control-label">代理商编码:</label>
<div class="col-sm-8">
<input name="partnerCode" readonly placeholder="编码自动生成" class="form-control" type="text" >
</div>
</div>
</div>
<div class="col-xs-6">
<div class="form-group">
<label class="col-sm-4 control-label is-required">代理商名称:</label>
<div class="col-sm-8">
<input name="partnerName" class="form-control" type="text" required>
</div>
</div>
</div>
<div id="element1" class="col-xs-12" style="padding: 0">
<div class="col-xs-6">
<div class="form-group">
<label class="col-sm-4 control-label is-required" >省:</label>
<div class="col-sm-8">
<select name="province" class="province form-control m-b" data-first-title="选择省" required>
<option value="">请选择</option>
</select>
</div>
</div>
</div>
<div class="col-xs-6">
<div class="form-group">
<label class="col-sm-4 control-label is-required">市:</label>
<div class="col-sm-8">
<select name="city" class="city form-control m-b" data-first-title="选择市" required>
<option value="">请选择</option>
</select>
</div>
</div>
</div>
</div>
<div class="col-xs-6">
<div class="form-group">
<label class="col-sm-4 control-label is-required">认证级别:</label>
<div class="col-sm-8">
<select name="level" class="form-control" required th:with="type=${@dict.getType('identify_level')}">
<option th:each="dict : ${type}" th:text="${dict.dictLabel}" th:value="${dict.dictValue}"></option>
</select>
</div>
</div>
</div>
<div class="col-xs-6">
<div class="form-group">
<label id="contactEmailLabel" class="col-sm-4 control-label is-required contact-email">邮件:</label>
<div class="col-sm-8">
<input id="contactEmail" name="contactEmail" class="form-control contact-email" required type="text">
</div>
</div>
</div>
<div class="col-xs-6">
<div class="form-group">
<label class="col-sm-4 control-label is-required system-user">系统用户:</label>
<div class="col-sm-8">
<input name="systemUserName" onclick="selectPeople()" class="form-control system-user" required type="text">
<input name="systemUserId" class="form-control system-user" required type="hidden">
</div>
</div>
</div>
<div class="col-xs-6">
<div class="form-group">
<label class="col-sm-4 control-label">联系人:</label>
<div class="col-sm-8">
<input name="contactPerson" class="form-control" type="text">
</div>
</div>
</div>
<div class="col-xs-6">
<div class="form-group">
<label class="col-sm-4 control-label">联系电话:</label>
<div class="col-sm-8">
<input name="contactPhone" class="form-control" type="text">
</div>
</div>
</div>
<div class="col-xs-12">
<div class="form-group">
<label class="col-sm-2 control-label">详细地址:</label>
<div class="col-sm-10">
<input name="address" class="form-control" type="text">
</div>
</div>
</div>
</form>
</div>
<th:block th:include="include :: footer" />
<th:block th:include="include :: jquery-cxselect-js" />
<script th:inline="javascript">
var prefix = ctx + "system/partner"
const initLevel=[[${level}]]
$("#form-partner-add").validate({
focusCleanup: true
});
var urlChina = '/cnarea/select';
$.cxSelect.defaults.url = urlChina;
// $.cxSelect.defaults.jsonSpace = 'data';
$('#element1').cxSelect({
selects: ['province', 'city'],
nodata: 'none'
});
$(function (){
if(initLevel){
$("#showTitle").css("display","none");
$("select[name='level']").val(initLevel);
$("select[name='level']").attr("disabled",true);
$(".contact-email").removeClass("is-required")
$(".contact-email").attr("required",false)
$(".system-user").attr("required",false)
$(".system-user").removeClass("is-required")
}
})
function submitHandler() {
if ($.validate.form()) {
$("select[name='level']").attr("disabled",false);
$.operate.save(prefix + "/add", $('#form-partner-add').serialize());
}
}
function selectPeople() {
var url = ctx + "sip/project/selectPeople";
var options = {
title: '选择责任人',
width: "800",
height: '600',
url: url,
callBack: doSubmitPeople
};
$.modal.openOptions(options);
}
function doSubmitPeople(index, layero) {
var rows = layero.find("iframe")[0].contentWindow.getSelections();
if (rows.length == 0) {
$.modal.alertWarning("请选择一个用户");
return;
}
let $name = $('[name="contactEmail"]');
if (!$name.val()) {
$name.val(rows[0].email);
}
$('[name="systemUserId"]').val(rows[0].userId);
$('[name="systemUserName"]').val(rows[0].userName);
let $contactPerson = $('[name="contactPerson"]');
if (!$contactPerson.val()) {
$contactPerson.val(rows[0].userName);
}
let $contactPhone = $('[name="contactPhone"]');
if (!$contactPhone.val()) {
$contactPhone.val(rows[0].phonenumber);
}
$.modal.close(index);
}
</script>
</body>
<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org" >
<head>
<th:block th:include="include :: header('新增代理商管理')" />
</head>
<body class="white-bg">
<div class="wrapper wrapper-content animated fadeInRight ibox-content">
<div id="showTitle" class="col-xs-12"><label class="col-sm-12 control-label" style=" text-align: center;
font-size: 20px;
color: #f8ac59;">创建代理商之前请先创建代理商用户</label></div>
<form class="form-horizontal m" id="form-partner-add">
<div class="col-xs-6">
<div class="form-group">
<label class="col-sm-4 control-label">代理商编码:</label>
<div class="col-sm-8">
<input name="partnerCode" readonly placeholder="编码自动生成" class="form-control" type="text" >
</div>
</div>
</div>
<div class="col-xs-6">
<div class="form-group">
<label class="col-sm-4 control-label is-required">代理商名称:</label>
<div class="col-sm-8">
<input name="partnerName" class="form-control" type="text" required>
</div>
</div>
</div>
<div id="element1" class="col-xs-12" style="padding: 0">
<div class="col-xs-6">
<div class="form-group">
<label class="col-sm-4 control-label is-required" >省:</label>
<div class="col-sm-8">
<select name="province" class="province form-control m-b" data-first-title="选择省" required>
<option value="">请选择</option>
</select>
</div>
</div>
</div>
<div class="col-xs-6">
<div class="form-group">
<label class="col-sm-4 control-label is-required">市:</label>
<div class="col-sm-8">
<select name="city" class="city form-control m-b" data-first-title="选择市" required>
<option value="">请选择</option>
</select>
</div>
</div>
</div>
</div>
<div class="col-xs-6">
<div class="form-group">
<label class="col-sm-4 control-label is-required">认证级别:</label>
<div class="col-sm-8">
<select name="level" class="form-control" required th:with="type=${@dict.getType('identify_level')}">
<option th:each="dict : ${type}" th:text="${dict.dictLabel}" th:value="${dict.dictValue}"></option>
</select>
</div>
</div>
</div>
<div class="col-xs-6">
<div class="form-group">
<label id="contactEmailLabel" class="col-sm-4 control-label is-required contact-email">邮件:</label>
<div class="col-sm-8">
<input id="contactEmail" name="contactEmail" class="form-control contact-email" required type="text">
</div>
</div>
</div>
<div class="col-xs-6">
<div class="form-group">
<label class="col-sm-4 control-label is-required system-user">系统用户:</label>
<div class="col-sm-8">
<input name="systemUserName" onclick="selectPeople()" class="form-control system-user" required type="text">
<input name="systemUserId" class="form-control system-user" required type="hidden">
</div>
</div>
</div>
<div class="col-xs-6">
<div class="form-group">
<label class="col-sm-4 control-label">联系人:</label>
<div class="col-sm-8">
<input name="contactPerson" class="form-control" type="text">
</div>
</div>
</div>
<div class="col-xs-6">
<div class="form-group">
<label class="col-sm-4 control-label">联系电话:</label>
<div class="col-sm-8">
<input name="contactPhone" class="form-control" type="text">
</div>
</div>
</div>
<div class="col-xs-12">
<div class="form-group">
<label class="col-sm-2 control-label">详细地址:</label>
<div class="col-sm-10">
<input name="address" class="form-control" type="text">
</div>
</div>
</div>
</form>
</div>
<th:block th:include="include :: footer" />
<th:block th:include="include :: jquery-cxselect-js" />
<script th:inline="javascript">
var prefix = ctx + "system/partner"
const initLevel=[[${level}]]
$("#form-partner-add").validate({
focusCleanup: true
});
var urlChina = '/cnarea/select';
$.cxSelect.defaults.url = urlChina;
// $.cxSelect.defaults.jsonSpace = 'data';
$('#element1').cxSelect({
selects: ['province', 'city'],
nodata: 'none'
});
$(function() {
function toggleRequiredFields() {
var authLevel = $('select[name="level"]').val();
if (authLevel === '04') {
$('#contactEmailLabel').removeClass('is-required');
$('#contactEmail').removeAttr('required');
$('.system-user').removeClass('is-required');
$('input[name="systemUserName"]').removeAttr('required');
$('input[name="systemUserId"]').removeAttr('required');
} else {
$('#contactEmailLabel').addClass('is-required');
$('#contactEmail').attr('required', 'required');
$('.system-user').addClass('is-required');
$('input[name="systemUserName"]').attr('required', 'required');
$('input[name="systemUserId"]').attr('required', 'required');
}
}
$('select[name="level"]').on('change', toggleRequiredFields);
if(initLevel){
$("#showTitle").css("display","none");
$("select[name='level']").val(initLevel);
$("select[name='level']").attr("disabled",true);
}
toggleRequiredFields(); // Initial check
});
function submitHandler() {
if ($.validate.form()) {
$("select[name='level']").attr("disabled",false);
$.operate.save(prefix + "/add", $('#form-partner-add').serialize());
}
}
function selectPeople() {
var url = ctx + "sip/project/selectPeople";
var options = {
title: '选择责任人',
width: "800",
height: '600',
url: url,
callBack: doSubmitPeople
};
$.modal.openOptions(options);
}
function doSubmitPeople(index, layero) {
var rows = layero.find("iframe")[0].contentWindow.getSelections();
if (rows.length == 0) {
$.modal.alertWarning("请选择一个用户");
return;
}
let $name = $('[name="contactEmail"]');
if (!$name.val()) {
$name.val(rows[0].email);
}
$('[name="systemUserId"]').val(rows[0].userId);
$('[name="systemUserName"]').val(rows[0].userName);
let $contactPerson = $('[name="contactPerson"]');
if (!$contactPerson.val()) {
$contactPerson.val(rows[0].userName);
}
let $contactPhone = $('[name="contactPhone"]');
if (!$contactPhone.val()) {
$contactPhone.val(rows[0].phonenumber);
}
$.modal.close(index);
}
</script>
</body>
</html>

View File

@ -1,161 +1,182 @@
<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org" >
<head>
<th:block th:include="include :: header('修改代理商管理')" />
</head>
<body class="white-bg">
<div class="wrapper wrapper-content animated fadeInRight ibox-content">
<form class="form-horizontal m" id="form-partner-edit" th:object="${partnerInfo}">
<input name="id" th:field="*{id}" type="hidden">
<div class="col-xs-6">
<div class="form-group">
<label class="col-sm-4 control-label is-required">代理商编码:</label>
<div class="col-sm-8">
<input name="partnerCode" th:field="*{partnerCode}" readonly class="form-control" type="text" required>
</div>
</div>
</div>
<div class="col-xs-6">
<div class="form-group">
<label class="col-sm-4 control-label is-required">代理商名称:</label>
<div class="col-sm-8">
<input name="partnerName" th:field="*{partnerName}" class="form-control" type="text" required>
</div>
</div>
</div>
<div id="element1" class="col-xs-12" style="padding: 0">
<div class="col-xs-6">
<div class="form-group">
<label class="col-sm-4 control-label is-required">省:</label>
<div class="col-sm-8">
<select name="province" required th:data-value="*{province}" class="province form-control m-b" data-first-title="选择省">
<option value="">请选择</option>
</select>
</div>
</div>
</div>
<div class="col-xs-6">
<div class="form-group">
<label class="col-sm-4 control-label is-required">市:</label>
<div class="col-sm-8">
<select name="city" required th:data-value="*{city}" class="city form-control m-b" data-first-title="选择省">
<option value="">请选择</option>
</select>
</div>
</div>
</div>
</div>
<div class="col-xs-6">
<div class="form-group">
<label class="col-sm-4 control-label is-required">认证级别:</label>
<div class="col-sm-8">
<select name="level" required class="form-control" th:with="type=${@dict.getType('identify_level')}">
<option th:each="dict : ${type}" th:text="${dict.dictLabel}" th:value="${dict.dictValue}" th:field="*{level}"></option>
</select>
</div>
</div>
</div>
<div class="col-xs-6">
<div class="form-group">
<label class="col-sm-4 control-label is-required">邮件:</label>
<div class="col-sm-8">
<input name="contactEmail" th:field="*{contactEmail}" class="form-control" type="text">
</div>
</div>
</div>
<div class="col-xs-6">
<div class="form-group">
<label class="col-sm-4 control-label is-required">系统用户:</label>
<div class="col-sm-8">
<input name="systemUserName" onclick="selectPeople()" th:field="*{systemUserName}" class="form-control" required type="text">
<input name="systemUserId" th:field="*{systemUserId}" class="form-control" type="hidden" required>
</div>
</div>
</div>
<div class="col-xs-6">
<div class="form-group">
<label class="col-sm-4 control-label">联系人:</label>
<div class="col-sm-8">
<input name="contactPerson" th:field="*{contactPerson}" class="form-control" type="text">
</div>
</div>
</div>
<div class="col-xs-6">
<div class="form-group">
<label class="col-sm-4 control-label">联系电话:</label>
<div class="col-sm-8">
<input name="contactPhone" th:field="*{contactPhone}" class="form-control" type="text">
</div>
</div>
</div>
<div class="col-xs-12">
<div class="form-group">
<label class="col-sm-2 control-label">详细地址:</label>
<div class="col-sm-10">
<input name="address" th:field="*{address}" class="form-control" type="text">
</div>
</div>
</div>
</form>
</div>
<th:block th:include="include :: footer" />
<th:block th:include="include :: jquery-cxselect-js" />
<script th:inline="javascript">
var prefix = ctx + "system/partner";
$("#form-partner-edit").validate({
focusCleanup: true
});
function submitHandler() {
if ($.validate.form()) {
$.operate.save(prefix + "/edit", $('#form-partner-edit').serialize());
}
}
var urlChina = '/cnarea/select';
$.cxSelect.defaults.url = urlChina;
$('#element1').cxSelect({
selects: ['province', 'city'],
nodata: 'none'
});
function selectPeople() {
var url = ctx + "sip/project/selectPeople";
var options = {
title: '选择责任人',
width: "800",
height: '600',
url: url,
callBack: doSubmitPeople
};
$.modal.openOptions(options);
}
function doSubmitPeople(index, layero) {
var rows = layero.find("iframe")[0].contentWindow.getSelections();
if (rows.length == 0) {
$.modal.alertWarning("请选择一个用户");
return;
}
let $name = $('[name="contactEmail"]');
if (!$name.val()) {
$name.val(rows[0].email);
}
$('[name="systemUserId"]').val(rows[0].userId);
$('[name="systemUserName"]').val(rows[0].userName);
let $contactPerson = $('[name="contactPerson"]');
if (!$contactPerson.val()) {
$contactPerson.val(rows[0].userName);
}
let $contactPhone = $('[name="contactPhone"]');
if (!$contactPhone.val()) {
$contactPhone.val(rows[0].phonenumber);
}
$.modal.close(index);
}
</script>
</body>
<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org" >
<head>
<th:block th:include="include :: header('修改代理商管理')" />
</head>
<body class="white-bg">
<div class="wrapper wrapper-content animated fadeInRight ibox-content">
<form class="form-horizontal m" id="form-partner-edit" th:object="${partnerInfo}">
<input name="id" th:field="*{id}" type="hidden">
<div class="col-xs-6">
<div class="form-group">
<label class="col-sm-4 control-label is-required">代理商编码:</label>
<div class="col-sm-8">
<input name="partnerCode" th:field="*{partnerCode}" readonly class="form-control" type="text" required>
</div>
</div>
</div>
<div class="col-xs-6">
<div class="form-group">
<label class="col-sm-4 control-label is-required">代理商名称:</label>
<div class="col-sm-8">
<input name="partnerName" th:field="*{partnerName}" class="form-control" type="text" required>
</div>
</div>
</div>
<div id="element1" class="col-xs-12" style="padding: 0">
<div class="col-xs-6">
<div class="form-group">
<label class="col-sm-4 control-label is-required">省:</label>
<div class="col-sm-8">
<select name="province" required th:data-value="*{province}" class="province form-control m-b" data-first-title="选择省">
<option value="">请选择</option>
</select>
</div>
</div>
</div>
<div class="col-xs-6">
<div class="form-group">
<label class="col-sm-4 control-label is-required">市:</label>
<div class="col-sm-8">
<select name="city" required th:data-value="*{city}" class="city form-control m-b" data-first-title="选择省">
<option value="">请选择</option>
</select>
</div>
</div>
</div>
</div>
<div class="col-xs-6">
<div class="form-group">
<label class="col-sm-4 control-label is-required">认证级别:</label>
<div class="col-sm-8">
<select name="level" required class="form-control" th:with="type=${@dict.getType('identify_level')}">
<option th:each="dict : ${type}" th:text="${dict.dictLabel}" th:value="${dict.dictValue}" th:field="*{level}"></option>
</select>
</div>
</div>
</div>
<div class="col-xs-6">
<div class="form-group">
<label class="col-sm-4 control-label is-required">邮件:</label>
<div class="col-sm-8">
<input name="contactEmail" th:field="*{contactEmail}" class="form-control" type="text">
</div>
</div>
</div>
<div class="col-xs-6">
<div class="form-group">
<label class="col-sm-4 control-label is-required">系统用户:</label>
<div class="col-sm-8">
<input name="systemUserName" onclick="selectPeople()" th:field="*{systemUserName}" class="form-control" required type="text">
<input name="systemUserId" th:field="*{systemUserId}" class="form-control" type="hidden" required>
</div>
</div>
</div>
<div class="col-xs-6">
<div class="form-group">
<label class="col-sm-4 control-label">联系人:</label>
<div class="col-sm-8">
<input name="contactPerson" th:field="*{contactPerson}" class="form-control" type="text">
</div>
</div>
</div>
<div class="col-xs-6">
<div class="form-group">
<label class="col-sm-4 control-label">联系电话:</label>
<div class="col-sm-8">
<input name="contactPhone" th:field="*{contactPhone}" class="form-control" type="text">
</div>
</div>
</div>
<div class="col-xs-12">
<div class="form-group">
<label class="col-sm-2 control-label">详细地址:</label>
<div class="col-sm-10">
<input name="address" th:field="*{address}" class="form-control" type="text">
</div>
</div>
</div>
</form>
</div>
<th:block th:include="include :: footer" />
<th:block th:include="include :: jquery-cxselect-js" />
<script th:inline="javascript">
var prefix = ctx + "system/partner";
$("#form-partner-edit").validate({
focusCleanup: true
});
function submitHandler() {
if ($.validate.form()) {
$.operate.save(prefix + "/edit", $('#form-partner-edit').serialize());
}
}
var urlChina = '/cnarea/select';
$.cxSelect.defaults.url = urlChina;
$('#element1').cxSelect({
selects: ['province', 'city'],
nodata: 'none'
});
function selectPeople() {
var url = ctx + "sip/project/selectPeople";
var options = {
title: '选择责任人',
width: "800",
height: '600',
url: url,
callBack: doSubmitPeople
};
$.modal.openOptions(options);
}
function doSubmitPeople(index, layero) {
var rows = layero.find("iframe")[0].contentWindow.getSelections();
if (rows.length == 0) {
$.modal.alertWarning("请选择一个用户");
return;
}
let $name = $('[name="contactEmail"]');
if (!$name.val()) {
$name.val(rows[0].email);
}
$('[name="systemUserId"]').val(rows[0].userId);
$('[name="systemUserName"]').val(rows[0].userName);
let $contactPerson = $('[name="contactPerson"]');
if (!$contactPerson.val()) {
$contactPerson.val(rows[0].userName);
}
let $contactPhone = $('[name="contactPhone"]');
if (!$contactPhone.val()) {
$contactPhone.val(rows[0].phonenumber);
}
$.modal.close(index);
}
$(function() {
function toggleRequiredFields() {
var authLevel = $('select[name="level"]').val();
if (authLevel === '04') {
$('input[name="contactEmail"]').closest('.form-group').find('label').removeClass('is-required');
$('input[name="contactEmail"]').removeAttr('required');
$('input[name="systemUserName"]').closest('.form-group').find('label').removeClass('is-required');
$('input[name="systemUserName"]').removeAttr('required');
$('input[name="systemUserId"]').removeAttr('required');
} else {
$('input[name="contactEmail"]').closest('.form-group').find('label').addClass('is-required');
$('input[name="contactEmail"]').attr('required', 'required');
$('input[name="systemUserName"]').closest('.form-group').find('label').addClass('is-required');
$('input[name="systemUserName"]').attr('required', 'required');
$('input[name="systemUserId"]').attr('required', 'required');
}
}
$('select[name="level"]').on('change', toggleRequiredFields);
toggleRequiredFields(); // Initial check
});
</script>
</body>
</html>