From 996e3e343760bcfa23b55138f85abd62d6ebfb22 Mon Sep 17 00:00:00 2001 From: licp <lichunping@guanfang.com.cn> Date: 星期三, 25 十二月 2024 09:02:07 +0800 Subject: [PATCH] 报告预览调试 --- src/components/do/b6-device-management/b6-data-acquisition-config.vue | 730 +++++++++++++++++++++++++++++++++++++++++++++++++++++++ 1 files changed, 724 insertions(+), 6 deletions(-) diff --git a/src/components/do/b6-device-management/b6-data-acquisition-config.vue b/src/components/do/b6-device-management/b6-data-acquisition-config.vue index 70414f4..5696dcd 100644 --- a/src/components/do/b6-device-management/b6-data-acquisition-config.vue +++ b/src/components/do/b6-device-management/b6-data-acquisition-config.vue @@ -3,11 +3,153 @@ <div> <el-row class="title"> <el-col :span="6" style="padding-left: 20px;text-align: left;">鏁伴噰閰嶇疆</el-col> + <el-col :span="18" style="text-align: right;"> + <el-button size="medium" type="primary" @click="fileConfiguration">鏂囦欢閰嶇疆</el-button> + <el-button size="medium" @click="$parent.closeDataVue()"> + <span style="color: #3A7BFA;">杩斿洖</span> + </el-button> + </el-col> </el-row> </div> - <div> - <el-table></el-table> + <div class="table"> + <el-table :data="tableList.slice( + (page.current - 1) * page.size, + page.current * page.size + ) + " border tooltip-effect="dark" style="width: 100%;" height="100%" :span-method="spanMethod"> + <el-table-column type="index" label="搴忓彿" align="center" width="65"></el-table-column> + <el-table-column prop="deviceName" align="center" min-width="100" label="璁惧鍚嶇О"></el-table-column> + <el-table-column prop="fileType" align="center" label="鏂囦欢鍚庣紑"></el-table-column> + <el-table-column prop="collectUrl" align="center" min-width="100" show-overflow-tooltip + label="閲囬泦鍦板潃"></el-table-column> + <el-table-column prop="storageUrl" align="center" min-width="100" show-overflow-tooltip + label="瀛樺偍鍦板潃"></el-table-column> + <el-table-column prop="ip" align="center" label="IP鍦板潃" min-width="100"></el-table-column> + <el-table-column prop="sample" align="center" label="妫�楠屽璞�" show-overflow-tooltip + min-width="150"></el-table-column> + <el-table-column prop="inspectionItem" align="center" label="妫�楠岄」" min-width="100"></el-table-column> + <el-table-column prop="inspectionItemSubclass" align="center" label="妫�楠岄」瀛愰」" min-width="100"></el-table-column> + <el-table-column prop="referx" align="center" label="鍙傜収X" min-width="100"></el-table-column> + <el-table-column prop="x" align="center" label="X"></el-table-column> + <el-table-column prop="refery" align="center" label="鍙傜収Y" min-width="100"></el-table-column> + <el-table-column prop="y" align="center" label="Y"></el-table-column> + <el-table-column prop="formula" align="center" label="鍏紡"></el-table-column> + <el-table-column prop="section" fixed="right" label="鎿嶄綔" width="120"> + <template slot-scope="scope"> + <el-button type="text" @click="dataConfig(scope.row)">鏁伴噰閰嶇疆</el-button> + </template> + </el-table-column> + </el-table> </div> + <div class="page" v-if="tableList.length > 0"> + <el-pagination @size-change="sizeChange" @current-change="currentChange" :current-page="page.current" + :page-sizes="[10, 20, 30, 50, 100]" :page-size="page.size" layout="total, sizes, prev, pager, next, jumper" + :total="tableList.length"> + </el-pagination> + </div> + <el-dialog title="鏁伴噰閰嶇疆" :visible.sync="dialogVisible3" width="920px" :before-close="closeForm"> + <el-form :model="configForm" label-position="top" size="small" ref="configForm" label-width="100px" + class="demo-ruleForm"> + <el-table :data="domains" style="width: 100%" height="300"> + <el-table-column label="搴忓彿" type="index" width="80"> + <template v-slot="scope"> + {{ getIndexWithAlphabet(scope.$index) }} + </template> + </el-table-column> + <el-table-column prop="referx" label="鍙傜収X" min-width="180"> + <template v-slot="scope"> + <el-input style="width: 100%" v-model="scope.row.referx"></el-input> + </template> + </el-table-column> + <el-table-column prop="x" label="X" min-width="180"> + <template v-slot="scope"> + <el-input style="width: 100%" v-model="scope.row.x"></el-input> + </template> + </el-table-column> + <el-table-column prop="refery" label="鍙傜収Y" min-width="180"> + <template v-slot="scope"> + <el-input style="width: 100%" v-model="scope.row.refery"></el-input> + </template> + </el-table-column> + <el-table-column prop="y" label="Y" min-width="100"> + <template v-slot="scope"> + <el-input style="width: 100%" v-model="scope.row.y"></el-input> + </template> + </el-table-column> + <el-table-column label="鎿嶄綔" width="150"> + <template v-slot="scope"> + <el-button @click.prevent="removeDomain(scope.row)" size="small" type="text">鍒犻櫎</el-button> + <el-button @click="addDomain" size="small" type="text">鏂板</el-button> + </template> + </el-table-column> + </el-table> + <div class="fomItem2"> + <el-form-item class="fomItemInput1"> + <template v-slot="label"> + 鍏紡锛� + <el-tooltip v-for="(formula, key) in formulas" class="itemFomItem" effect="dark" :content="formula.content" :key="key" + placement="top"> + <label>{{ formula.label }}()</label> + </el-tooltip> + <el-input type="textarea" autosi:autosize="{ minRows: 2, maxRows: 4}" ze placeholder="璇疯緭鍏ュ唴瀹�" + v-model="configForm.formula" @change="evalResult"> + </el-input> + </template> + </el-form-item> + </div> + </el-form> + <span slot="footer" class="dialog-footer"> + <el-row> + <el-button @click="closeForm">鍙� 娑�</el-button> + <el-button type="primary" @click="submitForm3" :loading="upLoad3">纭� 瀹�</el-button> + </el-row> + </span> + </el-dialog> + <el-dialog title="鏁伴噰閰嶇疆" :visible.sync="dialogVisible4" width="400px"> + <div class="search_thing" style="margin-bottom: 14px;"> + <div class="search_label"> + <span style="color:red;margin-right: 4px;">*</span>IP锛� + </div> + <el-input size="small" placeholder="璇疯緭鍏�" clearable v-model="configForm.ip"></el-input> + </div> + <div class="search_thing" style="margin-bottom: 14px;"> + <div class="search_label"> + <span style="color:red;margin-right: 4px;">*</span>閲囬泦鍦板潃锛� + </div> + <el-input size="small" placeholder="璇疯緭鍏�" clearable v-model="configForm.collectUrl"></el-input> + </div> + <div class="search_thing" style="margin-bottom: 14px;"> + <div class="search_label">鍌ㄥ瓨鍦板潃锛�</div> + <el-input size="small" placeholder="璇疯緭鍏�" clearable v-model="configForm.storageUrl"></el-input> + </div> + <div class="search_thing" style="margin-bottom: 14px;"> + <div class="search_label"> + <span style="color:red;margin-right: 4px;">*</span>鏂囦欢鍚庣紑锛� + </div> + <el-select v-model="configForm.fileType" size="small" placeholder="璇烽�夋嫨" style="width: 100%;"> + <el-option v-for="item in fileTypeOptions" :key="item.value" :label="item.label" :value="item.value"> + </el-option> + </el-select> + </div> + <div class="search_thing" style="margin-bottom: 14px;"> + <div class="search_label">濮旀墭瀛楁锛�</div> + <el-input size="small" placeholder="璇疯緭鍏�" clearable v-model="configForm.entrustCode"></el-input> + </div> + <div class="search_thing" style="margin-bottom: 14px;"> + <div class="search_label">鏍峰搧瀛楁锛�</div> + <el-input size="small" placeholder="璇疯緭鍏�" clearable v-model="configForm.sampleCode"></el-input> + </div> + <div class="search_thing" style="margin-bottom: 14px;"> + <div class="search_label">鏂囦欢鍚嶇О锛�</div> + <el-input size="small" placeholder="璇疯緭鍏�" clearable v-model="configForm.dbFileName"></el-input> + </div> + <span slot="footer" class="dialog-footer"> + <el-row> + <el-button @click="dialogVisible4 = false">鍙� 娑�</el-button> + <el-button type="primary" @click="submitForm4" :loading="upLoad4">纭� 瀹�</el-button> + </el-row> + </span> + </el-dialog> </div> </template> @@ -16,24 +158,600 @@ name: "dataAcquisitionConfig", // import 寮曞叆鐨勭粍浠堕渶瑕佹敞鍏ュ埌瀵硅薄涓墠鑳戒娇鐢� components: {}, + props: { + deviceId: { + type: Number, + default: () => [] + } + }, + mounted() { + this.init(); + }, data() { // 杩欓噷瀛樻斁鏁版嵁 - return {} + return { + formulas: [ + { + label: "MAX", + content: "姹傚弬鏁版渶澶у�硷紝鍙傛暟涓暟鏈�灏戜袱涓紝濡傦細MAX(A1,B2)" + }, + { + label: "MIN", + content: "姹傚弬鏁版渶灏忓�硷紝鍙傛暟涓暟鏈�灏戜袱涓紝濡傦細MIN(A1,B2)" + }, + { + label: "SUM", + content: "姹傚拰锛屽弬鏁颁釜鏁版渶灏戜袱涓紝濡傦細SUM(A1,B2)" + }, + { + label: "ABS", + content: "姹傜粷瀵瑰�硷紝鍙傛暟涓暟鏈�灏戜竴涓紝濡傦細ABS(A1)" + }, + { + label: "AVERAGE", + content: "姹傚钩鍧囧�硷紝鍙傛暟涓暟鏈�灏戜袱涓釜锛屽锛欰VERAGE(A1,B2)" + }, + { + label: "MEDIAN", + content: "姹備腑鍊硷紝鍙傛暟涓暟鏈�灏戜袱涓釜锛屽锛歁EDIAN(A1,B2)" + }, + ], + dialogVisible4: false, + tableList: [], + page: { + current: 1, + size: 20 + }, + dialogVisible3: false, + configForm: { + formula: "", + collectUrl: "", + storageUrl: "", + entrustCode: "", + sampleCode: "", + dbFileName: "" + }, + domains: [ + { + referx: "", + refery: "", + x: "", + y: "" + } + ], + upLoad3: false, + upLoad4: false, + fileTypeOptions: [ + { label: "csv", value: ".csv" }, + { label: "db", value: ".db" }, + { label: "mdb", value: ".mdb" }, + { label: "word", value: ".docx" }, + { label: "excel", value: ".xlsx" }, + { label: "txt", value: ".txt" }, + { label: "png", value: ".png" } + ], + spanList: [], + specialSpanList: [], + spanConfig: { + special: { + main: "inspectionItemSubclass", + rows: [ + { + name: "deviceName", + index: 1 + }, + { + name: "fileType", + index: 2 + }, + { + name: "collectUrl", + index: 3 + }, + { + name: "storageUrl", + index: 4 + }, + { + name: "ip", + index: 5 + }, + { + name: "inspectionItem", + index: 6 + }, + { + name: "inspectionItemSubclass", + index: 7 + }, + { + name: "formula", + index: 13 + }, + { + name: "section", + index: 14 + } + ] + } + }, + deleteList: [] + }; }, // 鏂规硶闆嗗悎 - methods: {}, -} + methods: { + getIndexWithAlphabet(index) { + const alphabet = 'ABCDEFGHIJKLMNOPQRSTUVWXYZ'; + const letterIndex = index % 26; + return alphabet.charAt(letterIndex) + (index + 1); + }, + rowspan(spanArr, position, spanName) { + this.tableList.forEach((item, index) => { + if (index === 0) { + spanArr.push(1); + position = 0; + } else { + if ( + this.tableList[index][spanName] === + this.tableList[index - 1][spanName] + ) { + spanArr[position] += 1; + spanArr.push(0); + } else { + spanArr.push(1); + position = index; + } + } + }); + }, + spanMethod({ row, column, rowIndex, columnIndex }) { + // 涓�鑸殑鍚堝苟琛� + if ( + this.spanConfig != undefined && + this.spanConfig.rows && + this.spanConfig.rows.length > 0 + ) { + let i = null; + let obj = this.spanConfig.rows.find((item, index) => { + i = index; + return item.index == columnIndex; + }); + if (obj) { + const _row = this.spanList[i].arr[rowIndex]; + const _col = _row > 0 ? 1 : 0; + return { + rowspan: _row, + colspan: _col + }; + } + } + // 鐗规畩鐨勫悎骞惰 + if ( + this.spanConfig != undefined && + this.spanConfig.special && + this.spanConfig.special.main && + this.spanConfig.special.rows && + this.spanConfig.special.rows.length > 0 + ) { + let i = null; + let obj = this.spanConfig.special.rows.find((item, index) => { + i = index; + return item.index == columnIndex; + }); + if (obj) { + const _row = this.specialSpanList[i].arr[rowIndex]; + const _col = _row > 0 ? 1 : 0; + return { + rowspan: _row, + colspan: _col + }; + } + } + }, + fileConfiguration() { + this.dialogVisible4 = true; + if (this.tableList[0]) { + this.$set(this.configForm, "fileType", this.tableList[0].fileType); + this.$set(this.configForm, "collectUrl", this.tableList[0].collectUrl); + this.$set(this.configForm, "storageUrl", this.tableList[0].storageUrl); + this.$set(this.configForm, "ip", this.tableList[0].ip); + this.$set( + this.configForm, + "entrustCode", + this.tableList[0].entrustCode + ); + this.$set( + this.configForm, + "sampleCode", + this.tableList[0].sampleCode + ); + this.$set( + this.configForm, + "dbFileName", + this.tableList[0].dbFileName + ); + } + }, + init() { + this.$axios + .get( + this.$api.deviceScope.queryDataAcquisitionConfiguration + + "?deviceId=" + + this.deviceId + + "&isDevice=" + + false + ) + .then(res => { + this.tableList = res.data; + this.tableList.forEach(i => { + let isIncludes = false + if (i.formula && i.formula != "") { + this.formulas.forEach(j => { + if (i.formula.includes(j.label)) { + isIncludes = true + } + }) + } + if (!isIncludes && i.formula) { + i.formula = i.formula.slice(1, -1) + } + i.sample = i.sample + .replace(/"/g, "") + .replace(/],/g, "锛�") + .replace(/\[/g, "") + .replace(/]/g, ""); + }); + if (this.tableList[0]) { + this.$set(this.configForm, "fileType", this.tableList[0].fileType); + this.$set( + this.configForm, + "collectUrl", + this.tableList[0].collectUrl + ); + this.$set( + this.configForm, + "storageUrl", + this.tableList[0].storageUrl + ); + this.$set(this.configForm, "ip", this.tableList[0].ip); + this.$set( + this.configForm, + "entrustCode", + this.tableList[0].entrustCode + ); + this.$set( + this.configForm, + "sampleCode", + this.tableList[0].sampleCode + ); + this.$set( + this.configForm, + "dbFileName", + this.tableList[0].dbFileName + ); + } + // 涓�鑸殑鍚堝苟琛� + if ( + this.spanConfig != undefined && + this.spanConfig.rows && + this.spanConfig.rows.length > 0 + ) { + this.spanList = []; + this.spanConfig.rows.forEach((item, index) => { + this.spanList.push({ + arr: [], + position: 0 + }); + this.rowspan( + this.spanList[index].arr, + this.spanList[index].position, + item.name + ); + }); + } + // 鐗规畩鐨勫悎骞惰 + if ( + this.spanConfig != undefined && + this.spanConfig.special && + this.spanConfig.special.main && + this.spanConfig.special.rows && + this.spanConfig.special.rows.length > 0 + ) { + this.specialSpanList = []; + this.spanConfig.special.rows.forEach((item, index) => { + this.specialSpanList.push({ + arr: [], + position: 0 + }); + this.rowspan( + this.specialSpanList[index].arr, + this.specialSpanList[index].position, + this.spanConfig.special.main + ); + }); + } + }); + }, + submitForm4() { + const obj = Object.assign({ + deviceId: this.deviceId, + fileType: this.configForm.fileType, + collectUrl: this.configForm.collectUrl, + storageUrl: this.configForm.storageUrl, + ip: this.configForm.ip, + isDevice: true, + entrustCode: this.configForm.entrustCode, + sampleCode: this.configForm.sampleCode, + dbFileName: this.configForm.dbFileName + }); + this.upLoad4 = true; + this.$axios + .post( + this.$api.deviceScope.saveDataAcquisitionConfiguration + + "?deviceId=" + + this.deviceId, + obj, + { + headers: { + "Content-Type": "application/json" + } + } + ) + .then(res => { + if (res.code == 200) { + // this.tableList = res.data; + this.dialogVisible4 = false; + this.init(); + this.$message.success("鎿嶄綔鎴愬姛"); + } + this.upLoad4 = false; + }) + .catch(err => { + this.upLoad4 = false; + }); + }, + dataConfig(row) { + this.configForm = { + deviceId: row.deviceId, + inspectionItem: row.inspectionItem.trim(), + inspectionItemSubclass: row.inspectionItemSubclass, + structureItemParameterId: row.structureItemParameterId + }; + this.dialogVisible3 = true; + this.$axios + .get( + this.$api.deviceScope.queryDataAcquisitionConfiguration + + "?deviceId=" + + this.deviceId + + "&inspectionItem=" + + row.inspectionItem.trim() + + "&isDevice=" + + true + + "&inspectionItemSubclass=" + + row.inspectionItemSubclass.trim() + ) + .then(res => { + const data = res.data; + if (data[0]) { + this.domains.splice(0, 1); + let formula = data[0].formula + let isIncludes = false + if (formula && formula != "") { + for (let key in this.formulas) { + if (formula.includes(this.formulas[key].label)) { + isIncludes = true + } + } + } + if (!isIncludes && formula) { + let formulaValue = formula.slice(1, -1) + this.$set(this.configForm, "formula", formulaValue); + } else { + this.$set(this.configForm, "formula", data[0].formula); + } + data.forEach(i => { + this.domains.push({ + referx: i.referx, + refery: i.refery, + x: i.x, + y: i.y, + id: i.id + }); + }); + } + }); + }, + submitForm3() { + this.$refs.configForm.validate(valid => { + // 琛ㄥ崟鏍¢獙 + if (valid) { + this.domains.forEach(item => { + const isEmpty = Object.values(item).every(val => val === ""); + if (isEmpty) { + this.$message.error("璇峰~鍐欏弬鐓ф暟鎹�"); + } + }); + this.domains.forEach((i, index) => { + let isIncludes = false + if (this.configForm.formula && this.configForm.formula !== "") { + for (let formula in this.formulas) { + if (this.configForm.formula.includes(this.formulas[formula].label)) { + isIncludes = true + } + } + } + if (isIncludes === false && this.configForm.formula !== "") { + i.formula = "(" + this.configForm.formula + ")"; + } else { + i.formula = this.configForm.formula; + } + i.deviceId = this.deviceId; + i.inspectionItem = this.configForm.inspectionItem; + i.inspectionItemSubclass = this.configForm.inspectionItemSubclass; + i.structureItemParameterId = this.configForm.structureItemParameterId; + i.serialNumber = this.getIndexWithAlphabet(index) + }); + this.$axios + .post( + this.$api.deviceScope.saveDataAcquisitionConfiguration + + "?deviceId=" + + this.deviceId, + { dataConfigList: this.domains, isDevice: false }, + { + headers: { + "Content-Type": "application/json" + } + } + ) + .then(res => { + this.dialogVisible3 = false; + this.domains = [ + { + referx: "", + refery: "", + x: "", + y: "", + id: "" + } + ]; + if (this.deleteList.length > 0) { + this.$axios + .delete( + this.$api.deviceScope.deleteDataAcquisitionConfiguration + + "?ids=" + + this.deleteList.join() + ) + .then(res => { + if (res.code == 200) { + this.init(); + } + }); + } + this.init(); + this.$message.success("娣诲姞鎴愬姛"); + }); + } else { + return false; + } + }); + }, + removeDomain(item) { + // 鍒犻櫎鍏紡formItem + const index = this.domains.indexOf(item); + if (index !== -1 && this.domains.length > 1) { + if (item.id) { + this.deleteList.push(item.id); + this.domains.splice(index, 1); + } else { + this.domains.splice(index, 1); + } + } else { + this.$message.error("涓嶅厑璁稿垹闄ゆ渶鍚庝竴鏉℃暟鎹紒"); + } + }, + addDomain() { + // 娣诲姞鍏紡formItem + this.domains.push({ + referx: "", + refery: "", + x: "", + y: "", + id: "" + }); + }, + evalResult(val) { + this.configForm.formula = val; + // 鏍规嵁鍏紡璁$畻鍑虹粨鏋� + }, + sizeChange(val) { + this.page.size = val; + }, + currentChange(val) { + this.page.current = val; + }, + closeForm() { + this.deleteList = []; + this.domains = [ + { + referx: "", + refery: "", + x: "", + y: "", + id: "" + } + ]; + this.dialogVisible3 = false; + this.$refs.configForm.resetFields(); + } + } +}; </script> <style scoped> +.itemFomItem { + margin-left: 20px; +} + +.search_thing { + width: 350px; + display: flex; + align-items: center; +} + +.search_label { + width: 110px; + + font-size: 14px; + text-align: right; +} + .data-acquisition-config { width: 100%; height: 100%; overflow-y: auto; - //overflow-x: hidden; + .title { height: 60px; line-height: 60px; } } + +.page { + width: 100%; + height: 30px; + text-align: right; + margin-top: 10px; +} + +.table { + margin-top: 10px; + background-color: #fff; + width: calc(100% - 40px); + height: calc(100% - 60px - 80px - 10px - 40px); + padding: 20px; +} + +.fomItem1 { + display: flex; + height: 74px; +} + +.fomItem2 { + display: flex; + width: 100%; +} + +.fomItemInput { + width: 180px; + margin-right: 6px; +} + +.fomItemInput1 { + width: 100%; + margin-right: 6px; +} + +>>>.el-form-item__label { + padding-bottom: 0 !important; +} </style> -- Gitblit v1.9.3