1.3

src/views/qualityManagement/components/processFlowDetail.vue

@@ -0,0 +1,196 @@
+<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>