<template>
  <div class="app-container">
    <el-card>
      <span style="margin: 5px">领料单编号</span>
      <el-input v-model="pickingListNumber" clearable size="small" style="width:200px"/>
      <el-button size="small" type="success" icon="el-icon-search" style="margin: 0 0 0 10px" @click="searchListinfor()">查询</el-button>
      <el-button size="small" type="primary" icon="el-icon-plus" style="margin: 0 0 0 10px" @click="addListinfor()">创建</el-button>
    </el-card>

    <el-card>
      <el-table v-loading="listLoading0" :data="tableData1" highlight-current-row border style="width: 100%;" size="mini" height="300" @row-click="chooseListinfor">
        <el-table-column label="序号" align="center" type="index" width="50"/>
        <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="200" >
          <template slot-scope="scope">
            {{ scope.row.领料时间.split(' ')[0] }}
          </template>
        </el-table-column>
        <el-table-column label="创建人" align="center" min-width="130">
          <template slot-scope="scope">
            {{ scope.row.姓名 }}
          </template>
        </el-table-column>
        <el-table-column v-if="true" label="操作" align="center" width="100">
          <template slot-scope="scope">
            <el-button size="mini" type="danger" icon="el-icon-delete" @click="dropListinfor(scope.row)">删除</el-button>
          </template>
        </el-table-column>
      </el-table>
      <div class="block" style="margin: 10px 0;">
        <el-pagination
          :current-page="PageCurrent0"
          :page-sizes="[10, 20, 30, 40]"
          :page-size="PageSize0"
          :total="total0"
          layout="total, sizes, prev, pager, next, jumper"
          @size-change="handleSizeChange0"
          @current-change="handleCurrentChange0"/>
      </div>
      <el-table :data="tableDataPicking" border style="width: 100%;" size="mini" height="300">
        <el-table-column label="序号" align="center" type="index" width="50"/>
        <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">
            <el-tag v-if="scope.row.是否外购===1">外购</el-tag>
            <el-tag v-else>自家</el-tag>
          </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="70">
          <template slot-scope="scope">
            {{ scope.row.组号 }}
          </template>
        </el-table-column>
        <el-table-column v-if="true" label="操作" align="center" width="100">
          <template slot-scope="scope">
            <el-button size="mini" type="danger" icon="el-icon-delete" @click="dropListdetail(scope.row)">移除</el-button>
          </template>
        </el-table-column>
      </el-table>
    </el-card>

    <el-card>
      <!--<span>项目名称:</span>-->
      <el-select v-show="false" v-model="ProjectValue" filterable clearable size="small" placeholder="请选择项目名称" style="width: 200px;margin-right:10px" @change="searchMachine()">
        <el-option
          v-for="item in Project"
          :key="item.value"
          :label="item.label"
          :value="item.value"/>
      </el-select>
      <span>机床图号:</span>
      <el-select v-model="MachineValue" filterable clearable size="small" placeholder="机床图号" style="width: 200px;margin-right:10px" @change="searchGroupList()">
        <el-option
          v-for="item in Machine"
          :key="item.value"
          :label="item.label"
          :value="item.value"/>
      </el-select>
      <span>组号:</span>
      <el-select v-model="GroupNumValue" filterable clearable size="small" placeholder="组号" style="width: 200px">
        <el-option
          v-for="item in GroupNum"
          :key="item.value"
          :label="item.label"
          :value="item.value"/>
      </el-select>
      <el-button size="small" type="success" icon="el-icon-search" style="margin: 0 0 0 10px" @click="searchPartinfo()">查询</el-button>
    </el-card>

    <el-card>
      <h4>自家备料</h4>
      <el-table v-loading="listLoading1" :data="tableDataBasic" border style="width: 100%;" size="mini" height="440">
        <el-table-column label="序号" align="center" type="index" width="50"/>
        <el-table-column label="项目名称" align="center" min-width="80">
          <template slot-scope="scope">
            {{ scope.row.项目名称 }}
          </template>
        </el-table-column>
        <el-table-column label="机床图号" align="center" min-width="80">
          <template slot-scope="scope">
            {{ scope.row.机床图号 }}
          </template>
        </el-table-column>
        <el-table-column label="组号" align="center" width="70">
          <template slot-scope="scope">
            {{ scope.row.组号 }}
          </template>
        </el-table-column>
        <el-table-column label="零件名称" align="center" min-width="80">
          <template slot-scope="scope">
            {{ scope.row.零件名称 }}
          </template>
        </el-table-column>
        <el-table-column label="零件图号" align="center" min-width="80">
          <template slot-scope="scope" align="center">
            {{ scope.row.零件图号 }}
          </template>
        </el-table-column>
        <el-table-column label="操作" align="center" width="100">
          <template slot-scope="scope" align="center">
            <el-button size="mini" type="primary" icon="el-icon-edit" style="margin: 0 0 0 10px" @click="addBasicList(scope.row)">领料</el-button>
          </template>
        </el-table-column>
      </el-table>
      <div class="block" style="margin: 10px 0;">
        <el-pagination
          :current-page="PageCurrent1"
          :page-sizes="[10, 20, 30, 40]"
          :page-size="PageSize1"
          :total="total1"
          layout="total, sizes, prev, pager, next, jumper"
          @size-change="handleSizeChange1"
          @current-change="handleCurrentChange1"/>
      </div>
      <hr>
      <h4>外购备料</h4>
      <el-table v-loading="listLoading2" :data="tableDataPurchase" border style="width: 100%;" size="mini" height="440">
        <el-table-column label="序号" align="center" type="index" width="50"/>
        <el-table-column label="项目名称" align="center" min-width="80">
          <template slot-scope="scope">
            {{ scope.row.项目名称 }}
          </template>
        </el-table-column>
        <el-table-column label="机床图号" align="center" min-width="80">
          <template slot-scope="scope">
            {{ scope.row.机床图号 }}
          </template>
        </el-table-column>
        <el-table-column label="组号" align="center" width="70">
          <template slot-scope="scope">
            {{ scope.row.组号 }}
          </template>
        </el-table-column>
        <el-table-column label="物料编码" align="center" min-width="80">
          <template slot-scope="scope" align="center">
            {{ scope.row.物料编码 + scope.row.零件图号 }}
          </template>
        </el-table-column>
        <el-table-column label="零件名称" align="center" min-width="80">
          <template slot-scope="scope">
            {{ scope.row.零件名称 }}
          </template>
        </el-table-column>
        <el-table-column label="操作" align="center" width="100">
          <template slot-scope="scope" align="center">
            <el-button size="mini" type="primary" icon="el-icon-edit" @click="addPurchaseList(scope.row)">领料</el-button>
          </template>
        </el-table-column>
      </el-table>
      <div class="block" style="margin: 10px 0;">
        <el-pagination
          :current-page="PageCurrent2"
          :page-sizes="[10, 20, 30, 40]"
          :page-size="PageSize2"
          :total="total2"
          layout="total, sizes, prev, pager, next, jumper"
          @size-change="handleSizeChange2"
          @current-change="handleCurrentChange2"/>
      </div>
    </el-card>
  </div>
