|  |  |  | 
|---|
|  |  |  | <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"> | 
|---|
|  |  |  | <link rel="stylesheet" href="../../static/layui/css/layui.css" media="all"> | 
|---|
|  |  |  | <link rel="stylesheet" href="../../static/css/cool.css" media="all"> | 
|---|
|  |  |  | <link rel="stylesheet" href="../../static/css/common.css" media="all"> | 
|---|
|  |  |  | <link rel="stylesheet" href="../../static/css/admin.css" media="all"> | 
|---|
|  |  |  | <style> | 
|---|
|  |  |  |  | 
|---|
|  |  |  | #detail { | 
|---|
|  |  |  | padding: 25px 30px 0 0; | 
|---|
|  |  |  | } | 
|---|
|  |  |  | .ew-tree-table-box { | 
|---|
|  |  |  | height: 100%; | 
|---|
|  |  |  | } | 
|---|
|  |  |  | </style> | 
|---|
|  |  |  | </head> | 
|---|
|  |  |  | <body> | 
|---|
|  |  |  |  | 
|---|
|  |  |  | <!-- 搜索栏 --> | 
|---|
|  |  |  | <div id="search-box" class="layui-form layui-card-header"> | 
|---|
|  |  |  | <div class="layui-inline"> | 
|---|
|  |  |  | <div class="layui-input-inline"> | 
|---|
|  |  |  | <input class="layui-input" type="text" name="uuid" placeholder="编号" autocomplete="off"> | 
|---|
|  |  |  | <!-- 正文开始 --> | 
|---|
|  |  |  | <div class="layui-fluid"> | 
|---|
|  |  |  | <div class="layui-card"> | 
|---|
|  |  |  | <div class="layui-card-body"> | 
|---|
|  |  |  | <!-- 数据表格 --> | 
|---|
|  |  |  | <table id="tag"></table> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  |  | 
|---|
|  |  |  | <!-- 待添加 --> | 
|---|
|  |  |  | <div id="data-search-btn" class="layui-btn-container layui-form-item"> | 
|---|
|  |  |  | <button id="search" class="layui-btn layui-btn-primary layui-btn-radius" lay-submit lay-filter="search">搜索</button> | 
|---|
|  |  |  | <button id="reset" class="layui-btn layui-btn-primary layui-btn-radius" lay-submit lay-filter="reset">重置</button> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  |  | 
|---|
|  |  |  | <!-- 表格 --> | 
|---|
|  |  |  | <div class="layui-form"> | 
|---|
|  |  |  | <table class="layui-hide" id="tag" lay-filter="tag"></table> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | <script type="text/html" id="toolbar"> | 
|---|
|  |  |  | <div class="layui-btn-container"> | 
|---|
|  |  |  | <button class="layui-btn layui-btn-sm" id="btn-add" lay-event="addData">新增</button> | 
|---|
|  |  |  | <button class="layui-btn layui-btn-sm" id="btn-delete" lay-event="deleteData">删除</button> | 
|---|
|  |  |  | <button class="layui-btn layui-btn-primary layui-btn-sm" id="btn-export" lay-event="exportData">导出</button> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | </script> | 
|---|
|  |  |  |  | 
|---|
|  |  |  | <script type="text/html" id="operate"> | 
|---|
|  |  |  | <a class="layui-btn layui-btn-primary layui-btn-xs btn-edit" lay-event="edit">修改</a> | 
|---|
|  |  |  | <a class="layui-btn layui-btn-danger layui-btn-xs btn-del" lay-event="del">删除</a> | 
|---|
|  |  |  | </script> | 
|---|
|  |  |  |  | 
|---|
|  |  |  | <!-- 表单弹窗 --> | 
|---|
|  |  |  | <script type="text/html" id="editDialog"> | 
|---|
|  |  |  | <form id="detail" lay-filter="detail" class="layui-form"> | 
|---|
|  |  |  | <input name="id" type="hidden"> | 
|---|
|  |  |  | <input name="uuid" type="hidden"> | 
|---|
|  |  |  | <input name="path" type="hidden"> | 
|---|
|  |  |  | <input name="pathName" type="hidden"> | 
|---|
|  |  |  | <input name="img" type="hidden"> | 
|---|
|  |  |  | <input name="brief" type="hidden"> | 
|---|
|  |  |  | <input name="level" type="hidden"> | 
|---|
|  |  |  | <input name="count" type="hidden"> | 
|---|
|  |  |  | <input name="createTime$" type="hidden"> | 
|---|
|  |  |  | <input name="createBy" type="hidden"> | 
|---|
|  |  |  | <input name="updateTime$" type="hidden"> | 
|---|
|  |  |  | <input name="updateBy" type="hidden"> | 
|---|
|  |  |  | <div class="layui-row"> | 
|---|
|  |  |  |  | 
|---|
|  |  |  | <div class="layui-col-md6"> | 
|---|
|  |  |  |  | 
|---|
|  |  |  | <div class="layui-form-item"> | 
|---|
|  |  |  | <label class="layui-form-label">上级菜单</label> | 
|---|
|  |  |  | <div class="layui-input-block"> | 
|---|
|  |  |  | <div id="tagParentSel" class="ew-xmselect-tree"></div> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  |  | 
|---|
|  |  |  | <div class="layui-form-item"> | 
|---|
|  |  |  | <label class="layui-form-label layui-form-required">类型</label> | 
|---|
|  |  |  | <div class="layui-input-block"> | 
|---|
|  |  |  | <select name="type" lay-vertype="tips" lay-verify="required" required=""> | 
|---|
|  |  |  | <option value="">请选择类型</option> | 
|---|
|  |  |  | <option value="1">盒装</option> | 
|---|
|  |  |  | <option value="2">袋装</option> | 
|---|
|  |  |  | <option value="0">其他</option> | 
|---|
|  |  |  | </select> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  |  | 
|---|
|  |  |  | <div class="layui-form-item"> | 
|---|
|  |  |  | <label class="layui-form-label">负责人</label> | 
|---|
|  |  |  | <div class="layui-input-block"> | 
|---|
|  |  |  | <input name="leading" placeholder="请输入负责人" class="layui-input"> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  |  | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  |  | 
|---|
|  |  |  | <div class="layui-col-md6"> | 
|---|
|  |  |  |  | 
|---|
|  |  |  | <div class="layui-form-item"> | 
|---|
|  |  |  | <label class="layui-form-label layui-form-required">归类名称</label> | 
|---|
|  |  |  | <div class="layui-input-block"> | 
|---|
|  |  |  | <input name="name" placeholder="请输入归类名称" class="layui-input" lay-vertype="tips" lay-verify="required" required=""> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  |  | 
|---|
|  |  |  | <div class="layui-form-item"> | 
|---|
|  |  |  | <label class="layui-form-label">排序</label> | 
|---|
|  |  |  | <div class="layui-input-block"> | 
|---|
|  |  |  | <input name="sort" placeholder="请输入排序" class="layui-input"> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  |  | 
|---|
|  |  |  | <div class="layui-form-item"> | 
|---|
|  |  |  | <label class="layui-form-label">备注</label> | 
|---|
|  |  |  | <div class="layui-input-block"> | 
|---|
|  |  |  | <input name="memo" placeholder="请输入备注" class="layui-input"> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  |  | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | <hr class="layui-bg-gray"> | 
|---|
|  |  |  | <div class="layui-form-item text-right"> | 
|---|
|  |  |  | <button class="layui-btn" lay-filter="editSubmit" lay-submit="">保存</button> | 
|---|
|  |  |  | <button class="layui-btn layui-btn-primary" type="button" ew-event="closeDialog">取消</button> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | </form> | 
|---|
|  |  |  | </script> | 
|---|
|  |  |  |  | 
|---|
|  |  |  | <script type="text/javascript" src="../../static/js/jquery/jquery-3.3.1.min.js"></script> | 
|---|
|  |  |  | <script type="text/javascript" src="../../static/layui/layui.js" charset="utf-8"></script> | 
|---|
|  |  |  | <script type="text/javascript" src="../../static/js/common.js" charset="utf-8"></script> | 
|---|
|  |  |  | <script type="text/javascript" src="../../static/js/cool.js" charset="utf-8"></script> | 
|---|
|  |  |  | <script type="text/javascript" src="../../static/js/tag/tag.js" charset="utf-8"></script> | 
|---|
|  |  |  |  | 
|---|
|  |  |  | <iframe id="detail-iframe" scrolling="auto" style="display:none;"></iframe> | 
|---|
|  |  |  | <script> | 
|---|
|  |  |  | layui.config({ | 
|---|
|  |  |  | base: baseUrl + "/static/layui/lay/modules/" | 
|---|
|  |  |  | }).use(['form','treeTable', 'admin', 'xmSelect'], function() { | 
|---|
|  |  |  | var $ = layui.jquery; | 
|---|
|  |  |  | var layer = layui.layer; | 
|---|
|  |  |  | var form = layui.form; | 
|---|
|  |  |  | var admin = layui.admin; | 
|---|
|  |  |  | var treeTable = layui.treeTable; | 
|---|
|  |  |  | var xmSelect = layui.xmSelect; | 
|---|
|  |  |  | var tbDataList = []; | 
|---|
|  |  |  |  | 
|---|
|  |  |  | var insTb = treeTable.render({ | 
|---|
|  |  |  | elem: '#tag', | 
|---|
|  |  |  | url: baseUrl+'/tag/list/auth', | 
|---|
|  |  |  | headers: {token: localStorage.getItem('token')}, | 
|---|
|  |  |  | height: 'full-200', | 
|---|
|  |  |  | toolbar: ['<p>', | 
|---|
|  |  |  | '<button lay-event="add" class="layui-btn layui-btn-sm icon-btn"><i class="layui-icon"></i>添加</button> ', | 
|---|
|  |  |  | '<button lay-event="del" class="layui-btn layui-btn-sm layui-btn-danger icon-btn"><i class="layui-icon"></i>删除</button>', | 
|---|
|  |  |  | '</p>'].join(''), | 
|---|
|  |  |  | tree: { | 
|---|
|  |  |  | iconIndex: 2,           // 折叠图标显示在第几列 | 
|---|
|  |  |  | isPidData: true,        // 是否是id、pid形式数据 | 
|---|
|  |  |  | idName: 'id',           // id字段名称 | 
|---|
|  |  |  | pidName: 'parentId'     // pid字段名称 | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | cols: [[ | 
|---|
|  |  |  | {type: 'checkbox'} | 
|---|
|  |  |  | ,{type: 'numbers'} | 
|---|
|  |  |  | ,{field: 'name', align: 'left',title: '名称', minWidth: 150} | 
|---|
|  |  |  | // ,{field: 'uuid', align: 'center',title: '编号'} | 
|---|
|  |  |  | ,{field: 'type$', align: 'center',title: '类型'} | 
|---|
|  |  |  | ,{field: 'leading', align: 'center',title: '负责人'} | 
|---|
|  |  |  | ,{field: 'img', align: 'center',title: '图片', hide: true} | 
|---|
|  |  |  | // ,{field: 'brief', align: 'center',title: '简要描述'} | 
|---|
|  |  |  | // ,{field: 'count', align: 'center',title: '数量'} | 
|---|
|  |  |  | ,{field: 'sort', align: 'center',title: '排序'} | 
|---|
|  |  |  | ,{field: 'status$', align: 'center',title: '状态'} | 
|---|
|  |  |  | ,{field: 'updateTime$', align: 'center',title: '修改时间'} | 
|---|
|  |  |  | ,{field: 'updateBy$', align: 'center',title: '修改人员', hide: true} | 
|---|
|  |  |  | ,{field: 'memo', align: 'center',title: '备注', hide: true} | 
|---|
|  |  |  |  | 
|---|
|  |  |  | ,{fixed: 'right', title:'操作', align: 'center', toolbar: '#operate', width:150} | 
|---|
|  |  |  | ]], | 
|---|
|  |  |  | done: function (data) { | 
|---|
|  |  |  | $('.ew-tree-table-box').css('height', '100%'); | 
|---|
|  |  |  | insTb.expandAll(); | 
|---|
|  |  |  | tbDataList = data; | 
|---|
|  |  |  | } | 
|---|
|  |  |  | }); | 
|---|
|  |  |  |  | 
|---|
|  |  |  | /* 表格头工具栏点击事件 */ | 
|---|
|  |  |  | treeTable.on('toolbar(tag)', function (obj) { | 
|---|
|  |  |  | if (obj.event === 'add') { // 添加 | 
|---|
|  |  |  | showEditModel(); | 
|---|
|  |  |  | } else if (obj.event === 'del') { // 删除 | 
|---|
|  |  |  | var checkRows = insTb.checkStatus(); | 
|---|
|  |  |  | if (checkRows.length === 0) { | 
|---|
|  |  |  | layer.msg('请选择要删除的数据', {icon: 2}); | 
|---|
|  |  |  | return; | 
|---|
|  |  |  | } | 
|---|
|  |  |  | var ids = checkRows.map(function (d) { | 
|---|
|  |  |  | if (!d.LAY_INDETERMINATE) { | 
|---|
|  |  |  | return d.id; | 
|---|
|  |  |  | } else { | 
|---|
|  |  |  | return null; | 
|---|
|  |  |  | } | 
|---|
|  |  |  | }); | 
|---|
|  |  |  | doDel({ids: ids}); | 
|---|
|  |  |  | } | 
|---|
|  |  |  | }); | 
|---|
|  |  |  |  | 
|---|
|  |  |  | /* 表格操作列点击事件 */ | 
|---|
|  |  |  | treeTable.on('tool(tag)', function (obj) { | 
|---|
|  |  |  | if (obj.event === 'edit') { // 修改 | 
|---|
|  |  |  | showEditModel(obj.data); | 
|---|
|  |  |  | } else if (obj.event === 'del') { // 删除 | 
|---|
|  |  |  | doDel(obj); | 
|---|
|  |  |  | } | 
|---|
|  |  |  | }); | 
|---|
|  |  |  |  | 
|---|
|  |  |  | /* 显示表单弹窗 */ | 
|---|
|  |  |  | function showEditModel(mData) { | 
|---|
|  |  |  | admin.open({ | 
|---|
|  |  |  | type: 1, | 
|---|
|  |  |  | area: '600px', | 
|---|
|  |  |  | title: (mData ? '修改' : '添加') + '权限', | 
|---|
|  |  |  | content: $('#editDialog').html(), | 
|---|
|  |  |  | success: function (layero, dIndex) { | 
|---|
|  |  |  | // 回显表单数据 | 
|---|
|  |  |  | form.val('detail', mData); | 
|---|
|  |  |  | // 表单提交事件 | 
|---|
|  |  |  | form.on('submit(editSubmit)', function (data) { | 
|---|
|  |  |  | data.field.parentId = insXmSel.getValue('valueStr'); | 
|---|
|  |  |  | var loadIndex = layer.load(2); | 
|---|
|  |  |  | $.ajax({ | 
|---|
|  |  |  | url: baseUrl+"/tag/"+(mData?'update':'add')+"/auth", | 
|---|
|  |  |  | headers: {'token': localStorage.getItem('token')}, | 
|---|
|  |  |  | data: data.field, | 
|---|
|  |  |  | method: 'POST', | 
|---|
|  |  |  | success: function (res) { | 
|---|
|  |  |  | layer.close(loadIndex); | 
|---|
|  |  |  | if (res.code === 200){ | 
|---|
|  |  |  | layer.close(dIndex); | 
|---|
|  |  |  | layer.msg(res.msg, {icon: 1}); | 
|---|
|  |  |  | insTb.refresh(); | 
|---|
|  |  |  | } else if (res.code === 403){ | 
|---|
|  |  |  | top.location.href = baseUrl+"/"; | 
|---|
|  |  |  | }else { | 
|---|
|  |  |  | layer.msg(res.msg, {icon: 2}); | 
|---|
|  |  |  | } | 
|---|
|  |  |  | } | 
|---|
|  |  |  | }) | 
|---|
|  |  |  | return false; | 
|---|
|  |  |  | }); | 
|---|
|  |  |  | // 渲染下拉树 | 
|---|
|  |  |  | var insXmSel = xmSelect.render({ | 
|---|
|  |  |  | el: '#tagParentSel', | 
|---|
|  |  |  | height: '250px', | 
|---|
|  |  |  | data: insTb.options.data, | 
|---|
|  |  |  | initValue: mData ? [mData.parentId] : [], | 
|---|
|  |  |  | model: {label: {type: 'text'}}, | 
|---|
|  |  |  | prop: { | 
|---|
|  |  |  | name: 'name', | 
|---|
|  |  |  | value: 'id' | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | radio: true, | 
|---|
|  |  |  | clickClose: true, | 
|---|
|  |  |  | tree: { | 
|---|
|  |  |  | show: true, | 
|---|
|  |  |  | indent: 15, | 
|---|
|  |  |  | strict: false, | 
|---|
|  |  |  | expandedKeys: true | 
|---|
|  |  |  | } | 
|---|
|  |  |  | }); | 
|---|
|  |  |  | // 弹窗不出现滚动条 | 
|---|
|  |  |  | $(layero).children('.layui-layer-content').css('overflow', 'visible'); | 
|---|
|  |  |  | layui.form.render('select'); | 
|---|
|  |  |  | } | 
|---|
|  |  |  | }); | 
|---|
|  |  |  | } | 
|---|
|  |  |  |  | 
|---|
|  |  |  | /* 删除 */ | 
|---|
|  |  |  | function doDel(obj) { | 
|---|
|  |  |  | layer.confirm('确定要删除选中数据吗?', { | 
|---|
|  |  |  | skin: 'layui-layer-admin', | 
|---|
|  |  |  | shade: .1 | 
|---|
|  |  |  | }, function (i) { | 
|---|
|  |  |  | layer.close(i); | 
|---|
|  |  |  | var loadIndex = layer.load(2); | 
|---|
|  |  |  | var ids; | 
|---|
|  |  |  | if (obj.data) { | 
|---|
|  |  |  | ids = []; | 
|---|
|  |  |  | ids[0] = obj.data.id; | 
|---|
|  |  |  | } else { | 
|---|
|  |  |  | ids = obj.ids; | 
|---|
|  |  |  | } | 
|---|
|  |  |  | $.ajax({ | 
|---|
|  |  |  | url: baseUrl+"/tag/delete/auth", | 
|---|
|  |  |  | headers: {'token': localStorage.getItem('token')}, | 
|---|
|  |  |  | data: {ids: ids}, | 
|---|
|  |  |  | method: 'POST', | 
|---|
|  |  |  | success: function (res) { | 
|---|
|  |  |  | layer.close(loadIndex); | 
|---|
|  |  |  | if (res.code === 200){ | 
|---|
|  |  |  | layer.msg(res.msg, {icon: 1}); | 
|---|
|  |  |  | insTb.refresh(); | 
|---|
|  |  |  | } else if (res.code === 403){ | 
|---|
|  |  |  | top.location.href = baseUrl+"/"; | 
|---|
|  |  |  | } else { | 
|---|
|  |  |  | layer.msg(res.msg, {icon: 2}); | 
|---|
|  |  |  | } | 
|---|
|  |  |  | } | 
|---|
|  |  |  | }) | 
|---|
|  |  |  | }); | 
|---|
|  |  |  | } | 
|---|
|  |  |  |  | 
|---|
|  |  |  | }); | 
|---|
|  |  |  | </script> | 
|---|
|  |  |  | </body> | 
|---|
|  |  |  | </html> | 
|---|
|  |  |  |  | 
|---|