重构
This commit is contained in:
@ -3,7 +3,10 @@
|
||||
<div class="header-row">
|
||||
<div class="title-block">
|
||||
<div class="page-title">单站监控项目点位配置</div>
|
||||
<div class="page-desc">站点：{{ siteName || siteId || '-' }}</div>
|
||||
<div class="page-desc">
|
||||
<span class="site-label">站点：</span>
|
||||
<span>{{ siteName || siteId || '-' }}</span>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<el-button @click="goBack">返回</el-button>
|
||||
@ -34,15 +37,42 @@
|
||||
<el-table-column prop="section" label="分组" min-width="180" />
|
||||
<el-table-column prop="name" label="页面展示名称" min-width="280" />
|
||||
<el-table-column prop="field" label="字段名" min-width="260" />
|
||||
<el-table-column label="点位" min-width="420">
|
||||
<el-table-column label="点位" min-width="300">
|
||||
<template slot-scope="scope">
|
||||
<el-input
|
||||
v-model.trim="scope.row.point"
|
||||
placeholder="请输入点位"
|
||||
clearable
|
||||
class="short-input"
|
||||
/>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="固定展示值" min-width="300">
|
||||
<template slot-scope="scope">
|
||||
<el-input
|
||||
v-model.trim="scope.row.fixedValue"
|
||||
placeholder="请输入固定展示值"
|
||||
clearable
|
||||
class="short-input"
|
||||
/>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="固定展示" width="120" align="center">
|
||||
<template slot-scope="scope">
|
||||
<el-checkbox v-model="scope.row.useFixedDisplay" :true-label="1" :false-label="0" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" width="120" fixed="right">
|
||||
<template slot-scope="scope">
|
||||
<el-button
|
||||
type="text"
|
||||
size="small"
|
||||
@click="handleDeleteItem(scope.$index, topMenu.items)"
|
||||
>
|
||||
删除
|
||||
</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
||||
<el-tabs
|
||||
@ -61,15 +91,42 @@
|
||||
<el-table-column prop="section" label="分组" min-width="180" />
|
||||
<el-table-column prop="name" label="页面展示名称" min-width="280" />
|
||||
<el-table-column prop="field" label="字段名" min-width="260" />
|
||||
<el-table-column label="点位" min-width="420">
|
||||
<el-table-column label="点位" min-width="300">
|
||||
<template slot-scope="scope">
|
||||
<el-input
|
||||
v-model.trim="scope.row.point"
|
||||
placeholder="请输入点位"
|
||||
clearable
|
||||
class="short-input"
|
||||
/>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="固定展示值" min-width="300">
|
||||
<template slot-scope="scope">
|
||||
<el-input
|
||||
v-model.trim="scope.row.fixedValue"
|
||||
placeholder="请输入固定展示值"
|
||||
clearable
|
||||
class="short-input"
|
||||
/>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="固定展示" width="120" align="center">
|
||||
<template slot-scope="scope">
|
||||
<el-checkbox v-model="scope.row.useFixedDisplay" :true-label="1" :false-label="0" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" width="120" fixed="right">
|
||||
<template slot-scope="scope">
|
||||
<el-button
|
||||
type="text"
|
||||
size="small"
|
||||
@click="handleDeleteItem(scope.$index, child.items)"
|
||||
>
|
||||
删除
|
||||
</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</el-tab-pane>
|
||||
</el-tabs>
|
||||
@ -85,17 +142,25 @@ export default {
|
||||
name: 'MonitorPointMapping',
|
||||
data() {
|
||||
return {
|
||||
siteId: '',
|
||||
siteName: '',
|
||||
activeTopMenu: 'HOME',
|
||||
activeChildMap: {},
|
||||
topMenuList: []
|
||||
topMenuList: [],
|
||||
deletedFieldCodes: []
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
siteId() {
|
||||
return this.$route.query.siteId || ''
|
||||
},
|
||||
siteName() {
|
||||
return this.$route.query.siteName || ''
|
||||
watch: {
|
||||
'$route.query.siteId': {
|
||||
immediate: false,
|
||||
async handler(newSiteId) {
|
||||
if (newSiteId === this.siteId) {
|
||||
return
|
||||
}
|
||||
this.siteId = newSiteId || ''
|
||||
this.siteName = this.$route.query.siteName || this.siteId
|
||||
await this.initMenuStructure()
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
@ -105,6 +170,7 @@ export default {
|
||||
async initMenuStructure() {
|
||||
if (!this.siteId) {
|
||||
this.topMenuList = []
|
||||
this.deletedFieldCodes = []
|
||||
return
|
||||
}
|
||||
const response = await getSingleMonitorProjectPointMapping(this.siteId)
|
||||
@ -131,7 +197,9 @@ export default {
|
||||
section: row.sectionName || '-',
|
||||
name: row.fieldName || '-',
|
||||
field: row.fieldCode || '',
|
||||
point: row.dataPoint || ''
|
||||
point: row.dataPoint || '',
|
||||
fixedValue: row.fixedDataPoint || '',
|
||||
useFixedDisplay: row.useFixedDisplay === 1 ? 1 : 0
|
||||
}
|
||||
const topItem = topMap.get(topKey)
|
||||
const isTopDirect = moduleCode === menuCode || moduleCode === 'HOME'
|
||||
@ -152,6 +220,7 @@ export default {
|
||||
const firstTop = this.topMenuList[0]
|
||||
this.activeTopMenu = firstTop ? firstTop.code : 'HOME'
|
||||
this.activeChildMap = {}
|
||||
this.deletedFieldCodes = []
|
||||
this.topMenuList.forEach(top => {
|
||||
if (top.children && top.children.length > 0) {
|
||||
this.$set(this.activeChildMap, top.code, top.children[0].code)
|
||||
@ -168,6 +237,23 @@ export default {
|
||||
})
|
||||
return rows
|
||||
},
|
||||
handleDeleteItem(index, list) {
|
||||
if (!Array.isArray(list) || index < 0 || index >= list.length) {
|
||||
return
|
||||
}
|
||||
this.$confirm('是否确认删除该条明细记录？删除后需点击“保存”才会生效。', '提示', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning'
|
||||
}).then(() => {
|
||||
const fieldCode = list[index] && list[index].field
|
||||
if (fieldCode && !this.deletedFieldCodes.includes(fieldCode)) {
|
||||
this.deletedFieldCodes.push(fieldCode)
|
||||
}
|
||||
list.splice(index, 1)
|
||||
this.$message.success('已删除该条明细记录')
|
||||
}).catch(() => {})
|
||||
},
|
||||
async saveData() {
|
||||
if (!this.siteId) {
|
||||
this.$message.warning('缺少站点ID')
|
||||
@ -175,13 +261,29 @@ export default {
|
||||
}
|
||||
const mappings = this.getAllMappingRows()
|
||||
.filter(item => item.field)
|
||||
.map(item => ({ fieldCode: item.field, dataPoint: item.point || '' }))
|
||||
await saveSingleMonitorProjectPointMapping({ siteId: this.siteId, mappings })
|
||||
this.$message.success('保存成功')
|
||||
.map(item => ({
|
||||
fieldCode: item.field,
|
||||
dataPoint: item.point || '',
|
||||
fixedDataPoint: item.fixedValue || '',
|
||||
useFixedDisplay: item.useFixedDisplay === 1 ? 1 : 0
|
||||
}))
|
||||
const response = await saveSingleMonitorProjectPointMapping({
|
||||
siteId: this.siteId,
|
||||
mappings,
|
||||
deletedFieldCodes: this.deletedFieldCodes
|
||||
})
|
||||
const affectedRows = Number(response?.data || 0)
|
||||
if (affectedRows > 0) {
|
||||
this.$message.success(`保存成功，已写入 ${affectedRows} 条`)
|
||||
} else {
|
||||
this.$message.warning('保存完成，但写入 0 条，请检查字段编码和点位值是否有效')
|
||||
}
|
||||
await this.initMenuStructure()
|
||||
}
|
||||
},
|
||||
async mounted() {
|
||||
this.siteId = this.$route.query.siteId || ''
|
||||
this.siteName = this.$route.query.siteName || this.siteId
|
||||
await this.initMenuStructure()
|
||||
}
|
||||
}
|
||||
@ -209,6 +311,16 @@ export default {
|
||||
margin-top: 6px;
|
||||
font-size: 13px;
|
||||
color: #909399;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.site-label {
|
||||
margin-right: 8px;
|
||||
}
|
||||
|
||||
.short-input {
|
||||
width: 220px;
|
||||
}
|
||||
|
||||
.child-menu-tabs {
|
||||
|
||||
Reference in New Issue
Block a user