Files
tft-fe/src/views/qualityManagement/components/processFlowDetail.vue
2023-01-03 09:33:30 +08:00

197 lines
4.2 KiB
Vue

<template>
<el-drawer title="工艺流程" :visible.sync="visible" size="70%">
<div class="box">
<base-table
:page="1"
:limit="1000"
:table-props="tableProps"
:table-data="tableData"
:max-height="tableH"
>
<method-btn
v-if="tableBtn.length"
slot="handleBtn"
:width="180"
label="操作"
:method-list="tableBtn"
@clickBtn="handleClick"
/>
</base-table>
<el-drawer
title="工艺参数"
:append-to-body="true"
:visible.sync="processParametersVisible"
size="50%"
>
<base-table
:page="1"
:limit="1000"
:table-props="tablePropsP"
:table-data="tableDataP"
:max-height="tableH"
/>
</el-drawer>
<el-drawer
title="设备参数"
:append-to-body="true"
:visible.sync="deviceParametersVisible"
size="50%"
>
<div class="box">
<base-table
:page="1"
:limit="1000"
:table-props="tablePropsD"
:table-data="tableDataD"
:max-height="tableH"
/>
</div>
</el-drawer>
</div>
</el-drawer>
</template>
<script>
import { tableHeight } from '@/utils/index'
const tableProps = [
{
prop: 'processName',
label: '工序名称',
minWidth: 120
},
{
prop: 'deviceName',
label: '设备名称',
minWidth: 120
},
{
prop: 'glassId',
label: '玻璃ID',
minWidth: 150
},
{
prop: 'deviceLaunchTime',
label: '设备上片时间',
minWidth: 160
},
{
prop: 'deviceUnloadingTime',
label: '设备下片时间',
minWidth: 160
},
{
prop: 'grindingTrayId',
label: '面磨托盘ID',
minWidth: 150
}
]
const tableBtn = [
{
type: 'processParameters',
btnName: '工艺参数'
},
{
type: 'deviceParameters',
btnName: '设备参数'
}
]
const tablePropsP = [
{
prop: 'process',
label: '工艺'
},
{
prop: 'currentValue',
label: '当前值'
}
]
const tablePropsD = [
{
prop: 'device',
label: '设备'
},
{
prop: 'status',
label: '状态'
},
{
prop: 'changeTime',
label: '变更时间'
}
]
export default {
name: 'processFlowDetail',
data() {
return {
visible: false,
tableProps,
tableData: [],
tableBtn,
tableH: tableHeight(115),
processParametersVisible: false,
deviceParametersVisible: false,
tablePropsP,
tablePropsD,
tableDataP: [
{ process: 'X切刀工作时的高度', currentValue: '20' },
{ process: 'X方向划线速度', currentValue: '6' }
],
tableDataD: [
{
device: '面研磨上片工位_取纸机器人',
status: '生产',
changeTime: '2022-04-02 00:00:00 000'
},
{
device: '面研磨上片工位_取纸机器人',
status: '生产',
changeTime: '2022-04-02 00:00:00 000'
},
{
device: '面研磨上片工位_取纸机器人',
status: '生产',
changeTime: '2022-04-02 00:00:00 000'
},
{
device: '面研磨上片工位_取纸机器人',
status: '待料',
changeTime: '2022-04-02 00:00:00 000'
}
]
}
},
methods: {
init() {
this.visible = true
window.addEventListener('resize', () => {
this.tableH = tableHeight(115)
})
for (let i = 0; i < 30; i++) {
let obj = {}
obj.processName = '1'
obj.deviceName = '设备名称' + i
obj.glassId = '玻璃ID' + i
obj.deviceLaunchTime = '2022-08-22 08:12:15'
obj.deviceUnloadingTime = '2022-08-22 08:12:15'
obj.grindingTrayId = '面磨托盘ID' + i
this.tableData.push(obj)
}
},
handleClick(val) {
console.log(val)
if (val.type === 'processParameters') {
this.processParametersVisible = true
} else if (val.type === 'deviceParameters') {
this.deviceParametersVisible = true
}
},
handleCloseProcess() {},
handleCloseDevice() {}
}
}
</script>
<style lang="scss" scoped>
.box {
padding: 0 32px;
}
</style>