From 3931e2728f618d0090f129b2665bc1285c4440c3 Mon Sep 17 00:00:00 2001 From: gaoshp <291585735@qq.com> Date: 星期日, 03 十一月 2024 17:27:32 +0800 Subject: [PATCH] update --- src/views/console/workstation/CollDialog.vue | 188 +++++++++++++++++++++++++++++++++++++--------- 1 files changed, 150 insertions(+), 38 deletions(-) diff --git a/src/views/console/workstation/CollDialog.vue b/src/views/console/workstation/CollDialog.vue index 2b6bdd5..e7e979d 100644 --- a/src/views/console/workstation/CollDialog.vue +++ b/src/views/console/workstation/CollDialog.vue @@ -1,37 +1,21 @@ <template> - <el-dialog title="鏁版嵁鐐�" v-model="visible" :width="'80%'" destroy-on-close @closed="$emit('closed')"> - <p style="margin-bottom: 14px;"> + <el-dialog title="鏁版嵁鐐�" v-model="visible" :width="'100%'" destroy-on-close @closed="$emit('closed')"> + <p style="margin-bottom: 14px;display: flex;align-items: center;"> <span style="margin-right: 8px;">绫诲瀷</span> - <el-select v-model="type" placeholder="Select" size="small" style="width: 240px" @change="changeType"> + <el-select v-model="type" placeholder="绫诲瀷" size="small" style="width: 240px" @change="changeType"> <el-option v-for="item in typeList" :key="item.id" :label="item.name" :value="item.id" /> </el-select> + <span style="margin-right: 8px;margin-left: auto;">IOT搴旂敤ID</span> + <el-input v-model="appId" placeholder="IOT搴旂敤ID" style="width: 240px"></el-input> </p> <scFormTable v-show="type" ref="table1" v-model="tabledata" stripe hideDelete :hideAdd="!type" :addTemplate="addTemplate"> - <el-table-column v-for="item in cols" :key="item.prop" :prop="item.prop" :label="item.label"> - <template #header="scope"> - <span v-show="item.isRequired" style="color: red;">*</span> - <span>{{ scope.column.label }}</span> - </template> - <template #default="scope"> - <el-select v-model="scope.row[item.prop]" placeholder="Select" size="small" - v-if="scope.row.status && item.type === 'option'"> - <el-option v-for="item in item.options" :key="item" :label="item" :value="item" /> - </el-select> - <el-switch size="small" v-model="scope.row[item.prop]" - v-else-if="scope.row.status && item.type === 'boolean'" /> - <el-input size="small" v-model="scope.row[item.prop]" placeholder="" - v-else-if="scope.row.status"></el-input> - <span v-else>{{ scope.row[item.prop] }}</span> - </template> - </el-table-column> - - <el-table-column label="鎿嶄綔" prop="state" width="200"> + <el-table-column label="鎿嶄綔" prop="state" width="200" fixed="left"> <template #default="scope"> <el-button-group> <el-button text type="primary" size="small" @click="table_edit(scope.row)">缂栬緫</el-button> - <!-- <el-button text type="primary" size="small">澶嶅埗</el-button> --> + <el-button text type="primary" size="small" @click="copy(scope.row)">澶嶅埗</el-button> <el-popconfirm width="220" title="纭畾灏嗛�夋嫨鐨勬暟鎹垹闄�" @confirm="del(scope.$index)"> <template #reference> <el-button text type="primary" size="small">鍒犻櫎</el-button> @@ -41,6 +25,34 @@ </template> </el-table-column> + <el-table-column width="200" v-for="item in cols" :key="item.prop" :prop="item.prop" :label="item.label"> + <template #header="scope"> + <span v-show="item.isRequired" style="color: red;">*</span> + <span>{{ scope.column.label }}</span> + <el-tooltip class="box-item" effect="dark" placement="top-start"> + <template #content> + <p v-html="item.describe"></p> + </template> + <el-icon v-show="item.describe"><el-icon-question-filled /></el-icon> + </el-tooltip> + + </template> + <template #default="scope"> + <el-select :disabled="!scope.row.status || (item.disabledFn && item.disabledFn(scope.row))" + v-model="scope.row[item.prop]" @change="change($event, scope.row, scope.$index, item)" + placeholder="" size="small" v-if="item.type === 'option'"> + <el-option v-for="item in item.options" :key="item.value || item" :label="(item?.label || item)" + :value="(item.value || item)" /> + </el-select> + <el-switch :disabled="!scope.row.status" size="small" v-model="scope.row[item.prop]" + v-else-if="item.type === 'boolean'" /> + <el-input size="small" v-model="scope.row[item.prop]" placeholder="" v-else-if="scope.row.status" + :disabled="(['dpLabel', 'dpName'].includes(item.prop) && 'Other' !== scope.row.dpCategory)"></el-input> + <span v-else>{{ scope.row[item.prop] }}</span> + </template> + </el-table-column> + + </scFormTable> <template #footer> <el-button @click="visible = false">鍙� 娑�</el-button> @@ -50,8 +62,11 @@ </template> <script> +import addOptions from './addOptions' export default { + name: 'CollDialog', emits: ['success', 'closed'], + mixins: [addOptions], props: { option: { type: Object @@ -72,28 +87,63 @@ status: '2' // 涓嶅瓨鍦ㄥ凡淇濆瓨 1: 姝e湪缂栬緫 2: 鏂板 }, type: '', - typeList: [] - + typeList: [], + appId: '' } }, created() { }, methods: { + change(e, row, index, { prop, options }) { + console.log(e, options) + if (prop === 'dpCategory' && e !== 'Other') { + const label = options.find(v => v.value === e).label + this.tabledata[index].dpLabel = label + this.tabledata[index].dpName = e + this.tabledata[index].paramChartType = 'distribute' + } else if (prop === 'dpCategory' && e === 'Other') { + this.tabledata[index].dpLabel = '' + this.tabledata[index].dpName = '' + } + // 鐐逛綅鍒嗙被涓洪潪鍏朵粬鏃� 杩囩▼鍙傛暟灞曠ず鏂瑰紡涓哄垎甯冨浘 + }, changeType(val) { - this.$confirm(`鍒囨崲绫诲瀷灏嗗垹闄ゆ墍鏈夊凡閰嶇疆鏁版嵁鐐筦, '鎻愮ず', { - type: 'warning' - }).then(() => { + if (this.tabledata.length > 0) { + this.$confirm(`鍒囨崲绫诲瀷灏嗗垹闄ゆ墍鏈夊凡閰嶇疆鏁版嵁鐐筦, '鎻愮ず', { + type: 'warning' + }).then(() => { + try { + this.cols = JSON.parse(this.typeList.find(v => v.id === val).dpHeadFull) + this.addOptions(this.cols) + this.tabledata = [] + } catch (error) { + this.cols = [] + } + }).catch(() => { + + }) + } else { try { this.cols = JSON.parse(this.typeList.find(v => v.id === val).dpHeadFull) - this.table = [] + this.addOptions(this.cols) + } catch (error) { this.cols = [] } - }).catch(() => { + } + console.log('default') + this.setAddTemp() + + }, + setAddTemp() { + this.cols.forEach(v => { + if (v.type === 'boolean') { + this.addTemplate[v.prop] = false + } + v.default && (this.addTemplate[v.prop] = v.default) }) - }, //鏄剧ず open(mode = 'add', params) { @@ -116,11 +166,64 @@ }) }, + // addOptions() { + // if (this.cols.filter(v => v.prop === 'isProcessParam').length === 0) { + // this.cols.unshift( + // { + // label: "杩囩▼鍙傛暟", + // prop: "isProcessParam", + // isRequired: true, + // type: 'boolean', + // } + // ) + // } + // if (this.cols.filter(v => v.prop === 'dpLabel').length === 0) { + // this.cols.unshift( + // { + // label: "鏄剧ず鍚嶇О", + // prop: "dpLabel", + // isRequired: true, + // } + // ) + // } + // if (this.cols.filter(v => v.prop === 'dpCategory').length === 0) { + // this.cols.unshift( + // { + // label: "鐐逛綅鍒嗙被", + // prop: "dpCategory", + // isRequired: true, + // type: 'option', + // options: [{ + // label: '绋嬪簭鍚�', + // value: 'ProgName' + // }, { + // label: '绋嬪簭鍐呭', + // value: 'ProgContent' + // }, { + // label: '鍒�鍏峰彿', + // value: 'ToolNo' + // }, { + // label: '鐘舵��', + // value: 'DeviceStatus' + // }, { + // label: '浜ч噺', + // value: 'Output' + // }, { + // label: '鍛婅', + // value: 'Alarm' + // }, { + // label: '鍏朵粬', + // value: 'Other' + // }] + // } + // ) + // } + // }, getList(params) { - this.$HTTP.get(`/api/blade-cps/workstation/listDatapointsByWorkstationId`, {}, { params }).then(res => { + this.$HTTP.get(`/api/smis/workstation/listDatapointsByWorkstationId`, {}, { params }).then(res => { try { this.cols = JSON.parse(res.data.dpHead) - console.log(this.cols, 'cols') + this.addOptions(this.cols) } catch (error) { this.cols = [] } @@ -133,15 +236,20 @@ this.tabledata = [] } this.type = res.data.type - + this.appId = res.data.appId + this.setAddTemp() // return res }) }, table_edit(row) { + console.log('bianji', row) row.status = '1' }, del(index) { this.tabledata.splice(index, 1) + }, + copy(row) { + this.tabledata.push(Object.assign({}, row, { status: '1' })) }, //琛ㄥ崟鎻愪氦鏂规硶 submit() { @@ -158,22 +266,26 @@ if (len != this.tabledata.length) { return this.$message.warning('鏁版嵁鐐瑰悕绉颁笉鑳介噸澶�') } - this.$HTTP.put('/api/blade-cps/workstation/saveDatapoints', { + this.$HTTP.put('/api/smis/workstation/saveDatapoints', { dpConfig: JSON.stringify(this.tabledata.map(v => { delete v.status return v })), workstationId: this.params.id, - type: this.type + type: this.type, + appId: this.appId }).then(res => { if (res.code === 200) { this.getList({ workstationId: this.params.id, }) + this.visible = false + this.$emit('success') + } else { + this.$message.error(res.msg) } }).finally(() => { - this.visible = false - this.$emit('success') + }) }, -- Gitblit v1.9.3