monitor_v3 / hg-monitor-web · Commits

Go to a project

Authored by 王涛
Commit 010c2cb1614154e10e162d059112ca6172ed93e1 2 parents 1ed0f679 3a31d74e

Merge branch 'master-V32-XuHaoJie' into 'master' 

通用-端口侦测-页面优化



See merge request !335
Inline Side-by-side
Showing 9 changed files with 417 additions and 77 deletions
@@ -592,7 +592,7 @@ layui.define(['xmSelect', 'md5'], function (exports) { @@ -592,7 +592,7 @@ layui.define(['xmSelect', 'md5'], function (exports) {
592 } 592 }
593 }, 593 },
594 yes: function (index, layero) { 594 yes: function (index, layero) {
595 - if (fn && fn()) { 595 + if (fn && fn(index)) {
596 layer.close(index); 596 layer.close(index);
597 } 597 }
598 }, 598 },
@@ -480,18 +480,18 @@ layui.define(['common', 'tree', 'laypage', 'laytpl', 'upload', 'admin', 'form', @@ -480,18 +480,18 @@ layui.define(['common', 'tree', 'laypage', 'laytpl', 'upload', 'admin', 'form',
480 $.each(data, function (i, e) { 480 $.each(data, function (i, e) {
481 resIds.push(e.resId) 481 resIds.push(e.resId)
482 }) 482 })
483 - if (data.length <= 0) {//不传参  
484 - layer.open({  
485 - type: 1  
486 - , title: '端口侦测'  
487 - , closeBtn: 1  
488 - , area: ['90%', '80%']  
489 - , id: 'lay_port_sense' //设定一个id，防止重复弹出  
490 - , content: '<iframe src="/vue3/index.html#/vue3/portSense" frameborder="0" class="layadmin-iframe"/>' //支持传入html  
491 - });  
492 - }else{//传参  
493 - 483 + var url = "/vue3/index.html#/vue3/portSense";//不传参
  484 + if (data.length > 0) {//传参
  485 + url = "/vue3/index.html#/vue3/portSense?resId="+resIds.toString();
494 } 486 }
  487 + layer.open({
  488 + type: 1
  489 + , title: '端口侦测'
  490 + , closeBtn: 1
  491 + , area: ['90%', '80%']
  492 + , id: 'lay_port_sense' //设定一个id，防止重复弹出
  493 + , content: '<iframe src='+url+' frameborder="0" class="layadmin-iframe"/>' //支持传入html
  494 + });
495 }) 495 })
496 function openResManageCollHtml(callback){ 496 function openResManageCollHtml(callback){
497 if(data.length<=0){ 497 if(data.length<=0){
@@ -32,6 +32,11 @@ const routes = [{ @@ -32,6 +32,11 @@ const routes = [{
32 path: '/vue3/portSense', 32 path: '/vue3/portSense',
33 name: 'portSense', 33 name: 'portSense',
34 component: () => myImport('views/portSense/index') 34 component: () => myImport('views/portSense/index')
  35 + },
  36 + {
  37 + path: '/vue3/portSenseConfig',
  38 + name: 'portSenseConfig',
  39 + component: () => myImport('views/portSenseConfig/index')
35 } 40 }
36 ]; 41 ];
37 42
@@ -8,6 +8,7 @@ @@ -8,6 +8,7 @@
8 var global = {}; 8 var global = {};
9 9
10 global.layui = window.parent.layui; 10 global.layui = window.parent.layui;
  11 +global.layer = window.parent.layer;
11 12
12 global.common = { 13 global.common = {
13 getUserName : function (){ 14 getUserName : function (){
@@ -278,6 +279,20 @@ global.openDetail = (resId, resType, proxy) => { @@ -278,6 +279,20 @@ global.openDetail = (resId, resType, proxy) => {
278 } 279 }
279 280
280 /** 281 /**
  282 + * @description 打开选择layUI弹窗
  283 + * @author XuHaoJie
  284 + * @date 2022/1/5 2:07
  285 + */
  286 +global.openWin = (url, name, params, btns, fn, cancelfn, area, done, layerParams) => {
  287 + let lyaui = global.layui;
  288 + /* url页面路径(template/res/reslist) name弹窗名称(选择资源) params传递参数({oldData:oldData})
  289 + * btns 按钮名称(["选择","取消"]) fn 回调函数(选择的回调) cancelfn 回调函数(取消的回调)
  290 + * area 页面大小设置(['80%', '90%']) done 弹窗加载完成的回调函数 layerParams layer弹窗的其他设置参数
  291 + */
  292 + lyaui.common.openWin(url, name, params, btns, fn, cancelfn, area, done, layerParams);
  293 +}
  294 +
  295 +/**
281 * 打开报表 296 * 打开报表
282 * <p> 297 * <p>
283 * 作者： Wang 298 * 作者： Wang
@@ -7,17 +7,7 @@ @@ -7,17 +7,7 @@
7 <div class="flex-div-start margin-top-bottom-10"> 7 <div class="flex-div-start margin-top-bottom-10">
8 <el-input style="width:160px;" class="margin-right-10" v-model="keyWords" 8 <el-input style="width:160px;" class="margin-right-10" v-model="keyWords"
9 placeholder="输入关键字"/> 9 placeholder="输入关键字"/>
10 - <div class="flex-div-start">  
11 - <el-button type="primary" @click="onReset()">重置</el-button>  
12 - <el-button type="primary" @click="onBtnSearch()" style="margin-left: 10px">查询</el-button>  
13 - </div>  
14 -<!-- <el-select v-model="busTypeArr" multiple filterable clearable collapse-tags-->  
15 -<!-- placeholder="请选择业务">-->  
16 -<!-- <el-option-->  
17 -<!-- v-for="item in busTypeList"-->  
18 -<!-- :label="item.busTypeName" :value="item.busId"></el-option>-->  
19 -<!-- </el-select>-->  
20 - <el-dropdown style="margin-top: -15px;margin-left: 10px;"> 10 + <el-dropdown style="margin-top: -15px;">
21 <el-icon class="el-icon--right"> 11 <el-icon class="el-icon--right">
22 <arrow-down/> 12 <arrow-down/>
23 </el-icon> 13 </el-icon>
@@ -31,12 +21,23 @@ @@ -31,12 +21,23 @@
31 <cm-res-type-tree-input multiple clearable collapseTags @callback="getResType"/> 21 <cm-res-type-tree-input multiple clearable collapseTags @callback="getResType"/>
32 </el-dropdown> 22 </el-dropdown>
33 23
  24 + <div class="flex-div-start">
  25 +<!-- <el-button type="primary" @click="onReset()">重置</el-button>-->
  26 + <el-button type="primary" @click="onBtnSearch()" style="margin-left: 10px">查询</el-button>
  27 + </div>
  28 +
34 </div> 29 </div>
35 </el-col> 30 </el-col>
36 </el-row> 31 </el-row>
  32 + <el-row>
  33 + <div class="flex-div-start">
  34 + <el-button type="primary" @click="save()" style="margin-left: 10px">新增</el-button>
  35 + <el-button type="primary" @click="deleteOther()" style="margin-left: 10px">删除</el-button>
  36 + </div>
  37 + </el-row>
37 <el-row class="margin-bottom-50"> 38 <el-row class="margin-bottom-50">
38 <el-col :span="24" class="table-height"> 39 <el-col :span="24" class="table-height">
39 - <cm-table-page v-if="portSenseData" :columns="columns" 40 + <cm-table-page :columns="columns"
40 :dataList="portSenseData" 41 :dataList="portSenseData"
41 :total="count" 42 :total="count"
42 :pageSize="pageSize" 43 :pageSize="pageSize"
@@ -45,13 +46,13 @@ @@ -45,13 +46,13 @@
45 :showIndex="true" 46 :showIndex="true"
46 :showSelection="true" 47 :showSelection="true"
47 :showBorder="true" 48 :showBorder="true"
48 - :loading="false" 49 + :loading="loading"
49 :showPage="true" 50 :showPage="true"
50 :showTools="true" 51 :showTools="true"
51 - :height="(height - 500)"> 52 + :height="(height - 150)">
52 <template #tools="{scope}"> 53 <template #tools="{scope}">
53 <el-button type="text" size="small" @click.prevent="deleteItem(scope.row,scope.$index)"> 54 <el-button type="text" size="small" @click.prevent="deleteItem(scope.row,scope.$index)">
54 - 删除 55 + <i class="el-icon-delete"/>
55 </el-button> 56 </el-button>
56 </template> 57 </template>
57 </cm-table-page> 58 </cm-table-page>
@@ -60,12 +61,11 @@ @@ -60,12 +61,11 @@
60 </div> 61 </div>
61 </el-col> 62 </el-col>
62 </el-row> 63 </el-row>
63 - <!-- <div class="margin-top btn-faultDiagnosis flex-center position-bottom">-->  
64 - <!-- <el-button @click="cancleList">取消</el-button>-->  
65 - <!-- &lt;!&ndash; <el-button @click="saveList" type="primary">保存</el-button>&ndash;&gt;-->  
66 - <!-- </div>-->  
67 -</div>  
68 -<!--<div id="ssss">-->  
69 -<!-- {{ portSenseData[0] }}-->  
70 -<!-- {{columns}}-->  
71 -<!--</div>-->  
  64 +
  65 + <!--弹框-->
  66 + <cm-dialog :title="title" width="80%" :showDialogVisible="showPortSense" :showFooter="false" @hidedialog="showPortSenseDialog" :showOkBtn="false" cancelText="关闭">
  67 + <template v-slot>
  68 + <port-sense-config :parameter="portSenseConfigData"></port-sense-config>
  69 + </template>
  70 + </cm-dialog>
  71 +</div>
1 export default { 1 export default {
2 name: 'portSense', 2 name: 'portSense',
3 template: '', 3 template: '',
4 - components: {}, 4 + components: {
  5 + // 人员信息
  6 + 'port-sense-config': Vue.defineAsyncComponent(
  7 + () => myImport('views/portSenseConfig/index')
  8 + ),
  9 + },
5 data() { 10 data() {
6 }, 11 },
7 setup(props, {attrs, slots, emit}) { 12 setup(props, {attrs, slots, emit}) {
@@ -43,20 +48,34 @@ export default { @@ -43,20 +48,34 @@ export default {
43 //搜索关键字 48 //搜索关键字
44 let keyWords = Vue.ref(''); 49 let keyWords = Vue.ref('');
45 //列表数据 50 //列表数据
46 - let portSenseData = Vue.ref([{resName:'123',ip:'1.2.3.4'}]); 51 + let portSenseData = Vue.ref([]);
47 //资源类型数据 52 //资源类型数据
48 let resTypeArr = Vue.ref([]); 53 let resTypeArr = Vue.ref([]);
49 //业务类型数据 54 //业务类型数据
50 let busTypeArr = Vue.ref([]); 55 let busTypeArr = Vue.ref([]);
51 //业务类型 56 //业务类型
52 let busTypeList = Vue.ref([]); 57 let busTypeList = Vue.ref([]);
53 - //资源类型数据 58 + //资源数据
54 let resIdArr = Vue.ref([]); 59 let resIdArr = Vue.ref([]);
55 //列表高度 60 //列表高度
56 - let height = Vue.ref(window.innerHeight - 150); 61 + let height = Vue.ref(window.innerHeight);
57 //列表分页 62 //列表分页
58 let pageSize = Vue.ref(50); 63 let pageSize = Vue.ref(50);
  64 + //加载
  65 + let loading = Vue.ref(true);
  66 + //选中数据
  67 + let pitch = Vue.ref([]);
  68 + //弹框配置
  69 + //是否展示弹框
  70 + let showPortSense = Vue.ref(false);
  71 + //弹框名称
  72 + let title = Vue.ref("端口侦测配置");
  73 + //弹框参数
  74 + let portSenseConfigData = Vue.ref([]);
59 let init = () => { 75 let init = () => {
  76 + //获取传递过来的参数
  77 + var resId = proxy.$global.getQueryVariable('resId');
  78 + resIdArr.value = resId ? resId.split(",") : [];
60 proxy.$http.get("/api-web/home/business/findAllBusType", {}, function (res) { 79 proxy.$http.get("/api-web/home/business/findAllBusType", {}, function (res) {
61 if (res && res.data) { 80 if (res && res.data) {
62 busTypeList.value = res.data; 81 busTypeList.value = res.data;
@@ -66,37 +85,38 @@ export default { @@ -66,37 +85,38 @@ export default {
66 // 挂载完 85 // 挂载完
67 Vue.onMounted(() => { 86 Vue.onMounted(() => {
68 init(); 87 init();
69 - getListData();  
70 - })  
71 -  
72 - //定义列表参数  
73 - let getParams = Vue.ref({  
74 - keyWords: keyWords.value,  
75 - resTypes: resTypeArr.value.join(','),  
76 - resIds: resIdArr.value.join(','),  
77 - busIds: busTypeArr.value.join(','),  
78 - page: 1,  
79 - limit: pageSize 88 + getListData({page: 1, limit: pageSize.value});
  89 + onReset();//清空搜索条件(资源id)
80 }) 90 })
81 //获取列表数据 91 //获取列表数据
82 - const getListData = () => {  
83 - proxy.$http.get("/api-web/bResourceExtendParam/page", getParams.value, function (res) {  
84 - if (res && res.data) {  
85 - // portSenseData.value = res.data;  
86 - // count.value = res.count; 92 + const getListData = ({page, limit}) => {
  93 + //定义列表参数
  94 + let getParams = {
  95 + keyWords: keyWords.value,
  96 + resTypes: resTypeArr.value.join(','),
  97 + resIds: resIdArr.value.join(','),
  98 + busIds: busTypeArr.value.join(','),
  99 + page: page,
  100 + limit: limit
  101 + };
  102 + proxy.$http.get("/api-web/bResourceExtendParam/page", getParams, function (res) {
  103 + if (res && res.success) {
  104 + portSenseData.value = res.data;
  105 + count.value = res.count;
  106 + loading.value = false;
87 } 107 }
88 }) 108 })
89 } 109 }
90 // 点击按钮搜索 110 // 点击按钮搜索
91 let onBtnSearch = () => { 111 let onBtnSearch = () => {
92 - loadTableDataList({page: 1, limit: pageSize}); 112 + loadTableDataList({page: 1, limit: pageSize.value});
93 } 113 }
94 // 重置 114 // 重置
95 let onReset = () => { 115 let onReset = () => {
96 keyWords.value = ''; 116 keyWords.value = '';
97 - resTypeArr.value = '';  
98 - resIdArr.value = '';  
99 - busTypeArr.value = ''; 117 + resTypeArr.value = [];
  118 + resIdArr.value = [];
  119 + busTypeArr.value = [];
100 } 120 }
101 //获取资源类型 121 //获取资源类型
102 let getResType = (arr) => { 122 let getResType = (arr) => {
@@ -104,7 +124,7 @@ export default { @@ -104,7 +124,7 @@ export default {
104 return v.id; 124 return v.id;
105 }); 125 });
106 resTypeArr.value = types; 126 resTypeArr.value = types;
107 - loadTableDataList({page: 1, limit: pageSize}); 127 + loadTableDataList({page: 1, limit: pageSize.value});
108 } 128 }
109 //获取业务系统 129 //获取业务系统
110 let getBizType = (arr) => { 130 let getBizType = (arr) => {
@@ -112,11 +132,11 @@ export default { @@ -112,11 +132,11 @@ export default {
112 return v.busId; 132 return v.busId;
113 }); 133 });
114 busTypeArr.value = types; 134 busTypeArr.value = types;
115 - loadTableDataList({page: 1, limit: pageSize}); 135 + loadTableDataList({page: 1, limit: pageSize.value});
116 } 136 }
117 -  
118 //表格全选事件 137 //表格全选事件
119 let selectionChange = (val) => { 138 let selectionChange = (val) => {
  139 + pitch.value = val;
120 proxy.portSenseData.map((v, i) => { 140 proxy.portSenseData.map((v, i) => {
121 v.checked = false; 141 v.checked = false;
122 }); 142 });
@@ -135,40 +155,82 @@ export default { @@ -135,40 +155,82 @@ export default {
135 }) 155 })
136 } 156 }
137 } 157 }
138 -  
139 //删除单个数据 158 //删除单个数据
140 let deleteItem = (row, index) => { 159 let deleteItem = (row, index) => {
141 - let that = this;  
142 - this.$global.confirm("确认删除吗？", function () {  
143 - deleteItems = (that, [row.resId]); 160 + proxy.$global.confirm("确认删除吗？", function () {
  161 + deleteItems([row.resId]);
144 }) 162 })
145 } 163 }
146 //删除多个或单个 164 //删除多个或单个
147 - let deleteItems = (that, list) => { 165 + let deleteItems = (list) => {
148 let params = { 166 let params = {
149 redIds: list.toString() 167 redIds: list.toString()
150 } 168 }
151 - that.$http.get('/api-web/bResourceExtendParam/delete', params, function (res) {  
152 - if (res) {  
153 - that.$global.showMsg('删除成功');  
154 - loadTableDataList({page: 1, limit: pageSize}); 169 + proxy.$http.get('/api-web/bResourceExtendParam/delete', params, function (res) {
  170 + if (res && res.success) {
  171 + proxy.$global.showMsg('删除成功');
  172 + loadTableDataList({page: 1, limit: pageSize.value});
155 } 173 }
156 - // that.$emit('callbackDelete', item)  
157 }) 174 })
158 } 175 }
  176 + //添加
  177 + let save = () => {
  178 + //获取所有的端口侦测信息
  179 + let dataList = [];
  180 + let getParams = {
  181 + keyWords: '',
  182 + resTypes: '',
  183 + resIds: '',
  184 + busIds: '',
  185 + page: '',
  186 + limit: ''
  187 + };
  188 + proxy.$http.get("/api-web/bResourceExtendParam/page", getParams, function (res) {
  189 + if (res && res.success) {
  190 + dataList = res.data;
  191 + }
  192 + })
  193 + dataList = dataList.map(item => item.resId);
  194 + proxy.$global.openWin("template/res/reslist", "选择资源", {oldData: dataList}, ["选择"], function (index) {
  195 + //获取选中数据
  196 + let data = proxy.$global.layui.table.checkStatus('reslist_resListTable').data;
  197 + if (data.length === 0) {
  198 + //vue层级关系
  199 + // proxy.$global.showMsg("请至少选择一条数据！", "warning");
  200 + proxy.$global.layer.msg('请选择一项', {icon: 7, timeout: 3000});
  201 + return false;
  202 + }
  203 + //打开端口侦测配置页面
  204 + portSenseConfigData.value = data.map(item => item.resId);
  205 + showPortSense.value = true;
  206 + proxy.$global.layer.close(index);
  207 + }, null, ['80%', '81%']);
159 208
  209 + }
  210 + //删除
  211 + let deleteOther = () => {
  212 + let list = pitch.value.map(item => {
  213 + return item.resId;
  214 + })
  215 + deleteItems(list);
  216 + };
160 //重新加载表格数据 217 //重新加载表格数据
161 let loadTableDataList = ({page, limit}) => { 218 let loadTableDataList = ({page, limit}) => {
162 - getParams.page = page;  
163 - getParams.pageSize = limit;  
164 - getListData(); 219 + getListData({page, limit});
165 } 220 }
  221 +
  222 + //弹框事件
  223 + //弹框关闭触发
  224 + let showPortSenseDialog = () => {
  225 + showPortSense.value = false;
  226 + };
166 return { 227 return {
167 count, 228 count,
168 portSenseData, 229 portSenseData,
169 columns, 230 columns,
170 height, 231 height,
171 pageSize, 232 pageSize,
  233 + loading,
172 234
173 keyWords, 235 keyWords,
174 resTypeArr, 236 resTypeArr,
@@ -179,12 +241,18 @@ export default { @@ -179,12 +241,18 @@ export default {
179 deleteItem, 241 deleteItem,
180 onBtnSearch, 242 onBtnSearch,
181 onReset, 243 onReset,
182 - 244 + save,
  245 + deleteOther,
183 getListData, 246 getListData,
184 loadTableDataList, 247 loadTableDataList,
185 248
186 getResType, 249 getResType,
187 getBizType, 250 getBizType,
  251 +
  252 + showPortSense,
  253 + title,
  254 + portSenseConfigData,
  255 + showPortSenseDialog,
188 } 256 }
189 } 257 }
190 } 258 }
  1 +<div class="set-add-div" style="width: 100%;height: 30%">
  2 + <el-row>
  3 + <el-col :span="24">
  4 + <div class="set-add-div">
  5 + <el-row>
  6 + <div class="flex-div-start">
  7 + <el-button type="primary" @click="save()" style="margin-left: 10px">新增</el-button>
  8 + <el-button type="primary" @click="deleteOther()" style="margin-left: 10px">删除</el-button>
  9 + <el-button type="primary" @click="conserve()" style="margin-left: 10px">保存</el-button>
  10 + </div>
  11 + </el-row>
  12 + <el-row class="margin-bottom-50">
  13 + <el-col :span="24" class="table-height">
  14 + <cm-table-page :columns="columns"
  15 + :dataList="portSenseConfigData"
  16 + :total="count"
  17 + :pageSize="pageSize"
  18 + @loaddata="loadTableDataList"
  19 + @selectionChange="selectionChange"
  20 + :showIndex="true"
  21 + :showSelection="true"
  22 + :showBorder="true"
  23 + :loading="loading"
  24 + :showPage="true"
  25 + :showTools="true"
  26 + :height="(height - 150)">
  27 + <template #default="{row,prop,column}">
  28 + <div v-if="prop == 'protocolType'">
  29 + <!-- 展示下拉选项 -->
  30 + <el-select placeholder="请选择" size="small" style="width: 100%"
  31 + @change="changePortSense(row,prop,column)" v-model="row.protocolType"
  32 + :multiple="false"
  33 + collapse-tags clearable filterable placeholder="请选择">
  34 + <el-option label="TCP协议" :value="'tcp-port'"></el-option>
  35 + <el-option label="UDP协议" :value="'udp-port'"></el-option>
  36 + </el-select>
  37 + </div>
  38 + <div v-else>
  39 + <el-input @blur="changePortSense(row,prop,column)"
  40 + :type="prop == intervalTime ? 'number' : 'text'"
  41 + size="small" placeholder="请填写"v-model="row[prop]">
  42 + <template #suffix>
  43 + <i class="el-icon-edit-outline"/>
  44 + </template>
  45 + </el-input>
  46 + </div>
  47 + </template>
  48 + <template #tools="{scope}">
  49 + <el-button type="text" size="small" @click.prevent="deleteItem(scope.row,scope.$index)">
  50 + <i class="el-icon-delete"/>
  51 + </el-button>
  52 + </template>
  53 + </cm-table-page>
  54 + </el-col>
  55 + </el-row>
  56 + </div>
  57 + </el-col>
  58 + </el-row>
  59 +</div>
  1 +export default {
  2 + name: 'portSense',
  3 + template: '',
  4 + components: {},
  5 + data() {
  6 + },
  7 + props: {
  8 + parameter: {
  9 + type: Array,
  10 + default: []
  11 + }
  12 + },
  13 + setup: function (props, {attrs, slots, emit}) {
  14 + const {proxy} = Vue.getCurrentInstance();
  15 + const columns = [
  16 + {
  17 + prop: 'protocolType',
  18 + label: '协议类型',
  19 + sortable: true,
  20 + align: 'center',
  21 + },
  22 + {
  23 + prop: 'port',
  24 + label: '端口号',
  25 + sortable: true,
  26 + align: 'center',
  27 + },
  28 + {
  29 + prop: 'intervalTime',
  30 + label: '间隔时长',
  31 + sortable: true,
  32 + align: 'center',
  33 + },
  34 + {
  35 + prop: 'portDesc',
  36 + label: '端口备注',
  37 + sortable: true,
  38 + align: 'center',
  39 + },
  40 + {
  41 + prop: 'paramDesc',
  42 + label: '备注信息',
  43 + sortable: true,
  44 + align: 'center',
  45 + }
  46 + ];
  47 + //配置列表总数
  48 + let count = Vue.ref(0);
  49 + //列表数据
  50 + let portSenseConfigData = Vue.ref([]);
  51 + //资源数据
  52 + let resIdArr = Vue.ref([]);
  53 + //列表高度
  54 + let height = Vue.ref(window.innerHeight);
  55 + //列表分页
  56 + let pageSize = Vue.ref(400);
  57 + //加载
  58 + let loading = Vue.ref(true);
  59 + //选中数据
  60 + let pitch = Vue.ref([]);
  61 + let init = () => {
  62 + //获取传递过来的参数
  63 + resIdArr.value = JSON.parse(JSON.stringify(props.parameter));
  64 + }
  65 + // 挂载完
  66 + Vue.onMounted(() => {
  67 + init();
  68 + getListData({page: 1, limit: pageSize.value});
  69 + })
  70 + //获取列表数据
  71 + const getListData = ({page, limit}) => {
  72 + //定义列表参数
  73 + let getParams = {
  74 + resIds: resIdArr.value.join(','),
  75 + page: page,
  76 + limit: limit
  77 + };
  78 + proxy.$http.get("/api-web/bResourceExtendParam/portSensePage", getParams, function (res) {
  79 + if (res && res.success) {
  80 + portSenseConfigData.value = res.data ? res.data : [];
  81 + count.value = res.count;
  82 + loading.value = false;
  83 + }
  84 + })
  85 + }
  86 +
  87 + //表格全选事件
  88 + let selectionChange = (val) => {
  89 + pitch.value = val;
  90 + proxy.portSenseConfigData.map((v, i) => {
  91 + v.checked = false;
  92 + });
  93 + let selectData = val;
  94 + if (selectData.length > 0) {
  95 + selectData.map((item, index) => {
  96 + proxy.portSenseConfigData.map((v, i) => {
  97 + if (item.id == v.id) {
  98 + v.checked = true;
  99 + }
  100 + })
  101 + })
  102 + } else {
  103 + proxy.portSenseConfigData.map((v, i) => {
  104 + v.checked = false;
  105 + })
  106 + }
  107 + }
  108 + //删除单个数据
  109 + let deleteItem = (row, index) => {
  110 + proxy.$global.confirm("确认删除吗？", function () {
  111 + deleteItems([row]);
  112 + })
  113 + }
  114 + //删除多个或单个
  115 + let deleteItems = (list) => {
  116 + //新添加未保存的
  117 + let filter = list.filter(item => item.id === "");
  118 + deleteNotSave(filter);
  119 + if (filter.size === list.size) {
  120 + return false;
  121 + }
  122 + list = list.filter(item => item.id !== "");
  123 + proxy.$http.post('/api-web/bResourceExtendParam/deleteConfig', list, function (res) {
  124 + if (res && res.success) {
  125 + proxy.$global.showMsg('删除成功');
  126 + loadTableDataList({page: 1, limit: pageSize.value});
  127 + }
  128 + })
  129 + }
  130 + //删除新添加但未保存的
  131 + let deleteNotSave = (list) => {
  132 +
  133 + }
  134 + //删除
  135 + let deleteOther = () => {
  136 + let list = pitch.value.map(item => {
  137 + return item.resId;
  138 + })
  139 + deleteItems(list);
  140 + };
  141 + //新增 添加一行数据
  142 + let save = () => {
  143 + let data = {
  144 + id: "",
  145 + intervalTime: null,
  146 + paramCode: "",
  147 + paramDesc: "",
  148 + paramValue: "",
  149 + port: "",
  150 + portDesc: "",
  151 + protocolType: "",
  152 + resId: "",
  153 + resIdList: resIdArr.value,
  154 + }
  155 + portSenseConfigData.value.push(data);
  156 + console.log(portSenseConfigData.value);
  157 + }
  158 + //下拉框值改变事件
  159 + let changePortSense = () => {
  160 +
  161 + }
  162 + //保存
  163 + let conserve = () => {
  164 +
  165 + }
  166 + //重新加载表格数据
  167 + let loadTableDataList = ({page, limit}) => {
  168 + getListData({page, limit});
  169 + }
  170 + return {
  171 + count,
  172 + portSenseConfigData,
  173 + columns,
  174 + height,
  175 + pageSize,
  176 + loading,
  177 +
  178 + selectionChange,
  179 + deleteItem,
  180 + save,
  181 + deleteOther,
  182 + getListData,
  183 + loadTableDataList,
  184 + changePortSense,
  185 + conserve
  186 + }
  187 + }
  188 +}
@@ -150,6 +150,11 @@ const routes = [{ @@ -150,6 +150,11 @@ const routes = [{
150 name: 'cacheData', 150 name: 'cacheData',
151 component: () => myImport('views/cacheData/index') 151 component: () => myImport('views/cacheData/index')
152 }, 152 },
  153 + {
  154 + path: '/vue3/portSenseConfig',
  155 + name: 'portSenseConfig',
  156 + component: () => myImport('views/portSenseConfig/index')
  157 + }
153 ]; 158 ];
154 159
155 // hash模式： createWebHashHistory 160 // hash模式： createWebHashHistory