| | |
| | | |
| | | <scFormTable v-show="type" ref="table1" v-model="tabledata" stripe hideDelete :hideAdd="!type" |
| | | :addTemplate="addTemplate"> |
| | | <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" v-model="scope.row[item.prop]" |
| | | @change="change($event, scope.row, scope.$index, item.prop)" 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> |
| | | |
| | | <el-table-column label="操作" prop="state" width="200" fixed="right"> |
| | | <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> |
| | |
| | | |
| | | </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> |
| | |
| | | </template> |
| | | |
| | | <script> |
| | | import addOptions from './addOptions' |
| | | export default { |
| | | name: 'CollDialog', |
| | | emits: ['success', 'closed'], |
| | | mixins: [addOptions], |
| | | props: { |
| | | option: { |
| | | type: Object |
| | |
| | | |
| | | }, |
| | | methods: { |
| | | change(e, row, index, prop) { |
| | | console.log(e) |
| | | change(e, row, index, { prop, options }) { |
| | | console.log(e, options) |
| | | if (prop === 'dpCategory' && e !== 'Other') { |
| | | const label = [{ |
| | | label: '状态', |
| | | value: 'DeviceStatus' |
| | | }, { |
| | | label: '产量', |
| | | value: 'Output' |
| | | }, { |
| | | label: '告警', |
| | | value: 'Alarm' |
| | | }].find(v => v.value === e).label |
| | | 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) { |
| | | if (this.tabledata.length > 0) { |
| | |
| | | }).then(() => { |
| | | try { |
| | | this.cols = JSON.parse(this.typeList.find(v => v.id === val).dpHeadFull) |
| | | this.addOptions() |
| | | this.addOptions(this.cols) |
| | | this.tabledata = [] |
| | | } catch (error) { |
| | | this.cols = [] |
| | |
| | | } else { |
| | | try { |
| | | this.cols = JSON.parse(this.typeList.find(v => v.id === val).dpHeadFull) |
| | | this.addOptions() |
| | | this.addOptions(this.cols) |
| | | |
| | | } catch (error) { |
| | | this.cols = [] |
| | |
| | | }) |
| | | |
| | | }, |
| | | 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' |
| | | }] |
| | | } |
| | | ) |
| | | } |
| | | }, |
| | | // 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) |
| | | this.addOptions() |
| | | this.addOptions(this.cols) |
| | | } catch (error) { |
| | | this.cols = [] |
| | | } |
| | |
| | | }) |
| | | }, |
| | | table_edit(row) { |
| | | console.log('bianji', row) |
| | | row.status = '1' |
| | | }, |
| | | del(index) { |
| | |
| | | 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 |