<template>
  <div>
    <el-card>
      <span>合同明细流水号：</span>
      <el-input id="code1" v-model="qrCode" size="small" placeholder="输入合同明细流水号" style="width: 200px" @keyup.native.enter="codeChange1()" @focus="qrCode=''"/>
      <span>合同类型：</span>
      <el-select v-model="contractType" filterable size="small" placeholder="合同类型" @change="contractTypeChange">
        <el-option
          v-for="item in options"
          :key="item.value"
          :label="item.label"
          :value="item.value"/>
      </el-select>
      <el-button type="success" size="small" style="margin-left: 10px" @click="searchPartDetail">查询零件详情</el-button>
    </el-card>
    <el-card>
      <el-form label-position="right" label-width="100px" class="searchForm">
        <el-row>
          <el-col style="width: 300px">
            <el-form-item label="机床号：">
              <el-input v-model="machine" readonly size="small" style="width: 200px" placeholder="无"/>
            </el-form-item>
          </el-col>
          <el-col style="width: 300px">
            <el-form-item label="组号：">
              <el-input v-model="team" readonly size="small" style="width: 200px" placeholder="无"/>
            </el-form-item>
          </el-col>
          <el-col style="width: 300px">
            <el-form-item label="物料名称：">
              <el-input v-model="materialname" readonly size="small" style="width: 200px" placeholder="无"/>
            </el-form-item>
          </el-col>
          <el-col style="width: 300px">
            <el-form-item label="物料型号：">
              <el-input v-model="materialtype" readonly size="small" style="width: 200px" placeholder="无"/>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col style="width: 300px">
            <el-form-item label="物料规格：">
              <el-input v-model="materialscale" readonly size="small" style="width: 200px" placeholder="无"/>
            </el-form-item>
          </el-col>
          <el-col style="width: 300px">
            <el-form-item label="零件名称：">
              <el-input v-model="partname" readonly size="small" style="width: 200px" placeholder="无"/>
            </el-form-item>
          </el-col>
          <el-col style="width: 300px">
            <el-form-item label="零件图号：">
              <el-input v-model="partpaint" readonly size="small" style="width: 200px" placeholder="无"/>
            </el-form-item>
          </el-col>
          <el-col style="width: 300px">
            <el-form-item label="供应商：">
              <el-input v-model="supplier" readonly size="small" style="width: 200px" placeholder="无"/>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col style="width: 300px">
            <el-form-item label="合同编号：">
              <el-input v-model="contractnumber" readonly size="small" style="width: 200px" placeholder="无"/>
            </el-form-item>
          </el-col>
          <el-col style="width: 300px">
            <el-form-item label="采购数量：">
              <el-input v-model="contractnum" readonly size="small" style="width: 200px" placeholder="无"/>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
    </el-card>
    <el-card>
      <el-form label-position="right" label-width="100px" class="searchForm">
        <el-row>
          <el-col style="width: 300px">
            <el-form-item label="仓库名称：">
              <el-select v-model="inventoryNumber" style="width: 200px" size="small" placeholder="仓库名称" @change="getLocate">
                <el-option
                  v-for="item in inventoryName"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value"/>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col style="width: 300px">
            <el-form-item label="货位名称：">
              <el-select v-model="locateNumber" style="width: 200px" size="small" placeholder="货位名称">
                <el-option
                  v-for="item in locateName"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value"/>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col style="width: 300px">
            <el-form-item label="入库数量：">
              <el-input-number v-model="inboundNumber" :min="0" style="width: 200px" size="small"/>
            </el-form-item>
          </el-col>
          <el-col style="width: 300px">
            <el-form-item label="重量/面积：">
              <el-input v-model="area" style="width: 90px" size="small"/>
              <el-select v-model="unit" style="width: 90px" size="small">
                <el-option
                  v-for="item in basicUnit"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value"/>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col style="width: 400px">
            <el-form-item label="备注：">
              <el-input v-model="inboundNote" style="width: 200px" size="small"/>
              <el-button type="primary" style="margin-left: 5px" size="small" @click="inBound">确定入库</el-button>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
    </el-card>
    <el-table v-show="false" :data="tableData" border style="width: 100%;margin-top:20px;">
      <el-table-column v-for="item of tableHeader" :key="item" :label="item">
        <el-table-column label="重量" width="120">
          <template slot-scope="scope">
            <!--{{ scope.row[${item}重量] }}-->
          </template>
        </el-table-column>
        <el-table-column label="金额" width="120">
          <template slot-scope="scope">
            {{ scope.row.date }}
          </template>
        </el-table-column>
      </el-table-column>
    </el-table>
  </div>
