<!--
  @description: 发起评审费报销-发放明细
  @Modifier: sunxinman/肖文龙
  @routerPath: /fee/evalfeeApplyStep/evalfeeGrant-add
  @date: 2020/04/14-15:20
-->
<template>
  <div>
    <section>
      <p class="mb10" style="text-align: right;">
        小计：<span style="color:red;margin-right:6px">{{ moneyFormat(realMoney) }}</span>元
      </p>
      <el-table
        :data="tableData"
      >
        <el-table-column
          type="index"
          label="序号"
          width="60"
          fixed="left"
          align="center"
        />
        <!-- 姓名 -->
        <el-table-column
          prop="expertName"
          min-width="140px"
          fixed="left"
          align="center"
          label="姓名"
        />
        <!-- 身份证号 -->
        <el-table-column
          prop="idCard"
          min-width="200"
          align="center"
          fixed="left"
          label="身份证号"
        />
        <!-- 评标人员类型 -->
        <el-table-column
          prop="evalPersonType"
          align="center"
          fixed="left"
          width="100"
          label="评标人员类型"
        >
          <template slot-scope="scope">
            <span v-for="(item,index) in evalPersonTypeList" v-if="scope.row.evalPersonType===item.typecode" :key="index">
              {{ item.typename }}
            </span>
          </template>
        </el-table-column>
        <!-- 实发金额（元） -->
        <el-table-column
          width="200"
          prop="realMoney"
          header-align="center"
          align="right"
          label="实发金额（元）"
        >
          <template slot-scope="scope">
            {{ scope.row.realMoney?moneyFormat(Number(scope.row.realMoney).toFixed(2)):scope.row.realMoney }}
          </template>
        </el-table-column>
        <!-- 单日评审费（元） -->
        <el-table-column
          header-align="center"
          width="200"
        >
          <template slot="header">
            <span class="red-star">*</span>
            <span>单日评审费（元）</span>
            <money :thousands="true" :money-value="fromData" size="mini" width="100%" name="dayEvalMoney" @input="batchFinalPayingAmount" />
          </template>
          <template slot-scope="scope">
            <!--金额组件-->
            <money :thousands="true" :money-value="scope.row" size="mini" width="100%" name="dayEvalMoney" @input="finalPaying" />
          </template>
        </el-table-column>
        <!-- 评审天数 -->
        <el-table-column
          header-align="center"
          min-width="200"
        >
          <template slot="header">
            <span class="red-star">*</span>
            <span>评审天数</span>
            <money :thousands="true" :unit-fixed="0" :money-value="fromData" size="mini" width="100%" name="evalDayNumber" @input="batchFinalPayingAmount" />
          </template>
          <template slot-scope="scope">
            <money :thousands="true" :unit-fixed="0" :money-value="scope.row" size="mini" width="100%" name="evalDayNumber" @input="finalPaying" />
          </template>
        </el-table-column>
        <!-- 加班费 -->
        <el-table-column
          header-align="center"
          min-width="200"
          align="right"
        >
          <template slot="header">
            <span class="red-star">*</span>
            <span>加班费（元）</span>
            <money :thousands="true" :unit-fixed="0" :money-value="fromData" size="mini" width="100%" name="overtMoney" @input="batchFinalPayingAmount" />
          </template>
          <template slot-scope="scope">
            <money :thousands="true" :money-value="scope.row" size="mini" width="100%" name="overtMoney" @input="finalPaying" />
          </template>
        </el-table-column>
        <el-table-column
          header-align="center"
          label="操作"
          fixed="right"
          align="center"
          width="130"
        >
          <template slot-scope="scope">
            <el-link
              type="primary"
              @click="editRow(scope.row)"
            >
              [编辑]
            </el-link>
            <el-link
              type="primary"
              @click="viewRow(scope.row)"
            >
              [查看]
            </el-link>
          </template>
        </el-table-column>
      </el-table>
    </section>
    <!--保存按钮-->
    <div class="but_footer">
      <div class="but_footer-h">
        <div class="but_footer-but">
          <el-button @click="prevStep">
            上一步
          </el-button>
          <el-button :loading="confirmLoading" type="primary" @click="submitData">
            提交
          </el-button>
        </div>
      </div>
    </div>
    <!-- 查看专家信息弹框组件 -->
    <viewExpert :dialog-data="dialogDataView" />
    <!-- 编辑专家信息弹框组件 -->
    <editExpert :dialog-data="dialogDataEdit" @GetByMeetingIdStageId="GetByMeetingIdStageId" />
  </div>
</template>

