备料系统

src/views/WorkshopProcurement/StockPreparation/index.vue

@@ -0,0 +1,428 @@
+<template>
+  <div class="app-container">
+    <el-card>
+      <div slot="header">
+        <span>入库单号:</span>
+        <el-select v-model="warehouseReceiptValue" placeholder="入库单号" size="small" clearable>
+          <el-option
+            v-for="item in warehouseReceipt"
+            :key="item.value"
+            :label="item.label"
+            :value="item.value"/>
+        </el-select>
+        <span>供应商:</span>
+        <el-input v-model="supplierName0" placeholder="供应商" style="width: 200px" size="small" clearable/>
+        <el-button
+          type="success"
+          size="small"
+          icon="el-icon-search"
+          style="margin-left: 10px"
+          @click="pageCurrent=1;pageSize=10;total=0;searchTable()">查询</el-button>
+        <el-button
+          type="primary"
+          size="small"
+          icon="el-icon-circle-plus-outline"
+          style="margin-left: 10px"
+          @click="OpenAdd">创建入库单</el-button>
+        <el-button
+          type="warning"
+          size="small"
+          icon="el-icon-download"
+          style="margin-left: 10px"
+          @click="exportTable">导出入库单</el-button>
+      </div>
+      <el-table
+        v-loading="loading"
+        :data="tableData"
+        border
+        style="width: 100%;max-height: 460px;"
+        height="270"
+        size="mini"
+        highlight-current-row
+        @row-click="searchTable1">
+        <el-table-column label="入库单号" min-width="150" align="center">
+          <template slot-scope="scope">
+            {{ scope.row.入库单号 }}
+          </template>
+        </el-table-column>
+        <el-table-column label="入库人员" min-width="150" align="center">
+          <template slot-scope="scope">
+            {{ scope.row.姓名 }}
+          </template>
+        </el-table-column>
+        <el-table-column label="入库时间" min-width="150" align="center">
+          <template slot-scope="scope">
+            {{ scope.row.入库时间 }}
+          </template>
+        </el-table-column>
+        <el-table-column label="采购单号" min-width="90" align="center">
+          <template slot-scope="scope">
+            {{ scope.row.采购单号 }}
+          </template>
+        </el-table-column>
+        <el-table-column label="采购单名称" min-width="90" align="center">
+          <template slot-scope="scope">
+            {{ scope.row.采购单名称 }}
+          </template>
+        </el-table-column>
+        <el-table-column label="供应商" min-width="150" align="center">
+          <template slot-scope="scope">
+            {{ scope.row.供应商名称 }}
+          </template>
+        </el-table-column>
+        <el-table-column label="操作" align="center" width="200" fixed="right">
+          <template slot-scope="scope">
+            <el-button type="danger" size="mini" icon="el-icon-delete" @click="deleteWarehouseReceipt(scope.row)"/>
+          </template>
+        </el-table-column>
+      </el-table>
+      <div class="block" style="margin-top: 10px;">
+        <el-pagination
+          :current-page="pageCurrent"
+          :page-sizes="[10, 20, 30, 40]"
+          :page-size="pageSize"
+          :total="total"
+          style="display:inline-block;width:50%"
+          layout="total, sizes, prev, pager, next, jumper"
+          @size-change="handleSizeChange"
+          @current-change="handleCurrentChange"/>
+      </div>
+    </el-card>
+    <el-card>
+      <el-table v-loading="" :data="tableData1" :summary-method="getSummaries" show-summary border style="max-height: 300px;" height="400px" size="mini">
+        <el-table-column label="零件图号" align="center" min-width="150">
+          <template slot-scope="scope">
+            {{ scope.row.零件图号 }}
+          </template>
+        </el-table-column>
+        <el-table-column label="零件名称" align="center" min-width="150">
+          <template slot-scope="scope">
+            {{ scope.row.零件名称 }}
+          </template>
+        </el-table-column>
+        <el-table-column label="材料" align="center" min-width="100">
+          <template slot-scope="scope">
+            {{ scope.row.材料 }}
+          </template>
+        </el-table-column>
+        <el-table-column label="单位" align="center" min-width="200">
+          <template slot-scope="scope">
+            {{ scope.row.单位 }}
+          </template>
+        </el-table-column>
+        <el-table-column label="数量" align="center" min-width="100">
+          <template slot-scope="scope">
+            {{ scope.row.批次数量 }}
+          </template>
+        </el-table-column>
+        <el-table-column label="成品尺寸" align="center" min-width="100">
+          <template slot-scope="scope">
+            {{ scope.row.备料打印 }}
+          </template>
+        </el-table-column>
+        <el-table-column label="备注" align="center" min-width="100">
+          <template slot-scope="scope">
+            {{ scope.row.备注 }}
+          </template>
+        </el-table-column>
+        <el-table-column label="重量" align="center" min-width="100">
+          <template slot-scope="scope">
+            {{ scope.row.重量1 }}
+          </template>
+        </el-table-column>
+        <el-table-column label="单价" align="center" min-width="100">
+          <template slot-scope="scope">
+            {{ scope.row.单价 }}
+          </template>
+        </el-table-column>
+        <el-table-column label="合计" align="center" min-width="100">
+          <template slot-scope="scope">
+            {{ scope.row.批次数量 * scope.row.单价 * scope.row.重量1 }}
+          </template>
+        </el-table-column>
+      </el-table>
+    </el-card>
+    <el-dialog :visible.sync="dialogVisible" title="创建入库单" center style="min-height: 300px" width="400px">
+      <el-form ref="form" :model="form" :rules="rules" label-position="right" label-width="120px">
+        <el-row>
+          <el-form-item label="采购单号" prop="purchaseOrderValue">
+            <el-select v-model="form.purchaseOrderValue" placeholder="采购单号" size="small" filterable clearable>
+              <el-option
+                v-for="item in purchaseOrder"
+                :key="item.value"
+                :label="item.label"
+                :value="item.value"/>
+            </el-select>
+          </el-form-item>
+        </el-row>
+        <el-row>
+          <el-form-item label="入库人员" prop="money">
+            <el-input v-model="form.warehousingStaff" size="small" placeholder="入库人员" readonly style="width: 200px"/>
+          </el-form-item>
+        </el-row>
+      </el-form>
+      <div slot="footer" class="dialog-footer">
+        <el-button
+          type="primary"
+          size="small"
+          icon="el-icon-check"
+          @click="submitAdd">确定</el-button>
+      </div>
+    </el-dialog>
+    <el-card style="width: 1100px;margin: 20px auto">
+      <div id="cjn" style="width: 1000px;margin: 0 auto">
+        <table cellspacing="0px" align="center" border="1 solid black" width="100%">
+          <tr>
+            <th colspan="16"><h3>备料入库单</h3></th>
+          </tr>
+          <tr style="height: 40px">
+            <td colspan="2" style="text-align: center;width: 15%">入库单号</td>
+            <td colspan="6" style="text-align: center;width: 35%">{{ 入库单号 }}</td>
+            <td colspan="2" style="text-align: center;width: 15%">入库人员</td>
+            <td colspan="6" style="text-align: center;width: 35%">{{ 入库人员 }}</td>
+          </tr>
+          <tr style="height: 40px">
+            <td colspan="2" style="text-align: center;width: 15%">采购单号</td>
+            <td colspan="6" style="text-align: center;width: 35%">{{ 采购单号 }}</td>
+            <td colspan="2" style="text-align: center;width: 15%">采购单名称</td>
+            <td colspan="6" style="text-align: center;width: 35%">{{ 采购单名称 }}</td>
+          </tr>
+          <tr style="height: 40px">
+            <td colspan="2" style="text-align: center;width: 15%">入库时间</td>
+            <td colspan="6" style="text-align: center;width: 35%">{{ 入库时间 }}</td>
+            <td colspan="2" style="text-align: center;width: 15%">供应商</td>
+            <td colspan="6" style="text-align: center;width: 35%">{{ 供应商 }}</td>
+          </tr>
+        </table>
+        <table style="margin-top: 20px" cellspacing="0px" align="center" border="1 solid black" width="100%">
+          <tr id="tablehead" style="height: 35px">
+            <td style="text-align: center;width: 5%">序号</td>
+            <td colspan="2" style="text-align: center;width: 15%">零件图号</td>
+            <td colspan="2" style="text-align: center;width: 15%">零件名称</td>
+            <td colspan="2" style="text-align: center;width: 10%">材料</td>
+            <td colspan="2" style="text-align: center;width: 8%">单位</td>
+            <td colspan="1" style="text-align: center;width: 8%">数量</td>
+            <td colspan="2" style="text-align: center;width: 20%">成品尺寸</td>
+            <td colspan="2" style="text-align: center;width: 8%">重量</td>
+            <td colspan="2" style="text-align: center;width: 11%">总重量</td>
+          </tr>
+          <tr v-for="(list, index) in tableData1" :key="index" style="height: 35px">
+            <td style="text-align: center;width: 7%">{{ index + 1 }}</td>
+            <td colspan="2" style="text-align: center;width: 15%">{{ list.零件图号 }}</td>
+            <td colspan="2" style="text-align: center;width: 15%">{{ list.零件名称 }}</td>
+            <td colspan="2" style="text-align: center;width: 10%">{{ list.材料 }}</td>
+            <td colspan="2" style="text-align: center;width: 8%">{{ list.单位 }}</td>
+            <td colspan="1" style="text-align: center;width: 8%">{{ list.批次数量 }}</td>
+            <td colspan="2" style="text-align: center;width: 20%">{{ list.成品尺寸 }}</td>
+            <td colspan="2" style="text-align: center;width: 8%">{{ list.重量1 }}</td>
+            <td colspan="2" style="text-align: center;width: 9%">{{ list.批次数量 * list.重量1 }}</td>
+          </tr>
+        </table>
+      </div>
+    </el-card>
+  </div>
+</template>
+
+<script>import { initWarehouseReceipt, searchWarehouseReceipt, searchMateriel, AddWarehousing, deleteWarehousing, initPurchaseOrder } from '@/api/WorkshopProcurement/StockPreparation'
+import { mapGetters } from 'vuex'
+import $ from 'jquery'
+export default {
+  data() {
+    return {
+      warehouseReceiptValue: '',
+      warehouseReceipt: [],
+      supplierName0: '',
+      check: 0,
+      chekc1: 0,
+      tableData: [],
+      tableData1: [],
+      loading: false,
+      pageCurrent: 1,
+      pageSize: 10,
+      total: 0,
+      num: '',
+      disable: true,
+      dialogVisible: false,
+      purchaseOrder: [],
+      入库单号: '',
+      入库人员: '',
+      入库时间: '',
+      采购单号: '',
+      采购单名称: '',
+      供应商: '',
+      totalMoney: 0,
+      form: {
+        入库单流水号: '',
+        purchaseOrderValue: '',
+        warehousingStaff: ''
+      },
+      rules: {
+        purchaseOrderValue: [{ required: true, message: '请选择采购单号' }]
+      }
+    }
+  },
+  computed: {
+    ...mapGetters([
+      'sidebar',
+      'avatar',
+      'name',
+      'id' // 人员编号
+    ])
+  },
+  created() {
+    this.fetchData()
+  },
+  methods: {
+    fetchData() {
+      initWarehouseReceipt(0, this.warehouseReceiptValue, 0, this.supplierName0).then(response => {
+        for (let i = 0; i < response.data.length; i++) {
+          this.warehouseReceipt.push({
+            label: response.data[i].入库单号,
+            value: response.data[i].入库单号
+          })
+        }
+      })
+      initPurchaseOrder().then(response => {
+        for (let i = 0; i < response.data.length; i++) {
+          this.purchaseOrder.push({
+            label: response.data[i].采购单号,
+            value: response.data[i].采购计划流水号
+          })
+        }
+      })
+    },
+    searchTable() { // 查询入库单
+      this.loading = true
+      this.warehouseReceiptValue ? this.check = 1 : this.check = 0
+      this.supplierName0 ? this.check1 = 1 : this.check1 = 0
+      searchWarehouseReceipt(this.pageCurrent, this.pageSize, this.check, this.warehouseReceiptValue, this.check1, this.supplierName0).then(response => {
+        this.tableData = response.data.rows
+        this.total = response.data.total
+        this.loading = false
+      })
+    },
+    handleSizeChange(val) {
+      this.pageSize = val
+      this.pageCurrent = 1
+      this.searchTable()
+    },
+    handleCurrentChange(val) {
+      this.pageCurrent = val
+      this.searchTable()
+    },
+    searchTable1(row) {
+      this.totalMoney = 0
+      this.num = row.采购计划流水号
+      this.入库单号 = row.入库单号
+      this.入库人员 = row.姓名
+      this.采购单号 = row.采购单号
+      this.采购单名称 = row.采购单名称
+      this.入库时间 = row.入库时间
+      this.供应商 = row.供应商名称
+      searchMateriel(this.num).then(response => {
+        this.tableData1 = response.data
+        for (let i = 0; i < response.data.length; i++) {
+          this.totalMoney += (response.data[i].批次数量 * response.data[i].重量1 * response.data[i].单价)
+        }
+      })
+    },
+    OpenAdd() {
+      if (this.$refs['form'] !== undefined) {
+        this.$refs['form'].resetFields()
+      }
+      this.form.warehousingStaff = this.name
+      this.dialogVisible = true
+      this.form.purchaseOrderValue = ''
+    },
+    submitAdd() {
+      this.$refs['form'].validate((valid) => {
+        if (valid) {
+          AddWarehousing(this.form.purchaseOrderValue, this.id).then(response => {
+            if (response.data[0].result === '1') {
+              this.$message.success('创建成功')
+              this.searchTable()
+              this.dialogVisible = false
+            } else { this.$message.error('创建失败') }
+          })
+        } else {
+          console.log('error submit!!')
+          return false
+        }
+      })
+    },
+    deleteWarehouseReceipt(row) {
+      this.$confirm('确认删除吗?', '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning'
+      }).then(() => {
+        deleteWarehousing(row.入库单流水号).then(response => {
+          if (response.data[0].result === '1') {
+            this.$message.success('删除成功')
+            this.dialogVisible = false
+            this.searchTable()
+            this.tableData1 = []
+          } else { this.$message.error('删除失败') }
+        })
+      }).catch(() => {
+        this.$message({
+          type: 'info',
+          message: '已取消操作'
+        })
+      })
+    },
+    getSummaries(param) {
+      const { columns, data } = param
+      const sums = []
+      columns.forEach((column, index) => {
+        if (index === 6) {
+          sums[index] = '总重量'
+          return
+        } else if (index === 7) {
+          const values = data.map(item => Number(item['重量1']))
+          if (!values.every(value => isNaN(value))) {
+            sums[index] = values.reduce((prev, curr) => {
+              const value = Number(curr)
+              if (!isNaN(value)) {
+                return Number(prev) + Number(curr)
+              } else {
+                return Number(prev)
+              }
+            }, 0)
+            sums[index] += ' kg'
+          } else {
+            sums[index] = 'N/A'
+          }
+        } else if (index === 8) {
+          sums[index] = '总价'
+        } else if (index === 9) {
+          if (this.totalMoney !== 0) {
+            sums[index] = this.totalMoney + ' 元'
+          } else {
+            sums[index] = 'N/A'
+          }
+        }
+      })
+      return sums
+    },
+    exportTable() {
+      const htmlNode = $('#cjn').html()
+      const body = $('body')
+      body.children().hide()
+      const printNode = $(htmlNode)
+      body.append(printNode)
+      window.print()
+      body.removeAttr('style')
+      body.children().not('script').show()
+      body.children().not('#app').hide()
+      printNode.remove()
+    }
+  }
+}
+</script>
+
+<style scoped>
+  span{
+    margin: 10px 0 10px 10px;
+  }
+</style>