<template>
  <el-dialog
    v-dialogDrag
    title="发料"
    :visible.sync="open"
    width="1200px"
    append-to-body
    :before-close="handleClose"
    @open="dialogOpen"
    @close="dialogClose"
  >
    <el-table
      v-loading="loading"
      :data="list"
      border
      size="mini"
    >
      <el-table-column
        label="物料编码"
        align="center"
        prop="materialNo"
        width="130"
        show-overflow-tooltip
      />
      <el-table-column
        label="物料名称"
        align="center"
        prop="materialName"
        width="120"
        show-overflow-tooltip
      />
      <el-table-column label="规格型号" align="center" prop="materialModels" />
      <el-table-column label="物料类别" align="center" prop="categoryNumber" />
      <el-table-column label="需求数量" align="center" prop="needQty" />
      <el-table-column label="补领数量" align="center" prop="reApplyQty">
        <template slot-scope="scope">
          <el-button type="text" @click="handleRepairIssue(scope.row)">{{ scope.row.reApplyQty }}</el-button>
        </template>
      </el-table-column>
      <el-table-column
        label="单位"
        align="center"
        prop="unitCode"
        width="60"
      />
      <el-table-column
        label="累计已发数量"
        align="center"
        prop="totalSendCount"
        width="120"
      />
      <el-table-column label="已退数量" align="center" prop="rejectCount" />
      <el-table-column
        label="本次发料数"
        align="center"
        prop="currentSendCount"
        width="90"
      />
      <el-table-column
        label="剩余待发数"
        align="center"
        prop="overplusSendCount"
        width="90"
      />
      <el-table-column
        label="操作"
        align="center"
        class-name="small-padding fixed-width"
        fixed="right"
        width="160"
      >
        <template slot-scope="scope">
          <el-button
            v-hasPermi="['wms:out-stock-detail:query']"
            size="mini"
            type="text"
            icon="el-icon-thumb"
            @click="handleIssue(scope.row)"
          >发料</el-button>
          <el-button
            v-hasPermi="['wms:out-stock-detail:query']"
            size="mini"
            type="text"
            icon="el-icon-view"
            @click="handleView(scope.row)"
          >查看</el-button>
        </template>
      </el-table-column>
    </el-table>
    <div slot="footer" class="dialog-footer">
      <!-- <el-button :loading="buttonLoading" type="primary" @click="finishIssueInSome">完成发料-部分</el-button>
      <el-button :loading="buttonLoading" type="primary" @click="finishIssueInAll">完成发料-全部</el-button> -->
      <el-button :loading="buttonLoading" type="primary" @click="handleScanCode">扫码签收</el-button>
      <el-button :loading="buttonLoading" plain @click="handleCancel">取消</el-button>
    </div>
    <pagination
      v-show="total > 0"
      :total="total"
      :page.sync="queryParams.pageNo"
      :limit.sync="queryParams.pageSize"
      @pagination="getList"
    />
    <!-- 发料 -->
    <Issue ref="issue" @scanCodeComplete="codeIssueComplete" />
    <!-- 查看 -->
    <ViewIssue ref="viewIssue" />

    <!-- 发料扫码 -->
    <ScanCode ref="scanCode" @complete="scanComplete" />

    <!-- <el-dialog
      v-dialogDrag
      :visible.sync="codeOpen"
      width="600px"
      append-to-body
      @close="issueCodeClose"
    >
      <el-form
        ref="queryForm"
        :model="queryParams"
        size="small"
        label-width="68px"
        @submit.native.prevent
      >
        <el-form-item label="员工工号" prop="encodedEmployeeId">
          <el-input
            v-model="form.encodedEmployeeId"
            placeholder="请输入/扫入员工工号"
            clearable
            @keyup.enter.native="finishIssueInSome"
          />
        </el-form-item>
      </el-form>
    </el-dialog> -->

  </el-dialog>
</template>

<script>
import { getSendRejectDetailPage, updateCompetePart, updateCompeteAll } from '@/api/wms/output/productionIssue'
import Issue from './Issue.vue'
import ViewIssue from './ViewIssue.vue'
import ScanCode from './ScanCode.vue'

