@@ -4,17 +4,18 @@ | |||||
* @Author: fzq | * @Author: fzq | ||||
* @Date: 2022-11-25 09:51:46 | * @Date: 2022-11-25 09:51:46 | ||||
* @LastEditors: fzq | * @LastEditors: fzq | ||||
* @LastEditTime: 2023-02-08 17:16:47 | |||||
* @LastEditTime: 2023-02-09 10:17:22 | |||||
--> | --> | ||||
<template> | <template> | ||||
<!-- 数字代表多级表头最小列宽 --> | <!-- 数字代表多级表头最小列宽 --> | ||||
<!-- :width="opt.width || null" --> | <!-- :width="opt.width || null" --> | ||||
<!-- :width="flexColumnWidth(opt.prop || null)" --> | <!-- :width="flexColumnWidth(opt.prop || null)" --> | ||||
<!-- header-align="center" align="center" --> | <!-- header-align="center" align="center" --> | ||||
<!-- :min-width="opt.minWidth || null" --> | |||||
<el-table-column | <el-table-column | ||||
:label="opt.label ? opt.label : opt.name" | :label="opt.label ? opt.label : opt.name" | ||||
:prop="opt.prop || null" | :prop="opt.prop || null" | ||||
:min-width="opt.minWidth || null" | |||||
:min-width="[$route.fullPath == '/monitoring-realtimeQualityInspection' ? 170 : (opt.minWidth || null)]" | |||||
:fixed="opt.fixed || null" | :fixed="opt.fixed || null" | ||||
:show-overflow-tooltip="opt.showOverflowTooltip || false" | :show-overflow-tooltip="opt.showOverflowTooltip || false" | ||||
filter-placement="top" | filter-placement="top" | ||||
@@ -56,6 +56,7 @@ | |||||
v-bind="head.more"></el-table-column> | v-bind="head.more"></el-table-column> | ||||
<!-- 普通的表头 --> | <!-- 普通的表头 --> | ||||
<!-- :align="head.align || null" 表头居中 --> | <!-- :align="head.align || null" 表头居中 --> | ||||
<!-- :min-width="head.minWidth || null" --> | |||||
<el-table-column | <el-table-column | ||||
v-else | v-else | ||||
:key="idx + 'else'" | :key="idx + 'else'" | ||||
@@ -78,7 +79,7 @@ | |||||
<!-- 多级表头 --> | <!-- 多级表头 --> | ||||
<template v-if="!head.prop && head.children"> | <template v-if="!head.prop && head.children"> | ||||
<TableHead v-for="(subhead, subindex) in head.children" :key="'subhead-' + idx + '-subindex-' + subindex" :opt="subhead" fixed/> | |||||
<TableHead v-for="(subhead, subindex) in head.children" :key="'subhead-' + idx + '-subindex-' + subindex" :opt="subhead"/> | |||||
</template> | </template> | ||||
</el-table-column> | </el-table-column> | ||||
</template> | </template> | ||||
@@ -175,7 +176,7 @@ export default { | |||||
}, | }, | ||||
created() { | created() { | ||||
// console.log(this.selectedBox) | // console.log(this.selectedBox) | ||||
console.log(this.tableHeadConfigs) | |||||
// console.log(this.tableHeadConfigs) | |||||
}, | }, | ||||
methods: { | methods: { | ||||
handleSubEmitData(payload) { | handleSubEmitData(payload) { | ||||
@@ -21,7 +21,7 @@ | |||||
</el-form> | </el-form> | ||||
<!-- <base-table :page="pageIndex" :size="pageSize" :data="dataList" :table-head-configs="tableConfigs" :max-height="calcMaxHeight(8)" @operate-event="handleOperations" @refreshDataList="getDataList" /> --> | <!-- <base-table :page="pageIndex" :size="pageSize" :data="dataList" :table-head-configs="tableConfigs" :max-height="calcMaxHeight(8)" @operate-event="handleOperations" @refreshDataList="getDataList" /> --> | ||||
<base-table v-for="i in (0,dataLength)" :key="i.name" :data="dataList[i]" :table-head-configs="tableConfigs[i]" :max-height="calcMaxHeight(8)" /> | |||||
<base-table :data="dataList" :table-head-configs="tableConfigs" :max-height="calcMaxHeight(8)" /> | |||||
<!-- <base-table :data="dataList" :table-head-configs="tableConfigs" :max-height="calcMaxHeight(8)" /> --> | <!-- <base-table :data="dataList" :table-head-configs="tableConfigs" :max-height="calcMaxHeight(8)" /> --> | ||||
</div> | </div> | ||||
</template> | </template> | ||||
@@ -75,34 +75,31 @@ export default { | |||||
url: this.$http.adornUrl(`/monitoring/equipmentValueMonitor/runLog/${this.$route.params.id}`), | url: this.$http.adornUrl(`/monitoring/equipmentValueMonitor/runLog/${this.$route.params.id}`), | ||||
method: 'get' | method: 'get' | ||||
}).then(({ data: res }) => { | }).then(({ data: res }) => { | ||||
// console.log('res', res) | |||||
console.log('/monitoring/equipmentValueMonitor/runLog/', res) | |||||
this.equipmentName = res.data[0].data[0].equName | this.equipmentName = res.data[0].data[0].equName | ||||
this.equipmentCode = res.data[0].data[0].equCode | this.equipmentCode = res.data[0].data[0].equCode | ||||
this.dataLength = res.data.length | this.dataLength = res.data.length | ||||
for (let i = 0; i < this.dataLength; i++) { | |||||
if ( | if ( | ||||
res && | res && | ||||
res.code === 0 && | res.code === 0 && | ||||
res.data && | res.data && | ||||
res.data.length > 0 && | res.data.length > 0 && | ||||
res.data[i].nameData && | |||||
res.data[i].nameData.length > 0 && | |||||
res.data[i].data && | |||||
res.data[i].data.length > 0 | |||||
res.data[0].nameData && | |||||
res.data[0].nameData.length > 0 && | |||||
res.data[0].data && | |||||
res.data[0].data.length > 0 | |||||
) { | ) { | ||||
// console.log(this.equipmentName) | // console.log(this.equipmentName) | ||||
this.setTableProps(res.data[i].nameData) | |||||
this.setTableData(res.data[i].data) | |||||
this.setTableProps(res.data[0].nameData) | |||||
this.setTableData(res.data[0].data) | |||||
} else { | } else { | ||||
this.dataList[i] = [] | |||||
this.dataList = [] | |||||
} | } | ||||
this.dataListLoading = false | this.dataListLoading = false | ||||
} | |||||
}) | }) | ||||
}, | }, | ||||
setTableProps(nameData) { | setTableProps(nameData) { | ||||
for (let i = 0; i < this.dataLength; i++) { | |||||
this.tableConfigs[i] = [ | |||||
this.tableConfigs = [ | |||||
{ | { | ||||
type: 'index', | type: 'index', | ||||
name: i18n.t('index') | name: i18n.t('index') | ||||
@@ -116,12 +113,10 @@ export default { | |||||
// }) | // }) | ||||
...Array.from(new Set(nameData.map((item) => item.name))).map((name) => ({ prop: name, name })) | ...Array.from(new Set(nameData.map((item) => item.name))).map((name) => ({ prop: name, name })) | ||||
] | ] | ||||
console.log(this.tableConfigs[i]); | |||||
} | |||||
// console.log(this.tableConfigs[i]); | |||||
}, | }, | ||||
setTableData(data) { | setTableData(data) { | ||||
for (let i = 0; i < this.dataLength; i++) { | |||||
this.dataList[i] = data.map((item) => { | |||||
this.dataList = data.map((item) => { | |||||
const rowItem = pick(item, ['time', 'plcCode', 'equName', 'equCode']) | const rowItem = pick(item, ['time', 'plcCode', 'equName', 'equCode']) | ||||
if (item.data && item.data.length > 0) { | if (item.data && item.data.length > 0) { | ||||
item.data.forEach((param) => { | item.data.forEach((param) => { | ||||
@@ -133,5 +128,4 @@ export default { | |||||
} | } | ||||
} | } | ||||
} | } | ||||
} | |||||
</script> | </script> |
@@ -2,14 +2,14 @@ | |||||
* @Author: lb | * @Author: lb | ||||
* @Date: 2022-06-22 14:00:17 | * @Date: 2022-06-22 14:00:17 | ||||
* @LastEditors: fzq | * @LastEditors: fzq | ||||
* @LastEditTime: 2023-02-08 16:50:05 | |||||
* @LastEditTime: 2023-02-09 09:36:38 | |||||
* @Description: 设备生产实时数据 | * @Description: 设备生产实时数据 | ||||
--> | --> | ||||
<template> | <template> | ||||
<div> | <div> | ||||
<div class="app-container"> | <div class="app-container"> | ||||
<small-title :size="'md'">{{ $t('realtime.eq') }}</small-title> | <small-title :size="'md'">{{ $t('realtime.eq') }}</small-title> | ||||
<base-table v-if="loadTable" :table-head-configs="tableProps" :data="tableData.length ? tableData : []" :span-method="spanMethod" align= "center"/> | |||||
<base-table v-if="loadTable" :table-head-configs="tableProps" :data="tableData.length ? tableData : []" :span-method="spanMethod"/> | |||||
</div> | </div> | ||||
</div> | </div> | ||||
</template> | </template> | ||||
@@ -59,7 +59,7 @@ export default { | |||||
} | } | ||||
}) | }) | ||||
}, 1000 * 60 * 5) | }, 1000 * 60 * 5) | ||||
console.log(this.tableProps) | |||||
// console.log(this.tableProps) | |||||
}, | }, | ||||
// beforeDestroy() { | // beforeDestroy() { | ||||
// console.log('before destroyed...') | // console.log('before destroyed...') | ||||
@@ -2,7 +2,7 @@ | |||||
* @Author: lb | * @Author: lb | ||||
* @Date: 2022-06-22 14:00:17 | * @Date: 2022-06-22 14:00:17 | ||||
* @LastEditors: fzq | * @LastEditors: fzq | ||||
* @LastEditTime: 2023-02-07 16:23:23 | |||||
* @LastEditTime: 2023-02-09 09:53:57 | |||||
* @Description: 产线生产实时数据 | * @Description: 产线生产实时数据 | ||||
--> | --> | ||||
<template> | <template> | ||||
@@ -38,20 +38,26 @@ export default { | |||||
}, | }, | ||||
mounted() { | mounted() { | ||||
console.log('this.$route', this.$route) | |||||
// console.log('this.$route', this.$route) | |||||
this.clearData() | this.clearData() | ||||
// this.fetchList().then(({ data: res }) => { | |||||
// // console.log('fetchlist:', res) | |||||
// this.testData = res | |||||
// this.handleData() | |||||
// if (res.code === 200 || this.$route.fullPath !== '/monitoring-realtimeProductLine') { | |||||
// // 获取数据显示成功后,关闭loading | |||||
// loading.close() | |||||
// } else { | |||||
// this.$message.error(this.$t('err')) | |||||
// } | |||||
// }) | |||||
this.fetchList().then(({ data: res }) => { | |||||
this.testData = res | |||||
this.handleData() | |||||
console.log('res', res) | |||||
let loading = this.$loading({ | |||||
lock: true, //lock的修改符--默认是false | |||||
text: this.$t('loading'), //显示在加载图标下方的加载文案 | |||||
background: 'rgba(0,0,0,0.8)', //遮罩层颜色 | |||||
spinner: 'el-icon-loading' //自定义加载图标类名 | |||||
}) | |||||
console.log('testData:', this.testData) | |||||
if (this.testData || this.$route.fullPath !== '/monitoring-realtimeProductLine') { | |||||
// 获取数据显示成功后,关闭loading | |||||
loading.close() | |||||
} else { | |||||
this.$message.error(this.$t('err')) | |||||
} | |||||
}) | |||||
this.intervalId = setInterval(() => { | this.intervalId = setInterval(() => { | ||||
this.$message({ | this.$message({ | ||||
message: this.$t('realtime.refresh'), | message: this.$t('realtime.refresh'), | ||||
@@ -70,15 +76,12 @@ export default { | |||||
deactivated() { | deactivated() { | ||||
if (this.intervalId) clearInterval(this.intervalId) | if (this.intervalId) clearInterval(this.intervalId) | ||||
}, | }, | ||||
created() { | |||||
// console.log('this.tableData', this.tableData) | |||||
}, | |||||
methods: { | methods: { | ||||
fetchList() { | fetchList() { | ||||
// let loading = this.$loading({ | |||||
// lock: true, //lock的修改符--默认是false | |||||
// text: this.$t('loading'), //显示在加载图标下方的加载文案 | |||||
// background: 'rgba(0,0,0,0.8)', //遮罩层颜色 | |||||
// spinner: 'el-icon-loading' //自定义加载图标类名 | |||||
// }) | |||||
return this.$http({ | return this.$http({ | ||||
url: this.$http.adornUrl('/monitoring/productionMonitoring/lineProductionRealTimeData'), | url: this.$http.adornUrl('/monitoring/productionMonitoring/lineProductionRealTimeData'), | ||||
method: 'post' | method: 'post' | ||||
@@ -3,7 +3,7 @@ | |||||
<div class="app-container"> | <div class="app-container"> | ||||
<small-title :size="'md'">{{ $t('realtime.inspect') }}</small-title> | <small-title :size="'md'">{{ $t('realtime.inspect') }}</small-title> | ||||
<!-- fixed --> | <!-- fixed --> | ||||
<base-table v-if="loadTable" :table-head-configs="tableProps" :data="tableData.length ? tableData : []"/> | |||||
<base-table v-if="loadTable" fixed: true :table-head-configs="tableProps" :data="tableData.length ? tableData : []"/> | |||||
</div> | </div> | ||||
</div> | </div> | ||||
</template> | </template> | ||||
@@ -83,7 +83,7 @@ export default { | |||||
this.initProps() | this.initProps() | ||||
// console.log('props ===> ', this.tableProps) | // console.log('props ===> ', this.tableProps) | ||||
this.initData() | this.initData() | ||||
// console.log('datas ===> ', this.tableData) | |||||
console.log('datas ===> ', this.tableData) | |||||
this.loadTable = true | this.loadTable = true | ||||
}, | }, | ||||
@@ -145,8 +145,8 @@ export default { | |||||
} | } | ||||
dynamicPropNames.push(prop) | dynamicPropNames.push(prop) | ||||
} | } | ||||
return [{ prop: 'checkType', label: i18n.t('inspect.det'), isFixed: true }, ...dynamicPropNames] | |||||
// isFixed: true | |||||
return [{ prop: 'checkType', label: i18n.t('inspect.det'), fixed: true }, ...dynamicPropNames] | |||||
} | } | ||||
} | } | ||||
} | } | ||||