</template>

<script>
import { url } from '@/utils/request'
import axios from 'axios'
import Cookie from 'js-cookie'

export default {
  data() {
    return {
      tableData: [],
      tableHeader: [],
      locateType: '2',
      qrCode: '',
      inboundNote: '',
      multipleSelection: [],
      oldVal: '',
      project: '',
      machine: '',
      team: '',
      materialname: '',
      materialtype: '',
      materialscale: '',
      supplier: '',
      contractnumber: '',
      contractnum: '',
      locateNumber: '',
      locateName: [],
      partname: '',
      partpaint: '',
      note: '',
      partnumber: '', // 物料流水号
      inboundNumber: 0, // 入库数量
      inventoryPeople: '', // 入库人员
      options: [
        {
          value: 1,
          label: '采购部采购合同'
        }, {
          value: 3,
          label: '车间采购合同'
        }, {
          value: 4,
          label: '车间离线合同'
        }
      ],
      contractType: 1,
      exchange: '',
      purchasepart: true,
      Projectshow: true,
      basicpart: false,
      basicUnit: [], // 单位下拉框
      unit: '', // 单位
      requestcardnumber: '', // 请购单明细流水号
      area: '', // 面积或重量
      inventoryNumber: '', // 仓库流水号
      inventoryName: [], // 仓库名称
      teampartnumber: '', // 组件零件流水号
      teampartbasicnumber: '', // 组件零件基本件流水号
      unArrivalNum: 0 // 未到货数量
    }
  },
  created() {
    this.getpeopleid()
    this.getHouse()
  },
  mounted() {
    this.getUnit()
  },
  methods: {
    // 获取人员编号
    getpeopleid() {
      this.inventoryPeople = Cookie.get('id')
    },
    // 合同类型变更
    contractTypeChange() {
      if (this.contractType === 3) { // 车间采购
        this.Projectshow = true
        this.basicpart = true
      } else if (this.contractType === 2 || this.contractType === 4) { // 采购离线，车间离线
        this.Projectshow = false
        this.basicpart = false
      } else { // 采购采购
        this.Projectshow = true
        this.basicpart = false
      }
    },
    // 异步加载零件详情
    async searchPartDetail() {
      if (this.contractType === 1) { // 采购合同
        const param = {
          url: url,
          method: 'post',
          data: {
            type: '1',
            name: '库存管理_外购件入库_查询数据',
            param: `采购合同明细流水号=${this.qrCode}`
          }
        }
        const res = await axios(param)
        if (res.data.length > 0) {
          if (res.data[0].组件零件流水号) { // 标准件和外购件
            this.purchasepart = true
            this.basicpart = false
            this.project = res.data[0].项目名称
            this.machine = res.data[0].机床图号
            this.team = res.data[0].组号
            this.materialname = res.data[0].物料名称
            this.materialtype = res.data[0].物料型号
            this.materialscale = res.data[0].物料规格
            this.partnumber = res.data[0].物料流水号
          } else {
            this.purchasepart = false
            this.basicpart = true
            this.project = res.data[0].基本件项目名称
            this.machine = res.data[0].基本件机床图号
            this.team = res.data[0].基本件组号
            this.partpaint = res.data[0].零件图号
            this.partname = res.data[0].零件名称
          }
          this.inboundNumber = res.data[0].未到货数量
          this.unArrivalNum = res.data[0].未到货数量
          this.supplier = res.data[0].供应商名称
          this.contractnumber = res.data[0].采购合同编号
          this.contractnum = res.data[0].数量
          this.teampartnumber = res.data[0].组件零件流水号
          this.teampartbasicnumber = res.data[0].组件零件基本件流水号
        } else {
          this.clear()
        }
        const param2 = {
          url: url,
          method: 'post',
          data: {
            type: '1',
            name: '库存管理_交换件_入库查询',
            param: `采购合同明细流水号=${this.qrCode}`
          }
        }
        const res1 = await axios(param2)
        res1.data.length > 0 ? this.locateNumber = res1.data[0].货位流水号 : this.locateNumber = ''
      } else if (this.contractType === 2) { // 离线合同
        const param = {
          url: url,
          method: 'post',
          data: {
            type: '1',
            name: '库存管理_离线合同外购件入库_查询数据',
            param: `离线合同明细流水号=${this.qrCode}`
          }
        }
        const res = await axios(param)
        if (res.data.length > 0) {
          this.materialname = res.data[0].物料名称
          this.materialtype = res.data[0].物料型号
          this.materialscale = res.data[0].物料规格
          this.supplier = res.data[0].供应商名称
          this.contractnumber = res.data[0].离线合同编号
          this.contractnum = res.data[0].数量
          this.partnumber = res.data[0].物料流水号
        } else {
          this.clear()
        }
      } else if (this.contractType === 3) { // 车间采购合同
        const param = {
          url: url,
          method: 'post',
          data: {
            type: '1',
            name: '库存管理_车间采购_零件详情查询',
            param: `采购合同明细流水号=${this.qrCode}`
          }
        }
        const res = await axios(param)
        if (res.data.length > 0) {
          if (!res.data[0].基本件流水号) {
            this.purchasepart = true
            this.basicpart = false
            this.materialname = res.data[0].物料名称
            this.materialtype = res.data[0].物料型号
            this.materialscale = res.data[0].物料规格
          } else {
            this.purchasepart = false
            this.basicpart = true
            this.partpaint = res.data[0].零件图号
            this.partname = res.data[0].物料名称
          }
          this.project = res.data[0].项目名称
          this.machine = res.data[0].机床图号
          this.team = res.data[0].组号
          this.supplier = res.data[0].供应商名称
          this.contractnumber = res.data[0].采购合同编号
          this.contractnum = res.data[0].数量
          this.partnumber = res.data[0].物料流水号
          this.requestcardnumber = res.data[0].请购单明细流水号
        } else {
          this.clear()
        }
      } else if (this.contractType === 4) { // 车间离线合同
        const param = {
          url: url,
          method: 'post',
          data: {
            type: '1',
            name: '库存管理_车间离线合同外购件入库_查询数据',
            param: `离线合同明细流水号=${this.qrCode}`
          }
        }
        const res = await axios(param)
        if (res.data.length > 0) {
          this.materialname = res.data[0].物料名称
          this.materialtype = res.data[0].物料型号
          this.materialscale = res.data[0].物料规格
          this.supplier = res.data[0].供应商名称
          this.contractnumber = res.data[0].离线合同编号
          this.contractnum = res.data[0].数量
          this.partnumber = res.data[0].物料流水号
        } else {
          this.clear()
        }
      }
    },
    // 获取仓库
    async getHouse() {
      const param = {
        url: url,
        method: 'post',
        data: {
          type: '1',
          name: '库存管理_货位主文件_仓库查询'
        }
      }
      const res = await axios(param)
      for (let i = 0; i < res.data.length; i++) {
        this.inventoryName.push({
          label: res.data[i].仓库名称,
          value: res.data[i].仓库流水号
        })
      }
    },
    // 获取货位
    async getLocate() {
      this.locateName = []
      const param = {
        url: url,
        method: 'post',
        data: {
          type: '1',
          name: '库存管理_货位主文件_查询数据',
          param: `仓库流水号=${this.inventoryNumber}`
        }
      }
      const res = await axios(param)
      for (let i = 0; i < res.data.length; i++) {
        this.locateName.push({
          label: res.data[i].货位名称,
          value: res.data[i].货位流水号
        })
      }
    },
    // 获取单位
    async getUnit() {
      const param = {
        url: url,
        method: 'post',
        data: {
          type: '1',
          name: '库存管理_车间采购_单位查询'
        }
      }
      const res = await axios(param)
      for (let i = 0; i < res.data.length; i++) {
        this.basicUnit.push({
          label: res.data[i].单位,
          value: res.data[i].单位编号
        })
      }
      this.unit = this.basicUnit[0].value
    },
    // 清空
    clear() {
      this.locateNumber = ''
      this.inboundNumber = 0
      // this.qrCode = ''
      this.locateNumber = ''
      this.inventoryNumber = ''
      this.project = ''
      this.machine = ''
      this.team = ''
      this.materialname = ''
      this.materialtype = ''
      this.materialscale = ''
      this.supplier = ''
      this.contractnumber = ''
      this.contractnum = ''
      this.partpaint = ''
      this.partname = ''
      this.locateNumber = ''
      this.inventoryNumber = ''
      this.partnumber = ''
      this.inboundNote = ''
      this.area = ''
    },
    // 执行入库
    async inBound() {
      if (this.inboundNumber && this.locateNumber) {
        if (this.contractType === 1) {
          if (this.qrCode) {
            const param = {
              url: url,
              method: 'post',
              data: {
                type: '2',
                name: '库存管理_外购件入库_修改数据',
                param: `物料流水号=${this.partnumber}&实际到货数量=${this.inboundNumber}&货位流水号=${this.locateNumber}&采购合同明细流水号=${this.qrCode}&入库人员流水号=${this.inventoryPeople}&备注=${this.inboundNote}&组件零件流水号=${this.teampartnumber}&组件零件基本件流水号=${this.teampartbasicnumber}`
              }
            }
            const res = await axios(param)
            if (res.data[0].result === '1') {
              this.$message.success('入库成功')
              this.clear()
            } else {
              this.$message.error('入库失败')
            }
          } else {
            this.$message.warning('请扫描二维码')
          }
        } else if (this.contractType === 2) {
          if (this.qrCode) {
            const param = {
              url: url,
              method: 'post',
              data: {
                type: '2',
                name: '库存管理_离线物料货位_增加修改数据',
                param: `物料流水号=${this.partnumber}&实际到货数量=${this.inboundNumber}&货位流水号=${this.locateNumber}&离线合同明细流水号=${this.qrCode}&入库人员流水号=${this.inventoryPeople}`
              }
            }
            const res = await axios(param)
            if (res.data[0].result === '1') {
              this.$message.success('入库成功')
              this.clear()
            } else {
              this.$message.error('入库失败')
            }
          } else {
            this.$message.warning('请扫描二维码')
          }
        } else if (this.contractType === 3) {
          if (this.requestcardnumber) {
            const param = {
              url: url,
              method: 'post',
              data: {
                type: '2',
                name: '库存管理_车间采购_零件入库',
                param: `物料流水号=${this.partnumber}&实际到货数量=${this.inboundNumber}&货位流水号=${this.locateNumber}&入库人员流水号=${this.inventoryPeople}&请购单明细流水号=${this.requestcardnumber}&备注=${this.inboundNote}&重量或面积=${this.area}&单位=${this.unit}`
              }
            }
            const res = await axios(param)
            if (res.data[0].result === '1') {
              this.$message.success('入库成功')
              this.clear()
            } else {
              this.$message.error('入库失败')
            }
          } else {
            this.$message.warning('请扫描二维码')
          }
        } else if (this.contractType === 4) {
          if (this.qrCode) {
            const param = {
              url: url,
              method: 'post',
              data: {
                type: '2',
                name: '库存管理_车间离线物料货位_增加修改数据',
                param: `物料流水号=${this.partnumber}&实际到货数量=${this.inboundNumber}&货位流水号=${this.locateNumber}&离线合同明细流水号=${this.qrCode}&入库人员流水号=${this.inventoryPeople}`
              }
            }
            const res = await axios(param)
            if (res.data[0].result === '1') {
              this.$message.success('入库成功')
              this.clear()
            } else {
              this.$message.error('入库失败')
            }
          } else {
            this.$message.warning('请扫描二维码')
          }
        }
      } else {
        this.$message.warning('请选择货位并填写入库数量')
      }
    }
  }
}
</script>

<style scoped>
  .el-input{
    margin-right: 2px;
  }
  .searchForm .el-form-item{
    margin-bottom: 5px;
  }
</style>
