<template>
  <div>
    <!-- 收货明细 -->
    <el-dialog
      title="收货单明细"
      :visible.sync="dialogVisibleDetial"
      width="70%"
      v-loading="loading"
      top="7vh"
      :modal-append-to-body="false"
      :before-close="handleDialogCloseDetial"
    >
      <div class="dialog-table-search">
        <el-form
          ref="form"
          label-width="auto"
          label-position="right "
          :inline="true"
          type="flex"
          justify="left"
        >
          <el-form-item label="物料名称">
            <el-input
              size="small"
              v-model="queryParamsDetial[0].value"
              clearable
              placeholder="物料名称"
            ></el-input>
          </el-form-item>
          <el-form-item label="">
            <el-button
              size="small"
              icon="el-icon-search"
              type="danger"
              class="btn btn-plus"
              @click="handleSearchDetial"
            >
              搜索
            </el-button>
            <el-button
              size="small"
              icon="el-icon-refresh-right"
              class="btn btn-plus"
              @click="clearSearchFormDetial"
            >
              重置
            </el-button>
          </el-form-item>
        </el-form>
      </div>
      <div class="dialog-table">
        <el-table
          ref="multipleSelection"
          v-loading="loading"
          border
          size="mini"
          :data="tableData"
          height="400px"
          :row-key="rowKey"
          :style="{width: '100%', height: '500px'}"
          :cell-style="{'text-align': 'center'}"
          :header-cell-style="{'text-align': 'center'}"
          @selection-change="handleSelectionChange"
        >
          <el-table-column align="center" type="selection" prop="id" width="55">
          </el-table-column>
          <el-table-column
            label="企业物料编号"
            min-width="100"
            show-overflow-tooltip
            prop="matCode"
          >
          </el-table-column>
          <el-table-column
            label="平台物料编号"
            min-width="100"
            show-overflow-tooltip
            prop="matPlatcode"
          >
          </el-table-column>
          <el-table-column
            label="物料名称"
            min-width="80"
            show-overflow-tooltip
            prop="matName"
          >
          </el-table-column>
          <el-table-column
            label="物料牌号"
            min-width="100"
            show-overflow-tooltip
            prop="matMaterial"
          >
          </el-table-column>
          <el-table-column
            label="规格型号"
            min-width="80"
            show-overflow-tooltip
            prop="matSpec"
          >
          </el-table-column>
          <el-table-column
            label="计划编号"
            min-width="100"
            show-overflow-tooltip
            prop="planCode"
          >
          </el-table-column>
          <el-table-column label="计量单位" min-width="100" prop="matUnit">
          </el-table-column>
          <el-table-column label="收货数量" min-width="130" prop="arrivalNum">
          </el-table-column>
          <el-table-column label="税率(%)" min-width="110" prop="taxRate">
          </el-table-column>
          <el-table-column
            label="含税单价(元)"
            min-width="130"
            prop="taxInprice"
          >
          </el-table-column>
          <el-table-column
            label="含税金额(元)"
            min-width="130"
            prop="taxInvalue"
          >
          </el-table-column>
          <el-table-column
            label="不含税单价(元)"
            min-width="130"
            prop="price"
          >
          </el-table-column>
          <el-table-column
            label="不含税金额(元)"
            min-width="130"
            prop="amount"
          >
          </el-table-column>
          <el-table-column
            label="税额(元)"
            min-width="110"
            prop="taxValue"
          >
          </el-table-column>
          <el-table-column
            label="基础扩展"
            min-width="100"
            show-overflow-tooltip
            prop="matBaseExt"
          >
          </el-table-column>
          <el-table-column
            label="其他扩展"
            min-width="100"
            show-overflow-tooltip
            prop="matOtherExt"
          >
          </el-table-column>
          <el-table-column
            label="挂账时间"
            min-width="100"
            show-overflow-tooltip
            prop="pendingTime"
          >
          </el-table-column>
          <el-table-column
            label="送货地址"
            min-width="100"
            show-overflow-tooltip
            prop="unloadAddress"
          >
          </el-table-column>
          <el-table-column
            label="企业补充说明"
            min-width="110"
            prop="purNote"
            show-overflow-tooltip
          >
          </el-table-column>
          <el-table-column
            label="供货方补充说明"
            min-width="110"
            prop="vendorNote"
            show-overflow-tooltip
          >
          </el-table-column>
        </el-table>
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button @click="dialogVisibleDetial = false"> 取 消 </el-button>
        <el-button type="primary" @click="handleDialogTableSubmitDetial">
          确 定
        </el-button>
      </span>
    </el-dialog>
  </div>
</template>

<script>
export default {
  props: {
    useOrgList: Array,
  },
  data() {
    return {
      dialogVisibleDetial: false,
      tableData: [],
      receiptList: [],
      loading: false,
      queryParamsDetial: [
        {
          group: 'main',
          operation: 'LIKE',
          parentGroup: '',
          property: 'matName',
          relation: 'AND',
          value: '',
        },
      ],
      selectArr: [],
    }
  },
  methods: {
    handleOpen(row) {
      this.receiptList = row
      this.dialogVisibleDetial = true
      this.getTableDataDetial()
      this.$nextTick(function () {
        this.selectArr = this.useOrgList
        this.useOrgList.forEach((item) => {
          this.tableData.forEach((data) => {
            if (data.id == item.id) {
              this.$refs.multipleSelection.toggleRowSelection(item, true) //这样就可以了
            }
          })
        })
      })
      
    },
    getTableDataDetial() {
      this.loading = true
      let ids = this.receiptList.map((item) => {
        return item.id
      })
      let params = {
        querys: [],
        pageBean: {
          page: -1,
          pageSize: -1,
        },
      }
      if (this.queryParamsDetial[0].value) {
        params.querys.push(this.queryParamsDetial[0])
      }
      params.querys.push({
        group: 'main',
        operation: 'IN',
        parentGroup: '',
        property: 'receiptId',
        relation: 'AND',
        value: ids,
      })
      this.$http
        .post('${portal}/bizReceiptDetail/v1/page', params)
        .then((res) => {
          this.loading = false
          if(res.data.state){
            this.tableData = res.data.value.rows
          }
          
          
        })
    },
    handleSelectionChange(val) {
      this.selectArr = val
    },
    handleSearchDetial() {
      this.getTableDataDetial()
    },
    clearSearchFormDetial() {
      this.queryParamsDetial[0].value = ''
      this.getTableDataDetial()
    },
    handleDialogTableSubmitDetial() {
      if (this.selectArr.length == 0) {
        this.$message.error('请选择收货明细')
        return
      }
      this.selectArr.forEach((item) => {
        item.taxValue = 0
        item.isdQuantity = ''
        item.isdPrice = ''
        item.isdAmount = ''
        item.matId = item.id
      })
      let arr = this.selectArr
      arr.forEach((item) => {
        item.receiptDetailId = item.id
        item.isdQuantity = item.receiptNum
        item.taxValue = (
          (item.taxInvalue / (1 + item.taxRate / 100)) *
          (item.taxRate / 100)
        ).toFixed(2)
        item.isdPrice = item.price
        item.isdAmount = item.amount
      })
      this.$emit('load', arr)
      this.handleDialogCloseDetial()
    },
    handleDialogCloseDetial() {
      this.$refs.multipleSelection.clearSelection()
      this.dialogVisibleDetial = false
    },
    rowKey(row) {
      return row.id
    },
  },
}
</script>

<style lang="scss" scoped>
</style>