<template>
  <div class="app-container">
    <div>
      <scan-box :title="scanTitle" @inputComplete="inputComplete" />
    </div>
    <div class="attributes">
      <el-checkbox-group v-model="selectedSpecialRemarks">
        <el-checkbox
          v-for="(item, index) in specialRemarks"
          :key="index"
          :label="item.Name"
          border
        />
      </el-checkbox-group>
    </div>
    <div class="currentInput">
      <div>
        <span>批次号:</span>
        <span>{{ inputBatchNo }}</span>
      </div>
      <div>
        <span>重量:</span>
        <span>{{ inputWeight }}</span>
      </div>
      <div>
        <el-button type="success" @click="submitWeight">提交</el-button>
      </div>
    </div>
    <div>
      <el-table :data="tableData" stripe style="width: 100%">
        <el-table-column prop="BatchNo" label="批次码" width="180" />
        <el-table-column prop="SkuWeight" label="产品重量" width="180" />
        <el-table-column prop="WeightTime" label="称重时间" :formatter="colFormatDate" />
        <el-table-column prop="WeightingWeight" label="称重重量" />
        <el-table-column prop="OperatorName" label="称重人" />
        <el-table-column label="状态">
          <template slot-scope="scope">
            <el-tag v-if="scope.row.Success==true" type="success">成功</el-tag>
            <el-tag v-else-if="scope.row.ConfirmWeight==true" type="warning">重称确认</el-tag>
            <el-tag v-else type="danger">失败</el-tag>
          </template>
        </el-table-column>
      </el-table>
    </div>
  </div>
</template>
<script>
const batchNoPattern = /^BC/i
const countPattern = /^\d{1,5}$/

import colFormatDate from '@/utils/columnFormat'
import scanBox from '../components/scanBox'
import * as enums from '@/api/enum/enums'
import { GetPurchaseGoods } from '@/api/ds/purchase/purchaseGoods'
import { submitWeight } from '@/api/ds/weighting/weight'

export default {
  components: {
    scanBox
  },
  data: function() {
    return {
      scanTitle: '扫描批次/重量',
      tableData: [],
      specialRemarks: [],
      selectedSpecialRemarks: [],
      currentGoods: null,
      inputBatchNo: null,
      inputWeight: null
    }
  },

  created() {
    enums.Get('SpecialRemark').then((res) => {
      this.specialRemarks.push(...res)
    })
  },
  methods: {
    colFormatDate,
    inputComplete(data) {
      if (batchNoPattern.test(data)) {
        this.getGoodsInfo(data)
      } else if (countPattern.test(data)) {
        this.inputWeight = data
      }
    },
    getGoodsInfo(batchNo) {
      GetPurchaseGoods(batchNo).then((res) => {
        this.inputBatchNo = res.BatchNo
      })
    },
    submitWeight() {
      const batchNo = this.inputBatchNo
      const weight = this.inputWeight
      const specialRemarks = this.selectedSpecialRemarks
      const isConfirmWeight = this.tableData.findIndex(i => i.BatchNo == batchNo && i.Success == false && i.ConfirmWeight == true) >= 0
      const data = { batchNo, weight, specialRemarks, isConfirmWeight }

      submitWeight(data).then((res) => {
        this.tableData.unshift(res)
        if (res.ConfirmWeight == true) {
          this.$message({
            message: '称重重量与SKU重量相差太大，请再次称重',
            type: 'error'
          })
        }
      })
    }

  }
}
</script>
<style scoped>
.attributes {
  margin: 20px;
}

.currentInput {
  margin: 20px 0px;
  display: flex;
  font-size: 24px;
}
.currentInput div {
  margin-right: 20px;
  min-width: 250px;
  color: #666;
}
</style>
