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">
<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">
<label class="layui-form-label">模块名称</label>
<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">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">导航栏展示</label>
<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="-1">隐藏</option>
</select>
@@ -103,27 +103,27 @@
<div class="layui-form-item">
<label class="layui-form-label">模块标识</label>
<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">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">URL地址</label>
<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">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">图标</label>
<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 class="layui-form-item">
<label class="layui-form-label">排序号</label>
<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">
</div>
</div>
@@ -131,9 +131,8 @@
<div class="layui-form-item">
<label class="layui-form-label">所属模块</label>
<div class="layui-input-block">
<input id="ParentName" name="ParentName" v-model="tmp.ParentName" class="layui-input" />
<input id="ParentId" name="ParentId" v-model="tmp.ParentId" type="hidden" />
<input id="ParentName" name="ParentName" class="layui-input" />
<input id="ParentId" name="ParentId" type="hidden" />
</div>
</div>

View File

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