'init'

src/views/orderManage/erpToMesData.vue

@@ -0,0 +1,237 @@
+<!--
+ * @Author: zwq
+ * @Date: 2021-06-24 15:21:19
+ * @LastEditors: Please set LastEditors
+ * @LastEditTime: 2021-07-21 16:45:26
+ * @Description:
+-->
+<template>
+  <div style="padding:10px">
+    <span>{{ $t('module.orderManage.erpToMes.erpToMesMaterial') }}</span>
+    <base-table
+      :page="listQuery1.current"
+      :limit="listQuery1.size"
+      :table-config="tableProps1"
+      :table-data="list1"
+      :is-loading="listLoading1"
+    />
+    <pagination
+      v-show="total1 > 0"
+      :total="total1"
+      :page.sync="listQuery1.current"
+      :limit.sync="listQuery1.size"
+      @pagination="getList1()"
+    />
+    <hr>
+    <span>{{ $t('module.orderManage.erpToMes.erpToMesMaterialBom') }}</span>
+    <base-table
+      :page="listQuery2.current"
+      :limit="listQuery2.size"
+      :table-config="tableProps2"
+      :table-data="list2"
+      :is-loading="listLoading2"
+    />
+    <pagination
+      v-show="total2 > 0"
+      :total="total2"
+      :page.sync="listQuery2.current"
+      :limit.sync="listQuery2.size"
+      @pagination="getLis2()"
+    />
+    <hr>
+    <span>{{ $t('module.orderManage.erpToMes.erpToMesOrder') }}</span>
+    <base-table
+      :page="listQuery3.current"
+      :limit="listQuery3.size"
+      :table-config="tableProps3"
+      :table-data="list3"
+      :is-loading="listLoading3"
+    />
+    <pagination
+      v-show="total3 > 0"
+      :total="total3"
+      :page.sync="listQuery3.current"
+      :limit.sync="listQuery3.size"
+      @pagination="getList3()"
+    />
+  </div>
+</template>
+
+<script>
+import { erpToMesMaterialList, erpToMesMaterialBomList, erpToMesOrderList } from '@/api/orderManage/erpToMes'
+import BaseTable from '@/components/BaseTable'
+import Pagination from '@/components/Pagination' // Secondary package based on el-pagination
+import i18n from '@/lang'
+
+const tableProps1 = [
+  {
+    prop: 'batchNumber',
+    label: i18n.t('module.orderManage.erpToMes.batchNumber'),
+    align: 'center'
+  },
+  {
+    prop: 'materialsCode',
+    label: i18n.t('module.orderManage.erpToMes.materialsCode'),
+    align: 'center'
+  },
+  {
+    prop: 'materialsName',
+    label: i18n.t('module.orderManage.erpToMes.materialsName'),
+    align: 'center'
+  },
+  {
+    prop: 'quantity',
+    label: i18n.t('module.orderManage.erpToMes.quantity'),
+    align: 'center'
+  },
+  {
+    prop: 'unit',
+    label: i18n.t('module.orderManage.erpToMes.unit'),
+    align: 'center'
+  }
+]
+const tableProps2 = [
+  {
+    prop: 'bomContent',
+    label: i18n.t('module.orderManage.erpToMes.bomContent'),
+    align: 'center'
+  },
+  {
+    prop: 'craftCode',
+    label: i18n.t('module.orderManage.erpToMes.craftCode'),
+    align: 'center'
+  },
+  {
+    prop: 'craftName',
+    label: i18n.t('module.orderManage.erpToMes.craftName'),
+    align: 'center'
+  },
+  {
+    prop: 'materialsBomCode',
+    label: i18n.t('module.orderManage.erpToMes.materialsBomCode'),
+    align: 'center'
+  },
+  {
+    prop: 'materialsBomName',
+    label: i18n.t('module.orderManage.erpToMes.materialsBomName'),
+    align: 'center'
+  },
+  {
+    prop: 'substrateBatch',
+    label: i18n.t('module.orderManage.erpToMes.substrateBatch'),
+    align: 'center'
+  }
+]
+const tableProps3 = [
+  {
+    prop: 'customerCode',
+    label: i18n.t('module.orderManage.erpToMes.customerCode'),
+    align: 'center'
+  },
+  {
+    prop: 'customerName',
+    label: i18n.t('module.orderManage.erpToMes.customerName'),
+    align: 'center'
+  },
+  {
+    prop: 'orderCode',
+    label: i18n.t('module.orderManage.erpToMes.orderCode'),
+    align: 'center'
+  },
+  {
+    prop: 'orderName',
+    label: i18n.t('module.orderManage.erpToMes.orderName'),
+    align: 'center'
+  },
+  {
+    prop: 'quantity',
+    label: i18n.t('module.orderManage.erpToMes.quantity'),
+    align: 'center'
+  }
+]
+
+export default {
+  name: 'ErpToMesData',
+  components: { Pagination, BaseTable },
+  data() {
+    return {
+      tableProps1,
+      tableProps2,
+      tableProps3,
+      list1: [],
+      list2: [],
+      list3: [],
+      total1: 0,
+      total2: 0,
+      total3: 0,
+      listLoading1: true,
+      listLoading2: true,
+      listLoading3: true,
+      listQuery1: {
+        current: 1,
+        size: 10
+      },
+      listQuery2: {
+        current: 1,
+        size: 10
+      },
+      listQuery3: {
+        current: 1,
+        size: 10
+      }
+    }
+  },
+  created() {
+    this.getList1()
+    this.getList2()
+    this.getList3()
+  },
+  methods: {
+    getList1() {
+      this.listLoading1 = true
+      erpToMesMaterialList(this.listQuery1).then(response => {
+        if (response.data.records) {
+          this.list1 = response.data.records
+        } else {
+          this.list1.splice(0, this.list1.length)
+        }
+        this.total1 = response.data.total
+        this.listLoading1 = false
+      })
+    },
+    getList2() {
+      this.listLoading2 = true
+      erpToMesMaterialBomList(this.listQuery2).then(response => {
+        if (response.data.records) {
+          this.list2 = response.data.records
+        } else {
+          this.list2.splice(0, this.list2.length)
+        }
+        this.total2 = response.data.total
+        this.listLoading2 = false
+      })
+    },
+    getList3() {
+      this.listLoading3 = true
+      erpToMesOrderList(this.listQuery3).then(response => {
+        if (response.data.records) {
+          this.list3 = response.data.records
+        } else {
+          this.list3.splice(0, this.list3.length)
+        }
+        this.total3 = response.data.total
+        this.listLoading3 = false
+      })
+    }
+  }
+}
+</script>
+
+<style scoped>
+span{
+  background-color: #ECF5FF;
+  font-size: 20px;
+  padding: 5px;
+  color: #409EFF;
+}
+</style>