monitor_v3 / hg-monitor-web · Commits

Go to a project

Authored by 张凯
Commit bfaada07c47100bea6b17bd7f08b7ae1e57355a7 1 parent 18e0a1ca

1，指标组管理，增加指标组描述字段，放到标识列后，将备注列加宽，可以出现横向滚动条。 

2，指标组管理，绑定资源类型时，将对应的code值也赋值
3，指标组管理，新增和修改页面增加指标组描述字段
Inline Side-by-side
Showing 4 changed files with 648 additions and 603 deletions
1 /** 指标组新增 */ 1 /** 指标组新增 */
2 layui.define(['table', 'form', 'laydate', 'common', 'sessions', 'laydate', 'element', 'admin', 'kpiIndex', 'resourcetype'], function (exports) { 2 layui.define(['table', 'form', 'laydate', 'common', 'sessions', 'laydate', 'element', 'admin', 'kpiIndex', 'resourcetype'], function (exports) {
3 - var $ = layui.$;  
4 - var form = layui.form;  
5 - var table = layui.table;  
6 - var common = layui.common;  
7 - var admin = layui.admin;  
8 - var view = layui.view;  
9 - var element = layui.element;  
10 -  
11 - // 对外暴露的接口  
12 - exports('kpiflagEdit', function (data) {  
13 - var flagId = data.id ? data.id : '';  
14 - var sessions = layui.sessions;  
15 - var accessToken = sessions.getToken().access_token;  
16 - var domainName = common.domainName;  
17 - // 表格数据  
18 - var kpiFlagTableData = [];  
19 - var resTypeTableData = [];  
20 - var appTableData = [];  
21 - var serverTableData = [];  
22 - // 加载遮罩  
23 - var loading;  
24 - // 如果是编辑，回显数据  
25 - var flag = {  
26 - id: '',  
27 - flag: '',  
28 - name: '',  
29 - remark: '',  
30 - bindResTypeCount: 0,  
31 - bindAppCount: 0,  
32 - bindServerCount: 0,  
33 - bindList: []  
34 - };  
35 - if (flagId) {  
36 - $.ajax({  
37 - url: common.domainName + '/api-web/manage/Kpiflag/getByFlagId?access_token=' + accessToken + '&flagId=' + flagId,  
38 - type: 'get',  
39 - success: function (res) {  
40 - flag = res.object;  
41 - form.val('form-flag-edit', res.object);  
42 - kpiFlagTableData = res.data;  
43 - reloadKpiFlagTable();  
44 - }  
45 - });  
46 - admin.req({  
47 - url: domainName + '/api-web/manage/restype/list',  
48 - data: {  
49 - flagId: flagId  
50 - }  
51 - }).done(function (response) {  
52 - resTypeTableData = response.data;  
53 - reloadResTypeTable();  
54 - });  
55 - admin.req({  
56 - url: domainName + '/api-web/manage/application/page',  
57 - data: {  
58 - page: -1,  
59 - limit: -1,  
60 - flagId: flagId  
61 - }  
62 - }).done(function (response) {  
63 - appTableData = response.data;  
64 - reloadAppTable();  
65 - });  
66 - admin.req({  
67 - url: domainName + '/api-web/manage/server/page',  
68 - data: {  
69 - page: -1,  
70 - limit: -1,  
71 - flagId: flagId  
72 - }  
73 - }).done(function (response) {  
74 - serverTableData = response.data;  
75 - reloadServerTable();  
76 - }); 3 + var $ = layui.$;
  4 + var form = layui.form;
  5 + var table = layui.table;
  6 + var common = layui.common;
  7 + var admin = layui.admin;
  8 + var view = layui.view;
  9 + var element = layui.element;
  10 +
  11 + // 对外暴露的接口
  12 + exports('kpiflagEdit', function (data) {
  13 + var flagId = data.id ? data.id : '';
  14 + var sessions = layui.sessions;
  15 + var accessToken = sessions.getToken().access_token;
  16 + var domainName = common.domainName;
  17 + // 表格数据
  18 + var kpiFlagTableData = [];
  19 + var resTypeTableData = [];
  20 + var appTableData = [];
  21 + var serverTableData = [];
  22 + // 加载遮罩
  23 + var loading;
  24 + // 如果是编辑，回显数据
  25 + var flag = {
  26 + id: '',
  27 + flag: '',
  28 + name: '',
  29 + remark: '',
  30 + bindResTypeCount: 0,
  31 + bindAppCount: 0,
  32 + bindServerCount: 0,
  33 + bindList: []
  34 + };
  35 + if (flagId) {
  36 + $.ajax({
  37 + url: common.domainName + '/api-web/manage/Kpiflag/getByFlagId?access_token=' + accessToken + '&flagId=' + flagId,
  38 + type: 'get',
  39 + success: function (res) {
  40 + flag = res.object;
  41 + form.val('form-flag-edit', res.object);
  42 + kpiFlagTableData = res.data;
  43 + reloadKpiFlagTable();
  44 + }
  45 + });
  46 + admin.req({
  47 + url: domainName + '/api-web/manage/restype/list',
  48 + data: {
  49 + flagId: flagId
  50 + }
  51 + }).done(function (response) {
  52 + resTypeTableData = response.data;
  53 + reloadResTypeTable();
  54 + });
  55 + admin.req({
  56 + url: domainName + '/api-web/manage/application/page',
  57 + data: {
  58 + page: -1,
  59 + limit: -1,
  60 + flagId: flagId
77 } 61 }
78 - element.render('collapse'); 62 + }).done(function (response) {
  63 + appTableData = response.data;
  64 + reloadAppTable();
  65 + });
  66 + admin.req({
  67 + url: domainName + '/api-web/manage/server/page',
  68 + data: {
  69 + page: -1,
  70 + limit: -1,
  71 + flagId: flagId
  72 + }
  73 + }).done(function (response) {
  74 + serverTableData = response.data;
  75 + reloadServerTable();
  76 + });
  77 + }
  78 + element.render('collapse');
  79 + form.render();
  80 + // 刷新指标表格
  81 + var kpiflagTable = table.render({
  82 + elem: '#kpiflag-edit-table'
  83 + , cellMinWidth: 80
  84 + , limit: 10
  85 + , even: true
  86 + , data: kpiFlagTableData
  87 + , cols: [[{
  88 + field: 'kpiName', title: '指标名称', align: 'center', templet: function (d) {
  89 + return d.kpi.kpiName
  90 + }
  91 + }, {
  92 + field: 'kpiIdent', title: '指标分类', align: 'center',
  93 + templet: function (d) {
  94 + switch (d.kpi.kpiIdent) {
  95 + case '0':
  96 + return '基本指标';
  97 + case '1':
  98 + return '性能指标';
  99 + case '2':
  100 + return '状态指标';
  101 + case '3':
  102 + return '告警指标';
  103 + default:
  104 + return '';
  105 + }
  106 + }
  107 + },
  108 + {
  109 + title: '唯一标志', align: 'center',
  110 + templet: function (d) {
  111 + var radioDom = $('<input type="checkbox" name="isUnique" data-index="' + (d.LAY_INDEX-1) + '" lay-skin="switch" lay-text="是|否" lay-filter="switchIsUnique">') ;
  112 + var isUnique = kpiFlagTableData[(d.LAY_INDEX-1)].isUnique;
  113 + if (isUnique === '1') { //当是1时，表示时唯一标志
  114 + radioDom.attr('checked', true);
  115 + }else{
  116 + radioDom.attr('checked', false);
  117 + }
  118 + return radioDom.prop('outerHTML');
  119 + }
  120 + },
  121 + {
  122 + title: '排序', align: 'center',
  123 + templet: function (d) {
  124 + var selectDom = $('<select class="defaultSortSel" class="layui-select" data-index="' + (d.LAY_INDEX-1) + '" lay-filter="select-kpiflag-table-isSort">' +
  125 + '<option>无</option>' +
  126 + '<option>正序</option>' +
  127 + '<option>倒序</option>' +
  128 + '</select>');
  129 + var defaultSort = kpiFlagTableData[(d.LAY_INDEX-1)].defaultSort;
  130 + if (defaultSort == 'asc') {
  131 + selectDom.find('option:contains("正序")').attr('selected', 'selected');
  132 + } else if (defaultSort == 'desc') {
  133 + selectDom.find('option:contains("倒序")').attr('selected', 'selected');
  134 + } else {
  135 + selectDom.find('option:contains("无")').attr('selected', 'selected');
  136 + }
  137 + return selectDom.prop('outerHTML');
  138 + }
  139 + }, {
  140 + field: 'sort', title: '列表顺序', align: 'center',
  141 + templet: function (d) {
  142 + var inputDom = $('<input id="txt-kpiflag-table-sort-' + (d.LAY_INDEX-1) + '" data-index="' + (d.LAY_INDEX-1) + '" type="number" autocomplete="off" class="layui-input txt-kpiflag-table-sort">');
  143 + var sort = kpiFlagTableData[(d.LAY_INDEX-1)].sort;
  144 + if (sort != null) {
  145 + inputDom.attr("value", sort);
  146 + }
  147 + return inputDom.prop('outerHTML');
  148 + }
  149 + },
  150 + {field: 'createUser', title: '创建人', align: 'center'},
  151 + {field: 'createTime', title: '创建人', align: 'center'},
  152 + {
  153 + title: '操作',width: 100, align: 'center', templet: '<div><span data-index="{{(d.LAY_INDEX-1)}}" class="link link-kpiflag-delete">' +
  154 + '<a class="layui-btn layui-btn-xs layui-btn-normal" title="删除"><i class="layui-icon"></i></a></span>'
  155 + }]],
  156 + done: function (res, curr, count) {
79 form.render(); 157 form.render();
80 - // 刷新指标表格  
81 - var kpiflagTable = table.render({  
82 - elem: '#kpiflag-edit-table'  
83 - , cellMinWidth: 80  
84 - , limit: 10  
85 - , even: true  
86 - , data: kpiFlagTableData  
87 - , cols: [[{  
88 - field: 'kpiName', title: '指标名称', align: 'center', templet: function (d) {  
89 - return d.kpi.kpiName  
90 - }  
91 - }, {  
92 - field: 'kpiIdent', title: '指标分类', align: 'center',  
93 - templet: function (d) {  
94 - switch (d.kpi.kpiIdent) {  
95 - case '0':  
96 - return '基本指标';  
97 - case '1':  
98 - return '性能指标';  
99 - case '2':  
100 - return '状态指标';  
101 - case '3':  
102 - return '告警指标';  
103 - default:  
104 - return '';  
105 - }  
106 - }  
107 - }, {  
108 - title: '唯一标志', align: 'center',  
109 - templet: function (d) {  
110 - var radioDom = $('<form class="layui-form">' +  
111 - '<div class="layui-form-item layui-form-item-flex"><div class="layui-input-block input-flex-1"><input type="radio" data-index="' + d.LAY_TABLE_INDEX + '" name="isUnique" lay-filter="rdo-kpiflag-table-isUnique"></div></div>' +  
112 - '</form>');  
113 - if (d.isUnique === '1') {  
114 - radioDom.find('input[type="radio"]').attr('checked', true);  
115 - }  
116 - return radioDom.prop('outerHTML');  
117 - }  
118 - }, {  
119 - title: '是否排序指标', align: 'center',  
120 - templet: function (d) {  
121 - var selectDom = $('<select data-index="' + d.LAY_TABLE_INDEX + '" lay-filter="select-kpiflag-table-isSort">' +  
122 - '<option>是</option>' +  
123 - '<option>否</option>' +  
124 - '</select>')  
125 - if (d.sort != '' && d.sort != null) {  
126 - selectDom.find('option:contains("是")').attr('selected', 'selected');  
127 - } else {  
128 - selectDom.find('option:contains("否")').attr('selected', 'selected');  
129 - }  
130 - return selectDom.prop('outerHTML');  
131 - }  
132 - }, {  
133 - field: 'sort', title: '列表顺序', align: 'center',  
134 - templet: function (d) {  
135 - var inputDom = $('<input id="txt-kpiflag-table-sort-' + d.LAY_TABLE_INDEX + '" data-index="' + d.LAY_TABLE_INDEX + '" type="number" autocomplete="off" class="layui-input txt-kpiflag-table-sort">');  
136 - if (d.sort != '' && d.sort != null) {  
137 - inputDom.attr("value", d.sort);  
138 - } else {  
139 - inputDom.attr('disabled', true);  
140 - }  
141 - return inputDom.prop('outerHTML');  
142 - }  
143 - }, {  
144 - title: '操作',  
145 - align: 'center',  
146 - templet: '<div><span data-index="{{d.LAY_TABLE_INDEX}}" class="link link-kpiflag-delete">' +  
147 - '<a class="layui-btn layui-btn-xs layui-btn-normal" title="删除"><i class="layui-icon"></i></a></span>'  
148 - }]],  
149 - done: function (res, curr, count) {  
150 - form.render();  
151 - // 是否排序下拉框改变事件  
152 - form.on('select(select-kpiflag-table-isSort)', function (data) {  
153 - var index = $(data.elem).data('index');  
154 - if (data.value === '是') {  
155 - $('#txt-kpiflag-table-sort-' + index).attr('disabled', false);  
156 - } else {  
157 - kpiFlagTableData[index].sort = '';  
158 - $('#txt-kpiflag-table-sort-' + index).val('');  
159 - $('#txt-kpiflag-table-sort-' + index).attr('disabled', true);  
160 - }  
161 - });  
162 - // radio选择事件  
163 - form.on('radio(rdo-kpiflag-table-isUnique)', function (data) {  
164 - for (var i = 0; i < kpiFlagTableData.length; i++) {  
165 - kpiFlagTableData[i].isUnique = '0';  
166 - }  
167 - kpiFlagTableData[$(data.elem).data('index')].isUnique = '1';  
168 - });  
169 - // 排序输入框输入事件  
170 - $('.txt-kpiflag-table-sort').change(function () {  
171 - kpiFlagTableData[$(this).data('index')].sort = $(this).val();  
172 - });  
173 - // 删除事件  
174 - $('.link-kpiflag-delete').click(function () {  
175 - kpiFlagTableData.splice($(this).data('index'), 1);  
176 - reloadKpiFlagTable();  
177 - });  
178 - } 158 + $(".kpiflag-edit-table .layui-table-body,.kpiflag-edit-table .layui-table-box,.kpiflag-edit-table .layui-table-cell").css('overflow', 'visible');
  159 + // 排序下拉框改变事件
  160 + form.on('select(select-kpiflag-table-isSort)', function (data) {
  161 + var index = $(data.elem).data('index');
  162 + var defaultSort = 'none';
  163 + if (data.value === '正序') {
  164 + defaultSort = 'asc';
  165 + } else if (data.value === '倒序') {
  166 + defaultSort = 'desc';
  167 + }
  168 + kpiFlagTableData[index].defaultSort = defaultSort;
179 }); 169 });
180 - // 资源类型绑定表格  
181 - var resTypeBindTable = table.render({  
182 - elem: '#table-flag-bind-retype'  
183 - , cellMinWidth: 80  
184 - , limit: 9999  
185 - , even: true  
186 - , data: resTypeTableData  
187 - , page: {  
188 - layout: ['count', 'prev', 'page', 'next', 'limit', 'skip'],  
189 - theme: '#1E9FFF'  
190 - }  
191 - , cols: [[{  
192 - field: 'resTypeName', title: '名称', align: 'center', sort: true, width: '280'  
193 - }, {  
194 - field: 'resTypeCode', title: '编码', align: 'center', sort: true, width: '390'  
195 - }, {  
196 - field: 'resTypeDesc', title: '类别', align: 'center', sort: true, width: '280'  
197 - }, {  
198 - field: 'createTime', title: '创建时间', align: 'center', sort: true, width: '275'  
199 - }, {  
200 - title: '操作', align: 'center', fixed: 'right', width: '170',  
201 - toolbar:  
202 - '<div>' +  
203 - ' <span data-index="{{d.LAY_TABLE_INDEX}}" class="layui-btn layui-btn-xs layui-btn-normal btn-flag-bind-restype-delete" title="取消绑定">' +  
204 - '<i class="layui-icon layui-icon-unlink"></i></span>' +  
205 - '</div>'  
206 - }]],  
207 - done: function (res, curr, count) {  
208 - $('.btn-flag-bind-restype-delete').click(function () {  
209 - resTypeTableData.splice($(this).data('index'), 1);  
210 - reloadResTypeTable();  
211 - });  
212 - } 170 + //唯一标志开关事件
  171 + form.on('switch(switchIsUnique)', function(data){
  172 + if (this.checked){
  173 + kpiFlagTableData[$(data.elem).data('index')].isUnique = '1';
  174 + }else{
  175 + kpiFlagTableData[$(data.elem).data('index')].isUnique = '0';
  176 + }
213 }); 177 });
214 -  
215 - // 应用绑定表格  
216 - var appBindTable = table.render({  
217 - elem: '#table-flag-bind-app'  
218 - , cellMinWidth: 80  
219 - , limit: 9999  
220 - , even: true  
221 - , data: []  
222 - , page: {  
223 - layout: ['count', 'prev', 'page', 'next', 'limit', 'skip'],  
224 - theme: '#1E9FFF'  
225 - }  
226 - , cols: [[{  
227 - field: 'appCode', title: '应用编号', align: 'center', sort: true, width: '240'  
228 - }, {  
229 - field: 'appName', title: '应用名称', align: 'center', sort: true, width: '240'  
230 - }, {  
231 - field: 'busTypeName', title: '所属业务', align: 'center', sort: true, width: '193',  
232 - templet: function (d) {  
233 - return d.busType.busTypeName;  
234 - }  
235 - }, {  
236 - field: 'appDesc', title: '应用描述', align: 'center', sort: true, width: '340'  
237 - }, {  
238 - field: 'createTime', title: '创建时间', align: 'center', sort: true, width: '190'  
239 - }, {  
240 - title: '操作', align: 'center', fixed: 'right', width: '190',  
241 - toolbar:  
242 - '<div>' +  
243 - ' <span data-index="{{d.LAY_TABLE_INDEX}}" class="layui-btn layui-btn-xs layui-btn-normal btn-flag-bind-app-delete" title="取消绑定">' +  
244 - '<i class="layui-icon layui-icon-unlink"></i></span>' +  
245 - '</div>'  
246 - }]],  
247 - done: function (res, curr, count) {  
248 - $('.btn-flag-bind-app-delete').click(function () {  
249 - appTableData.splice($(this).data('index'), 1);  
250 - reloadAppTable();  
251 - });  
252 - } 178 + // 排序输入框输入事件
  179 + $('.txt-kpiflag-table-sort').change(function () {
  180 + kpiFlagTableData[$(this).data('index')].sort = $(this).val();
253 }); 181 });
254 -  
255 - // 服务绑定表格  
256 - var serverBindTable = table.render({  
257 - elem: '#table-flag-bind-server'  
258 - , cellMinWidth: 80  
259 - , limit: 9999  
260 - , even: true  
261 - , data: []  
262 - , page: {  
263 - layout: ['count', 'prev', 'page', 'next', 'limit', 'skip'],  
264 - theme: '#1E9FFF'  
265 - }  
266 - , cols: [[{  
267 - field: 'serverCode', title: '服务编号', align: 'center', sort: true, width: '190'  
268 - }, {  
269 - field: 'serverName', title: '服务名称', align: 'center', sort: true, width: '190'  
270 - }, {  
271 - field: 'busTypeName', title: '所属业务', align: 'center', sort: true, width: '190',  
272 - templet: function (d) {  
273 - return d.application.busType.busTypeName;  
274 - }  
275 - }, {  
276 - field: 'appName', title: '所属应用', align: 'center', sort: true, width: '190',  
277 - templet: function (d) {  
278 - return d.application.appName;  
279 - }  
280 - }, {  
281 - field: 'serverDesc', title: '服务描述', align: 'center', sort: true, width: '300'  
282 - }, {  
283 - field: 'createTime', title: '创建时间', align: 'center', sort: true, width: '160'  
284 - }, {  
285 - title: '操作', align: 'center', fixed: 'right', width: '173',  
286 - toolbar:  
287 - '<div>' +  
288 - ' <span data-index="{{d.LAY_TABLE_INDEX}}" class="layui-btn layui-btn-xs layui-btn-normal btn-flag-bind-server-delete" title="取消绑定">' +  
289 - '<i class="layui-icon layui-icon-unlink"></i></span>' +  
290 - '</div>'  
291 - }]],  
292 - done: function (res, curr, count) {  
293 - $('.btn-flag-bind-server-delete').click(function () {  
294 - serverTableData.splice($(this).data('index'), 1);  
295 - reloadServerTable();  
296 - });  
297 - } 182 + // 删除事件
  183 + $('.link-kpiflag-delete').click(function () {
  184 + kpiFlagTableData.splice($(this).data('index'), 1);
  185 + reloadKpiFlagTable();
298 }); 186 });
299 -  
300 - // 绑定资源类型  
301 - $('#btn-kpi-flag-restype-bind').click(function () {  
302 - //先关闭已经打开的资源类型页签  
303 - $('[lay-id="/baseconfig/resourcetype/index"]').find('.layui-tab-close').trigger('click');  
304 - var resourcetype = layui.resourcetype();  
305 - common.openWin('/baseconfig/resourcetype/index', '选择资源类型', {}, ['选择', '取消'], function () {  
306 - var checks = resourcetype.getResTypeChecks();  
307 - $.each(checks, function (index, value) {  
308 - var flag = true;  
309 - $.each(resTypeTableData, function (i, v) {  
310 - if (value.resTypeId === v.resTypeId) {  
311 - flag = false;  
312 - return;  
313 - }  
314 - });  
315 - if (flag) {  
316 - resTypeTableData.push(value);  
317 - }  
318 - });  
319 - reloadResTypeTable();  
320 - return true;  
321 - }, null, ['90%', '90%']) 187 + }
  188 + });
  189 + // 资源类型绑定表格
  190 + var resTypeBindTable = table.render({
  191 + elem: '#table-flag-bind-retype'
  192 + , cellMinWidth: 80
  193 + , limit: 9999
  194 + , even: true
  195 + , data: resTypeTableData
  196 + , page: {
  197 + layout: ['count', 'prev', 'page', 'next', 'limit', 'skip'],
  198 + theme: '#1E9FFF'
  199 + }
  200 + , cols: [[{
  201 + field: 'resTypeName', title: '名称', align: 'center', sort: true
  202 + }, {
  203 + field: 'resTypeCode', title: '编码', align: 'center', sort: true
  204 + }, {
  205 + field: 'resTypeDesc', title: '类别', align: 'center', sort: true
  206 + }, {
  207 + field: 'createTime', title: '创建时间', align: 'center', sort: true
  208 + }, {
  209 + title: '操作', align: 'center', fixed: 'right', width: '170',
  210 + toolbar:
  211 + '<div>' +
  212 + ' <span data-index="{{d.LAY_TABLE_INDEX}}" class="layui-btn layui-btn-xs layui-btn-normal btn-flag-bind-restype-delete" title="取消绑定">' +
  213 + '<i class="layui-icon layui-icon-unlink"></i></span>' +
  214 + '</div>'
  215 + }]],
  216 + done: function (res, curr, count) {
  217 + $('.btn-flag-bind-restype-delete').click(function () {
  218 + resTypeTableData.splice($(this).data('index'), 1);
  219 + reloadResTypeTable();
322 }); 220 });
  221 + }
  222 + });
323 223
324 - // 绑定应用  
325 - $('#btn-kpi-flag-app-bind').click(function () {  
326 - //先关闭已经打开的应用页签  
327 - $('[lay-id="/baseconfig/application/index"]').find('.layui-tab-close').trigger('click');  
328 - common.openWin('/baseconfig/application/index', '选择应用', {}, ['选择', '取消'], function () {  
329 - var checks = table.checkStatus('application-table').data;  
330 - $.each(checks, function (index, value) {  
331 - var flag = true;  
332 - $.each(appTableData, function (i, v) {  
333 - if (value.appId === v.appId) {  
334 - flag = false;  
335 - return;  
336 - }  
337 - });  
338 - if (flag) {  
339 - appTableData.push(value);  
340 - }  
341 - });  
342 - reloadAppTable();  
343 - return true;  
344 - }, null, ['1500px', '90%']) 224 + // 应用绑定表格
  225 + var appBindTable = table.render({
  226 + elem: '#table-flag-bind-app'
  227 + , cellMinWidth: 80
  228 + , limit: 9999
  229 + , even: true
  230 + , data: []
  231 + , page: {
  232 + layout: ['count', 'prev', 'page', 'next', 'limit', 'skip'],
  233 + theme: '#1E9FFF'
  234 + }
  235 + , cols: [[{
  236 + field: 'appCode', title: '应用编号', align: 'center', sort: true, width: '240'
  237 + }, {
  238 + field: 'appName', title: '应用名称', align: 'center', sort: true, width: '240'
  239 + }, {
  240 + field: 'busTypeName', title: '所属业务', align: 'center', sort: true, width: '193',
  241 + templet: function (d) {
  242 + return d.busType.busTypeName;
  243 + }
  244 + }, {
  245 + field: 'appDesc', title: '应用描述', align: 'center', sort: true, width: '340'
  246 + }, {
  247 + field: 'createTime', title: '创建时间', align: 'center', sort: true, width: '190'
  248 + }, {
  249 + title: '操作', align: 'center', fixed: 'right', width: '190',
  250 + toolbar:
  251 + '<div>' +
  252 + ' <span data-index="{{d.LAY_TABLE_INDEX}}" class="layui-btn layui-btn-xs layui-btn-normal btn-flag-bind-app-delete" title="取消绑定">' +
  253 + '<i class="layui-icon layui-icon-unlink"></i></span>' +
  254 + '</div>'
  255 + }]],
  256 + done: function (res, curr, count) {
  257 + $('.btn-flag-bind-app-delete').click(function () {
  258 + appTableData.splice($(this).data('index'), 1);
  259 + reloadAppTable();
345 }); 260 });
  261 + }
  262 + });
  263 +
  264 + // 服务绑定表格
  265 + var serverBindTable = table.render({
  266 + elem: '#table-flag-bind-server'
  267 + , cellMinWidth: 80
  268 + , limit: 9999
  269 + , even: true
  270 + , data: []
  271 + , page: {
  272 + layout: ['count', 'prev', 'page', 'next', 'limit', 'skip'],
  273 + theme: '#1E9FFF'
  274 + }
  275 + , cols: [[{
  276 + field: 'serverCode', title: '服务编号', align: 'center', sort: true, width: '190'
  277 + }, {
  278 + field: 'serverName', title: '服务名称', align: 'center', sort: true, width: '190'
  279 + }, {
  280 + field: 'busTypeName', title: '所属业务', align: 'center', sort: true, width: '190',
  281 + templet: function (d) {
  282 + return d.application.busType.busTypeName;
  283 + }
  284 + }, {
  285 + field: 'appName', title: '所属应用', align: 'center', sort: true, width: '190',
  286 + templet: function (d) {
  287 + return d.application.appName;
  288 + }
  289 + }, {
  290 + field: 'serverDesc', title: '服务描述', align: 'center', sort: true, width: '300'
  291 + }, {
  292 + field: 'createTime', title: '创建时间', align: 'center', sort: true, width: '160'
  293 + }, {
  294 + title: '操作', align: 'center', fixed: 'right', width: '173',
  295 + toolbar:
  296 + '<div>' +
  297 + ' <span data-index="{{d.LAY_TABLE_INDEX}}" class="layui-btn layui-btn-xs layui-btn-normal btn-flag-bind-server-delete" title="取消绑定">' +
  298 + '<i class="layui-icon layui-icon-unlink"></i></span>' +
  299 + '</div>'
  300 + }]],
  301 + done: function (res, curr, count) {
  302 + $('.btn-flag-bind-server-delete').click(function () {
  303 + serverTableData.splice($(this).data('index'), 1);
  304 + reloadServerTable();
  305 + });
  306 + }
  307 + });
346 308
347 - // 绑定服务  
348 - $('#btn-kpi-flag-server-bind').click(function () {  
349 - //先关闭已经打开的应用页签  
350 - $('[lay-id="/baseconfig/server/index"]').find('.layui-tab-close').trigger('click');  
351 - common.openWin('/baseconfig/server/index', '选择服务', {}, ['选择', '取消'], function () {  
352 - var checks = table.checkStatus('server-table').data;  
353 - $.each(checks, function (index, value) {  
354 - var flag = true;  
355 - $.each(serverTableData, function (i, v) {  
356 - if (value.serverId === v.serverId) {  
357 - flag = false;  
358 - return;  
359 - }  
360 - });  
361 - if (flag) {  
362 - serverTableData.push(value);  
363 - }  
364 - });  
365 - reloadServerTable();  
366 - return true;  
367 - }, null, ['1500px', '90%']) 309 + // 绑定资源类型
  310 + $('#btn-kpi-flag-restype-bind').click(function () {
  311 + //先关闭已经打开的资源类型页签
  312 + $('[lay-id="/baseconfig/resourcetype/index"]').find('.layui-tab-close').trigger('click');
  313 + var resourcetype = layui.resourcetype();
  314 + common.openWin('/baseconfig/resourcetype/index', '选择资源类型', {}, ['选择', '取消'], function () {
  315 + var checks = resourcetype.getResTypeChecks();
  316 + $.each(checks, function (index, value) {
  317 + var flag = true;
  318 + $.each(resTypeTableData, function (i, v) {
  319 + if (value.resTypeId === v.resTypeId) {
  320 + flag = false;
  321 + return;
  322 + }
  323 + });
  324 + if (flag) {
  325 + // value.createUser = form.val('form-flag-edit').createUser;
  326 + // value.createTime = common.getToday('');
  327 + resTypeTableData.push(value);
  328 + }
  329 + });
  330 + reloadResTypeTable();
  331 + return true;
  332 + }, null, ['90%', '90%'])
  333 + });
  334 +
  335 + // 绑定应用
  336 + $('#btn-kpi-flag-app-bind').click(function () {
  337 + //先关闭已经打开的应用页签
  338 + $('[lay-id="/baseconfig/application/index"]').find('.layui-tab-close').trigger('click');
  339 + common.openWin('/baseconfig/application/index', '选择应用', {}, ['选择', '取消'], function () {
  340 + var checks = table.checkStatus('application-table').data;
  341 + $.each(checks, function (index, value) {
  342 + var flag = true;
  343 + $.each(appTableData, function (i, v) {
  344 + if (value.appId === v.appId) {
  345 + flag = false;
  346 + return;
  347 + }
  348 + });
  349 + if (flag) {
  350 + appTableData.push(value);
  351 + }
  352 + });
  353 + reloadAppTable();
  354 + return true;
  355 + }, null, ['1500px', '90%'])
  356 + });
  357 +
  358 + // 绑定服务
  359 + $('#btn-kpi-flag-server-bind').click(function () {
  360 + //先关闭已经打开的应用页签
  361 + $('[lay-id="/baseconfig/server/index"]').find('.layui-tab-close').trigger('click');
  362 + common.openWin('/baseconfig/server/index', '选择服务', {}, ['选择', '取消'], function () {
  363 + var checks = table.checkStatus('server-table').data;
  364 + $.each(checks, function (index, value) {
  365 + var flag = true;
  366 + $.each(serverTableData, function (i, v) {
  367 + if (value.serverId === v.serverId) {
  368 + flag = false;
  369 + return;
  370 + }
  371 + });
  372 + if (flag) {
  373 + serverTableData.push(value);
  374 + }
368 }); 375 });
  376 + reloadServerTable();
  377 + return true;
  378 + }, null, ['1500px', '90%'])
  379 + });
369 380
370 - // 刷新指标表格  
371 - function reloadKpiFlagTable() {  
372 - kpiflagTable.reload({  
373 - page: {curr: 1},  
374 - data: kpiFlagTableData  
375 - });  
376 - } 381 + // 刷新指标表格
  382 + function reloadKpiFlagTable() {
  383 + kpiflagTable.reload({
  384 + page: {curr: 1},
  385 + data: kpiFlagTableData
  386 + });
  387 + }
377 388
378 - // 刷新绑定资源类型表格  
379 - function reloadResTypeTable() {  
380 - $('#txt-flag-bind-resTypeCount').html(resTypeTableData.length);  
381 - resTypeBindTable.reload({  
382 - page: {curr: 1},  
383 - data: resTypeTableData  
384 - });  
385 - } 389 + // 刷新绑定资源类型表格
  390 + function reloadResTypeTable() {
  391 + $('#txt-flag-bind-resTypeCount').html(resTypeTableData.length);
  392 + resTypeBindTable.reload({
  393 + page: {curr: 1},
  394 + data: resTypeTableData
  395 + });
  396 + }
  397 +
  398 + // 刷新绑定应用表格
  399 + function reloadAppTable() {
  400 + $('#txt-flag-bind-appCount').html(appTableData.length);
  401 + appBindTable.reload({
  402 + page: {curr: 1},
  403 + data: appTableData
  404 + });
  405 + }
  406 +
  407 + // 刷新绑定服务表格
  408 + function reloadServerTable() {
  409 + $('#txt-flag-bind-serverCount').html(serverTableData.length);
  410 + serverBindTable.reload({
  411 + page: {curr: 1},
  412 + data: serverTableData
  413 + });
  414 + }
386 415
387 - // 刷新绑定应用表格  
388 - function reloadAppTable() {  
389 - $('#txt-flag-bind-appCount').html(appTableData.length);  
390 - appBindTable.reload({  
391 - page: {curr: 1},  
392 - data: appTableData  
393 - }); 416 + // 表单提交事件
  417 + form.on('submit(form-flag-edit)', function (data) {
  418 + loading = layer.load(2);
  419 + var flag = {
  420 + id: flagId,
  421 + flag: '',
  422 + name: '',
  423 + remark: '',
  424 + dimension: '',
  425 + kpiFlagList: kpiFlagTableData,
  426 + bindList: []
  427 + };
  428 + $.each(resTypeTableData, function (i, v) {
  429 + flag.bindList.push({
  430 + id: '',
  431 + flagId: '',
  432 + bindId: v.resTypeId,
  433 + bindType: '1',
  434 + bindCode: v.resTypeCode
  435 + });
  436 + });
  437 + $.each(appTableData, function (i, v) {
  438 + flag.bindList.push({
  439 + id: '',
  440 + flagId: '',
  441 + bindId: v.appId,
  442 + bindType: '2'
  443 + });
  444 + });
  445 + $.each(serverTableData, function (i, v) {
  446 + flag.bindList.push({
  447 + id: '',
  448 + flagId: '',
  449 + bindId: v.serverId,
  450 + bindType: '3'
  451 + });
  452 + });
  453 + Object.assign(flag, form.val('form-flag-edit'));
  454 + admin.req({
  455 + url: common.domainName + '/api-web/manage/Kpiflag/saveFlag?access_token=' + accessToken,
  456 + type: 'POST',
  457 + contentType: 'application/json',
  458 + data: JSON.stringify(flag),
  459 + error: function () {
  460 + layer.close(loading);
394 } 461 }
395 -  
396 - // 刷新绑定服务表格  
397 - function reloadServerTable() {  
398 - $('#txt-flag-bind-serverCount').html(serverTableData.length);  
399 - serverBindTable.reload({  
400 - page: {curr: 1},  
401 - data: serverTableData  
402 - }); 462 + }).done(function (response) {
  463 + layer.close(loading);
  464 + if (response.success) {
  465 + layer.msg('保存成功', {icon: 1, timeout: 3000});
  466 + layer.closeAll('page');
  467 + table.reload('kpiflag_table', {
  468 + page: {
  469 + curr: 1
  470 + }
  471 + , where: {
  472 + access_token: accessToken,
  473 + keyWord: $("#kpiflag_keyword").val(),
  474 + dimension: $('select[name="dimension"]').val()
  475 + }
  476 + });
  477 + } else {
  478 + layer.msg('保存失败', {icon: 2, timeout: 3000});
403 } 479 }
  480 + });
  481 + return false;
  482 + });
404 483
405 - // 表单提交事件  
406 - form.on('submit(form-flag-edit)', function (data) {  
407 - loading = layer.load(2);  
408 - var flag = {  
409 - id: flagId,  
410 - flag: '',  
411 - name: '',  
412 - remark: '',  
413 - kpiFlagList: kpiFlagTableData,  
414 - bindList: []  
415 - };  
416 - $.each(resTypeTableData, function (i, v) {  
417 - flag.bindList.push({  
418 - id: '',  
419 - flagId: '',  
420 - bindId: v.resTypeId,  
421 - bindType: '1'  
422 - });  
423 - });  
424 - $.each(appTableData, function (i, v) {  
425 - flag.bindList.push({  
426 - id: '',  
427 - flagId: '',  
428 - bindId: v.appId,  
429 - bindType: '2'  
430 - });  
431 - });  
432 - $.each(serverTableData, function (i, v) {  
433 - flag.bindList.push({  
434 - id: '',  
435 - flagId: '',  
436 - bindId: v.serverId,  
437 - bindType: '3'  
438 - });  
439 - });  
440 - Object.assign(flag, form.val('form-flag-edit'));  
441 - admin.req({  
442 - url: common.domainName + '/api-web/manage/Kpiflag/saveFlag?access_token=' + accessToken,  
443 - type: 'POST',  
444 - contentType: 'application/json',  
445 - data: JSON.stringify(flag),  
446 - error: function () {  
447 - layer.close(loading);  
448 - }  
449 - }).done(function (response) {  
450 - layer.close(loading);  
451 - if (response.success) {  
452 - layer.msg('保存成功', {icon: 1, timeout: 3000});  
453 - layer.closeAll('page');  
454 - table.reload('kpiflag_table', {  
455 - page: {  
456 - curr: 1  
457 - }  
458 - , where: {  
459 - access_token: accessToken,  
460 - keyWord: $("#kpiflag_keyword").val(),  
461 - }  
462 - });  
463 - } else {  
464 - layer.msg('保存失败', {icon: 2, timeout: 3000}); 484 + // 选择指标
  485 + $('#btn-kpiflag-kpi-bind').click(function () {
  486 + $('[lay-id="/baseconfig/kpi/index"]').find('.layui-tab-close').trigger('click');
  487 + layer.open({
  488 + title: '选择指标',
  489 + id: 'kpiIndexChooseHtml',
  490 + type: 1,
  491 + area: ['90%', '800px'],
  492 + btn: ['确定', '取消'],
  493 + scrollbar: true,
  494 + success: function () {
  495 + view(this.id).render('/baseconfig/kpi/index', {});
  496 + },
  497 + yes: function (index, layero) {
  498 + var kpiIndex = layui.kpiIndex({});
  499 + var data = kpiIndex.getData();
  500 + if (data.length > 0) {
  501 + $.each(data, function (i, e) {
  502 + var flag = true;
  503 + $.each(kpiFlagTableData, function (j, k) {
  504 + if (e.kpiId == k.kpiId) {
  505 + flag = false;
465 } 506 }
  507 + });
  508 + if (flag == true) {
  509 + kpiFlagTableData.push({
  510 + id: '',
  511 + flagId: flagId,
  512 + kpiId: e.kpiId,
  513 + defaultSort: e.defaultSort,
  514 + kpi: {
  515 + kpiId: e.kpiId,
  516 + kpiName: e.kpiName,
  517 + kpiIdent: e.kpiIdent
  518 + },
  519 + isUnique: '0',
  520 + sort: i,
  521 + createUser: form.val('form-flag-edit').createUser,
  522 + createTime: common.getToday('')
  523 + });
  524 + }
466 }); 525 });
  526 + layer.close(index);
  527 + reloadKpiFlagTable();
  528 + } else {
  529 + layer.msg("无选中的数据", {offset: '15px', icon: 7, time: 2000})
467 return false; 530 return false;
468 - });  
469 -  
470 - // 选择指标  
471 - $('#btn-kpiflag-kpi-bind').click(function () {  
472 - $('[lay-id="/baseconfig/kpi/index"]').find('.layui-tab-close').trigger('click');  
473 - layer.open({  
474 - title: '选择指标',  
475 - id: 'kpiIndexChooseHtml',  
476 - type: 1,  
477 - area: ['90%', '800px'],  
478 - btn: ['确定', '取消'],  
479 - scrollbar: true,  
480 - success: function () {  
481 - view(this.id).render('/baseconfig/kpi/index', {});  
482 - },  
483 - yes: function (index, layero) {  
484 - var kpiIndex = layui.kpiIndex({});  
485 - var data = kpiIndex.getData();  
486 - if (data.length > 0) {  
487 - $.each(data, function (i, e) {  
488 - var flag = true;  
489 - $.each(kpiFlagTableData, function (j, k) {  
490 - if (e.kpiId == k.kpiId) {  
491 - flag = false;  
492 - }  
493 - });  
494 - if (flag == true) {  
495 - kpiFlagTableData.push({  
496 - id: '',  
497 - flagId: flagId,  
498 - kpiId: e.kpiId,  
499 - kpi: {  
500 - kpiId: e.kpiId,  
501 - kpiName: e.kpiName,  
502 - kpiIdent: e.kpiIdent  
503 - },  
504 - isUnique: '0',  
505 - sort: ''  
506 - });  
507 - }  
508 - });  
509 - layer.close(index);  
510 - reloadKpiFlagTable();  
511 - } else {  
512 - layer.msg("无选中的数据", {offset: '15px', icon: 7, time: 2000})  
513 - return false;  
514 - }  
515 - }  
516 - });  
517 - form.render();  
518 - }); 531 + }
  532 + }
  533 + });
  534 + form.render();
519 }); 535 });
520 -}); 536 + });
  537 +});
