diff --git a/src/components/ConfigManager/RtuConfig.vue b/src/components/ConfigManager/RtuConfig.vue index 2aa6409..60226ac 100644 --- a/src/components/ConfigManager/RtuConfig.vue +++ b/src/components/ConfigManager/RtuConfig.vue @@ -2,7 +2,7 @@
搜索 --> - - + - - 搜索 - + 搜索 + > - + 回显 - + 暂存 - + 暂存回显 - + 提交
- + - + 回显历史记录
@@ -96,10 +123,10 @@
@@ -131,7 +158,9 @@ :key="item.fieldIdentifier" :class="{ 'el-col-class': true, - stop: item.hasOwnProperty('isShow') ? !item.isShow : false + stop: item.hasOwnProperty('isShow') + ? !item.isShow + : false, }" > { - if (item.name === "外置DTU设置") { - arr[index].isShow = newVal; - } - }); - } - ); - // GPRS，LORA开关 - this.$watch( - function() { - return this.formAll[0].form1.rtuInnerMode; - }, - function(newVal, oldVal) { - this.formAllBody["1"].forEach((item, index, arr) => { - if (item.name === "内置LoRa相关配置") { - arr[index].isShow = newVal === "LORA" ? true : false; - } - }); - this.formAllBody["2"].forEach((item, index, arr) => { - if (item.name === "中心站1") { - arr[index].isShow = newVal === "GPRS" ? true : false; - } - if (item.name === "中心站2") { - arr[index].isShow = newVal === "GPRS" ? true : false; - } - if (item.name === "中心站3") { - arr[index].isShow = newVal === "GPRS" ? true : false; - } - if (item.name === "中心站4(备份站)") { - arr[index].isShow = newVal === "GPRS" ? true : false; - } - if (item.name === "VPN专网设置1") { - arr[index].isShow = newVal === "GPRS" ? true : false; - } - if (item.name === "VPN专网设置2") { - arr[index].isShow = newVal === "GPRS" ? true : false; - } - if (item.name === "NBIOT网络设置") { - arr[index].isShow = newVal === "GPRS" ? true : false; - } - if (item.name === "中心站其他设置") { - arr[index].isShow = newVal === "GPRS" ? true : false; - } - if (item.name === "远程后台服务器设置") { - arr[index].isShow = newVal === "GPRS" ? true : false; - } - }); - } - ); - // 水位计雷达 - this.$watch( - function() { - return this.formAll[2].form3.rtucgq_shuiwei1; - }, - function(newVal, oldVal) { - if ( - !( - (newVal === "NF-WGX-5小雷达水位计") | - (newVal === "NF-WGX-6大雷达水位计") - ) - ) { - this.formAllBody["9"][2].isShow = false; - } else { - this.formAllBody["9"][2].isShow = true; - } - } - ); - this.$watch( - function() { - return this.formAll[2].form3.rtucgq_shuiwei2; - }, - function(newVal, oldVal) { - if ( - !( - (newVal === "NF-WGX-5小雷达水位计") | - (newVal === "NF-WGX-6大雷达水位计") - ) - ) { - this.formAllBody["9"][2].isShow = false; - } else { - this.formAllBody["9"][4].isShow = true; - } - } - ); - // 流量计水鬼 - this.$watch( - function() { - return this.formAll[2].form3.rtucgq_liuliang1; - }, - function(newVal, oldVal) { - var targetNameArr = [ - "直接流量输出", - "安装高度", - "流量校正", - "淤积深度", - "无效参数", - "无效参数", - "无效参数", - "堰槽截面表高度分辨率" - ]; - var targetStatusArr = [ - false, - true, - true, - true, - false, - false, - false, - false - ]; - // let select= ['直接流量输出','三角堰','矩形堰','梯形堰','圆管','自定义截面','直角三角堰明渠','巴歇尔槽明渠'] // 下拉框值， - let strArr = [ - "rtull_ll1_jiemian", - "rtull_ll1_gaodu", - "rtull_ll1_jiaozheng", - "rtull_ll1_shendu", - "rtull_ll1_shangdikuandu", - "rtull_ll1_yancaogaodu", - "rtull_ll1_xiadikuandu", - "rtull_ll1_fenbian" - ]; - this.formAllBody["11"][1].data.forEach((item, index, arr) => { - for (let i = 0; i < strArr.length; i++) { - if (arr[index].fieldIdentifier === strArr[i]) { - arr[index].isShow = targetStatusArr[select.indexOf(newVal)][i]; - arr[index].fieldName = targetNameArr[select.indexOf(newVal)][i]; - } - } - }); - } - ); - this.$watch( - function() { - return this.formAll[2].form3.rtucgq_liuliang2; - }, - function(newVal, oldVal) { - if (!(newVal === "NF_LZX_2水龟")) { - this.formAllBody["11"][6].isShow = false; - } else { - this.formAllBody["11"][6].isShow = true; - } - } - ); - // 遥测站 采集标志 开关， 存储周期 rtuSaveCircle - this.$watch( - function() { - return this.formAll[0].form1.rtucjFlagTrans; - }, - function(newVal, oldVal) { - this.formAllBody["1"][0].data[3].isShow = !newVal; - } - ); - // 域名传输 - this.$watch( - function() { - return this.formAll[1].form2.rtuZxZx1RealmNameTrans; - }, - function(newVal, oldVal) { - this.formAllBody["2"][0].data[2].isShow = newVal; - this.formAllBody["2"][0].data[3].isShow = !newVal; - } - ); - this.$watch( - function() { - return this.formAll[1].form2.rtuZxZx2RealmNameTrans; - }, - function(newVal, oldVal) { - this.formAllBody["2"][2].data[2].isShow = newVal; - this.formAllBody["2"][2].data[3].isShow = !newVal; - } - ); - this.$watch( - function() { - return this.formAll[1].form2.rtuZxZx3RealmNameTrans; - }, - function(newVal, oldVal) { - this.formAllBody["2"][4].data[2].isShow = newVal; - this.formAllBody["2"][4].data[3].isShow = !newVal; - } - ); - this.$watch( - function() { - return this.formAll[1].form2.rtuZxZx4RealmNameTrans; - }, - function(newVal, oldVal) { - this.formAllBody["2"][6].data[2].isShow = newVal; - this.formAllBody["2"][6].data[3].isShow = !newVal; - } - ); - // 外置dtu设置，下拉框 - this.$watch( - function() { - return this.formAll[0].form1.rtuother_dtu_type; - }, - function(newVal, oldVal) { - var targetArr = [ - [true, true, true, true, false], - [true, true, false, false, false], - [false, false, false, false, true], - [false, false, false, false, false] - ]; - let select = [ - "LoRa-利尔达CN470", - "ManThink-门思科技", - "BC28电信管理平台NB", - "M5311移动平台NB" - ]; // 下拉框值，对应targetArr其他5个控件显示的4状态 - let strArr = [ - "JoinEUI", - "频率格式", - "上行频率", - "下行频率", - "电信NB服务ID" - ]; - this.formAllBody["1"][2].data.forEach((item, index, arr) => { - for (let i = 0; i < strArr.length; i++) { - if (arr[index].fieldName === strArr[i]) { - arr[index].isShow = targetArr[select.indexOf(newVal)][i]; - } - } - }); - // console.log(this.formAllBody['1'][2].data, select.indexOf(newVal),'_this.formAllBody[]') - } - ); - // 从机1 ，2设置 - this.$watch( - function() { - return this.formAll[2].form3.rtucgq_congji1; - }, - function(newVal, oldVal) { - var targetNameArr = [ - ["无效参数", "无效参数", "无效参数"], - ["抽水周期", "抽水超时", "排水超时"], - ["无效参数", "无效参数", "无效参数"], - ["采集周期", "通道延时", "演示递增"], - ["采集周期", "通道延时", "无效参数"], - ["查询周期", "抽水超时", "排水超时"] - ]; - var targetStatusArr = [ - [false, false, false], - [true, true, true], - [false, false, false], - [true, true, true], - [true, true, false], - [true, true, true] - ]; - let select = [ - "默认从机", - "电机驱动板（水质监测柜）", - "VGUS屏幕（水质监测柜）", - "二供（净水器）", - "二供（水箱）", - "主控板（5/9参数水质监测柜）" - ]; // 下拉框值，对应targetArr其他5个控件显示的4状态 - let strArr = ["rtucj1_canshu1", "rtucj1_canshu2", "rtucj1_canshu3"]; - this.formAllBody["7"][1].data.forEach((item, index, arr) => { - for (let i = 0; i < strArr.length; i++) { - if (arr[index].fieldIdentifier === strArr[i]) { - arr[index].isShow = targetStatusArr[select.indexOf(newVal)][i]; - arr[index].fieldName = targetNameArr[select.indexOf(newVal)][i]; - } - } - }); - // console.log(this.formAllBody['1'][2].data, select.indexOf(newVal),'_this.formAllBody[]') - } - ); - this.$watch( - function() { - return this.formAll[2].form3.rtucgq_congji2; - }, - function(newVal, oldVal) { - var targetNameArr = [ - ["无效参数", "无效参数", "无效参数"], - ["抽水周期", "抽水超时", "排水超时"], - ["无效参数", "无效参数", "无效参数"], - ["采集周期", "通道延时", "演示递增"], - ["采集周期", "通道延时", "无效参数"], - ["查询周期", "抽水超时", "排水超时"] - ]; - var targetStatusArr = [ - [false, false, false], - [true, true, true], - [false, false, false], - [true, true, true], - [true, true, false], - [true, true, true] - ]; - let select = [ - "默认从机", - "电机驱动板（水质监测柜）", - "VGUS屏幕（水质监测柜）", - "二供（净水器）", - "二供（水箱）", - "主控板（5/9参数水质监测柜）" - ]; // 下拉框值，对应targetArr其他5个控件显示的4状态 - let strArr = ["rtucj2_canshu1", "rtucj2_canshu2", "rtucj2_canshu3"]; - this.formAllBody["7"][3].data.forEach((item, index, arr) => { - for (let i = 0; i < strArr.length; i++) { - if (arr[index].fieldIdentifier === strArr[i]) { - arr[index].isShow = targetStatusArr[select.indexOf(newVal)][i]; - arr[index].fieldName = targetNameArr[select.indexOf(newVal)][i]; - } - } - }); - // console.log(this.formAllBody['1'][2].data, select.indexOf(newVal),'_this.formAllBody[]') - } - ); - // 流量计 流量槽 - this.$watch( - function() { - return this.formAll[10].form11.rtull_ll1_jiemian; - }, - function(newVal, oldVal) { - var targetNameArr = [ - [ - "安装高度", - "流量校正", - "淤积深度", - "无效参数", - "无效参数", - "无效参数", - "堰槽截面表高度分辨率" - ], - [ - "安装高度", - "流量校正", - "淤积深度", - "上地宽度", - "堰槽高度", - "无效参数", - "堰槽截面表高度分辨率" - ], - [ - "安装高度", - "流量校正", - "淤积深度", - "上地宽度", - "堰槽高度", - "无效参数", - "堰槽截面表高度分辨率" - ], - [ - "安装高度", - "流量校正", - "淤积深度", - "窄底宽度", - "堰槽高度", - "宽底宽度", - "堰槽截面表高度分辨率" - ], - [ - "安装高度", - "流量校正", - "淤积深度", - "无效参数", - "槽堰直径", - "无效参数", - "堰槽截面表高度分辨率" - ], - [ - "安装高度", - "流量校正", - "淤积深度", - "无效参数", - "无效参数", - "无效参数", - "堰槽截面表高度分辨率" - ], - [ - "溢流高度", - "流量校正", - "淤积深度", - "无效参数", - "槽堰高度", - "无效参数", - "堰槽截面表高度分辨率" - ], - [ - "溢流高度", - "流量校正", - "淤积深度", - "槽堰高度", - "槽序号", - "无效参数", - "堰槽截面表高度分辨率" - ] - ]; - var targetStatusArr = [ - [true, true, true, false, false, false, false], - [true, true, true, true, true, false, false], - [true, true, true, true, true, false, false], - [true, true, true, true, true, true, false], - [true, true, true, false, true, false, false], - [true, true, true, false, false, false, true], - [true, true, true, false, true, false, false], - [true, true, true, true, true, false, false] - ]; - let select = [ - "直接流量输出", - "三角堰", - "矩形堰", - "梯形堰", - "圆管", - "自定义截面", - "直角三角堰明渠", - "巴歇尔槽明渠" - ]; // 下拉框值， - let strArr = [ - "rtull_ll1_gaodu", - "rtull_ll1_jiaozheng", - "rtull_ll1_shendu", - "rtull_ll1_shangdikuandu", - "rtull_ll1_yancaogaodu", - "rtull_ll1_xiadikuandu", - "rtull_ll1_fenbian" - ]; - this.formAllBody["11"][1].data.forEach((item, index, arr) => { - for (let i = 0; i < strArr.length; i++) { - if (arr[index].fieldIdentifier === strArr[i]) { - arr[index].isShow = targetStatusArr[select.indexOf(newVal)][i]; - arr[index].fieldName = targetNameArr[select.indexOf(newVal)][i]; - } - } - }); - // console.log(this.formAllBody['1'][2].data, select.indexOf(newVal),'_this.formAllBody[]') - } - ); - // 蒸发皿 - this.$watch( - function() { - return this.formAll[2].form3.rtucgq_zfly; - }, - function(newVal, oldVal) { - var targetNameArr = [ - ["安装高度", "量程", "最小加水量"], - ["无效参数", "无效参数", "最小加水量"], - ["无效参数", "无效参数", "最小加水量"] - ]; - var targetStatusArr = [ - [true, true, true], - [false, false, true], - [false, false, true] - ]; - let select = ["独立蒸发皿", "水位值1", "水位值2"]; // 下拉框值，对应targetArr其他5个控件显示的4状态 - let strArr = ["rtuzf_gaodu", "rtuzf_liangcheng", "rtuzf_zuixiao"]; - this.formAllBody["12"][0].data.forEach((item, index, arr) => { - for (let i = 0; i < strArr.length; i++) { - if (arr[index].fieldIdentifier === strArr[i]) { - arr[index].isShow = targetStatusArr[select.indexOf(newVal)][i]; - arr[index].fieldName = targetNameArr[select.indexOf(newVal)][i]; - } - } - }); - // console.log(this.formAllBody['1'][2].data, select.indexOf(newVal),'_this.formAllBody[]') - } - ); - // 4am， 存储周期 rtuSaveCircle - this.$watch( - function() { - return this.formAll[2].form3.rtucgq_liuliang1; - }, - function(newVal, oldVal) { - var targetNameArr = [ - [ - "安装高度", - "流量校正", - "淤积深度", - "无效参数", - "无效参数", - "无效参数", - "堰槽截面表高度分辨率" - ] - ]; - var targetStatusArr = [[true, true, true, false, false, false, false]]; - let select = ["独立蒸发皿", "水位值1", "水位值2"]; // 下拉框值，对应targetArr其他5个控件显示的4状态 - let strArr = ["rtuzf_gaodu", "rtuzf_liangcheng", "rtuzf_zuixiao"]; - this.formAllBody["11"][1].data.forEach((item, index, arr) => { - for (let i = 0; i < strArr.length; i++) { - if (arr[index].fieldIdentifier === strArr[i]) { - arr[index].isShow = targetStatusArr[select.indexOf(newVal)][i]; - arr[index].fieldName = targetNameArr[select.indexOf(newVal)][i]; - } - } - }); - // console.log(this.formAllBody['1'][2].data, select.indexOf(newVal),'_this.formAllBody[]') - } - ); + this.initWatch(); // bottom }, methods: { - search(){ + search() { this.formAll = []; - this.querySite= [] + this.querySite = []; // console.log(this.querySite,'querySite') - this.getSiteList(this.searchCode) + this.getSiteList(this.searchCode); }, - switchChange(val){ + switchChange(val) { // console.log(val,this.formAll[0].form1,'change') }, switchClick(val) { @@ -1093,20 +635,35 @@ }, temStorageEcho() { // this.activeIndex = '0' - if(localStorage.getItem(this.querySite[1])){ - this.formAll = JSON.parse(localStorage.getItem(name)); - this.$message({ message: "暂存回显成功", type: "success" }); + if ( + this.querySite.length === 2 && + localStorage.getItem(this.querySite[1]) + ) { + this.formAll = JSON.parse(localStorage.getItem(this.querySite[1])); + console.log(this.formAll, this.querySite[1], "this.formAll"); + + this.$message({ + message: `${this.querySite[1]}暂存回显成功`, + type: "success", + }); } else { this.$message({ message: "无暂存内容", type: "warning" }); } // console.log(JSON.parse(sessionStorage.getItem(name)),111) }, temStorage() { - try { - localStorage.setItem(this.querySite[1], JSON.stringify(this.formAll)); - this.$message({ message: `${this.querySite[1]}保存成功`, type: "success" }); - } catch (err) { - this.$message({ message: err, type: "warning" }); + if (this.querySite.length === 2) { + try { + localStorage.removeItem(this.querySite[1]); + // console.log(this.formAll,'this.formAll') + localStorage.setItem(this.querySite[1], JSON.stringify(this.formAll)); + this.$message({ + message: `${this.querySite[1]}保存成功`, + type: "success", + }); + } catch (err) { + this.$message({ message: err, type: "warning" }); + } } // sessionStorage.setItem(name,'999') // // location.href='http://192.168.16.189:8080/#/ConfigManager/RtuConfig' @@ -1115,17 +672,63 @@ // console.log(sessionStorage.setItem(name),111) }, sunmitAll() { + console.log(this.formAll, "formAll"); + // 水位计 流量计 蒸发皿 rtucgq_llly1 + // let shuiWeiArr = ['独立水位计','流量计内置水位计','蒸发皿'] + // let liuLiangArr = ['内置水位计','外置独立水位计'] + // let zhengFaMinArr = ['独立蒸发皿','水位值1','水位值2'] + if ( + this.formAll[2].form3.rtucgq_swly1 === "蒸发皿" && + this.formAll[2].form3.rtucgq_zfly === "水位值1" + ) { + this.$message({ + message: `水位计1和蒸发皿数据冲突！`, + type: "warning", + }); + return; + } + if ( + this.formAll[2].form3.rtucgq_swly2 === "蒸发皿" && + this.formAll[2].form3.rtucgq_zfly === "水位值2" + ) { + this.$message({ + message: `水位计2和蒸发皿数据冲突！`, + type: "warning", + }); + return; + } + if ( + this.formAll[2].form3.rtucgq_swly1 === "流量计内置水位计" && + this.formAll[2].form3.rtucgq_llly1 === "外置独立水位计" + ) { + this.$message({ + message: `水位计1和流量计1数据冲突！`, + type: "warning", + }); + return; + } + if ( + this.formAll[2].form3.rtucgq_swly2 === "流量计内置水位计" && + this.formAll[2].form3.rtucgq_llly2 === "外置独立水位计" + ) { + this.$message({ + message: `水位计2和流量计2数据冲突！`, + type: "warning", + }); + return; + } + // return ; // 提交所有表单，循环校验所有表单，当有个表单校验失败就break，提示该表单校验失败，根据校验成功总数或者无失败确定完成，组装数据发送到后台 var successCount = 0; var successFlag = false; for (var i = 0; i < 15; i++) { - this.$refs["form"][i].validate(valid => { + this.$refs["form"][i].validate((valid) => { if (valid) { successCount++; } else { this.$message({ message: `${this.siteNameList[i]} 校验失败，请查看`, - type: "warning" + type: "warning", }); // alert(`${this.siteNameList[i]} 校验失败，请查看`); // this.$notify({ @@ -1166,8 +769,8 @@ rtuEvaporatingDishSetting: this.formAll[11].form12, rtuSoilSettler: this.formAll[12].form13, rtu4To20Setting: this.formAll[13].form14, - rtuOtherSetting: this.formAll[14].form15 - } + rtuOtherSetting: this.formAll[14].form15, + }, }; // 之前初始化时将3处的两个数组生成了需要的字段，现在需要把每处16个字段组装成两数组，删除不需要的字段,转化方法暂时写在这里 function dealInputSwitch( @@ -1236,7 +839,7 @@ ] = rtucamera_jiabaoNew; this.$http .post(`${this.nozzle.rTUSettingServiceUpdate}`, parmas) - .then(res => { + .then((res) => { // console.log(res,'rTUSettingServiceUpdate') this.echoClick(); }); @@ -1278,11 +881,11 @@ }, selectChange(val) { // this.querySite = [] - this.rtuHistoryId='' + this.rtuHistoryId = ""; // console.log(val,'val') // if(this.querySite.length!==2) return; this.echoClick(val); - this.getRtuHistoryList() + this.getRtuHistoryList(); }, selectChange1(val) { // console.log(val,'val') input搜索 @@ -1294,7 +897,7 @@ // this.echoClick(val); }, async initPage(site) { - this.loading = true + this.loading = true; // 切换站点后去请求历史下拉框 // this.getRtuHistoryList() // 回显接口请求数据 将水文传感里面3处特殊的控件需要的值，用请求数据遍历生成表单需要的字段，因为这3处的动态表单使用的是死的字段，其他的对应的表单数据赋值给对应表单就能回显了、 @@ -1320,7 +923,7 @@ "rtuEvaporatingDishSetting", "rtuSoilSettler", "rtu4To20Setting", - "rtuOtherSetting" + "rtuOtherSetting", ]; // console.log(this.formAll,resData,'ressssss') // this.formAll={} @@ -1402,7 +1005,7 @@ this.formAll.push(obj); // console.log(this.formAll,this.stCode,'this.formAll') } - this.loading = false + this.loading = false; }, async initPage2(rtuCode) { // 回显接口请求数据 将水文传感里面3处特殊的控件需要的值，用请求数据遍历生成表单需要的字段，因为这3处的动态表单使用的是死的字段，其他的对应的表单数据赋值给对应表单就能回显了、 @@ -1425,7 +1028,7 @@ "rtuEvaporatingDishSetting", "rtuSoilSettler", "rtu4To20Setting", - "rtuOtherSetting" + "rtuOtherSetting", ]; console.log(this.formAll, resData, "ressssss"); // this.formAll={} @@ -1598,36 +1201,55 @@ return temp; } // 生成表单控件的接口 - this.$http.post(this.nozzle.rtuPageQueryPage).then(res => { + this.$http.post(this.nozzle.rtuPageQueryPage).then((res) => { var dataRes = res.data.data; // console.log(dataRes,'dataRes') for (var i in dataRes) { if (dataRes[i].length !== 0) { dataRes[i].forEach((item, index, arr) => { - this.rules[item.fieldIdentifier] = [ - { - validator: (rule, value, callback) => { - this.validatorAll( - rule, - value, - callback, - item.validatorType, - item.validatorRules, - item.validatorErrorText - ); + if (item.fieldType !== 5) { + this.rules[item.fieldIdentifier] = [ + { + validator: (rule, value, callback) => { + this.validatorAll( + rule, + value, + callback, + item.validatorType, + item.validatorRules, + item.validatorErrorText + ); + }, + trigger: "change", }, - trigger: "change" - } - ]; + ]; + } else if (item.fieldType === 5) { + this.rules[item.fieldIdentifier] = [ + { + validator: (rule, value, callback) => { + this.validatorAll( + rule, + value, + callback, + item.validatorType, + item.validatorRules, + item.validatorErrorText + ); + }, + trigger: "change", + }, + { required: true, message: "必填", trigger: "change" }, + ]; + } }); - let sub_titleList = dataRes[i].map(item => { + let sub_titleList = dataRes[i].map((item) => { return item.subTitle; }); var newObj = []; // 根据小标题去重 - uniq(sub_titleList).forEach(item => { + uniq(sub_titleList).forEach((item) => { var obj = { name: item, data: [], isShow: true, isBlock: true }; - var data = dataRes[i].forEach(l => { + var data = dataRes[i].forEach((l) => { l.isShow = true; if ( l.subTitle === item && @@ -1651,11 +1273,11 @@ console.log(this.formAllBody, "999"); }); }, - async getSiteList(val='') { - // ,{stCode:this.querySite} + async getSiteList(val = "") { + // ,{stCode:this.querySite} await this.$http .post(`${this.nozzle.rTUSettingServiceQueryList}?stCode=${val}`) - .then(res => { + .then((res) => { // console.log(res.data.data,'resss') this.querySiteList = res.data.data; // this.querySiteList.push({ @@ -1675,15 +1297,641 @@ await this.$http //`${this.nozzle.queryRTUSettingHistory}?stCode=${this.querySite}` .post(`${this.nozzle.queryRTUSettingHistory}?rtuCode=${rtuCode}`) - .then(res => { + .then((res) => { // console.log(res.data,'resss') this.rtuHistoryList = res.data.data; // this.querySite = this.querySiteList[0].rtuStationCode; }); - } + }, + initWatch() { + // console.log(this.formAll,this.formAllBody,'this.formAll[0]') + //// 第一个函数就是处理你要监听的属性，只要将其return出去就行 + // 外置dtu开关 + this.$watch( + function () { + return this.formAll[0].form1.rtuOutDtu; + }, + function (newVal, oldVal) { + this.formAllBody["1"].forEach((item, index, arr) => { + if (item.name === "外置DTU设置") { + arr[index].isShow = newVal; + } + }); + } + ); + // GPRS，LORA开关 + this.$watch( + function () { + return this.formAll[0].form1.rtuInnerMode; + }, + function (newVal, oldVal) { + this.formAllBody["1"].forEach((item, index, arr) => { + if (item.name === "内置LoRa相关配置") { + arr[index].isShow = newVal === "LORA" ? true : false; + } + }); + this.formAllBody["2"].forEach((item, index, arr) => { + if (item.name === "中心站1") { + arr[index].isShow = newVal === "GPRS" ? true : false; + } + if (item.name === "中心站2") { + arr[index].isShow = newVal === "GPRS" ? true : false; + } + if (item.name === "中心站3") { + arr[index].isShow = newVal === "GPRS" ? true : false; + } + if (item.name === "中心站4(备份站)") { + arr[index].isShow = newVal === "GPRS" ? true : false; + } + if (item.name === "VPN专网设置1") { + arr[index].isShow = newVal === "GPRS" ? true : false; + } + if (item.name === "VPN专网设置2") { + arr[index].isShow = newVal === "GPRS" ? true : false; + } + if (item.name === "NBIOT网络设置") { + arr[index].isShow = newVal === "GPRS" ? true : false; + } + if (item.name === "中心站其他设置") { + arr[index].isShow = newVal === "GPRS" ? true : false; + } + if (item.name === "远程后台服务器设置") { + arr[index].isShow = newVal === "GPRS" ? true : false; + } + }); + } + ); + // 水位计雷达 + this.$watch( + function () { + return this.formAll[2].form3.rtucgq_shuiwei1; + }, + function (newVal, oldVal) { + if ( + !( + (newVal === "NF-WGX-5小雷达水位计") | + (newVal === "NF-WGX-6大雷达水位计") + ) + ) { + this.formAllBody["9"][2].isShow = false; + } else { + this.formAllBody["9"][2].isShow = true; + } + } + ); + this.$watch( + function () { + return this.formAll[2].form3.rtucgq_shuiwei2; + }, + function (newVal, oldVal) { + if ( + !( + (newVal === "NF-WGX-5小雷达水位计") | + (newVal === "NF-WGX-6大雷达水位计") + ) + ) { + this.formAllBody["9"][2].isShow = false; + } else { + this.formAllBody["9"][4].isShow = true; + } + } + ); + // 流量计水龟 流量计1 流量计1设置 + this.$watch( + function () { + return this.formAll[2].form3.rtucgq_liuliang1; + }, + function (newVal, oldVal) { + let arr = [ + "4-20mA流量计", + "NACH-FL900流速仪", + "LWGY涡轮流量计", + "SM_311水表", + ]; + if (arr.indexOf(newVal) !== -1) { + this.formAll[10].form11.rtull_ll1_jiemian = "直接流量输出"; + this.formAllBody["11"][1].data[0].isShow = false; + } else { + this.formAllBody["11"][1].data[0].isShow = true; + } + } + ); + this.$watch( + function () { + return this.formAll[2].form3.rtucgq_liuliang2; + }, + function (newVal, oldVal) { + let arr = [ + "4-20mA流量计", + "NACH-FL900流速仪", + "LWGY涡轮流量计", + "SM_311水表", + ]; + if (arr.indexOf(newVal) !== -1) { + this.formAll[10].form11.rtull_ll2_jiemian = "直接流量输出"; + this.formAllBody["11"][4].data[0].isShow = false; + } else { + this.formAllBody["11"][4].data[0].isShow = true; + } + } + ); + this.$watch( + function () { + return this.formAll[2].form3.rtucgq_liuliang2; + }, + function (newVal, oldVal) { + if (!(newVal === "NF_LZX_2水龟")) { + this.formAllBody["11"][6].isShow = false; + } else { + this.formAllBody["11"][6].isShow = true; + } + } + ); + // 遥测站 采集标志 开关， 存储周期 rtuSaveCircle + this.$watch( + function () { + return this.formAll[0].form1.rtucjFlagTrans; + }, + function (newVal, oldVal) { + this.formAllBody["1"][0].data[3].isShow = !newVal; + } + ); + // 域名传输 + this.$watch( + function () { + return this.formAll[1].form2.rtuZxZx1RealmNameTrans; + }, + function (newVal, oldVal) { + this.formAllBody["2"][0].data[2].isShow = newVal; + this.formAllBody["2"][0].data[3].isShow = !newVal; + } + ); + this.$watch( + function () { + return this.formAll[1].form2.rtuZxZx2RealmNameTrans; + }, + function (newVal, oldVal) { + this.formAllBody["2"][2].data[2].isShow = newVal; + this.formAllBody["2"][2].data[3].isShow = !newVal; + } + ); + this.$watch( + function () { + return this.formAll[1].form2.rtuZxZx3RealmNameTrans; + }, + function (newVal, oldVal) { + this.formAllBody["2"][4].data[2].isShow = newVal; + this.formAllBody["2"][4].data[3].isShow = !newVal; + } + ); + this.$watch( + function () { + return this.formAll[1].form2.rtuZxZx4RealmNameTrans; + }, + function (newVal, oldVal) { + this.formAllBody["2"][6].data[2].isShow = newVal; + this.formAllBody["2"][6].data[3].isShow = !newVal; + } + ); + // 外置dtu设置，下拉框 + this.$watch( + function () { + return this.formAll[0].form1.rtuother_dtu_type; + }, + function (newVal, oldVal) { + var targetArr = [ + [true, true, true, true, false], + [true, true, false, false, false], + [false, false, false, false, true], + [false, false, false, false, false], + ]; + let select = [ + "LoRa-利尔达CN470", + "ManThink-门思科技", + "BC28电信管理平台NB", + "M5311移动平台NB", + ]; // 下拉框值，对应targetArr其他5个控件显示的4状态 + let strArr = [ + "JoinEUI", + "频率格式", + "上行频率", + "下行频率", + "电信NB服务ID", + ]; + this.formAllBody["1"][2].data.forEach((item, index, arr) => { + for (let i = 0; i < strArr.length; i++) { + if (arr[index].fieldName === strArr[i]) { + arr[index].isShow = targetArr[select.indexOf(newVal)][i]; + } + } + }); + // console.log(this.formAllBody['1'][2].data, select.indexOf(newVal),'_this.formAllBody[]') + } + ); + // 从机1 ，2设置 + this.$watch( + function () { + return this.formAll[2].form3.rtucgq_congji1; + }, + function (newVal, oldVal) { + var targetNameArr = [ + ["无效参数", "无效参数", "无效参数"], + ["抽水周期", "抽水超时", "排水超时"], + ["无效参数", "无效参数", "无效参数"], + ["采集周期", "通道延时", "演示递增"], + ["采集周期", "通道延时", "无效参数"], + ["查询周期", "抽水超时", "排水超时"], + ]; + var targetStatusArr = [ + [false, false, false], + [true, true, true], + [false, false, false], + [true, true, true], + [true, true, false], + [true, true, true], + ]; + let select = [ + "默认从机", + "电机驱动板（水质监测柜）", + "VGUS屏幕（水质监测柜）", + "二供（净水器）", + "二供（水箱）", + "主控板（5/9参数水质监测柜）", + ]; // 下拉框值，对应targetArr其他5个控件显示的4状态 + let strArr = ["rtucj1_canshu1", "rtucj1_canshu2", "rtucj1_canshu3"]; + this.formAllBody["7"][1].data.forEach((item, index, arr) => { + for (let i = 0; i < strArr.length; i++) { + if (arr[index].fieldIdentifier === strArr[i]) { + arr[index].isShow = targetStatusArr[select.indexOf(newVal)][i]; + arr[index].fieldName = targetNameArr[select.indexOf(newVal)][i]; + } + } + }); + // console.log(this.formAllBody['1'][2].data, select.indexOf(newVal),'_this.formAllBody[]') + } + ); + this.$watch( + function () { + return this.formAll[6].form7.rtucj_kaiguan1; + }, + function (newVal, oldVal) { + this.formAllBody["7"][1].isShow = newVal; + } + ); + this.$watch( + function () { + return this.formAll[6].form7.rtucj_kaiguan2; + }, + function (newVal, oldVal) { + this.formAllBody["7"][3].isShow = newVal; + } + ); + this.$watch( + function () { + return this.formAll[2].form3.rtucgq_congji2; + }, + function (newVal, oldVal) { + var targetNameArr = [ + ["无效参数", "无效参数", "无效参数"], + ["抽水周期", "抽水超时", "排水超时"], + ["无效参数", "无效参数", "无效参数"], + ["采集周期", "通道延时", "演示递增"], + ["采集周期", "通道延时", "无效参数"], + ["查询周期", "抽水超时", "排水超时"], + ]; + var targetStatusArr = [ + [false, false, false], + [true, true, true], + [false, false, false], + [true, true, true], + [true, true, false], + [true, true, true], + ]; + let select = [ + "默认从机", + "电机驱动板（水质监测柜）", + "VGUS屏幕（水质监测柜）", + "二供（净水器）", + "二供（水箱）", + "主控板（5/9参数水质监测柜）", + ]; // 下拉框值，对应targetArr其他5个控件显示的4状态 + let strArr = ["rtucj2_canshu1", "rtucj2_canshu2", "rtucj2_canshu3"]; + this.formAllBody["7"][3].data.forEach((item, index, arr) => { + for (let i = 0; i < strArr.length; i++) { + if (arr[index].fieldIdentifier === strArr[i]) { + arr[index].isShow = targetStatusArr[select.indexOf(newVal)][i]; + arr[index].fieldName = targetNameArr[select.indexOf(newVal)][i]; + } + } + }); + // console.log(this.formAllBody['1'][2].data, select.indexOf(newVal),'_this.formAllBody[]') + } + ); + // 流量计 流量槽 + this.$watch( + function () { + return this.formAll[10].form11.rtull_ll1_jiemian; + }, + function (newVal, oldVal) { + var targetNameArr = [ + [ + "安装高度", + "流量校正", + "淤积深度", + "无效参数", + "无效参数", + "无效参数", + "堰槽截面表高度分辨率", + ], + [ + "安装高度", + "流量校正", + "淤积深度", + "上地宽度", + "堰槽高度", + "无效参数", + "堰槽截面表高度分辨率", + ], + [ + "安装高度", + "流量校正", + "淤积深度", + "上地宽度", + "堰槽高度", + "无效参数", + "堰槽截面表高度分辨率", + ], + [ + "安装高度", + "流量校正", + "淤积深度", + "窄底宽度", + "堰槽高度", + "宽底宽度", + "堰槽截面表高度分辨率", + ], + [ + "安装高度", + "流量校正", + "淤积深度", + "无效参数", + "槽堰直径", + "无效参数", + "堰槽截面表高度分辨率", + ], + [ + "安装高度", + "流量校正", + "淤积深度", + "无效参数", + "无效参数", + "无效参数", + "堰槽截面表高度分辨率", + ], + [ + "溢流高度", + "流量校正", + "淤积深度", + "无效参数", + "槽堰高度", + "无效参数", + "堰槽截面表高度分辨率", + ], + [ + "溢流高度", + "流量校正", + "淤积深度", + "槽堰高度", + "槽序号", + "无效参数", + "堰槽截面表高度分辨率", + ], + ]; + var targetStatusArr = [ + [true, true, true, false, false, false, false], + [true, true, true, true, true, false, false], + [true, true, true, true, true, false, false], + [true, true, true, true, true, true, false], + [true, true, true, false, true, false, false], + [true, true, true, false, false, false, true], + [true, true, true, false, true, false, false], + [true, true, true, true, true, false, false], + ]; + let select = [ + "直接流量输出", + "三角堰", + "矩形堰", + "梯形堰", + "圆管", + "自定义截面", + "直角三角堰明渠", + "巴歇尔槽明渠", + ]; // 下拉框值， + let strArr = [ + "rtull_ll1_gaodu", + "rtull_ll1_jiaozheng", + "rtull_ll1_shendu", + "rtull_ll1_shangdikuandu", + "rtull_ll1_yancaogaodu", + "rtull_ll1_xiadikuandu", + "rtull_ll1_fenbian", + ]; + this.formAllBody["11"][1].data.forEach((item, index, arr) => { + for (let i = 0; i < strArr.length; i++) { + if (arr[index].fieldIdentifier === strArr[i]) { + arr[index].isShow = targetStatusArr[select.indexOf(newVal)][i]; + arr[index].fieldName = targetNameArr[select.indexOf(newVal)][i]; + } + } + }); + // console.log(this.formAllBody['1'][2].data, select.indexOf(newVal),'_this.formAllBody[]') + } + ); + this.$watch( + function () { + return this.formAll[10].form11.rtull_ll2_jiemian; + }, + function (newVal, oldVal) { + var targetNameArr = [ + [ + "安装高度", + "流量校正", + "淤积深度", + "无效参数", + "无效参数", + "无效参数", + "堰槽截面表高度分辨率", + ], + [ + "安装高度", + "流量校正", + "淤积深度", + "上地宽度", + "堰槽高度", + "无效参数", + "堰槽截面表高度分辨率", + ], + [ + "安装高度", + "流量校正", + "淤积深度", + "上地宽度", + "堰槽高度", + "无效参数", + "堰槽截面表高度分辨率", + ], + [ + "安装高度", + "流量校正", + "淤积深度", + "窄底宽度", + "堰槽高度", + "宽底宽度", + "堰槽截面表高度分辨率", + ], + [ + "安装高度", + "流量校正", + "淤积深度", + "无效参数", + "槽堰直径", + "无效参数", + "堰槽截面表高度分辨率", + ], + [ + "安装高度", + "流量校正", + "淤积深度", + "无效参数", + "无效参数", + "无效参数", + "堰槽截面表高度分辨率", + ], + [ + "溢流高度", + "流量校正", + "淤积深度", + "无效参数", + "槽堰高度", + "无效参数", + "堰槽截面表高度分辨率", + ], + [ + "溢流高度", + "流量校正", + "淤积深度", + "槽堰高度", + "槽序号", + "无效参数", + "堰槽截面表高度分辨率", + ], + ]; + var targetStatusArr = [ + [true, true, true, false, false, false, false], + [true, true, true, true, true, false, false], + [true, true, true, true, true, false, false], + [true, true, true, true, true, true, false], + [true, true, true, false, true, false, false], + [true, true, true, false, false, false, true], + [true, true, true, false, true, false, false], + [true, true, true, true, true, false, false], + ]; + let select = [ + "直接流量输出", + "三角堰", + "矩形堰", + "梯形堰", + "圆管", + "自定义截面", + "直角三角堰明渠", + "巴歇尔槽明渠", + ]; // 下拉框值， + let strArr = [ + "rtull_ll2_gaodu", + "rtull_ll2_jiaozheng", + "rtull_ll2_shendu", + "rtull_ll2_shangdikuandu", + "rtull_ll2_yancaogaodu", + "rtull_ll2_xiadikuandu", + "rtull_ll2_fenbian", + ]; + this.formAllBody["11"][4].data.forEach((item, index, arr) => { + for (let i = 0; i < strArr.length; i++) { + if (arr[index].fieldIdentifier === strArr[i]) { + arr[index].isShow = targetStatusArr[select.indexOf(newVal)][i]; + arr[index].fieldName = targetNameArr[select.indexOf(newVal)][i]; + } + } + }); + // console.log(this.formAllBody['1'][2].data, select.indexOf(newVal),'_this.formAllBody[]') + } + ); + // 蒸发皿 + this.$watch( + function () { + return this.formAll[2].form3.rtucgq_zfly; + }, + function (newVal, oldVal) { + var targetNameArr = [ + ["安装高度", "量程", "最小加水量"], + ["无效参数", "无效参数", "最小加水量"], + ["无效参数", "无效参数", "最小加水量"], + ]; + var targetStatusArr = [ + [true, true, true], + [false, false, true], + [false, false, true], + ]; + let select = ["独立蒸发皿", "水位值1", "水位值2"]; // 下拉框值，对应targetArr其他5个控件显示的4状态 + let strArr = ["rtuzf_gaodu", "rtuzf_liangcheng", "rtuzf_zuixiao"]; + this.formAllBody["12"][0].data.forEach((item, index, arr) => { + for (let i = 0; i < strArr.length; i++) { + if (arr[index].fieldIdentifier === strArr[i]) { + arr[index].isShow = targetStatusArr[select.indexOf(newVal)][i]; + arr[index].fieldName = targetNameArr[select.indexOf(newVal)][i]; + } + } + }); + // console.log(this.formAllBody['1'][2].data, select.indexOf(newVal),'_this.formAllBody[]') + } + ); + // 4am， 存储周期 rtuSaveCircle + this.$watch( + function () { + return this.formAll[2].form3.rtucgq_liuliang1; + }, + function (newVal, oldVal) { + var targetNameArr = [ + [ + "安装高度", + "流量校正", + "淤积深度", + "无效参数", + "无效参数", + "无效参数", + "堰槽截面表高度分辨率", + ], + ]; + var targetStatusArr = [ + [true, true, true, false, false, false, false], + ]; + let select = ["独立蒸发皿", "水位值1", "水位值2"]; // 下拉框值，对应targetArr其他5个控件显示的4状态 + let strArr = ["rtuzf_gaodu", "rtuzf_liangcheng", "rtuzf_zuixiao"]; + this.formAllBody["11"][1].data.forEach((item, index, arr) => { + for (let i = 0; i < strArr.length; i++) { + if (arr[index].fieldIdentifier === strArr[i]) { + arr[index].isShow = targetStatusArr[select.indexOf(newVal)][i]; + arr[index].fieldName = targetNameArr[select.indexOf(newVal)][i]; + } + } + }); + // console.log(this.formAllBody['1'][2].data, select.indexOf(newVal),'_this.formAllBody[]') + } + ); + }, }, created() { - this.getSiteList().then(res => { + this.getSiteList().then((res) => { // this.querySiteList[0].rtuStationCode // this.initPage(this.querySite); // this.getRtuHistoryList() @@ -1691,7 +1939,12 @@ this.formControl(); // console.log(666) - } + }, + updated() { + // if(this.formAll.length !==0){ + // this.initWatch() + // } + }, // beforeRouteLeave (to, from, next) { // // 导航离开该组件的对应路由时调用 // // 可以访问组件实例 `this` @@ -1752,12 +2005,12 @@ margin: 11px 0 11px 0 !important; .el-form-item__label { // text-align: right; - width: 160px !important; + width: 180px !important; text-align: right !important; color: var(--white) !important; } .el-form-item__content { - margin: 0 0 0 160px !important; + margin: 0 0 0 180px !important; .el-select { width: 100% !important; .el-input .el-input__inner { diff --git a/src/components/ConfigManager/RtuConfig.vue b/src/components/ConfigManager/RtuConfig.vue index 2aa6409..60226ac 100644 --- a/src/components/ConfigManager/RtuConfig.vue +++ b/src/components/ConfigManager/RtuConfig.vue @@ -2,7 +2,7 @@
搜索 --> - - + - - 搜索 - + 搜索 + > - + 回显 - + 暂存 - + 暂存回显 - + 提交
- + - + 回显历史记录
@@ -96,10 +123,10 @@
@@ -131,7 +158,9 @@ :key="item.fieldIdentifier" :class="{ 'el-col-class': true, - stop: item.hasOwnProperty('isShow') ? !item.isShow : false + stop: item.hasOwnProperty('isShow') + ? !item.isShow + : false, }" > { - if (item.name === "外置DTU设置") { - arr[index].isShow = newVal; - } - }); - } - ); - // GPRS，LORA开关 - this.$watch( - function() { - return this.formAll[0].form1.rtuInnerMode; - }, - function(newVal, oldVal) { - this.formAllBody["1"].forEach((item, index, arr) => { - if (item.name === "内置LoRa相关配置") { - arr[index].isShow = newVal === "LORA" ? true : false; - } - }); - this.formAllBody["2"].forEach((item, index, arr) => { - if (item.name === "中心站1") { - arr[index].isShow = newVal === "GPRS" ? true : false; - } - if (item.name === "中心站2") { - arr[index].isShow = newVal === "GPRS" ? true : false; - } - if (item.name === "中心站3") { - arr[index].isShow = newVal === "GPRS" ? true : false; - } - if (item.name === "中心站4(备份站)") { - arr[index].isShow = newVal === "GPRS" ? true : false; - } - if (item.name === "VPN专网设置1") { - arr[index].isShow = newVal === "GPRS" ? true : false; - } - if (item.name === "VPN专网设置2") { - arr[index].isShow = newVal === "GPRS" ? true : false; - } - if (item.name === "NBIOT网络设置") { - arr[index].isShow = newVal === "GPRS" ? true : false; - } - if (item.name === "中心站其他设置") { - arr[index].isShow = newVal === "GPRS" ? true : false; - } - if (item.name === "远程后台服务器设置") { - arr[index].isShow = newVal === "GPRS" ? true : false; - } - }); - } - ); - // 水位计雷达 - this.$watch( - function() { - return this.formAll[2].form3.rtucgq_shuiwei1; - }, - function(newVal, oldVal) { - if ( - !( - (newVal === "NF-WGX-5小雷达水位计") | - (newVal === "NF-WGX-6大雷达水位计") - ) - ) { - this.formAllBody["9"][2].isShow = false; - } else { - this.formAllBody["9"][2].isShow = true; - } - } - ); - this.$watch( - function() { - return this.formAll[2].form3.rtucgq_shuiwei2; - }, - function(newVal, oldVal) { - if ( - !( - (newVal === "NF-WGX-5小雷达水位计") | - (newVal === "NF-WGX-6大雷达水位计") - ) - ) { - this.formAllBody["9"][2].isShow = false; - } else { - this.formAllBody["9"][4].isShow = true; - } - } - ); - // 流量计水鬼 - this.$watch( - function() { - return this.formAll[2].form3.rtucgq_liuliang1; - }, - function(newVal, oldVal) { - var targetNameArr = [ - "直接流量输出", - "安装高度", - "流量校正", - "淤积深度", - "无效参数", - "无效参数", - "无效参数", - "堰槽截面表高度分辨率" - ]; - var targetStatusArr = [ - false, - true, - true, - true, - false, - false, - false, - false - ]; - // let select= ['直接流量输出','三角堰','矩形堰','梯形堰','圆管','自定义截面','直角三角堰明渠','巴歇尔槽明渠'] // 下拉框值， - let strArr = [ - "rtull_ll1_jiemian", - "rtull_ll1_gaodu", - "rtull_ll1_jiaozheng", - "rtull_ll1_shendu", - "rtull_ll1_shangdikuandu", - "rtull_ll1_yancaogaodu", - "rtull_ll1_xiadikuandu", - "rtull_ll1_fenbian" - ]; - this.formAllBody["11"][1].data.forEach((item, index, arr) => { - for (let i = 0; i < strArr.length; i++) { - if (arr[index].fieldIdentifier === strArr[i]) { - arr[index].isShow = targetStatusArr[select.indexOf(newVal)][i]; - arr[index].fieldName = targetNameArr[select.indexOf(newVal)][i]; - } - } - }); - } - ); - this.$watch( - function() { - return this.formAll[2].form3.rtucgq_liuliang2; - }, - function(newVal, oldVal) { - if (!(newVal === "NF_LZX_2水龟")) { - this.formAllBody["11"][6].isShow = false; - } else { - this.formAllBody["11"][6].isShow = true; - } - } - ); - // 遥测站 采集标志 开关， 存储周期 rtuSaveCircle - this.$watch( - function() { - return this.formAll[0].form1.rtucjFlagTrans; - }, - function(newVal, oldVal) { - this.formAllBody["1"][0].data[3].isShow = !newVal; - } - ); - // 域名传输 - this.$watch( - function() { - return this.formAll[1].form2.rtuZxZx1RealmNameTrans; - }, - function(newVal, oldVal) { - this.formAllBody["2"][0].data[2].isShow = newVal; - this.formAllBody["2"][0].data[3].isShow = !newVal; - } - ); - this.$watch( - function() { - return this.formAll[1].form2.rtuZxZx2RealmNameTrans; - }, - function(newVal, oldVal) { - this.formAllBody["2"][2].data[2].isShow = newVal; - this.formAllBody["2"][2].data[3].isShow = !newVal; - } - ); - this.$watch( - function() { - return this.formAll[1].form2.rtuZxZx3RealmNameTrans; - }, - function(newVal, oldVal) { - this.formAllBody["2"][4].data[2].isShow = newVal; - this.formAllBody["2"][4].data[3].isShow = !newVal; - } - ); - this.$watch( - function() { - return this.formAll[1].form2.rtuZxZx4RealmNameTrans; - }, - function(newVal, oldVal) { - this.formAllBody["2"][6].data[2].isShow = newVal; - this.formAllBody["2"][6].data[3].isShow = !newVal; - } - ); - // 外置dtu设置，下拉框 - this.$watch( - function() { - return this.formAll[0].form1.rtuother_dtu_type; - }, - function(newVal, oldVal) { - var targetArr = [ - [true, true, true, true, false], - [true, true, false, false, false], - [false, false, false, false, true], - [false, false, false, false, false] - ]; - let select = [ - "LoRa-利尔达CN470", - "ManThink-门思科技", - "BC28电信管理平台NB", - "M5311移动平台NB" - ]; // 下拉框值，对应targetArr其他5个控件显示的4状态 - let strArr = [ - "JoinEUI", - "频率格式", - "上行频率", - "下行频率", - "电信NB服务ID" - ]; - this.formAllBody["1"][2].data.forEach((item, index, arr) => { - for (let i = 0; i < strArr.length; i++) { - if (arr[index].fieldName === strArr[i]) { - arr[index].isShow = targetArr[select.indexOf(newVal)][i]; - } - } - }); - // console.log(this.formAllBody['1'][2].data, select.indexOf(newVal),'_this.formAllBody[]') - } - ); - // 从机1 ，2设置 - this.$watch( - function() { - return this.formAll[2].form3.rtucgq_congji1; - }, - function(newVal, oldVal) { - var targetNameArr = [ - ["无效参数", "无效参数", "无效参数"], - ["抽水周期", "抽水超时", "排水超时"], - ["无效参数", "无效参数", "无效参数"], - ["采集周期", "通道延时", "演示递增"], - ["采集周期", "通道延时", "无效参数"], - ["查询周期", "抽水超时", "排水超时"] - ]; - var targetStatusArr = [ - [false, false, false], - [true, true, true], - [false, false, false], - [true, true, true], - [true, true, false], - [true, true, true] - ]; - let select = [ - "默认从机", - "电机驱动板（水质监测柜）", - "VGUS屏幕（水质监测柜）", - "二供（净水器）", - "二供（水箱）", - "主控板（5/9参数水质监测柜）" - ]; // 下拉框值，对应targetArr其他5个控件显示的4状态 - let strArr = ["rtucj1_canshu1", "rtucj1_canshu2", "rtucj1_canshu3"]; - this.formAllBody["7"][1].data.forEach((item, index, arr) => { - for (let i = 0; i < strArr.length; i++) { - if (arr[index].fieldIdentifier === strArr[i]) { - arr[index].isShow = targetStatusArr[select.indexOf(newVal)][i]; - arr[index].fieldName = targetNameArr[select.indexOf(newVal)][i]; - } - } - }); - // console.log(this.formAllBody['1'][2].data, select.indexOf(newVal),'_this.formAllBody[]') - } - ); - this.$watch( - function() { - return this.formAll[2].form3.rtucgq_congji2; - }, - function(newVal, oldVal) { - var targetNameArr = [ - ["无效参数", "无效参数", "无效参数"], - ["抽水周期", "抽水超时", "排水超时"], - ["无效参数", "无效参数", "无效参数"], - ["采集周期", "通道延时", "演示递增"], - ["采集周期", "通道延时", "无效参数"], - ["查询周期", "抽水超时", "排水超时"] - ]; - var targetStatusArr = [ - [false, false, false], - [true, true, true], - [false, false, false], - [true, true, true], - [true, true, false], - [true, true, true] - ]; - let select = [ - "默认从机", - "电机驱动板（水质监测柜）", - "VGUS屏幕（水质监测柜）", - "二供（净水器）", - "二供（水箱）", - "主控板（5/9参数水质监测柜）" - ]; // 下拉框值，对应targetArr其他5个控件显示的4状态 - let strArr = ["rtucj2_canshu1", "rtucj2_canshu2", "rtucj2_canshu3"]; - this.formAllBody["7"][3].data.forEach((item, index, arr) => { - for (let i = 0; i < strArr.length; i++) { - if (arr[index].fieldIdentifier === strArr[i]) { - arr[index].isShow = targetStatusArr[select.indexOf(newVal)][i]; - arr[index].fieldName = targetNameArr[select.indexOf(newVal)][i]; - } - } - }); - // console.log(this.formAllBody['1'][2].data, select.indexOf(newVal),'_this.formAllBody[]') - } - ); - // 流量计 流量槽 - this.$watch( - function() { - return this.formAll[10].form11.rtull_ll1_jiemian; - }, - function(newVal, oldVal) { - var targetNameArr = [ - [ - "安装高度", - "流量校正", - "淤积深度", - "无效参数", - "无效参数", - "无效参数", - "堰槽截面表高度分辨率" - ], - [ - "安装高度", - "流量校正", - "淤积深度", - "上地宽度", - "堰槽高度", - "无效参数", - "堰槽截面表高度分辨率" - ], - [ - "安装高度", - "流量校正", - "淤积深度", - "上地宽度", - "堰槽高度", - "无效参数", - "堰槽截面表高度分辨率" - ], - [ - "安装高度", - "流量校正", - "淤积深度", - "窄底宽度", - "堰槽高度", - "宽底宽度", - "堰槽截面表高度分辨率" - ], - [ - "安装高度", - "流量校正", - "淤积深度", - "无效参数", - "槽堰直径", - "无效参数", - "堰槽截面表高度分辨率" - ], - [ - "安装高度", - "流量校正", - "淤积深度", - "无效参数", - "无效参数", - "无效参数", - "堰槽截面表高度分辨率" - ], - [ - "溢流高度", - "流量校正", - "淤积深度", - "无效参数", - "槽堰高度", - "无效参数", - "堰槽截面表高度分辨率" - ], - [ - "溢流高度", - "流量校正", - "淤积深度", - "槽堰高度", - "槽序号", - "无效参数", - "堰槽截面表高度分辨率" - ] - ]; - var targetStatusArr = [ - [true, true, true, false, false, false, false], - [true, true, true, true, true, false, false], - [true, true, true, true, true, false, false], - [true, true, true, true, true, true, false], - [true, true, true, false, true, false, false], - [true, true, true, false, false, false, true], - [true, true, true, false, true, false, false], - [true, true, true, true, true, false, false] - ]; - let select = [ - "直接流量输出", - "三角堰", - "矩形堰", - "梯形堰", - "圆管", - "自定义截面", - "直角三角堰明渠", - "巴歇尔槽明渠" - ]; // 下拉框值， - let strArr = [ - "rtull_ll1_gaodu", - "rtull_ll1_jiaozheng", - "rtull_ll1_shendu", - "rtull_ll1_shangdikuandu", - "rtull_ll1_yancaogaodu", - "rtull_ll1_xiadikuandu", - "rtull_ll1_fenbian" - ]; - this.formAllBody["11"][1].data.forEach((item, index, arr) => { - for (let i = 0; i < strArr.length; i++) { - if (arr[index].fieldIdentifier === strArr[i]) { - arr[index].isShow = targetStatusArr[select.indexOf(newVal)][i]; - arr[index].fieldName = targetNameArr[select.indexOf(newVal)][i]; - } - } - }); - // console.log(this.formAllBody['1'][2].data, select.indexOf(newVal),'_this.formAllBody[]') - } - ); - // 蒸发皿 - this.$watch( - function() { - return this.formAll[2].form3.rtucgq_zfly; - }, - function(newVal, oldVal) { - var targetNameArr = [ - ["安装高度", "量程", "最小加水量"], - ["无效参数", "无效参数", "最小加水量"], - ["无效参数", "无效参数", "最小加水量"] - ]; - var targetStatusArr = [ - [true, true, true], - [false, false, true], - [false, false, true] - ]; - let select = ["独立蒸发皿", "水位值1", "水位值2"]; // 下拉框值，对应targetArr其他5个控件显示的4状态 - let strArr = ["rtuzf_gaodu", "rtuzf_liangcheng", "rtuzf_zuixiao"]; - this.formAllBody["12"][0].data.forEach((item, index, arr) => { - for (let i = 0; i < strArr.length; i++) { - if (arr[index].fieldIdentifier === strArr[i]) { - arr[index].isShow = targetStatusArr[select.indexOf(newVal)][i]; - arr[index].fieldName = targetNameArr[select.indexOf(newVal)][i]; - } - } - }); - // console.log(this.formAllBody['1'][2].data, select.indexOf(newVal),'_this.formAllBody[]') - } - ); - // 4am， 存储周期 rtuSaveCircle - this.$watch( - function() { - return this.formAll[2].form3.rtucgq_liuliang1; - }, - function(newVal, oldVal) { - var targetNameArr = [ - [ - "安装高度", - "流量校正", - "淤积深度", - "无效参数", - "无效参数", - "无效参数", - "堰槽截面表高度分辨率" - ] - ]; - var targetStatusArr = [[true, true, true, false, false, false, false]]; - let select = ["独立蒸发皿", "水位值1", "水位值2"]; // 下拉框值，对应targetArr其他5个控件显示的4状态 - let strArr = ["rtuzf_gaodu", "rtuzf_liangcheng", "rtuzf_zuixiao"]; - this.formAllBody["11"][1].data.forEach((item, index, arr) => { - for (let i = 0; i < strArr.length; i++) { - if (arr[index].fieldIdentifier === strArr[i]) { - arr[index].isShow = targetStatusArr[select.indexOf(newVal)][i]; - arr[index].fieldName = targetNameArr[select.indexOf(newVal)][i]; - } - } - }); - // console.log(this.formAllBody['1'][2].data, select.indexOf(newVal),'_this.formAllBody[]') - } - ); + this.initWatch(); // bottom }, methods: { - search(){ + search() { this.formAll = []; - this.querySite= [] + this.querySite = []; // console.log(this.querySite,'querySite') - this.getSiteList(this.searchCode) + this.getSiteList(this.searchCode); }, - switchChange(val){ + switchChange(val) { // console.log(val,this.formAll[0].form1,'change') }, switchClick(val) { @@ -1093,20 +635,35 @@ }, temStorageEcho() { // this.activeIndex = '0' - if(localStorage.getItem(this.querySite[1])){ - this.formAll = JSON.parse(localStorage.getItem(name)); - this.$message({ message: "暂存回显成功", type: "success" }); + if ( + this.querySite.length === 2 && + localStorage.getItem(this.querySite[1]) + ) { + this.formAll = JSON.parse(localStorage.getItem(this.querySite[1])); + console.log(this.formAll, this.querySite[1], "this.formAll"); + + this.$message({ + message: `${this.querySite[1]}暂存回显成功`, + type: "success", + }); } else { this.$message({ message: "无暂存内容", type: "warning" }); } // console.log(JSON.parse(sessionStorage.getItem(name)),111) }, temStorage() { - try { - localStorage.setItem(this.querySite[1], JSON.stringify(this.formAll)); - this.$message({ message: `${this.querySite[1]}保存成功`, type: "success" }); - } catch (err) { - this.$message({ message: err, type: "warning" }); + if (this.querySite.length === 2) { + try { + localStorage.removeItem(this.querySite[1]); + // console.log(this.formAll,'this.formAll') + localStorage.setItem(this.querySite[1], JSON.stringify(this.formAll)); + this.$message({ + message: `${this.querySite[1]}保存成功`, + type: "success", + }); + } catch (err) { + this.$message({ message: err, type: "warning" }); + } } // sessionStorage.setItem(name,'999') // // location.href='http://192.168.16.189:8080/#/ConfigManager/RtuConfig' @@ -1115,17 +672,63 @@ // console.log(sessionStorage.setItem(name),111) }, sunmitAll() { + console.log(this.formAll, "formAll"); + // 水位计 流量计 蒸发皿 rtucgq_llly1 + // let shuiWeiArr = ['独立水位计','流量计内置水位计','蒸发皿'] + // let liuLiangArr = ['内置水位计','外置独立水位计'] + // let zhengFaMinArr = ['独立蒸发皿','水位值1','水位值2'] + if ( + this.formAll[2].form3.rtucgq_swly1 === "蒸发皿" && + this.formAll[2].form3.rtucgq_zfly === "水位值1" + ) { + this.$message({ + message: `水位计1和蒸发皿数据冲突！`, + type: "warning", + }); + return; + } + if ( + this.formAll[2].form3.rtucgq_swly2 === "蒸发皿" && + this.formAll[2].form3.rtucgq_zfly === "水位值2" + ) { + this.$message({ + message: `水位计2和蒸发皿数据冲突！`, + type: "warning", + }); + return; + } + if ( + this.formAll[2].form3.rtucgq_swly1 === "流量计内置水位计" && + this.formAll[2].form3.rtucgq_llly1 === "外置独立水位计" + ) { + this.$message({ + message: `水位计1和流量计1数据冲突！`, + type: "warning", + }); + return; + } + if ( + this.formAll[2].form3.rtucgq_swly2 === "流量计内置水位计" && + this.formAll[2].form3.rtucgq_llly2 === "外置独立水位计" + ) { + this.$message({ + message: `水位计2和流量计2数据冲突！`, + type: "warning", + }); + return; + } + // return ; // 提交所有表单，循环校验所有表单，当有个表单校验失败就break，提示该表单校验失败，根据校验成功总数或者无失败确定完成，组装数据发送到后台 var successCount = 0; var successFlag = false; for (var i = 0; i < 15; i++) { - this.$refs["form"][i].validate(valid => { + this.$refs["form"][i].validate((valid) => { if (valid) { successCount++; } else { this.$message({ message: `${this.siteNameList[i]} 校验失败，请查看`, - type: "warning" + type: "warning", }); // alert(`${this.siteNameList[i]} 校验失败，请查看`); // this.$notify({ @@ -1166,8 +769,8 @@ rtuEvaporatingDishSetting: this.formAll[11].form12, rtuSoilSettler: this.formAll[12].form13, rtu4To20Setting: this.formAll[13].form14, - rtuOtherSetting: this.formAll[14].form15 - } + rtuOtherSetting: this.formAll[14].form15, + }, }; // 之前初始化时将3处的两个数组生成了需要的字段，现在需要把每处16个字段组装成两数组，删除不需要的字段,转化方法暂时写在这里 function dealInputSwitch( @@ -1236,7 +839,7 @@ ] = rtucamera_jiabaoNew; this.$http .post(`${this.nozzle.rTUSettingServiceUpdate}`, parmas) - .then(res => { + .then((res) => { // console.log(res,'rTUSettingServiceUpdate') this.echoClick(); }); @@ -1278,11 +881,11 @@ }, selectChange(val) { // this.querySite = [] - this.rtuHistoryId='' + this.rtuHistoryId = ""; // console.log(val,'val') // if(this.querySite.length!==2) return; this.echoClick(val); - this.getRtuHistoryList() + this.getRtuHistoryList(); }, selectChange1(val) { // console.log(val,'val') input搜索 @@ -1294,7 +897,7 @@ // this.echoClick(val); }, async initPage(site) { - this.loading = true + this.loading = true; // 切换站点后去请求历史下拉框 // this.getRtuHistoryList() // 回显接口请求数据 将水文传感里面3处特殊的控件需要的值，用请求数据遍历生成表单需要的字段，因为这3处的动态表单使用的是死的字段，其他的对应的表单数据赋值给对应表单就能回显了、 @@ -1320,7 +923,7 @@ "rtuEvaporatingDishSetting", "rtuSoilSettler", "rtu4To20Setting", - "rtuOtherSetting" + "rtuOtherSetting", ]; // console.log(this.formAll,resData,'ressssss') // this.formAll={} @@ -1402,7 +1005,7 @@ this.formAll.push(obj); // console.log(this.formAll,this.stCode,'this.formAll') } - this.loading = false + this.loading = false; }, async initPage2(rtuCode) { // 回显接口请求数据 将水文传感里面3处特殊的控件需要的值，用请求数据遍历生成表单需要的字段，因为这3处的动态表单使用的是死的字段，其他的对应的表单数据赋值给对应表单就能回显了、 @@ -1425,7 +1028,7 @@ "rtuEvaporatingDishSetting", "rtuSoilSettler", "rtu4To20Setting", - "rtuOtherSetting" + "rtuOtherSetting", ]; console.log(this.formAll, resData, "ressssss"); // this.formAll={} @@ -1598,36 +1201,55 @@ return temp; } // 生成表单控件的接口 - this.$http.post(this.nozzle.rtuPageQueryPage).then(res => { + this.$http.post(this.nozzle.rtuPageQueryPage).then((res) => { var dataRes = res.data.data; // console.log(dataRes,'dataRes') for (var i in dataRes) { if (dataRes[i].length !== 0) { dataRes[i].forEach((item, index, arr) => { - this.rules[item.fieldIdentifier] = [ - { - validator: (rule, value, callback) => { - this.validatorAll( - rule, - value, - callback, - item.validatorType, - item.validatorRules, - item.validatorErrorText - ); + if (item.fieldType !== 5) { + this.rules[item.fieldIdentifier] = [ + { + validator: (rule, value, callback) => { + this.validatorAll( + rule, + value, + callback, + item.validatorType, + item.validatorRules, + item.validatorErrorText + ); + }, + trigger: "change", }, - trigger: "change" - } - ]; + ]; + } else if (item.fieldType === 5) { + this.rules[item.fieldIdentifier] = [ + { + validator: (rule, value, callback) => { + this.validatorAll( + rule, + value, + callback, + item.validatorType, + item.validatorRules, + item.validatorErrorText + ); + }, + trigger: "change", + }, + { required: true, message: "必填", trigger: "change" }, + ]; + } }); - let sub_titleList = dataRes[i].map(item => { + let sub_titleList = dataRes[i].map((item) => { return item.subTitle; }); var newObj = []; // 根据小标题去重 - uniq(sub_titleList).forEach(item => { + uniq(sub_titleList).forEach((item) => { var obj = { name: item, data: [], isShow: true, isBlock: true }; - var data = dataRes[i].forEach(l => { + var data = dataRes[i].forEach((l) => { l.isShow = true; if ( l.subTitle === item && @@ -1651,11 +1273,11 @@ console.log(this.formAllBody, "999"); }); }, - async getSiteList(val='') { - // ,{stCode:this.querySite} + async getSiteList(val = "") { + // ,{stCode:this.querySite} await this.$http .post(`${this.nozzle.rTUSettingServiceQueryList}?stCode=${val}`) - .then(res => { + .then((res) => { // console.log(res.data.data,'resss') this.querySiteList = res.data.data; // this.querySiteList.push({ @@ -1675,15 +1297,641 @@ await this.$http //`${this.nozzle.queryRTUSettingHistory}?stCode=${this.querySite}` .post(`${this.nozzle.queryRTUSettingHistory}?rtuCode=${rtuCode}`) - .then(res => { + .then((res) => { // console.log(res.data,'resss') this.rtuHistoryList = res.data.data; // this.querySite = this.querySiteList[0].rtuStationCode; }); - } + }, + initWatch() { + // console.log(this.formAll,this.formAllBody,'this.formAll[0]') + //// 第一个函数就是处理你要监听的属性，只要将其return出去就行 + // 外置dtu开关 + this.$watch( + function () { + return this.formAll[0].form1.rtuOutDtu; + }, + function (newVal, oldVal) { + this.formAllBody["1"].forEach((item, index, arr) => { + if (item.name === "外置DTU设置") { + arr[index].isShow = newVal; + } + }); + } + ); + // GPRS，LORA开关 + this.$watch( + function () { + return this.formAll[0].form1.rtuInnerMode; + }, + function (newVal, oldVal) { + this.formAllBody["1"].forEach((item, index, arr) => { + if (item.name === "内置LoRa相关配置") { + arr[index].isShow = newVal === "LORA" ? true : false; + } + }); + this.formAllBody["2"].forEach((item, index, arr) => { + if (item.name === "中心站1") { + arr[index].isShow = newVal === "GPRS" ? true : false; + } + if (item.name === "中心站2") { + arr[index].isShow = newVal === "GPRS" ? true : false; + } + if (item.name === "中心站3") { + arr[index].isShow = newVal === "GPRS" ? true : false; + } + if (item.name === "中心站4(备份站)") { + arr[index].isShow = newVal === "GPRS" ? true : false; + } + if (item.name === "VPN专网设置1") { + arr[index].isShow = newVal === "GPRS" ? true : false; + } + if (item.name === "VPN专网设置2") { + arr[index].isShow = newVal === "GPRS" ? true : false; + } + if (item.name === "NBIOT网络设置") { + arr[index].isShow = newVal === "GPRS" ? true : false; + } + if (item.name === "中心站其他设置") { + arr[index].isShow = newVal === "GPRS" ? true : false; + } + if (item.name === "远程后台服务器设置") { + arr[index].isShow = newVal === "GPRS" ? true : false; + } + }); + } + ); + // 水位计雷达 + this.$watch( + function () { + return this.formAll[2].form3.rtucgq_shuiwei1; + }, + function (newVal, oldVal) { + if ( + !( + (newVal === "NF-WGX-5小雷达水位计") | + (newVal === "NF-WGX-6大雷达水位计") + ) + ) { + this.formAllBody["9"][2].isShow = false; + } else { + this.formAllBody["9"][2].isShow = true; + } + } + ); + this.$watch( + function () { + return this.formAll[2].form3.rtucgq_shuiwei2; + }, + function (newVal, oldVal) { + if ( + !( + (newVal === "NF-WGX-5小雷达水位计") | + (newVal === "NF-WGX-6大雷达水位计") + ) + ) { + this.formAllBody["9"][2].isShow = false; + } else { + this.formAllBody["9"][4].isShow = true; + } + } + ); + // 流量计水龟 流量计1 流量计1设置 + this.$watch( + function () { + return this.formAll[2].form3.rtucgq_liuliang1; + }, + function (newVal, oldVal) { + let arr = [ + "4-20mA流量计", + "NACH-FL900流速仪", + "LWGY涡轮流量计", + "SM_311水表", + ]; + if (arr.indexOf(newVal) !== -1) { + this.formAll[10].form11.rtull_ll1_jiemian = "直接流量输出"; + this.formAllBody["11"][1].data[0].isShow = false; + } else { + this.formAllBody["11"][1].data[0].isShow = true; + } + } + ); + this.$watch( + function () { + return this.formAll[2].form3.rtucgq_liuliang2; + }, + function (newVal, oldVal) { + let arr = [ + "4-20mA流量计", + "NACH-FL900流速仪", + "LWGY涡轮流量计", + "SM_311水表", + ]; + if (arr.indexOf(newVal) !== -1) { + this.formAll[10].form11.rtull_ll2_jiemian = "直接流量输出"; + this.formAllBody["11"][4].data[0].isShow = false; + } else { + this.formAllBody["11"][4].data[0].isShow = true; + } + } + ); + this.$watch( + function () { + return this.formAll[2].form3.rtucgq_liuliang2; + }, + function (newVal, oldVal) { + if (!(newVal === "NF_LZX_2水龟")) { + this.formAllBody["11"][6].isShow = false; + } else { + this.formAllBody["11"][6].isShow = true; + } + } + ); + // 遥测站 采集标志 开关， 存储周期 rtuSaveCircle + this.$watch( + function () { + return this.formAll[0].form1.rtucjFlagTrans; + }, + function (newVal, oldVal) { + this.formAllBody["1"][0].data[3].isShow = !newVal; + } + ); + // 域名传输 + this.$watch( + function () { + return this.formAll[1].form2.rtuZxZx1RealmNameTrans; + }, + function (newVal, oldVal) { + this.formAllBody["2"][0].data[2].isShow = newVal; + this.formAllBody["2"][0].data[3].isShow = !newVal; + } + ); + this.$watch( + function () { + return this.formAll[1].form2.rtuZxZx2RealmNameTrans; + }, + function (newVal, oldVal) { + this.formAllBody["2"][2].data[2].isShow = newVal; + this.formAllBody["2"][2].data[3].isShow = !newVal; + } + ); + this.$watch( + function () { + return this.formAll[1].form2.rtuZxZx3RealmNameTrans; + }, + function (newVal, oldVal) { + this.formAllBody["2"][4].data[2].isShow = newVal; + this.formAllBody["2"][4].data[3].isShow = !newVal; + } + ); + this.$watch( + function () { + return this.formAll[1].form2.rtuZxZx4RealmNameTrans; + }, + function (newVal, oldVal) { + this.formAllBody["2"][6].data[2].isShow = newVal; + this.formAllBody["2"][6].data[3].isShow = !newVal; + } + ); + // 外置dtu设置，下拉框 + this.$watch( + function () { + return this.formAll[0].form1.rtuother_dtu_type; + }, + function (newVal, oldVal) { + var targetArr = [ + [true, true, true, true, false], + [true, true, false, false, false], + [false, false, false, false, true], + [false, false, false, false, false], + ]; + let select = [ + "LoRa-利尔达CN470", + "ManThink-门思科技", + "BC28电信管理平台NB", + "M5311移动平台NB", + ]; // 下拉框值，对应targetArr其他5个控件显示的4状态 + let strArr = [ + "JoinEUI", + "频率格式", + "上行频率", + "下行频率", + "电信NB服务ID", + ]; + this.formAllBody["1"][2].data.forEach((item, index, arr) => { + for (let i = 0; i < strArr.length; i++) { + if (arr[index].fieldName === strArr[i]) { + arr[index].isShow = targetArr[select.indexOf(newVal)][i]; + } + } + }); + // console.log(this.formAllBody['1'][2].data, select.indexOf(newVal),'_this.formAllBody[]') + } + ); + // 从机1 ，2设置 + this.$watch( + function () { + return this.formAll[2].form3.rtucgq_congji1; + }, + function (newVal, oldVal) { + var targetNameArr = [ + ["无效参数", "无效参数", "无效参数"], + ["抽水周期", "抽水超时", "排水超时"], + ["无效参数", "无效参数", "无效参数"], + ["采集周期", "通道延时", "演示递增"], + ["采集周期", "通道延时", "无效参数"], + ["查询周期", "抽水超时", "排水超时"], + ]; + var targetStatusArr = [ + [false, false, false], + [true, true, true], + [false, false, false], + [true, true, true], + [true, true, false], + [true, true, true], + ]; + let select = [ + "默认从机", + "电机驱动板（水质监测柜）", + "VGUS屏幕（水质监测柜）", + "二供（净水器）", + "二供（水箱）", + "主控板（5/9参数水质监测柜）", + ]; // 下拉框值，对应targetArr其他5个控件显示的4状态 + let strArr = ["rtucj1_canshu1", "rtucj1_canshu2", "rtucj1_canshu3"]; + this.formAllBody["7"][1].data.forEach((item, index, arr) => { + for (let i = 0; i < strArr.length; i++) { + if (arr[index].fieldIdentifier === strArr[i]) { + arr[index].isShow = targetStatusArr[select.indexOf(newVal)][i]; + arr[index].fieldName = targetNameArr[select.indexOf(newVal)][i]; + } + } + }); + // console.log(this.formAllBody['1'][2].data, select.indexOf(newVal),'_this.formAllBody[]') + } + ); + this.$watch( + function () { + return this.formAll[6].form7.rtucj_kaiguan1; + }, + function (newVal, oldVal) { + this.formAllBody["7"][1].isShow = newVal; + } + ); + this.$watch( + function () { + return this.formAll[6].form7.rtucj_kaiguan2; + }, + function (newVal, oldVal) { + this.formAllBody["7"][3].isShow = newVal; + } + ); + this.$watch( + function () { + return this.formAll[2].form3.rtucgq_congji2; + }, + function (newVal, oldVal) { + var targetNameArr = [ + ["无效参数", "无效参数", "无效参数"], + ["抽水周期", "抽水超时", "排水超时"], + ["无效参数", "无效参数", "无效参数"], + ["采集周期", "通道延时", "演示递增"], + ["采集周期", "通道延时", "无效参数"], + ["查询周期", "抽水超时", "排水超时"], + ]; + var targetStatusArr = [ + [false, false, false], + [true, true, true], + [false, false, false], + [true, true, true], + [true, true, false], + [true, true, true], + ]; + let select = [ + "默认从机", + "电机驱动板（水质监测柜）", + "VGUS屏幕（水质监测柜）", + "二供（净水器）", + "二供（水箱）", + "主控板（5/9参数水质监测柜）", + ]; // 下拉框值，对应targetArr其他5个控件显示的4状态 + let strArr = ["rtucj2_canshu1", "rtucj2_canshu2", "rtucj2_canshu3"]; + this.formAllBody["7"][3].data.forEach((item, index, arr) => { + for (let i = 0; i < strArr.length; i++) { + if (arr[index].fieldIdentifier === strArr[i]) { + arr[index].isShow = targetStatusArr[select.indexOf(newVal)][i]; + arr[index].fieldName = targetNameArr[select.indexOf(newVal)][i]; + } + } + }); + // console.log(this.formAllBody['1'][2].data, select.indexOf(newVal),'_this.formAllBody[]') + } + ); + // 流量计 流量槽 + this.$watch( + function () { + return this.formAll[10].form11.rtull_ll1_jiemian; + }, + function (newVal, oldVal) { + var targetNameArr = [ + [ + "安装高度", + "流量校正", + "淤积深度", + "无效参数", + "无效参数", + "无效参数", + "堰槽截面表高度分辨率", + ], + [ + "安装高度", + "流量校正", + "淤积深度", + "上地宽度", + "堰槽高度", + "无效参数", + "堰槽截面表高度分辨率", + ], + [ + "安装高度", + "流量校正", + "淤积深度", + "上地宽度", + "堰槽高度", + "无效参数", + "堰槽截面表高度分辨率", + ], + [ + "安装高度", + "流量校正", + "淤积深度", + "窄底宽度", + "堰槽高度", + "宽底宽度", + "堰槽截面表高度分辨率", + ], + [ + "安装高度", + "流量校正", + "淤积深度", + "无效参数", + "槽堰直径", + "无效参数", + "堰槽截面表高度分辨率", + ], + [ + "安装高度", + "流量校正", + "淤积深度", + "无效参数", + "无效参数", + "无效参数", + "堰槽截面表高度分辨率", + ], + [ + "溢流高度", + "流量校正", + "淤积深度", + "无效参数", + "槽堰高度", + "无效参数", + "堰槽截面表高度分辨率", + ], + [ + "溢流高度", + "流量校正", + "淤积深度", + "槽堰高度", + "槽序号", + "无效参数", + "堰槽截面表高度分辨率", + ], + ]; + var targetStatusArr = [ + [true, true, true, false, false, false, false], + [true, true, true, true, true, false, false], + [true, true, true, true, true, false, false], + [true, true, true, true, true, true, false], + [true, true, true, false, true, false, false], + [true, true, true, false, false, false, true], + [true, true, true, false, true, false, false], + [true, true, true, true, true, false, false], + ]; + let select = [ + "直接流量输出", + "三角堰", + "矩形堰", + "梯形堰", + "圆管", + "自定义截面", + "直角三角堰明渠", + "巴歇尔槽明渠", + ]; // 下拉框值， + let strArr = [ + "rtull_ll1_gaodu", + "rtull_ll1_jiaozheng", + "rtull_ll1_shendu", + "rtull_ll1_shangdikuandu", + "rtull_ll1_yancaogaodu", + "rtull_ll1_xiadikuandu", + "rtull_ll1_fenbian", + ]; + this.formAllBody["11"][1].data.forEach((item, index, arr) => { + for (let i = 0; i < strArr.length; i++) { + if (arr[index].fieldIdentifier === strArr[i]) { + arr[index].isShow = targetStatusArr[select.indexOf(newVal)][i]; + arr[index].fieldName = targetNameArr[select.indexOf(newVal)][i]; + } + } + }); + // console.log(this.formAllBody['1'][2].data, select.indexOf(newVal),'_this.formAllBody[]') + } + ); + this.$watch( + function () { + return this.formAll[10].form11.rtull_ll2_jiemian; + }, + function (newVal, oldVal) { + var targetNameArr = [ + [ + "安装高度", + "流量校正", + "淤积深度", + "无效参数", + "无效参数", + "无效参数", + "堰槽截面表高度分辨率", + ], + [ + "安装高度", + "流量校正", + "淤积深度", + "上地宽度", + "堰槽高度", + "无效参数", + "堰槽截面表高度分辨率", + ], + [ + "安装高度", + "流量校正", + "淤积深度", + "上地宽度", + "堰槽高度", + "无效参数", + "堰槽截面表高度分辨率", + ], + [ + "安装高度", + "流量校正", + "淤积深度", + "窄底宽度", + "堰槽高度", + "宽底宽度", + "堰槽截面表高度分辨率", + ], + [ + "安装高度", + "流量校正", + "淤积深度", + "无效参数", + "槽堰直径", + "无效参数", + "堰槽截面表高度分辨率", + ], + [ + "安装高度", + "流量校正", + "淤积深度", + "无效参数", + "无效参数", + "无效参数", + "堰槽截面表高度分辨率", + ], + [ + "溢流高度", + "流量校正", + "淤积深度", + "无效参数", + "槽堰高度", + "无效参数", + "堰槽截面表高度分辨率", + ], + [ + "溢流高度", + "流量校正", + "淤积深度", + "槽堰高度", + "槽序号", + "无效参数", + "堰槽截面表高度分辨率", + ], + ]; + var targetStatusArr = [ + [true, true, true, false, false, false, false], + [true, true, true, true, true, false, false], + [true, true, true, true, true, false, false], + [true, true, true, true, true, true, false], + [true, true, true, false, true, false, false], + [true, true, true, false, false, false, true], + [true, true, true, false, true, false, false], + [true, true, true, true, true, false, false], + ]; + let select = [ + "直接流量输出", + "三角堰", + "矩形堰", + "梯形堰", + "圆管", + "自定义截面", + "直角三角堰明渠", + "巴歇尔槽明渠", + ]; // 下拉框值， + let strArr = [ + "rtull_ll2_gaodu", + "rtull_ll2_jiaozheng", + "rtull_ll2_shendu", + "rtull_ll2_shangdikuandu", + "rtull_ll2_yancaogaodu", + "rtull_ll2_xiadikuandu", + "rtull_ll2_fenbian", + ]; + this.formAllBody["11"][4].data.forEach((item, index, arr) => { + for (let i = 0; i < strArr.length; i++) { + if (arr[index].fieldIdentifier === strArr[i]) { + arr[index].isShow = targetStatusArr[select.indexOf(newVal)][i]; + arr[index].fieldName = targetNameArr[select.indexOf(newVal)][i]; + } + } + }); + // console.log(this.formAllBody['1'][2].data, select.indexOf(newVal),'_this.formAllBody[]') + } + ); + // 蒸发皿 + this.$watch( + function () { + return this.formAll[2].form3.rtucgq_zfly; + }, + function (newVal, oldVal) { + var targetNameArr = [ + ["安装高度", "量程", "最小加水量"], + ["无效参数", "无效参数", "最小加水量"], + ["无效参数", "无效参数", "最小加水量"], + ]; + var targetStatusArr = [ + [true, true, true], + [false, false, true], + [false, false, true], + ]; + let select = ["独立蒸发皿", "水位值1", "水位值2"]; // 下拉框值，对应targetArr其他5个控件显示的4状态 + let strArr = ["rtuzf_gaodu", "rtuzf_liangcheng", "rtuzf_zuixiao"]; + this.formAllBody["12"][0].data.forEach((item, index, arr) => { + for (let i = 0; i < strArr.length; i++) { + if (arr[index].fieldIdentifier === strArr[i]) { + arr[index].isShow = targetStatusArr[select.indexOf(newVal)][i]; + arr[index].fieldName = targetNameArr[select.indexOf(newVal)][i]; + } + } + }); + // console.log(this.formAllBody['1'][2].data, select.indexOf(newVal),'_this.formAllBody[]') + } + ); + // 4am， 存储周期 rtuSaveCircle + this.$watch( + function () { + return this.formAll[2].form3.rtucgq_liuliang1; + }, + function (newVal, oldVal) { + var targetNameArr = [ + [ + "安装高度", + "流量校正", + "淤积深度", + "无效参数", + "无效参数", + "无效参数", + "堰槽截面表高度分辨率", + ], + ]; + var targetStatusArr = [ + [true, true, true, false, false, false, false], + ]; + let select = ["独立蒸发皿", "水位值1", "水位值2"]; // 下拉框值，对应targetArr其他5个控件显示的4状态 + let strArr = ["rtuzf_gaodu", "rtuzf_liangcheng", "rtuzf_zuixiao"]; + this.formAllBody["11"][1].data.forEach((item, index, arr) => { + for (let i = 0; i < strArr.length; i++) { + if (arr[index].fieldIdentifier === strArr[i]) { + arr[index].isShow = targetStatusArr[select.indexOf(newVal)][i]; + arr[index].fieldName = targetNameArr[select.indexOf(newVal)][i]; + } + } + }); + // console.log(this.formAllBody['1'][2].data, select.indexOf(newVal),'_this.formAllBody[]') + } + ); + }, }, created() { - this.getSiteList().then(res => { + this.getSiteList().then((res) => { // this.querySiteList[0].rtuStationCode // this.initPage(this.querySite); // this.getRtuHistoryList() @@ -1691,7 +1939,12 @@ this.formControl(); // console.log(666) - } + }, + updated() { + // if(this.formAll.length !==0){ + // this.initWatch() + // } + }, // beforeRouteLeave (to, from, next) { // // 导航离开该组件的对应路由时调用 // // 可以访问组件实例 `this` @@ -1752,12 +2005,12 @@ margin: 11px 0 11px 0 !important; .el-form-item__label { // text-align: right; - width: 160px !important; + width: 180px !important; text-align: right !important; color: var(--white) !important; } .el-form-item__content { - margin: 0 0 0 160px !important; + margin: 0 0 0 180px !important; .el-select { width: 100% !important; .el-input .el-input__inner { diff --git a/src/components/ConfigManager/SiteManagement.vue b/src/components/ConfigManager/SiteManagement.vue index 404080d..44b4598 100644 --- a/src/components/ConfigManager/SiteManagement.vue +++ b/src/components/ConfigManager/SiteManagement.vue @@ -218,7 +218,7 @@
@@ -745,30 +745,6 @@ } ] }, - rules1: { - ruleId: [ - { - required: true, - message: "请选择规则引擎", - trigger: "blur" - } - ], - referRainStationSt: [ - { - required: true, - message: "请选择雨量站", - trigger: "blur", - }, - ], - - isEnable: [ - { - required: true, - message: "请选择是否启用", - trigger: "blur" - } - ], - }, value: [], // 站点管理/所属区域数组 syscityList: [], @@ -929,9 +905,7 @@ } else { httpurl = this.nozzle.siterepairconfigmodify; } - this.$refs[form].validate((valid) => { - if (valid) { - this.$http.post(httpurl, this.configForm).then((res) => { + this.$http.post(httpurl, this.configForm).then(res => { console.log(res); if (res.data.code === 200) { this.configtrue = false; @@ -944,11 +918,6 @@ showClose: true }); }); - - }else{ - console.log("完善信息") - } - }) }, //响应地图组件的确定，拾取坐标 SendLngLat(lonlat) { @@ -1156,9 +1125,22 @@ //添加站点 case "create": this.iscodefalse = false; - this.projectObj = {}; this.yzaddflag = true; this.title = "新增站点"; + this.projectList = this.allPlatSite.map((item) => { + return { + id: item.id, + key: item.platformName, + value: item.platformCode, + areaId: item.area, + }; + }); + this.projectObj = {}; + setTimeout(() => { + if(this.$refs.ruleForm){ + this.$refs.ruleForm.clearValidate(); + } + }, 0); break; //编辑站点 case "update": @@ -1182,6 +1164,11 @@ this.ruleForm[key] = data[key]; } this.yzaddflag = true; + setTimeout(() => { + if(this.$refs.ruleForm){ + this.$refs.ruleForm.clearValidate(); + } + }, 0); break; //配置因子 case "config": diff --git a/src/components/ConfigManager/RtuConfig.vue b/src/components/ConfigManager/RtuConfig.vue index 2aa6409..60226ac 100644 --- a/src/components/ConfigManager/RtuConfig.vue +++ b/src/components/ConfigManager/RtuConfig.vue @@ -2,7 +2,7 @@
搜索 --> - - + - - 搜索 - + 搜索 + > - + 回显 - + 暂存 - + 暂存回显 - + 提交
- + - + 回显历史记录
@@ -96,10 +123,10 @@
@@ -131,7 +158,9 @@ :key="item.fieldIdentifier" :class="{ 'el-col-class': true, - stop: item.hasOwnProperty('isShow') ? !item.isShow : false + stop: item.hasOwnProperty('isShow') + ? !item.isShow + : false, }" > { - if (item.name === "外置DTU设置") { - arr[index].isShow = newVal; - } - }); - } - ); - // GPRS，LORA开关 - this.$watch( - function() { - return this.formAll[0].form1.rtuInnerMode; - }, - function(newVal, oldVal) { - this.formAllBody["1"].forEach((item, index, arr) => { - if (item.name === "内置LoRa相关配置") { - arr[index].isShow = newVal === "LORA" ? true : false; - } - }); - this.formAllBody["2"].forEach((item, index, arr) => { - if (item.name === "中心站1") { - arr[index].isShow = newVal === "GPRS" ? true : false; - } - if (item.name === "中心站2") { - arr[index].isShow = newVal === "GPRS" ? true : false; - } - if (item.name === "中心站3") { - arr[index].isShow = newVal === "GPRS" ? true : false; - } - if (item.name === "中心站4(备份站)") { - arr[index].isShow = newVal === "GPRS" ? true : false; - } - if (item.name === "VPN专网设置1") { - arr[index].isShow = newVal === "GPRS" ? true : false; - } - if (item.name === "VPN专网设置2") { - arr[index].isShow = newVal === "GPRS" ? true : false; - } - if (item.name === "NBIOT网络设置") { - arr[index].isShow = newVal === "GPRS" ? true : false; - } - if (item.name === "中心站其他设置") { - arr[index].isShow = newVal === "GPRS" ? true : false; - } - if (item.name === "远程后台服务器设置") { - arr[index].isShow = newVal === "GPRS" ? true : false; - } - }); - } - ); - // 水位计雷达 - this.$watch( - function() { - return this.formAll[2].form3.rtucgq_shuiwei1; - }, - function(newVal, oldVal) { - if ( - !( - (newVal === "NF-WGX-5小雷达水位计") | - (newVal === "NF-WGX-6大雷达水位计") - ) - ) { - this.formAllBody["9"][2].isShow = false; - } else { - this.formAllBody["9"][2].isShow = true; - } - } - ); - this.$watch( - function() { - return this.formAll[2].form3.rtucgq_shuiwei2; - }, - function(newVal, oldVal) { - if ( - !( - (newVal === "NF-WGX-5小雷达水位计") | - (newVal === "NF-WGX-6大雷达水位计") - ) - ) { - this.formAllBody["9"][2].isShow = false; - } else { - this.formAllBody["9"][4].isShow = true; - } - } - ); - // 流量计水鬼 - this.$watch( - function() { - return this.formAll[2].form3.rtucgq_liuliang1; - }, - function(newVal, oldVal) { - var targetNameArr = [ - "直接流量输出", - "安装高度", - "流量校正", - "淤积深度", - "无效参数", - "无效参数", - "无效参数", - "堰槽截面表高度分辨率" - ]; - var targetStatusArr = [ - false, - true, - true, - true, - false, - false, - false, - false - ]; - // let select= ['直接流量输出','三角堰','矩形堰','梯形堰','圆管','自定义截面','直角三角堰明渠','巴歇尔槽明渠'] // 下拉框值， - let strArr = [ - "rtull_ll1_jiemian", - "rtull_ll1_gaodu", - "rtull_ll1_jiaozheng", - "rtull_ll1_shendu", - "rtull_ll1_shangdikuandu", - "rtull_ll1_yancaogaodu", - "rtull_ll1_xiadikuandu", - "rtull_ll1_fenbian" - ]; - this.formAllBody["11"][1].data.forEach((item, index, arr) => { - for (let i = 0; i < strArr.length; i++) { - if (arr[index].fieldIdentifier === strArr[i]) { - arr[index].isShow = targetStatusArr[select.indexOf(newVal)][i]; - arr[index].fieldName = targetNameArr[select.indexOf(newVal)][i]; - } - } - }); - } - ); - this.$watch( - function() { - return this.formAll[2].form3.rtucgq_liuliang2; - }, - function(newVal, oldVal) { - if (!(newVal === "NF_LZX_2水龟")) { - this.formAllBody["11"][6].isShow = false; - } else { - this.formAllBody["11"][6].isShow = true; - } - } - ); - // 遥测站 采集标志 开关， 存储周期 rtuSaveCircle - this.$watch( - function() { - return this.formAll[0].form1.rtucjFlagTrans; - }, - function(newVal, oldVal) { - this.formAllBody["1"][0].data[3].isShow = !newVal; - } - ); - // 域名传输 - this.$watch( - function() { - return this.formAll[1].form2.rtuZxZx1RealmNameTrans; - }, - function(newVal, oldVal) { - this.formAllBody["2"][0].data[2].isShow = newVal; - this.formAllBody["2"][0].data[3].isShow = !newVal; - } - ); - this.$watch( - function() { - return this.formAll[1].form2.rtuZxZx2RealmNameTrans; - }, - function(newVal, oldVal) { - this.formAllBody["2"][2].data[2].isShow = newVal; - this.formAllBody["2"][2].data[3].isShow = !newVal; - } - ); - this.$watch( - function() { - return this.formAll[1].form2.rtuZxZx3RealmNameTrans; - }, - function(newVal, oldVal) { - this.formAllBody["2"][4].data[2].isShow = newVal; - this.formAllBody["2"][4].data[3].isShow = !newVal; - } - ); - this.$watch( - function() { - return this.formAll[1].form2.rtuZxZx4RealmNameTrans; - }, - function(newVal, oldVal) { - this.formAllBody["2"][6].data[2].isShow = newVal; - this.formAllBody["2"][6].data[3].isShow = !newVal; - } - ); - // 外置dtu设置，下拉框 - this.$watch( - function() { - return this.formAll[0].form1.rtuother_dtu_type; - }, - function(newVal, oldVal) { - var targetArr = [ - [true, true, true, true, false], - [true, true, false, false, false], - [false, false, false, false, true], - [false, false, false, false, false] - ]; - let select = [ - "LoRa-利尔达CN470", - "ManThink-门思科技", - "BC28电信管理平台NB", - "M5311移动平台NB" - ]; // 下拉框值，对应targetArr其他5个控件显示的4状态 - let strArr = [ - "JoinEUI", - "频率格式", - "上行频率", - "下行频率", - "电信NB服务ID" - ]; - this.formAllBody["1"][2].data.forEach((item, index, arr) => { - for (let i = 0; i < strArr.length; i++) { - if (arr[index].fieldName === strArr[i]) { - arr[index].isShow = targetArr[select.indexOf(newVal)][i]; - } - } - }); - // console.log(this.formAllBody['1'][2].data, select.indexOf(newVal),'_this.formAllBody[]') - } - ); - // 从机1 ，2设置 - this.$watch( - function() { - return this.formAll[2].form3.rtucgq_congji1; - }, - function(newVal, oldVal) { - var targetNameArr = [ - ["无效参数", "无效参数", "无效参数"], - ["抽水周期", "抽水超时", "排水超时"], - ["无效参数", "无效参数", "无效参数"], - ["采集周期", "通道延时", "演示递增"], - ["采集周期", "通道延时", "无效参数"], - ["查询周期", "抽水超时", "排水超时"] - ]; - var targetStatusArr = [ - [false, false, false], - [true, true, true], - [false, false, false], - [true, true, true], - [true, true, false], - [true, true, true] - ]; - let select = [ - "默认从机", - "电机驱动板（水质监测柜）", - "VGUS屏幕（水质监测柜）", - "二供（净水器）", - "二供（水箱）", - "主控板（5/9参数水质监测柜）" - ]; // 下拉框值，对应targetArr其他5个控件显示的4状态 - let strArr = ["rtucj1_canshu1", "rtucj1_canshu2", "rtucj1_canshu3"]; - this.formAllBody["7"][1].data.forEach((item, index, arr) => { - for (let i = 0; i < strArr.length; i++) { - if (arr[index].fieldIdentifier === strArr[i]) { - arr[index].isShow = targetStatusArr[select.indexOf(newVal)][i]; - arr[index].fieldName = targetNameArr[select.indexOf(newVal)][i]; - } - } - }); - // console.log(this.formAllBody['1'][2].data, select.indexOf(newVal),'_this.formAllBody[]') - } - ); - this.$watch( - function() { - return this.formAll[2].form3.rtucgq_congji2; - }, - function(newVal, oldVal) { - var targetNameArr = [ - ["无效参数", "无效参数", "无效参数"], - ["抽水周期", "抽水超时", "排水超时"], - ["无效参数", "无效参数", "无效参数"], - ["采集周期", "通道延时", "演示递增"], - ["采集周期", "通道延时", "无效参数"], - ["查询周期", "抽水超时", "排水超时"] - ]; - var targetStatusArr = [ - [false, false, false], - [true, true, true], - [false, false, false], - [true, true, true], - [true, true, false], - [true, true, true] - ]; - let select = [ - "默认从机", - "电机驱动板（水质监测柜）", - "VGUS屏幕（水质监测柜）", - "二供（净水器）", - "二供（水箱）", - "主控板（5/9参数水质监测柜）" - ]; // 下拉框值，对应targetArr其他5个控件显示的4状态 - let strArr = ["rtucj2_canshu1", "rtucj2_canshu2", "rtucj2_canshu3"]; - this.formAllBody["7"][3].data.forEach((item, index, arr) => { - for (let i = 0; i < strArr.length; i++) { - if (arr[index].fieldIdentifier === strArr[i]) { - arr[index].isShow = targetStatusArr[select.indexOf(newVal)][i]; - arr[index].fieldName = targetNameArr[select.indexOf(newVal)][i]; - } - } - }); - // console.log(this.formAllBody['1'][2].data, select.indexOf(newVal),'_this.formAllBody[]') - } - ); - // 流量计 流量槽 - this.$watch( - function() { - return this.formAll[10].form11.rtull_ll1_jiemian; - }, - function(newVal, oldVal) { - var targetNameArr = [ - [ - "安装高度", - "流量校正", - "淤积深度", - "无效参数", - "无效参数", - "无效参数", - "堰槽截面表高度分辨率" - ], - [ - "安装高度", - "流量校正", - "淤积深度", - "上地宽度", - "堰槽高度", - "无效参数", - "堰槽截面表高度分辨率" - ], - [ - "安装高度", - "流量校正", - "淤积深度", - "上地宽度", - "堰槽高度", - "无效参数", - "堰槽截面表高度分辨率" - ], - [ - "安装高度", - "流量校正", - "淤积深度", - "窄底宽度", - "堰槽高度", - "宽底宽度", - "堰槽截面表高度分辨率" - ], - [ - "安装高度", - "流量校正", - "淤积深度", - "无效参数", - "槽堰直径", - "无效参数", - "堰槽截面表高度分辨率" - ], - [ - "安装高度", - "流量校正", - "淤积深度", - "无效参数", - "无效参数", - "无效参数", - "堰槽截面表高度分辨率" - ], - [ - "溢流高度", - "流量校正", - "淤积深度", - "无效参数", - "槽堰高度", - "无效参数", - "堰槽截面表高度分辨率" - ], - [ - "溢流高度", - "流量校正", - "淤积深度", - "槽堰高度", - "槽序号", - "无效参数", - "堰槽截面表高度分辨率" - ] - ]; - var targetStatusArr = [ - [true, true, true, false, false, false, false], - [true, true, true, true, true, false, false], - [true, true, true, true, true, false, false], - [true, true, true, true, true, true, false], - [true, true, true, false, true, false, false], - [true, true, true, false, false, false, true], - [true, true, true, false, true, false, false], - [true, true, true, true, true, false, false] - ]; - let select = [ - "直接流量输出", - "三角堰", - "矩形堰", - "梯形堰", - "圆管", - "自定义截面", - "直角三角堰明渠", - "巴歇尔槽明渠" - ]; // 下拉框值， - let strArr = [ - "rtull_ll1_gaodu", - "rtull_ll1_jiaozheng", - "rtull_ll1_shendu", - "rtull_ll1_shangdikuandu", - "rtull_ll1_yancaogaodu", - "rtull_ll1_xiadikuandu", - "rtull_ll1_fenbian" - ]; - this.formAllBody["11"][1].data.forEach((item, index, arr) => { - for (let i = 0; i < strArr.length; i++) { - if (arr[index].fieldIdentifier === strArr[i]) { - arr[index].isShow = targetStatusArr[select.indexOf(newVal)][i]; - arr[index].fieldName = targetNameArr[select.indexOf(newVal)][i]; - } - } - }); - // console.log(this.formAllBody['1'][2].data, select.indexOf(newVal),'_this.formAllBody[]') - } - ); - // 蒸发皿 - this.$watch( - function() { - return this.formAll[2].form3.rtucgq_zfly; - }, - function(newVal, oldVal) { - var targetNameArr = [ - ["安装高度", "量程", "最小加水量"], - ["无效参数", "无效参数", "最小加水量"], - ["无效参数", "无效参数", "最小加水量"] - ]; - var targetStatusArr = [ - [true, true, true], - [false, false, true], - [false, false, true] - ]; - let select = ["独立蒸发皿", "水位值1", "水位值2"]; // 下拉框值，对应targetArr其他5个控件显示的4状态 - let strArr = ["rtuzf_gaodu", "rtuzf_liangcheng", "rtuzf_zuixiao"]; - this.formAllBody["12"][0].data.forEach((item, index, arr) => { - for (let i = 0; i < strArr.length; i++) { - if (arr[index].fieldIdentifier === strArr[i]) { - arr[index].isShow = targetStatusArr[select.indexOf(newVal)][i]; - arr[index].fieldName = targetNameArr[select.indexOf(newVal)][i]; - } - } - }); - // console.log(this.formAllBody['1'][2].data, select.indexOf(newVal),'_this.formAllBody[]') - } - ); - // 4am， 存储周期 rtuSaveCircle - this.$watch( - function() { - return this.formAll[2].form3.rtucgq_liuliang1; - }, - function(newVal, oldVal) { - var targetNameArr = [ - [ - "安装高度", - "流量校正", - "淤积深度", - "无效参数", - "无效参数", - "无效参数", - "堰槽截面表高度分辨率" - ] - ]; - var targetStatusArr = [[true, true, true, false, false, false, false]]; - let select = ["独立蒸发皿", "水位值1", "水位值2"]; // 下拉框值，对应targetArr其他5个控件显示的4状态 - let strArr = ["rtuzf_gaodu", "rtuzf_liangcheng", "rtuzf_zuixiao"]; - this.formAllBody["11"][1].data.forEach((item, index, arr) => { - for (let i = 0; i < strArr.length; i++) { - if (arr[index].fieldIdentifier === strArr[i]) { - arr[index].isShow = targetStatusArr[select.indexOf(newVal)][i]; - arr[index].fieldName = targetNameArr[select.indexOf(newVal)][i]; - } - } - }); - // console.log(this.formAllBody['1'][2].data, select.indexOf(newVal),'_this.formAllBody[]') - } - ); + this.initWatch(); // bottom }, methods: { - search(){ + search() { this.formAll = []; - this.querySite= [] + this.querySite = []; // console.log(this.querySite,'querySite') - this.getSiteList(this.searchCode) + this.getSiteList(this.searchCode); }, - switchChange(val){ + switchChange(val) { // console.log(val,this.formAll[0].form1,'change') }, switchClick(val) { @@ -1093,20 +635,35 @@ }, temStorageEcho() { // this.activeIndex = '0' - if(localStorage.getItem(this.querySite[1])){ - this.formAll = JSON.parse(localStorage.getItem(name)); - this.$message({ message: "暂存回显成功", type: "success" }); + if ( + this.querySite.length === 2 && + localStorage.getItem(this.querySite[1]) + ) { + this.formAll = JSON.parse(localStorage.getItem(this.querySite[1])); + console.log(this.formAll, this.querySite[1], "this.formAll"); + + this.$message({ + message: `${this.querySite[1]}暂存回显成功`, + type: "success", + }); } else { this.$message({ message: "无暂存内容", type: "warning" }); } // console.log(JSON.parse(sessionStorage.getItem(name)),111) }, temStorage() { - try { - localStorage.setItem(this.querySite[1], JSON.stringify(this.formAll)); - this.$message({ message: `${this.querySite[1]}保存成功`, type: "success" }); - } catch (err) { - this.$message({ message: err, type: "warning" }); + if (this.querySite.length === 2) { + try { + localStorage.removeItem(this.querySite[1]); + // console.log(this.formAll,'this.formAll') + localStorage.setItem(this.querySite[1], JSON.stringify(this.formAll)); + this.$message({ + message: `${this.querySite[1]}保存成功`, + type: "success", + }); + } catch (err) { + this.$message({ message: err, type: "warning" }); + } } // sessionStorage.setItem(name,'999') // // location.href='http://192.168.16.189:8080/#/ConfigManager/RtuConfig' @@ -1115,17 +672,63 @@ // console.log(sessionStorage.setItem(name),111) }, sunmitAll() { + console.log(this.formAll, "formAll"); + // 水位计 流量计 蒸发皿 rtucgq_llly1 + // let shuiWeiArr = ['独立水位计','流量计内置水位计','蒸发皿'] + // let liuLiangArr = ['内置水位计','外置独立水位计'] + // let zhengFaMinArr = ['独立蒸发皿','水位值1','水位值2'] + if ( + this.formAll[2].form3.rtucgq_swly1 === "蒸发皿" && + this.formAll[2].form3.rtucgq_zfly === "水位值1" + ) { + this.$message({ + message: `水位计1和蒸发皿数据冲突！`, + type: "warning", + }); + return; + } + if ( + this.formAll[2].form3.rtucgq_swly2 === "蒸发皿" && + this.formAll[2].form3.rtucgq_zfly === "水位值2" + ) { + this.$message({ + message: `水位计2和蒸发皿数据冲突！`, + type: "warning", + }); + return; + } + if ( + this.formAll[2].form3.rtucgq_swly1 === "流量计内置水位计" && + this.formAll[2].form3.rtucgq_llly1 === "外置独立水位计" + ) { + this.$message({ + message: `水位计1和流量计1数据冲突！`, + type: "warning", + }); + return; + } + if ( + this.formAll[2].form3.rtucgq_swly2 === "流量计内置水位计" && + this.formAll[2].form3.rtucgq_llly2 === "外置独立水位计" + ) { + this.$message({ + message: `水位计2和流量计2数据冲突！`, + type: "warning", + }); + return; + } + // return ; // 提交所有表单，循环校验所有表单，当有个表单校验失败就break，提示该表单校验失败，根据校验成功总数或者无失败确定完成，组装数据发送到后台 var successCount = 0; var successFlag = false; for (var i = 0; i < 15; i++) { - this.$refs["form"][i].validate(valid => { + this.$refs["form"][i].validate((valid) => { if (valid) { successCount++; } else { this.$message({ message: `${this.siteNameList[i]} 校验失败，请查看`, - type: "warning" + type: "warning", }); // alert(`${this.siteNameList[i]} 校验失败，请查看`); // this.$notify({ @@ -1166,8 +769,8 @@ rtuEvaporatingDishSetting: this.formAll[11].form12, rtuSoilSettler: this.formAll[12].form13, rtu4To20Setting: this.formAll[13].form14, - rtuOtherSetting: this.formAll[14].form15 - } + rtuOtherSetting: this.formAll[14].form15, + }, }; // 之前初始化时将3处的两个数组生成了需要的字段，现在需要把每处16个字段组装成两数组，删除不需要的字段,转化方法暂时写在这里 function dealInputSwitch( @@ -1236,7 +839,7 @@ ] = rtucamera_jiabaoNew; this.$http .post(`${this.nozzle.rTUSettingServiceUpdate}`, parmas) - .then(res => { + .then((res) => { // console.log(res,'rTUSettingServiceUpdate') this.echoClick(); }); @@ -1278,11 +881,11 @@ }, selectChange(val) { // this.querySite = [] - this.rtuHistoryId='' + this.rtuHistoryId = ""; // console.log(val,'val') // if(this.querySite.length!==2) return; this.echoClick(val); - this.getRtuHistoryList() + this.getRtuHistoryList(); }, selectChange1(val) { // console.log(val,'val') input搜索 @@ -1294,7 +897,7 @@ // this.echoClick(val); }, async initPage(site) { - this.loading = true + this.loading = true; // 切换站点后去请求历史下拉框 // this.getRtuHistoryList() // 回显接口请求数据 将水文传感里面3处特殊的控件需要的值，用请求数据遍历生成表单需要的字段，因为这3处的动态表单使用的是死的字段，其他的对应的表单数据赋值给对应表单就能回显了、 @@ -1320,7 +923,7 @@ "rtuEvaporatingDishSetting", "rtuSoilSettler", "rtu4To20Setting", - "rtuOtherSetting" + "rtuOtherSetting", ]; // console.log(this.formAll,resData,'ressssss') // this.formAll={} @@ -1402,7 +1005,7 @@ this.formAll.push(obj); // console.log(this.formAll,this.stCode,'this.formAll') } - this.loading = false + this.loading = false; }, async initPage2(rtuCode) { // 回显接口请求数据 将水文传感里面3处特殊的控件需要的值，用请求数据遍历生成表单需要的字段，因为这3处的动态表单使用的是死的字段，其他的对应的表单数据赋值给对应表单就能回显了、 @@ -1425,7 +1028,7 @@ "rtuEvaporatingDishSetting", "rtuSoilSettler", "rtu4To20Setting", - "rtuOtherSetting" + "rtuOtherSetting", ]; console.log(this.formAll, resData, "ressssss"); // this.formAll={} @@ -1598,36 +1201,55 @@ return temp; } // 生成表单控件的接口 - this.$http.post(this.nozzle.rtuPageQueryPage).then(res => { + this.$http.post(this.nozzle.rtuPageQueryPage).then((res) => { var dataRes = res.data.data; // console.log(dataRes,'dataRes') for (var i in dataRes) { if (dataRes[i].length !== 0) { dataRes[i].forEach((item, index, arr) => { - this.rules[item.fieldIdentifier] = [ - { - validator: (rule, value, callback) => { - this.validatorAll( - rule, - value, - callback, - item.validatorType, - item.validatorRules, - item.validatorErrorText - ); + if (item.fieldType !== 5) { + this.rules[item.fieldIdentifier] = [ + { + validator: (rule, value, callback) => { + this.validatorAll( + rule, + value, + callback, + item.validatorType, + item.validatorRules, + item.validatorErrorText + ); + }, + trigger: "change", }, - trigger: "change" - } - ]; + ]; + } else if (item.fieldType === 5) { + this.rules[item.fieldIdentifier] = [ + { + validator: (rule, value, callback) => { + this.validatorAll( + rule, + value, + callback, + item.validatorType, + item.validatorRules, + item.validatorErrorText + ); + }, + trigger: "change", + }, + { required: true, message: "必填", trigger: "change" }, + ]; + } }); - let sub_titleList = dataRes[i].map(item => { + let sub_titleList = dataRes[i].map((item) => { return item.subTitle; }); var newObj = []; // 根据小标题去重 - uniq(sub_titleList).forEach(item => { + uniq(sub_titleList).forEach((item) => { var obj = { name: item, data: [], isShow: true, isBlock: true }; - var data = dataRes[i].forEach(l => { + var data = dataRes[i].forEach((l) => { l.isShow = true; if ( l.subTitle === item && @@ -1651,11 +1273,11 @@ console.log(this.formAllBody, "999"); }); }, - async getSiteList(val='') { - // ,{stCode:this.querySite} + async getSiteList(val = "") { + // ,{stCode:this.querySite} await this.$http .post(`${this.nozzle.rTUSettingServiceQueryList}?stCode=${val}`) - .then(res => { + .then((res) => { // console.log(res.data.data,'resss') this.querySiteList = res.data.data; // this.querySiteList.push({ @@ -1675,15 +1297,641 @@ await this.$http //`${this.nozzle.queryRTUSettingHistory}?stCode=${this.querySite}` .post(`${this.nozzle.queryRTUSettingHistory}?rtuCode=${rtuCode}`) - .then(res => { + .then((res) => { // console.log(res.data,'resss') this.rtuHistoryList = res.data.data; // this.querySite = this.querySiteList[0].rtuStationCode; }); - } + }, + initWatch() { + // console.log(this.formAll,this.formAllBody,'this.formAll[0]') + //// 第一个函数就是处理你要监听的属性，只要将其return出去就行 + // 外置dtu开关 + this.$watch( + function () { + return this.formAll[0].form1.rtuOutDtu; + }, + function (newVal, oldVal) { + this.formAllBody["1"].forEach((item, index, arr) => { + if (item.name === "外置DTU设置") { + arr[index].isShow = newVal; + } + }); + } + ); + // GPRS，LORA开关 + this.$watch( + function () { + return this.formAll[0].form1.rtuInnerMode; + }, + function (newVal, oldVal) { + this.formAllBody["1"].forEach((item, index, arr) => { + if (item.name === "内置LoRa相关配置") { + arr[index].isShow = newVal === "LORA" ? true : false; + } + }); + this.formAllBody["2"].forEach((item, index, arr) => { + if (item.name === "中心站1") { + arr[index].isShow = newVal === "GPRS" ? true : false; + } + if (item.name === "中心站2") { + arr[index].isShow = newVal === "GPRS" ? true : false; + } + if (item.name === "中心站3") { + arr[index].isShow = newVal === "GPRS" ? true : false; + } + if (item.name === "中心站4(备份站)") { + arr[index].isShow = newVal === "GPRS" ? true : false; + } + if (item.name === "VPN专网设置1") { + arr[index].isShow = newVal === "GPRS" ? true : false; + } + if (item.name === "VPN专网设置2") { + arr[index].isShow = newVal === "GPRS" ? true : false; + } + if (item.name === "NBIOT网络设置") { + arr[index].isShow = newVal === "GPRS" ? true : false; + } + if (item.name === "中心站其他设置") { + arr[index].isShow = newVal === "GPRS" ? true : false; + } + if (item.name === "远程后台服务器设置") { + arr[index].isShow = newVal === "GPRS" ? true : false; + } + }); + } + ); + // 水位计雷达 + this.$watch( + function () { + return this.formAll[2].form3.rtucgq_shuiwei1; + }, + function (newVal, oldVal) { + if ( + !( + (newVal === "NF-WGX-5小雷达水位计") | + (newVal === "NF-WGX-6大雷达水位计") + ) + ) { + this.formAllBody["9"][2].isShow = false; + } else { + this.formAllBody["9"][2].isShow = true; + } + } + ); + this.$watch( + function () { + return this.formAll[2].form3.rtucgq_shuiwei2; + }, + function (newVal, oldVal) { + if ( + !( + (newVal === "NF-WGX-5小雷达水位计") | + (newVal === "NF-WGX-6大雷达水位计") + ) + ) { + this.formAllBody["9"][2].isShow = false; + } else { + this.formAllBody["9"][4].isShow = true; + } + } + ); + // 流量计水龟 流量计1 流量计1设置 + this.$watch( + function () { + return this.formAll[2].form3.rtucgq_liuliang1; + }, + function (newVal, oldVal) { + let arr = [ + "4-20mA流量计", + "NACH-FL900流速仪", + "LWGY涡轮流量计", + "SM_311水表", + ]; + if (arr.indexOf(newVal) !== -1) { + this.formAll[10].form11.rtull_ll1_jiemian = "直接流量输出"; + this.formAllBody["11"][1].data[0].isShow = false; + } else { + this.formAllBody["11"][1].data[0].isShow = true; + } + } + ); + this.$watch( + function () { + return this.formAll[2].form3.rtucgq_liuliang2; + }, + function (newVal, oldVal) { + let arr = [ + "4-20mA流量计", + "NACH-FL900流速仪", + "LWGY涡轮流量计", + "SM_311水表", + ]; + if (arr.indexOf(newVal) !== -1) { + this.formAll[10].form11.rtull_ll2_jiemian = "直接流量输出"; + this.formAllBody["11"][4].data[0].isShow = false; + } else { + this.formAllBody["11"][4].data[0].isShow = true; + } + } + ); + this.$watch( + function () { + return this.formAll[2].form3.rtucgq_liuliang2; + }, + function (newVal, oldVal) { + if (!(newVal === "NF_LZX_2水龟")) { + this.formAllBody["11"][6].isShow = false; + } else { + this.formAllBody["11"][6].isShow = true; + } + } + ); + // 遥测站 采集标志 开关， 存储周期 rtuSaveCircle + this.$watch( + function () { + return this.formAll[0].form1.rtucjFlagTrans; + }, + function (newVal, oldVal) { + this.formAllBody["1"][0].data[3].isShow = !newVal; + } + ); + // 域名传输 + this.$watch( + function () { + return this.formAll[1].form2.rtuZxZx1RealmNameTrans; + }, + function (newVal, oldVal) { + this.formAllBody["2"][0].data[2].isShow = newVal; + this.formAllBody["2"][0].data[3].isShow = !newVal; + } + ); + this.$watch( + function () { + return this.formAll[1].form2.rtuZxZx2RealmNameTrans; + }, + function (newVal, oldVal) { + this.formAllBody["2"][2].data[2].isShow = newVal; + this.formAllBody["2"][2].data[3].isShow = !newVal; + } + ); + this.$watch( + function () { + return this.formAll[1].form2.rtuZxZx3RealmNameTrans; + }, + function (newVal, oldVal) { + this.formAllBody["2"][4].data[2].isShow = newVal; + this.formAllBody["2"][4].data[3].isShow = !newVal; + } + ); + this.$watch( + function () { + return this.formAll[1].form2.rtuZxZx4RealmNameTrans; + }, + function (newVal, oldVal) { + this.formAllBody["2"][6].data[2].isShow = newVal; + this.formAllBody["2"][6].data[3].isShow = !newVal; + } + ); + // 外置dtu设置，下拉框 + this.$watch( + function () { + return this.formAll[0].form1.rtuother_dtu_type; + }, + function (newVal, oldVal) { + var targetArr = [ + [true, true, true, true, false], + [true, true, false, false, false], + [false, false, false, false, true], + [false, false, false, false, false], + ]; + let select = [ + "LoRa-利尔达CN470", + "ManThink-门思科技", + "BC28电信管理平台NB", + "M5311移动平台NB", + ]; // 下拉框值，对应targetArr其他5个控件显示的4状态 + let strArr = [ + "JoinEUI", + "频率格式", + "上行频率", + "下行频率", + "电信NB服务ID", + ]; + this.formAllBody["1"][2].data.forEach((item, index, arr) => { + for (let i = 0; i < strArr.length; i++) { + if (arr[index].fieldName === strArr[i]) { + arr[index].isShow = targetArr[select.indexOf(newVal)][i]; + } + } + }); + // console.log(this.formAllBody['1'][2].data, select.indexOf(newVal),'_this.formAllBody[]') + } + ); + // 从机1 ，2设置 + this.$watch( + function () { + return this.formAll[2].form3.rtucgq_congji1; + }, + function (newVal, oldVal) { + var targetNameArr = [ + ["无效参数", "无效参数", "无效参数"], + ["抽水周期", "抽水超时", "排水超时"], + ["无效参数", "无效参数", "无效参数"], + ["采集周期", "通道延时", "演示递增"], + ["采集周期", "通道延时", "无效参数"], + ["查询周期", "抽水超时", "排水超时"], + ]; + var targetStatusArr = [ + [false, false, false], + [true, true, true], + [false, false, false], + [true, true, true], + [true, true, false], + [true, true, true], + ]; + let select = [ + "默认从机", + "电机驱动板（水质监测柜）", + "VGUS屏幕（水质监测柜）", + "二供（净水器）", + "二供（水箱）", + "主控板（5/9参数水质监测柜）", + ]; // 下拉框值，对应targetArr其他5个控件显示的4状态 + let strArr = ["rtucj1_canshu1", "rtucj1_canshu2", "rtucj1_canshu3"]; + this.formAllBody["7"][1].data.forEach((item, index, arr) => { + for (let i = 0; i < strArr.length; i++) { + if (arr[index].fieldIdentifier === strArr[i]) { + arr[index].isShow = targetStatusArr[select.indexOf(newVal)][i]; + arr[index].fieldName = targetNameArr[select.indexOf(newVal)][i]; + } + } + }); + // console.log(this.formAllBody['1'][2].data, select.indexOf(newVal),'_this.formAllBody[]') + } + ); + this.$watch( + function () { + return this.formAll[6].form7.rtucj_kaiguan1; + }, + function (newVal, oldVal) { + this.formAllBody["7"][1].isShow = newVal; + } + ); + this.$watch( + function () { + return this.formAll[6].form7.rtucj_kaiguan2; + }, + function (newVal, oldVal) { + this.formAllBody["7"][3].isShow = newVal; + } + ); + this.$watch( + function () { + return this.formAll[2].form3.rtucgq_congji2; + }, + function (newVal, oldVal) { + var targetNameArr = [ + ["无效参数", "无效参数", "无效参数"], + ["抽水周期", "抽水超时", "排水超时"], + ["无效参数", "无效参数", "无效参数"], + ["采集周期", "通道延时", "演示递增"], + ["采集周期", "通道延时", "无效参数"], + ["查询周期", "抽水超时", "排水超时"], + ]; + var targetStatusArr = [ + [false, false, false], + [true, true, true], + [false, false, false], + [true, true, true], + [true, true, false], + [true, true, true], + ]; + let select = [ + "默认从机", + "电机驱动板（水质监测柜）", + "VGUS屏幕（水质监测柜）", + "二供（净水器）", + "二供（水箱）", + "主控板（5/9参数水质监测柜）", + ]; // 下拉框值，对应targetArr其他5个控件显示的4状态 + let strArr = ["rtucj2_canshu1", "rtucj2_canshu2", "rtucj2_canshu3"]; + this.formAllBody["7"][3].data.forEach((item, index, arr) => { + for (let i = 0; i < strArr.length; i++) { + if (arr[index].fieldIdentifier === strArr[i]) { + arr[index].isShow = targetStatusArr[select.indexOf(newVal)][i]; + arr[index].fieldName = targetNameArr[select.indexOf(newVal)][i]; + } + } + }); + // console.log(this.formAllBody['1'][2].data, select.indexOf(newVal),'_this.formAllBody[]') + } + ); + // 流量计 流量槽 + this.$watch( + function () { + return this.formAll[10].form11.rtull_ll1_jiemian; + }, + function (newVal, oldVal) { + var targetNameArr = [ + [ + "安装高度", + "流量校正", + "淤积深度", + "无效参数", + "无效参数", + "无效参数", + "堰槽截面表高度分辨率", + ], + [ + "安装高度", + "流量校正", + "淤积深度", + "上地宽度", + "堰槽高度", + "无效参数", + "堰槽截面表高度分辨率", + ], + [ + "安装高度", + "流量校正", + "淤积深度", + "上地宽度", + "堰槽高度", + "无效参数", + "堰槽截面表高度分辨率", + ], + [ + "安装高度", + "流量校正", + "淤积深度", + "窄底宽度", + "堰槽高度", + "宽底宽度", + "堰槽截面表高度分辨率", + ], + [ + "安装高度", + "流量校正", + "淤积深度", + "无效参数", + "槽堰直径", + "无效参数", + "堰槽截面表高度分辨率", + ], + [ + "安装高度", + "流量校正", + "淤积深度", + "无效参数", + "无效参数", + "无效参数", + "堰槽截面表高度分辨率", + ], + [ + "溢流高度", + "流量校正", + "淤积深度", + "无效参数", + "槽堰高度", + "无效参数", + "堰槽截面表高度分辨率", + ], + [ + "溢流高度", + "流量校正", + "淤积深度", + "槽堰高度", + "槽序号", + "无效参数", + "堰槽截面表高度分辨率", + ], + ]; + var targetStatusArr = [ + [true, true, true, false, false, false, false], + [true, true, true, true, true, false, false], + [true, true, true, true, true, false, false], + [true, true, true, true, true, true, false], + [true, true, true, false, true, false, false], + [true, true, true, false, false, false, true], + [true, true, true, false, true, false, false], + [true, true, true, true, true, false, false], + ]; + let select = [ + "直接流量输出", + "三角堰", + "矩形堰", + "梯形堰", + "圆管", + "自定义截面", + "直角三角堰明渠", + "巴歇尔槽明渠", + ]; // 下拉框值， + let strArr = [ + "rtull_ll1_gaodu", + "rtull_ll1_jiaozheng", + "rtull_ll1_shendu", + "rtull_ll1_shangdikuandu", + "rtull_ll1_yancaogaodu", + "rtull_ll1_xiadikuandu", + "rtull_ll1_fenbian", + ]; + this.formAllBody["11"][1].data.forEach((item, index, arr) => { + for (let i = 0; i < strArr.length; i++) { + if (arr[index].fieldIdentifier === strArr[i]) { + arr[index].isShow = targetStatusArr[select.indexOf(newVal)][i]; + arr[index].fieldName = targetNameArr[select.indexOf(newVal)][i]; + } + } + }); + // console.log(this.formAllBody['1'][2].data, select.indexOf(newVal),'_this.formAllBody[]') + } + ); + this.$watch( + function () { + return this.formAll[10].form11.rtull_ll2_jiemian; + }, + function (newVal, oldVal) { + var targetNameArr = [ + [ + "安装高度", + "流量校正", + "淤积深度", + "无效参数", + "无效参数", + "无效参数", + "堰槽截面表高度分辨率", + ], + [ + "安装高度", + "流量校正", + "淤积深度", + "上地宽度", + "堰槽高度", + "无效参数", + "堰槽截面表高度分辨率", + ], + [ + "安装高度", + "流量校正", + "淤积深度", + "上地宽度", + "堰槽高度", + "无效参数", + "堰槽截面表高度分辨率", + ], + [ + "安装高度", + "流量校正", + "淤积深度", + "窄底宽度", + "堰槽高度", + "宽底宽度", + "堰槽截面表高度分辨率", + ], + [ + "安装高度", + "流量校正", + "淤积深度", + "无效参数", + "槽堰直径", + "无效参数", + "堰槽截面表高度分辨率", + ], + [ + "安装高度", + "流量校正", + "淤积深度", + "无效参数", + "无效参数", + "无效参数", + "堰槽截面表高度分辨率", + ], + [ + "溢流高度", + "流量校正", + "淤积深度", + "无效参数", + "槽堰高度", + "无效参数", + "堰槽截面表高度分辨率", + ], + [ + "溢流高度", + "流量校正", + "淤积深度", + "槽堰高度", + "槽序号", + "无效参数", + "堰槽截面表高度分辨率", + ], + ]; + var targetStatusArr = [ + [true, true, true, false, false, false, false], + [true, true, true, true, true, false, false], + [true, true, true, true, true, false, false], + [true, true, true, true, true, true, false], + [true, true, true, false, true, false, false], + [true, true, true, false, false, false, true], + [true, true, true, false, true, false, false], + [true, true, true, true, true, false, false], + ]; + let select = [ + "直接流量输出", + "三角堰", + "矩形堰", + "梯形堰", + "圆管", + "自定义截面", + "直角三角堰明渠", + "巴歇尔槽明渠", + ]; // 下拉框值， + let strArr = [ + "rtull_ll2_gaodu", + "rtull_ll2_jiaozheng", + "rtull_ll2_shendu", + "rtull_ll2_shangdikuandu", + "rtull_ll2_yancaogaodu", + "rtull_ll2_xiadikuandu", + "rtull_ll2_fenbian", + ]; + this.formAllBody["11"][4].data.forEach((item, index, arr) => { + for (let i = 0; i < strArr.length; i++) { + if (arr[index].fieldIdentifier === strArr[i]) { + arr[index].isShow = targetStatusArr[select.indexOf(newVal)][i]; + arr[index].fieldName = targetNameArr[select.indexOf(newVal)][i]; + } + } + }); + // console.log(this.formAllBody['1'][2].data, select.indexOf(newVal),'_this.formAllBody[]') + } + ); + // 蒸发皿 + this.$watch( + function () { + return this.formAll[2].form3.rtucgq_zfly; + }, + function (newVal, oldVal) { + var targetNameArr = [ + ["安装高度", "量程", "最小加水量"], + ["无效参数", "无效参数", "最小加水量"], + ["无效参数", "无效参数", "最小加水量"], + ]; + var targetStatusArr = [ + [true, true, true], + [false, false, true], + [false, false, true], + ]; + let select = ["独立蒸发皿", "水位值1", "水位值2"]; // 下拉框值，对应targetArr其他5个控件显示的4状态 + let strArr = ["rtuzf_gaodu", "rtuzf_liangcheng", "rtuzf_zuixiao"]; + this.formAllBody["12"][0].data.forEach((item, index, arr) => { + for (let i = 0; i < strArr.length; i++) { + if (arr[index].fieldIdentifier === strArr[i]) { + arr[index].isShow = targetStatusArr[select.indexOf(newVal)][i]; + arr[index].fieldName = targetNameArr[select.indexOf(newVal)][i]; + } + } + }); + // console.log(this.formAllBody['1'][2].data, select.indexOf(newVal),'_this.formAllBody[]') + } + ); + // 4am， 存储周期 rtuSaveCircle + this.$watch( + function () { + return this.formAll[2].form3.rtucgq_liuliang1; + }, + function (newVal, oldVal) { + var targetNameArr = [ + [ + "安装高度", + "流量校正", + "淤积深度", + "无效参数", + "无效参数", + "无效参数", + "堰槽截面表高度分辨率", + ], + ]; + var targetStatusArr = [ + [true, true, true, false, false, false, false], + ]; + let select = ["独立蒸发皿", "水位值1", "水位值2"]; // 下拉框值，对应targetArr其他5个控件显示的4状态 + let strArr = ["rtuzf_gaodu", "rtuzf_liangcheng", "rtuzf_zuixiao"]; + this.formAllBody["11"][1].data.forEach((item, index, arr) => { + for (let i = 0; i < strArr.length; i++) { + if (arr[index].fieldIdentifier === strArr[i]) { + arr[index].isShow = targetStatusArr[select.indexOf(newVal)][i]; + arr[index].fieldName = targetNameArr[select.indexOf(newVal)][i]; + } + } + }); + // console.log(this.formAllBody['1'][2].data, select.indexOf(newVal),'_this.formAllBody[]') + } + ); + }, }, created() { - this.getSiteList().then(res => { + this.getSiteList().then((res) => { // this.querySiteList[0].rtuStationCode // this.initPage(this.querySite); // this.getRtuHistoryList() @@ -1691,7 +1939,12 @@ this.formControl(); // console.log(666) - } + }, + updated() { + // if(this.formAll.length !==0){ + // this.initWatch() + // } + }, // beforeRouteLeave (to, from, next) { // // 导航离开该组件的对应路由时调用 // // 可以访问组件实例 `this` @@ -1752,12 +2005,12 @@ margin: 11px 0 11px 0 !important; .el-form-item__label { // text-align: right; - width: 160px !important; + width: 180px !important; text-align: right !important; color: var(--white) !important; } .el-form-item__content { - margin: 0 0 0 160px !important; + margin: 0 0 0 180px !important; .el-select { width: 100% !important; .el-input .el-input__inner { diff --git a/src/components/ConfigManager/SiteManagement.vue b/src/components/ConfigManager/SiteManagement.vue index 404080d..44b4598 100644 --- a/src/components/ConfigManager/SiteManagement.vue +++ b/src/components/ConfigManager/SiteManagement.vue @@ -218,7 +218,7 @@
@@ -745,30 +745,6 @@ } ] }, - rules1: { - ruleId: [ - { - required: true, - message: "请选择规则引擎", - trigger: "blur" - } - ], - referRainStationSt: [ - { - required: true, - message: "请选择雨量站", - trigger: "blur", - }, - ], - - isEnable: [ - { - required: true, - message: "请选择是否启用", - trigger: "blur" - } - ], - }, value: [], // 站点管理/所属区域数组 syscityList: [], @@ -929,9 +905,7 @@ } else { httpurl = this.nozzle.siterepairconfigmodify; } - this.$refs[form].validate((valid) => { - if (valid) { - this.$http.post(httpurl, this.configForm).then((res) => { + this.$http.post(httpurl, this.configForm).then(res => { console.log(res); if (res.data.code === 200) { this.configtrue = false; @@ -944,11 +918,6 @@ showClose: true }); }); - - }else{ - console.log("完善信息") - } - }) }, //响应地图组件的确定，拾取坐标 SendLngLat(lonlat) { @@ -1156,9 +1125,22 @@ //添加站点 case "create": this.iscodefalse = false; - this.projectObj = {}; this.yzaddflag = true; this.title = "新增站点"; + this.projectList = this.allPlatSite.map((item) => { + return { + id: item.id, + key: item.platformName, + value: item.platformCode, + areaId: item.area, + }; + }); + this.projectObj = {}; + setTimeout(() => { + if(this.$refs.ruleForm){ + this.$refs.ruleForm.clearValidate(); + } + }, 0); break; //编辑站点 case "update": @@ -1182,6 +1164,11 @@ this.ruleForm[key] = data[key]; } this.yzaddflag = true; + setTimeout(() => { + if(this.$refs.ruleForm){ + this.$refs.ruleForm.clearValidate(); + } + }, 0); break; //配置因子 case "config": diff --git a/src/components/index.vue b/src/components/index.vue index 268ef5a..b423ddd 100644 --- a/src/components/index.vue +++ b/src/components/index.vue @@ -469,8 +469,9 @@ } }, ZhuXIao() { - this.$router.push({ path: "/Login" }); + // this.$router.push({ path: "/Login" }); sessionStorage.clear(); + location.reload(); }, // 初始化验证 initRules() { diff --git a/src/components/ConfigManager/RtuConfig.vue b/src/components/ConfigManager/RtuConfig.vue index 2aa6409..60226ac 100644 --- a/src/components/ConfigManager/RtuConfig.vue +++ b/src/components/ConfigManager/RtuConfig.vue @@ -2,7 +2,7 @@
搜索 --> - - + - - 搜索 - + 搜索 + > - + 回显 - + 暂存 - + 暂存回显 - + 提交
- + - + 回显历史记录
@@ -96,10 +123,10 @@
@@ -131,7 +158,9 @@ :key="item.fieldIdentifier" :class="{ 'el-col-class': true, - stop: item.hasOwnProperty('isShow') ? !item.isShow : false + stop: item.hasOwnProperty('isShow') + ? !item.isShow + : false, }" > { - if (item.name === "外置DTU设置") { - arr[index].isShow = newVal; - } - }); - } - ); - // GPRS，LORA开关 - this.$watch( - function() { - return this.formAll[0].form1.rtuInnerMode; - }, - function(newVal, oldVal) { - this.formAllBody["1"].forEach((item, index, arr) => { - if (item.name === "内置LoRa相关配置") { - arr[index].isShow = newVal === "LORA" ? true : false; - } - }); - this.formAllBody["2"].forEach((item, index, arr) => { - if (item.name === "中心站1") { - arr[index].isShow = newVal === "GPRS" ? true : false; - } - if (item.name === "中心站2") { - arr[index].isShow = newVal === "GPRS" ? true : false; - } - if (item.name === "中心站3") { - arr[index].isShow = newVal === "GPRS" ? true : false; - } - if (item.name === "中心站4(备份站)") { - arr[index].isShow = newVal === "GPRS" ? true : false; - } - if (item.name === "VPN专网设置1") { - arr[index].isShow = newVal === "GPRS" ? true : false; - } - if (item.name === "VPN专网设置2") { - arr[index].isShow = newVal === "GPRS" ? true : false; - } - if (item.name === "NBIOT网络设置") { - arr[index].isShow = newVal === "GPRS" ? true : false; - } - if (item.name === "中心站其他设置") { - arr[index].isShow = newVal === "GPRS" ? true : false; - } - if (item.name === "远程后台服务器设置") { - arr[index].isShow = newVal === "GPRS" ? true : false; - } - }); - } - ); - // 水位计雷达 - this.$watch( - function() { - return this.formAll[2].form3.rtucgq_shuiwei1; - }, - function(newVal, oldVal) { - if ( - !( - (newVal === "NF-WGX-5小雷达水位计") | - (newVal === "NF-WGX-6大雷达水位计") - ) - ) { - this.formAllBody["9"][2].isShow = false; - } else { - this.formAllBody["9"][2].isShow = true; - } - } - ); - this.$watch( - function() { - return this.formAll[2].form3.rtucgq_shuiwei2; - }, - function(newVal, oldVal) { - if ( - !( - (newVal === "NF-WGX-5小雷达水位计") | - (newVal === "NF-WGX-6大雷达水位计") - ) - ) { - this.formAllBody["9"][2].isShow = false; - } else { - this.formAllBody["9"][4].isShow = true; - } - } - ); - // 流量计水鬼 - this.$watch( - function() { - return this.formAll[2].form3.rtucgq_liuliang1; - }, - function(newVal, oldVal) { - var targetNameArr = [ - "直接流量输出", - "安装高度", - "流量校正", - "淤积深度", - "无效参数", - "无效参数", - "无效参数", - "堰槽截面表高度分辨率" - ]; - var targetStatusArr = [ - false, - true, - true, - true, - false, - false, - false, - false - ]; - // let select= ['直接流量输出','三角堰','矩形堰','梯形堰','圆管','自定义截面','直角三角堰明渠','巴歇尔槽明渠'] // 下拉框值， - let strArr = [ - "rtull_ll1_jiemian", - "rtull_ll1_gaodu", - "rtull_ll1_jiaozheng", - "rtull_ll1_shendu", - "rtull_ll1_shangdikuandu", - "rtull_ll1_yancaogaodu", - "rtull_ll1_xiadikuandu", - "rtull_ll1_fenbian" - ]; - this.formAllBody["11"][1].data.forEach((item, index, arr) => { - for (let i = 0; i < strArr.length; i++) { - if (arr[index].fieldIdentifier === strArr[i]) { - arr[index].isShow = targetStatusArr[select.indexOf(newVal)][i]; - arr[index].fieldName = targetNameArr[select.indexOf(newVal)][i]; - } - } - }); - } - ); - this.$watch( - function() { - return this.formAll[2].form3.rtucgq_liuliang2; - }, - function(newVal, oldVal) { - if (!(newVal === "NF_LZX_2水龟")) { - this.formAllBody["11"][6].isShow = false; - } else { - this.formAllBody["11"][6].isShow = true; - } - } - ); - // 遥测站 采集标志 开关， 存储周期 rtuSaveCircle - this.$watch( - function() { - return this.formAll[0].form1.rtucjFlagTrans; - }, - function(newVal, oldVal) { - this.formAllBody["1"][0].data[3].isShow = !newVal; - } - ); - // 域名传输 - this.$watch( - function() { - return this.formAll[1].form2.rtuZxZx1RealmNameTrans; - }, - function(newVal, oldVal) { - this.formAllBody["2"][0].data[2].isShow = newVal; - this.formAllBody["2"][0].data[3].isShow = !newVal; - } - ); - this.$watch( - function() { - return this.formAll[1].form2.rtuZxZx2RealmNameTrans; - }, - function(newVal, oldVal) { - this.formAllBody["2"][2].data[2].isShow = newVal; - this.formAllBody["2"][2].data[3].isShow = !newVal; - } - ); - this.$watch( - function() { - return this.formAll[1].form2.rtuZxZx3RealmNameTrans; - }, - function(newVal, oldVal) { - this.formAllBody["2"][4].data[2].isShow = newVal; - this.formAllBody["2"][4].data[3].isShow = !newVal; - } - ); - this.$watch( - function() { - return this.formAll[1].form2.rtuZxZx4RealmNameTrans; - }, - function(newVal, oldVal) { - this.formAllBody["2"][6].data[2].isShow = newVal; - this.formAllBody["2"][6].data[3].isShow = !newVal; - } - ); - // 外置dtu设置，下拉框 - this.$watch( - function() { - return this.formAll[0].form1.rtuother_dtu_type; - }, - function(newVal, oldVal) { - var targetArr = [ - [true, true, true, true, false], - [true, true, false, false, false], - [false, false, false, false, true], - [false, false, false, false, false] - ]; - let select = [ - "LoRa-利尔达CN470", - "ManThink-门思科技", - "BC28电信管理平台NB", - "M5311移动平台NB" - ]; // 下拉框值，对应targetArr其他5个控件显示的4状态 - let strArr = [ - "JoinEUI", - "频率格式", - "上行频率", - "下行频率", - "电信NB服务ID" - ]; - this.formAllBody["1"][2].data.forEach((item, index, arr) => { - for (let i = 0; i < strArr.length; i++) { - if (arr[index].fieldName === strArr[i]) { - arr[index].isShow = targetArr[select.indexOf(newVal)][i]; - } - } - }); - // console.log(this.formAllBody['1'][2].data, select.indexOf(newVal),'_this.formAllBody[]') - } - ); - // 从机1 ，2设置 - this.$watch( - function() { - return this.formAll[2].form3.rtucgq_congji1; - }, - function(newVal, oldVal) { - var targetNameArr = [ - ["无效参数", "无效参数", "无效参数"], - ["抽水周期", "抽水超时", "排水超时"], - ["无效参数", "无效参数", "无效参数"], - ["采集周期", "通道延时", "演示递增"], - ["采集周期", "通道延时", "无效参数"], - ["查询周期", "抽水超时", "排水超时"] - ]; - var targetStatusArr = [ - [false, false, false], - [true, true, true], - [false, false, false], - [true, true, true], - [true, true, false], - [true, true, true] - ]; - let select = [ - "默认从机", - "电机驱动板（水质监测柜）", - "VGUS屏幕（水质监测柜）", - "二供（净水器）", - "二供（水箱）", - "主控板（5/9参数水质监测柜）" - ]; // 下拉框值，对应targetArr其他5个控件显示的4状态 - let strArr = ["rtucj1_canshu1", "rtucj1_canshu2", "rtucj1_canshu3"]; - this.formAllBody["7"][1].data.forEach((item, index, arr) => { - for (let i = 0; i < strArr.length; i++) { - if (arr[index].fieldIdentifier === strArr[i]) { - arr[index].isShow = targetStatusArr[select.indexOf(newVal)][i]; - arr[index].fieldName = targetNameArr[select.indexOf(newVal)][i]; - } - } - }); - // console.log(this.formAllBody['1'][2].data, select.indexOf(newVal),'_this.formAllBody[]') - } - ); - this.$watch( - function() { - return this.formAll[2].form3.rtucgq_congji2; - }, - function(newVal, oldVal) { - var targetNameArr = [ - ["无效参数", "无效参数", "无效参数"], - ["抽水周期", "抽水超时", "排水超时"], - ["无效参数", "无效参数", "无效参数"], - ["采集周期", "通道延时", "演示递增"], - ["采集周期", "通道延时", "无效参数"], - ["查询周期", "抽水超时", "排水超时"] - ]; - var targetStatusArr = [ - [false, false, false], - [true, true, true], - [false, false, false], - [true, true, true], - [true, true, false], - [true, true, true] - ]; - let select = [ - "默认从机", - "电机驱动板（水质监测柜）", - "VGUS屏幕（水质监测柜）", - "二供（净水器）", - "二供（水箱）", - "主控板（5/9参数水质监测柜）" - ]; // 下拉框值，对应targetArr其他5个控件显示的4状态 - let strArr = ["rtucj2_canshu1", "rtucj2_canshu2", "rtucj2_canshu3"]; - this.formAllBody["7"][3].data.forEach((item, index, arr) => { - for (let i = 0; i < strArr.length; i++) { - if (arr[index].fieldIdentifier === strArr[i]) { - arr[index].isShow = targetStatusArr[select.indexOf(newVal)][i]; - arr[index].fieldName = targetNameArr[select.indexOf(newVal)][i]; - } - } - }); - // console.log(this.formAllBody['1'][2].data, select.indexOf(newVal),'_this.formAllBody[]') - } - ); - // 流量计 流量槽 - this.$watch( - function() { - return this.formAll[10].form11.rtull_ll1_jiemian; - }, - function(newVal, oldVal) { - var targetNameArr = [ - [ - "安装高度", - "流量校正", - "淤积深度", - "无效参数", - "无效参数", - "无效参数", - "堰槽截面表高度分辨率" - ], - [ - "安装高度", - "流量校正", - "淤积深度", - "上地宽度", - "堰槽高度", - "无效参数", - "堰槽截面表高度分辨率" - ], - [ - "安装高度", - "流量校正", - "淤积深度", - "上地宽度", - "堰槽高度", - "无效参数", - "堰槽截面表高度分辨率" - ], - [ - "安装高度", - "流量校正", - "淤积深度", - "窄底宽度", - "堰槽高度", - "宽底宽度", - "堰槽截面表高度分辨率" - ], - [ - "安装高度", - "流量校正", - "淤积深度", - "无效参数", - "槽堰直径", - "无效参数", - "堰槽截面表高度分辨率" - ], - [ - "安装高度", - "流量校正", - "淤积深度", - "无效参数", - "无效参数", - "无效参数", - "堰槽截面表高度分辨率" - ], - [ - "溢流高度", - "流量校正", - "淤积深度", - "无效参数", - "槽堰高度", - "无效参数", - "堰槽截面表高度分辨率" - ], - [ - "溢流高度", - "流量校正", - "淤积深度", - "槽堰高度", - "槽序号", - "无效参数", - "堰槽截面表高度分辨率" - ] - ]; - var targetStatusArr = [ - [true, true, true, false, false, false, false], - [true, true, true, true, true, false, false], - [true, true, true, true, true, false, false], - [true, true, true, true, true, true, false], - [true, true, true, false, true, false, false], - [true, true, true, false, false, false, true], - [true, true, true, false, true, false, false], - [true, true, true, true, true, false, false] - ]; - let select = [ - "直接流量输出", - "三角堰", - "矩形堰", - "梯形堰", - "圆管", - "自定义截面", - "直角三角堰明渠", - "巴歇尔槽明渠" - ]; // 下拉框值， - let strArr = [ - "rtull_ll1_gaodu", - "rtull_ll1_jiaozheng", - "rtull_ll1_shendu", - "rtull_ll1_shangdikuandu", - "rtull_ll1_yancaogaodu", - "rtull_ll1_xiadikuandu", - "rtull_ll1_fenbian" - ]; - this.formAllBody["11"][1].data.forEach((item, index, arr) => { - for (let i = 0; i < strArr.length; i++) { - if (arr[index].fieldIdentifier === strArr[i]) { - arr[index].isShow = targetStatusArr[select.indexOf(newVal)][i]; - arr[index].fieldName = targetNameArr[select.indexOf(newVal)][i]; - } - } - }); - // console.log(this.formAllBody['1'][2].data, select.indexOf(newVal),'_this.formAllBody[]') - } - ); - // 蒸发皿 - this.$watch( - function() { - return this.formAll[2].form3.rtucgq_zfly; - }, - function(newVal, oldVal) { - var targetNameArr = [ - ["安装高度", "量程", "最小加水量"], - ["无效参数", "无效参数", "最小加水量"], - ["无效参数", "无效参数", "最小加水量"] - ]; - var targetStatusArr = [ - [true, true, true], - [false, false, true], - [false, false, true] - ]; - let select = ["独立蒸发皿", "水位值1", "水位值2"]; // 下拉框值，对应targetArr其他5个控件显示的4状态 - let strArr = ["rtuzf_gaodu", "rtuzf_liangcheng", "rtuzf_zuixiao"]; - this.formAllBody["12"][0].data.forEach((item, index, arr) => { - for (let i = 0; i < strArr.length; i++) { - if (arr[index].fieldIdentifier === strArr[i]) { - arr[index].isShow = targetStatusArr[select.indexOf(newVal)][i]; - arr[index].fieldName = targetNameArr[select.indexOf(newVal)][i]; - } - } - }); - // console.log(this.formAllBody['1'][2].data, select.indexOf(newVal),'_this.formAllBody[]') - } - ); - // 4am， 存储周期 rtuSaveCircle - this.$watch( - function() { - return this.formAll[2].form3.rtucgq_liuliang1; - }, - function(newVal, oldVal) { - var targetNameArr = [ - [ - "安装高度", - "流量校正", - "淤积深度", - "无效参数", - "无效参数", - "无效参数", - "堰槽截面表高度分辨率" - ] - ]; - var targetStatusArr = [[true, true, true, false, false, false, false]]; - let select = ["独立蒸发皿", "水位值1", "水位值2"]; // 下拉框值，对应targetArr其他5个控件显示的4状态 - let strArr = ["rtuzf_gaodu", "rtuzf_liangcheng", "rtuzf_zuixiao"]; - this.formAllBody["11"][1].data.forEach((item, index, arr) => { - for (let i = 0; i < strArr.length; i++) { - if (arr[index].fieldIdentifier === strArr[i]) { - arr[index].isShow = targetStatusArr[select.indexOf(newVal)][i]; - arr[index].fieldName = targetNameArr[select.indexOf(newVal)][i]; - } - } - }); - // console.log(this.formAllBody['1'][2].data, select.indexOf(newVal),'_this.formAllBody[]') - } - ); + this.initWatch(); // bottom }, methods: { - search(){ + search() { this.formAll = []; - this.querySite= [] + this.querySite = []; // console.log(this.querySite,'querySite') - this.getSiteList(this.searchCode) + this.getSiteList(this.searchCode); }, - switchChange(val){ + switchChange(val) { // console.log(val,this.formAll[0].form1,'change') }, switchClick(val) { @@ -1093,20 +635,35 @@ }, temStorageEcho() { // this.activeIndex = '0' - if(localStorage.getItem(this.querySite[1])){ - this.formAll = JSON.parse(localStorage.getItem(name)); - this.$message({ message: "暂存回显成功", type: "success" }); + if ( + this.querySite.length === 2 && + localStorage.getItem(this.querySite[1]) + ) { + this.formAll = JSON.parse(localStorage.getItem(this.querySite[1])); + console.log(this.formAll, this.querySite[1], "this.formAll"); + + this.$message({ + message: `${this.querySite[1]}暂存回显成功`, + type: "success", + }); } else { this.$message({ message: "无暂存内容", type: "warning" }); } // console.log(JSON.parse(sessionStorage.getItem(name)),111) }, temStorage() { - try { - localStorage.setItem(this.querySite[1], JSON.stringify(this.formAll)); - this.$message({ message: `${this.querySite[1]}保存成功`, type: "success" }); - } catch (err) { - this.$message({ message: err, type: "warning" }); + if (this.querySite.length === 2) { + try { + localStorage.removeItem(this.querySite[1]); + // console.log(this.formAll,'this.formAll') + localStorage.setItem(this.querySite[1], JSON.stringify(this.formAll)); + this.$message({ + message: `${this.querySite[1]}保存成功`, + type: "success", + }); + } catch (err) { + this.$message({ message: err, type: "warning" }); + } } // sessionStorage.setItem(name,'999') // // location.href='http://192.168.16.189:8080/#/ConfigManager/RtuConfig' @@ -1115,17 +672,63 @@ // console.log(sessionStorage.setItem(name),111) }, sunmitAll() { + console.log(this.formAll, "formAll"); + // 水位计 流量计 蒸发皿 rtucgq_llly1 + // let shuiWeiArr = ['独立水位计','流量计内置水位计','蒸发皿'] + // let liuLiangArr = ['内置水位计','外置独立水位计'] + // let zhengFaMinArr = ['独立蒸发皿','水位值1','水位值2'] + if ( + this.formAll[2].form3.rtucgq_swly1 === "蒸发皿" && + this.formAll[2].form3.rtucgq_zfly === "水位值1" + ) { + this.$message({ + message: `水位计1和蒸发皿数据冲突！`, + type: "warning", + }); + return; + } + if ( + this.formAll[2].form3.rtucgq_swly2 === "蒸发皿" && + this.formAll[2].form3.rtucgq_zfly === "水位值2" + ) { + this.$message({ + message: `水位计2和蒸发皿数据冲突！`, + type: "warning", + }); + return; + } + if ( + this.formAll[2].form3.rtucgq_swly1 === "流量计内置水位计" && + this.formAll[2].form3.rtucgq_llly1 === "外置独立水位计" + ) { + this.$message({ + message: `水位计1和流量计1数据冲突！`, + type: "warning", + }); + return; + } + if ( + this.formAll[2].form3.rtucgq_swly2 === "流量计内置水位计" && + this.formAll[2].form3.rtucgq_llly2 === "外置独立水位计" + ) { + this.$message({ + message: `水位计2和流量计2数据冲突！`, + type: "warning", + }); + return; + } + // return ; // 提交所有表单，循环校验所有表单，当有个表单校验失败就break，提示该表单校验失败，根据校验成功总数或者无失败确定完成，组装数据发送到后台 var successCount = 0; var successFlag = false; for (var i = 0; i < 15; i++) { - this.$refs["form"][i].validate(valid => { + this.$refs["form"][i].validate((valid) => { if (valid) { successCount++; } else { this.$message({ message: `${this.siteNameList[i]} 校验失败，请查看`, - type: "warning" + type: "warning", }); // alert(`${this.siteNameList[i]} 校验失败，请查看`); // this.$notify({ @@ -1166,8 +769,8 @@ rtuEvaporatingDishSetting: this.formAll[11].form12, rtuSoilSettler: this.formAll[12].form13, rtu4To20Setting: this.formAll[13].form14, - rtuOtherSetting: this.formAll[14].form15 - } + rtuOtherSetting: this.formAll[14].form15, + }, }; // 之前初始化时将3处的两个数组生成了需要的字段，现在需要把每处16个字段组装成两数组，删除不需要的字段,转化方法暂时写在这里 function dealInputSwitch( @@ -1236,7 +839,7 @@ ] = rtucamera_jiabaoNew; this.$http .post(`${this.nozzle.rTUSettingServiceUpdate}`, parmas) - .then(res => { + .then((res) => { // console.log(res,'rTUSettingServiceUpdate') this.echoClick(); }); @@ -1278,11 +881,11 @@ }, selectChange(val) { // this.querySite = [] - this.rtuHistoryId='' + this.rtuHistoryId = ""; // console.log(val,'val') // if(this.querySite.length!==2) return; this.echoClick(val); - this.getRtuHistoryList() + this.getRtuHistoryList(); }, selectChange1(val) { // console.log(val,'val') input搜索 @@ -1294,7 +897,7 @@ // this.echoClick(val); }, async initPage(site) { - this.loading = true + this.loading = true; // 切换站点后去请求历史下拉框 // this.getRtuHistoryList() // 回显接口请求数据 将水文传感里面3处特殊的控件需要的值，用请求数据遍历生成表单需要的字段，因为这3处的动态表单使用的是死的字段，其他的对应的表单数据赋值给对应表单就能回显了、 @@ -1320,7 +923,7 @@ "rtuEvaporatingDishSetting", "rtuSoilSettler", "rtu4To20Setting", - "rtuOtherSetting" + "rtuOtherSetting", ]; // console.log(this.formAll,resData,'ressssss') // this.formAll={} @@ -1402,7 +1005,7 @@ this.formAll.push(obj); // console.log(this.formAll,this.stCode,'this.formAll') } - this.loading = false + this.loading = false; }, async initPage2(rtuCode) { // 回显接口请求数据 将水文传感里面3处特殊的控件需要的值，用请求数据遍历生成表单需要的字段，因为这3处的动态表单使用的是死的字段，其他的对应的表单数据赋值给对应表单就能回显了、 @@ -1425,7 +1028,7 @@ "rtuEvaporatingDishSetting", "rtuSoilSettler", "rtu4To20Setting", - "rtuOtherSetting" + "rtuOtherSetting", ]; console.log(this.formAll, resData, "ressssss"); // this.formAll={} @@ -1598,36 +1201,55 @@ return temp; } // 生成表单控件的接口 - this.$http.post(this.nozzle.rtuPageQueryPage).then(res => { + this.$http.post(this.nozzle.rtuPageQueryPage).then((res) => { var dataRes = res.data.data; // console.log(dataRes,'dataRes') for (var i in dataRes) { if (dataRes[i].length !== 0) { dataRes[i].forEach((item, index, arr) => { - this.rules[item.fieldIdentifier] = [ - { - validator: (rule, value, callback) => { - this.validatorAll( - rule, - value, - callback, - item.validatorType, - item.validatorRules, - item.validatorErrorText - ); + if (item.fieldType !== 5) { + this.rules[item.fieldIdentifier] = [ + { + validator: (rule, value, callback) => { + this.validatorAll( + rule, + value, + callback, + item.validatorType, + item.validatorRules, + item.validatorErrorText + ); + }, + trigger: "change", }, - trigger: "change" - } - ]; + ]; + } else if (item.fieldType === 5) { + this.rules[item.fieldIdentifier] = [ + { + validator: (rule, value, callback) => { + this.validatorAll( + rule, + value, + callback, + item.validatorType, + item.validatorRules, + item.validatorErrorText + ); + }, + trigger: "change", + }, + { required: true, message: "必填", trigger: "change" }, + ]; + } }); - let sub_titleList = dataRes[i].map(item => { + let sub_titleList = dataRes[i].map((item) => { return item.subTitle; }); var newObj = []; // 根据小标题去重 - uniq(sub_titleList).forEach(item => { + uniq(sub_titleList).forEach((item) => { var obj = { name: item, data: [], isShow: true, isBlock: true }; - var data = dataRes[i].forEach(l => { + var data = dataRes[i].forEach((l) => { l.isShow = true; if ( l.subTitle === item && @@ -1651,11 +1273,11 @@ console.log(this.formAllBody, "999"); }); }, - async getSiteList(val='') { - // ,{stCode:this.querySite} + async getSiteList(val = "") { + // ,{stCode:this.querySite} await this.$http .post(`${this.nozzle.rTUSettingServiceQueryList}?stCode=${val}`) - .then(res => { + .then((res) => { // console.log(res.data.data,'resss') this.querySiteList = res.data.data; // this.querySiteList.push({ @@ -1675,15 +1297,641 @@ await this.$http //`${this.nozzle.queryRTUSettingHistory}?stCode=${this.querySite}` .post(`${this.nozzle.queryRTUSettingHistory}?rtuCode=${rtuCode}`) - .then(res => { + .then((res) => { // console.log(res.data,'resss') this.rtuHistoryList = res.data.data; // this.querySite = this.querySiteList[0].rtuStationCode; }); - } + }, + initWatch() { + // console.log(this.formAll,this.formAllBody,'this.formAll[0]') + //// 第一个函数就是处理你要监听的属性，只要将其return出去就行 + // 外置dtu开关 + this.$watch( + function () { + return this.formAll[0].form1.rtuOutDtu; + }, + function (newVal, oldVal) { + this.formAllBody["1"].forEach((item, index, arr) => { + if (item.name === "外置DTU设置") { + arr[index].isShow = newVal; + } + }); + } + ); + // GPRS，LORA开关 + this.$watch( + function () { + return this.formAll[0].form1.rtuInnerMode; + }, + function (newVal, oldVal) { + this.formAllBody["1"].forEach((item, index, arr) => { + if (item.name === "内置LoRa相关配置") { + arr[index].isShow = newVal === "LORA" ? true : false; + } + }); + this.formAllBody["2"].forEach((item, index, arr) => { + if (item.name === "中心站1") { + arr[index].isShow = newVal === "GPRS" ? true : false; + } + if (item.name === "中心站2") { + arr[index].isShow = newVal === "GPRS" ? true : false; + } + if (item.name === "中心站3") { + arr[index].isShow = newVal === "GPRS" ? true : false; + } + if (item.name === "中心站4(备份站)") { + arr[index].isShow = newVal === "GPRS" ? true : false; + } + if (item.name === "VPN专网设置1") { + arr[index].isShow = newVal === "GPRS" ? true : false; + } + if (item.name === "VPN专网设置2") { + arr[index].isShow = newVal === "GPRS" ? true : false; + } + if (item.name === "NBIOT网络设置") { + arr[index].isShow = newVal === "GPRS" ? true : false; + } + if (item.name === "中心站其他设置") { + arr[index].isShow = newVal === "GPRS" ? true : false; + } + if (item.name === "远程后台服务器设置") { + arr[index].isShow = newVal === "GPRS" ? true : false; + } + }); + } + ); + // 水位计雷达 + this.$watch( + function () { + return this.formAll[2].form3.rtucgq_shuiwei1; + }, + function (newVal, oldVal) { + if ( + !( + (newVal === "NF-WGX-5小雷达水位计") | + (newVal === "NF-WGX-6大雷达水位计") + ) + ) { + this.formAllBody["9"][2].isShow = false; + } else { + this.formAllBody["9"][2].isShow = true; + } + } + ); + this.$watch( + function () { + return this.formAll[2].form3.rtucgq_shuiwei2; + }, + function (newVal, oldVal) { + if ( + !( + (newVal === "NF-WGX-5小雷达水位计") | + (newVal === "NF-WGX-6大雷达水位计") + ) + ) { + this.formAllBody["9"][2].isShow = false; + } else { + this.formAllBody["9"][4].isShow = true; + } + } + ); + // 流量计水龟 流量计1 流量计1设置 + this.$watch( + function () { + return this.formAll[2].form3.rtucgq_liuliang1; + }, + function (newVal, oldVal) { + let arr = [ + "4-20mA流量计", + "NACH-FL900流速仪", + "LWGY涡轮流量计", + "SM_311水表", + ]; + if (arr.indexOf(newVal) !== -1) { + this.formAll[10].form11.rtull_ll1_jiemian = "直接流量输出"; + this.formAllBody["11"][1].data[0].isShow = false; + } else { + this.formAllBody["11"][1].data[0].isShow = true; + } + } + ); + this.$watch( + function () { + return this.formAll[2].form3.rtucgq_liuliang2; + }, + function (newVal, oldVal) { + let arr = [ + "4-20mA流量计", + "NACH-FL900流速仪", + "LWGY涡轮流量计", + "SM_311水表", + ]; + if (arr.indexOf(newVal) !== -1) { + this.formAll[10].form11.rtull_ll2_jiemian = "直接流量输出"; + this.formAllBody["11"][4].data[0].isShow = false; + } else { + this.formAllBody["11"][4].data[0].isShow = true; + } + } + ); + this.$watch( + function () { + return this.formAll[2].form3.rtucgq_liuliang2; + }, + function (newVal, oldVal) { + if (!(newVal === "NF_LZX_2水龟")) { + this.formAllBody["11"][6].isShow = false; + } else { + this.formAllBody["11"][6].isShow = true; + } + } + ); + // 遥测站 采集标志 开关， 存储周期 rtuSaveCircle + this.$watch( + function () { + return this.formAll[0].form1.rtucjFlagTrans; + }, + function (newVal, oldVal) { + this.formAllBody["1"][0].data[3].isShow = !newVal; + } + ); + // 域名传输 + this.$watch( + function () { + return this.formAll[1].form2.rtuZxZx1RealmNameTrans; + }, + function (newVal, oldVal) { + this.formAllBody["2"][0].data[2].isShow = newVal; + this.formAllBody["2"][0].data[3].isShow = !newVal; + } + ); + this.$watch( + function () { + return this.formAll[1].form2.rtuZxZx2RealmNameTrans; + }, + function (newVal, oldVal) { + this.formAllBody["2"][2].data[2].isShow = newVal; + this.formAllBody["2"][2].data[3].isShow = !newVal; + } + ); + this.$watch( + function () { + return this.formAll[1].form2.rtuZxZx3RealmNameTrans; + }, + function (newVal, oldVal) { + this.formAllBody["2"][4].data[2].isShow = newVal; + this.formAllBody["2"][4].data[3].isShow = !newVal; + } + ); + this.$watch( + function () { + return this.formAll[1].form2.rtuZxZx4RealmNameTrans; + }, + function (newVal, oldVal) { + this.formAllBody["2"][6].data[2].isShow = newVal; + this.formAllBody["2"][6].data[3].isShow = !newVal; + } + ); + // 外置dtu设置，下拉框 + this.$watch( + function () { + return this.formAll[0].form1.rtuother_dtu_type; + }, + function (newVal, oldVal) { + var targetArr = [ + [true, true, true, true, false], + [true, true, false, false, false], + [false, false, false, false, true], + [false, false, false, false, false], + ]; + let select = [ + "LoRa-利尔达CN470", + "ManThink-门思科技", + "BC28电信管理平台NB", + "M5311移动平台NB", + ]; // 下拉框值，对应targetArr其他5个控件显示的4状态 + let strArr = [ + "JoinEUI", + "频率格式", + "上行频率", + "下行频率", + "电信NB服务ID", + ]; + this.formAllBody["1"][2].data.forEach((item, index, arr) => { + for (let i = 0; i < strArr.length; i++) { + if (arr[index].fieldName === strArr[i]) { + arr[index].isShow = targetArr[select.indexOf(newVal)][i]; + } + } + }); + // console.log(this.formAllBody['1'][2].data, select.indexOf(newVal),'_this.formAllBody[]') + } + ); + // 从机1 ，2设置 + this.$watch( + function () { + return this.formAll[2].form3.rtucgq_congji1; + }, + function (newVal, oldVal) { + var targetNameArr = [ + ["无效参数", "无效参数", "无效参数"], + ["抽水周期", "抽水超时", "排水超时"], + ["无效参数", "无效参数", "无效参数"], + ["采集周期", "通道延时", "演示递增"], + ["采集周期", "通道延时", "无效参数"], + ["查询周期", "抽水超时", "排水超时"], + ]; + var targetStatusArr = [ + [false, false, false], + [true, true, true], + [false, false, false], + [true, true, true], + [true, true, false], + [true, true, true], + ]; + let select = [ + "默认从机", + "电机驱动板（水质监测柜）", + "VGUS屏幕（水质监测柜）", + "二供（净水器）", + "二供（水箱）", + "主控板（5/9参数水质监测柜）", + ]; // 下拉框值，对应targetArr其他5个控件显示的4状态 + let strArr = ["rtucj1_canshu1", "rtucj1_canshu2", "rtucj1_canshu3"]; + this.formAllBody["7"][1].data.forEach((item, index, arr) => { + for (let i = 0; i < strArr.length; i++) { + if (arr[index].fieldIdentifier === strArr[i]) { + arr[index].isShow = targetStatusArr[select.indexOf(newVal)][i]; + arr[index].fieldName = targetNameArr[select.indexOf(newVal)][i]; + } + } + }); + // console.log(this.formAllBody['1'][2].data, select.indexOf(newVal),'_this.formAllBody[]') + } + ); + this.$watch( + function () { + return this.formAll[6].form7.rtucj_kaiguan1; + }, + function (newVal, oldVal) { + this.formAllBody["7"][1].isShow = newVal; + } + ); + this.$watch( + function () { + return this.formAll[6].form7.rtucj_kaiguan2; + }, + function (newVal, oldVal) { + this.formAllBody["7"][3].isShow = newVal; + } + ); + this.$watch( + function () { + return this.formAll[2].form3.rtucgq_congji2; + }, + function (newVal, oldVal) { + var targetNameArr = [ + ["无效参数", "无效参数", "无效参数"], + ["抽水周期", "抽水超时", "排水超时"], + ["无效参数", "无效参数", "无效参数"], + ["采集周期", "通道延时", "演示递增"], + ["采集周期", "通道延时", "无效参数"], + ["查询周期", "抽水超时", "排水超时"], + ]; + var targetStatusArr = [ + [false, false, false], + [true, true, true], + [false, false, false], + [true, true, true], + [true, true, false], + [true, true, true], + ]; + let select = [ + "默认从机", + "电机驱动板（水质监测柜）", + "VGUS屏幕（水质监测柜）", + "二供（净水器）", + "二供（水箱）", + "主控板（5/9参数水质监测柜）", + ]; // 下拉框值，对应targetArr其他5个控件显示的4状态 + let strArr = ["rtucj2_canshu1", "rtucj2_canshu2", "rtucj2_canshu3"]; + this.formAllBody["7"][3].data.forEach((item, index, arr) => { + for (let i = 0; i < strArr.length; i++) { + if (arr[index].fieldIdentifier === strArr[i]) { + arr[index].isShow = targetStatusArr[select.indexOf(newVal)][i]; + arr[index].fieldName = targetNameArr[select.indexOf(newVal)][i]; + } + } + }); + // console.log(this.formAllBody['1'][2].data, select.indexOf(newVal),'_this.formAllBody[]') + } + ); + // 流量计 流量槽 + this.$watch( + function () { + return this.formAll[10].form11.rtull_ll1_jiemian; + }, + function (newVal, oldVal) { + var targetNameArr = [ + [ + "安装高度", + "流量校正", + "淤积深度", + "无效参数", + "无效参数", + "无效参数", + "堰槽截面表高度分辨率", + ], + [ + "安装高度", + "流量校正", + "淤积深度", + "上地宽度", + "堰槽高度", + "无效参数", + "堰槽截面表高度分辨率", + ], + [ + "安装高度", + "流量校正", + "淤积深度", + "上地宽度", + "堰槽高度", + "无效参数", + "堰槽截面表高度分辨率", + ], + [ + "安装高度", + "流量校正", + "淤积深度", + "窄底宽度", + "堰槽高度", + "宽底宽度", + "堰槽截面表高度分辨率", + ], + [ + "安装高度", + "流量校正", + "淤积深度", + "无效参数", + "槽堰直径", + "无效参数", + "堰槽截面表高度分辨率", + ], + [ + "安装高度", + "流量校正", + "淤积深度", + "无效参数", + "无效参数", + "无效参数", + "堰槽截面表高度分辨率", + ], + [ + "溢流高度", + "流量校正", + "淤积深度", + "无效参数", + "槽堰高度", + "无效参数", + "堰槽截面表高度分辨率", + ], + [ + "溢流高度", + "流量校正", + "淤积深度", + "槽堰高度", + "槽序号", + "无效参数", + "堰槽截面表高度分辨率", + ], + ]; + var targetStatusArr = [ + [true, true, true, false, false, false, false], + [true, true, true, true, true, false, false], + [true, true, true, true, true, false, false], + [true, true, true, true, true, true, false], + [true, true, true, false, true, false, false], + [true, true, true, false, false, false, true], + [true, true, true, false, true, false, false], + [true, true, true, true, true, false, false], + ]; + let select = [ + "直接流量输出", + "三角堰", + "矩形堰", + "梯形堰", + "圆管", + "自定义截面", + "直角三角堰明渠", + "巴歇尔槽明渠", + ]; // 下拉框值， + let strArr = [ + "rtull_ll1_gaodu", + "rtull_ll1_jiaozheng", + "rtull_ll1_shendu", + "rtull_ll1_shangdikuandu", + "rtull_ll1_yancaogaodu", + "rtull_ll1_xiadikuandu", + "rtull_ll1_fenbian", + ]; + this.formAllBody["11"][1].data.forEach((item, index, arr) => { + for (let i = 0; i < strArr.length; i++) { + if (arr[index].fieldIdentifier === strArr[i]) { + arr[index].isShow = targetStatusArr[select.indexOf(newVal)][i]; + arr[index].fieldName = targetNameArr[select.indexOf(newVal)][i]; + } + } + }); + // console.log(this.formAllBody['1'][2].data, select.indexOf(newVal),'_this.formAllBody[]') + } + ); + this.$watch( + function () { + return this.formAll[10].form11.rtull_ll2_jiemian; + }, + function (newVal, oldVal) { + var targetNameArr = [ + [ + "安装高度", + "流量校正", + "淤积深度", + "无效参数", + "无效参数", + "无效参数", + "堰槽截面表高度分辨率", + ], + [ + "安装高度", + "流量校正", + "淤积深度", + "上地宽度", + "堰槽高度", + "无效参数", + "堰槽截面表高度分辨率", + ], + [ + "安装高度", + "流量校正", + "淤积深度", + "上地宽度", + "堰槽高度", + "无效参数", + "堰槽截面表高度分辨率", + ], + [ + "安装高度", + "流量校正", + "淤积深度", + "窄底宽度", + "堰槽高度", + "宽底宽度", + "堰槽截面表高度分辨率", + ], + [ + "安装高度", + "流量校正", + "淤积深度", + "无效参数", + "槽堰直径", + "无效参数", + "堰槽截面表高度分辨率", + ], + [ + "安装高度", + "流量校正", + "淤积深度", + "无效参数", + "无效参数", + "无效参数", + "堰槽截面表高度分辨率", + ], + [ + "溢流高度", + "流量校正", + "淤积深度", + "无效参数", + "槽堰高度", + "无效参数", + "堰槽截面表高度分辨率", + ], + [ + "溢流高度", + "流量校正", + "淤积深度", + "槽堰高度", + "槽序号", + "无效参数", + "堰槽截面表高度分辨率", + ], + ]; + var targetStatusArr = [ + [true, true, true, false, false, false, false], + [true, true, true, true, true, false, false], + [true, true, true, true, true, false, false], + [true, true, true, true, true, true, false], + [true, true, true, false, true, false, false], + [true, true, true, false, false, false, true], + [true, true, true, false, true, false, false], + [true, true, true, true, true, false, false], + ]; + let select = [ + "直接流量输出", + "三角堰", + "矩形堰", + "梯形堰", + "圆管", + "自定义截面", + "直角三角堰明渠", + "巴歇尔槽明渠", + ]; // 下拉框值， + let strArr = [ + "rtull_ll2_gaodu", + "rtull_ll2_jiaozheng", + "rtull_ll2_shendu", + "rtull_ll2_shangdikuandu", + "rtull_ll2_yancaogaodu", + "rtull_ll2_xiadikuandu", + "rtull_ll2_fenbian", + ]; + this.formAllBody["11"][4].data.forEach((item, index, arr) => { + for (let i = 0; i < strArr.length; i++) { + if (arr[index].fieldIdentifier === strArr[i]) { + arr[index].isShow = targetStatusArr[select.indexOf(newVal)][i]; + arr[index].fieldName = targetNameArr[select.indexOf(newVal)][i]; + } + } + }); + // console.log(this.formAllBody['1'][2].data, select.indexOf(newVal),'_this.formAllBody[]') + } + ); + // 蒸发皿 + this.$watch( + function () { + return this.formAll[2].form3.rtucgq_zfly; + }, + function (newVal, oldVal) { + var targetNameArr = [ + ["安装高度", "量程", "最小加水量"], + ["无效参数", "无效参数", "最小加水量"], + ["无效参数", "无效参数", "最小加水量"], + ]; + var targetStatusArr = [ + [true, true, true], + [false, false, true], + [false, false, true], + ]; + let select = ["独立蒸发皿", "水位值1", "水位值2"]; // 下拉框值，对应targetArr其他5个控件显示的4状态 + let strArr = ["rtuzf_gaodu", "rtuzf_liangcheng", "rtuzf_zuixiao"]; + this.formAllBody["12"][0].data.forEach((item, index, arr) => { + for (let i = 0; i < strArr.length; i++) { + if (arr[index].fieldIdentifier === strArr[i]) { + arr[index].isShow = targetStatusArr[select.indexOf(newVal)][i]; + arr[index].fieldName = targetNameArr[select.indexOf(newVal)][i]; + } + } + }); + // console.log(this.formAllBody['1'][2].data, select.indexOf(newVal),'_this.formAllBody[]') + } + ); + // 4am， 存储周期 rtuSaveCircle + this.$watch( + function () { + return this.formAll[2].form3.rtucgq_liuliang1; + }, + function (newVal, oldVal) { + var targetNameArr = [ + [ + "安装高度", + "流量校正", + "淤积深度", + "无效参数", + "无效参数", + "无效参数", + "堰槽截面表高度分辨率", + ], + ]; + var targetStatusArr = [ + [true, true, true, false, false, false, false], + ]; + let select = ["独立蒸发皿", "水位值1", "水位值2"]; // 下拉框值，对应targetArr其他5个控件显示的4状态 + let strArr = ["rtuzf_gaodu", "rtuzf_liangcheng", "rtuzf_zuixiao"]; + this.formAllBody["11"][1].data.forEach((item, index, arr) => { + for (let i = 0; i < strArr.length; i++) { + if (arr[index].fieldIdentifier === strArr[i]) { + arr[index].isShow = targetStatusArr[select.indexOf(newVal)][i]; + arr[index].fieldName = targetNameArr[select.indexOf(newVal)][i]; + } + } + }); + // console.log(this.formAllBody['1'][2].data, select.indexOf(newVal),'_this.formAllBody[]') + } + ); + }, }, created() { - this.getSiteList().then(res => { + this.getSiteList().then((res) => { // this.querySiteList[0].rtuStationCode // this.initPage(this.querySite); // this.getRtuHistoryList() @@ -1691,7 +1939,12 @@ this.formControl(); // console.log(666) - } + }, + updated() { + // if(this.formAll.length !==0){ + // this.initWatch() + // } + }, // beforeRouteLeave (to, from, next) { // // 导航离开该组件的对应路由时调用 // // 可以访问组件实例 `this` @@ -1752,12 +2005,12 @@ margin: 11px 0 11px 0 !important; .el-form-item__label { // text-align: right; - width: 160px !important; + width: 180px !important; text-align: right !important; color: var(--white) !important; } .el-form-item__content { - margin: 0 0 0 160px !important; + margin: 0 0 0 180px !important; .el-select { width: 100% !important; .el-input .el-input__inner { diff --git a/src/components/ConfigManager/SiteManagement.vue b/src/components/ConfigManager/SiteManagement.vue index 404080d..44b4598 100644 --- a/src/components/ConfigManager/SiteManagement.vue +++ b/src/components/ConfigManager/SiteManagement.vue @@ -218,7 +218,7 @@
@@ -745,30 +745,6 @@ } ] }, - rules1: { - ruleId: [ - { - required: true, - message: "请选择规则引擎", - trigger: "blur" - } - ], - referRainStationSt: [ - { - required: true, - message: "请选择雨量站", - trigger: "blur", - }, - ], - - isEnable: [ - { - required: true, - message: "请选择是否启用", - trigger: "blur" - } - ], - }, value: [], // 站点管理/所属区域数组 syscityList: [], @@ -929,9 +905,7 @@ } else { httpurl = this.nozzle.siterepairconfigmodify; } - this.$refs[form].validate((valid) => { - if (valid) { - this.$http.post(httpurl, this.configForm).then((res) => { + this.$http.post(httpurl, this.configForm).then(res => { console.log(res); if (res.data.code === 200) { this.configtrue = false; @@ -944,11 +918,6 @@ showClose: true }); }); - - }else{ - console.log("完善信息") - } - }) }, //响应地图组件的确定，拾取坐标 SendLngLat(lonlat) { @@ -1156,9 +1125,22 @@ //添加站点 case "create": this.iscodefalse = false; - this.projectObj = {}; this.yzaddflag = true; this.title = "新增站点"; + this.projectList = this.allPlatSite.map((item) => { + return { + id: item.id, + key: item.platformName, + value: item.platformCode, + areaId: item.area, + }; + }); + this.projectObj = {}; + setTimeout(() => { + if(this.$refs.ruleForm){ + this.$refs.ruleForm.clearValidate(); + } + }, 0); break; //编辑站点 case "update": @@ -1182,6 +1164,11 @@ this.ruleForm[key] = data[key]; } this.yzaddflag = true; + setTimeout(() => { + if(this.$refs.ruleForm){ + this.$refs.ruleForm.clearValidate(); + } + }, 0); break; //配置因子 case "config": diff --git a/src/components/index.vue b/src/components/index.vue index 268ef5a..b423ddd 100644 --- a/src/components/index.vue +++ b/src/components/index.vue @@ -469,8 +469,9 @@ } }, ZhuXIao() { - this.$router.push({ path: "/Login" }); + // this.$router.push({ path: "/Login" }); sessionStorage.clear(); + location.reload(); }, // 初始化验证 initRules() { diff --git a/src/components/login.vue b/src/components/login.vue index 36cbc33..24710ee 100644 --- a/src/components/login.vue +++ b/src/components/login.vue @@ -138,7 +138,7 @@ // 用户在线状态计时 loginTime(); // 保存cook - + this.$router.push("/welcome"); sessionStorage.setItem("powerHandle", response2.data.data); diff --git a/src/components/ConfigManager/RtuConfig.vue b/src/components/ConfigManager/RtuConfig.vue index 2aa6409..60226ac 100644 --- a/src/components/ConfigManager/RtuConfig.vue +++ b/src/components/ConfigManager/RtuConfig.vue @@ -2,7 +2,7 @@
搜索 --> - - + - - 搜索 - + 搜索 + > - + 回显 - + 暂存 - + 暂存回显 - + 提交
- + - + 回显历史记录
@@ -96,10 +123,10 @@
@@ -131,7 +158,9 @@ :key="item.fieldIdentifier" :class="{ 'el-col-class': true, - stop: item.hasOwnProperty('isShow') ? !item.isShow : false + stop: item.hasOwnProperty('isShow') + ? !item.isShow + : false, }" > { - if (item.name === "外置DTU设置") { - arr[index].isShow = newVal; - } - }); - } - ); - // GPRS，LORA开关 - this.$watch( - function() { - return this.formAll[0].form1.rtuInnerMode; - }, - function(newVal, oldVal) { - this.formAllBody["1"].forEach((item, index, arr) => { - if (item.name === "内置LoRa相关配置") { - arr[index].isShow = newVal === "LORA" ? true : false; - } - }); - this.formAllBody["2"].forEach((item, index, arr) => { - if (item.name === "中心站1") { - arr[index].isShow = newVal === "GPRS" ? true : false; - } - if (item.name === "中心站2") { - arr[index].isShow = newVal === "GPRS" ? true : false; - } - if (item.name === "中心站3") { - arr[index].isShow = newVal === "GPRS" ? true : false; - } - if (item.name === "中心站4(备份站)") { - arr[index].isShow = newVal === "GPRS" ? true : false; - } - if (item.name === "VPN专网设置1") { - arr[index].isShow = newVal === "GPRS" ? true : false; - } - if (item.name === "VPN专网设置2") { - arr[index].isShow = newVal === "GPRS" ? true : false; - } - if (item.name === "NBIOT网络设置") { - arr[index].isShow = newVal === "GPRS" ? true : false; - } - if (item.name === "中心站其他设置") { - arr[index].isShow = newVal === "GPRS" ? true : false; - } - if (item.name === "远程后台服务器设置") { - arr[index].isShow = newVal === "GPRS" ? true : false; - } - }); - } - ); - // 水位计雷达 - this.$watch( - function() { - return this.formAll[2].form3.rtucgq_shuiwei1; - }, - function(newVal, oldVal) { - if ( - !( - (newVal === "NF-WGX-5小雷达水位计") | - (newVal === "NF-WGX-6大雷达水位计") - ) - ) { - this.formAllBody["9"][2].isShow = false; - } else { - this.formAllBody["9"][2].isShow = true; - } - } - ); - this.$watch( - function() { - return this.formAll[2].form3.rtucgq_shuiwei2; - }, - function(newVal, oldVal) { - if ( - !( - (newVal === "NF-WGX-5小雷达水位计") | - (newVal === "NF-WGX-6大雷达水位计") - ) - ) { - this.formAllBody["9"][2].isShow = false; - } else { - this.formAllBody["9"][4].isShow = true; - } - } - ); - // 流量计水鬼 - this.$watch( - function() { - return this.formAll[2].form3.rtucgq_liuliang1; - }, - function(newVal, oldVal) { - var targetNameArr = [ - "直接流量输出", - "安装高度", - "流量校正", - "淤积深度", - "无效参数", - "无效参数", - "无效参数", - "堰槽截面表高度分辨率" - ]; - var targetStatusArr = [ - false, - true, - true, - true, - false, - false, - false, - false - ]; - // let select= ['直接流量输出','三角堰','矩形堰','梯形堰','圆管','自定义截面','直角三角堰明渠','巴歇尔槽明渠'] // 下拉框值， - let strArr = [ - "rtull_ll1_jiemian", - "rtull_ll1_gaodu", - "rtull_ll1_jiaozheng", - "rtull_ll1_shendu", - "rtull_ll1_shangdikuandu", - "rtull_ll1_yancaogaodu", - "rtull_ll1_xiadikuandu", - "rtull_ll1_fenbian" - ]; - this.formAllBody["11"][1].data.forEach((item, index, arr) => { - for (let i = 0; i < strArr.length; i++) { - if (arr[index].fieldIdentifier === strArr[i]) { - arr[index].isShow = targetStatusArr[select.indexOf(newVal)][i]; - arr[index].fieldName = targetNameArr[select.indexOf(newVal)][i]; - } - } - }); - } - ); - this.$watch( - function() { - return this.formAll[2].form3.rtucgq_liuliang2; - }, - function(newVal, oldVal) { - if (!(newVal === "NF_LZX_2水龟")) { - this.formAllBody["11"][6].isShow = false; - } else { - this.formAllBody["11"][6].isShow = true; - } - } - ); - // 遥测站 采集标志 开关， 存储周期 rtuSaveCircle - this.$watch( - function() { - return this.formAll[0].form1.rtucjFlagTrans; - }, - function(newVal, oldVal) { - this.formAllBody["1"][0].data[3].isShow = !newVal; - } - ); - // 域名传输 - this.$watch( - function() { - return this.formAll[1].form2.rtuZxZx1RealmNameTrans; - }, - function(newVal, oldVal) { - this.formAllBody["2"][0].data[2].isShow = newVal; - this.formAllBody["2"][0].data[3].isShow = !newVal; - } - ); - this.$watch( - function() { - return this.formAll[1].form2.rtuZxZx2RealmNameTrans; - }, - function(newVal, oldVal) { - this.formAllBody["2"][2].data[2].isShow = newVal; - this.formAllBody["2"][2].data[3].isShow = !newVal; - } - ); - this.$watch( - function() { - return this.formAll[1].form2.rtuZxZx3RealmNameTrans; - }, - function(newVal, oldVal) { - this.formAllBody["2"][4].data[2].isShow = newVal; - this.formAllBody["2"][4].data[3].isShow = !newVal; - } - ); - this.$watch( - function() { - return this.formAll[1].form2.rtuZxZx4RealmNameTrans; - }, - function(newVal, oldVal) { - this.formAllBody["2"][6].data[2].isShow = newVal; - this.formAllBody["2"][6].data[3].isShow = !newVal; - } - ); - // 外置dtu设置，下拉框 - this.$watch( - function() { - return this.formAll[0].form1.rtuother_dtu_type; - }, - function(newVal, oldVal) { - var targetArr = [ - [true, true, true, true, false], - [true, true, false, false, false], - [false, false, false, false, true], - [false, false, false, false, false] - ]; - let select = [ - "LoRa-利尔达CN470", - "ManThink-门思科技", - "BC28电信管理平台NB", - "M5311移动平台NB" - ]; // 下拉框值，对应targetArr其他5个控件显示的4状态 - let strArr = [ - "JoinEUI", - "频率格式", - "上行频率", - "下行频率", - "电信NB服务ID" - ]; - this.formAllBody["1"][2].data.forEach((item, index, arr) => { - for (let i = 0; i < strArr.length; i++) { - if (arr[index].fieldName === strArr[i]) { - arr[index].isShow = targetArr[select.indexOf(newVal)][i]; - } - } - }); - // console.log(this.formAllBody['1'][2].data, select.indexOf(newVal),'_this.formAllBody[]') - } - ); - // 从机1 ，2设置 - this.$watch( - function() { - return this.formAll[2].form3.rtucgq_congji1; - }, - function(newVal, oldVal) { - var targetNameArr = [ - ["无效参数", "无效参数", "无效参数"], - ["抽水周期", "抽水超时", "排水超时"], - ["无效参数", "无效参数", "无效参数"], - ["采集周期", "通道延时", "演示递增"], - ["采集周期", "通道延时", "无效参数"], - ["查询周期", "抽水超时", "排水超时"] - ]; - var targetStatusArr = [ - [false, false, false], - [true, true, true], - [false, false, false], - [true, true, true], - [true, true, false], - [true, true, true] - ]; - let select = [ - "默认从机", - "电机驱动板（水质监测柜）", - "VGUS屏幕（水质监测柜）", - "二供（净水器）", - "二供（水箱）", - "主控板（5/9参数水质监测柜）" - ]; // 下拉框值，对应targetArr其他5个控件显示的4状态 - let strArr = ["rtucj1_canshu1", "rtucj1_canshu2", "rtucj1_canshu3"]; - this.formAllBody["7"][1].data.forEach((item, index, arr) => { - for (let i = 0; i < strArr.length; i++) { - if (arr[index].fieldIdentifier === strArr[i]) { - arr[index].isShow = targetStatusArr[select.indexOf(newVal)][i]; - arr[index].fieldName = targetNameArr[select.indexOf(newVal)][i]; - } - } - }); - // console.log(this.formAllBody['1'][2].data, select.indexOf(newVal),'_this.formAllBody[]') - } - ); - this.$watch( - function() { - return this.formAll[2].form3.rtucgq_congji2; - }, - function(newVal, oldVal) { - var targetNameArr = [ - ["无效参数", "无效参数", "无效参数"], - ["抽水周期", "抽水超时", "排水超时"], - ["无效参数", "无效参数", "无效参数"], - ["采集周期", "通道延时", "演示递增"], - ["采集周期", "通道延时", "无效参数"], - ["查询周期", "抽水超时", "排水超时"] - ]; - var targetStatusArr = [ - [false, false, false], - [true, true, true], - [false, false, false], - [true, true, true], - [true, true, false], - [true, true, true] - ]; - let select = [ - "默认从机", - "电机驱动板（水质监测柜）", - "VGUS屏幕（水质监测柜）", - "二供（净水器）", - "二供（水箱）", - "主控板（5/9参数水质监测柜）" - ]; // 下拉框值，对应targetArr其他5个控件显示的4状态 - let strArr = ["rtucj2_canshu1", "rtucj2_canshu2", "rtucj2_canshu3"]; - this.formAllBody["7"][3].data.forEach((item, index, arr) => { - for (let i = 0; i < strArr.length; i++) { - if (arr[index].fieldIdentifier === strArr[i]) { - arr[index].isShow = targetStatusArr[select.indexOf(newVal)][i]; - arr[index].fieldName = targetNameArr[select.indexOf(newVal)][i]; - } - } - }); - // console.log(this.formAllBody['1'][2].data, select.indexOf(newVal),'_this.formAllBody[]') - } - ); - // 流量计 流量槽 - this.$watch( - function() { - return this.formAll[10].form11.rtull_ll1_jiemian; - }, - function(newVal, oldVal) { - var targetNameArr = [ - [ - "安装高度", - "流量校正", - "淤积深度", - "无效参数", - "无效参数", - "无效参数", - "堰槽截面表高度分辨率" - ], - [ - "安装高度", - "流量校正", - "淤积深度", - "上地宽度", - "堰槽高度", - "无效参数", - "堰槽截面表高度分辨率" - ], - [ - "安装高度", - "流量校正", - "淤积深度", - "上地宽度", - "堰槽高度", - "无效参数", - "堰槽截面表高度分辨率" - ], - [ - "安装高度", - "流量校正", - "淤积深度", - "窄底宽度", - "堰槽高度", - "宽底宽度", - "堰槽截面表高度分辨率" - ], - [ - "安装高度", - "流量校正", - "淤积深度", - "无效参数", - "槽堰直径", - "无效参数", - "堰槽截面表高度分辨率" - ], - [ - "安装高度", - "流量校正", - "淤积深度", - "无效参数", - "无效参数", - "无效参数", - "堰槽截面表高度分辨率" - ], - [ - "溢流高度", - "流量校正", - "淤积深度", - "无效参数", - "槽堰高度", - "无效参数", - "堰槽截面表高度分辨率" - ], - [ - "溢流高度", - "流量校正", - "淤积深度", - "槽堰高度", - "槽序号", - "无效参数", - "堰槽截面表高度分辨率" - ] - ]; - var targetStatusArr = [ - [true, true, true, false, false, false, false], - [true, true, true, true, true, false, false], - [true, true, true, true, true, false, false], - [true, true, true, true, true, true, false], - [true, true, true, false, true, false, false], - [true, true, true, false, false, false, true], - [true, true, true, false, true, false, false], - [true, true, true, true, true, false, false] - ]; - let select = [ - "直接流量输出", - "三角堰", - "矩形堰", - "梯形堰", - "圆管", - "自定义截面", - "直角三角堰明渠", - "巴歇尔槽明渠" - ]; // 下拉框值， - let strArr = [ - "rtull_ll1_gaodu", - "rtull_ll1_jiaozheng", - "rtull_ll1_shendu", - "rtull_ll1_shangdikuandu", - "rtull_ll1_yancaogaodu", - "rtull_ll1_xiadikuandu", - "rtull_ll1_fenbian" - ]; - this.formAllBody["11"][1].data.forEach((item, index, arr) => { - for (let i = 0; i < strArr.length; i++) { - if (arr[index].fieldIdentifier === strArr[i]) { - arr[index].isShow = targetStatusArr[select.indexOf(newVal)][i]; - arr[index].fieldName = targetNameArr[select.indexOf(newVal)][i]; - } - } - }); - // console.log(this.formAllBody['1'][2].data, select.indexOf(newVal),'_this.formAllBody[]') - } - ); - // 蒸发皿 - this.$watch( - function() { - return this.formAll[2].form3.rtucgq_zfly; - }, - function(newVal, oldVal) { - var targetNameArr = [ - ["安装高度", "量程", "最小加水量"], - ["无效参数", "无效参数", "最小加水量"], - ["无效参数", "无效参数", "最小加水量"] - ]; - var targetStatusArr = [ - [true, true, true], - [false, false, true], - [false, false, true] - ]; - let select = ["独立蒸发皿", "水位值1", "水位值2"]; // 下拉框值，对应targetArr其他5个控件显示的4状态 - let strArr = ["rtuzf_gaodu", "rtuzf_liangcheng", "rtuzf_zuixiao"]; - this.formAllBody["12"][0].data.forEach((item, index, arr) => { - for (let i = 0; i < strArr.length; i++) { - if (arr[index].fieldIdentifier === strArr[i]) { - arr[index].isShow = targetStatusArr[select.indexOf(newVal)][i]; - arr[index].fieldName = targetNameArr[select.indexOf(newVal)][i]; - } - } - }); - // console.log(this.formAllBody['1'][2].data, select.indexOf(newVal),'_this.formAllBody[]') - } - ); - // 4am， 存储周期 rtuSaveCircle - this.$watch( - function() { - return this.formAll[2].form3.rtucgq_liuliang1; - }, - function(newVal, oldVal) { - var targetNameArr = [ - [ - "安装高度", - "流量校正", - "淤积深度", - "无效参数", - "无效参数", - "无效参数", - "堰槽截面表高度分辨率" - ] - ]; - var targetStatusArr = [[true, true, true, false, false, false, false]]; - let select = ["独立蒸发皿", "水位值1", "水位值2"]; // 下拉框值，对应targetArr其他5个控件显示的4状态 - let strArr = ["rtuzf_gaodu", "rtuzf_liangcheng", "rtuzf_zuixiao"]; - this.formAllBody["11"][1].data.forEach((item, index, arr) => { - for (let i = 0; i < strArr.length; i++) { - if (arr[index].fieldIdentifier === strArr[i]) { - arr[index].isShow = targetStatusArr[select.indexOf(newVal)][i]; - arr[index].fieldName = targetNameArr[select.indexOf(newVal)][i]; - } - } - }); - // console.log(this.formAllBody['1'][2].data, select.indexOf(newVal),'_this.formAllBody[]') - } - ); + this.initWatch(); // bottom }, methods: { - search(){ + search() { this.formAll = []; - this.querySite= [] + this.querySite = []; // console.log(this.querySite,'querySite') - this.getSiteList(this.searchCode) + this.getSiteList(this.searchCode); }, - switchChange(val){ + switchChange(val) { // console.log(val,this.formAll[0].form1,'change') }, switchClick(val) { @@ -1093,20 +635,35 @@ }, temStorageEcho() { // this.activeIndex = '0' - if(localStorage.getItem(this.querySite[1])){ - this.formAll = JSON.parse(localStorage.getItem(name)); - this.$message({ message: "暂存回显成功", type: "success" }); + if ( + this.querySite.length === 2 && + localStorage.getItem(this.querySite[1]) + ) { + this.formAll = JSON.parse(localStorage.getItem(this.querySite[1])); + console.log(this.formAll, this.querySite[1], "this.formAll"); + + this.$message({ + message: `${this.querySite[1]}暂存回显成功`, + type: "success", + }); } else { this.$message({ message: "无暂存内容", type: "warning" }); } // console.log(JSON.parse(sessionStorage.getItem(name)),111) }, temStorage() { - try { - localStorage.setItem(this.querySite[1], JSON.stringify(this.formAll)); - this.$message({ message: `${this.querySite[1]}保存成功`, type: "success" }); - } catch (err) { - this.$message({ message: err, type: "warning" }); + if (this.querySite.length === 2) { + try { + localStorage.removeItem(this.querySite[1]); + // console.log(this.formAll,'this.formAll') + localStorage.setItem(this.querySite[1], JSON.stringify(this.formAll)); + this.$message({ + message: `${this.querySite[1]}保存成功`, + type: "success", + }); + } catch (err) { + this.$message({ message: err, type: "warning" }); + } } // sessionStorage.setItem(name,'999') // // location.href='http://192.168.16.189:8080/#/ConfigManager/RtuConfig' @@ -1115,17 +672,63 @@ // console.log(sessionStorage.setItem(name),111) }, sunmitAll() { + console.log(this.formAll, "formAll"); + // 水位计 流量计 蒸发皿 rtucgq_llly1 + // let shuiWeiArr = ['独立水位计','流量计内置水位计','蒸发皿'] + // let liuLiangArr = ['内置水位计','外置独立水位计'] + // let zhengFaMinArr = ['独立蒸发皿','水位值1','水位值2'] + if ( + this.formAll[2].form3.rtucgq_swly1 === "蒸发皿" && + this.formAll[2].form3.rtucgq_zfly === "水位值1" + ) { + this.$message({ + message: `水位计1和蒸发皿数据冲突！`, + type: "warning", + }); + return; + } + if ( + this.formAll[2].form3.rtucgq_swly2 === "蒸发皿" && + this.formAll[2].form3.rtucgq_zfly === "水位值2" + ) { + this.$message({ + message: `水位计2和蒸发皿数据冲突！`, + type: "warning", + }); + return; + } + if ( + this.formAll[2].form3.rtucgq_swly1 === "流量计内置水位计" && + this.formAll[2].form3.rtucgq_llly1 === "外置独立水位计" + ) { + this.$message({ + message: `水位计1和流量计1数据冲突！`, + type: "warning", + }); + return; + } + if ( + this.formAll[2].form3.rtucgq_swly2 === "流量计内置水位计" && + this.formAll[2].form3.rtucgq_llly2 === "外置独立水位计" + ) { + this.$message({ + message: `水位计2和流量计2数据冲突！`, + type: "warning", + }); + return; + } + // return ; // 提交所有表单，循环校验所有表单，当有个表单校验失败就break，提示该表单校验失败，根据校验成功总数或者无失败确定完成，组装数据发送到后台 var successCount = 0; var successFlag = false; for (var i = 0; i < 15; i++) { - this.$refs["form"][i].validate(valid => { + this.$refs["form"][i].validate((valid) => { if (valid) { successCount++; } else { this.$message({ message: `${this.siteNameList[i]} 校验失败，请查看`, - type: "warning" + type: "warning", }); // alert(`${this.siteNameList[i]} 校验失败，请查看`); // this.$notify({ @@ -1166,8 +769,8 @@ rtuEvaporatingDishSetting: this.formAll[11].form12, rtuSoilSettler: this.formAll[12].form13, rtu4To20Setting: this.formAll[13].form14, - rtuOtherSetting: this.formAll[14].form15 - } + rtuOtherSetting: this.formAll[14].form15, + }, }; // 之前初始化时将3处的两个数组生成了需要的字段，现在需要把每处16个字段组装成两数组，删除不需要的字段,转化方法暂时写在这里 function dealInputSwitch( @@ -1236,7 +839,7 @@ ] = rtucamera_jiabaoNew; this.$http .post(`${this.nozzle.rTUSettingServiceUpdate}`, parmas) - .then(res => { + .then((res) => { // console.log(res,'rTUSettingServiceUpdate') this.echoClick(); }); @@ -1278,11 +881,11 @@ }, selectChange(val) { // this.querySite = [] - this.rtuHistoryId='' + this.rtuHistoryId = ""; // console.log(val,'val') // if(this.querySite.length!==2) return; this.echoClick(val); - this.getRtuHistoryList() + this.getRtuHistoryList(); }, selectChange1(val) { // console.log(val,'val') input搜索 @@ -1294,7 +897,7 @@ // this.echoClick(val); }, async initPage(site) { - this.loading = true + this.loading = true; // 切换站点后去请求历史下拉框 // this.getRtuHistoryList() // 回显接口请求数据 将水文传感里面3处特殊的控件需要的值，用请求数据遍历生成表单需要的字段，因为这3处的动态表单使用的是死的字段，其他的对应的表单数据赋值给对应表单就能回显了、 @@ -1320,7 +923,7 @@ "rtuEvaporatingDishSetting", "rtuSoilSettler", "rtu4To20Setting", - "rtuOtherSetting" + "rtuOtherSetting", ]; // console.log(this.formAll,resData,'ressssss') // this.formAll={} @@ -1402,7 +1005,7 @@ this.formAll.push(obj); // console.log(this.formAll,this.stCode,'this.formAll') } - this.loading = false + this.loading = false; }, async initPage2(rtuCode) { // 回显接口请求数据 将水文传感里面3处特殊的控件需要的值，用请求数据遍历生成表单需要的字段，因为这3处的动态表单使用的是死的字段，其他的对应的表单数据赋值给对应表单就能回显了、 @@ -1425,7 +1028,7 @@ "rtuEvaporatingDishSetting", "rtuSoilSettler", "rtu4To20Setting", - "rtuOtherSetting" + "rtuOtherSetting", ]; console.log(this.formAll, resData, "ressssss"); // this.formAll={} @@ -1598,36 +1201,55 @@ return temp; } // 生成表单控件的接口 - this.$http.post(this.nozzle.rtuPageQueryPage).then(res => { + this.$http.post(this.nozzle.rtuPageQueryPage).then((res) => { var dataRes = res.data.data; // console.log(dataRes,'dataRes') for (var i in dataRes) { if (dataRes[i].length !== 0) { dataRes[i].forEach((item, index, arr) => { - this.rules[item.fieldIdentifier] = [ - { - validator: (rule, value, callback) => { - this.validatorAll( - rule, - value, - callback, - item.validatorType, - item.validatorRules, - item.validatorErrorText - ); + if (item.fieldType !== 5) { + this.rules[item.fieldIdentifier] = [ + { + validator: (rule, value, callback) => { + this.validatorAll( + rule, + value, + callback, + item.validatorType, + item.validatorRules, + item.validatorErrorText + ); + }, + trigger: "change", }, - trigger: "change" - } - ]; + ]; + } else if (item.fieldType === 5) { + this.rules[item.fieldIdentifier] = [ + { + validator: (rule, value, callback) => { + this.validatorAll( + rule, + value, + callback, + item.validatorType, + item.validatorRules, + item.validatorErrorText + ); + }, + trigger: "change", + }, + { required: true, message: "必填", trigger: "change" }, + ]; + } }); - let sub_titleList = dataRes[i].map(item => { + let sub_titleList = dataRes[i].map((item) => { return item.subTitle; }); var newObj = []; // 根据小标题去重 - uniq(sub_titleList).forEach(item => { + uniq(sub_titleList).forEach((item) => { var obj = { name: item, data: [], isShow: true, isBlock: true }; - var data = dataRes[i].forEach(l => { + var data = dataRes[i].forEach((l) => { l.isShow = true; if ( l.subTitle === item && @@ -1651,11 +1273,11 @@ console.log(this.formAllBody, "999"); }); }, - async getSiteList(val='') { - // ,{stCode:this.querySite} + async getSiteList(val = "") { + // ,{stCode:this.querySite} await this.$http .post(`${this.nozzle.rTUSettingServiceQueryList}?stCode=${val}`) - .then(res => { + .then((res) => { // console.log(res.data.data,'resss') this.querySiteList = res.data.data; // this.querySiteList.push({ @@ -1675,15 +1297,641 @@ await this.$http //`${this.nozzle.queryRTUSettingHistory}?stCode=${this.querySite}` .post(`${this.nozzle.queryRTUSettingHistory}?rtuCode=${rtuCode}`) - .then(res => { + .then((res) => { // console.log(res.data,'resss') this.rtuHistoryList = res.data.data; // this.querySite = this.querySiteList[0].rtuStationCode; }); - } + }, + initWatch() { + // console.log(this.formAll,this.formAllBody,'this.formAll[0]') + //// 第一个函数就是处理你要监听的属性，只要将其return出去就行 + // 外置dtu开关 + this.$watch( + function () { + return this.formAll[0].form1.rtuOutDtu; + }, + function (newVal, oldVal) { + this.formAllBody["1"].forEach((item, index, arr) => { + if (item.name === "外置DTU设置") { + arr[index].isShow = newVal; + } + }); + } + ); + // GPRS，LORA开关 + this.$watch( + function () { + return this.formAll[0].form1.rtuInnerMode; + }, + function (newVal, oldVal) { + this.formAllBody["1"].forEach((item, index, arr) => { + if (item.name === "内置LoRa相关配置") { + arr[index].isShow = newVal === "LORA" ? true : false; + } + }); + this.formAllBody["2"].forEach((item, index, arr) => { + if (item.name === "中心站1") { + arr[index].isShow = newVal === "GPRS" ? true : false; + } + if (item.name === "中心站2") { + arr[index].isShow = newVal === "GPRS" ? true : false; + } + if (item.name === "中心站3") { + arr[index].isShow = newVal === "GPRS" ? true : false; + } + if (item.name === "中心站4(备份站)") { + arr[index].isShow = newVal === "GPRS" ? true : false; + } + if (item.name === "VPN专网设置1") { + arr[index].isShow = newVal === "GPRS" ? true : false; + } + if (item.name === "VPN专网设置2") { + arr[index].isShow = newVal === "GPRS" ? true : false; + } + if (item.name === "NBIOT网络设置") { + arr[index].isShow = newVal === "GPRS" ? true : false; + } + if (item.name === "中心站其他设置") { + arr[index].isShow = newVal === "GPRS" ? true : false; + } + if (item.name === "远程后台服务器设置") { + arr[index].isShow = newVal === "GPRS" ? true : false; + } + }); + } + ); + // 水位计雷达 + this.$watch( + function () { + return this.formAll[2].form3.rtucgq_shuiwei1; + }, + function (newVal, oldVal) { + if ( + !( + (newVal === "NF-WGX-5小雷达水位计") | + (newVal === "NF-WGX-6大雷达水位计") + ) + ) { + this.formAllBody["9"][2].isShow = false; + } else { + this.formAllBody["9"][2].isShow = true; + } + } + ); + this.$watch( + function () { + return this.formAll[2].form3.rtucgq_shuiwei2; + }, + function (newVal, oldVal) { + if ( + !( + (newVal === "NF-WGX-5小雷达水位计") | + (newVal === "NF-WGX-6大雷达水位计") + ) + ) { + this.formAllBody["9"][2].isShow = false; + } else { + this.formAllBody["9"][4].isShow = true; + } + } + ); + // 流量计水龟 流量计1 流量计1设置 + this.$watch( + function () { + return this.formAll[2].form3.rtucgq_liuliang1; + }, + function (newVal, oldVal) { + let arr = [ + "4-20mA流量计", + "NACH-FL900流速仪", + "LWGY涡轮流量计", + "SM_311水表", + ]; + if (arr.indexOf(newVal) !== -1) { + this.formAll[10].form11.rtull_ll1_jiemian = "直接流量输出"; + this.formAllBody["11"][1].data[0].isShow = false; + } else { + this.formAllBody["11"][1].data[0].isShow = true; + } + } + ); + this.$watch( + function () { + return this.formAll[2].form3.rtucgq_liuliang2; + }, + function (newVal, oldVal) { + let arr = [ + "4-20mA流量计", + "NACH-FL900流速仪", + "LWGY涡轮流量计", + "SM_311水表", + ]; + if (arr.indexOf(newVal) !== -1) { + this.formAll[10].form11.rtull_ll2_jiemian = "直接流量输出"; + this.formAllBody["11"][4].data[0].isShow = false; + } else { + this.formAllBody["11"][4].data[0].isShow = true; + } + } + ); + this.$watch( + function () { + return this.formAll[2].form3.rtucgq_liuliang2; + }, + function (newVal, oldVal) { + if (!(newVal === "NF_LZX_2水龟")) { + this.formAllBody["11"][6].isShow = false; + } else { + this.formAllBody["11"][6].isShow = true; + } + } + ); + // 遥测站 采集标志 开关， 存储周期 rtuSaveCircle + this.$watch( + function () { + return this.formAll[0].form1.rtucjFlagTrans; + }, + function (newVal, oldVal) { + this.formAllBody["1"][0].data[3].isShow = !newVal; + } + ); + // 域名传输 + this.$watch( + function () { + return this.formAll[1].form2.rtuZxZx1RealmNameTrans; + }, + function (newVal, oldVal) { + this.formAllBody["2"][0].data[2].isShow = newVal; + this.formAllBody["2"][0].data[3].isShow = !newVal; + } + ); + this.$watch( + function () { + return this.formAll[1].form2.rtuZxZx2RealmNameTrans; + }, + function (newVal, oldVal) { + this.formAllBody["2"][2].data[2].isShow = newVal; + this.formAllBody["2"][2].data[3].isShow = !newVal; + } + ); + this.$watch( + function () { + return this.formAll[1].form2.rtuZxZx3RealmNameTrans; + }, + function (newVal, oldVal) { + this.formAllBody["2"][4].data[2].isShow = newVal; + this.formAllBody["2"][4].data[3].isShow = !newVal; + } + ); + this.$watch( + function () { + return this.formAll[1].form2.rtuZxZx4RealmNameTrans; + }, + function (newVal, oldVal) { + this.formAllBody["2"][6].data[2].isShow = newVal; + this.formAllBody["2"][6].data[3].isShow = !newVal; + } + ); + // 外置dtu设置，下拉框 + this.$watch( + function () { + return this.formAll[0].form1.rtuother_dtu_type; + }, + function (newVal, oldVal) { + var targetArr = [ + [true, true, true, true, false], + [true, true, false, false, false], + [false, false, false, false, true], + [false, false, false, false, false], + ]; + let select = [ + "LoRa-利尔达CN470", + "ManThink-门思科技", + "BC28电信管理平台NB", + "M5311移动平台NB", + ]; // 下拉框值，对应targetArr其他5个控件显示的4状态 + let strArr = [ + "JoinEUI", + "频率格式", + "上行频率", + "下行频率", + "电信NB服务ID", + ]; + this.formAllBody["1"][2].data.forEach((item, index, arr) => { + for (let i = 0; i < strArr.length; i++) { + if (arr[index].fieldName === strArr[i]) { + arr[index].isShow = targetArr[select.indexOf(newVal)][i]; + } + } + }); + // console.log(this.formAllBody['1'][2].data, select.indexOf(newVal),'_this.formAllBody[]') + } + ); + // 从机1 ，2设置 + this.$watch( + function () { + return this.formAll[2].form3.rtucgq_congji1; + }, + function (newVal, oldVal) { + var targetNameArr = [ + ["无效参数", "无效参数", "无效参数"], + ["抽水周期", "抽水超时", "排水超时"], + ["无效参数", "无效参数", "无效参数"], + ["采集周期", "通道延时", "演示递增"], + ["采集周期", "通道延时", "无效参数"], + ["查询周期", "抽水超时", "排水超时"], + ]; + var targetStatusArr = [ + [false, false, false], + [true, true, true], + [false, false, false], + [true, true, true], + [true, true, false], + [true, true, true], + ]; + let select = [ + "默认从机", + "电机驱动板（水质监测柜）", + "VGUS屏幕（水质监测柜）", + "二供（净水器）", + "二供（水箱）", + "主控板（5/9参数水质监测柜）", + ]; // 下拉框值，对应targetArr其他5个控件显示的4状态 + let strArr = ["rtucj1_canshu1", "rtucj1_canshu2", "rtucj1_canshu3"]; + this.formAllBody["7"][1].data.forEach((item, index, arr) => { + for (let i = 0; i < strArr.length; i++) { + if (arr[index].fieldIdentifier === strArr[i]) { + arr[index].isShow = targetStatusArr[select.indexOf(newVal)][i]; + arr[index].fieldName = targetNameArr[select.indexOf(newVal)][i]; + } + } + }); + // console.log(this.formAllBody['1'][2].data, select.indexOf(newVal),'_this.formAllBody[]') + } + ); + this.$watch( + function () { + return this.formAll[6].form7.rtucj_kaiguan1; + }, + function (newVal, oldVal) { + this.formAllBody["7"][1].isShow = newVal; + } + ); + this.$watch( + function () { + return this.formAll[6].form7.rtucj_kaiguan2; + }, + function (newVal, oldVal) { + this.formAllBody["7"][3].isShow = newVal; + } + ); + this.$watch( + function () { + return this.formAll[2].form3.rtucgq_congji2; + }, + function (newVal, oldVal) { + var targetNameArr = [ + ["无效参数", "无效参数", "无效参数"], + ["抽水周期", "抽水超时", "排水超时"], + ["无效参数", "无效参数", "无效参数"], + ["采集周期", "通道延时", "演示递增"], + ["采集周期", "通道延时", "无效参数"], + ["查询周期", "抽水超时", "排水超时"], + ]; + var targetStatusArr = [ + [false, false, false], + [true, true, true], + [false, false, false], + [true, true, true], + [true, true, false], + [true, true, true], + ]; + let select = [ + "默认从机", + "电机驱动板（水质监测柜）", + "VGUS屏幕（水质监测柜）", + "二供（净水器）", + "二供（水箱）", + "主控板（5/9参数水质监测柜）", + ]; // 下拉框值，对应targetArr其他5个控件显示的4状态 + let strArr = ["rtucj2_canshu1", "rtucj2_canshu2", "rtucj2_canshu3"]; + this.formAllBody["7"][3].data.forEach((item, index, arr) => { + for (let i = 0; i < strArr.length; i++) { + if (arr[index].fieldIdentifier === strArr[i]) { + arr[index].isShow = targetStatusArr[select.indexOf(newVal)][i]; + arr[index].fieldName = targetNameArr[select.indexOf(newVal)][i]; + } + } + }); + // console.log(this.formAllBody['1'][2].data, select.indexOf(newVal),'_this.formAllBody[]') + } + ); + // 流量计 流量槽 + this.$watch( + function () { + return this.formAll[10].form11.rtull_ll1_jiemian; + }, + function (newVal, oldVal) { + var targetNameArr = [ + [ + "安装高度", + "流量校正", + "淤积深度", + "无效参数", + "无效参数", + "无效参数", + "堰槽截面表高度分辨率", + ], + [ + "安装高度", + "流量校正", + "淤积深度", + "上地宽度", + "堰槽高度", + "无效参数", + "堰槽截面表高度分辨率", + ], + [ + "安装高度", + "流量校正", + "淤积深度", + "上地宽度", + "堰槽高度", + "无效参数", + "堰槽截面表高度分辨率", + ], + [ + "安装高度", + "流量校正", + "淤积深度", + "窄底宽度", + "堰槽高度", + "宽底宽度", + "堰槽截面表高度分辨率", + ], + [ + "安装高度", + "流量校正", + "淤积深度", + "无效参数", + "槽堰直径", + "无效参数", + "堰槽截面表高度分辨率", + ], + [ + "安装高度", + "流量校正", + "淤积深度", + "无效参数", + "无效参数", + "无效参数", + "堰槽截面表高度分辨率", + ], + [ + "溢流高度", + "流量校正", + "淤积深度", + "无效参数", + "槽堰高度", + "无效参数", + "堰槽截面表高度分辨率", + ], + [ + "溢流高度", + "流量校正", + "淤积深度", + "槽堰高度", + "槽序号", + "无效参数", + "堰槽截面表高度分辨率", + ], + ]; + var targetStatusArr = [ + [true, true, true, false, false, false, false], + [true, true, true, true, true, false, false], + [true, true, true, true, true, false, false], + [true, true, true, true, true, true, false], + [true, true, true, false, true, false, false], + [true, true, true, false, false, false, true], + [true, true, true, false, true, false, false], + [true, true, true, true, true, false, false], + ]; + let select = [ + "直接流量输出", + "三角堰", + "矩形堰", + "梯形堰", + "圆管", + "自定义截面", + "直角三角堰明渠", + "巴歇尔槽明渠", + ]; // 下拉框值， + let strArr = [ + "rtull_ll1_gaodu", + "rtull_ll1_jiaozheng", + "rtull_ll1_shendu", + "rtull_ll1_shangdikuandu", + "rtull_ll1_yancaogaodu", + "rtull_ll1_xiadikuandu", + "rtull_ll1_fenbian", + ]; + this.formAllBody["11"][1].data.forEach((item, index, arr) => { + for (let i = 0; i < strArr.length; i++) { + if (arr[index].fieldIdentifier === strArr[i]) { + arr[index].isShow = targetStatusArr[select.indexOf(newVal)][i]; + arr[index].fieldName = targetNameArr[select.indexOf(newVal)][i]; + } + } + }); + // console.log(this.formAllBody['1'][2].data, select.indexOf(newVal),'_this.formAllBody[]') + } + ); + this.$watch( + function () { + return this.formAll[10].form11.rtull_ll2_jiemian; + }, + function (newVal, oldVal) { + var targetNameArr = [ + [ + "安装高度", + "流量校正", + "淤积深度", + "无效参数", + "无效参数", + "无效参数", + "堰槽截面表高度分辨率", + ], + [ + "安装高度", + "流量校正", + "淤积深度", + "上地宽度", + "堰槽高度", + "无效参数", + "堰槽截面表高度分辨率", + ], + [ + "安装高度", + "流量校正", + "淤积深度", + "上地宽度", + "堰槽高度", + "无效参数", + "堰槽截面表高度分辨率", + ], + [ + "安装高度", + "流量校正", + "淤积深度", + "窄底宽度", + "堰槽高度", + "宽底宽度", + "堰槽截面表高度分辨率", + ], + [ + "安装高度", + "流量校正", + "淤积深度", + "无效参数", + "槽堰直径", + "无效参数", + "堰槽截面表高度分辨率", + ], + [ + "安装高度", + "流量校正", + "淤积深度", + "无效参数", + "无效参数", + "无效参数", + "堰槽截面表高度分辨率", + ], + [ + "溢流高度", + "流量校正", + "淤积深度", + "无效参数", + "槽堰高度", + "无效参数", + "堰槽截面表高度分辨率", + ], + [ + "溢流高度", + "流量校正", + "淤积深度", + "槽堰高度", + "槽序号", + "无效参数", + "堰槽截面表高度分辨率", + ], + ]; + var targetStatusArr = [ + [true, true, true, false, false, false, false], + [true, true, true, true, true, false, false], + [true, true, true, true, true, false, false], + [true, true, true, true, true, true, false], + [true, true, true, false, true, false, false], + [true, true, true, false, false, false, true], + [true, true, true, false, true, false, false], + [true, true, true, true, true, false, false], + ]; + let select = [ + "直接流量输出", + "三角堰", + "矩形堰", + "梯形堰", + "圆管", + "自定义截面", + "直角三角堰明渠", + "巴歇尔槽明渠", + ]; // 下拉框值， + let strArr = [ + "rtull_ll2_gaodu", + "rtull_ll2_jiaozheng", + "rtull_ll2_shendu", + "rtull_ll2_shangdikuandu", + "rtull_ll2_yancaogaodu", + "rtull_ll2_xiadikuandu", + "rtull_ll2_fenbian", + ]; + this.formAllBody["11"][4].data.forEach((item, index, arr) => { + for (let i = 0; i < strArr.length; i++) { + if (arr[index].fieldIdentifier === strArr[i]) { + arr[index].isShow = targetStatusArr[select.indexOf(newVal)][i]; + arr[index].fieldName = targetNameArr[select.indexOf(newVal)][i]; + } + } + }); + // console.log(this.formAllBody['1'][2].data, select.indexOf(newVal),'_this.formAllBody[]') + } + ); + // 蒸发皿 + this.$watch( + function () { + return this.formAll[2].form3.rtucgq_zfly; + }, + function (newVal, oldVal) { + var targetNameArr = [ + ["安装高度", "量程", "最小加水量"], + ["无效参数", "无效参数", "最小加水量"], + ["无效参数", "无效参数", "最小加水量"], + ]; + var targetStatusArr = [ + [true, true, true], + [false, false, true], + [false, false, true], + ]; + let select = ["独立蒸发皿", "水位值1", "水位值2"]; // 下拉框值，对应targetArr其他5个控件显示的4状态 + let strArr = ["rtuzf_gaodu", "rtuzf_liangcheng", "rtuzf_zuixiao"]; + this.formAllBody["12"][0].data.forEach((item, index, arr) => { + for (let i = 0; i < strArr.length; i++) { + if (arr[index].fieldIdentifier === strArr[i]) { + arr[index].isShow = targetStatusArr[select.indexOf(newVal)][i]; + arr[index].fieldName = targetNameArr[select.indexOf(newVal)][i]; + } + } + }); + // console.log(this.formAllBody['1'][2].data, select.indexOf(newVal),'_this.formAllBody[]') + } + ); + // 4am， 存储周期 rtuSaveCircle + this.$watch( + function () { + return this.formAll[2].form3.rtucgq_liuliang1; + }, + function (newVal, oldVal) { + var targetNameArr = [ + [ + "安装高度", + "流量校正", + "淤积深度", + "无效参数", + "无效参数", + "无效参数", + "堰槽截面表高度分辨率", + ], + ]; + var targetStatusArr = [ + [true, true, true, false, false, false, false], + ]; + let select = ["独立蒸发皿", "水位值1", "水位值2"]; // 下拉框值，对应targetArr其他5个控件显示的4状态 + let strArr = ["rtuzf_gaodu", "rtuzf_liangcheng", "rtuzf_zuixiao"]; + this.formAllBody["11"][1].data.forEach((item, index, arr) => { + for (let i = 0; i < strArr.length; i++) { + if (arr[index].fieldIdentifier === strArr[i]) { + arr[index].isShow = targetStatusArr[select.indexOf(newVal)][i]; + arr[index].fieldName = targetNameArr[select.indexOf(newVal)][i]; + } + } + }); + // console.log(this.formAllBody['1'][2].data, select.indexOf(newVal),'_this.formAllBody[]') + } + ); + }, }, created() { - this.getSiteList().then(res => { + this.getSiteList().then((res) => { // this.querySiteList[0].rtuStationCode // this.initPage(this.querySite); // this.getRtuHistoryList() @@ -1691,7 +1939,12 @@ this.formControl(); // console.log(666) - } + }, + updated() { + // if(this.formAll.length !==0){ + // this.initWatch() + // } + }, // beforeRouteLeave (to, from, next) { // // 导航离开该组件的对应路由时调用 // // 可以访问组件实例 `this` @@ -1752,12 +2005,12 @@ margin: 11px 0 11px 0 !important; .el-form-item__label { // text-align: right; - width: 160px !important; + width: 180px !important; text-align: right !important; color: var(--white) !important; } .el-form-item__content { - margin: 0 0 0 160px !important; + margin: 0 0 0 180px !important; .el-select { width: 100% !important; .el-input .el-input__inner { diff --git a/src/components/ConfigManager/SiteManagement.vue b/src/components/ConfigManager/SiteManagement.vue index 404080d..44b4598 100644 --- a/src/components/ConfigManager/SiteManagement.vue +++ b/src/components/ConfigManager/SiteManagement.vue @@ -218,7 +218,7 @@
@@ -745,30 +745,6 @@ } ] }, - rules1: { - ruleId: [ - { - required: true, - message: "请选择规则引擎", - trigger: "blur" - } - ], - referRainStationSt: [ - { - required: true, - message: "请选择雨量站", - trigger: "blur", - }, - ], - - isEnable: [ - { - required: true, - message: "请选择是否启用", - trigger: "blur" - } - ], - }, value: [], // 站点管理/所属区域数组 syscityList: [], @@ -929,9 +905,7 @@ } else { httpurl = this.nozzle.siterepairconfigmodify; } - this.$refs[form].validate((valid) => { - if (valid) { - this.$http.post(httpurl, this.configForm).then((res) => { + this.$http.post(httpurl, this.configForm).then(res => { console.log(res); if (res.data.code === 200) { this.configtrue = false; @@ -944,11 +918,6 @@ showClose: true }); }); - - }else{ - console.log("完善信息") - } - }) }, //响应地图组件的确定，拾取坐标 SendLngLat(lonlat) { @@ -1156,9 +1125,22 @@ //添加站点 case "create": this.iscodefalse = false; - this.projectObj = {}; this.yzaddflag = true; this.title = "新增站点"; + this.projectList = this.allPlatSite.map((item) => { + return { + id: item.id, + key: item.platformName, + value: item.platformCode, + areaId: item.area, + }; + }); + this.projectObj = {}; + setTimeout(() => { + if(this.$refs.ruleForm){ + this.$refs.ruleForm.clearValidate(); + } + }, 0); break; //编辑站点 case "update": @@ -1182,6 +1164,11 @@ this.ruleForm[key] = data[key]; } this.yzaddflag = true; + setTimeout(() => { + if(this.$refs.ruleForm){ + this.$refs.ruleForm.clearValidate(); + } + }, 0); break; //配置因子 case "config": diff --git a/src/components/index.vue b/src/components/index.vue index 268ef5a..b423ddd 100644 --- a/src/components/index.vue +++ b/src/components/index.vue @@ -469,8 +469,9 @@ } }, ZhuXIao() { - this.$router.push({ path: "/Login" }); + // this.$router.push({ path: "/Login" }); sessionStorage.clear(); + location.reload(); }, // 初始化验证 initRules() { diff --git a/src/components/login.vue b/src/components/login.vue index 36cbc33..24710ee 100644 --- a/src/components/login.vue +++ b/src/components/login.vue @@ -138,7 +138,7 @@ // 用户在线状态计时 loginTime(); // 保存cook - + this.$router.push("/welcome"); sessionStorage.setItem("powerHandle", response2.data.data); diff --git a/src/components/site/previewOfSiteStatus.vue b/src/components/site/previewOfSiteStatus.vue index 64a7b26..eac618f 100644 --- a/src/components/site/previewOfSiteStatus.vue +++ b/src/components/site/previewOfSiteStatus.vue @@ -137,9 +137,9 @@ size="medium" > @@ -634,7 +634,7 @@ import Modify from "ol/interaction/Modify"; import FormatWKT from "ol/format/WKT"; import { ScaleLine, ZoomSlider, ZoomToExtent, Zoom } from "ol/control"; -// import echarts from "echarts"; +import { mapGetters } from "vuex"; export default { name: "previewOfSiteStatus", components: { countTo }, //加载数字滚动插件 @@ -754,7 +754,7 @@ dynamic: 0, ChecksplatformCode: "", //选取的平台的编号 platformtype: "", //选取的站点统计类型 - ChecksplatformCodeTest: "全部项目", //选取的默认文字 + ChecksplatformCodeTest: "", //选取的默认文字 historyList: [], // 项目选择B // 平台站点数量及状态统计A @@ -791,7 +791,7 @@ // 项目站点覆盖排名B // 设备分类A myChart: {}, - XianYou: "", //现有设备总数 + // XianYou: "", //现有设备总数 titlearr: [], valuearr: [], myChart2: {}, @@ -847,20 +847,7 @@ this.map.getView().setZoom(5); }, - //根据当前项目后台坐标计算出的中心飞行到指定城市 - flyToCity() { - // console.log("经纬度最大边框是：" + this.north); - // console.log("经纬度最大边框是：" + this.south); - // console.log("经纬度最大边框是：" + this.east); - // console.log("经纬度最大边框是：" + this.west); - this.map - .getView() - .setCenter([ - (this.east + this.west) / 2, - (this.north + this.south) / 2 - ]); - this.map.getView().setZoom(10); - }, + //项目图层切换 initPointToMap(projectNo) { this.$http @@ -890,35 +877,31 @@ }, 0); }, // 获取所有平台 - LoadAllProject() { - this.$http - .post( - this.nozzle.userGroupRelaGetGroups + - "?&pageNo=" + - 1 + - "&typeStr=" + - "&pageSize=" + - 999 - ) - .then(response => { - // console.log(response); - if (response.status === 200) { - var qwe = response.data.data === "" ? [] : response.data.data; + // LoadAllProject() { + // this.$http + // .post( + // this.nozzle.userGroupRelaGetGroups + + // "?&pageNo=" + + // 1 + + // "&typeStr=" + + // "&pageSize=" + + // 999 + // ) + // .then(response => { + // if (response.status === 200) { + // var qwe = response.data.data === "" ? [] : response.data.data; - this.ProjectList = this.ProjectList.concat(qwe); - // console.log(this.ProjectList); - } else { - message(response); - } - }) - .catch(response => { - message(response); - }); - }, + // this.ProjectList = this.ProjectList.concat(qwe); + // } else { + // message(response); + // } + // }) + // .catch(response => { + // message(response); + // }); + // }, // 根据平台渲染站点统计 loadSiteNumForOroject() { - // console.log(this.platformtype, this.ChecksplatformCode); - this.$http .post(this.nozzle.getSiteNum, { data: { platform: this.ChecksplatformCode, type: this.platformtype } @@ -929,16 +912,13 @@ this.Site.SAll = this.Site.EAll; this.Site.SOn = this.Site.EOn; this.Site.SOff = this.Site.EOff; - this.Project.SAll = this.Project.EAll; - this.Project.SOn = this.Project.EOn; - this.Project.SOff = this.Project.EOff; + // this.Project.SAll = this.Project.EAll; + // this.Project.SOn = this.Project.EOn; + // this.Project.SOff = this.Project.EOff; // 将新数据设置成数字滚动的结束值 也就是展示值 this.Site.EAll = response.data.data.all; this.Site.EOn = response.data.data.online; this.Site.EOff = response.data.data.offline; - // this.Project.EAll = response.data.data.projectcount; - // this.Project.EOn = response.data.data.completed; - // this.Project.EOff = response.data.data.noncompleted; } else { message(response); } @@ -949,15 +929,11 @@ }, // 单击显示平台站点 allpreview(index, item, event) { - // console.log(index, platform, event.target); this.namelist.forEach(item => { item.select = false; }); this.namelist[index].select = true; - - // console.log(this.platformtype, this.ChecksplatformCode); this.platformtype = item.type; - this.$http .post(this.nozzle.getSiteNum, { data: { platform: this.ChecksplatformCode, type: this.platformtype } @@ -968,9 +944,9 @@ this.Site.SAll = this.Site.EAll; this.Site.SOn = this.Site.EOn; this.Site.SOff = this.Site.EOff; - this.Project.SAll = this.Project.EAll; - this.Project.SOn = this.Project.EOn; - this.Project.SOff = this.Project.EOff; + // this.Project.SAll = this.Project.EAll; + // this.Project.SOn = this.Project.EOn; + // this.Project.SOff = this.Project.EOff; // 将新数据设置成数字滚动的结束值 也就是展示值 this.Site.EAll = response.data.data.all; this.Site.EOn = response.data.data.online; @@ -1011,8 +987,6 @@ }) .then(response => { if (response.status === 200) { - // this.XianYou = response.data.data.total; - // console.log(response.data.data); this.titlearr = response.data.data.title; this.valuearr = response.data.data.value; this.loadRegionEcharts(this.titlearr, this.valuearr); @@ -1034,7 +1008,6 @@ }) .then(response => { if (response.data.code === 1) { - // console.log(response); this.areaList = response.data.data; } else { message(response); @@ -1051,7 +1024,7 @@ this.$http .post(this.nozzle.warnLogListWarnLog, { current: 1, - size: 99, + size: 999, data: { platForm: this.ChecksplatformCode, endTime: "", @@ -1076,16 +1049,14 @@ }, // 点击项目ZZJ ListClick(index) { - this.ChecksplatformCode = this.ProjectList[index]["groupNo"]; - + this.ChecksplatformCode = this.allProjectSite[index]["platformCode"]; //刷新联动地图上的点位按照项目实际的个数 - // console.log(this.ChecksplatformCode); this.initPointToMap(this.ChecksplatformCode); if ( - this.ProjectList[index]["areaCode"] && - this.ProjectList[index]["groupNo"] != "" + this.allProjectSite[index]["areaCode"] && + this.allProjectSite[index]["platformCode"] != "" ) - this.gotoProgramArea(this.ProjectList[index]["areaCode"]); + this.gotoProgramArea(this.allProjectSite[index]["areaCode"]); else { this.fwClick(); if (this.vectorSourceArea) { @@ -1094,16 +1065,14 @@ } // 限制数组的长度不超过10个 - // console.log(this.historyList.length); - // console.log(this.ProjectList[index]["groupName"]); - var gname = this.ProjectList[index]["groupName"]; + var gname = this.allProjectSite[index]["platformName"]; if (this.historyList.length >= 10 && this.historyList.includes(gname)) { } else if (this.historyList.length >= 10) { this.historyList.pop(); } this.historyList = this.selectTag( this.historyList, - this.ProjectList[index]["groupName"] + this.allProjectSite[index]["platformName"] ); this.setItem(this.historyList); @@ -1116,30 +1085,30 @@ // 根据平台渲染站点实时报警信息 this.loadSiteBaoJing(); // 返回出项目的坐标以及缩放等级************************************************************************************************GIS调用 - if ( - this.ProjectList[index].latitude != null && - this.ProjectList[index].longitude != null && - this.ProjectList[index].zoomLevel != null - ) { - let MapPoint = new esri.geometry.Point( - this.ProjectList[index].longitude, - this.ProjectList[index].latitude, - new esri.SpatialReference({ - wkid: 4326 - }) - ); - this.map.centerAndZoom(MapPoint, this.ProjectList[index].zoomLevel); - } + // if ( + // this.ProjectList[index].latitude != null && + // this.ProjectList[index].longitude != null && + // this.ProjectList[index].zoomLevel != null + // ) { + // let MapPoint = new esri.geometry.Point( + // this.ProjectList[index].longitude, + // this.ProjectList[index].latitude, + // new esri.SpatialReference({ + // wkid: 4326 + // }) + // ); + // this.map.centerAndZoom(MapPoint, this.ProjectList[index].zoomLevel); + // } }, // 点击历史搜索的文字 HistoryClick(item) { this.ChecksplatformCodeTest = item; - this.ProjectList.forEach(item1 => { - if (item1["groupName"] == item) { - this.ChecksplatformCode = item1["groupNo"]; + this.allProjectSite.forEach(item1 => { + if (item1["platformName"] == item) { + this.ChecksplatformCode = item1["platformCode"]; //地图联动响应的项目 this.initPointToMap(this.ChecksplatformCode); - if (item1["areaCode"] && item1["groupNo"] != "") + if (item1["areaCode"] && item1["platformCode"] != "") this.gotoProgramArea(item1["areaCode"]); else { this.fwClick(); @@ -1156,20 +1125,20 @@ // 根据平台渲染站点实时报警信息 this.loadSiteBaoJing(); // 返回出项目的坐标以及缩放等级**************************GIS调用 - if ( - item1.latitude != null && - item1.longitude != null && - item1.zoomLevel != null - ) { - let MapPoint = new esri.geometry.Point( - item1.longitude, - item1.latitude, - new esri.SpatialReference({ - wkid: 4326 - }) - ); - this.map.centerAndZoom(MapPoint, item1.zoomLevel); - } + // if ( + // item1.latitude != null && + // item1.longitude != null && + // item1.zoomLevel != null + // ) { + // let MapPoint = new esri.geometry.Point( + // item1.longitude, + // item1.latitude, + // new esri.SpatialReference({ + // wkid: 4326 + // }) + // ); + // this.map.centerAndZoom(MapPoint, item1.zoomLevel); + // } } }); }, @@ -1193,13 +1162,11 @@ }, // 加载设备分类的ecahrts loadRegionEcharts(titlearr, valuearr) { - // console.log(data); // 基于准备好的dom，初始化echarts实例 let myChart1 = this.$echarts.init( document.getElementById("previewOfSiteStatusCentent4eCharts") ); // 绘制图表 - // this.myChart1.clear(); let option = { xAxis: { type: "category", @@ -1725,10 +1692,7 @@ var cell, resultwkt = ""; var feature; - this.north = -90; - this.south = 90; - this.east = -180; - this.west = 180; + for (var i = 0; i < clusterData.length; i++) { cell = clusterData[i]; @@ -1751,11 +1715,6 @@ this.vectorSource.addFeature(feature); this.source.addFeature(feature); - //计算边框，用于切换项目定位中心点 - this.north = Math.max(parseFloat(cell.lat), this.north); - this.south = Math.min(parseFloat(cell.lat), this.south); - this.east = Math.max(parseFloat(cell.lon), this.east); - this.west = Math.min(parseFloat(cell.lon), this.west); } this.clusterSource = new Cluster({ @@ -1795,7 +1754,7 @@ }) }) */ }); - } else if (size > 2) { + } else if (size >= 2) { return new Style({ text: new Text({ text: size.toString(), @@ -1826,7 +1785,7 @@ } }); //飞行到指定的城市项目中心点 - // this.flyToCity() + //?要判断currentZoom加哪一个 if (this.currentZoom >= 8) this.map.addLayer(this.vector); else this.map.addLayer(this.layer); @@ -1942,6 +1901,7 @@ ) { return feature; }); + if (feature) { //捕捉到要素后，进行后续操作，如弹出要素信息 // this.addPopupContent(e.coordinate, feature.values_.features); @@ -2763,18 +2723,15 @@ computed: { switchStatus: function() { return this.flag; // 直接监听props里的status状态 - } + }, + ...mapGetters(["allProjectSite"]) }, - /* created() { - window.closepopup = this.closepopup; - window.historyData = this.historyData; - }, */ created() {}, mounted: function() { // 默认加载所有的平台 - this.LoadAllProject(); + // this.LoadAllProject(); - this.loadRegionEcharts(); + // this.loadRegionEcharts(); // 根据平台渲染站点数量统计及状态统计 this.loadSiteNumForOroject(); // 根据平台渲染设备分类 diff --git a/src/components/ConfigManager/RtuConfig.vue b/src/components/ConfigManager/RtuConfig.vue index 2aa6409..60226ac 100644 --- a/src/components/ConfigManager/RtuConfig.vue +++ b/src/components/ConfigManager/RtuConfig.vue @@ -2,7 +2,7 @@
搜索 --> - - + - - 搜索 - + 搜索 + > - + 回显 - + 暂存 - + 暂存回显 - + 提交
- + - + 回显历史记录
@@ -96,10 +123,10 @@
@@ -131,7 +158,9 @@ :key="item.fieldIdentifier" :class="{ 'el-col-class': true, - stop: item.hasOwnProperty('isShow') ? !item.isShow : false + stop: item.hasOwnProperty('isShow') + ? !item.isShow + : false, }" > { - if (item.name === "外置DTU设置") { - arr[index].isShow = newVal; - } - }); - } - ); - // GPRS，LORA开关 - this.$watch( - function() { - return this.formAll[0].form1.rtuInnerMode; - }, - function(newVal, oldVal) { - this.formAllBody["1"].forEach((item, index, arr) => { - if (item.name === "内置LoRa相关配置") { - arr[index].isShow = newVal === "LORA" ? true : false; - } - }); - this.formAllBody["2"].forEach((item, index, arr) => { - if (item.name === "中心站1") { - arr[index].isShow = newVal === "GPRS" ? true : false; - } - if (item.name === "中心站2") { - arr[index].isShow = newVal === "GPRS" ? true : false; - } - if (item.name === "中心站3") { - arr[index].isShow = newVal === "GPRS" ? true : false; - } - if (item.name === "中心站4(备份站)") { - arr[index].isShow = newVal === "GPRS" ? true : false; - } - if (item.name === "VPN专网设置1") { - arr[index].isShow = newVal === "GPRS" ? true : false; - } - if (item.name === "VPN专网设置2") { - arr[index].isShow = newVal === "GPRS" ? true : false; - } - if (item.name === "NBIOT网络设置") { - arr[index].isShow = newVal === "GPRS" ? true : false; - } - if (item.name === "中心站其他设置") { - arr[index].isShow = newVal === "GPRS" ? true : false; - } - if (item.name === "远程后台服务器设置") { - arr[index].isShow = newVal === "GPRS" ? true : false; - } - }); - } - ); - // 水位计雷达 - this.$watch( - function() { - return this.formAll[2].form3.rtucgq_shuiwei1; - }, - function(newVal, oldVal) { - if ( - !( - (newVal === "NF-WGX-5小雷达水位计") | - (newVal === "NF-WGX-6大雷达水位计") - ) - ) { - this.formAllBody["9"][2].isShow = false; - } else { - this.formAllBody["9"][2].isShow = true; - } - } - ); - this.$watch( - function() { - return this.formAll[2].form3.rtucgq_shuiwei2; - }, - function(newVal, oldVal) { - if ( - !( - (newVal === "NF-WGX-5小雷达水位计") | - (newVal === "NF-WGX-6大雷达水位计") - ) - ) { - this.formAllBody["9"][2].isShow = false; - } else { - this.formAllBody["9"][4].isShow = true; - } - } - ); - // 流量计水鬼 - this.$watch( - function() { - return this.formAll[2].form3.rtucgq_liuliang1; - }, - function(newVal, oldVal) { - var targetNameArr = [ - "直接流量输出", - "安装高度", - "流量校正", - "淤积深度", - "无效参数", - "无效参数", - "无效参数", - "堰槽截面表高度分辨率" - ]; - var targetStatusArr = [ - false, - true, - true, - true, - false, - false, - false, - false - ]; - // let select= ['直接流量输出','三角堰','矩形堰','梯形堰','圆管','自定义截面','直角三角堰明渠','巴歇尔槽明渠'] // 下拉框值， - let strArr = [ - "rtull_ll1_jiemian", - "rtull_ll1_gaodu", - "rtull_ll1_jiaozheng", - "rtull_ll1_shendu", - "rtull_ll1_shangdikuandu", - "rtull_ll1_yancaogaodu", - "rtull_ll1_xiadikuandu", - "rtull_ll1_fenbian" - ]; - this.formAllBody["11"][1].data.forEach((item, index, arr) => { - for (let i = 0; i < strArr.length; i++) { - if (arr[index].fieldIdentifier === strArr[i]) { - arr[index].isShow = targetStatusArr[select.indexOf(newVal)][i]; - arr[index].fieldName = targetNameArr[select.indexOf(newVal)][i]; - } - } - }); - } - ); - this.$watch( - function() { - return this.formAll[2].form3.rtucgq_liuliang2; - }, - function(newVal, oldVal) { - if (!(newVal === "NF_LZX_2水龟")) { - this.formAllBody["11"][6].isShow = false; - } else { - this.formAllBody["11"][6].isShow = true; - } - } - ); - // 遥测站 采集标志 开关， 存储周期 rtuSaveCircle - this.$watch( - function() { - return this.formAll[0].form1.rtucjFlagTrans; - }, - function(newVal, oldVal) { - this.formAllBody["1"][0].data[3].isShow = !newVal; - } - ); - // 域名传输 - this.$watch( - function() { - return this.formAll[1].form2.rtuZxZx1RealmNameTrans; - }, - function(newVal, oldVal) { - this.formAllBody["2"][0].data[2].isShow = newVal; - this.formAllBody["2"][0].data[3].isShow = !newVal; - } - ); - this.$watch( - function() { - return this.formAll[1].form2.rtuZxZx2RealmNameTrans; - }, - function(newVal, oldVal) { - this.formAllBody["2"][2].data[2].isShow = newVal; - this.formAllBody["2"][2].data[3].isShow = !newVal; - } - ); - this.$watch( - function() { - return this.formAll[1].form2.rtuZxZx3RealmNameTrans; - }, - function(newVal, oldVal) { - this.formAllBody["2"][4].data[2].isShow = newVal; - this.formAllBody["2"][4].data[3].isShow = !newVal; - } - ); - this.$watch( - function() { - return this.formAll[1].form2.rtuZxZx4RealmNameTrans; - }, - function(newVal, oldVal) { - this.formAllBody["2"][6].data[2].isShow = newVal; - this.formAllBody["2"][6].data[3].isShow = !newVal; - } - ); - // 外置dtu设置，下拉框 - this.$watch( - function() { - return this.formAll[0].form1.rtuother_dtu_type; - }, - function(newVal, oldVal) { - var targetArr = [ - [true, true, true, true, false], - [true, true, false, false, false], - [false, false, false, false, true], - [false, false, false, false, false] - ]; - let select = [ - "LoRa-利尔达CN470", - "ManThink-门思科技", - "BC28电信管理平台NB", - "M5311移动平台NB" - ]; // 下拉框值，对应targetArr其他5个控件显示的4状态 - let strArr = [ - "JoinEUI", - "频率格式", - "上行频率", - "下行频率", - "电信NB服务ID" - ]; - this.formAllBody["1"][2].data.forEach((item, index, arr) => { - for (let i = 0; i < strArr.length; i++) { - if (arr[index].fieldName === strArr[i]) { - arr[index].isShow = targetArr[select.indexOf(newVal)][i]; - } - } - }); - // console.log(this.formAllBody['1'][2].data, select.indexOf(newVal),'_this.formAllBody[]') - } - ); - // 从机1 ，2设置 - this.$watch( - function() { - return this.formAll[2].form3.rtucgq_congji1; - }, - function(newVal, oldVal) { - var targetNameArr = [ - ["无效参数", "无效参数", "无效参数"], - ["抽水周期", "抽水超时", "排水超时"], - ["无效参数", "无效参数", "无效参数"], - ["采集周期", "通道延时", "演示递增"], - ["采集周期", "通道延时", "无效参数"], - ["查询周期", "抽水超时", "排水超时"] - ]; - var targetStatusArr = [ - [false, false, false], - [true, true, true], - [false, false, false], - [true, true, true], - [true, true, false], - [true, true, true] - ]; - let select = [ - "默认从机", - "电机驱动板（水质监测柜）", - "VGUS屏幕（水质监测柜）", - "二供（净水器）", - "二供（水箱）", - "主控板（5/9参数水质监测柜）" - ]; // 下拉框值，对应targetArr其他5个控件显示的4状态 - let strArr = ["rtucj1_canshu1", "rtucj1_canshu2", "rtucj1_canshu3"]; - this.formAllBody["7"][1].data.forEach((item, index, arr) => { - for (let i = 0; i < strArr.length; i++) { - if (arr[index].fieldIdentifier === strArr[i]) { - arr[index].isShow = targetStatusArr[select.indexOf(newVal)][i]; - arr[index].fieldName = targetNameArr[select.indexOf(newVal)][i]; - } - } - }); - // console.log(this.formAllBody['1'][2].data, select.indexOf(newVal),'_this.formAllBody[]') - } - ); - this.$watch( - function() { - return this.formAll[2].form3.rtucgq_congji2; - }, - function(newVal, oldVal) { - var targetNameArr = [ - ["无效参数", "无效参数", "无效参数"], - ["抽水周期", "抽水超时", "排水超时"], - ["无效参数", "无效参数", "无效参数"], - ["采集周期", "通道延时", "演示递增"], - ["采集周期", "通道延时", "无效参数"], - ["查询周期", "抽水超时", "排水超时"] - ]; - var targetStatusArr = [ - [false, false, false], - [true, true, true], - [false, false, false], - [true, true, true], - [true, true, false], - [true, true, true] - ]; - let select = [ - "默认从机", - "电机驱动板（水质监测柜）", - "VGUS屏幕（水质监测柜）", - "二供（净水器）", - "二供（水箱）", - "主控板（5/9参数水质监测柜）" - ]; // 下拉框值，对应targetArr其他5个控件显示的4状态 - let strArr = ["rtucj2_canshu1", "rtucj2_canshu2", "rtucj2_canshu3"]; - this.formAllBody["7"][3].data.forEach((item, index, arr) => { - for (let i = 0; i < strArr.length; i++) { - if (arr[index].fieldIdentifier === strArr[i]) { - arr[index].isShow = targetStatusArr[select.indexOf(newVal)][i]; - arr[index].fieldName = targetNameArr[select.indexOf(newVal)][i]; - } - } - }); - // console.log(this.formAllBody['1'][2].data, select.indexOf(newVal),'_this.formAllBody[]') - } - ); - // 流量计 流量槽 - this.$watch( - function() { - return this.formAll[10].form11.rtull_ll1_jiemian; - }, - function(newVal, oldVal) { - var targetNameArr = [ - [ - "安装高度", - "流量校正", - "淤积深度", - "无效参数", - "无效参数", - "无效参数", - "堰槽截面表高度分辨率" - ], - [ - "安装高度", - "流量校正", - "淤积深度", - "上地宽度", - "堰槽高度", - "无效参数", - "堰槽截面表高度分辨率" - ], - [ - "安装高度", - "流量校正", - "淤积深度", - "上地宽度", - "堰槽高度", - "无效参数", - "堰槽截面表高度分辨率" - ], - [ - "安装高度", - "流量校正", - "淤积深度", - "窄底宽度", - "堰槽高度", - "宽底宽度", - "堰槽截面表高度分辨率" - ], - [ - "安装高度", - "流量校正", - "淤积深度", - "无效参数", - "槽堰直径", - "无效参数", - "堰槽截面表高度分辨率" - ], - [ - "安装高度", - "流量校正", - "淤积深度", - "无效参数", - "无效参数", - "无效参数", - "堰槽截面表高度分辨率" - ], - [ - "溢流高度", - "流量校正", - "淤积深度", - "无效参数", - "槽堰高度", - "无效参数", - "堰槽截面表高度分辨率" - ], - [ - "溢流高度", - "流量校正", - "淤积深度", - "槽堰高度", - "槽序号", - "无效参数", - "堰槽截面表高度分辨率" - ] - ]; - var targetStatusArr = [ - [true, true, true, false, false, false, false], - [true, true, true, true, true, false, false], - [true, true, true, true, true, false, false], - [true, true, true, true, true, true, false], - [true, true, true, false, true, false, false], - [true, true, true, false, false, false, true], - [true, true, true, false, true, false, false], - [true, true, true, true, true, false, false] - ]; - let select = [ - "直接流量输出", - "三角堰", - "矩形堰", - "梯形堰", - "圆管", - "自定义截面", - "直角三角堰明渠", - "巴歇尔槽明渠" - ]; // 下拉框值， - let strArr = [ - "rtull_ll1_gaodu", - "rtull_ll1_jiaozheng", - "rtull_ll1_shendu", - "rtull_ll1_shangdikuandu", - "rtull_ll1_yancaogaodu", - "rtull_ll1_xiadikuandu", - "rtull_ll1_fenbian" - ]; - this.formAllBody["11"][1].data.forEach((item, index, arr) => { - for (let i = 0; i < strArr.length; i++) { - if (arr[index].fieldIdentifier === strArr[i]) { - arr[index].isShow = targetStatusArr[select.indexOf(newVal)][i]; - arr[index].fieldName = targetNameArr[select.indexOf(newVal)][i]; - } - } - }); - // console.log(this.formAllBody['1'][2].data, select.indexOf(newVal),'_this.formAllBody[]') - } - ); - // 蒸发皿 - this.$watch( - function() { - return this.formAll[2].form3.rtucgq_zfly; - }, - function(newVal, oldVal) { - var targetNameArr = [ - ["安装高度", "量程", "最小加水量"], - ["无效参数", "无效参数", "最小加水量"], - ["无效参数", "无效参数", "最小加水量"] - ]; - var targetStatusArr = [ - [true, true, true], - [false, false, true], - [false, false, true] - ]; - let select = ["独立蒸发皿", "水位值1", "水位值2"]; // 下拉框值，对应targetArr其他5个控件显示的4状态 - let strArr = ["rtuzf_gaodu", "rtuzf_liangcheng", "rtuzf_zuixiao"]; - this.formAllBody["12"][0].data.forEach((item, index, arr) => { - for (let i = 0; i < strArr.length; i++) { - if (arr[index].fieldIdentifier === strArr[i]) { - arr[index].isShow = targetStatusArr[select.indexOf(newVal)][i]; - arr[index].fieldName = targetNameArr[select.indexOf(newVal)][i]; - } - } - }); - // console.log(this.formAllBody['1'][2].data, select.indexOf(newVal),'_this.formAllBody[]') - } - ); - // 4am， 存储周期 rtuSaveCircle - this.$watch( - function() { - return this.formAll[2].form3.rtucgq_liuliang1; - }, - function(newVal, oldVal) { - var targetNameArr = [ - [ - "安装高度", - "流量校正", - "淤积深度", - "无效参数", - "无效参数", - "无效参数", - "堰槽截面表高度分辨率" - ] - ]; - var targetStatusArr = [[true, true, true, false, false, false, false]]; - let select = ["独立蒸发皿", "水位值1", "水位值2"]; // 下拉框值，对应targetArr其他5个控件显示的4状态 - let strArr = ["rtuzf_gaodu", "rtuzf_liangcheng", "rtuzf_zuixiao"]; - this.formAllBody["11"][1].data.forEach((item, index, arr) => { - for (let i = 0; i < strArr.length; i++) { - if (arr[index].fieldIdentifier === strArr[i]) { - arr[index].isShow = targetStatusArr[select.indexOf(newVal)][i]; - arr[index].fieldName = targetNameArr[select.indexOf(newVal)][i]; - } - } - }); - // console.log(this.formAllBody['1'][2].data, select.indexOf(newVal),'_this.formAllBody[]') - } - ); + this.initWatch(); // bottom }, methods: { - search(){ + search() { this.formAll = []; - this.querySite= [] + this.querySite = []; // console.log(this.querySite,'querySite') - this.getSiteList(this.searchCode) + this.getSiteList(this.searchCode); }, - switchChange(val){ + switchChange(val) { // console.log(val,this.formAll[0].form1,'change') }, switchClick(val) { @@ -1093,20 +635,35 @@ }, temStorageEcho() { // this.activeIndex = '0' - if(localStorage.getItem(this.querySite[1])){ - this.formAll = JSON.parse(localStorage.getItem(name)); - this.$message({ message: "暂存回显成功", type: "success" }); + if ( + this.querySite.length === 2 && + localStorage.getItem(this.querySite[1]) + ) { + this.formAll = JSON.parse(localStorage.getItem(this.querySite[1])); + console.log(this.formAll, this.querySite[1], "this.formAll"); + + this.$message({ + message: `${this.querySite[1]}暂存回显成功`, + type: "success", + }); } else { this.$message({ message: "无暂存内容", type: "warning" }); } // console.log(JSON.parse(sessionStorage.getItem(name)),111) }, temStorage() { - try { - localStorage.setItem(this.querySite[1], JSON.stringify(this.formAll)); - this.$message({ message: `${this.querySite[1]}保存成功`, type: "success" }); - } catch (err) { - this.$message({ message: err, type: "warning" }); + if (this.querySite.length === 2) { + try { + localStorage.removeItem(this.querySite[1]); + // console.log(this.formAll,'this.formAll') + localStorage.setItem(this.querySite[1], JSON.stringify(this.formAll)); + this.$message({ + message: `${this.querySite[1]}保存成功`, + type: "success", + }); + } catch (err) { + this.$message({ message: err, type: "warning" }); + } } // sessionStorage.setItem(name,'999') // // location.href='http://192.168.16.189:8080/#/ConfigManager/RtuConfig' @@ -1115,17 +672,63 @@ // console.log(sessionStorage.setItem(name),111) }, sunmitAll() { + console.log(this.formAll, "formAll"); + // 水位计 流量计 蒸发皿 rtucgq_llly1 + // let shuiWeiArr = ['独立水位计','流量计内置水位计','蒸发皿'] + // let liuLiangArr = ['内置水位计','外置独立水位计'] + // let zhengFaMinArr = ['独立蒸发皿','水位值1','水位值2'] + if ( + this.formAll[2].form3.rtucgq_swly1 === "蒸发皿" && + this.formAll[2].form3.rtucgq_zfly === "水位值1" + ) { + this.$message({ + message: `水位计1和蒸发皿数据冲突！`, + type: "warning", + }); + return; + } + if ( + this.formAll[2].form3.rtucgq_swly2 === "蒸发皿" && + this.formAll[2].form3.rtucgq_zfly === "水位值2" + ) { + this.$message({ + message: `水位计2和蒸发皿数据冲突！`, + type: "warning", + }); + return; + } + if ( + this.formAll[2].form3.rtucgq_swly1 === "流量计内置水位计" && + this.formAll[2].form3.rtucgq_llly1 === "外置独立水位计" + ) { + this.$message({ + message: `水位计1和流量计1数据冲突！`, + type: "warning", + }); + return; + } + if ( + this.formAll[2].form3.rtucgq_swly2 === "流量计内置水位计" && + this.formAll[2].form3.rtucgq_llly2 === "外置独立水位计" + ) { + this.$message({ + message: `水位计2和流量计2数据冲突！`, + type: "warning", + }); + return; + } + // return ; // 提交所有表单，循环校验所有表单，当有个表单校验失败就break，提示该表单校验失败，根据校验成功总数或者无失败确定完成，组装数据发送到后台 var successCount = 0; var successFlag = false; for (var i = 0; i < 15; i++) { - this.$refs["form"][i].validate(valid => { + this.$refs["form"][i].validate((valid) => { if (valid) { successCount++; } else { this.$message({ message: `${this.siteNameList[i]} 校验失败，请查看`, - type: "warning" + type: "warning", }); // alert(`${this.siteNameList[i]} 校验失败，请查看`); // this.$notify({ @@ -1166,8 +769,8 @@ rtuEvaporatingDishSetting: this.formAll[11].form12, rtuSoilSettler: this.formAll[12].form13, rtu4To20Setting: this.formAll[13].form14, - rtuOtherSetting: this.formAll[14].form15 - } + rtuOtherSetting: this.formAll[14].form15, + }, }; // 之前初始化时将3处的两个数组生成了需要的字段，现在需要把每处16个字段组装成两数组，删除不需要的字段,转化方法暂时写在这里 function dealInputSwitch( @@ -1236,7 +839,7 @@ ] = rtucamera_jiabaoNew; this.$http .post(`${this.nozzle.rTUSettingServiceUpdate}`, parmas) - .then(res => { + .then((res) => { // console.log(res,'rTUSettingServiceUpdate') this.echoClick(); }); @@ -1278,11 +881,11 @@ }, selectChange(val) { // this.querySite = [] - this.rtuHistoryId='' + this.rtuHistoryId = ""; // console.log(val,'val') // if(this.querySite.length!==2) return; this.echoClick(val); - this.getRtuHistoryList() + this.getRtuHistoryList(); }, selectChange1(val) { // console.log(val,'val') input搜索 @@ -1294,7 +897,7 @@ // this.echoClick(val); }, async initPage(site) { - this.loading = true + this.loading = true; // 切换站点后去请求历史下拉框 // this.getRtuHistoryList() // 回显接口请求数据 将水文传感里面3处特殊的控件需要的值，用请求数据遍历生成表单需要的字段，因为这3处的动态表单使用的是死的字段，其他的对应的表单数据赋值给对应表单就能回显了、 @@ -1320,7 +923,7 @@ "rtuEvaporatingDishSetting", "rtuSoilSettler", "rtu4To20Setting", - "rtuOtherSetting" + "rtuOtherSetting", ]; // console.log(this.formAll,resData,'ressssss') // this.formAll={} @@ -1402,7 +1005,7 @@ this.formAll.push(obj); // console.log(this.formAll,this.stCode,'this.formAll') } - this.loading = false + this.loading = false; }, async initPage2(rtuCode) { // 回显接口请求数据 将水文传感里面3处特殊的控件需要的值，用请求数据遍历生成表单需要的字段，因为这3处的动态表单使用的是死的字段，其他的对应的表单数据赋值给对应表单就能回显了、 @@ -1425,7 +1028,7 @@ "rtuEvaporatingDishSetting", "rtuSoilSettler", "rtu4To20Setting", - "rtuOtherSetting" + "rtuOtherSetting", ]; console.log(this.formAll, resData, "ressssss"); // this.formAll={} @@ -1598,36 +1201,55 @@ return temp; } // 生成表单控件的接口 - this.$http.post(this.nozzle.rtuPageQueryPage).then(res => { + this.$http.post(this.nozzle.rtuPageQueryPage).then((res) => { var dataRes = res.data.data; // console.log(dataRes,'dataRes') for (var i in dataRes) { if (dataRes[i].length !== 0) { dataRes[i].forEach((item, index, arr) => { - this.rules[item.fieldIdentifier] = [ - { - validator: (rule, value, callback) => { - this.validatorAll( - rule, - value, - callback, - item.validatorType, - item.validatorRules, - item.validatorErrorText - ); + if (item.fieldType !== 5) { + this.rules[item.fieldIdentifier] = [ + { + validator: (rule, value, callback) => { + this.validatorAll( + rule, + value, + callback, + item.validatorType, + item.validatorRules, + item.validatorErrorText + ); + }, + trigger: "change", }, - trigger: "change" - } - ]; + ]; + } else if (item.fieldType === 5) { + this.rules[item.fieldIdentifier] = [ + { + validator: (rule, value, callback) => { + this.validatorAll( + rule, + value, + callback, + item.validatorType, + item.validatorRules, + item.validatorErrorText + ); + }, + trigger: "change", + }, + { required: true, message: "必填", trigger: "change" }, + ]; + } }); - let sub_titleList = dataRes[i].map(item => { + let sub_titleList = dataRes[i].map((item) => { return item.subTitle; }); var newObj = []; // 根据小标题去重 - uniq(sub_titleList).forEach(item => { + uniq(sub_titleList).forEach((item) => { var obj = { name: item, data: [], isShow: true, isBlock: true }; - var data = dataRes[i].forEach(l => { + var data = dataRes[i].forEach((l) => { l.isShow = true; if ( l.subTitle === item && @@ -1651,11 +1273,11 @@ console.log(this.formAllBody, "999"); }); }, - async getSiteList(val='') { - // ,{stCode:this.querySite} + async getSiteList(val = "") { + // ,{stCode:this.querySite} await this.$http .post(`${this.nozzle.rTUSettingServiceQueryList}?stCode=${val}`) - .then(res => { + .then((res) => { // console.log(res.data.data,'resss') this.querySiteList = res.data.data; // this.querySiteList.push({ @@ -1675,15 +1297,641 @@ await this.$http //`${this.nozzle.queryRTUSettingHistory}?stCode=${this.querySite}` .post(`${this.nozzle.queryRTUSettingHistory}?rtuCode=${rtuCode}`) - .then(res => { + .then((res) => { // console.log(res.data,'resss') this.rtuHistoryList = res.data.data; // this.querySite = this.querySiteList[0].rtuStationCode; }); - } + }, + initWatch() { + // console.log(this.formAll,this.formAllBody,'this.formAll[0]') + //// 第一个函数就是处理你要监听的属性，只要将其return出去就行 + // 外置dtu开关 + this.$watch( + function () { + return this.formAll[0].form1.rtuOutDtu; + }, + function (newVal, oldVal) { + this.formAllBody["1"].forEach((item, index, arr) => { + if (item.name === "外置DTU设置") { + arr[index].isShow = newVal; + } + }); + } + ); + // GPRS，LORA开关 + this.$watch( + function () { + return this.formAll[0].form1.rtuInnerMode; + }, + function (newVal, oldVal) { + this.formAllBody["1"].forEach((item, index, arr) => { + if (item.name === "内置LoRa相关配置") { + arr[index].isShow = newVal === "LORA" ? true : false; + } + }); + this.formAllBody["2"].forEach((item, index, arr) => { + if (item.name === "中心站1") { + arr[index].isShow = newVal === "GPRS" ? true : false; + } + if (item.name === "中心站2") { + arr[index].isShow = newVal === "GPRS" ? true : false; + } + if (item.name === "中心站3") { + arr[index].isShow = newVal === "GPRS" ? true : false; + } + if (item.name === "中心站4(备份站)") { + arr[index].isShow = newVal === "GPRS" ? true : false; + } + if (item.name === "VPN专网设置1") { + arr[index].isShow = newVal === "GPRS" ? true : false; + } + if (item.name === "VPN专网设置2") { + arr[index].isShow = newVal === "GPRS" ? true : false; + } + if (item.name === "NBIOT网络设置") { + arr[index].isShow = newVal === "GPRS" ? true : false; + } + if (item.name === "中心站其他设置") { + arr[index].isShow = newVal === "GPRS" ? true : false; + } + if (item.name === "远程后台服务器设置") { + arr[index].isShow = newVal === "GPRS" ? true : false; + } + }); + } + ); + // 水位计雷达 + this.$watch( + function () { + return this.formAll[2].form3.rtucgq_shuiwei1; + }, + function (newVal, oldVal) { + if ( + !( + (newVal === "NF-WGX-5小雷达水位计") | + (newVal === "NF-WGX-6大雷达水位计") + ) + ) { + this.formAllBody["9"][2].isShow = false; + } else { + this.formAllBody["9"][2].isShow = true; + } + } + ); + this.$watch( + function () { + return this.formAll[2].form3.rtucgq_shuiwei2; + }, + function (newVal, oldVal) { + if ( + !( + (newVal === "NF-WGX-5小雷达水位计") | + (newVal === "NF-WGX-6大雷达水位计") + ) + ) { + this.formAllBody["9"][2].isShow = false; + } else { + this.formAllBody["9"][4].isShow = true; + } + } + ); + // 流量计水龟 流量计1 流量计1设置 + this.$watch( + function () { + return this.formAll[2].form3.rtucgq_liuliang1; + }, + function (newVal, oldVal) { + let arr = [ + "4-20mA流量计", + "NACH-FL900流速仪", + "LWGY涡轮流量计", + "SM_311水表", + ]; + if (arr.indexOf(newVal) !== -1) { + this.formAll[10].form11.rtull_ll1_jiemian = "直接流量输出"; + this.formAllBody["11"][1].data[0].isShow = false; + } else { + this.formAllBody["11"][1].data[0].isShow = true; + } + } + ); + this.$watch( + function () { + return this.formAll[2].form3.rtucgq_liuliang2; + }, + function (newVal, oldVal) { + let arr = [ + "4-20mA流量计", + "NACH-FL900流速仪", + "LWGY涡轮流量计", + "SM_311水表", + ]; + if (arr.indexOf(newVal) !== -1) { + this.formAll[10].form11.rtull_ll2_jiemian = "直接流量输出"; + this.formAllBody["11"][4].data[0].isShow = false; + } else { + this.formAllBody["11"][4].data[0].isShow = true; + } + } + ); + this.$watch( + function () { + return this.formAll[2].form3.rtucgq_liuliang2; + }, + function (newVal, oldVal) { + if (!(newVal === "NF_LZX_2水龟")) { + this.formAllBody["11"][6].isShow = false; + } else { + this.formAllBody["11"][6].isShow = true; + } + } + ); + // 遥测站 采集标志 开关， 存储周期 rtuSaveCircle + this.$watch( + function () { + return this.formAll[0].form1.rtucjFlagTrans; + }, + function (newVal, oldVal) { + this.formAllBody["1"][0].data[3].isShow = !newVal; + } + ); + // 域名传输 + this.$watch( + function () { + return this.formAll[1].form2.rtuZxZx1RealmNameTrans; + }, + function (newVal, oldVal) { + this.formAllBody["2"][0].data[2].isShow = newVal; + this.formAllBody["2"][0].data[3].isShow = !newVal; + } + ); + this.$watch( + function () { + return this.formAll[1].form2.rtuZxZx2RealmNameTrans; + }, + function (newVal, oldVal) { + this.formAllBody["2"][2].data[2].isShow = newVal; + this.formAllBody["2"][2].data[3].isShow = !newVal; + } + ); + this.$watch( + function () { + return this.formAll[1].form2.rtuZxZx3RealmNameTrans; + }, + function (newVal, oldVal) { + this.formAllBody["2"][4].data[2].isShow = newVal; + this.formAllBody["2"][4].data[3].isShow = !newVal; + } + ); + this.$watch( + function () { + return this.formAll[1].form2.rtuZxZx4RealmNameTrans; + }, + function (newVal, oldVal) { + this.formAllBody["2"][6].data[2].isShow = newVal; + this.formAllBody["2"][6].data[3].isShow = !newVal; + } + ); + // 外置dtu设置，下拉框 + this.$watch( + function () { + return this.formAll[0].form1.rtuother_dtu_type; + }, + function (newVal, oldVal) { + var targetArr = [ + [true, true, true, true, false], + [true, true, false, false, false], + [false, false, false, false, true], + [false, false, false, false, false], + ]; + let select = [ + "LoRa-利尔达CN470", + "ManThink-门思科技", + "BC28电信管理平台NB", + "M5311移动平台NB", + ]; // 下拉框值，对应targetArr其他5个控件显示的4状态 + let strArr = [ + "JoinEUI", + "频率格式", + "上行频率", + "下行频率", + "电信NB服务ID", + ]; + this.formAllBody["1"][2].data.forEach((item, index, arr) => { + for (let i = 0; i < strArr.length; i++) { + if (arr[index].fieldName === strArr[i]) { + arr[index].isShow = targetArr[select.indexOf(newVal)][i]; + } + } + }); + // console.log(this.formAllBody['1'][2].data, select.indexOf(newVal),'_this.formAllBody[]') + } + ); + // 从机1 ，2设置 + this.$watch( + function () { + return this.formAll[2].form3.rtucgq_congji1; + }, + function (newVal, oldVal) { + var targetNameArr = [ + ["无效参数", "无效参数", "无效参数"], + ["抽水周期", "抽水超时", "排水超时"], + ["无效参数", "无效参数", "无效参数"], + ["采集周期", "通道延时", "演示递增"], + ["采集周期", "通道延时", "无效参数"], + ["查询周期", "抽水超时", "排水超时"], + ]; + var targetStatusArr = [ + [false, false, false], + [true, true, true], + [false, false, false], + [true, true, true], + [true, true, false], + [true, true, true], + ]; + let select = [ + "默认从机", + "电机驱动板（水质监测柜）", + "VGUS屏幕（水质监测柜）", + "二供（净水器）", + "二供（水箱）", + "主控板（5/9参数水质监测柜）", + ]; // 下拉框值，对应targetArr其他5个控件显示的4状态 + let strArr = ["rtucj1_canshu1", "rtucj1_canshu2", "rtucj1_canshu3"]; + this.formAllBody["7"][1].data.forEach((item, index, arr) => { + for (let i = 0; i < strArr.length; i++) { + if (arr[index].fieldIdentifier === strArr[i]) { + arr[index].isShow = targetStatusArr[select.indexOf(newVal)][i]; + arr[index].fieldName = targetNameArr[select.indexOf(newVal)][i]; + } + } + }); + // console.log(this.formAllBody['1'][2].data, select.indexOf(newVal),'_this.formAllBody[]') + } + ); + this.$watch( + function () { + return this.formAll[6].form7.rtucj_kaiguan1; + }, + function (newVal, oldVal) { + this.formAllBody["7"][1].isShow = newVal; + } + ); + this.$watch( + function () { + return this.formAll[6].form7.rtucj_kaiguan2; + }, + function (newVal, oldVal) { + this.formAllBody["7"][3].isShow = newVal; + } + ); + this.$watch( + function () { + return this.formAll[2].form3.rtucgq_congji2; + }, + function (newVal, oldVal) { + var targetNameArr = [ + ["无效参数", "无效参数", "无效参数"], + ["抽水周期", "抽水超时", "排水超时"], + ["无效参数", "无效参数", "无效参数"], + ["采集周期", "通道延时", "演示递增"], + ["采集周期", "通道延时", "无效参数"], + ["查询周期", "抽水超时", "排水超时"], + ]; + var targetStatusArr = [ + [false, false, false], + [true, true, true], + [false, false, false], + [true, true, true], + [true, true, false], + [true, true, true], + ]; + let select = [ + "默认从机", + "电机驱动板（水质监测柜）", + "VGUS屏幕（水质监测柜）", + "二供（净水器）", + "二供（水箱）", + "主控板（5/9参数水质监测柜）", + ]; // 下拉框值，对应targetArr其他5个控件显示的4状态 + let strArr = ["rtucj2_canshu1", "rtucj2_canshu2", "rtucj2_canshu3"]; + this.formAllBody["7"][3].data.forEach((item, index, arr) => { + for (let i = 0; i < strArr.length; i++) { + if (arr[index].fieldIdentifier === strArr[i]) { + arr[index].isShow = targetStatusArr[select.indexOf(newVal)][i]; + arr[index].fieldName = targetNameArr[select.indexOf(newVal)][i]; + } + } + }); + // console.log(this.formAllBody['1'][2].data, select.indexOf(newVal),'_this.formAllBody[]') + } + ); + // 流量计 流量槽 + this.$watch( + function () { + return this.formAll[10].form11.rtull_ll1_jiemian; + }, + function (newVal, oldVal) { + var targetNameArr = [ + [ + "安装高度", + "流量校正", + "淤积深度", + "无效参数", + "无效参数", + "无效参数", + "堰槽截面表高度分辨率", + ], + [ + "安装高度", + "流量校正", + "淤积深度", + "上地宽度", + "堰槽高度", + "无效参数", + "堰槽截面表高度分辨率", + ], + [ + "安装高度", + "流量校正", + "淤积深度", + "上地宽度", + "堰槽高度", + "无效参数", + "堰槽截面表高度分辨率", + ], + [ + "安装高度", + "流量校正", + "淤积深度", + "窄底宽度", + "堰槽高度", + "宽底宽度", + "堰槽截面表高度分辨率", + ], + [ + "安装高度", + "流量校正", + "淤积深度", + "无效参数", + "槽堰直径", + "无效参数", + "堰槽截面表高度分辨率", + ], + [ + "安装高度", + "流量校正", + "淤积深度", + "无效参数", + "无效参数", + "无效参数", + "堰槽截面表高度分辨率", + ], + [ + "溢流高度", + "流量校正", + "淤积深度", + "无效参数", + "槽堰高度", + "无效参数", + "堰槽截面表高度分辨率", + ], + [ + "溢流高度", + "流量校正", + "淤积深度", + "槽堰高度", + "槽序号", + "无效参数", + "堰槽截面表高度分辨率", + ], + ]; + var targetStatusArr = [ + [true, true, true, false, false, false, false], + [true, true, true, true, true, false, false], + [true, true, true, true, true, false, false], + [true, true, true, true, true, true, false], + [true, true, true, false, true, false, false], + [true, true, true, false, false, false, true], + [true, true, true, false, true, false, false], + [true, true, true, true, true, false, false], + ]; + let select = [ + "直接流量输出", + "三角堰", + "矩形堰", + "梯形堰", + "圆管", + "自定义截面", + "直角三角堰明渠", + "巴歇尔槽明渠", + ]; // 下拉框值， + let strArr = [ + "rtull_ll1_gaodu", + "rtull_ll1_jiaozheng", + "rtull_ll1_shendu", + "rtull_ll1_shangdikuandu", + "rtull_ll1_yancaogaodu", + "rtull_ll1_xiadikuandu", + "rtull_ll1_fenbian", + ]; + this.formAllBody["11"][1].data.forEach((item, index, arr) => { + for (let i = 0; i < strArr.length; i++) { + if (arr[index].fieldIdentifier === strArr[i]) { + arr[index].isShow = targetStatusArr[select.indexOf(newVal)][i]; + arr[index].fieldName = targetNameArr[select.indexOf(newVal)][i]; + } + } + }); + // console.log(this.formAllBody['1'][2].data, select.indexOf(newVal),'_this.formAllBody[]') + } + ); + this.$watch( + function () { + return this.formAll[10].form11.rtull_ll2_jiemian; + }, + function (newVal, oldVal) { + var targetNameArr = [ + [ + "安装高度", + "流量校正", + "淤积深度", + "无效参数", + "无效参数", + "无效参数", + "堰槽截面表高度分辨率", + ], + [ + "安装高度", + "流量校正", + "淤积深度", + "上地宽度", + "堰槽高度", + "无效参数", + "堰槽截面表高度分辨率", + ], + [ + "安装高度", + "流量校正", + "淤积深度", + "上地宽度", + "堰槽高度", + "无效参数", + "堰槽截面表高度分辨率", + ], + [ + "安装高度", + "流量校正", + "淤积深度", + "窄底宽度", + "堰槽高度", + "宽底宽度", + "堰槽截面表高度分辨率", + ], + [ + "安装高度", + "流量校正", + "淤积深度", + "无效参数", + "槽堰直径", + "无效参数", + "堰槽截面表高度分辨率", + ], + [ + "安装高度", + "流量校正", + "淤积深度", + "无效参数", + "无效参数", + "无效参数", + "堰槽截面表高度分辨率", + ], + [ + "溢流高度", + "流量校正", + "淤积深度", + "无效参数", + "槽堰高度", + "无效参数", + "堰槽截面表高度分辨率", + ], + [ + "溢流高度", + "流量校正", + "淤积深度", + "槽堰高度", + "槽序号", + "无效参数", + "堰槽截面表高度分辨率", + ], + ]; + var targetStatusArr = [ + [true, true, true, false, false, false, false], + [true, true, true, true, true, false, false], + [true, true, true, true, true, false, false], + [true, true, true, true, true, true, false], + [true, true, true, false, true, false, false], + [true, true, true, false, false, false, true], + [true, true, true, false, true, false, false], + [true, true, true, true, true, false, false], + ]; + let select = [ + "直接流量输出", + "三角堰", + "矩形堰", + "梯形堰", + "圆管", + "自定义截面", + "直角三角堰明渠", + "巴歇尔槽明渠", + ]; // 下拉框值， + let strArr = [ + "rtull_ll2_gaodu", + "rtull_ll2_jiaozheng", + "rtull_ll2_shendu", + "rtull_ll2_shangdikuandu", + "rtull_ll2_yancaogaodu", + "rtull_ll2_xiadikuandu", + "rtull_ll2_fenbian", + ]; + this.formAllBody["11"][4].data.forEach((item, index, arr) => { + for (let i = 0; i < strArr.length; i++) { + if (arr[index].fieldIdentifier === strArr[i]) { + arr[index].isShow = targetStatusArr[select.indexOf(newVal)][i]; + arr[index].fieldName = targetNameArr[select.indexOf(newVal)][i]; + } + } + }); + // console.log(this.formAllBody['1'][2].data, select.indexOf(newVal),'_this.formAllBody[]') + } + ); + // 蒸发皿 + this.$watch( + function () { + return this.formAll[2].form3.rtucgq_zfly; + }, + function (newVal, oldVal) { + var targetNameArr = [ + ["安装高度", "量程", "最小加水量"], + ["无效参数", "无效参数", "最小加水量"], + ["无效参数", "无效参数", "最小加水量"], + ]; + var targetStatusArr = [ + [true, true, true], + [false, false, true], + [false, false, true], + ]; + let select = ["独立蒸发皿", "水位值1", "水位值2"]; // 下拉框值，对应targetArr其他5个控件显示的4状态 + let strArr = ["rtuzf_gaodu", "rtuzf_liangcheng", "rtuzf_zuixiao"]; + this.formAllBody["12"][0].data.forEach((item, index, arr) => { + for (let i = 0; i < strArr.length; i++) { + if (arr[index].fieldIdentifier === strArr[i]) { + arr[index].isShow = targetStatusArr[select.indexOf(newVal)][i]; + arr[index].fieldName = targetNameArr[select.indexOf(newVal)][i]; + } + } + }); + // console.log(this.formAllBody['1'][2].data, select.indexOf(newVal),'_this.formAllBody[]') + } + ); + // 4am， 存储周期 rtuSaveCircle + this.$watch( + function () { + return this.formAll[2].form3.rtucgq_liuliang1; + }, + function (newVal, oldVal) { + var targetNameArr = [ + [ + "安装高度", + "流量校正", + "淤积深度", + "无效参数", + "无效参数", + "无效参数", + "堰槽截面表高度分辨率", + ], + ]; + var targetStatusArr = [ + [true, true, true, false, false, false, false], + ]; + let select = ["独立蒸发皿", "水位值1", "水位值2"]; // 下拉框值，对应targetArr其他5个控件显示的4状态 + let strArr = ["rtuzf_gaodu", "rtuzf_liangcheng", "rtuzf_zuixiao"]; + this.formAllBody["11"][1].data.forEach((item, index, arr) => { + for (let i = 0; i < strArr.length; i++) { + if (arr[index].fieldIdentifier === strArr[i]) { + arr[index].isShow = targetStatusArr[select.indexOf(newVal)][i]; + arr[index].fieldName = targetNameArr[select.indexOf(newVal)][i]; + } + } + }); + // console.log(this.formAllBody['1'][2].data, select.indexOf(newVal),'_this.formAllBody[]') + } + ); + }, }, created() { - this.getSiteList().then(res => { + this.getSiteList().then((res) => { // this.querySiteList[0].rtuStationCode // this.initPage(this.querySite); // this.getRtuHistoryList() @@ -1691,7 +1939,12 @@ this.formControl(); // console.log(666) - } + }, + updated() { + // if(this.formAll.length !==0){ + // this.initWatch() + // } + }, // beforeRouteLeave (to, from, next) { // // 导航离开该组件的对应路由时调用 // // 可以访问组件实例 `this` @@ -1752,12 +2005,12 @@ margin: 11px 0 11px 0 !important; .el-form-item__label { // text-align: right; - width: 160px !important; + width: 180px !important; text-align: right !important; color: var(--white) !important; } .el-form-item__content { - margin: 0 0 0 160px !important; + margin: 0 0 0 180px !important; .el-select { width: 100% !important; .el-input .el-input__inner { diff --git a/src/components/ConfigManager/SiteManagement.vue b/src/components/ConfigManager/SiteManagement.vue index 404080d..44b4598 100644 --- a/src/components/ConfigManager/SiteManagement.vue +++ b/src/components/ConfigManager/SiteManagement.vue @@ -218,7 +218,7 @@
@@ -745,30 +745,6 @@ } ] }, - rules1: { - ruleId: [ - { - required: true, - message: "请选择规则引擎", - trigger: "blur" - } - ], - referRainStationSt: [ - { - required: true, - message: "请选择雨量站", - trigger: "blur", - }, - ], - - isEnable: [ - { - required: true, - message: "请选择是否启用", - trigger: "blur" - } - ], - }, value: [], // 站点管理/所属区域数组 syscityList: [], @@ -929,9 +905,7 @@ } else { httpurl = this.nozzle.siterepairconfigmodify; } - this.$refs[form].validate((valid) => { - if (valid) { - this.$http.post(httpurl, this.configForm).then((res) => { + this.$http.post(httpurl, this.configForm).then(res => { console.log(res); if (res.data.code === 200) { this.configtrue = false; @@ -944,11 +918,6 @@ showClose: true }); }); - - }else{ - console.log("完善信息") - } - }) }, //响应地图组件的确定，拾取坐标 SendLngLat(lonlat) { @@ -1156,9 +1125,22 @@ //添加站点 case "create": this.iscodefalse = false; - this.projectObj = {}; this.yzaddflag = true; this.title = "新增站点"; + this.projectList = this.allPlatSite.map((item) => { + return { + id: item.id, + key: item.platformName, + value: item.platformCode, + areaId: item.area, + }; + }); + this.projectObj = {}; + setTimeout(() => { + if(this.$refs.ruleForm){ + this.$refs.ruleForm.clearValidate(); + } + }, 0); break; //编辑站点 case "update": @@ -1182,6 +1164,11 @@ this.ruleForm[key] = data[key]; } this.yzaddflag = true; + setTimeout(() => { + if(this.$refs.ruleForm){ + this.$refs.ruleForm.clearValidate(); + } + }, 0); break; //配置因子 case "config": diff --git a/src/components/index.vue b/src/components/index.vue index 268ef5a..b423ddd 100644 --- a/src/components/index.vue +++ b/src/components/index.vue @@ -469,8 +469,9 @@ } }, ZhuXIao() { - this.$router.push({ path: "/Login" }); + // this.$router.push({ path: "/Login" }); sessionStorage.clear(); + location.reload(); }, // 初始化验证 initRules() { diff --git a/src/components/login.vue b/src/components/login.vue index 36cbc33..24710ee 100644 --- a/src/components/login.vue +++ b/src/components/login.vue @@ -138,7 +138,7 @@ // 用户在线状态计时 loginTime(); // 保存cook - + this.$router.push("/welcome"); sessionStorage.setItem("powerHandle", response2.data.data); diff --git a/src/components/site/previewOfSiteStatus.vue b/src/components/site/previewOfSiteStatus.vue index 64a7b26..eac618f 100644 --- a/src/components/site/previewOfSiteStatus.vue +++ b/src/components/site/previewOfSiteStatus.vue @@ -137,9 +137,9 @@ size="medium" > @@ -634,7 +634,7 @@ import Modify from "ol/interaction/Modify"; import FormatWKT from "ol/format/WKT"; import { ScaleLine, ZoomSlider, ZoomToExtent, Zoom } from "ol/control"; -// import echarts from "echarts"; +import { mapGetters } from "vuex"; export default { name: "previewOfSiteStatus", components: { countTo }, //加载数字滚动插件 @@ -754,7 +754,7 @@ dynamic: 0, ChecksplatformCode: "", //选取的平台的编号 platformtype: "", //选取的站点统计类型 - ChecksplatformCodeTest: "全部项目", //选取的默认文字 + ChecksplatformCodeTest: "", //选取的默认文字 historyList: [], // 项目选择B // 平台站点数量及状态统计A @@ -791,7 +791,7 @@ // 项目站点覆盖排名B // 设备分类A myChart: {}, - XianYou: "", //现有设备总数 + // XianYou: "", //现有设备总数 titlearr: [], valuearr: [], myChart2: {}, @@ -847,20 +847,7 @@ this.map.getView().setZoom(5); }, - //根据当前项目后台坐标计算出的中心飞行到指定城市 - flyToCity() { - // console.log("经纬度最大边框是：" + this.north); - // console.log("经纬度最大边框是：" + this.south); - // console.log("经纬度最大边框是：" + this.east); - // console.log("经纬度最大边框是：" + this.west); - this.map - .getView() - .setCenter([ - (this.east + this.west) / 2, - (this.north + this.south) / 2 - ]); - this.map.getView().setZoom(10); - }, + //项目图层切换 initPointToMap(projectNo) { this.$http @@ -890,35 +877,31 @@ }, 0); }, // 获取所有平台 - LoadAllProject() { - this.$http - .post( - this.nozzle.userGroupRelaGetGroups + - "?&pageNo=" + - 1 + - "&typeStr=" + - "&pageSize=" + - 999 - ) - .then(response => { - // console.log(response); - if (response.status === 200) { - var qwe = response.data.data === "" ? [] : response.data.data; + // LoadAllProject() { + // this.$http + // .post( + // this.nozzle.userGroupRelaGetGroups + + // "?&pageNo=" + + // 1 + + // "&typeStr=" + + // "&pageSize=" + + // 999 + // ) + // .then(response => { + // if (response.status === 200) { + // var qwe = response.data.data === "" ? [] : response.data.data; - this.ProjectList = this.ProjectList.concat(qwe); - // console.log(this.ProjectList); - } else { - message(response); - } - }) - .catch(response => { - message(response); - }); - }, + // this.ProjectList = this.ProjectList.concat(qwe); + // } else { + // message(response); + // } + // }) + // .catch(response => { + // message(response); + // }); + // }, // 根据平台渲染站点统计 loadSiteNumForOroject() { - // console.log(this.platformtype, this.ChecksplatformCode); - this.$http .post(this.nozzle.getSiteNum, { data: { platform: this.ChecksplatformCode, type: this.platformtype } @@ -929,16 +912,13 @@ this.Site.SAll = this.Site.EAll; this.Site.SOn = this.Site.EOn; this.Site.SOff = this.Site.EOff; - this.Project.SAll = this.Project.EAll; - this.Project.SOn = this.Project.EOn; - this.Project.SOff = this.Project.EOff; + // this.Project.SAll = this.Project.EAll; + // this.Project.SOn = this.Project.EOn; + // this.Project.SOff = this.Project.EOff; // 将新数据设置成数字滚动的结束值 也就是展示值 this.Site.EAll = response.data.data.all; this.Site.EOn = response.data.data.online; this.Site.EOff = response.data.data.offline; - // this.Project.EAll = response.data.data.projectcount; - // this.Project.EOn = response.data.data.completed; - // this.Project.EOff = response.data.data.noncompleted; } else { message(response); } @@ -949,15 +929,11 @@ }, // 单击显示平台站点 allpreview(index, item, event) { - // console.log(index, platform, event.target); this.namelist.forEach(item => { item.select = false; }); this.namelist[index].select = true; - - // console.log(this.platformtype, this.ChecksplatformCode); this.platformtype = item.type; - this.$http .post(this.nozzle.getSiteNum, { data: { platform: this.ChecksplatformCode, type: this.platformtype } @@ -968,9 +944,9 @@ this.Site.SAll = this.Site.EAll; this.Site.SOn = this.Site.EOn; this.Site.SOff = this.Site.EOff; - this.Project.SAll = this.Project.EAll; - this.Project.SOn = this.Project.EOn; - this.Project.SOff = this.Project.EOff; + // this.Project.SAll = this.Project.EAll; + // this.Project.SOn = this.Project.EOn; + // this.Project.SOff = this.Project.EOff; // 将新数据设置成数字滚动的结束值 也就是展示值 this.Site.EAll = response.data.data.all; this.Site.EOn = response.data.data.online; @@ -1011,8 +987,6 @@ }) .then(response => { if (response.status === 200) { - // this.XianYou = response.data.data.total; - // console.log(response.data.data); this.titlearr = response.data.data.title; this.valuearr = response.data.data.value; this.loadRegionEcharts(this.titlearr, this.valuearr); @@ -1034,7 +1008,6 @@ }) .then(response => { if (response.data.code === 1) { - // console.log(response); this.areaList = response.data.data; } else { message(response); @@ -1051,7 +1024,7 @@ this.$http .post(this.nozzle.warnLogListWarnLog, { current: 1, - size: 99, + size: 999, data: { platForm: this.ChecksplatformCode, endTime: "", @@ -1076,16 +1049,14 @@ }, // 点击项目ZZJ ListClick(index) { - this.ChecksplatformCode = this.ProjectList[index]["groupNo"]; - + this.ChecksplatformCode = this.allProjectSite[index]["platformCode"]; //刷新联动地图上的点位按照项目实际的个数 - // console.log(this.ChecksplatformCode); this.initPointToMap(this.ChecksplatformCode); if ( - this.ProjectList[index]["areaCode"] && - this.ProjectList[index]["groupNo"] != "" + this.allProjectSite[index]["areaCode"] && + this.allProjectSite[index]["platformCode"] != "" ) - this.gotoProgramArea(this.ProjectList[index]["areaCode"]); + this.gotoProgramArea(this.allProjectSite[index]["areaCode"]); else { this.fwClick(); if (this.vectorSourceArea) { @@ -1094,16 +1065,14 @@ } // 限制数组的长度不超过10个 - // console.log(this.historyList.length); - // console.log(this.ProjectList[index]["groupName"]); - var gname = this.ProjectList[index]["groupName"]; + var gname = this.allProjectSite[index]["platformName"]; if (this.historyList.length >= 10 && this.historyList.includes(gname)) { } else if (this.historyList.length >= 10) { this.historyList.pop(); } this.historyList = this.selectTag( this.historyList, - this.ProjectList[index]["groupName"] + this.allProjectSite[index]["platformName"] ); this.setItem(this.historyList); @@ -1116,30 +1085,30 @@ // 根据平台渲染站点实时报警信息 this.loadSiteBaoJing(); // 返回出项目的坐标以及缩放等级************************************************************************************************GIS调用 - if ( - this.ProjectList[index].latitude != null && - this.ProjectList[index].longitude != null && - this.ProjectList[index].zoomLevel != null - ) { - let MapPoint = new esri.geometry.Point( - this.ProjectList[index].longitude, - this.ProjectList[index].latitude, - new esri.SpatialReference({ - wkid: 4326 - }) - ); - this.map.centerAndZoom(MapPoint, this.ProjectList[index].zoomLevel); - } + // if ( + // this.ProjectList[index].latitude != null && + // this.ProjectList[index].longitude != null && + // this.ProjectList[index].zoomLevel != null + // ) { + // let MapPoint = new esri.geometry.Point( + // this.ProjectList[index].longitude, + // this.ProjectList[index].latitude, + // new esri.SpatialReference({ + // wkid: 4326 + // }) + // ); + // this.map.centerAndZoom(MapPoint, this.ProjectList[index].zoomLevel); + // } }, // 点击历史搜索的文字 HistoryClick(item) { this.ChecksplatformCodeTest = item; - this.ProjectList.forEach(item1 => { - if (item1["groupName"] == item) { - this.ChecksplatformCode = item1["groupNo"]; + this.allProjectSite.forEach(item1 => { + if (item1["platformName"] == item) { + this.ChecksplatformCode = item1["platformCode"]; //地图联动响应的项目 this.initPointToMap(this.ChecksplatformCode); - if (item1["areaCode"] && item1["groupNo"] != "") + if (item1["areaCode"] && item1["platformCode"] != "") this.gotoProgramArea(item1["areaCode"]); else { this.fwClick(); @@ -1156,20 +1125,20 @@ // 根据平台渲染站点实时报警信息 this.loadSiteBaoJing(); // 返回出项目的坐标以及缩放等级**************************GIS调用 - if ( - item1.latitude != null && - item1.longitude != null && - item1.zoomLevel != null - ) { - let MapPoint = new esri.geometry.Point( - item1.longitude, - item1.latitude, - new esri.SpatialReference({ - wkid: 4326 - }) - ); - this.map.centerAndZoom(MapPoint, item1.zoomLevel); - } + // if ( + // item1.latitude != null && + // item1.longitude != null && + // item1.zoomLevel != null + // ) { + // let MapPoint = new esri.geometry.Point( + // item1.longitude, + // item1.latitude, + // new esri.SpatialReference({ + // wkid: 4326 + // }) + // ); + // this.map.centerAndZoom(MapPoint, item1.zoomLevel); + // } } }); }, @@ -1193,13 +1162,11 @@ }, // 加载设备分类的ecahrts loadRegionEcharts(titlearr, valuearr) { - // console.log(data); // 基于准备好的dom，初始化echarts实例 let myChart1 = this.$echarts.init( document.getElementById("previewOfSiteStatusCentent4eCharts") ); // 绘制图表 - // this.myChart1.clear(); let option = { xAxis: { type: "category", @@ -1725,10 +1692,7 @@ var cell, resultwkt = ""; var feature; - this.north = -90; - this.south = 90; - this.east = -180; - this.west = 180; + for (var i = 0; i < clusterData.length; i++) { cell = clusterData[i]; @@ -1751,11 +1715,6 @@ this.vectorSource.addFeature(feature); this.source.addFeature(feature); - //计算边框，用于切换项目定位中心点 - this.north = Math.max(parseFloat(cell.lat), this.north); - this.south = Math.min(parseFloat(cell.lat), this.south); - this.east = Math.max(parseFloat(cell.lon), this.east); - this.west = Math.min(parseFloat(cell.lon), this.west); } this.clusterSource = new Cluster({ @@ -1795,7 +1754,7 @@ }) }) */ }); - } else if (size > 2) { + } else if (size >= 2) { return new Style({ text: new Text({ text: size.toString(), @@ -1826,7 +1785,7 @@ } }); //飞行到指定的城市项目中心点 - // this.flyToCity() + //?要判断currentZoom加哪一个 if (this.currentZoom >= 8) this.map.addLayer(this.vector); else this.map.addLayer(this.layer); @@ -1942,6 +1901,7 @@ ) { return feature; }); + if (feature) { //捕捉到要素后，进行后续操作，如弹出要素信息 // this.addPopupContent(e.coordinate, feature.values_.features); @@ -2763,18 +2723,15 @@ computed: { switchStatus: function() { return this.flag; // 直接监听props里的status状态 - } + }, + ...mapGetters(["allProjectSite"]) }, - /* created() { - window.closepopup = this.closepopup; - window.historyData = this.historyData; - }, */ created() {}, mounted: function() { // 默认加载所有的平台 - this.LoadAllProject(); + // this.LoadAllProject(); - this.loadRegionEcharts(); + // this.loadRegionEcharts(); // 根据平台渲染站点数量统计及状态统计 this.loadSiteNumForOroject(); // 根据平台渲染设备分类 diff --git a/src/router/index.js b/src/router/index.js index 7fc8196..13640f9 100644 --- a/src/router/index.js +++ b/src/router/index.js @@ -288,6 +288,7 @@ if (to.name === "login") { next(); } else if (JSON.parse(getSession("logins")) === "true") { + next(); if (!store.state.common.allDept.length) { store .dispatch("common/getAllDept") @@ -302,14 +303,13 @@ next("/Login"); }); } - next(); } else { - message({ - data: { - code: 1, - msg: "请先登录在进行操作!" - } - }); + // message({ + // data: { + // code: 1, + // msg: "请先登录在进行操作!" + // } + // }); next(`/Login`); } }); diff --git a/src/components/ConfigManager/RtuConfig.vue b/src/components/ConfigManager/RtuConfig.vue index 2aa6409..60226ac 100644 --- a/src/components/ConfigManager/RtuConfig.vue +++ b/src/components/ConfigManager/RtuConfig.vue @@ -2,7 +2,7 @@
搜索 --> - - + - - 搜索 - + 搜索 + > - + 回显 - + 暂存 - + 暂存回显 - + 提交
- + - + 回显历史记录
@@ -96,10 +123,10 @@
@@ -131,7 +158,9 @@ :key="item.fieldIdentifier" :class="{ 'el-col-class': true, - stop: item.hasOwnProperty('isShow') ? !item.isShow : false + stop: item.hasOwnProperty('isShow') + ? !item.isShow + : false, }" > { - if (item.name === "外置DTU设置") { - arr[index].isShow = newVal; - } - }); - } - ); - // GPRS，LORA开关 - this.$watch( - function() { - return this.formAll[0].form1.rtuInnerMode; - }, - function(newVal, oldVal) { - this.formAllBody["1"].forEach((item, index, arr) => { - if (item.name === "内置LoRa相关配置") { - arr[index].isShow = newVal === "LORA" ? true : false; - } - }); - this.formAllBody["2"].forEach((item, index, arr) => { - if (item.name === "中心站1") { - arr[index].isShow = newVal === "GPRS" ? true : false; - } - if (item.name === "中心站2") { - arr[index].isShow = newVal === "GPRS" ? true : false; - } - if (item.name === "中心站3") { - arr[index].isShow = newVal === "GPRS" ? true : false; - } - if (item.name === "中心站4(备份站)") { - arr[index].isShow = newVal === "GPRS" ? true : false; - } - if (item.name === "VPN专网设置1") { - arr[index].isShow = newVal === "GPRS" ? true : false; - } - if (item.name === "VPN专网设置2") { - arr[index].isShow = newVal === "GPRS" ? true : false; - } - if (item.name === "NBIOT网络设置") { - arr[index].isShow = newVal === "GPRS" ? true : false; - } - if (item.name === "中心站其他设置") { - arr[index].isShow = newVal === "GPRS" ? true : false; - } - if (item.name === "远程后台服务器设置") { - arr[index].isShow = newVal === "GPRS" ? true : false; - } - }); - } - ); - // 水位计雷达 - this.$watch( - function() { - return this.formAll[2].form3.rtucgq_shuiwei1; - }, - function(newVal, oldVal) { - if ( - !( - (newVal === "NF-WGX-5小雷达水位计") | - (newVal === "NF-WGX-6大雷达水位计") - ) - ) { - this.formAllBody["9"][2].isShow = false; - } else { - this.formAllBody["9"][2].isShow = true; - } - } - ); - this.$watch( - function() { - return this.formAll[2].form3.rtucgq_shuiwei2; - }, - function(newVal, oldVal) { - if ( - !( - (newVal === "NF-WGX-5小雷达水位计") | - (newVal === "NF-WGX-6大雷达水位计") - ) - ) { - this.formAllBody["9"][2].isShow = false; - } else { - this.formAllBody["9"][4].isShow = true; - } - } - ); - // 流量计水鬼 - this.$watch( - function() { - return this.formAll[2].form3.rtucgq_liuliang1; - }, - function(newVal, oldVal) { - var targetNameArr = [ - "直接流量输出", - "安装高度", - "流量校正", - "淤积深度", - "无效参数", - "无效参数", - "无效参数", - "堰槽截面表高度分辨率" - ]; - var targetStatusArr = [ - false, - true, - true, - true, - false, - false, - false, - false - ]; - // let select= ['直接流量输出','三角堰','矩形堰','梯形堰','圆管','自定义截面','直角三角堰明渠','巴歇尔槽明渠'] // 下拉框值， - let strArr = [ - "rtull_ll1_jiemian", - "rtull_ll1_gaodu", - "rtull_ll1_jiaozheng", - "rtull_ll1_shendu", - "rtull_ll1_shangdikuandu", - "rtull_ll1_yancaogaodu", - "rtull_ll1_xiadikuandu", - "rtull_ll1_fenbian" - ]; - this.formAllBody["11"][1].data.forEach((item, index, arr) => { - for (let i = 0; i < strArr.length; i++) { - if (arr[index].fieldIdentifier === strArr[i]) { - arr[index].isShow = targetStatusArr[select.indexOf(newVal)][i]; - arr[index].fieldName = targetNameArr[select.indexOf(newVal)][i]; - } - } - }); - } - ); - this.$watch( - function() { - return this.formAll[2].form3.rtucgq_liuliang2; - }, - function(newVal, oldVal) { - if (!(newVal === "NF_LZX_2水龟")) { - this.formAllBody["11"][6].isShow = false; - } else { - this.formAllBody["11"][6].isShow = true; - } - } - ); - // 遥测站 采集标志 开关， 存储周期 rtuSaveCircle - this.$watch( - function() { - return this.formAll[0].form1.rtucjFlagTrans; - }, - function(newVal, oldVal) { - this.formAllBody["1"][0].data[3].isShow = !newVal; - } - ); - // 域名传输 - this.$watch( - function() { - return this.formAll[1].form2.rtuZxZx1RealmNameTrans; - }, - function(newVal, oldVal) { - this.formAllBody["2"][0].data[2].isShow = newVal; - this.formAllBody["2"][0].data[3].isShow = !newVal; - } - ); - this.$watch( - function() { - return this.formAll[1].form2.rtuZxZx2RealmNameTrans; - }, - function(newVal, oldVal) { - this.formAllBody["2"][2].data[2].isShow = newVal; - this.formAllBody["2"][2].data[3].isShow = !newVal; - } - ); - this.$watch( - function() { - return this.formAll[1].form2.rtuZxZx3RealmNameTrans; - }, - function(newVal, oldVal) { - this.formAllBody["2"][4].data[2].isShow = newVal; - this.formAllBody["2"][4].data[3].isShow = !newVal; - } - ); - this.$watch( - function() { - return this.formAll[1].form2.rtuZxZx4RealmNameTrans; - }, - function(newVal, oldVal) { - this.formAllBody["2"][6].data[2].isShow = newVal; - this.formAllBody["2"][6].data[3].isShow = !newVal; - } - ); - // 外置dtu设置，下拉框 - this.$watch( - function() { - return this.formAll[0].form1.rtuother_dtu_type; - }, - function(newVal, oldVal) { - var targetArr = [ - [true, true, true, true, false], - [true, true, false, false, false], - [false, false, false, false, true], - [false, false, false, false, false] - ]; - let select = [ - "LoRa-利尔达CN470", - "ManThink-门思科技", - "BC28电信管理平台NB", - "M5311移动平台NB" - ]; // 下拉框值，对应targetArr其他5个控件显示的4状态 - let strArr = [ - "JoinEUI", - "频率格式", - "上行频率", - "下行频率", - "电信NB服务ID" - ]; - this.formAllBody["1"][2].data.forEach((item, index, arr) => { - for (let i = 0; i < strArr.length; i++) { - if (arr[index].fieldName === strArr[i]) { - arr[index].isShow = targetArr[select.indexOf(newVal)][i]; - } - } - }); - // console.log(this.formAllBody['1'][2].data, select.indexOf(newVal),'_this.formAllBody[]') - } - ); - // 从机1 ，2设置 - this.$watch( - function() { - return this.formAll[2].form3.rtucgq_congji1; - }, - function(newVal, oldVal) { - var targetNameArr = [ - ["无效参数", "无效参数", "无效参数"], - ["抽水周期", "抽水超时", "排水超时"], - ["无效参数", "无效参数", "无效参数"], - ["采集周期", "通道延时", "演示递增"], - ["采集周期", "通道延时", "无效参数"], - ["查询周期", "抽水超时", "排水超时"] - ]; - var targetStatusArr = [ - [false, false, false], - [true, true, true], - [false, false, false], - [true, true, true], - [true, true, false], - [true, true, true] - ]; - let select = [ - "默认从机", - "电机驱动板（水质监测柜）", - "VGUS屏幕（水质监测柜）", - "二供（净水器）", - "二供（水箱）", - "主控板（5/9参数水质监测柜）" - ]; // 下拉框值，对应targetArr其他5个控件显示的4状态 - let strArr = ["rtucj1_canshu1", "rtucj1_canshu2", "rtucj1_canshu3"]; - this.formAllBody["7"][1].data.forEach((item, index, arr) => { - for (let i = 0; i < strArr.length; i++) { - if (arr[index].fieldIdentifier === strArr[i]) { - arr[index].isShow = targetStatusArr[select.indexOf(newVal)][i]; - arr[index].fieldName = targetNameArr[select.indexOf(newVal)][i]; - } - } - }); - // console.log(this.formAllBody['1'][2].data, select.indexOf(newVal),'_this.formAllBody[]') - } - ); - this.$watch( - function() { - return this.formAll[2].form3.rtucgq_congji2; - }, - function(newVal, oldVal) { - var targetNameArr = [ - ["无效参数", "无效参数", "无效参数"], - ["抽水周期", "抽水超时", "排水超时"], - ["无效参数", "无效参数", "无效参数"], - ["采集周期", "通道延时", "演示递增"], - ["采集周期", "通道延时", "无效参数"], - ["查询周期", "抽水超时", "排水超时"] - ]; - var targetStatusArr = [ - [false, false, false], - [true, true, true], - [false, false, false], - [true, true, true], - [true, true, false], - [true, true, true] - ]; - let select = [ - "默认从机", - "电机驱动板（水质监测柜）", - "VGUS屏幕（水质监测柜）", - "二供（净水器）", - "二供（水箱）", - "主控板（5/9参数水质监测柜）" - ]; // 下拉框值，对应targetArr其他5个控件显示的4状态 - let strArr = ["rtucj2_canshu1", "rtucj2_canshu2", "rtucj2_canshu3"]; - this.formAllBody["7"][3].data.forEach((item, index, arr) => { - for (let i = 0; i < strArr.length; i++) { - if (arr[index].fieldIdentifier === strArr[i]) { - arr[index].isShow = targetStatusArr[select.indexOf(newVal)][i]; - arr[index].fieldName = targetNameArr[select.indexOf(newVal)][i]; - } - } - }); - // console.log(this.formAllBody['1'][2].data, select.indexOf(newVal),'_this.formAllBody[]') - } - ); - // 流量计 流量槽 - this.$watch( - function() { - return this.formAll[10].form11.rtull_ll1_jiemian; - }, - function(newVal, oldVal) { - var targetNameArr = [ - [ - "安装高度", - "流量校正", - "淤积深度", - "无效参数", - "无效参数", - "无效参数", - "堰槽截面表高度分辨率" - ], - [ - "安装高度", - "流量校正", - "淤积深度", - "上地宽度", - "堰槽高度", - "无效参数", - "堰槽截面表高度分辨率" - ], - [ - "安装高度", - "流量校正", - "淤积深度", - "上地宽度", - "堰槽高度", - "无效参数", - "堰槽截面表高度分辨率" - ], - [ - "安装高度", - "流量校正", - "淤积深度", - "窄底宽度", - "堰槽高度", - "宽底宽度", - "堰槽截面表高度分辨率" - ], - [ - "安装高度", - "流量校正", - "淤积深度", - "无效参数", - "槽堰直径", - "无效参数", - "堰槽截面表高度分辨率" - ], - [ - "安装高度", - "流量校正", - "淤积深度", - "无效参数", - "无效参数", - "无效参数", - "堰槽截面表高度分辨率" - ], - [ - "溢流高度", - "流量校正", - "淤积深度", - "无效参数", - "槽堰高度", - "无效参数", - "堰槽截面表高度分辨率" - ], - [ - "溢流高度", - "流量校正", - "淤积深度", - "槽堰高度", - "槽序号", - "无效参数", - "堰槽截面表高度分辨率" - ] - ]; - var targetStatusArr = [ - [true, true, true, false, false, false, false], - [true, true, true, true, true, false, false], - [true, true, true, true, true, false, false], - [true, true, true, true, true, true, false], - [true, true, true, false, true, false, false], - [true, true, true, false, false, false, true], - [true, true, true, false, true, false, false], - [true, true, true, true, true, false, false] - ]; - let select = [ - "直接流量输出", - "三角堰", - "矩形堰", - "梯形堰", - "圆管", - "自定义截面", - "直角三角堰明渠", - "巴歇尔槽明渠" - ]; // 下拉框值， - let strArr = [ - "rtull_ll1_gaodu", - "rtull_ll1_jiaozheng", - "rtull_ll1_shendu", - "rtull_ll1_shangdikuandu", - "rtull_ll1_yancaogaodu", - "rtull_ll1_xiadikuandu", - "rtull_ll1_fenbian" - ]; - this.formAllBody["11"][1].data.forEach((item, index, arr) => { - for (let i = 0; i < strArr.length; i++) { - if (arr[index].fieldIdentifier === strArr[i]) { - arr[index].isShow = targetStatusArr[select.indexOf(newVal)][i]; - arr[index].fieldName = targetNameArr[select.indexOf(newVal)][i]; - } - } - }); - // console.log(this.formAllBody['1'][2].data, select.indexOf(newVal),'_this.formAllBody[]') - } - ); - // 蒸发皿 - this.$watch( - function() { - return this.formAll[2].form3.rtucgq_zfly; - }, - function(newVal, oldVal) { - var targetNameArr = [ - ["安装高度", "量程", "最小加水量"], - ["无效参数", "无效参数", "最小加水量"], - ["无效参数", "无效参数", "最小加水量"] - ]; - var targetStatusArr = [ - [true, true, true], - [false, false, true], - [false, false, true] - ]; - let select = ["独立蒸发皿", "水位值1", "水位值2"]; // 下拉框值，对应targetArr其他5个控件显示的4状态 - let strArr = ["rtuzf_gaodu", "rtuzf_liangcheng", "rtuzf_zuixiao"]; - this.formAllBody["12"][0].data.forEach((item, index, arr) => { - for (let i = 0; i < strArr.length; i++) { - if (arr[index].fieldIdentifier === strArr[i]) { - arr[index].isShow = targetStatusArr[select.indexOf(newVal)][i]; - arr[index].fieldName = targetNameArr[select.indexOf(newVal)][i]; - } - } - }); - // console.log(this.formAllBody['1'][2].data, select.indexOf(newVal),'_this.formAllBody[]') - } - ); - // 4am， 存储周期 rtuSaveCircle - this.$watch( - function() { - return this.formAll[2].form3.rtucgq_liuliang1; - }, - function(newVal, oldVal) { - var targetNameArr = [ - [ - "安装高度", - "流量校正", - "淤积深度", - "无效参数", - "无效参数", - "无效参数", - "堰槽截面表高度分辨率" - ] - ]; - var targetStatusArr = [[true, true, true, false, false, false, false]]; - let select = ["独立蒸发皿", "水位值1", "水位值2"]; // 下拉框值，对应targetArr其他5个控件显示的4状态 - let strArr = ["rtuzf_gaodu", "rtuzf_liangcheng", "rtuzf_zuixiao"]; - this.formAllBody["11"][1].data.forEach((item, index, arr) => { - for (let i = 0; i < strArr.length; i++) { - if (arr[index].fieldIdentifier === strArr[i]) { - arr[index].isShow = targetStatusArr[select.indexOf(newVal)][i]; - arr[index].fieldName = targetNameArr[select.indexOf(newVal)][i]; - } - } - }); - // console.log(this.formAllBody['1'][2].data, select.indexOf(newVal),'_this.formAllBody[]') - } - ); + this.initWatch(); // bottom }, methods: { - search(){ + search() { this.formAll = []; - this.querySite= [] + this.querySite = []; // console.log(this.querySite,'querySite') - this.getSiteList(this.searchCode) + this.getSiteList(this.searchCode); }, - switchChange(val){ + switchChange(val) { // console.log(val,this.formAll[0].form1,'change') }, switchClick(val) { @@ -1093,20 +635,35 @@ }, temStorageEcho() { // this.activeIndex = '0' - if(localStorage.getItem(this.querySite[1])){ - this.formAll = JSON.parse(localStorage.getItem(name)); - this.$message({ message: "暂存回显成功", type: "success" }); + if ( + this.querySite.length === 2 && + localStorage.getItem(this.querySite[1]) + ) { + this.formAll = JSON.parse(localStorage.getItem(this.querySite[1])); + console.log(this.formAll, this.querySite[1], "this.formAll"); + + this.$message({ + message: `${this.querySite[1]}暂存回显成功`, + type: "success", + }); } else { this.$message({ message: "无暂存内容", type: "warning" }); } // console.log(JSON.parse(sessionStorage.getItem(name)),111) }, temStorage() { - try { - localStorage.setItem(this.querySite[1], JSON.stringify(this.formAll)); - this.$message({ message: `${this.querySite[1]}保存成功`, type: "success" }); - } catch (err) { - this.$message({ message: err, type: "warning" }); + if (this.querySite.length === 2) { + try { + localStorage.removeItem(this.querySite[1]); + // console.log(this.formAll,'this.formAll') + localStorage.setItem(this.querySite[1], JSON.stringify(this.formAll)); + this.$message({ + message: `${this.querySite[1]}保存成功`, + type: "success", + }); + } catch (err) { + this.$message({ message: err, type: "warning" }); + } } // sessionStorage.setItem(name,'999') // // location.href='http://192.168.16.189:8080/#/ConfigManager/RtuConfig' @@ -1115,17 +672,63 @@ // console.log(sessionStorage.setItem(name),111) }, sunmitAll() { + console.log(this.formAll, "formAll"); + // 水位计 流量计 蒸发皿 rtucgq_llly1 + // let shuiWeiArr = ['独立水位计','流量计内置水位计','蒸发皿'] + // let liuLiangArr = ['内置水位计','外置独立水位计'] + // let zhengFaMinArr = ['独立蒸发皿','水位值1','水位值2'] + if ( + this.formAll[2].form3.rtucgq_swly1 === "蒸发皿" && + this.formAll[2].form3.rtucgq_zfly === "水位值1" + ) { + this.$message({ + message: `水位计1和蒸发皿数据冲突！`, + type: "warning", + }); + return; + } + if ( + this.formAll[2].form3.rtucgq_swly2 === "蒸发皿" && + this.formAll[2].form3.rtucgq_zfly === "水位值2" + ) { + this.$message({ + message: `水位计2和蒸发皿数据冲突！`, + type: "warning", + }); + return; + } + if ( + this.formAll[2].form3.rtucgq_swly1 === "流量计内置水位计" && + this.formAll[2].form3.rtucgq_llly1 === "外置独立水位计" + ) { + this.$message({ + message: `水位计1和流量计1数据冲突！`, + type: "warning", + }); + return; + } + if ( + this.formAll[2].form3.rtucgq_swly2 === "流量计内置水位计" && + this.formAll[2].form3.rtucgq_llly2 === "外置独立水位计" + ) { + this.$message({ + message: `水位计2和流量计2数据冲突！`, + type: "warning", + }); + return; + } + // return ; // 提交所有表单，循环校验所有表单，当有个表单校验失败就break，提示该表单校验失败，根据校验成功总数或者无失败确定完成，组装数据发送到后台 var successCount = 0; var successFlag = false; for (var i = 0; i < 15; i++) { - this.$refs["form"][i].validate(valid => { + this.$refs["form"][i].validate((valid) => { if (valid) { successCount++; } else { this.$message({ message: `${this.siteNameList[i]} 校验失败，请查看`, - type: "warning" + type: "warning", }); // alert(`${this.siteNameList[i]} 校验失败，请查看`); // this.$notify({ @@ -1166,8 +769,8 @@ rtuEvaporatingDishSetting: this.formAll[11].form12, rtuSoilSettler: this.formAll[12].form13, rtu4To20Setting: this.formAll[13].form14, - rtuOtherSetting: this.formAll[14].form15 - } + rtuOtherSetting: this.formAll[14].form15, + }, }; // 之前初始化时将3处的两个数组生成了需要的字段，现在需要把每处16个字段组装成两数组，删除不需要的字段,转化方法暂时写在这里 function dealInputSwitch( @@ -1236,7 +839,7 @@ ] = rtucamera_jiabaoNew; this.$http .post(`${this.nozzle.rTUSettingServiceUpdate}`, parmas) - .then(res => { + .then((res) => { // console.log(res,'rTUSettingServiceUpdate') this.echoClick(); }); @@ -1278,11 +881,11 @@ }, selectChange(val) { // this.querySite = [] - this.rtuHistoryId='' + this.rtuHistoryId = ""; // console.log(val,'val') // if(this.querySite.length!==2) return; this.echoClick(val); - this.getRtuHistoryList() + this.getRtuHistoryList(); }, selectChange1(val) { // console.log(val,'val') input搜索 @@ -1294,7 +897,7 @@ // this.echoClick(val); }, async initPage(site) { - this.loading = true + this.loading = true; // 切换站点后去请求历史下拉框 // this.getRtuHistoryList() // 回显接口请求数据 将水文传感里面3处特殊的控件需要的值，用请求数据遍历生成表单需要的字段，因为这3处的动态表单使用的是死的字段，其他的对应的表单数据赋值给对应表单就能回显了、 @@ -1320,7 +923,7 @@ "rtuEvaporatingDishSetting", "rtuSoilSettler", "rtu4To20Setting", - "rtuOtherSetting" + "rtuOtherSetting", ]; // console.log(this.formAll,resData,'ressssss') // this.formAll={} @@ -1402,7 +1005,7 @@ this.formAll.push(obj); // console.log(this.formAll,this.stCode,'this.formAll') } - this.loading = false + this.loading = false; }, async initPage2(rtuCode) { // 回显接口请求数据 将水文传感里面3处特殊的控件需要的值，用请求数据遍历生成表单需要的字段，因为这3处的动态表单使用的是死的字段，其他的对应的表单数据赋值给对应表单就能回显了、 @@ -1425,7 +1028,7 @@ "rtuEvaporatingDishSetting", "rtuSoilSettler", "rtu4To20Setting", - "rtuOtherSetting" + "rtuOtherSetting", ]; console.log(this.formAll, resData, "ressssss"); // this.formAll={} @@ -1598,36 +1201,55 @@ return temp; } // 生成表单控件的接口 - this.$http.post(this.nozzle.rtuPageQueryPage).then(res => { + this.$http.post(this.nozzle.rtuPageQueryPage).then((res) => { var dataRes = res.data.data; // console.log(dataRes,'dataRes') for (var i in dataRes) { if (dataRes[i].length !== 0) { dataRes[i].forEach((item, index, arr) => { - this.rules[item.fieldIdentifier] = [ - { - validator: (rule, value, callback) => { - this.validatorAll( - rule, - value, - callback, - item.validatorType, - item.validatorRules, - item.validatorErrorText - ); + if (item.fieldType !== 5) { + this.rules[item.fieldIdentifier] = [ + { + validator: (rule, value, callback) => { + this.validatorAll( + rule, + value, + callback, + item.validatorType, + item.validatorRules, + item.validatorErrorText + ); + }, + trigger: "change", }, - trigger: "change" - } - ]; + ]; + } else if (item.fieldType === 5) { + this.rules[item.fieldIdentifier] = [ + { + validator: (rule, value, callback) => { + this.validatorAll( + rule, + value, + callback, + item.validatorType, + item.validatorRules, + item.validatorErrorText + ); + }, + trigger: "change", + }, + { required: true, message: "必填", trigger: "change" }, + ]; + } }); - let sub_titleList = dataRes[i].map(item => { + let sub_titleList = dataRes[i].map((item) => { return item.subTitle; }); var newObj = []; // 根据小标题去重 - uniq(sub_titleList).forEach(item => { + uniq(sub_titleList).forEach((item) => { var obj = { name: item, data: [], isShow: true, isBlock: true }; - var data = dataRes[i].forEach(l => { + var data = dataRes[i].forEach((l) => { l.isShow = true; if ( l.subTitle === item && @@ -1651,11 +1273,11 @@ console.log(this.formAllBody, "999"); }); }, - async getSiteList(val='') { - // ,{stCode:this.querySite} + async getSiteList(val = "") { + // ,{stCode:this.querySite} await this.$http .post(`${this.nozzle.rTUSettingServiceQueryList}?stCode=${val}`) - .then(res => { + .then((res) => { // console.log(res.data.data,'resss') this.querySiteList = res.data.data; // this.querySiteList.push({ @@ -1675,15 +1297,641 @@ await this.$http //`${this.nozzle.queryRTUSettingHistory}?stCode=${this.querySite}` .post(`${this.nozzle.queryRTUSettingHistory}?rtuCode=${rtuCode}`) - .then(res => { + .then((res) => { // console.log(res.data,'resss') this.rtuHistoryList = res.data.data; // this.querySite = this.querySiteList[0].rtuStationCode; }); - } + }, + initWatch() { + // console.log(this.formAll,this.formAllBody,'this.formAll[0]') + //// 第一个函数就是处理你要监听的属性，只要将其return出去就行 + // 外置dtu开关 + this.$watch( + function () { + return this.formAll[0].form1.rtuOutDtu; + }, + function (newVal, oldVal) { + this.formAllBody["1"].forEach((item, index, arr) => { + if (item.name === "外置DTU设置") { + arr[index].isShow = newVal; + } + }); + } + ); + // GPRS，LORA开关 + this.$watch( + function () { + return this.formAll[0].form1.rtuInnerMode; + }, + function (newVal, oldVal) { + this.formAllBody["1"].forEach((item, index, arr) => { + if (item.name === "内置LoRa相关配置") { + arr[index].isShow = newVal === "LORA" ? true : false; + } + }); + this.formAllBody["2"].forEach((item, index, arr) => { + if (item.name === "中心站1") { + arr[index].isShow = newVal === "GPRS" ? true : false; + } + if (item.name === "中心站2") { + arr[index].isShow = newVal === "GPRS" ? true : false; + } + if (item.name === "中心站3") { + arr[index].isShow = newVal === "GPRS" ? true : false; + } + if (item.name === "中心站4(备份站)") { + arr[index].isShow = newVal === "GPRS" ? true : false; + } + if (item.name === "VPN专网设置1") { + arr[index].isShow = newVal === "GPRS" ? true : false; + } + if (item.name === "VPN专网设置2") { + arr[index].isShow = newVal === "GPRS" ? true : false; + } + if (item.name === "NBIOT网络设置") { + arr[index].isShow = newVal === "GPRS" ? true : false; + } + if (item.name === "中心站其他设置") { + arr[index].isShow = newVal === "GPRS" ? true : false; + } + if (item.name === "远程后台服务器设置") { + arr[index].isShow = newVal === "GPRS" ? true : false; + } + }); + } + ); + // 水位计雷达 + this.$watch( + function () { + return this.formAll[2].form3.rtucgq_shuiwei1; + }, + function (newVal, oldVal) { + if ( + !( + (newVal === "NF-WGX-5小雷达水位计") | + (newVal === "NF-WGX-6大雷达水位计") + ) + ) { + this.formAllBody["9"][2].isShow = false; + } else { + this.formAllBody["9"][2].isShow = true; + } + } + ); + this.$watch( + function () { + return this.formAll[2].form3.rtucgq_shuiwei2; + }, + function (newVal, oldVal) { + if ( + !( + (newVal === "NF-WGX-5小雷达水位计") | + (newVal === "NF-WGX-6大雷达水位计") + ) + ) { + this.formAllBody["9"][2].isShow = false; + } else { + this.formAllBody["9"][4].isShow = true; + } + } + ); + // 流量计水龟 流量计1 流量计1设置 + this.$watch( + function () { + return this.formAll[2].form3.rtucgq_liuliang1; + }, + function (newVal, oldVal) { + let arr = [ + "4-20mA流量计", + "NACH-FL900流速仪", + "LWGY涡轮流量计", + "SM_311水表", + ]; + if (arr.indexOf(newVal) !== -1) { + this.formAll[10].form11.rtull_ll1_jiemian = "直接流量输出"; + this.formAllBody["11"][1].data[0].isShow = false; + } else { + this.formAllBody["11"][1].data[0].isShow = true; + } + } + ); + this.$watch( + function () { + return this.formAll[2].form3.rtucgq_liuliang2; + }, + function (newVal, oldVal) { + let arr = [ + "4-20mA流量计", + "NACH-FL900流速仪", + "LWGY涡轮流量计", + "SM_311水表", + ]; + if (arr.indexOf(newVal) !== -1) { + this.formAll[10].form11.rtull_ll2_jiemian = "直接流量输出"; + this.formAllBody["11"][4].data[0].isShow = false; + } else { + this.formAllBody["11"][4].data[0].isShow = true; + } + } + ); + this.$watch( + function () { + return this.formAll[2].form3.rtucgq_liuliang2; + }, + function (newVal, oldVal) { + if (!(newVal === "NF_LZX_2水龟")) { + this.formAllBody["11"][6].isShow = false; + } else { + this.formAllBody["11"][6].isShow = true; + } + } + ); + // 遥测站 采集标志 开关， 存储周期 rtuSaveCircle + this.$watch( + function () { + return this.formAll[0].form1.rtucjFlagTrans; + }, + function (newVal, oldVal) { + this.formAllBody["1"][0].data[3].isShow = !newVal; + } + ); + // 域名传输 + this.$watch( + function () { + return this.formAll[1].form2.rtuZxZx1RealmNameTrans; + }, + function (newVal, oldVal) { + this.formAllBody["2"][0].data[2].isShow = newVal; + this.formAllBody["2"][0].data[3].isShow = !newVal; + } + ); + this.$watch( + function () { + return this.formAll[1].form2.rtuZxZx2RealmNameTrans; + }, + function (newVal, oldVal) { + this.formAllBody["2"][2].data[2].isShow = newVal; + this.formAllBody["2"][2].data[3].isShow = !newVal; + } + ); + this.$watch( + function () { + return this.formAll[1].form2.rtuZxZx3RealmNameTrans; + }, + function (newVal, oldVal) { + this.formAllBody["2"][4].data[2].isShow = newVal; + this.formAllBody["2"][4].data[3].isShow = !newVal; + } + ); + this.$watch( + function () { + return this.formAll[1].form2.rtuZxZx4RealmNameTrans; + }, + function (newVal, oldVal) { + this.formAllBody["2"][6].data[2].isShow = newVal; + this.formAllBody["2"][6].data[3].isShow = !newVal; + } + ); + // 外置dtu设置，下拉框 + this.$watch( + function () { + return this.formAll[0].form1.rtuother_dtu_type; + }, + function (newVal, oldVal) { + var targetArr = [ + [true, true, true, true, false], + [true, true, false, false, false], + [false, false, false, false, true], + [false, false, false, false, false], + ]; + let select = [ + "LoRa-利尔达CN470", + "ManThink-门思科技", + "BC28电信管理平台NB", + "M5311移动平台NB", + ]; // 下拉框值，对应targetArr其他5个控件显示的4状态 + let strArr = [ + "JoinEUI", + "频率格式", + "上行频率", + "下行频率", + "电信NB服务ID", + ]; + this.formAllBody["1"][2].data.forEach((item, index, arr) => { + for (let i = 0; i < strArr.length; i++) { + if (arr[index].fieldName === strArr[i]) { + arr[index].isShow = targetArr[select.indexOf(newVal)][i]; + } + } + }); + // console.log(this.formAllBody['1'][2].data, select.indexOf(newVal),'_this.formAllBody[]') + } + ); + // 从机1 ，2设置 + this.$watch( + function () { + return this.formAll[2].form3.rtucgq_congji1; + }, + function (newVal, oldVal) { + var targetNameArr = [ + ["无效参数", "无效参数", "无效参数"], + ["抽水周期", "抽水超时", "排水超时"], + ["无效参数", "无效参数", "无效参数"], + ["采集周期", "通道延时", "演示递增"], + ["采集周期", "通道延时", "无效参数"], + ["查询周期", "抽水超时", "排水超时"], + ]; + var targetStatusArr = [ + [false, false, false], + [true, true, true], + [false, false, false], + [true, true, true], + [true, true, false], + [true, true, true], + ]; + let select = [ + "默认从机", + "电机驱动板（水质监测柜）", + "VGUS屏幕（水质监测柜）", + "二供（净水器）", + "二供（水箱）", + "主控板（5/9参数水质监测柜）", + ]; // 下拉框值，对应targetArr其他5个控件显示的4状态 + let strArr = ["rtucj1_canshu1", "rtucj1_canshu2", "rtucj1_canshu3"]; + this.formAllBody["7"][1].data.forEach((item, index, arr) => { + for (let i = 0; i < strArr.length; i++) { + if (arr[index].fieldIdentifier === strArr[i]) { + arr[index].isShow = targetStatusArr[select.indexOf(newVal)][i]; + arr[index].fieldName = targetNameArr[select.indexOf(newVal)][i]; + } + } + }); + // console.log(this.formAllBody['1'][2].data, select.indexOf(newVal),'_this.formAllBody[]') + } + ); + this.$watch( + function () { + return this.formAll[6].form7.rtucj_kaiguan1; + }, + function (newVal, oldVal) { + this.formAllBody["7"][1].isShow = newVal; + } + ); + this.$watch( + function () { + return this.formAll[6].form7.rtucj_kaiguan2; + }, + function (newVal, oldVal) { + this.formAllBody["7"][3].isShow = newVal; + } + ); + this.$watch( + function () { + return this.formAll[2].form3.rtucgq_congji2; + }, + function (newVal, oldVal) { + var targetNameArr = [ + ["无效参数", "无效参数", "无效参数"], + ["抽水周期", "抽水超时", "排水超时"], + ["无效参数", "无效参数", "无效参数"], + ["采集周期", "通道延时", "演示递增"], + ["采集周期", "通道延时", "无效参数"], + ["查询周期", "抽水超时", "排水超时"], + ]; + var targetStatusArr = [ + [false, false, false], + [true, true, true], + [false, false, false], + [true, true, true], + [true, true, false], + [true, true, true], + ]; + let select = [ + "默认从机", + "电机驱动板（水质监测柜）", + "VGUS屏幕（水质监测柜）", + "二供（净水器）", + "二供（水箱）", + "主控板（5/9参数水质监测柜）", + ]; // 下拉框值，对应targetArr其他5个控件显示的4状态 + let strArr = ["rtucj2_canshu1", "rtucj2_canshu2", "rtucj2_canshu3"]; + this.formAllBody["7"][3].data.forEach((item, index, arr) => { + for (let i = 0; i < strArr.length; i++) { + if (arr[index].fieldIdentifier === strArr[i]) { + arr[index].isShow = targetStatusArr[select.indexOf(newVal)][i]; + arr[index].fieldName = targetNameArr[select.indexOf(newVal)][i]; + } + } + }); + // console.log(this.formAllBody['1'][2].data, select.indexOf(newVal),'_this.formAllBody[]') + } + ); + // 流量计 流量槽 + this.$watch( + function () { + return this.formAll[10].form11.rtull_ll1_jiemian; + }, + function (newVal, oldVal) { + var targetNameArr = [ + [ + "安装高度", + "流量校正", + "淤积深度", + "无效参数", + "无效参数", + "无效参数", + "堰槽截面表高度分辨率", + ], + [ + "安装高度", + "流量校正", + "淤积深度", + "上地宽度", + "堰槽高度", + "无效参数", + "堰槽截面表高度分辨率", + ], + [ + "安装高度", + "流量校正", + "淤积深度", + "上地宽度", + "堰槽高度", + "无效参数", + "堰槽截面表高度分辨率", + ], + [ + "安装高度", + "流量校正", + "淤积深度", + "窄底宽度", + "堰槽高度", + "宽底宽度", + "堰槽截面表高度分辨率", + ], + [ + "安装高度", + "流量校正", + "淤积深度", + "无效参数", + "槽堰直径", + "无效参数", + "堰槽截面表高度分辨率", + ], + [ + "安装高度", + "流量校正", + "淤积深度", + "无效参数", + "无效参数", + "无效参数", + "堰槽截面表高度分辨率", + ], + [ + "溢流高度", + "流量校正", + "淤积深度", + "无效参数", + "槽堰高度", + "无效参数", + "堰槽截面表高度分辨率", + ], + [ + "溢流高度", + "流量校正", + "淤积深度", + "槽堰高度", + "槽序号", + "无效参数", + "堰槽截面表高度分辨率", + ], + ]; + var targetStatusArr = [ + [true, true, true, false, false, false, false], + [true, true, true, true, true, false, false], + [true, true, true, true, true, false, false], + [true, true, true, true, true, true, false], + [true, true, true, false, true, false, false], + [true, true, true, false, false, false, true], + [true, true, true, false, true, false, false], + [true, true, true, true, true, false, false], + ]; + let select = [ + "直接流量输出", + "三角堰", + "矩形堰", + "梯形堰", + "圆管", + "自定义截面", + "直角三角堰明渠", + "巴歇尔槽明渠", + ]; // 下拉框值， + let strArr = [ + "rtull_ll1_gaodu", + "rtull_ll1_jiaozheng", + "rtull_ll1_shendu", + "rtull_ll1_shangdikuandu", + "rtull_ll1_yancaogaodu", + "rtull_ll1_xiadikuandu", + "rtull_ll1_fenbian", + ]; + this.formAllBody["11"][1].data.forEach((item, index, arr) => { + for (let i = 0; i < strArr.length; i++) { + if (arr[index].fieldIdentifier === strArr[i]) { + arr[index].isShow = targetStatusArr[select.indexOf(newVal)][i]; + arr[index].fieldName = targetNameArr[select.indexOf(newVal)][i]; + } + } + }); + // console.log(this.formAllBody['1'][2].data, select.indexOf(newVal),'_this.formAllBody[]') + } + ); + this.$watch( + function () { + return this.formAll[10].form11.rtull_ll2_jiemian; + }, + function (newVal, oldVal) { + var targetNameArr = [ + [ + "安装高度", + "流量校正", + "淤积深度", + "无效参数", + "无效参数", + "无效参数", + "堰槽截面表高度分辨率", + ], + [ + "安装高度", + "流量校正", + "淤积深度", + "上地宽度", + "堰槽高度", + "无效参数", + "堰槽截面表高度分辨率", + ], + [ + "安装高度", + "流量校正", + "淤积深度", + "上地宽度", + "堰槽高度", + "无效参数", + "堰槽截面表高度分辨率", + ], + [ + "安装高度", + "流量校正", + "淤积深度", + "窄底宽度", + "堰槽高度", + "宽底宽度", + "堰槽截面表高度分辨率", + ], + [ + "安装高度", + "流量校正", + "淤积深度", + "无效参数", + "槽堰直径", + "无效参数", + "堰槽截面表高度分辨率", + ], + [ + "安装高度", + "流量校正", + "淤积深度", + "无效参数", + "无效参数", + "无效参数", + "堰槽截面表高度分辨率", + ], + [ + "溢流高度", + "流量校正", + "淤积深度", + "无效参数", + "槽堰高度", + "无效参数", + "堰槽截面表高度分辨率", + ], + [ + "溢流高度", + "流量校正", + "淤积深度", + "槽堰高度", + "槽序号", + "无效参数", + "堰槽截面表高度分辨率", + ], + ]; + var targetStatusArr = [ + [true, true, true, false, false, false, false], + [true, true, true, true, true, false, false], + [true, true, true, true, true, false, false], + [true, true, true, true, true, true, false], + [true, true, true, false, true, false, false], + [true, true, true, false, false, false, true], + [true, true, true, false, true, false, false], + [true, true, true, true, true, false, false], + ]; + let select = [ + "直接流量输出", + "三角堰", + "矩形堰", + "梯形堰", + "圆管", + "自定义截面", + "直角三角堰明渠", + "巴歇尔槽明渠", + ]; // 下拉框值， + let strArr = [ + "rtull_ll2_gaodu", + "rtull_ll2_jiaozheng", + "rtull_ll2_shendu", + "rtull_ll2_shangdikuandu", + "rtull_ll2_yancaogaodu", + "rtull_ll2_xiadikuandu", + "rtull_ll2_fenbian", + ]; + this.formAllBody["11"][4].data.forEach((item, index, arr) => { + for (let i = 0; i < strArr.length; i++) { + if (arr[index].fieldIdentifier === strArr[i]) { + arr[index].isShow = targetStatusArr[select.indexOf(newVal)][i]; + arr[index].fieldName = targetNameArr[select.indexOf(newVal)][i]; + } + } + }); + // console.log(this.formAllBody['1'][2].data, select.indexOf(newVal),'_this.formAllBody[]') + } + ); + // 蒸发皿 + this.$watch( + function () { + return this.formAll[2].form3.rtucgq_zfly; + }, + function (newVal, oldVal) { + var targetNameArr = [ + ["安装高度", "量程", "最小加水量"], + ["无效参数", "无效参数", "最小加水量"], + ["无效参数", "无效参数", "最小加水量"], + ]; + var targetStatusArr = [ + [true, true, true], + [false, false, true], + [false, false, true], + ]; + let select = ["独立蒸发皿", "水位值1", "水位值2"]; // 下拉框值，对应targetArr其他5个控件显示的4状态 + let strArr = ["rtuzf_gaodu", "rtuzf_liangcheng", "rtuzf_zuixiao"]; + this.formAllBody["12"][0].data.forEach((item, index, arr) => { + for (let i = 0; i < strArr.length; i++) { + if (arr[index].fieldIdentifier === strArr[i]) { + arr[index].isShow = targetStatusArr[select.indexOf(newVal)][i]; + arr[index].fieldName = targetNameArr[select.indexOf(newVal)][i]; + } + } + }); + // console.log(this.formAllBody['1'][2].data, select.indexOf(newVal),'_this.formAllBody[]') + } + ); + // 4am， 存储周期 rtuSaveCircle + this.$watch( + function () { + return this.formAll[2].form3.rtucgq_liuliang1; + }, + function (newVal, oldVal) { + var targetNameArr = [ + [ + "安装高度", + "流量校正", + "淤积深度", + "无效参数", + "无效参数", + "无效参数", + "堰槽截面表高度分辨率", + ], + ]; + var targetStatusArr = [ + [true, true, true, false, false, false, false], + ]; + let select = ["独立蒸发皿", "水位值1", "水位值2"]; // 下拉框值，对应targetArr其他5个控件显示的4状态 + let strArr = ["rtuzf_gaodu", "rtuzf_liangcheng", "rtuzf_zuixiao"]; + this.formAllBody["11"][1].data.forEach((item, index, arr) => { + for (let i = 0; i < strArr.length; i++) { + if (arr[index].fieldIdentifier === strArr[i]) { + arr[index].isShow = targetStatusArr[select.indexOf(newVal)][i]; + arr[index].fieldName = targetNameArr[select.indexOf(newVal)][i]; + } + } + }); + // console.log(this.formAllBody['1'][2].data, select.indexOf(newVal),'_this.formAllBody[]') + } + ); + }, }, created() { - this.getSiteList().then(res => { + this.getSiteList().then((res) => { // this.querySiteList[0].rtuStationCode // this.initPage(this.querySite); // this.getRtuHistoryList() @@ -1691,7 +1939,12 @@ this.formControl(); // console.log(666) - } + }, + updated() { + // if(this.formAll.length !==0){ + // this.initWatch() + // } + }, // beforeRouteLeave (to, from, next) { // // 导航离开该组件的对应路由时调用 // // 可以访问组件实例 `this` @@ -1752,12 +2005,12 @@ margin: 11px 0 11px 0 !important; .el-form-item__label { // text-align: right; - width: 160px !important; + width: 180px !important; text-align: right !important; color: var(--white) !important; } .el-form-item__content { - margin: 0 0 0 160px !important; + margin: 0 0 0 180px !important; .el-select { width: 100% !important; .el-input .el-input__inner { diff --git a/src/components/ConfigManager/SiteManagement.vue b/src/components/ConfigManager/SiteManagement.vue index 404080d..44b4598 100644 --- a/src/components/ConfigManager/SiteManagement.vue +++ b/src/components/ConfigManager/SiteManagement.vue @@ -218,7 +218,7 @@
@@ -745,30 +745,6 @@ } ] }, - rules1: { - ruleId: [ - { - required: true, - message: "请选择规则引擎", - trigger: "blur" - } - ], - referRainStationSt: [ - { - required: true, - message: "请选择雨量站", - trigger: "blur", - }, - ], - - isEnable: [ - { - required: true, - message: "请选择是否启用", - trigger: "blur" - } - ], - }, value: [], // 站点管理/所属区域数组 syscityList: [], @@ -929,9 +905,7 @@ } else { httpurl = this.nozzle.siterepairconfigmodify; } - this.$refs[form].validate((valid) => { - if (valid) { - this.$http.post(httpurl, this.configForm).then((res) => { + this.$http.post(httpurl, this.configForm).then(res => { console.log(res); if (res.data.code === 200) { this.configtrue = false; @@ -944,11 +918,6 @@ showClose: true }); }); - - }else{ - console.log("完善信息") - } - }) }, //响应地图组件的确定，拾取坐标 SendLngLat(lonlat) { @@ -1156,9 +1125,22 @@ //添加站点 case "create": this.iscodefalse = false; - this.projectObj = {}; this.yzaddflag = true; this.title = "新增站点"; + this.projectList = this.allPlatSite.map((item) => { + return { + id: item.id, + key: item.platformName, + value: item.platformCode, + areaId: item.area, + }; + }); + this.projectObj = {}; + setTimeout(() => { + if(this.$refs.ruleForm){ + this.$refs.ruleForm.clearValidate(); + } + }, 0); break; //编辑站点 case "update": @@ -1182,6 +1164,11 @@ this.ruleForm[key] = data[key]; } this.yzaddflag = true; + setTimeout(() => { + if(this.$refs.ruleForm){ + this.$refs.ruleForm.clearValidate(); + } + }, 0); break; //配置因子 case "config": diff --git a/src/components/index.vue b/src/components/index.vue index 268ef5a..b423ddd 100644 --- a/src/components/index.vue +++ b/src/components/index.vue @@ -469,8 +469,9 @@ } }, ZhuXIao() { - this.$router.push({ path: "/Login" }); + // this.$router.push({ path: "/Login" }); sessionStorage.clear(); + location.reload(); }, // 初始化验证 initRules() { diff --git a/src/components/login.vue b/src/components/login.vue index 36cbc33..24710ee 100644 --- a/src/components/login.vue +++ b/src/components/login.vue @@ -138,7 +138,7 @@ // 用户在线状态计时 loginTime(); // 保存cook - + this.$router.push("/welcome"); sessionStorage.setItem("powerHandle", response2.data.data); diff --git a/src/components/site/previewOfSiteStatus.vue b/src/components/site/previewOfSiteStatus.vue index 64a7b26..eac618f 100644 --- a/src/components/site/previewOfSiteStatus.vue +++ b/src/components/site/previewOfSiteStatus.vue @@ -137,9 +137,9 @@ size="medium" > @@ -634,7 +634,7 @@ import Modify from "ol/interaction/Modify"; import FormatWKT from "ol/format/WKT"; import { ScaleLine, ZoomSlider, ZoomToExtent, Zoom } from "ol/control"; -// import echarts from "echarts"; +import { mapGetters } from "vuex"; export default { name: "previewOfSiteStatus", components: { countTo }, //加载数字滚动插件 @@ -754,7 +754,7 @@ dynamic: 0, ChecksplatformCode: "", //选取的平台的编号 platformtype: "", //选取的站点统计类型 - ChecksplatformCodeTest: "全部项目", //选取的默认文字 + ChecksplatformCodeTest: "", //选取的默认文字 historyList: [], // 项目选择B // 平台站点数量及状态统计A @@ -791,7 +791,7 @@ // 项目站点覆盖排名B // 设备分类A myChart: {}, - XianYou: "", //现有设备总数 + // XianYou: "", //现有设备总数 titlearr: [], valuearr: [], myChart2: {}, @@ -847,20 +847,7 @@ this.map.getView().setZoom(5); }, - //根据当前项目后台坐标计算出的中心飞行到指定城市 - flyToCity() { - // console.log("经纬度最大边框是：" + this.north); - // console.log("经纬度最大边框是：" + this.south); - // console.log("经纬度最大边框是：" + this.east); - // console.log("经纬度最大边框是：" + this.west); - this.map - .getView() - .setCenter([ - (this.east + this.west) / 2, - (this.north + this.south) / 2 - ]); - this.map.getView().setZoom(10); - }, + //项目图层切换 initPointToMap(projectNo) { this.$http @@ -890,35 +877,31 @@ }, 0); }, // 获取所有平台 - LoadAllProject() { - this.$http - .post( - this.nozzle.userGroupRelaGetGroups + - "?&pageNo=" + - 1 + - "&typeStr=" + - "&pageSize=" + - 999 - ) - .then(response => { - // console.log(response); - if (response.status === 200) { - var qwe = response.data.data === "" ? [] : response.data.data; + // LoadAllProject() { + // this.$http + // .post( + // this.nozzle.userGroupRelaGetGroups + + // "?&pageNo=" + + // 1 + + // "&typeStr=" + + // "&pageSize=" + + // 999 + // ) + // .then(response => { + // if (response.status === 200) { + // var qwe = response.data.data === "" ? [] : response.data.data; - this.ProjectList = this.ProjectList.concat(qwe); - // console.log(this.ProjectList); - } else { - message(response); - } - }) - .catch(response => { - message(response); - }); - }, + // this.ProjectList = this.ProjectList.concat(qwe); + // } else { + // message(response); + // } + // }) + // .catch(response => { + // message(response); + // }); + // }, // 根据平台渲染站点统计 loadSiteNumForOroject() { - // console.log(this.platformtype, this.ChecksplatformCode); - this.$http .post(this.nozzle.getSiteNum, { data: { platform: this.ChecksplatformCode, type: this.platformtype } @@ -929,16 +912,13 @@ this.Site.SAll = this.Site.EAll; this.Site.SOn = this.Site.EOn; this.Site.SOff = this.Site.EOff; - this.Project.SAll = this.Project.EAll; - this.Project.SOn = this.Project.EOn; - this.Project.SOff = this.Project.EOff; + // this.Project.SAll = this.Project.EAll; + // this.Project.SOn = this.Project.EOn; + // this.Project.SOff = this.Project.EOff; // 将新数据设置成数字滚动的结束值 也就是展示值 this.Site.EAll = response.data.data.all; this.Site.EOn = response.data.data.online; this.Site.EOff = response.data.data.offline; - // this.Project.EAll = response.data.data.projectcount; - // this.Project.EOn = response.data.data.completed; - // this.Project.EOff = response.data.data.noncompleted; } else { message(response); } @@ -949,15 +929,11 @@ }, // 单击显示平台站点 allpreview(index, item, event) { - // console.log(index, platform, event.target); this.namelist.forEach(item => { item.select = false; }); this.namelist[index].select = true; - - // console.log(this.platformtype, this.ChecksplatformCode); this.platformtype = item.type; - this.$http .post(this.nozzle.getSiteNum, { data: { platform: this.ChecksplatformCode, type: this.platformtype } @@ -968,9 +944,9 @@ this.Site.SAll = this.Site.EAll; this.Site.SOn = this.Site.EOn; this.Site.SOff = this.Site.EOff; - this.Project.SAll = this.Project.EAll; - this.Project.SOn = this.Project.EOn; - this.Project.SOff = this.Project.EOff; + // this.Project.SAll = this.Project.EAll; + // this.Project.SOn = this.Project.EOn; + // this.Project.SOff = this.Project.EOff; // 将新数据设置成数字滚动的结束值 也就是展示值 this.Site.EAll = response.data.data.all; this.Site.EOn = response.data.data.online; @@ -1011,8 +987,6 @@ }) .then(response => { if (response.status === 200) { - // this.XianYou = response.data.data.total; - // console.log(response.data.data); this.titlearr = response.data.data.title; this.valuearr = response.data.data.value; this.loadRegionEcharts(this.titlearr, this.valuearr); @@ -1034,7 +1008,6 @@ }) .then(response => { if (response.data.code === 1) { - // console.log(response); this.areaList = response.data.data; } else { message(response); @@ -1051,7 +1024,7 @@ this.$http .post(this.nozzle.warnLogListWarnLog, { current: 1, - size: 99, + size: 999, data: { platForm: this.ChecksplatformCode, endTime: "", @@ -1076,16 +1049,14 @@ }, // 点击项目ZZJ ListClick(index) { - this.ChecksplatformCode = this.ProjectList[index]["groupNo"]; - + this.ChecksplatformCode = this.allProjectSite[index]["platformCode"]; //刷新联动地图上的点位按照项目实际的个数 - // console.log(this.ChecksplatformCode); this.initPointToMap(this.ChecksplatformCode); if ( - this.ProjectList[index]["areaCode"] && - this.ProjectList[index]["groupNo"] != "" + this.allProjectSite[index]["areaCode"] && + this.allProjectSite[index]["platformCode"] != "" ) - this.gotoProgramArea(this.ProjectList[index]["areaCode"]); + this.gotoProgramArea(this.allProjectSite[index]["areaCode"]); else { this.fwClick(); if (this.vectorSourceArea) { @@ -1094,16 +1065,14 @@ } // 限制数组的长度不超过10个 - // console.log(this.historyList.length); - // console.log(this.ProjectList[index]["groupName"]); - var gname = this.ProjectList[index]["groupName"]; + var gname = this.allProjectSite[index]["platformName"]; if (this.historyList.length >= 10 && this.historyList.includes(gname)) { } else if (this.historyList.length >= 10) { this.historyList.pop(); } this.historyList = this.selectTag( this.historyList, - this.ProjectList[index]["groupName"] + this.allProjectSite[index]["platformName"] ); this.setItem(this.historyList); @@ -1116,30 +1085,30 @@ // 根据平台渲染站点实时报警信息 this.loadSiteBaoJing(); // 返回出项目的坐标以及缩放等级************************************************************************************************GIS调用 - if ( - this.ProjectList[index].latitude != null && - this.ProjectList[index].longitude != null && - this.ProjectList[index].zoomLevel != null - ) { - let MapPoint = new esri.geometry.Point( - this.ProjectList[index].longitude, - this.ProjectList[index].latitude, - new esri.SpatialReference({ - wkid: 4326 - }) - ); - this.map.centerAndZoom(MapPoint, this.ProjectList[index].zoomLevel); - } + // if ( + // this.ProjectList[index].latitude != null && + // this.ProjectList[index].longitude != null && + // this.ProjectList[index].zoomLevel != null + // ) { + // let MapPoint = new esri.geometry.Point( + // this.ProjectList[index].longitude, + // this.ProjectList[index].latitude, + // new esri.SpatialReference({ + // wkid: 4326 + // }) + // ); + // this.map.centerAndZoom(MapPoint, this.ProjectList[index].zoomLevel); + // } }, // 点击历史搜索的文字 HistoryClick(item) { this.ChecksplatformCodeTest = item; - this.ProjectList.forEach(item1 => { - if (item1["groupName"] == item) { - this.ChecksplatformCode = item1["groupNo"]; + this.allProjectSite.forEach(item1 => { + if (item1["platformName"] == item) { + this.ChecksplatformCode = item1["platformCode"]; //地图联动响应的项目 this.initPointToMap(this.ChecksplatformCode); - if (item1["areaCode"] && item1["groupNo"] != "") + if (item1["areaCode"] && item1["platformCode"] != "") this.gotoProgramArea(item1["areaCode"]); else { this.fwClick(); @@ -1156,20 +1125,20 @@ // 根据平台渲染站点实时报警信息 this.loadSiteBaoJing(); // 返回出项目的坐标以及缩放等级**************************GIS调用 - if ( - item1.latitude != null && - item1.longitude != null && - item1.zoomLevel != null - ) { - let MapPoint = new esri.geometry.Point( - item1.longitude, - item1.latitude, - new esri.SpatialReference({ - wkid: 4326 - }) - ); - this.map.centerAndZoom(MapPoint, item1.zoomLevel); - } + // if ( + // item1.latitude != null && + // item1.longitude != null && + // item1.zoomLevel != null + // ) { + // let MapPoint = new esri.geometry.Point( + // item1.longitude, + // item1.latitude, + // new esri.SpatialReference({ + // wkid: 4326 + // }) + // ); + // this.map.centerAndZoom(MapPoint, item1.zoomLevel); + // } } }); }, @@ -1193,13 +1162,11 @@ }, // 加载设备分类的ecahrts loadRegionEcharts(titlearr, valuearr) { - // console.log(data); // 基于准备好的dom，初始化echarts实例 let myChart1 = this.$echarts.init( document.getElementById("previewOfSiteStatusCentent4eCharts") ); // 绘制图表 - // this.myChart1.clear(); let option = { xAxis: { type: "category", @@ -1725,10 +1692,7 @@ var cell, resultwkt = ""; var feature; - this.north = -90; - this.south = 90; - this.east = -180; - this.west = 180; + for (var i = 0; i < clusterData.length; i++) { cell = clusterData[i]; @@ -1751,11 +1715,6 @@ this.vectorSource.addFeature(feature); this.source.addFeature(feature); - //计算边框，用于切换项目定位中心点 - this.north = Math.max(parseFloat(cell.lat), this.north); - this.south = Math.min(parseFloat(cell.lat), this.south); - this.east = Math.max(parseFloat(cell.lon), this.east); - this.west = Math.min(parseFloat(cell.lon), this.west); } this.clusterSource = new Cluster({ @@ -1795,7 +1754,7 @@ }) }) */ }); - } else if (size > 2) { + } else if (size >= 2) { return new Style({ text: new Text({ text: size.toString(), @@ -1826,7 +1785,7 @@ } }); //飞行到指定的城市项目中心点 - // this.flyToCity() + //?要判断currentZoom加哪一个 if (this.currentZoom >= 8) this.map.addLayer(this.vector); else this.map.addLayer(this.layer); @@ -1942,6 +1901,7 @@ ) { return feature; }); + if (feature) { //捕捉到要素后，进行后续操作，如弹出要素信息 // this.addPopupContent(e.coordinate, feature.values_.features); @@ -2763,18 +2723,15 @@ computed: { switchStatus: function() { return this.flag; // 直接监听props里的status状态 - } + }, + ...mapGetters(["allProjectSite"]) }, - /* created() { - window.closepopup = this.closepopup; - window.historyData = this.historyData; - }, */ created() {}, mounted: function() { // 默认加载所有的平台 - this.LoadAllProject(); + // this.LoadAllProject(); - this.loadRegionEcharts(); + // this.loadRegionEcharts(); // 根据平台渲染站点数量统计及状态统计 this.loadSiteNumForOroject(); // 根据平台渲染设备分类 diff --git a/src/router/index.js b/src/router/index.js index 7fc8196..13640f9 100644 --- a/src/router/index.js +++ b/src/router/index.js @@ -288,6 +288,7 @@ if (to.name === "login") { next(); } else if (JSON.parse(getSession("logins")) === "true") { + next(); if (!store.state.common.allDept.length) { store .dispatch("common/getAllDept") @@ -302,14 +303,13 @@ next("/Login"); }); } - next(); } else { - message({ - data: { - code: 1, - msg: "请先登录在进行操作!" - } - }); + // message({ + // data: { + // code: 1, + // msg: "请先登录在进行操作!" + // } + // }); next(`/Login`); } }); diff --git a/src/store/getters.js b/src/store/getters.js index 1523fa1..dc221d9 100644 --- a/src/store/getters.js +++ b/src/store/getters.js @@ -6,6 +6,7 @@ allCity: state => state.common.allCity, //所有城市 allPlatSite: state => state.common.allPlatSite, //所有项目站点 allProject: state => state.common.allProject, //所有项目 + allProjectSite: state => state.common.allProjectSite, //所有项目(包含默认头部--全部项目) menu: state => state.user.menu, //用户权限范围菜单 } diff --git a/src/components/ConfigManager/RtuConfig.vue b/src/components/ConfigManager/RtuConfig.vue index 2aa6409..60226ac 100644 --- a/src/components/ConfigManager/RtuConfig.vue +++ b/src/components/ConfigManager/RtuConfig.vue @@ -2,7 +2,7 @@
搜索 --> - - + - - 搜索 - + 搜索 + > - + 回显 - + 暂存 - + 暂存回显 - + 提交
- + - + 回显历史记录
@@ -96,10 +123,10 @@
@@ -131,7 +158,9 @@ :key="item.fieldIdentifier" :class="{ 'el-col-class': true, - stop: item.hasOwnProperty('isShow') ? !item.isShow : false + stop: item.hasOwnProperty('isShow') + ? !item.isShow + : false, }" > { - if (item.name === "外置DTU设置") { - arr[index].isShow = newVal; - } - }); - } - ); - // GPRS，LORA开关 - this.$watch( - function() { - return this.formAll[0].form1.rtuInnerMode; - }, - function(newVal, oldVal) { - this.formAllBody["1"].forEach((item, index, arr) => { - if (item.name === "内置LoRa相关配置") { - arr[index].isShow = newVal === "LORA" ? true : false; - } - }); - this.formAllBody["2"].forEach((item, index, arr) => { - if (item.name === "中心站1") { - arr[index].isShow = newVal === "GPRS" ? true : false; - } - if (item.name === "中心站2") { - arr[index].isShow = newVal === "GPRS" ? true : false; - } - if (item.name === "中心站3") { - arr[index].isShow = newVal === "GPRS" ? true : false; - } - if (item.name === "中心站4(备份站)") { - arr[index].isShow = newVal === "GPRS" ? true : false; - } - if (item.name === "VPN专网设置1") { - arr[index].isShow = newVal === "GPRS" ? true : false; - } - if (item.name === "VPN专网设置2") { - arr[index].isShow = newVal === "GPRS" ? true : false; - } - if (item.name === "NBIOT网络设置") { - arr[index].isShow = newVal === "GPRS" ? true : false; - } - if (item.name === "中心站其他设置") { - arr[index].isShow = newVal === "GPRS" ? true : false; - } - if (item.name === "远程后台服务器设置") { - arr[index].isShow = newVal === "GPRS" ? true : false; - } - }); - } - ); - // 水位计雷达 - this.$watch( - function() { - return this.formAll[2].form3.rtucgq_shuiwei1; - }, - function(newVal, oldVal) { - if ( - !( - (newVal === "NF-WGX-5小雷达水位计") | - (newVal === "NF-WGX-6大雷达水位计") - ) - ) { - this.formAllBody["9"][2].isShow = false; - } else { - this.formAllBody["9"][2].isShow = true; - } - } - ); - this.$watch( - function() { - return this.formAll[2].form3.rtucgq_shuiwei2; - }, - function(newVal, oldVal) { - if ( - !( - (newVal === "NF-WGX-5小雷达水位计") | - (newVal === "NF-WGX-6大雷达水位计") - ) - ) { - this.formAllBody["9"][2].isShow = false; - } else { - this.formAllBody["9"][4].isShow = true; - } - } - ); - // 流量计水鬼 - this.$watch( - function() { - return this.formAll[2].form3.rtucgq_liuliang1; - }, - function(newVal, oldVal) { - var targetNameArr = [ - "直接流量输出", - "安装高度", - "流量校正", - "淤积深度", - "无效参数", - "无效参数", - "无效参数", - "堰槽截面表高度分辨率" - ]; - var targetStatusArr = [ - false, - true, - true, - true, - false, - false, - false, - false - ]; - // let select= ['直接流量输出','三角堰','矩形堰','梯形堰','圆管','自定义截面','直角三角堰明渠','巴歇尔槽明渠'] // 下拉框值， - let strArr = [ - "rtull_ll1_jiemian", - "rtull_ll1_gaodu", - "rtull_ll1_jiaozheng", - "rtull_ll1_shendu", - "rtull_ll1_shangdikuandu", - "rtull_ll1_yancaogaodu", - "rtull_ll1_xiadikuandu", - "rtull_ll1_fenbian" - ]; - this.formAllBody["11"][1].data.forEach((item, index, arr) => { - for (let i = 0; i < strArr.length; i++) { - if (arr[index].fieldIdentifier === strArr[i]) { - arr[index].isShow = targetStatusArr[select.indexOf(newVal)][i]; - arr[index].fieldName = targetNameArr[select.indexOf(newVal)][i]; - } - } - }); - } - ); - this.$watch( - function() { - return this.formAll[2].form3.rtucgq_liuliang2; - }, - function(newVal, oldVal) { - if (!(newVal === "NF_LZX_2水龟")) { - this.formAllBody["11"][6].isShow = false; - } else { - this.formAllBody["11"][6].isShow = true; - } - } - ); - // 遥测站 采集标志 开关， 存储周期 rtuSaveCircle - this.$watch( - function() { - return this.formAll[0].form1.rtucjFlagTrans; - }, - function(newVal, oldVal) { - this.formAllBody["1"][0].data[3].isShow = !newVal; - } - ); - // 域名传输 - this.$watch( - function() { - return this.formAll[1].form2.rtuZxZx1RealmNameTrans; - }, - function(newVal, oldVal) { - this.formAllBody["2"][0].data[2].isShow = newVal; - this.formAllBody["2"][0].data[3].isShow = !newVal; - } - ); - this.$watch( - function() { - return this.formAll[1].form2.rtuZxZx2RealmNameTrans; - }, - function(newVal, oldVal) { - this.formAllBody["2"][2].data[2].isShow = newVal; - this.formAllBody["2"][2].data[3].isShow = !newVal; - } - ); - this.$watch( - function() { - return this.formAll[1].form2.rtuZxZx3RealmNameTrans; - }, - function(newVal, oldVal) { - this.formAllBody["2"][4].data[2].isShow = newVal; - this.formAllBody["2"][4].data[3].isShow = !newVal; - } - ); - this.$watch( - function() { - return this.formAll[1].form2.rtuZxZx4RealmNameTrans; - }, - function(newVal, oldVal) { - this.formAllBody["2"][6].data[2].isShow = newVal; - this.formAllBody["2"][6].data[3].isShow = !newVal; - } - ); - // 外置dtu设置，下拉框 - this.$watch( - function() { - return this.formAll[0].form1.rtuother_dtu_type; - }, - function(newVal, oldVal) { - var targetArr = [ - [true, true, true, true, false], - [true, true, false, false, false], - [false, false, false, false, true], - [false, false, false, false, false] - ]; - let select = [ - "LoRa-利尔达CN470", - "ManThink-门思科技", - "BC28电信管理平台NB", - "M5311移动平台NB" - ]; // 下拉框值，对应targetArr其他5个控件显示的4状态 - let strArr = [ - "JoinEUI", - "频率格式", - "上行频率", - "下行频率", - "电信NB服务ID" - ]; - this.formAllBody["1"][2].data.forEach((item, index, arr) => { - for (let i = 0; i < strArr.length; i++) { - if (arr[index].fieldName === strArr[i]) { - arr[index].isShow = targetArr[select.indexOf(newVal)][i]; - } - } - }); - // console.log(this.formAllBody['1'][2].data, select.indexOf(newVal),'_this.formAllBody[]') - } - ); - // 从机1 ，2设置 - this.$watch( - function() { - return this.formAll[2].form3.rtucgq_congji1; - }, - function(newVal, oldVal) { - var targetNameArr = [ - ["无效参数", "无效参数", "无效参数"], - ["抽水周期", "抽水超时", "排水超时"], - ["无效参数", "无效参数", "无效参数"], - ["采集周期", "通道延时", "演示递增"], - ["采集周期", "通道延时", "无效参数"], - ["查询周期", "抽水超时", "排水超时"] - ]; - var targetStatusArr = [ - [false, false, false], - [true, true, true], - [false, false, false], - [true, true, true], - [true, true, false], - [true, true, true] - ]; - let select = [ - "默认从机", - "电机驱动板（水质监测柜）", - "VGUS屏幕（水质监测柜）", - "二供（净水器）", - "二供（水箱）", - "主控板（5/9参数水质监测柜）" - ]; // 下拉框值，对应targetArr其他5个控件显示的4状态 - let strArr = ["rtucj1_canshu1", "rtucj1_canshu2", "rtucj1_canshu3"]; - this.formAllBody["7"][1].data.forEach((item, index, arr) => { - for (let i = 0; i < strArr.length; i++) { - if (arr[index].fieldIdentifier === strArr[i]) { - arr[index].isShow = targetStatusArr[select.indexOf(newVal)][i]; - arr[index].fieldName = targetNameArr[select.indexOf(newVal)][i]; - } - } - }); - // console.log(this.formAllBody['1'][2].data, select.indexOf(newVal),'_this.formAllBody[]') - } - ); - this.$watch( - function() { - return this.formAll[2].form3.rtucgq_congji2; - }, - function(newVal, oldVal) { - var targetNameArr = [ - ["无效参数", "无效参数", "无效参数"], - ["抽水周期", "抽水超时", "排水超时"], - ["无效参数", "无效参数", "无效参数"], - ["采集周期", "通道延时", "演示递增"], - ["采集周期", "通道延时", "无效参数"], - ["查询周期", "抽水超时", "排水超时"] - ]; - var targetStatusArr = [ - [false, false, false], - [true, true, true], - [false, false, false], - [true, true, true], - [true, true, false], - [true, true, true] - ]; - let select = [ - "默认从机", - "电机驱动板（水质监测柜）", - "VGUS屏幕（水质监测柜）", - "二供（净水器）", - "二供（水箱）", - "主控板（5/9参数水质监测柜）" - ]; // 下拉框值，对应targetArr其他5个控件显示的4状态 - let strArr = ["rtucj2_canshu1", "rtucj2_canshu2", "rtucj2_canshu3"]; - this.formAllBody["7"][3].data.forEach((item, index, arr) => { - for (let i = 0; i < strArr.length; i++) { - if (arr[index].fieldIdentifier === strArr[i]) { - arr[index].isShow = targetStatusArr[select.indexOf(newVal)][i]; - arr[index].fieldName = targetNameArr[select.indexOf(newVal)][i]; - } - } - }); - // console.log(this.formAllBody['1'][2].data, select.indexOf(newVal),'_this.formAllBody[]') - } - ); - // 流量计 流量槽 - this.$watch( - function() { - return this.formAll[10].form11.rtull_ll1_jiemian; - }, - function(newVal, oldVal) { - var targetNameArr = [ - [ - "安装高度", - "流量校正", - "淤积深度", - "无效参数", - "无效参数", - "无效参数", - "堰槽截面表高度分辨率" - ], - [ - "安装高度", - "流量校正", - "淤积深度", - "上地宽度", - "堰槽高度", - "无效参数", - "堰槽截面表高度分辨率" - ], - [ - "安装高度", - "流量校正", - "淤积深度", - "上地宽度", - "堰槽高度", - "无效参数", - "堰槽截面表高度分辨率" - ], - [ - "安装高度", - "流量校正", - "淤积深度", - "窄底宽度", - "堰槽高度", - "宽底宽度", - "堰槽截面表高度分辨率" - ], - [ - "安装高度", - "流量校正", - "淤积深度", - "无效参数", - "槽堰直径", - "无效参数", - "堰槽截面表高度分辨率" - ], - [ - "安装高度", - "流量校正", - "淤积深度", - "无效参数", - "无效参数", - "无效参数", - "堰槽截面表高度分辨率" - ], - [ - "溢流高度", - "流量校正", - "淤积深度", - "无效参数", - "槽堰高度", - "无效参数", - "堰槽截面表高度分辨率" - ], - [ - "溢流高度", - "流量校正", - "淤积深度", - "槽堰高度", - "槽序号", - "无效参数", - "堰槽截面表高度分辨率" - ] - ]; - var targetStatusArr = [ - [true, true, true, false, false, false, false], - [true, true, true, true, true, false, false], - [true, true, true, true, true, false, false], - [true, true, true, true, true, true, false], - [true, true, true, false, true, false, false], - [true, true, true, false, false, false, true], - [true, true, true, false, true, false, false], - [true, true, true, true, true, false, false] - ]; - let select = [ - "直接流量输出", - "三角堰", - "矩形堰", - "梯形堰", - "圆管", - "自定义截面", - "直角三角堰明渠", - "巴歇尔槽明渠" - ]; // 下拉框值， - let strArr = [ - "rtull_ll1_gaodu", - "rtull_ll1_jiaozheng", - "rtull_ll1_shendu", - "rtull_ll1_shangdikuandu", - "rtull_ll1_yancaogaodu", - "rtull_ll1_xiadikuandu", - "rtull_ll1_fenbian" - ]; - this.formAllBody["11"][1].data.forEach((item, index, arr) => { - for (let i = 0; i < strArr.length; i++) { - if (arr[index].fieldIdentifier === strArr[i]) { - arr[index].isShow = targetStatusArr[select.indexOf(newVal)][i]; - arr[index].fieldName = targetNameArr[select.indexOf(newVal)][i]; - } - } - }); - // console.log(this.formAllBody['1'][2].data, select.indexOf(newVal),'_this.formAllBody[]') - } - ); - // 蒸发皿 - this.$watch( - function() { - return this.formAll[2].form3.rtucgq_zfly; - }, - function(newVal, oldVal) { - var targetNameArr = [ - ["安装高度", "量程", "最小加水量"], - ["无效参数", "无效参数", "最小加水量"], - ["无效参数", "无效参数", "最小加水量"] - ]; - var targetStatusArr = [ - [true, true, true], - [false, false, true], - [false, false, true] - ]; - let select = ["独立蒸发皿", "水位值1", "水位值2"]; // 下拉框值，对应targetArr其他5个控件显示的4状态 - let strArr = ["rtuzf_gaodu", "rtuzf_liangcheng", "rtuzf_zuixiao"]; - this.formAllBody["12"][0].data.forEach((item, index, arr) => { - for (let i = 0; i < strArr.length; i++) { - if (arr[index].fieldIdentifier === strArr[i]) { - arr[index].isShow = targetStatusArr[select.indexOf(newVal)][i]; - arr[index].fieldName = targetNameArr[select.indexOf(newVal)][i]; - } - } - }); - // console.log(this.formAllBody['1'][2].data, select.indexOf(newVal),'_this.formAllBody[]') - } - ); - // 4am， 存储周期 rtuSaveCircle - this.$watch( - function() { - return this.formAll[2].form3.rtucgq_liuliang1; - }, - function(newVal, oldVal) { - var targetNameArr = [ - [ - "安装高度", - "流量校正", - "淤积深度", - "无效参数", - "无效参数", - "无效参数", - "堰槽截面表高度分辨率" - ] - ]; - var targetStatusArr = [[true, true, true, false, false, false, false]]; - let select = ["独立蒸发皿", "水位值1", "水位值2"]; // 下拉框值，对应targetArr其他5个控件显示的4状态 - let strArr = ["rtuzf_gaodu", "rtuzf_liangcheng", "rtuzf_zuixiao"]; - this.formAllBody["11"][1].data.forEach((item, index, arr) => { - for (let i = 0; i < strArr.length; i++) { - if (arr[index].fieldIdentifier === strArr[i]) { - arr[index].isShow = targetStatusArr[select.indexOf(newVal)][i]; - arr[index].fieldName = targetNameArr[select.indexOf(newVal)][i]; - } - } - }); - // console.log(this.formAllBody['1'][2].data, select.indexOf(newVal),'_this.formAllBody[]') - } - ); + this.initWatch(); // bottom }, methods: { - search(){ + search() { this.formAll = []; - this.querySite= [] + this.querySite = []; // console.log(this.querySite,'querySite') - this.getSiteList(this.searchCode) + this.getSiteList(this.searchCode); }, - switchChange(val){ + switchChange(val) { // console.log(val,this.formAll[0].form1,'change') }, switchClick(val) { @@ -1093,20 +635,35 @@ }, temStorageEcho() { // this.activeIndex = '0' - if(localStorage.getItem(this.querySite[1])){ - this.formAll = JSON.parse(localStorage.getItem(name)); - this.$message({ message: "暂存回显成功", type: "success" }); + if ( + this.querySite.length === 2 && + localStorage.getItem(this.querySite[1]) + ) { + this.formAll = JSON.parse(localStorage.getItem(this.querySite[1])); + console.log(this.formAll, this.querySite[1], "this.formAll"); + + this.$message({ + message: `${this.querySite[1]}暂存回显成功`, + type: "success", + }); } else { this.$message({ message: "无暂存内容", type: "warning" }); } // console.log(JSON.parse(sessionStorage.getItem(name)),111) }, temStorage() { - try { - localStorage.setItem(this.querySite[1], JSON.stringify(this.formAll)); - this.$message({ message: `${this.querySite[1]}保存成功`, type: "success" }); - } catch (err) { - this.$message({ message: err, type: "warning" }); + if (this.querySite.length === 2) { + try { + localStorage.removeItem(this.querySite[1]); + // console.log(this.formAll,'this.formAll') + localStorage.setItem(this.querySite[1], JSON.stringify(this.formAll)); + this.$message({ + message: `${this.querySite[1]}保存成功`, + type: "success", + }); + } catch (err) { + this.$message({ message: err, type: "warning" }); + } } // sessionStorage.setItem(name,'999') // // location.href='http://192.168.16.189:8080/#/ConfigManager/RtuConfig' @@ -1115,17 +672,63 @@ // console.log(sessionStorage.setItem(name),111) }, sunmitAll() { + console.log(this.formAll, "formAll"); + // 水位计 流量计 蒸发皿 rtucgq_llly1 + // let shuiWeiArr = ['独立水位计','流量计内置水位计','蒸发皿'] + // let liuLiangArr = ['内置水位计','外置独立水位计'] + // let zhengFaMinArr = ['独立蒸发皿','水位值1','水位值2'] + if ( + this.formAll[2].form3.rtucgq_swly1 === "蒸发皿" && + this.formAll[2].form3.rtucgq_zfly === "水位值1" + ) { + this.$message({ + message: `水位计1和蒸发皿数据冲突！`, + type: "warning", + }); + return; + } + if ( + this.formAll[2].form3.rtucgq_swly2 === "蒸发皿" && + this.formAll[2].form3.rtucgq_zfly === "水位值2" + ) { + this.$message({ + message: `水位计2和蒸发皿数据冲突！`, + type: "warning", + }); + return; + } + if ( + this.formAll[2].form3.rtucgq_swly1 === "流量计内置水位计" && + this.formAll[2].form3.rtucgq_llly1 === "外置独立水位计" + ) { + this.$message({ + message: `水位计1和流量计1数据冲突！`, + type: "warning", + }); + return; + } + if ( + this.formAll[2].form3.rtucgq_swly2 === "流量计内置水位计" && + this.formAll[2].form3.rtucgq_llly2 === "外置独立水位计" + ) { + this.$message({ + message: `水位计2和流量计2数据冲突！`, + type: "warning", + }); + return; + } + // return ; // 提交所有表单，循环校验所有表单，当有个表单校验失败就break，提示该表单校验失败，根据校验成功总数或者无失败确定完成，组装数据发送到后台 var successCount = 0; var successFlag = false; for (var i = 0; i < 15; i++) { - this.$refs["form"][i].validate(valid => { + this.$refs["form"][i].validate((valid) => { if (valid) { successCount++; } else { this.$message({ message: `${this.siteNameList[i]} 校验失败，请查看`, - type: "warning" + type: "warning", }); // alert(`${this.siteNameList[i]} 校验失败，请查看`); // this.$notify({ @@ -1166,8 +769,8 @@ rtuEvaporatingDishSetting: this.formAll[11].form12, rtuSoilSettler: this.formAll[12].form13, rtu4To20Setting: this.formAll[13].form14, - rtuOtherSetting: this.formAll[14].form15 - } + rtuOtherSetting: this.formAll[14].form15, + }, }; // 之前初始化时将3处的两个数组生成了需要的字段，现在需要把每处16个字段组装成两数组，删除不需要的字段,转化方法暂时写在这里 function dealInputSwitch( @@ -1236,7 +839,7 @@ ] = rtucamera_jiabaoNew; this.$http .post(`${this.nozzle.rTUSettingServiceUpdate}`, parmas) - .then(res => { + .then((res) => { // console.log(res,'rTUSettingServiceUpdate') this.echoClick(); }); @@ -1278,11 +881,11 @@ }, selectChange(val) { // this.querySite = [] - this.rtuHistoryId='' + this.rtuHistoryId = ""; // console.log(val,'val') // if(this.querySite.length!==2) return; this.echoClick(val); - this.getRtuHistoryList() + this.getRtuHistoryList(); }, selectChange1(val) { // console.log(val,'val') input搜索 @@ -1294,7 +897,7 @@ // this.echoClick(val); }, async initPage(site) { - this.loading = true + this.loading = true; // 切换站点后去请求历史下拉框 // this.getRtuHistoryList() // 回显接口请求数据 将水文传感里面3处特殊的控件需要的值，用请求数据遍历生成表单需要的字段，因为这3处的动态表单使用的是死的字段，其他的对应的表单数据赋值给对应表单就能回显了、 @@ -1320,7 +923,7 @@ "rtuEvaporatingDishSetting", "rtuSoilSettler", "rtu4To20Setting", - "rtuOtherSetting" + "rtuOtherSetting", ]; // console.log(this.formAll,resData,'ressssss') // this.formAll={} @@ -1402,7 +1005,7 @@ this.formAll.push(obj); // console.log(this.formAll,this.stCode,'this.formAll') } - this.loading = false + this.loading = false; }, async initPage2(rtuCode) { // 回显接口请求数据 将水文传感里面3处特殊的控件需要的值，用请求数据遍历生成表单需要的字段，因为这3处的动态表单使用的是死的字段，其他的对应的表单数据赋值给对应表单就能回显了、 @@ -1425,7 +1028,7 @@ "rtuEvaporatingDishSetting", "rtuSoilSettler", "rtu4To20Setting", - "rtuOtherSetting" + "rtuOtherSetting", ]; console.log(this.formAll, resData, "ressssss"); // this.formAll={} @@ -1598,36 +1201,55 @@ return temp; } // 生成表单控件的接口 - this.$http.post(this.nozzle.rtuPageQueryPage).then(res => { + this.$http.post(this.nozzle.rtuPageQueryPage).then((res) => { var dataRes = res.data.data; // console.log(dataRes,'dataRes') for (var i in dataRes) { if (dataRes[i].length !== 0) { dataRes[i].forEach((item, index, arr) => { - this.rules[item.fieldIdentifier] = [ - { - validator: (rule, value, callback) => { - this.validatorAll( - rule, - value, - callback, - item.validatorType, - item.validatorRules, - item.validatorErrorText - ); + if (item.fieldType !== 5) { + this.rules[item.fieldIdentifier] = [ + { + validator: (rule, value, callback) => { + this.validatorAll( + rule, + value, + callback, + item.validatorType, + item.validatorRules, + item.validatorErrorText + ); + }, + trigger: "change", }, - trigger: "change" - } - ]; + ]; + } else if (item.fieldType === 5) { + this.rules[item.fieldIdentifier] = [ + { + validator: (rule, value, callback) => { + this.validatorAll( + rule, + value, + callback, + item.validatorType, + item.validatorRules, + item.validatorErrorText + ); + }, + trigger: "change", + }, + { required: true, message: "必填", trigger: "change" }, + ]; + } }); - let sub_titleList = dataRes[i].map(item => { + let sub_titleList = dataRes[i].map((item) => { return item.subTitle; }); var newObj = []; // 根据小标题去重 - uniq(sub_titleList).forEach(item => { + uniq(sub_titleList).forEach((item) => { var obj = { name: item, data: [], isShow: true, isBlock: true }; - var data = dataRes[i].forEach(l => { + var data = dataRes[i].forEach((l) => { l.isShow = true; if ( l.subTitle === item && @@ -1651,11 +1273,11 @@ console.log(this.formAllBody, "999"); }); }, - async getSiteList(val='') { - // ,{stCode:this.querySite} + async getSiteList(val = "") { + // ,{stCode:this.querySite} await this.$http .post(`${this.nozzle.rTUSettingServiceQueryList}?stCode=${val}`) - .then(res => { + .then((res) => { // console.log(res.data.data,'resss') this.querySiteList = res.data.data; // this.querySiteList.push({ @@ -1675,15 +1297,641 @@ await this.$http //`${this.nozzle.queryRTUSettingHistory}?stCode=${this.querySite}` .post(`${this.nozzle.queryRTUSettingHistory}?rtuCode=${rtuCode}`) - .then(res => { + .then((res) => { // console.log(res.data,'resss') this.rtuHistoryList = res.data.data; // this.querySite = this.querySiteList[0].rtuStationCode; }); - } + }, + initWatch() { + // console.log(this.formAll,this.formAllBody,'this.formAll[0]') + //// 第一个函数就是处理你要监听的属性，只要将其return出去就行 + // 外置dtu开关 + this.$watch( + function () { + return this.formAll[0].form1.rtuOutDtu; + }, + function (newVal, oldVal) { + this.formAllBody["1"].forEach((item, index, arr) => { + if (item.name === "外置DTU设置") { + arr[index].isShow = newVal; + } + }); + } + ); + // GPRS，LORA开关 + this.$watch( + function () { + return this.formAll[0].form1.rtuInnerMode; + }, + function (newVal, oldVal) { + this.formAllBody["1"].forEach((item, index, arr) => { + if (item.name === "内置LoRa相关配置") { + arr[index].isShow = newVal === "LORA" ? true : false; + } + }); + this.formAllBody["2"].forEach((item, index, arr) => { + if (item.name === "中心站1") { + arr[index].isShow = newVal === "GPRS" ? true : false; + } + if (item.name === "中心站2") { + arr[index].isShow = newVal === "GPRS" ? true : false; + } + if (item.name === "中心站3") { + arr[index].isShow = newVal === "GPRS" ? true : false; + } + if (item.name === "中心站4(备份站)") { + arr[index].isShow = newVal === "GPRS" ? true : false; + } + if (item.name === "VPN专网设置1") { + arr[index].isShow = newVal === "GPRS" ? true : false; + } + if (item.name === "VPN专网设置2") { + arr[index].isShow = newVal === "GPRS" ? true : false; + } + if (item.name === "NBIOT网络设置") { + arr[index].isShow = newVal === "GPRS" ? true : false; + } + if (item.name === "中心站其他设置") { + arr[index].isShow = newVal === "GPRS" ? true : false; + } + if (item.name === "远程后台服务器设置") { + arr[index].isShow = newVal === "GPRS" ? true : false; + } + }); + } + ); + // 水位计雷达 + this.$watch( + function () { + return this.formAll[2].form3.rtucgq_shuiwei1; + }, + function (newVal, oldVal) { + if ( + !( + (newVal === "NF-WGX-5小雷达水位计") | + (newVal === "NF-WGX-6大雷达水位计") + ) + ) { + this.formAllBody["9"][2].isShow = false; + } else { + this.formAllBody["9"][2].isShow = true; + } + } + ); + this.$watch( + function () { + return this.formAll[2].form3.rtucgq_shuiwei2; + }, + function (newVal, oldVal) { + if ( + !( + (newVal === "NF-WGX-5小雷达水位计") | + (newVal === "NF-WGX-6大雷达水位计") + ) + ) { + this.formAllBody["9"][2].isShow = false; + } else { + this.formAllBody["9"][4].isShow = true; + } + } + ); + // 流量计水龟 流量计1 流量计1设置 + this.$watch( + function () { + return this.formAll[2].form3.rtucgq_liuliang1; + }, + function (newVal, oldVal) { + let arr = [ + "4-20mA流量计", + "NACH-FL900流速仪", + "LWGY涡轮流量计", + "SM_311水表", + ]; + if (arr.indexOf(newVal) !== -1) { + this.formAll[10].form11.rtull_ll1_jiemian = "直接流量输出"; + this.formAllBody["11"][1].data[0].isShow = false; + } else { + this.formAllBody["11"][1].data[0].isShow = true; + } + } + ); + this.$watch( + function () { + return this.formAll[2].form3.rtucgq_liuliang2; + }, + function (newVal, oldVal) { + let arr = [ + "4-20mA流量计", + "NACH-FL900流速仪", + "LWGY涡轮流量计", + "SM_311水表", + ]; + if (arr.indexOf(newVal) !== -1) { + this.formAll[10].form11.rtull_ll2_jiemian = "直接流量输出"; + this.formAllBody["11"][4].data[0].isShow = false; + } else { + this.formAllBody["11"][4].data[0].isShow = true; + } + } + ); + this.$watch( + function () { + return this.formAll[2].form3.rtucgq_liuliang2; + }, + function (newVal, oldVal) { + if (!(newVal === "NF_LZX_2水龟")) { + this.formAllBody["11"][6].isShow = false; + } else { + this.formAllBody["11"][6].isShow = true; + } + } + ); + // 遥测站 采集标志 开关， 存储周期 rtuSaveCircle + this.$watch( + function () { + return this.formAll[0].form1.rtucjFlagTrans; + }, + function (newVal, oldVal) { + this.formAllBody["1"][0].data[3].isShow = !newVal; + } + ); + // 域名传输 + this.$watch( + function () { + return this.formAll[1].form2.rtuZxZx1RealmNameTrans; + }, + function (newVal, oldVal) { + this.formAllBody["2"][0].data[2].isShow = newVal; + this.formAllBody["2"][0].data[3].isShow = !newVal; + } + ); + this.$watch( + function () { + return this.formAll[1].form2.rtuZxZx2RealmNameTrans; + }, + function (newVal, oldVal) { + this.formAllBody["2"][2].data[2].isShow = newVal; + this.formAllBody["2"][2].data[3].isShow = !newVal; + } + ); + this.$watch( + function () { + return this.formAll[1].form2.rtuZxZx3RealmNameTrans; + }, + function (newVal, oldVal) { + this.formAllBody["2"][4].data[2].isShow = newVal; + this.formAllBody["2"][4].data[3].isShow = !newVal; + } + ); + this.$watch( + function () { + return this.formAll[1].form2.rtuZxZx4RealmNameTrans; + }, + function (newVal, oldVal) { + this.formAllBody["2"][6].data[2].isShow = newVal; + this.formAllBody["2"][6].data[3].isShow = !newVal; + } + ); + // 外置dtu设置，下拉框 + this.$watch( + function () { + return this.formAll[0].form1.rtuother_dtu_type; + }, + function (newVal, oldVal) { + var targetArr = [ + [true, true, true, true, false], + [true, true, false, false, false], + [false, false, false, false, true], + [false, false, false, false, false], + ]; + let select = [ + "LoRa-利尔达CN470", + "ManThink-门思科技", + "BC28电信管理平台NB", + "M5311移动平台NB", + ]; // 下拉框值，对应targetArr其他5个控件显示的4状态 + let strArr = [ + "JoinEUI", + "频率格式", + "上行频率", + "下行频率", + "电信NB服务ID", + ]; + this.formAllBody["1"][2].data.forEach((item, index, arr) => { + for (let i = 0; i < strArr.length; i++) { + if (arr[index].fieldName === strArr[i]) { + arr[index].isShow = targetArr[select.indexOf(newVal)][i]; + } + } + }); + // console.log(this.formAllBody['1'][2].data, select.indexOf(newVal),'_this.formAllBody[]') + } + ); + // 从机1 ，2设置 + this.$watch( + function () { + return this.formAll[2].form3.rtucgq_congji1; + }, + function (newVal, oldVal) { + var targetNameArr = [ + ["无效参数", "无效参数", "无效参数"], + ["抽水周期", "抽水超时", "排水超时"], + ["无效参数", "无效参数", "无效参数"], + ["采集周期", "通道延时", "演示递增"], + ["采集周期", "通道延时", "无效参数"], + ["查询周期", "抽水超时", "排水超时"], + ]; + var targetStatusArr = [ + [false, false, false], + [true, true, true], + [false, false, false], + [true, true, true], + [true, true, false], + [true, true, true], + ]; + let select = [ + "默认从机", + "电机驱动板（水质监测柜）", + "VGUS屏幕（水质监测柜）", + "二供（净水器）", + "二供（水箱）", + "主控板（5/9参数水质监测柜）", + ]; // 下拉框值，对应targetArr其他5个控件显示的4状态 + let strArr = ["rtucj1_canshu1", "rtucj1_canshu2", "rtucj1_canshu3"]; + this.formAllBody["7"][1].data.forEach((item, index, arr) => { + for (let i = 0; i < strArr.length; i++) { + if (arr[index].fieldIdentifier === strArr[i]) { + arr[index].isShow = targetStatusArr[select.indexOf(newVal)][i]; + arr[index].fieldName = targetNameArr[select.indexOf(newVal)][i]; + } + } + }); + // console.log(this.formAllBody['1'][2].data, select.indexOf(newVal),'_this.formAllBody[]') + } + ); + this.$watch( + function () { + return this.formAll[6].form7.rtucj_kaiguan1; + }, + function (newVal, oldVal) { + this.formAllBody["7"][1].isShow = newVal; + } + ); + this.$watch( + function () { + return this.formAll[6].form7.rtucj_kaiguan2; + }, + function (newVal, oldVal) { + this.formAllBody["7"][3].isShow = newVal; + } + ); + this.$watch( + function () { + return this.formAll[2].form3.rtucgq_congji2; + }, + function (newVal, oldVal) { + var targetNameArr = [ + ["无效参数", "无效参数", "无效参数"], + ["抽水周期", "抽水超时", "排水超时"], + ["无效参数", "无效参数", "无效参数"], + ["采集周期", "通道延时", "演示递增"], + ["采集周期", "通道延时", "无效参数"], + ["查询周期", "抽水超时", "排水超时"], + ]; + var targetStatusArr = [ + [false, false, false], + [true, true, true], + [false, false, false], + [true, true, true], + [true, true, false], + [true, true, true], + ]; + let select = [ + "默认从机", + "电机驱动板（水质监测柜）", + "VGUS屏幕（水质监测柜）", + "二供（净水器）", + "二供（水箱）", + "主控板（5/9参数水质监测柜）", + ]; // 下拉框值，对应targetArr其他5个控件显示的4状态 + let strArr = ["rtucj2_canshu1", "rtucj2_canshu2", "rtucj2_canshu3"]; + this.formAllBody["7"][3].data.forEach((item, index, arr) => { + for (let i = 0; i < strArr.length; i++) { + if (arr[index].fieldIdentifier === strArr[i]) { + arr[index].isShow = targetStatusArr[select.indexOf(newVal)][i]; + arr[index].fieldName = targetNameArr[select.indexOf(newVal)][i]; + } + } + }); + // console.log(this.formAllBody['1'][2].data, select.indexOf(newVal),'_this.formAllBody[]') + } + ); + // 流量计 流量槽 + this.$watch( + function () { + return this.formAll[10].form11.rtull_ll1_jiemian; + }, + function (newVal, oldVal) { + var targetNameArr = [ + [ + "安装高度", + "流量校正", + "淤积深度", + "无效参数", + "无效参数", + "无效参数", + "堰槽截面表高度分辨率", + ], + [ + "安装高度", + "流量校正", + "淤积深度", + "上地宽度", + "堰槽高度", + "无效参数", + "堰槽截面表高度分辨率", + ], + [ + "安装高度", + "流量校正", + "淤积深度", + "上地宽度", + "堰槽高度", + "无效参数", + "堰槽截面表高度分辨率", + ], + [ + "安装高度", + "流量校正", + "淤积深度", + "窄底宽度", + "堰槽高度", + "宽底宽度", + "堰槽截面表高度分辨率", + ], + [ + "安装高度", + "流量校正", + "淤积深度", + "无效参数", + "槽堰直径", + "无效参数", + "堰槽截面表高度分辨率", + ], + [ + "安装高度", + "流量校正", + "淤积深度", + "无效参数", + "无效参数", + "无效参数", + "堰槽截面表高度分辨率", + ], + [ + "溢流高度", + "流量校正", + "淤积深度", + "无效参数", + "槽堰高度", + "无效参数", + "堰槽截面表高度分辨率", + ], + [ + "溢流高度", + "流量校正", + "淤积深度", + "槽堰高度", + "槽序号", + "无效参数", + "堰槽截面表高度分辨率", + ], + ]; + var targetStatusArr = [ + [true, true, true, false, false, false, false], + [true, true, true, true, true, false, false], + [true, true, true, true, true, false, false], + [true, true, true, true, true, true, false], + [true, true, true, false, true, false, false], + [true, true, true, false, false, false, true], + [true, true, true, false, true, false, false], + [true, true, true, true, true, false, false], + ]; + let select = [ + "直接流量输出", + "三角堰", + "矩形堰", + "梯形堰", + "圆管", + "自定义截面", + "直角三角堰明渠", + "巴歇尔槽明渠", + ]; // 下拉框值， + let strArr = [ + "rtull_ll1_gaodu", + "rtull_ll1_jiaozheng", + "rtull_ll1_shendu", + "rtull_ll1_shangdikuandu", + "rtull_ll1_yancaogaodu", + "rtull_ll1_xiadikuandu", + "rtull_ll1_fenbian", + ]; + this.formAllBody["11"][1].data.forEach((item, index, arr) => { + for (let i = 0; i < strArr.length; i++) { + if (arr[index].fieldIdentifier === strArr[i]) { + arr[index].isShow = targetStatusArr[select.indexOf(newVal)][i]; + arr[index].fieldName = targetNameArr[select.indexOf(newVal)][i]; + } + } + }); + // console.log(this.formAllBody['1'][2].data, select.indexOf(newVal),'_this.formAllBody[]') + } + ); + this.$watch( + function () { + return this.formAll[10].form11.rtull_ll2_jiemian; + }, + function (newVal, oldVal) { + var targetNameArr = [ + [ + "安装高度", + "流量校正", + "淤积深度", + "无效参数", + "无效参数", + "无效参数", + "堰槽截面表高度分辨率", + ], + [ + "安装高度", + "流量校正", + "淤积深度", + "上地宽度", + "堰槽高度", + "无效参数", + "堰槽截面表高度分辨率", + ], + [ + "安装高度", + "流量校正", + "淤积深度", + "上地宽度", + "堰槽高度", + "无效参数", + "堰槽截面表高度分辨率", + ], + [ + "安装高度", + "流量校正", + "淤积深度", + "窄底宽度", + "堰槽高度", + "宽底宽度", + "堰槽截面表高度分辨率", + ], + [ + "安装高度", + "流量校正", + "淤积深度", + "无效参数", + "槽堰直径", + "无效参数", + "堰槽截面表高度分辨率", + ], + [ + "安装高度", + "流量校正", + "淤积深度", + "无效参数", + "无效参数", + "无效参数", + "堰槽截面表高度分辨率", + ], + [ + "溢流高度", + "流量校正", + "淤积深度", + "无效参数", + "槽堰高度", + "无效参数", + "堰槽截面表高度分辨率", + ], + [ + "溢流高度", + "流量校正", + "淤积深度", + "槽堰高度", + "槽序号", + "无效参数", + "堰槽截面表高度分辨率", + ], + ]; + var targetStatusArr = [ + [true, true, true, false, false, false, false], + [true, true, true, true, true, false, false], + [true, true, true, true, true, false, false], + [true, true, true, true, true, true, false], + [true, true, true, false, true, false, false], + [true, true, true, false, false, false, true], + [true, true, true, false, true, false, false], + [true, true, true, true, true, false, false], + ]; + let select = [ + "直接流量输出", + "三角堰", + "矩形堰", + "梯形堰", + "圆管", + "自定义截面", + "直角三角堰明渠", + "巴歇尔槽明渠", + ]; // 下拉框值， + let strArr = [ + "rtull_ll2_gaodu", + "rtull_ll2_jiaozheng", + "rtull_ll2_shendu", + "rtull_ll2_shangdikuandu", + "rtull_ll2_yancaogaodu", + "rtull_ll2_xiadikuandu", + "rtull_ll2_fenbian", + ]; + this.formAllBody["11"][4].data.forEach((item, index, arr) => { + for (let i = 0; i < strArr.length; i++) { + if (arr[index].fieldIdentifier === strArr[i]) { + arr[index].isShow = targetStatusArr[select.indexOf(newVal)][i]; + arr[index].fieldName = targetNameArr[select.indexOf(newVal)][i]; + } + } + }); + // console.log(this.formAllBody['1'][2].data, select.indexOf(newVal),'_this.formAllBody[]') + } + ); + // 蒸发皿 + this.$watch( + function () { + return this.formAll[2].form3.rtucgq_zfly; + }, + function (newVal, oldVal) { + var targetNameArr = [ + ["安装高度", "量程", "最小加水量"], + ["无效参数", "无效参数", "最小加水量"], + ["无效参数", "无效参数", "最小加水量"], + ]; + var targetStatusArr = [ + [true, true, true], + [false, false, true], + [false, false, true], + ]; + let select = ["独立蒸发皿", "水位值1", "水位值2"]; // 下拉框值，对应targetArr其他5个控件显示的4状态 + let strArr = ["rtuzf_gaodu", "rtuzf_liangcheng", "rtuzf_zuixiao"]; + this.formAllBody["12"][0].data.forEach((item, index, arr) => { + for (let i = 0; i < strArr.length; i++) { + if (arr[index].fieldIdentifier === strArr[i]) { + arr[index].isShow = targetStatusArr[select.indexOf(newVal)][i]; + arr[index].fieldName = targetNameArr[select.indexOf(newVal)][i]; + } + } + }); + // console.log(this.formAllBody['1'][2].data, select.indexOf(newVal),'_this.formAllBody[]') + } + ); + // 4am， 存储周期 rtuSaveCircle + this.$watch( + function () { + return this.formAll[2].form3.rtucgq_liuliang1; + }, + function (newVal, oldVal) { + var targetNameArr = [ + [ + "安装高度", + "流量校正", + "淤积深度", + "无效参数", + "无效参数", + "无效参数", + "堰槽截面表高度分辨率", + ], + ]; + var targetStatusArr = [ + [true, true, true, false, false, false, false], + ]; + let select = ["独立蒸发皿", "水位值1", "水位值2"]; // 下拉框值，对应targetArr其他5个控件显示的4状态 + let strArr = ["rtuzf_gaodu", "rtuzf_liangcheng", "rtuzf_zuixiao"]; + this.formAllBody["11"][1].data.forEach((item, index, arr) => { + for (let i = 0; i < strArr.length; i++) { + if (arr[index].fieldIdentifier === strArr[i]) { + arr[index].isShow = targetStatusArr[select.indexOf(newVal)][i]; + arr[index].fieldName = targetNameArr[select.indexOf(newVal)][i]; + } + } + }); + // console.log(this.formAllBody['1'][2].data, select.indexOf(newVal),'_this.formAllBody[]') + } + ); + }, }, created() { - this.getSiteList().then(res => { + this.getSiteList().then((res) => { // this.querySiteList[0].rtuStationCode // this.initPage(this.querySite); // this.getRtuHistoryList() @@ -1691,7 +1939,12 @@ this.formControl(); // console.log(666) - } + }, + updated() { + // if(this.formAll.length !==0){ + // this.initWatch() + // } + }, // beforeRouteLeave (to, from, next) { // // 导航离开该组件的对应路由时调用 // // 可以访问组件实例 `this` @@ -1752,12 +2005,12 @@ margin: 11px 0 11px 0 !important; .el-form-item__label { // text-align: right; - width: 160px !important; + width: 180px !important; text-align: right !important; color: var(--white) !important; } .el-form-item__content { - margin: 0 0 0 160px !important; + margin: 0 0 0 180px !important; .el-select { width: 100% !important; .el-input .el-input__inner { diff --git a/src/components/ConfigManager/SiteManagement.vue b/src/components/ConfigManager/SiteManagement.vue index 404080d..44b4598 100644 --- a/src/components/ConfigManager/SiteManagement.vue +++ b/src/components/ConfigManager/SiteManagement.vue @@ -218,7 +218,7 @@
@@ -745,30 +745,6 @@ } ] }, - rules1: { - ruleId: [ - { - required: true, - message: "请选择规则引擎", - trigger: "blur" - } - ], - referRainStationSt: [ - { - required: true, - message: "请选择雨量站", - trigger: "blur", - }, - ], - - isEnable: [ - { - required: true, - message: "请选择是否启用", - trigger: "blur" - } - ], - }, value: [], // 站点管理/所属区域数组 syscityList: [], @@ -929,9 +905,7 @@ } else { httpurl = this.nozzle.siterepairconfigmodify; } - this.$refs[form].validate((valid) => { - if (valid) { - this.$http.post(httpurl, this.configForm).then((res) => { + this.$http.post(httpurl, this.configForm).then(res => { console.log(res); if (res.data.code === 200) { this.configtrue = false; @@ -944,11 +918,6 @@ showClose: true }); }); - - }else{ - console.log("完善信息") - } - }) }, //响应地图组件的确定，拾取坐标 SendLngLat(lonlat) { @@ -1156,9 +1125,22 @@ //添加站点 case "create": this.iscodefalse = false; - this.projectObj = {}; this.yzaddflag = true; this.title = "新增站点"; + this.projectList = this.allPlatSite.map((item) => { + return { + id: item.id, + key: item.platformName, + value: item.platformCode, + areaId: item.area, + }; + }); + this.projectObj = {}; + setTimeout(() => { + if(this.$refs.ruleForm){ + this.$refs.ruleForm.clearValidate(); + } + }, 0); break; //编辑站点 case "update": @@ -1182,6 +1164,11 @@ this.ruleForm[key] = data[key]; } this.yzaddflag = true; + setTimeout(() => { + if(this.$refs.ruleForm){ + this.$refs.ruleForm.clearValidate(); + } + }, 0); break; //配置因子 case "config": diff --git a/src/components/index.vue b/src/components/index.vue index 268ef5a..b423ddd 100644 --- a/src/components/index.vue +++ b/src/components/index.vue @@ -469,8 +469,9 @@ } }, ZhuXIao() { - this.$router.push({ path: "/Login" }); + // this.$router.push({ path: "/Login" }); sessionStorage.clear(); + location.reload(); }, // 初始化验证 initRules() { diff --git a/src/components/login.vue b/src/components/login.vue index 36cbc33..24710ee 100644 --- a/src/components/login.vue +++ b/src/components/login.vue @@ -138,7 +138,7 @@ // 用户在线状态计时 loginTime(); // 保存cook - + this.$router.push("/welcome"); sessionStorage.setItem("powerHandle", response2.data.data); diff --git a/src/components/site/previewOfSiteStatus.vue b/src/components/site/previewOfSiteStatus.vue index 64a7b26..eac618f 100644 --- a/src/components/site/previewOfSiteStatus.vue +++ b/src/components/site/previewOfSiteStatus.vue @@ -137,9 +137,9 @@ size="medium" > @@ -634,7 +634,7 @@ import Modify from "ol/interaction/Modify"; import FormatWKT from "ol/format/WKT"; import { ScaleLine, ZoomSlider, ZoomToExtent, Zoom } from "ol/control"; -// import echarts from "echarts"; +import { mapGetters } from "vuex"; export default { name: "previewOfSiteStatus", components: { countTo }, //加载数字滚动插件 @@ -754,7 +754,7 @@ dynamic: 0, ChecksplatformCode: "", //选取的平台的编号 platformtype: "", //选取的站点统计类型 - ChecksplatformCodeTest: "全部项目", //选取的默认文字 + ChecksplatformCodeTest: "", //选取的默认文字 historyList: [], // 项目选择B // 平台站点数量及状态统计A @@ -791,7 +791,7 @@ // 项目站点覆盖排名B // 设备分类A myChart: {}, - XianYou: "", //现有设备总数 + // XianYou: "", //现有设备总数 titlearr: [], valuearr: [], myChart2: {}, @@ -847,20 +847,7 @@ this.map.getView().setZoom(5); }, - //根据当前项目后台坐标计算出的中心飞行到指定城市 - flyToCity() { - // console.log("经纬度最大边框是：" + this.north); - // console.log("经纬度最大边框是：" + this.south); - // console.log("经纬度最大边框是：" + this.east); - // console.log("经纬度最大边框是：" + this.west); - this.map - .getView() - .setCenter([ - (this.east + this.west) / 2, - (this.north + this.south) / 2 - ]); - this.map.getView().setZoom(10); - }, + //项目图层切换 initPointToMap(projectNo) { this.$http @@ -890,35 +877,31 @@ }, 0); }, // 获取所有平台 - LoadAllProject() { - this.$http - .post( - this.nozzle.userGroupRelaGetGroups + - "?&pageNo=" + - 1 + - "&typeStr=" + - "&pageSize=" + - 999 - ) - .then(response => { - // console.log(response); - if (response.status === 200) { - var qwe = response.data.data === "" ? [] : response.data.data; + // LoadAllProject() { + // this.$http + // .post( + // this.nozzle.userGroupRelaGetGroups + + // "?&pageNo=" + + // 1 + + // "&typeStr=" + + // "&pageSize=" + + // 999 + // ) + // .then(response => { + // if (response.status === 200) { + // var qwe = response.data.data === "" ? [] : response.data.data; - this.ProjectList = this.ProjectList.concat(qwe); - // console.log(this.ProjectList); - } else { - message(response); - } - }) - .catch(response => { - message(response); - }); - }, + // this.ProjectList = this.ProjectList.concat(qwe); + // } else { + // message(response); + // } + // }) + // .catch(response => { + // message(response); + // }); + // }, // 根据平台渲染站点统计 loadSiteNumForOroject() { - // console.log(this.platformtype, this.ChecksplatformCode); - this.$http .post(this.nozzle.getSiteNum, { data: { platform: this.ChecksplatformCode, type: this.platformtype } @@ -929,16 +912,13 @@ this.Site.SAll = this.Site.EAll; this.Site.SOn = this.Site.EOn; this.Site.SOff = this.Site.EOff; - this.Project.SAll = this.Project.EAll; - this.Project.SOn = this.Project.EOn; - this.Project.SOff = this.Project.EOff; + // this.Project.SAll = this.Project.EAll; + // this.Project.SOn = this.Project.EOn; + // this.Project.SOff = this.Project.EOff; // 将新数据设置成数字滚动的结束值 也就是展示值 this.Site.EAll = response.data.data.all; this.Site.EOn = response.data.data.online; this.Site.EOff = response.data.data.offline; - // this.Project.EAll = response.data.data.projectcount; - // this.Project.EOn = response.data.data.completed; - // this.Project.EOff = response.data.data.noncompleted; } else { message(response); } @@ -949,15 +929,11 @@ }, // 单击显示平台站点 allpreview(index, item, event) { - // console.log(index, platform, event.target); this.namelist.forEach(item => { item.select = false; }); this.namelist[index].select = true; - - // console.log(this.platformtype, this.ChecksplatformCode); this.platformtype = item.type; - this.$http .post(this.nozzle.getSiteNum, { data: { platform: this.ChecksplatformCode, type: this.platformtype } @@ -968,9 +944,9 @@ this.Site.SAll = this.Site.EAll; this.Site.SOn = this.Site.EOn; this.Site.SOff = this.Site.EOff; - this.Project.SAll = this.Project.EAll; - this.Project.SOn = this.Project.EOn; - this.Project.SOff = this.Project.EOff; + // this.Project.SAll = this.Project.EAll; + // this.Project.SOn = this.Project.EOn; + // this.Project.SOff = this.Project.EOff; // 将新数据设置成数字滚动的结束值 也就是展示值 this.Site.EAll = response.data.data.all; this.Site.EOn = response.data.data.online; @@ -1011,8 +987,6 @@ }) .then(response => { if (response.status === 200) { - // this.XianYou = response.data.data.total; - // console.log(response.data.data); this.titlearr = response.data.data.title; this.valuearr = response.data.data.value; this.loadRegionEcharts(this.titlearr, this.valuearr); @@ -1034,7 +1008,6 @@ }) .then(response => { if (response.data.code === 1) { - // console.log(response); this.areaList = response.data.data; } else { message(response); @@ -1051,7 +1024,7 @@ this.$http .post(this.nozzle.warnLogListWarnLog, { current: 1, - size: 99, + size: 999, data: { platForm: this.ChecksplatformCode, endTime: "", @@ -1076,16 +1049,14 @@ }, // 点击项目ZZJ ListClick(index) { - this.ChecksplatformCode = this.ProjectList[index]["groupNo"]; - + this.ChecksplatformCode = this.allProjectSite[index]["platformCode"]; //刷新联动地图上的点位按照项目实际的个数 - // console.log(this.ChecksplatformCode); this.initPointToMap(this.ChecksplatformCode); if ( - this.ProjectList[index]["areaCode"] && - this.ProjectList[index]["groupNo"] != "" + this.allProjectSite[index]["areaCode"] && + this.allProjectSite[index]["platformCode"] != "" ) - this.gotoProgramArea(this.ProjectList[index]["areaCode"]); + this.gotoProgramArea(this.allProjectSite[index]["areaCode"]); else { this.fwClick(); if (this.vectorSourceArea) { @@ -1094,16 +1065,14 @@ } // 限制数组的长度不超过10个 - // console.log(this.historyList.length); - // console.log(this.ProjectList[index]["groupName"]); - var gname = this.ProjectList[index]["groupName"]; + var gname = this.allProjectSite[index]["platformName"]; if (this.historyList.length >= 10 && this.historyList.includes(gname)) { } else if (this.historyList.length >= 10) { this.historyList.pop(); } this.historyList = this.selectTag( this.historyList, - this.ProjectList[index]["groupName"] + this.allProjectSite[index]["platformName"] ); this.setItem(this.historyList); @@ -1116,30 +1085,30 @@ // 根据平台渲染站点实时报警信息 this.loadSiteBaoJing(); // 返回出项目的坐标以及缩放等级************************************************************************************************GIS调用 - if ( - this.ProjectList[index].latitude != null && - this.ProjectList[index].longitude != null && - this.ProjectList[index].zoomLevel != null - ) { - let MapPoint = new esri.geometry.Point( - this.ProjectList[index].longitude, - this.ProjectList[index].latitude, - new esri.SpatialReference({ - wkid: 4326 - }) - ); - this.map.centerAndZoom(MapPoint, this.ProjectList[index].zoomLevel); - } + // if ( + // this.ProjectList[index].latitude != null && + // this.ProjectList[index].longitude != null && + // this.ProjectList[index].zoomLevel != null + // ) { + // let MapPoint = new esri.geometry.Point( + // this.ProjectList[index].longitude, + // this.ProjectList[index].latitude, + // new esri.SpatialReference({ + // wkid: 4326 + // }) + // ); + // this.map.centerAndZoom(MapPoint, this.ProjectList[index].zoomLevel); + // } }, // 点击历史搜索的文字 HistoryClick(item) { this.ChecksplatformCodeTest = item; - this.ProjectList.forEach(item1 => { - if (item1["groupName"] == item) { - this.ChecksplatformCode = item1["groupNo"]; + this.allProjectSite.forEach(item1 => { + if (item1["platformName"] == item) { + this.ChecksplatformCode = item1["platformCode"]; //地图联动响应的项目 this.initPointToMap(this.ChecksplatformCode); - if (item1["areaCode"] && item1["groupNo"] != "") + if (item1["areaCode"] && item1["platformCode"] != "") this.gotoProgramArea(item1["areaCode"]); else { this.fwClick(); @@ -1156,20 +1125,20 @@ // 根据平台渲染站点实时报警信息 this.loadSiteBaoJing(); // 返回出项目的坐标以及缩放等级**************************GIS调用 - if ( - item1.latitude != null && - item1.longitude != null && - item1.zoomLevel != null - ) { - let MapPoint = new esri.geometry.Point( - item1.longitude, - item1.latitude, - new esri.SpatialReference({ - wkid: 4326 - }) - ); - this.map.centerAndZoom(MapPoint, item1.zoomLevel); - } + // if ( + // item1.latitude != null && + // item1.longitude != null && + // item1.zoomLevel != null + // ) { + // let MapPoint = new esri.geometry.Point( + // item1.longitude, + // item1.latitude, + // new esri.SpatialReference({ + // wkid: 4326 + // }) + // ); + // this.map.centerAndZoom(MapPoint, item1.zoomLevel); + // } } }); }, @@ -1193,13 +1162,11 @@ }, // 加载设备分类的ecahrts loadRegionEcharts(titlearr, valuearr) { - // console.log(data); // 基于准备好的dom，初始化echarts实例 let myChart1 = this.$echarts.init( document.getElementById("previewOfSiteStatusCentent4eCharts") ); // 绘制图表 - // this.myChart1.clear(); let option = { xAxis: { type: "category", @@ -1725,10 +1692,7 @@ var cell, resultwkt = ""; var feature; - this.north = -90; - this.south = 90; - this.east = -180; - this.west = 180; + for (var i = 0; i < clusterData.length; i++) { cell = clusterData[i]; @@ -1751,11 +1715,6 @@ this.vectorSource.addFeature(feature); this.source.addFeature(feature); - //计算边框，用于切换项目定位中心点 - this.north = Math.max(parseFloat(cell.lat), this.north); - this.south = Math.min(parseFloat(cell.lat), this.south); - this.east = Math.max(parseFloat(cell.lon), this.east); - this.west = Math.min(parseFloat(cell.lon), this.west); } this.clusterSource = new Cluster({ @@ -1795,7 +1754,7 @@ }) }) */ }); - } else if (size > 2) { + } else if (size >= 2) { return new Style({ text: new Text({ text: size.toString(), @@ -1826,7 +1785,7 @@ } }); //飞行到指定的城市项目中心点 - // this.flyToCity() + //?要判断currentZoom加哪一个 if (this.currentZoom >= 8) this.map.addLayer(this.vector); else this.map.addLayer(this.layer); @@ -1942,6 +1901,7 @@ ) { return feature; }); + if (feature) { //捕捉到要素后，进行后续操作，如弹出要素信息 // this.addPopupContent(e.coordinate, feature.values_.features); @@ -2763,18 +2723,15 @@ computed: { switchStatus: function() { return this.flag; // 直接监听props里的status状态 - } + }, + ...mapGetters(["allProjectSite"]) }, - /* created() { - window.closepopup = this.closepopup; - window.historyData = this.historyData; - }, */ created() {}, mounted: function() { // 默认加载所有的平台 - this.LoadAllProject(); + // this.LoadAllProject(); - this.loadRegionEcharts(); + // this.loadRegionEcharts(); // 根据平台渲染站点数量统计及状态统计 this.loadSiteNumForOroject(); // 根据平台渲染设备分类 diff --git a/src/router/index.js b/src/router/index.js index 7fc8196..13640f9 100644 --- a/src/router/index.js +++ b/src/router/index.js @@ -288,6 +288,7 @@ if (to.name === "login") { next(); } else if (JSON.parse(getSession("logins")) === "true") { + next(); if (!store.state.common.allDept.length) { store .dispatch("common/getAllDept") @@ -302,14 +303,13 @@ next("/Login"); }); } - next(); } else { - message({ - data: { - code: 1, - msg: "请先登录在进行操作!" - } - }); + // message({ + // data: { + // code: 1, + // msg: "请先登录在进行操作!" + // } + // }); next(`/Login`); } }); diff --git a/src/store/getters.js b/src/store/getters.js index 1523fa1..dc221d9 100644 --- a/src/store/getters.js +++ b/src/store/getters.js @@ -6,6 +6,7 @@ allCity: state => state.common.allCity, //所有城市 allPlatSite: state => state.common.allPlatSite, //所有项目站点 allProject: state => state.common.allProject, //所有项目 + allProjectSite: state => state.common.allProjectSite, //所有项目(包含默认头部--全部项目) menu: state => state.user.menu, //用户权限范围菜单 } diff --git a/src/store/modules/common.js b/src/store/modules/common.js index 9600898..919ddcf 100644 --- a/src/store/modules/common.js +++ b/src/store/modules/common.js @@ -8,7 +8,8 @@ allRole:[], allCity:[], allPlatSite:[], - allProject:[] + allProject:[], + allProjectSite:[], }, mutations: { //设置所有部门 @@ -30,6 +31,10 @@ //设置所有项目 SET_ALLPROJECT:(state, allProject)=>{ state.allProject = allProject; + }, + //设置所有项目包含默认头部(全部项目) + SET_ALLPROJECTSITE:(state, allProjectSite)=>{ + state.allProjectSite = allProjectSite; } }, actions: { @@ -83,8 +88,16 @@ value: item.platformCode } }); + const preArr = [ + { + platformCode: "", + platformName: "全部项目", + } + ] + const allProjectSite = [...preArr, ...res.data.data]; commit('SET_ALLPROJECT',treeArr); commit('SET_ALLPLATSITE',res.data.data); + commit('SET_ALLPROJECTSITE',allProjectSite); } }).catch(e =>{ console.log(e);