fix IABKQN 输入框输入收清除其他下拉框或选择框的内容

This commit is contained in:
yubaolee
2024-07-11 16:43:21 +08:00
parent d49ed28b13
commit 2b38807d2d
2 changed files with 87 additions and 104 deletions

View File

@@ -79,21 +79,21 @@
<!--模块添加/编辑窗口--> <!--模块添加/编辑窗口-->
<div id="divEdit" style="display: none"> <div id="divEdit" style="display: none">
<form class="layui-form layui-form-pane" action="" id="formEdit"> <form class="layui-form layui-form-pane" action="" id="formEdit" lay-filter="formEdit">
<input type="hidden" name="Id" v-model="tmp.Id" /> <input type="hidden" name="Id"/>
<div class="layui-form-item"> <div class="layui-form-item">
<label class="layui-form-label">模块名称</label> <label class="layui-form-label">模块名称</label>
<div class="layui-input-block"> <div class="layui-input-block">
<input type="text" name="Name" v-model="tmp.Name" required lay-verify="required" <input type="text" name="Name" required lay-verify="required"
placeholder="请输入模块名称" autocomplete="off" class="layui-input"> placeholder="请输入模块名称" autocomplete="off" class="layui-input">
</div> </div>
</div> </div>
<div class="layui-form-item"> <div class="layui-form-item">
<label class="layui-form-label">导航栏展示</label> <label class="layui-form-label">导航栏展示</label>
<div class="layui-input-block"> <div class="layui-input-block">
<select name="Status" v-model="tmp.Status" required lay-verify="required"> <select name="Status" required lay-verify="required">
<option value="0" selected="selected" >正常</option> <option value="0" selected="selected" >正常</option>
<option value="-1">隐藏</option> <option value="-1">隐藏</option>
</select> </select>
@@ -103,27 +103,27 @@
<div class="layui-form-item"> <div class="layui-form-item">
<label class="layui-form-label">模块标识</label> <label class="layui-form-label">模块标识</label>
<div class="layui-input-block"> <div class="layui-input-block">
<input type="text" name="Code" v-model="tmp.Code" <input type="text" name="Code"
placeholder="比如Module" autocomplete="off" class="layui-input"> placeholder="比如Module" autocomplete="off" class="layui-input">
</div> </div>
</div> </div>
<div class="layui-form-item"> <div class="layui-form-item">
<label class="layui-form-label">URL地址</label> <label class="layui-form-label">URL地址</label>
<div class="layui-input-block"> <div class="layui-input-block">
<input type="text" name="Url" v-model="tmp.Url" required lay-verify="required" <input type="text" name="Url" required lay-verify="required"
placeholder="请输入URL" autocomplete="off" class="layui-input"> placeholder="请输入URL" autocomplete="off" class="layui-input">
</div> </div>
</div> </div>
<div class="layui-form-item"> <div class="layui-form-item">
<label class="layui-form-label">图标</label> <label class="layui-form-label">图标</label>
<div class="layui-input-block"> <div class="layui-input-block">
<input type="text" id="IconName" name="IconName" v-model="tmp.IconName" lay-filter="iconPicker" class="layui-input"> <input type="text" id="IconName" name="IconName" lay-filter="iconPicker" class="layui-input">
</div> </div>
</div> </div>
<div class="layui-form-item"> <div class="layui-form-item">
<label class="layui-form-label">排序号</label> <label class="layui-form-label">排序号</label>
<div class="layui-input-block"> <div class="layui-input-block">
<input type="text" name="SortNo" v-model="tmp.SortNo" required lay-verify="required" <input type="text" name="SortNo" required lay-verify="required"
placeholder="请输入排序号" autocomplete="off" class="layui-input"> placeholder="请输入排序号" autocomplete="off" class="layui-input">
</div> </div>
</div> </div>
@@ -131,9 +131,8 @@
<div class="layui-form-item"> <div class="layui-form-item">
<label class="layui-form-label">所属模块</label> <label class="layui-form-label">所属模块</label>
<div class="layui-input-block"> <div class="layui-input-block">
<input id="ParentName" name="ParentName" v-model="tmp.ParentName" class="layui-input" /> <input id="ParentName" name="ParentName" class="layui-input" />
<input id="ParentId" name="ParentId" v-model="tmp.ParentId" type="hidden" /> <input id="ParentId" name="ParentId" type="hidden" />
</div> </div>
</div> </div>

View File