export default {
  components: {
    Issue,
    ViewIssue,
    ScanCode
  },
  data() {
    return {
      // 遮罩层
      loading: true,
      // 总条数
      total: 0,
      // WMS 生产发料 主列表
      list: [],
      // 弹出层标题
      title: '',
      // 是否显示弹出层
      open: false,
      // 点击扫码发料
      codeOpen: false,
      buttonLoading: false,
      ids: '',
      // 查询参数
      queryParams: {
        pageNo: 1,
        pageSize: 10,
        masterId: null
      },
      form: {}
    }
  },
  methods: {
    /** 查询列表 */
    getList() {
      this.loading = true
      // 执行查询
      getSendRejectDetailPage(this.queryParams).then(response => {
        this.list = response.data.list
        this.total = response.data.total
      }).finally(() => {
        this.loading = false
      })
    },
    // 查看
    handleView(row) {
      const { id } = row
      this.$refs.viewIssue.open = true
      this.$refs.viewIssue.title = '查看发料明细'
      this.$refs.viewIssue.queryParams.id = id
      this.$refs.viewIssue.getList()
    },
    // 发料
    handleIssue(row) {
      const { id } = row
      this.$refs.issue.queryParams.id = id
      this.$refs.issue.queryParams.reApplyFlag = 0
      this.$refs.issue.open = true
      this.$refs.issue.title = '生产-发料'
    },
    // 补料发料
    handleRepairIssue(row) {
      const { id } = row
      this.$refs.issue.queryParams.id = id
      this.$refs.issue.queryParams.reApplyFlag = 1
      this.$refs.issue.title = '补料-发料'
      this.$refs.issue.open = true
    },
    // 扫码签收
    handleScanCode() {
      this.$refs.scanCode.list = this.list
      this.$refs.scanCode.codeOpen = true
    },
    // 完成发料-部分
    finishIssueInSome() {
      if (this.form.encodedEmployeeId === undefined || this.form.encodedEmployeeId === '') {
        this.$modal.msgWarning('请先输入/扫入员工工号')
        return
      }
      this.$modal.confirm('您正在执行发料，是否继续？').then(() => {
        const params = {
          masterId: this.list[0].masterId,
          encodedEmployeeId: this.form.encodedEmployeeId
        }
        // const isIssueSuccess = this.list.some(item => item.sendQty !== null)
        // if (!isIssueSuccess) {
        //   this.$modal.msgWarning('发料失败~请先添加要发料的物料信息')
        //   return
        // }
        this.buttonLoading = true
        updateCompetePart(params).then(res => {
          this.$modal.msgSuccess('操作成功')
          this.open = false
          this.codeOpen = false
          this.buttonLoading = false
          this.$emit('complete')
          this.getList()
        })
      }).finally(() => {
        this.buttonLoading = false
      }).catch(() => {
        this.$modal.msg('您已取消操作')
      })
    },
    // 完成发料-全部
    finishIssueInAll() {
      this.$modal.confirm('您正在执行发料-全部操作，是否继续？').then(() => {
        const params = {
          masterId: this.list[0].masterId
        }
        const isSuccess = this.list.every(item => item.needQty <= item.sendQty && item.sendQty !== null)
        if (!isSuccess) {
          this.$modal.msgWarning('发料失败~发料数量必须大于需求数量')
          return
        }
        this.buttonLoading = true
        updateCompeteAll(params).then(res => {
          this.$modal.msgSuccess('操作成功')
          this.open = false
          this.buttonLoading = false
          this.$emit('complete')
          this.getList()
        }).finally(() => {
          this.buttonLoading = false
        })
      }).catch(() => {
        this.$modal.msg('您已取消操作')
      })
    },
    handleCancel() {
      this.open = false
      this.currentRows = []
    },
    handleClose(done) {
      this.currentRows = []
      done && done()
    },
    dialogOpen() {
      this.$nextTick(() => {
        this.getList()
      })
    },
    dialogClose() {
      this.queryParams.pageNo = 1
      this.getList()
    },
    // 扫码签收关闭
    issueCodeClose() {
      this.form.encodedEmployeeId = undefined
    },
    scanComplete() {
      this.open = false
      this.getList()
      this.$emit('issueComplete')
    },
    // 扫码发料成功
    codeIssueComplete() {
      this.getList()
      this.$emit('codeComplete')
    }
  }
}
</script>

  <style>

  </style>

