From 72cdf62fd7c98dab3138d580d390e535fc06ef47 Mon Sep 17 00:00:00 2001
From: gaoluyang <gaoluyang@rengu.cc>
Date: 星期三, 24 七月 2024 09:41:17 +0800
Subject: [PATCH] 工时统计表格样式修改
---
src/components/do/b6-device-management/b6-data-acquisition-config.vue | 508 +++++++++++++++++++++++++++++++++++++++++++++++++++++++
1 files changed, 502 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..bb598d9 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,37 +3,533 @@
<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鍦板潃"></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"></el-table-column>
+ <el-table-column prop="x" align="center" label="X"></el-table-column>
+ <el-table-column prop="refery" align="center" label="鍙傜収Y"></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" 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">
+ <!-- <div class="fomItem1"> -->
+ <!-- <el-form-item class="fomItemInput" label="妫�娴嬬殑鏂囦欢绫诲瀷:" prop="fileType">
+ <el-select v-model="configForm.fileType" placeholder="璇烽�夋嫨鏂囦欢绫诲瀷">
+ <el-option v-for="item in fileTypeOptions"
+ :key="item.value"
+ :label="item.label"
+ :value="item.value"></el-option>
+ </el-select>
+ </el-form-item>
+ <el-form-item class="fomItemInput" label="閲囬泦鍦板潃:" prop="collectUrl">
+ <el-input v-model="configForm.collectUrl"></el-input>
+ </el-form-item>
+ <el-form-item class="fomItemInput" label="鍌ㄥ瓨鍦板潃:" prop="storageUrl">
+ <el-input v-model="configForm.storageUrl"></el-input>
+ </el-form-item> -->
+ <!-- </div> -->
+ <div class="fomItem1"
+ v-for="(domain, index) in domains"
+ :key="index">
+ <el-form-item class="fomItemInput" label="鍙傜収X:">
+ <el-input v-model="domain.referx"></el-input>
+ </el-form-item>
+ <el-form-item class="fomItemInput" label="X:">
+ <el-input v-model="domain.x" onkeyup="value=value.replace(/[^-0-9]/g,'')"></el-input>
+ </el-form-item>
+ <el-form-item class="fomItemInput" label="鍙傜収Y:">
+ <el-input v-model="domain.refery"></el-input>
+ </el-form-item>
+ <el-form-item class="fomItemInput" label="Y:">
+ <el-input v-model="domain.y" onkeyup="value=value.replace(/[^-0-9]/g,'')"></el-input>
+ </el-form-item>
+ <el-form-item>
+ <el-button style="position: absolute; bottom: -65px" @click.prevent="removeDomain(domain)" size="small">鍒犻櫎</el-button>
+ </el-form-item>
+ <el-form-item>
+ <el-button @click="addDomain" size="small" type="primary" style="position: absolute; bottom: -65px;left: 62px" v-if="index === domains.length-1">鏂板鍩熷悕</el-button>
+ </el-form-item>
+ </div>
+ <div class="fomItem2">
+ <el-form-item class="fomItemInput1" label="鍏紡:">
+ <!-- <formula :returnFormula="evalResult"/> -->
+ <el-input type="textarea" autosi:autosize="{ minRows: 2, maxRows: 4}"ze placeholder="璇疯緭鍏ュ唴瀹�" v-model="configForm.formula" @change="evalResult"> </el-input>
+ </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>
+ <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>
<script>
+import formula from '../../tool/formula.vue'
export default {
name: "dataAcquisitionConfig",
// import 寮曞叆鐨勭粍浠堕渶瑕佹敞鍏ュ埌瀵硅薄涓墠鑳戒娇鐢�
- components: {},
+ components: {
+ formula
+ },
+ props: {
+ deviceId: {
+ type: Number,
+ default: () => []
+ }
+ },
+ mounted() {
+ this.init()
+ },
data() {
// 杩欓噷瀛樻斁鏁版嵁
- return {}
+ return {
+ dialogVisible4: false,
+ tableList: [],
+ page: {
+ current: 1,
+ size: 20,
+ },
+ dialogVisible3:false,
+ configForm:{
+ formula: '',
+ },
+ 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:'inspectionItemSubClass',
+ index:12
+ },
+ {
+ name:'inspectionItemSubClass',
+ index:13
+ }
+ ]
+ }
+ },
+ deleteList: []
+ }
},
// 鏂规硶闆嗗悎
- methods: {},
+ methods: {
+ 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)
+ }
+ },
+ init() {
+ this.tableList = []
+ this.$axios.get(this.$api.deviceScope.queryDataAcquisitionConfiguration + "?deviceId=" + this.deviceId + "&isDevice=" + false).then(res => {
+ this.tableList = res.data
+ 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)
+ }
+ // 涓�鑸殑鍚堝苟琛�
+ 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
+ })
+ this.upLoad4 = true
+ this.$axios.post(this.$api.deviceScope.saveDataAcquisitionConfiguration + "?deviceId=" + this.deviceId, obj, {headers: {
+ 'Content-Type': 'application/json'
+ }}).then(res => {
+ this.tableList = res.data
+ this.dialogVisible4 = false
+ this.upLoad4 = false
+ this.init()
+ this.$message.success('鎿嶄綔鎴愬姛')
+ }).catch(err => {
+ this.upLoad4 = false
+ })
+ },
+ dataConfig (row) {
+ this.configForm = {
+ deviceId: row.deviceId,
+ insProductItem: row.inspectionItemSubClass.trim()
+ }
+ this.dialogVisible3 = true
+ this.$axios.get(this.$api.deviceScope.queryDataAcquisitionConfiguration + "?deviceId=" + this.deviceId + "&insProductItem=" + row.inspectionItemSubClass.trim() + "&isDevice=" + true).then(res => {
+ const data = res.data
+ if(data[0]) {
+ this.domains.splice(0, 1)
+ 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 => {
+ if(i.x == '') {
+ i.x = null
+ }
+ if(i.y == '') {
+ i.y = null
+ }
+ i.formula = this.configForm.formula
+ i.deviceId = this.deviceId
+ i.insProductItem = this.configForm.insProductItem
+ })
+ 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>
+.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