@@ -1,62 +1,49 @@
layui.config({ layui.config({
base: "/js/" base: "/js/"
}).use(['form','vue', 'ztree', 'layer', 'jquery', 'table', 'droptree', 'openauth', 'iconPicker', 'utils'], function () { }).use(['form', 'vue', 'ztree', 'layer', 'jquery', 'table', 'droptree', 'openauth', 'iconPicker', 'utils'], function () {
var form = layui.form, var form = layui.form,
layer = layui.layer, layer = layui.layer,
$ = layui.jquery; $ = layui.jquery;
var iconPicker = layui.iconPicker; var iconPicker = layui.iconPicker;
var btnIconPicker = layui.iconPicker; var btnIconPicker = layui.iconPicker;
var vmMenu = new Vue({ var vmMenu = new Vue({
el: "#mfromEdit", el: "#mfromEdit",
data(){ data() {
return { return {
tmp: {} tmp: {}
}
},
watch:{
tmp(val){
this.$nextTick(function () {
form.render(); //刷新select等
btnIconPicker.checkIcon('btnIconPicker', this.tmp.Icon);
})
}
},
mounted(){
form.render();
} }
}); },
var vmModule = new Vue({ watch: {
el: "#formEdit", tmp(val) {
data(){ this.$nextTick(function () {
return { form.render(); //刷新select等
tmp: {} //使用一个tmp封装一下后面可以直接用vm.tmp赋值 btnIconPicker.checkIcon('btnIconPicker', this.tmp.Icon);
} })
},
watch:{
tmp(val){
this.$nextTick(function () {
form.render(); //刷新select等
layui.droptree("/UserSession/GetModules", "#ParentName", "#ParentId", false);
iconPicker.checkIcon('iconPicker', this.tmp.IconName);
})
}
},
mounted(){
form.render();
layui.droptree("/UserSession/GetModules", "#ParentName", "#ParentId", false);
} }
}); },
mounted() {
form.render();
}
});
var moduleInitVal = { //模块初始化的值
Id: "",
SortNo: 1,
IconName: 'layui-icon-app',
ParentId: '',
ParentName: '',
Name: '',
Url: '',
Status: 0,
Remark: '',
Code: ''
};
iconPicker.render({ iconPicker.render({
// 选择器推荐使用input // 选择器推荐使用input
elem: '#IconName', elem: '#IconName',
type: 'fontClass', type: 'fontClass',
// 每个图标格子的宽度:'43px'或'20%' // 每个图标格子的宽度:'43px'或'20%'
cellWidth: '43px', cellWidth: '43px',
// 点击回调
click: function (data) {
vmModule.tmp.IconName = data.icon;
}
}); });
btnIconPicker.render({ //按钮的图标 btnIconPicker.render({ //按钮的图标
// 选择器推荐使用input // 选择器推荐使用input
@@ -72,11 +59,11 @@ layui.config({
var table = layui.table; var table = layui.table;
var openauth = layui.openauth; var openauth = layui.openauth;
$("#menus").loadMenus("Module"); $("#menus").loadMenus("Module");
//主列表加载,可反复调用进行刷新 //主列表加载,可反复调用进行刷新
var config= {}; //table的参数如搜索key点击tree的id var config = {}; //table的参数如搜索key点击tree的id
var mainList = function (options) { var mainList = function (options) {
if (options != undefined) { if (options != undefined) {
$.extend(config, options); $.extend(config, options);
@@ -86,7 +73,7 @@ layui.config({
where: config where: config
, response: { , response: {
statusCode: 200 //规定成功的状态码默认0 statusCode: 200 //规定成功的状态码默认0
} }
}); });
} }
@@ -101,7 +88,7 @@ layui.config({
where: menucon where: menucon
, response: { , response: {
statusCode: 200 //规定成功的状态码默认0 statusCode: 200 //规定成功的状态码默认0
} }
}); });
} }
@@ -110,7 +97,7 @@ layui.config({
var url = '/UserSession/GetModules'; var url = '/UserSession/GetModules';
var zTreeObj; var zTreeObj;
var setting = { var setting = {
view: { selectedMulti: false }, view: {selectedMulti: false},
data: { data: {
key: { key: {
name: 'Name', name: 'Name',
@@ -125,17 +112,17 @@ layui.config({
}, },
callback: { callback: {
onClick: function (event, treeId, treeNode) { onClick: function (event, treeId, treeNode) {
mainList({ pId: treeNode.Id }); mainList({pId: treeNode.Id});
} }
} }
}; };
var load = function () { var load = function () {
$.getJSON(url, function (json) { $.getJSON(url, function (json) {
zTreeObj = $.fn.zTree.init($("#tree"), setting); zTreeObj = $.fn.zTree.init($("#tree"), setting);
var newNode = { Name: "根节点", Id: null, ParentId: "" }; var newNode = {Name: "根节点", Id: null, ParentId: ""};
json.Result.push(newNode); json.Result.push(newNode);
zTreeObj.addNodes(null, json.Result); zTreeObj.addNodes(null, json.Result);
mainList({ pId: "" }); mainList({pId: ""});
zTreeObj.expandAll(true); zTreeObj.expandAll(true);
}); });
}; };
@@ -146,35 +133,34 @@ layui.config({
}(); }();
$("#tree").height($("div.layui-table-view").height()); $("#tree").height($("div.layui-table-view").height());
//添加(编辑)模块对话框 //添加(编辑)模块对话框
var editDlg = function() { var editDlg = function () {
var update = false; //是否为更新 var show = function (update, data) {
var show = function (data) {
var title = update ? "编辑信息" : "添加"; var title = update ? "编辑信息" : "添加";
layer.open({ layer.open({
title: title, title: title,
area: ["500px", "480px"], area: ["500px", "480px"],
type: 1, type: 1,
content: $('#divEdit'), content: $('#divEdit'),
success: function() { success: function () {
if(data.Id ==''){ layui.droptree("/UserSession/GetModules", "#ParentName", "#ParentId", false);
for(var key in vmModule.tmp){ if (data == undefined) {
delete vmModule.tmp[key]; form.val("formEdit", moduleInitVal);
} } else {
form.val("formEdit", data);
} }
vmModule.tmp = Object.assign({}, vmModule.tmp,data)
}, },
end: mainList end: mainList
}); });
var url = "/moduleManager/Add"; var url = "/moduleManager/Add";
if (update) { if (update) {
url = "/moduleManager/Update"; url = "/moduleManager/Update";
} }
//提交数据 //提交数据
form.on('submit(formSubmit)', form.on('submit(formSubmit)',
function(data) { function (data) {
$.post(url, $.post(url,
data.field, data.field,
function(data) { function (data) {
layer.msg(data.Message); layer.msg(data.Message);
if ((!update) && data.Code == 200) { //添加成功要刷新左边的树 if ((!update) && data.Code == 200) { //添加成功要刷新左边的树
ztree.reload(); ztree.reload();
@@ -185,17 +171,11 @@ layui.config({
}); });
} }
return { return {
add: function() { //弹出添加 add: function () { //弹出添加
update = false; show(false);
show({
Id: "",
SortNo: 1,
IconName:'layui-icon-app'
});
}, },
update: function(data) { //弹出编辑框 update: function (data) { //弹出编辑框
update = true; show(true,data);
show(data);
} }
}; };
}(); }();
@@ -211,12 +191,12 @@ layui.config({
type: 1, type: 1,
content: $('#divMenuEdit'), content: $('#divMenuEdit'),
success: function () { success: function () {
if(data.Id ==''){ if (data.Id == '') {
for(var key in vmMenu.tmp){ for (var key in vmMenu.tmp) {
delete vmMenu.tmp[key]; delete vmMenu.tmp[key];
} }
} }
vmMenu.tmp = Object.assign({}, vmMenu.tmp,data) vmMenu.tmp = Object.assign({}, vmMenu.tmp, data)
}, },
end: menuList end: menuList
}); });
@@ -241,9 +221,9 @@ layui.config({
update = false; update = false;
show({ show({
Id: "", Id: "",
ModuleId:moduleId, ModuleId: moduleId,
Sort: 1, Sort: 1,
Icon:'layui-icon-app' Icon: 'layui-icon-app'
}); });
}, },
update: function (data) { //弹出编辑框 update: function (data) { //弹出编辑框
@@ -254,8 +234,8 @@ layui.config({
}(); }();
//监听行单击事件 //监听行单击事件
table.on('row(list)', function(obj){ table.on('row(list)', function (obj) {
menuList({moduleId:obj.data.Id}); menuList({moduleId: obj.data.Id});
}); });
//监听页面主按钮操作 //监听页面主按钮操作
@@ -264,7 +244,9 @@ layui.config({
var checkStatus = table.checkStatus('mainList') var checkStatus = table.checkStatus('mainList')
, data = checkStatus.data; , data = checkStatus.data;
openauth.del("/moduleManager/Delete", openauth.del("/moduleManager/Delete",
data.map(function (e) { return e.Id; }), data.map(function (e) {
return e.Id;
}),
function () { function () {
mainList(); mainList();
ztree.reload(); ztree.reload();
@@ -274,7 +256,9 @@ layui.config({
var checkStatus = table.checkStatus('menuList') var checkStatus = table.checkStatus('menuList')
, data = checkStatus.data; , data = checkStatus.data;
openauth.del("/moduleManager/DelMenu", openauth.del("/moduleManager/DelMenu",
data.map(function (e) { return e.Id; }), data.map(function (e) {
return e.Id;
}),
menuList); menuList);
} }
, btnAdd: function () { //添加模块 , btnAdd: function () { //添加模块
@@ -289,15 +273,15 @@ layui.config({
} }
meditDlg.add(data[0].Id); meditDlg.add(data[0].Id);
} }
, btnEdit: function () { //编辑 , btnEdit: function () { //编辑
var checkStatus = table.checkStatus('mainList') var checkStatus = table.checkStatus('mainList')
, data = checkStatus.data; , data = checkStatus.data;
if (data.length != 1) { if (data.length != 1) {
layer.msg("请选择编辑的行,且同时只能编辑一行"); layer.msg("请选择编辑的行,且同时只能编辑一行");
return; return;
} }
editDlg.update(data[0]); editDlg.update(data[0]);
} }
, btnEditMenu: function () { //编辑菜单 , btnEditMenu: function () { //编辑菜单
var checkStatus = table.checkStatus('menuList') var checkStatus = table.checkStatus('menuList')
@@ -310,9 +294,9 @@ layui.config({
} }
, search: function () { //搜索 , search: function () { //搜索
mainList({ key: $('#key').val() }); mainList({key: $('#key').val()});
} }
, btnRefresh: function() { , btnRefresh: function () {
mainList(); mainList();
} }
}; };