@@ -66,12 +66,13 @@ layui.define(['table', 'form', 'admin', 'layer', 'common', 'sessions', "commonDe @@ -66,12 +66,13 @@ layui.define(['table', 'form', 'admin', 'layer', 'common', 'sessions', "commonDe
66 {type: 'checkbox'} 66 {type: 'checkbox'}
67 , {field: 'index', title: '序号', align: 'center', type: 'numbers'} 67 , {field: 'index', title: '序号', align: 'center', type: 'numbers'}
68 , { 68 , {
69 - field: 'name', title: '名称', align: 'center', sort: true, 69 + field: 'name', title: '名称', align: 'center', sort: true,width: 200,
70 templet: '<div>' + 70 templet: '<div>' +
71 '<span kpiflag-data-edit="{{d.id}}" data-flag="{{d.flag}}" class="layui-table-link">{{d.name}}</span>' + 71 '<span kpiflag-data-edit="{{d.id}}" data-flag="{{d.flag}}" class="layui-table-link">{{d.name}}</span>' +
72 '</div>' 72 '</div>'
73 } 73 }
74 - , {field: 'flag', title: '标识', align: 'center', sort: true} 74 + , {field: 'flag', title: '标识', align: 'center', sort: true,width: 200}
  75 + , {field: 'describes', title: '指标组描述', align: 'left',width: 300}
75 , { field: 'dimension', title: '维度', align: 'center', width: 80, templet: ` 76 , { field: 'dimension', title: '维度', align: 'center', width: 80, templet: `
76 <div> 77 <div>
77 {{# 78 {{#
@@ -84,11 +85,11 @@ layui.define(['table', 'form', 'admin', 'layer', 'common', 'sessions', "commonDe @@ -84,11 +85,11 @@ layui.define(['table', 'form', 'admin', 'layer', 'common', 'sessions', "commonDe
84 </div> 85 </div>
85 ` 86 `
86 } 87 }
87 - , {field: 'kpis', title: '绑定指标', align: 'left'}  
88 - , {field: 'restypes', title: '绑定资源类型', align: 'left'} 88 + , {field: 'kpis', title: '绑定指标', align: 'left',width: 500}
  89 + , {field: 'restypes', title: '绑定资源类型', align: 'left',width: 300}
89 , {field: 'createUser', title: '创建人',width: 100, align: 'center'} 90 , {field: 'createUser', title: '创建人',width: 100, align: 'center'}
90 - , {field: 'createTime', title: '创建时间', align: 'center'}  
91 - , {field: 'remark', title: '备注', align: 'left'} 91 + , {field: 'createTime', title: '创建时间', align: 'center',width: 180}
  92 + , {field: 'remark', title: '备注', align: 'left',width: 500}
92 , { 93 , {
93 title: '操作', 94 title: '操作',
94 align: 'center', 95 align: 'center',
1 <article> 1 <article>
2 - <form action="" class="layui-form layui-form-pane" lay-filter="form-flag-edit">  
3 - <fieldset class="layui-elem-field layui-field-title">  
4 - <legend>基本信息</legend>  
5 - </fieldset>  
6 - <div class="layui-form-item">  
7 - <div class="inline-half layui-inline ">  
8 - <label class="layui-form-label">编码</label>  
9 - <div class="layui-input-inline">  
10 - <input class="layui-input" lay-verify="required" name="flag" placeholder="请输入编码" type="text">  
11 - </div>  
12 - </div>  
13 - <div class="inline-half layui-inline">  
14 - <label class="layui-form-label">名称</label>  
15 - <div class="layui-input-inline">  
16 - <input class="layui-input" lay-verify="required" name="name" placeholder="请输入名称" required  
17 - type="text">  
18 - </div>  
19 - </div> 2 + <form class="layui-form layui-form-pane" action="" lay-filter="form-flag-edit">
  3 + <fieldset class="layui-elem-field layui-field-title">
  4 + <legend>基本信息</legend>
  5 + </fieldset>
  6 + <div class="layui-form-item">
  7 + <div class="inline-half layui-inline ">
  8 + <label class="layui-form-label">编码<span style="color: red">*</span></label>
  9 + <div class="layui-input-inline">
  10 + <input type="text" name="flag" lay-verify="required" placeholder="请输入编码" class="layui-input">
20 </div> 11 </div>
21 - <div class="layui-form-item">  
22 - <label class="layui-form-label textarea-label">说明</label>  
23 - <div class="layui-input-block">  
24 - <textarea class="layui-textarea" name="remark" placeholder="请输入说明"></textarea>  
25 - </div> 12 + </div>
  13 + <div class="inline-half layui-inline">
  14 + <label class="layui-form-label">维度<span style="color: red">*</span></label>
  15 + <div class="layui-input-inline">
  16 + <select name="dimension" lay-verify="required" class="layui-select">
  17 + <option value="">=选择维度=</option>
  18 + <option value="1D">一维</option>
  19 + <option value="2D">二维</option>
  20 + </select>
26 </div> 21 </div>
27 - <button class="hide" id="btn-kpiflag-submit" lay-filter="kpi-flag-submit" lay-submit>提交</button>  
28 - </form>  
29 - <form class="layui-form layui-form-pane" onsubmit="return false">  
30 - <fieldset class="layui-elem-field layui-field-title">  
31 - <legend>绑定指标&nbsp;&nbsp;  
32 - <button class="layui-btn layui-btn-xs layui-btn-normal fieldset-btn" id="btn-kpiflag-kpi-bind"><i  
33 - class="layui-icon">&#xe624;</i></button>  
34 - </legend>  
35 - </fieldset>  
36 - <div class="layui-form-item layui-form-item-flex">  
37 - <table class="input-flex-1" id="kpiflag-edit-table"></table> 22 + </div>
  23 + </div>
  24 + <div class="layui-form-item">
  25 + <div class="inline-half layui-inline">
  26 + <label class="layui-form-label">名称<span style="color: red">*</span></label>
  27 + <div class="layui-input-inline">
  28 + <input type="text" name="name" required lay-verify="required" placeholder="请输入名称" class="layui-input">
38 </div> 29 </div>
39 - <div class="layui-form-item layui-form-item-flex hide">  
40 - <div class="layui-input-block input-flex-1">  
41 - <input name="chartType" title="列表" type="radio" value="">  
42 - <input name="chartType" title="折线图" type="radio" value="">  
43 - <input name="chartType" title="柱状图" type="radio" value="">  
44 - <input name="chartType" title="饼图" type="radio" value="">  
45 - </div> 30 + </div>
  31 + <div class="inline-half layui-inline">
  32 + <label class="layui-form-label">描述<span style="color: red">*</span></label>
  33 + <div class="layui-input-inline">
  34 + <input type="text" name="describes" required lay-verify="required" placeholder="请输入名称" class="layui-input">
46 </div> 35 </div>
47 - <div class="layui-form-item">  
48 - <div class="layui-inline">  
49 - <button class="layui-btn layui-btn-sm layui-btn-normal" id="btn-kpi-flag-restype-bind"><i  
50 - class="layui-icon">&#xe654;</i>绑定到资源类型  
51 - </button>  
52 - </div>  
53 - <div class="layui-inline">  
54 - <button class="layui-btn layui-btn-sm layui-btn-normal" id="btn-kpi-flag-app-bind"><i  
55 - class="layui-icon">&#xe654;</i>绑定到应用  
56 - </button>  
57 - </div>  
58 - <div class="layui-inline">  
59 - <button class="layui-btn layui-btn-sm layui-btn-normal" id="btn-kpi-flag-server-bind"><i  
60 - class="layui-icon">&#xe654;</i>绑定到服务  
61 - </button>  
62 - </div> 36 + </div>
  37 + </div>
  38 + <div class="layui-form-item">
  39 + <div class="inline-half layui-inline">
  40 + <label class="layui-form-label">创建人<span style="color: red">*</span></label>
  41 + <div class="layui-input-inline">
  42 + <input type="text" name="createUser" required lay-verify="required" placeholder="请输入创建人" class="layui-input">
63 </div> 43 </div>
64 - </form>  
65 - <form class="layui-form layui-form-pane" onsubmit="return false">  
66 - <fieldset class="layui-elem-field layui-field-title">  
67 - <legend>绑定信息</legend>  
68 - </fieldset>  
69 - <div class="layui-collapse" id="div-flag-bind">  
70 - <div class="layui-colla-item flex-1">  
71 - <h2 class="layui-colla-title">绑定的资源类型&nbsp;&nbsp;数量：<span id="txt-flag-bind-resTypeCount">0</span></h2>  
72 - <div class="layui-colla-content">  
73 - <table id="table-flag-bind-retype"></table>  
74 - </div>  
75 - </div>  
76 - <div class="layui-colla-item">  
77 - <h2 class="layui-colla-title">绑定的应用&nbsp;&nbsp;数量：<span id="txt-flag-bind-appCount">0</span></h2>  
78 - <div class="layui-colla-content">  
79 - <table id="table-flag-bind-app"></table>  
80 - </div>  
81 - </div>  
82 - <div class="layui-colla-item">  
83 - <h2 class="layui-colla-title">绑定的服务&nbsp;&nbsp;数量：<span id="txt-flag-bind-serverCount">0</span></h2>  
84 - <div class="layui-colla-content">  
85 - <table id="table-flag-bind-server"></table>  
86 - </div>  
87 - </div> 44 + </div>
  45 + <div class="inline-half layui-inline">
  46 + <label class="layui-form-label">创建时间</label>
  47 + <div class="layui-input-inline">
  48 + <input type="text" name="createTime" required lay-verify="required" disabled placeholder="请输入创建人" class="layui-input">
88 </div> 49 </div>
89 - </form> 50 + </div>
  51 + </div>
  52 + <div class="layui-form-item">
  53 + <label class="layui-form-label textarea-label">说明</label>
  54 + <div class="layui-input-block">
  55 + <textarea name="remark" placeholder="请输入说明" class="layui-textarea"></textarea>
  56 + </div>
  57 + </div>
  58 + <button id="btn-kpiflag-submit" class="hide" lay-submit lay-filter="kpi-flag-submit">提交</button>
  59 + </form>
  60 + <form class="layui-form layui-form-pane" onsubmit="return false">
  61 + <fieldset class="layui-elem-field layui-field-title">
  62 + <legend>绑定指标&nbsp;&nbsp;
  63 + <button class="layui-btn layui-btn-xs layui-btn-normal fieldset-btn" id="btn-kpiflag-kpi-bind"><i class="layui-icon">&#xe624;</i></button>
  64 + </legend>
  65 + </fieldset>
  66 + <div class="layui-form-item layui-form-item-flex kpiflag-edit-table">
  67 + <table id="kpiflag-edit-table" class="input-flex-1"></table>
  68 + </div>
  69 + <div class="layui-form-item layui-form-item-flex hide">
  70 + <div class="layui-input-block input-flex-1">
  71 + <input type="radio" name="chartType" value="" title="列表">
  72 + <input type="radio" name="chartType" value="" title="折线图">
  73 + <input type="radio" name="chartType" value="" title="柱状图">
  74 + <input type="radio" name="chartType" value="" title="饼图">
  75 + </div>
  76 + </div>
  77 + <div class="layui-form-item">
  78 + <div class="layui-inline">
  79 + <button class="layui-btn layui-btn-sm layui-btn-normal" id="btn-kpi-flag-restype-bind"><i class="layui-icon">&#xe654;</i>绑定到资源类型</button>
  80 + </div>
  81 + <div class="layui-inline">
  82 + <button class="layui-btn layui-btn-sm layui-btn-normal" id="btn-kpi-flag-app-bind"><i class="layui-icon">&#xe654;</i>绑定到应用</button>
  83 + </div>
  84 + <div class="layui-inline">
  85 + <button class="layui-btn layui-btn-sm layui-btn-normal" id="btn-kpi-flag-server-bind"><i class="layui-icon">&#xe654;</i>绑定到服务</button>
  86 + </div>
  87 + </div>
  88 + </form>
  89 + <form class="layui-form layui-form-pane" onsubmit="return false">
  90 + <fieldset class="layui-elem-field layui-field-title">
  91 + <legend>绑定信息</legend>
  92 + </fieldset>
  93 + <div class="layui-collapse" id="div-flag-bind">
  94 + <div class="layui-colla-item flex-1">
  95 + <h2 class="layui-colla-title">绑定的资源类型&nbsp;&nbsp;数量：<span id="txt-flag-bind-resTypeCount">0</span></h2>
  96 + <div class="layui-colla-content">
  97 + <table id="table-flag-bind-retype"></table>
  98 + </div>
  99 + </div>
  100 + <div class="layui-colla-item">
  101 + <h2 class="layui-colla-title">绑定的应用&nbsp;&nbsp;数量：<span id="txt-flag-bind-appCount">0</span></h2>
  102 + <div class="layui-colla-content">
  103 + <table id="table-flag-bind-app"></table>
  104 + </div>
  105 + </div>
  106 + <div class="layui-colla-item">
  107 + <h2 class="layui-colla-title">绑定的服务&nbsp;&nbsp;数量：<span id="txt-flag-bind-serverCount">0</span></h2>
  108 + <div class="layui-colla-content">
  109 + <table id="table-flag-bind-server"></table>
  110 + </div>
  111 + </div>
  112 + </div>
  113 + </form>
90 </article> 114 </article>
91 <script> 115 <script>
92 - layui.use('kpiflagEdit', function (fn) {  
93 - fn({{ d }});  
94 - });  
95 -</script> 116 + layui.use('kpiflagEdit', function (fn) {
  117 + fn({{d}});
  118 + });
  119 +</script>
@@ -5,16 +5,23 @@ @@ -5,16 +5,23 @@
5 <div class="layui-card"> 5 <div class="layui-card">
6 <div class="layui-card-header"> 6 <div class="layui-card-header">
7 <div class="layui-status"> 7 <div class="layui-status">
8 - <form class="layui-form layui-card-header layuiadmin-card-header-auto"  
9 - lay-filter="kpiflag-form"> 8 + <form class="layui-form layui-card-header layuiadmin-card-header-auto" lay-filter="kpiflag-form">
10 <div class="layui-form-item"> 9 <div class="layui-form-item">
11 <div class="layui-inline"> 10 <div class="layui-inline">
12 <div class="layui-input-inline layui-input-inline--long"> 11 <div class="layui-input-inline layui-input-inline--long">
13 - <input autocomplete="off" class="layui-input" id="kpiflag_keyword"  
14 - lay-tips="关键字检索包含： </br>指标组名称" name="kpiflag_keyword"  
15 - placeholder="输入关键字，回车搜索"  
16 - type="text">  
17 - <input style="display: none" type="text"> 12 + <input type="text" id="kpiflag_keyword" name="kpiflag_keyword" placeholder="输入关键字，回车搜索" autocomplete="off"
  13 + lay-tips="关键字检索包含： </br>指标组名称</br>flag</br>备注</br>绑定资源类型</br>绑定指标"
  14 + class="layui-input">
  15 + <input type="text" style="display: none">
  16 + </div>
  17 + </div>
  18 + <div class="layui-inline">
  19 + <div class="layui-input-inline layui-input-inline--long">
  20 + <select name="dimension" class="layui-select" lay-filter="change">
  21 + <option value="">=选择维度=</option>
  22 + <option value="1D">一维</option>
  23 + <option value="2D">二维</option>
  24 + </select>
18 </div> 25 </div>
19 </div> 26 </div>
20 <button class="layui-btn layui-btn-normal" id="kpiflagQueryBtn" type="button"> 27 <button class="layui-btn layui-btn-normal" id="kpiflagQueryBtn" type="button">
@@ -27,12 +34,8 @@ @@ -27,12 +34,8 @@
27 </div> 34 </div>
28 <div class="layui-card-body"> 35 <div class="layui-card-body">
29 <div class="warn-btns"> 36 <div class="warn-btns">
30 - <button class="layui-btn layui-btn-sm layui-btn-normal" id="addkpiflag" type="button"><i  
31 - class="layui-icon">&#xe654;</i>新增  
32 - </button>  
33 - <button class="layui-btn layui-btn-sm layui-btn-normal" id="delkpiflag" type="button"><i  
34 - class="layui-icon">&#xe640;</i>删除  
35 - </button> 37 + <button id="addkpiflag" type="button" class="layui-btn layui-btn-sm layui-btn-normal"><i class="layui-icon">&#xe654;</i>新增</button>
  38 + <button id="delkpiflag" type="button" class="layui-btn layui-btn-sm layui-btn-normal"><i class="layui-icon">&#xe640;</i>删除</button>
36 </div> 39 </div>
37 <table id="kpiflag_table"></table> 40 <table id="kpiflag_table"></table>
38 </div> 41 </div>
@@ -45,4 +48,4 @@ @@ -45,4 +48,4 @@
45 layui.use('kpiflagIndex', function (fn) { 48 layui.use('kpiflagIndex', function (fn) {
46 fn(); 49 fn();
47 }); 50 });
48 -</script> 51 +</script>