<!--
  @description:合同-验收-行项目信息
  @Modifier:郝定康
  @routerPath:
  @date:2021-11-27 11:25:33
-->
<template>
  <!--选择物料弹框-->
  <el-dialog
    v-dialogDrag
    :visible.sync="dialogData.dialog"
    :close-on-click-modal="false"
    title="行项目列表"
    append-to-body
    width="1040px"
    custom-class="el-dialog__body-p8 el-dialog_table"
  >
    <div>
      <el-table
        ref="schemeMaterialTable"
        v-loading="loading"
        :data="tableList"
        :row-key="getRowKeys"
        size="mini"
        @selection-change="selectRow"
      >
        <el-table-column
          :reserve-selection="true"
          fixed="left"
          type="selection"
          width="45"
        />
        <el-table-column
          type="index"
          label="序号"
          align="center"
          width="50"
        />
        <el-table-column
          prop="purchasePlanNo"
          label="采购计划编号"
          align="center"
        />
        <el-table-column
          prop="purchaseNo"
          label="行项目编号"
          align="center"
        />
        <el-table-column
          prop="productNo"
          label="产品编码"
          align="center"
        />
        <el-table-column
          prop="productName"
          label="产品名称"
          align="center"
        />
        <!-- <el-table-column
        prop="supplyDepartName"
        label="产品描述"
            align="center"
      /> -->
        <el-table-column
          prop="unitName"
          label="计量单位"
          align="center"
        />
        <el-table-column
          prop="quantity"
          label="成交数量"
          align="center"
        />
        <el-table-column
          prop="taxRate"
          label="税率"
          align="center"
        />
        <el-table-column
          prop="price"
          label="含税单价（元）"
          align="center"
        />
        <el-table-column
          prop="totalPrice"
          label="总金额（元）"
          align="center"
        />
        <!-- <el-table-column
        prop="supplyDepartName"
        label="不含税单价（元）"
            align="center"
      /> -->
        <!-- <el-table-column
        prop="supplyDepartName"
        label="交货地点"
            align="center"
      /> -->
      </el-table>
      <pagination :pagination-data="paginationData" @change="loadData" />
    </div>
    <div slot="footer" class="dialog-footer">
      <el-button :loading="confirmLoading" type="primary" @click="sureMaterial">
        确 定
      </el-button>
      <el-button @click="dialogData.dialog = false">
        取 消
      </el-button>
    </div>
  </el-dialog>
</template>

<script>
/* 接口*/
import { findListContractDetailInfoPage } from '@/api/contractManagement/index'
/* 公共方法*/
import { filterObj } from '@/assets/js/utils'// 过滤空的key
/* 组件*/
import pagination from '@comp/common/pagination/pagination'// 分页
/* 混合开发*/
import { ListMixin } from '@/mixins/ListMixin'
export default {
  name: 'AcceptanceLineItemInfoDialog',
  components: {
    pagination
  },
  mixins: [ListMixin],
  props: {
    dialogData: {
      type: Object,
      default: () => {
        return {
          dialog: false
        }
      }
    }
  },
  data() {
    return {
      // 获取row的key值
      getRowKeys(row) {
        return row.id
      },
      loading: true,
      tableList: [], // 计划物料列表
      confirmLoading: false, // 按钮Loding
      selectData: [], // 弹框勾选的商品列表
      searchForm: {
      }
    }
  },
  watch: {
    'dialogData.dialog': {
      handler(val) {
        this.loadData()
      },
      immediate: true
    }
  },
  methods: {
    // 分页获取所有未关联的招标计划与物料列表
    loadData() {
      window.console.log(this.getQueryParams())
      const params = this.getQueryParams() // 查询条件
      findListContractDetailInfoPage(params).then(response => {
        const { data } = response
        this.tableList = data.records
        this.paginationData.total = data.total
        this.loading = false
      }).catch(() => {
        this.loading = false
      })
    },
    // 选择物料
    selectRow(val) {
      this.selectData = val
    },
    // 查询条件
    getQueryParams() {
      const param = Object.assign({}, this.searchForm)
      param.pageNo = this.paginationData.pageNo
      param.pageSize = this.paginationData.pageSize
      param.contractId = this.dialogData.id
      param.ids = this.dialogData.ids
      return filterObj(param)
    },
    // 选择商品弹框 确认
    sureMaterial() {
      if (this.selectData.length > 0) {
        this.dialogData.dialog = false// 关闭弹窗
        // // 返回已选中
        this.$emit('lineItemSelect', this.selectData)
      } else {
        this.$message.warning('请选择行项目')
      }
    },
    // 重置
    resetForm(formName) {
      this.paginationData.pageNo = 1
      this.paginationData.pageSize = 10
      this.$refs[formName].resetFields()
      this.loadData()
    },
    // 搜索
    search() {
      this.paginationData.pageNo = 1
      this.paginationData.pageSize = 10
      this.loadData()
    }
  }
}
</script>

<style scoped></style>