</template>

<script>
import { initProject, searchmachine, searchTeam, searchPurchasePart, searchBasicPart,
  searchList, addList, dropList, searchListDetail, dropListDetailBasic, addBasicList, addPurchaseList } from '@/api/ManufacturingCenter/CreateIntakeList'
import { mapGetters } from 'vuex'
export default {
  data() {
    return {
      listLoading0: false, // 领料单
      listLoading1: false, // 自制件
      listLoading2: false, // 采购部采购件
      PageCurrent0: 1,
      PageSize0: 10,
      total0: 0,
      PageCurrent1: 1,
      PageSize1: 10,
      total1: 0,
      PageCurrent2: 1,
      PageSize2: 10,
      total2: 0,
      ProjectValue: '',
      Project: [],
      ProjectValue_check: 0,
      MachineValue: '',
      Machine: [],
      MachineValue_check: 0,
      GroupNumValue: '',
      GroupNum: [],
      GroupNumValue_check: 0,
      tableData1: [], // 领料单
      tableDataPicking: [], // 领料单明细
      tableDataBasic: [], // 自制件
      tableDataPurchase: [], // 采购部采购件
      tableDataBacklog: [], // 滞货件
      tableDataHouse: [], // 车间采购件
      enableOut: '', // 可出库数量
      partPiant: '', // 零件图号
      material: '', // 材料
      outType: '',
      pickingListNumber: null, // 领料单编号
      pickingListNumberx: '', // 领料单流水号
      picikingPeople: '', // 领料人流水号
      partProjectNumber: '', // 项目流水号
      partMachineNumber: '', // 机床流水号
      partGroupNumber: '', // 分组流水号
      receive: '', // 收件信息ID
      locatenumber: '', // 货位流水号
      materialName: '',
      materialNumber: '',
      materialType: '',
      purchaseDetailNum: '', // 采购合同明细流水号
      askPurchaseNumber: '', // 请购单明细流水号
      materialLocate: '',
      partType: '', // 零件类型
      craftplannumber: '' // 工艺计划流水号
    }
  },
  computed: {
    ...mapGetters([
      'id'
    ])
  },
  created() {
    this.fetchData()
    this.searchListinfor()
    this.searchPartinfo()
    this.searchMachine()
  },
  methods: {
    // 创建领料单
    addListinfor() {
      this.$confirm('确认创建新的领料单?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        addList(this.picikingPeople).then(response => {
          if (response.data[0].result === '1') {
            this.$message.success('增加成功')
            this.searchListinfor()
          } else {
            this.$message.error('增加失败')
          }
        })
      }).catch(() => {
        this.$message('已取消操作')
      })
    },
    // 查询领料单
    searchListinfor() {
      let check
      this.pickingListNumber ? check = 1 : check = 0
      this.listLoading0 = true
      searchList(this.PageCurrent0, this.PageSize0, check, this.pickingListNumber).then(response => {
        this.tableData1 = response.data.rows
        this.total0 = response.data.total
        this.listLoading0 = false
      })
    },
    // 领料单分页
    handleSizeChange0(val) {
      this.PageCurrent0 = 1
      this.PageSize0 = val
      this.searchListinfor()
    },
    handleCurrentChange0(val) {
      this.PageCurrent0 = val
      this.searchListinfor()
    },
    // 选择领料单
    chooseListinfor(row) {
      this.pickingListNumberx = row.备料领料单流水号
      // this.pickingListNumber = row.领料单编号
      this.searchListDetailt()
    },
    // 查询领料单明细
    searchListDetailt() {
      searchListDetail(this.pickingListNumberx).then(response => {
        this.tableDataPicking = response.data
      })
    },
    // 移除
    dropListdetail(row) {
      this.$confirm('确认移除该零件?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        dropListDetailBasic(row.备料领料单明细流水号, row.是否外购, row.工艺计划流水号).then(response => {
          if (response.data[0].result === '1') {
            this.$message.success('删除成功')
            this.searchListDetailt()
            this.searchPartinfo()
          } else {
            this.$message.error('数据占用')
          }
        })
      }).catch(() => {
        this.$message({
          type: 'info',
          message: '已取消删除'
        })
      })
    },
    // 初始化项目,获取人员编号
    fetchData() {
      this.getSelect(initProject, ['项目名称', '项目流水号'], 'Project') // 项目名称
      this.picikingPeople = this.id
    },
    // 查询机床
    searchMachine() {
      this.MachineValue = ''
      this.Machine = []
      this.GroupNumValue = ''
      this.GroupNum = []
      this.ProjectValue ? this.ProjectValue_check = 1 : this.ProjectValue_check = 0
      searchmachine(this.ProjectValue_check, this.ProjectValue).then(response => {
        for (let i = 0; i < response.data.length; i++) {
          this.Machine.push({
            label: response.data[i].机床图号,
            value: response.data[i].机床流水号
          })
        }
      })
    },
    // 查询组号
    searchGroupList() {
      if (this.MachineValue) {
        this.GroupNumValue = ''
        this.GroupNum = []
        searchTeam(this.MachineValue).then(response => {
          for (let i = 0; i < response.data.length; i++) {
            this.GroupNum.push({
              label: response.data[i].组号,
              value: response.data[i].组件流水号
            })
          }
        })
      } else {
        this.GroupNumValue = ''
        this.GroupNum = []
      }
    },
    // 根据项目机床分组查零件/物料
    searchPartinfo() {
      this.ProjectValue ? this.ProjectValue_check = 1 : this.ProjectValue_check = 0
      this.MachineValue ? this.MachineValue_check = 1 : this.MachineValue_check = 0
      this.GroupNumValue ? this.GroupNumValue_check = 1 : this.GroupNumValue_check = 0
      this.searchOwnPart() // 自制件
      this.searchPurchasePart() // 采购部采购件
    },
    // 删除领料单
    dropListinfor(row) {
      this.$confirm('此操作将永久删除该行, 是否继续?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        if (this.tableDataPicking.length === 0) {
          dropList(row.备料领料单流水号).then(response => {
            if (response.data[0].result === '1') {
              this.$message.success('删除成功')
              this.searchListinfor()
            } else {
              this.$message.error('数据占用')
            }
          })
        } else {
          this.$message.error('数据占用')
        }
      }).catch(() => {
        this.$message({
          type: 'info',
          message: '已取消删除'
        })
      })
    },
    // 查询自家备料
    searchOwnPart() {
      this.tableDataBasic = []
      this.listLoading1 = true
      searchBasicPart(this.PageCurrent1, this.PageSize1, this.ProjectValue_check, this.ProjectValue, this.MachineValue_check, this.MachineValue, this.GroupNumValue_check, this.GroupNumValue).then(response => {
        this.tableDataBasic = response.data.rows
        this.total1 = response.data.total
        this.listLoading1 = false
      })
    },
    // 自制件分页
    handleSizeChange1(val) {
      this.PageCurrent1 = 1
      this.PageSize1 = val
      this.searchOwnPart()
    },
    handleCurrentChange1(val) {
      this.PageCurrent1 = val
      this.searchOwnPart()
    },
    // 查询外购备料
    searchPurchasePart() {
      this.tableDataPurchase = []
      this.listLoading2 = true
      searchPurchasePart(this.PageCurrent2, this.PageSize2, this.ProjectValue_check, this.ProjectValue, this.MachineValue_check, this.MachineValue, this.GroupNumValue_check, this.GroupNumValue).then(response => {
        this.tableDataPurchase = response.data.rows
        this.listLoading2 = false
        this.total2 = response.data.total
      })
    },
    // 采购部采购件分页
    handleSizeChange2(val) {
      this.PageCurrent2 = 1
      this.PageSize2 = val
      this.searchPurchasePart()
    },
    handleCurrentChange2(val) {
      this.PageCurrent2 = val
      this.searchPurchasePart()
    },
    // 自家备料领料
    addBasicList(row) {
      addBasicList(this.pickingListNumberx, row.工艺计划流水号).then(response => {
        if (response.data[0].result === '1') {
          this.$message.success('删除成功')
          this.searchListDetailt()
          this.searchPartinfo()
        } else {
          this.$message.error('数据占用')
        }
      })
    },
    // 外购备料领料
    addPurchaseList(row) {
      addPurchaseList(this.pickingListNumberx, row.工艺计划流水号).then(response => {
        if (response.data[0].result === '1') {
          this.$message.success('删除成功')
          this.searchListDetailt()
          this.searchPartinfo()
        } else {
          this.$message.error('数据占用')
        }
      })
    }
  }
}
</script>

<style scoped>
  .el-card{
    margin-bottom: 15px;
  }
  .el-select{
    width:200px
  }
  .el-input{
    width:200px
  }
  span{
    margin: 10px 0 10px 10px;
  }
  .el-tag{
    margin: 0
  }
</style>
