<!--
  @description: 新增招标计划--物料组信息
  @author: sunxinman/haofengxian
  @routerPath: /tenderPlan/tenderPlanAdd/materielInfo
  @date: 2019-12-23 22:35:58
-->
<template>
  <div>
    <el-form ref="form" :model="formData">
      <!--=======================================================物料组信息=======================================================-->
      <div class="mb16">
        <el-button type="primary" @click="addDetailTr">
          添加物料组
        </el-button>
      </div>
      <div>
        <el-table
          ref="smallTable"
          :data="tableData"
        >
          <el-table-column
            label="序号"
            type="index"
            align="center"
          />
          <el-table-column
            header-align="center"
            label="物料组编码"
            prop="biddingMaterialGroupId"
          />
          <el-table-column
            header-align="center"
            label="物料组名称"
            prop="biddingMaterialGroupName"
          />
          <el-table-column
            header-align="center"
            label="型号"
            prop="biddingSectionEquipmentSpecs"
          />
          <el-table-column
            header-align="center"
            label="数量"
            prop="biddingAmount"
            align="right"
          />
          <el-table-column
            label="单位"
            prop="biddingMeterageUnit"
            header-align="center"
            align="center"
          />
          <el-table-column
            header-align="center"
            label="预算单价（元）"
            prop="schemeBudgetUnit"
            align="right"
          />
          <el-table-column
            header-align="center"
            label="预算总价（元）"
            prop="schemeBudgetSum"
            align="right"
          />
          <el-table-column
            label="操作"
            width="100"
            align="center"
          >
            <template slot-scope="scope">
              <el-link
                v-if="!scope.row.state"
                type="primary"
                @click.stop="editRow(scope.row)"
              >
                [编辑]
              </el-link>
              <el-link
                type="primary"
                @click.stop="delTr(scope.$index,scope.row)"
              >
                [删除]
              </el-link>
            </template>
          </el-table-column>
        </el-table>
      </div>
      <!-- 保存按钮 -->
      <div class="but_footer">
        <div class="but_footer-h">
          <div class="but_footer-but">
            <el-button @click="prevForm">
              上一步
            </el-button>
            <el-button :loading="confirmLoading" @click="submitForm('form', '01')">
              保存
            </el-button>
            <el-button :loading="confirmLoading" type="primary" @click="submitForm('form', '00')">
              下一步
            </el-button>
          </div>
        </div>
      </div>
    </el-form>
    <!-- 物料组弹框-->
    <materielDialog ref="materiel" :tender-plan-data="tenderPlanData" @getPurchasesPlan="getPretenderingPurchasesPlan" />
  </div>
</template>
<script>
import materielDialog from './materiel-dialog'
import { saveBatchPretenderingPurchasesPlan, getPretenderingPurchasesPlanById, removePretenderingPurchasesPlanById } from '@/api/purchasePlan/pretcloudPurchasescheme'
export default {
  name: 'DetailInfo',
  components: {
    materielDialog
  },
  props: {
    // 接收步骤条父页面信息
    tenderPlanData: {
      type: Object,
      default: function() {
        return {
          id: ''
        }
      }
    }
  },
  data() {
    return {
      confirmLoading: false, // 暂存Loding
      formData: {
        pretPurchaseschemePretenderingPurchasesPlanDtoList: []// 招标计划信息
      },
      tableData: [] // 表格数据
    }
  },
  mounted() {
    this.getPretenderingPurchasesPlan()
  },
  methods: {
    //  根据id获取招标计划信息
    getPretenderingPurchasesPlan() {
      getPretenderingPurchasesPlanById(this.tenderPlanData.id).then(res => {
        if (res.data) {
          this.tableData = [...res.data]
        }
      })
    },
    // 下一步
    submitForm(formName, type) {
      this.tableData.forEach(val => {
        val.state = false
        val.schemeId = this.tenderPlanData.id
        val.createUser = this.$store.getters.info.userName
        val.updateUser = this.$store.getters.info.userName
        val.useStatus = '00'
      })
      this.formData.pretPurchaseschemePretenderingPurchasesPlanDtoList = [...this.tableData]
      if (this.tableData.length) {
        this.confirmLoading = true// btnLoding
        saveBatchPretenderingPurchasesPlan(this.formData).then(() => {
          if (type === '00') {
            this.$emit('stepPage', 'next')
          } else {
            this.$message({
              type: 'success',
              message: '保存成功'
            })
            this.getPretenderingPurchasesPlan()
          }
          this.confirmLoading = false// btnLoding
        }).catch(() => {
          this.confirmLoading = false// btnLoding
        })
      } else {
        if (type === '00') {
          this.$emit('stepPage', 'next')
        }
      }
    },
    // 单行删除
    delTr(index, row) {
      this.$confirm('此操作将删除该条物料组信息, 是否继续？', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        confirmButtonClass: 'confirmBtn',
        cancelButtonClass: 'cancelBtn',
        type: 'warning'
      }).then(() => {
        removePretenderingPurchasesPlanById(row.id).then(() => {
          this.tableData.splice(index, 1)
        })
      }).catch(() => {
      })
    },
    // 添加物料
    addDetailTr() {
      this.$refs.materiel.openMaterielDialog(this.tableData) // 打开子组件弹框新增物料
    },
    // 单行编辑
    editRow(row) {
      this.$refs.materiel.openMaterielDialog(this.tableData, row) // 打开子组件弹框编辑
    },
    // 上一步
    prevForm() {
      this.$emit('stepPage', 'prev')
    }
  }
}
</script>
<style lang="less" scoped>
</style>