<script>
/* 接口*/
import { getBiddingExpertAuditInfoPageList, getByMeetingIdStageIds } from '@/api/intensiveeval/intensiveeval'//
import { queryByIdEvalFeeDetailInfos, addOrUpdateEvalFeeDetail } from '@api/fee/evalfee'
/* 常用方法 */
import { moneyFormat, totalHeadCount } from '@assets/js/utils'
/* 混合 */
import { evalFeeGroupMixin } from '@views/fee/evalfee/mixins/evalFeeGroupMixin'// 字典
/* 组件*/
import viewExpert from './viewExpert-dialog' // 查看专家信息弹框组件
import editExpert from './editExpert-dialog' // 编辑专家信息弹框组件
import money from '@comp/common/money/money'// 金额组件
/* 公用方法*/
export default {
  name: 'EvalfeeGrantAdd',
  components: {
    viewExpert, // 查看专家信息弹框组件
    editExpert, // 编辑专家信息弹框组件
    money// 金额组件
  },
  mixins: [evalFeeGroupMixin],
  props: {
    // 接收tab父页面信息
    evalFeeData: {
      type: Object,
      default: function() {
        return {
          evalFeeId: '', // 评审费id
          meetingId: ''// 会议id
        }
      }
    }
  },
  data() {
    return {
      moneyFormat: moneyFormat, // 千分位转换
      confirmLoading: false, // Lodding
      meetingId: this.$route.params.meetingId, // 会议id
      // 批量填写金额
      fromData: {
        dayEvalMoney: 0, // 单日评审费
        evalDayNumber: 0, // 评审天数
        overtMoney: 0 // 加班费
      },
      realMoney: 0.00, // 实发金额小计（元）
      tableData: [],
      // 查看专家信息弹框
      dialogDataView: {
        dialog: false,
        data: {}, // 查看时需要的参数
        datailId: ''// 明细id
      },
      // 编辑专家信息弹框
      dialogDataEdit: {
        dialog: false,
        data: {}, // 编辑时需要的参数
        datailId: ''// 明细id
      }
    }
  },
  created() {
    // 判断是否有评审id
    if (this.evalFeeData.evalFeeId) {
      this.initData()// 查询发放明细
    }
  },
  methods: {
    // 获取阶段id
    GetByMeetingIdStageId() {
      getByMeetingIdStageIds(this.evalFeeData.meetingId).then(res => {
        this.GetBiddingExpertAuditInfoPageList(res.data)// 获取专家初始数据
      })
    },
    // 获取专家初始数据
    GetBiddingExpertAuditInfoPageList(stageIds) {
      this.tableData = []
      const params = {
        pageNo: 1, // 第几页
        pageSize: 9999, // 几条数据
        stageIds: stageIds// 阶段id
      }// 查询条件
      getBiddingExpertAuditInfoPageList(params).then(res => {
        const tableData = res.data
        // 专家信息
        const data = {
          dayEvalMoney: 0, // 单日评审费
          evalDayNumber: '', // 评审天数
          evalPersonType: '', // 评标人员类型
          expertName: '', // 专家名称
          id: '', // 明细ID
          idCard: '', // 身份证号
          overtMoney: 0, // 加班费
          realMoney: 0, // 实发金额
          salaryMoney: 0 // 应发金额
        }
        // 遍历专家信息进行合并
        tableData.forEach(item => {
          const datas = {
            ...data, ...item,
            openAddress: item.bankAddress, // 开户地址
            cardNumber: item.bankCard // 银行卡号
          }
          this.tableData.push(datas)
        })
        this.batchFinalPayingAmount()// 批量计算-实发金额
      }).catch(() => {

      })
    },
    // 查询发放明细
    initData() {
      queryByIdEvalFeeDetailInfos(this.evalFeeData.evalFeeId).then(res => {
        this.tableData = res.data
        if (this.tableData.length) { // 判断查询接口是否已有数据-如果有则计算某个专家的评审费总额
          this.batchFinalPayingAmount()// 批量计算-实发金额
        } else { // 判断查询接口是否已有数据-如果没有则-获取专家初始数据
          this.GetByMeetingIdStageId()// 获取专家初始数据>获取专家初始数据
        }
      })
    },
    // 批量计算-实发金额
    batchFinalPayingAmount() {
      this.realMoney = 0.00 // 实发金额
      this.tableData.forEach(item => {
        item.dayEvalMoney = this.fromData.dayEvalMoney// 单日评审费
        item.evalDayNumber = this.fromData.evalDayNumber// 评审天数
        item.overtMoney = this.fromData.overtMoney// 加班费
        this.finalPayingAmount(item)// 实发金额计算
      })
    },
    // 单计算-实发金额
    finalPaying() {
      this.realMoney = 0.00 // 实发金额
      this.tableData.forEach(item => {
        this.finalPayingAmount(item)// 实发金额计算
      })
    },
    // 实发金计算
    finalPayingAmount(row) {
      // 需要计算相加的参数
      const data = {
        dayEvalMoney: row.dayEvalMoney // 日工资
      }
      // 当天数有数据时&&必须是数字才能执行
      if (row.evalDayNumber && typeof Number(row.evalDayNumber) === 'number' && typeof Number(row.overtMoney) === 'number') {
        // 计算的日总金额*天数
        row.realMoney = (totalHeadCount(data) * Number(row.evalDayNumber)) + Number(row.overtMoney)
      } else {
        row.realMoney = 0.00
      }
      // 实发金额小计
      this.realMoney += row.realMoney
      this.realMoney.toFixed(2)
    },
    // 编辑
    editRow(row) {
      this.dialogDataEdit = {
        dialog: true,
        data: row,
        datailId: row.id// 明细id
      }
    },
    //  查看
    viewRow(row) {
      this.dialogDataView = {
        dialog: true,
        data: row,
        datailId: row.id// 明细id
      }
    },
    // 上一步
    prevStep() {
      this.$emit('stepPage', 'prev')// 步骤条切换方法 prev 上一步
    },
    // 数据组装
    assemblyData() {
      this.tableData.forEach(item => {
        item.evalFeeid = this.evalFeeData.evalFeeId // 评审id
        item.meetingId = this.evalFeeData.meetingId // 会议id
      })
      return this.tableData
    },
    // 提交
    submitData() {
      if (this.tableData.length > 0) {
        const data = this.assemblyData()// 数据组装
        this.$confirm('是否确认提交?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          confirmButtonClass: 'confirmBtn',
          cancelButtonClass: 'cancelBtn',
          type: 'warning'
        }).then(() => {
          this.confirmLoading = true
          addOrUpdateEvalFeeDetail(data).then(() => {
            this.$message({
              message: '提交成功',
              type: 'success'
            })
            this.confirmLoading = false
            this.$router.push('/fee/evalfeeApply-list')
          }).catch(() => {
            this.confirmLoading = false
          })
        })
      } else {
        this.$message({
          message: '没有专家信息',
          type: 'warning'
        })
      }
    }
  }
}
</script>

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