<template>
  <at-table
    @load="loadData"
    :data="data"
    :page-result="pageResult"
    ref="AtTable"
    :default-sorter="[{direction: 'DESC', property: 'registerDate'}]"
    :dialogTitle="dialogTitle"
    :dialogVisible="dialogVisible"
    :isDrag="false"
    :exportText="'导出审批单'"
    :cellClassNameFn="cellClassNameFn"
    @select-all="handleSelect"
    @select="handleSelect"
    @handleDialogCancel="handleDialogCancel"
    @handleDialogClose="handleDialogClose"
    @handleDialogSubmit="handleDialogSubmit"
    @row-dblclick="handleRowDBClick"
    @handleDialogExport="handleDialogExport"
  >
    <template v-slot:searchInput>
      <el-form
        ref="searchForm"
        :model="searchForm"
        label-width="80px"
        class="search-top"
        @submit.native.prevent
      >
        <el-date-picker
          v-model="searchForm.registerDate"
          type="date"
          placeholder="选择审批日期"
          value-format="yyyy-MM-dd"
          format="yyyy-MM-dd"
          style="width: 100%"
          @keyup.enter.native="findinfo"
        >
        </el-date-picker>
        <el-button
          size="small"
          @click="findinfo"
          type="primary"
          class="el-icon-search search-btn"
          >查询</el-button
        >
        <el-button
          size="small"
          @click="handleReset"
          type="primary"
          plain
          class="el-icon-refresh"
          >重置</el-button
        >
      </el-form>
    </template>
    <template v-slot:operationBtn>
      <el-button
        size="small"
        type="primary"
        @click="handleAdd"
        icon="el-icon-plus"
        >添加</el-button
      >
      <ht-delete-button
        :url="deleteUrl"
        :requestMethod="'POST'"
        :htTable="$refs.AtTable"
        >删除</ht-delete-button
      >
      <import-file :importData="importData" @load="load"></import-file>
      <el-button
        size="small"
        type="primary"
        @click="handleExport"
        icon="el-icon-download"
        plain
        style="margin-left: 10px"
        >导出</el-button
      >
      <el-button
        v-if="isShow"
        type="primary"
        plain
        icon="el-icon-back"
        @click="handleBack"
        >返回</el-button
      >
    </template>
    <template>
      <el-table-column type="selection" width="55" align="center">
      </el-table-column>
      <el-table-column type="index" label="序号" align="center" width="55">
      </el-table-column>
      <!-- <el-table-column
        prop="projectInfo.projectCode"
        label="项目代码"
        align="center"
        width="150"
        :show-overflow-tooltip="true"
      >
      </el-table-column> -->
      <el-table-column
        prop="projectInfo.projectName"
        label="项目名称"
        :show-overflow-tooltip="true"
        min-width="150"
        align="center"
      >
      </el-table-column>
      <el-table-column
        prop="contractInfo.name"
        label="合同名称"
        :show-overflow-tooltip="true"
        min-width="150"
        align="center"
      >
      </el-table-column>
      <!-- <el-table-column
        prop="contractAgreement"
        label="合同协议(份)"
        align="center"
        width="100"
        :show-overflow-tooltip="true"
      >
      </el-table-column> 
      <el-table-column
        prop="dept"
        label="部室(子公司)"
        align="center"
        width="150"
        :show-overflow-tooltip="true"
      >
      </el-table-column>
      <el-table-column
        prop="handlerPerson"
        label="经办人"
        align="center"
        width="130"
        :show-overflow-tooltip="true"
      >
      </el-table-column>-->
      <!--<ht-table-column
        prop="haveFundPlan"
        label="是否有资金计划"
        align="center"
        width="150"
        :show-overflow-tooltip="true"
        :filters="getDictData('jdgl-sfyzjjh')"
      >
        <template v-slot="{row}">
          <el-tag :type="row.haveFundPlan == 0 ? 'success' : 'danger'">{{
            row.haveFundPlan == 0 ? '是' : '否'
          }}</el-tag>
        </template>
      </ht-table-column>
       <el-table-column
        prop="measurementData"
        label="计量资料(份)"
        align="center"
        width="100"
        :show-overflow-tooltip="true"
      >
      </el-table-column>
      <el-table-column
        prop="outputValue"
        label="当前完成值"
        align="center"
        width="100"
        :show-overflow-tooltip="true"
      >
      </el-table-column> -->
      <ht-table-column
        prop="purpose"
        label="用途"
        align="center"
        :show-overflow-tooltip="true"
      >
        <template v-slot="{row}">
          <span v-if="row.purpose !== '----'">
            {{ getDictName('jdgl-yt', row.purpose) }}
          </span>
          <span v-else>----</span>
        </template>
      </ht-table-column>
      <el-table-column
        prop="registerDate"
        label="审批日期"
        align="center"
        width="130"
        :show-overflow-tooltip="true"
      >
      </el-table-column>
      <!--<el-table-column
        prop="registerPersonName"
        label="登记人"
        align="center"
        :show-overflow-tooltip="true"
      >
      </el-table-column>
       <el-table-column
        prop="settlementBillNum"
        label="票据号码"
        align="center"
        :show-overflow-tooltip="true"
      >
      </el-table-column>
      <el-table-column
        prop="settlementBillType"
        label="结算票据"
        align="center"
        :show-overflow-tooltip="true"
      >
        <template slot-scope="scope">
          <div>
            {{ getDictName('jdgl-jspj', scope.row.settlementBillType) }}
          </div>
        </template>
      </el-table-column>
      <el-table-column
        prop="supervisorContract"
        label="监理合同(份)"
        align="center"
        width="100"
        :show-overflow-tooltip="true"
      >
      </el-table-column> -->
      <el-table-column
        prop="totalInvestment"
        label="总投资金额(元)"
        align="center"
        width="150"
        :show-overflow-tooltip="true"
      >
        <template v-slot="{row}">
          <span v-if="row.totalInvestment !== '----'">
            {{ row.totalInvestment && moneyFormatter(row.totalInvestment) }}
          </span>
          <span v-else>----</span>
        </template>
      </el-table-column>
      <el-table-column
        prop="payeeAmountTotal"
        label="本次拨款额(元)"
        align="center"
        width="150"
        :show-overflow-tooltip="true"
      >
        <template v-slot="{row}">
          {{ row.payeeAmountTotal && moneyFormatter(row.payeeAmountTotal) }}
        </template>
      </el-table-column>
      <el-table-column
        prop="amountAppropriated"
        label="已拨款额(元)"
        align="center"
        width="150"
        :show-overflow-tooltip="true"
      >
        <template v-slot="{row}">
          <span v-if="row.amountAppropriated !== '----'">
            {{
              row.amountAppropriated && moneyFormatter(row.amountAppropriated)
            }}
          </span>
          <span v-else>----</span>
        </template>
      </el-table-column>
      <!-- <el-table-column
        prop="remarks"
        label="备注"
        align="center"
        width="120"
        :show-overflow-tooltip="true"
      >
      </el-table-column> -->
    </template>
    <template v-slot:dialogContent>
      <el-form
        ref="form"
        v-form
        data-vv-scope="form"
        :model="form"
        label-width="130px"
        v-if="dialogVisible"
        :rules="rules"
        v-loading.fullscreen="loading"
      >
        <el-descriptions class="margin-top" :column="2" border>
          <!-- <template slot="extra">
          <el-button
            type="primary"
            size="small"
          >操作</el-button>
        </template> -->
          <el-descriptions-item
            :labelStyle="{width: '100px', 'text-align': 'center'}"
          >
            <template slot="label"> 项目名称 </template>
            <el-input
              v-model="form.projectInfo.projectName"
              placeholder="请选择项目名称"
              @focus="handleFocusProject"
              clearable
              :disabled="true"
            >
              <el-button
                type="primary"
                @click="handleFocusProject"
                slot="append"
                icon="el-icon-search"
              ></el-button>
            </el-input>
          </el-descriptions-item>
          <el-descriptions-item
            :labelStyle="{width: '100px', 'text-align': 'center'}"
          >
            <template slot="label">
              <span class="contarctName">合同名称</span>
            </template>
            <el-input
              v-model="form.contractInfo.name"
              placeholder="请选择合同名称"
              @focus="handleFocusContract"
              clearable
            >
              <el-button
                type="primary"
                @click="handleFocusContract"
                slot="append"
                icon="el-icon-search"
              ></el-button>
            </el-input>
          </el-descriptions-item>
          <el-descriptions-item
            :labelStyle="{width: '100px', 'text-align': 'center'}"
          >
            <template slot="label"> 部室(子公司) </template>
            <el-input
              v-model="form.dept"
              placeholder="请输入部室"
              clearable
            ></el-input>
          </el-descriptions-item>
          <el-descriptions-item
            :labelStyle="{width: '100px', 'text-align': 'center'}"
          >
            <template slot="label"> 审批日期 </template>
            <el-date-picker
              v-model="form.registerDate"
              type="date"
              placeholder="选择审批日期"
              value-format="yyyy-MM-dd"
              format="yyyy-MM-dd"
              style="width: 100%"
              @change="handleChangeRegisterDate"
            >
            </el-date-picker>
          </el-descriptions-item>
          <el-descriptions-item
            :labelStyle="{width: '100px', 'text-align': 'center'}"
          >
            <template slot="label"> 用途 </template>
            <dict-select
              dictCode="jdgl-yt"
              :hasDefaultOption="true"
              :filterable="true"
              clearable
              placeholder="请选择用途"
              v-model="form.purpose"
              style="width: 100%"
            />
          </el-descriptions-item>
          <el-descriptions-item
            :labelStyle="{width: '100px', 'text-align': 'center'}"
          >
            <template slot="label"> 总投资额 </template>
            <el-input
              v-model="form.totalInvestment"
              placeholder="请输入总投资额"
              clearable
            >
              <i slot="suffix">元</i>
            </el-input>
          </el-descriptions-item>
          <el-descriptions-item
            :labelStyle="{width: '100px', 'text-align': 'center'}"
          >
            <template slot="label"> 已拨款额 </template>
            <el-input
              v-model="form.amountAppropriated"
              placeholder="请输入已拨款额"
              clearable
            >
              <i slot="suffix">元</i>
            </el-input>
          </el-descriptions-item>
          <el-descriptions-item
            :labelStyle="{width: '100px', 'text-align': 'center'}"
          >
            <template slot="label"> 票据号码 </template>
            <el-input
              v-model="form.settlementBillNum"
              placeholder="请输入票据号码"
              clearable
            >
            </el-input>
          </el-descriptions-item>
          <el-descriptions-item
            :labelStyle="{width: '100px', 'text-align': 'center'}"
          >
            <template slot="label"> 本次拨款额 </template>
            <el-input
              v-model="form.payeeAmountTotal"
              placeholder="请输入本次拨款额"
              clearable
            >
              <i slot="suffix">元</i>
            </el-input>
          </el-descriptions-item>
          <el-descriptions-item
            :labelStyle="{width: '100px', 'text-align': 'center'}"
          >
            <template slot="label"></template>
          </el-descriptions-item>
          <el-descriptions-item
            :span="2"
            :labelStyle="{width: '100px', 'text-align': 'center'}"
          >
            <template slot="label"> 项目进度情况及已完成工作量 </template>
            <el-input
              v-model="form.measurementData"
              placeholder="请输入项目进度情况及已完成工作量"
              type="textarea"
              rows="5"
              clearable
            >
            </el-input>
          </el-descriptions-item>
          <el-descriptions-item
            :labelStyle="{width: '100px', 'text-align': 'center'}"
          >
            <template slot="label"> 收款单位 </template>
            <el-input
              v-model="form.registerPersonName"
              placeholder="请输入收款单位"
              type="textarea"
              rows="2"
              clearable
            >
            </el-input>
          </el-descriptions-item>
          <el-descriptions-item
            :labelStyle="{width: '100px', 'text-align': 'center'}"
          >
            <template slot="label"> 账号 </template>
            <el-input
              v-model="form.handlerPerson"
              placeholder="请输入账号"
              type="textarea"
              rows="2"
              clearable
            >
            </el-input>
          </el-descriptions-item>
          <el-descriptions-item
            :span="2"
            :labelStyle="{width: '100px', 'text-align': 'center'}"
          >
            <template slot="label"> 开户行 </template>
            <el-input
              v-model="form.registerPersonId"
              placeholder="请输入开户行"
              type="textarea"
              rows="2"
              clearable
            >
            </el-input>
          </el-descriptions-item>
          <el-descriptions-item
            :span="2"
            :labelStyle="{width: '100px', 'text-align': 'center'}"
          >
            <template slot="label"> 备注 </template>
            <el-input
              v-model="form.remarks"
              placeholder="请输入备注"
              type="textarea"
              clearable
            >
            </el-input>
          </el-descriptions-item>
        </el-descriptions>
        <file-table
          @handleFile="handleFile"
          :file="form.accessoryInfo"
          :info="'上传支付审批相关文件'"
          style="margin-top: 10px"
        />
      </el-form>
      <!-- <el-form
        ref="form"
        v-form
        data-vv-scope="form"
        :model="form"
        :rules="rules"
        label-width="130px"
        v-if="dialogVisible"
        v-loading.fullscreen="loading"
      >
        <el-row>
          <el-col :span="12">
            <el-form-item
              label="项目名称"
              prop="projectInfo.projectName"
            >
              <el-input
                v-model="form.projectInfo.projectName"
                placeholder="请选择项目名称"
                @focus="handleFocusProject"
                clearable
                :disabled="!isShow"
              >
                <el-button
                  type="primary"
                  @click="handleFocusProject"
                  slot="append"
                  icon="el-icon-search"
                ></el-button>
              </el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item
              label="合同名称"
              prop="contractInfo.name"
            >
              <el-input
                v-model="form.contractInfo.name"
                placeholder="请选择合同名称"
                @focus="handleFocusContract"
                clearable
              >
                <el-button
                  type="primary"
                  @click="handleFocusContract"
                  slot="append"
                  icon="el-icon-search"
                ></el-button>
              </el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item
              label="部室(子公司)"
              prop="dept"
            >
              <el-input
                v-model="form.dept"
                placeholder="请输入部室"
                clearable
              ></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item
              label="审批日期"
              prop="registerDate"
            >
              <el-date-picker
                v-model="form.registerDate"
                type="date"
                placeholder="选择审批日期"
                value-format="yyyy-MM-dd"
                format="yyyy-MM-dd"
                style="width: 100%"
              >
              </el-date-picker>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item
              label="用途"
              prop="purpose"
            >
              <dict-select
                dictCode="jdgl-yt"
                :hasDefaultOption="true"
                clearable
                placeholder="请选择用途"
                v-model="form.purpose"
                style="width: 100%"
              />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item
              label="总投资额"
              prop="totalInvestment"
            >
              <el-input
                v-model="form.totalInvestment"
                placeholder="请输入总投资额"
                clearable
              >
                <i slot="suffix">元</i>
              </el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item
              label="已拨款额"
              prop="amountAppropriated"
            >
              <el-input
                v-model="form.amountAppropriated"
                placeholder="请输入已拨款额"
                clearable
              >
                <i slot="suffix">元</i>
              </el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item
              label="票据号码"
              prop="settlementBillNum"
            >
              <el-input
                v-model="form.settlementBillNum"
                placeholder="请输入票据号码"
                clearable
              >
              </el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item
              label="本次拨款额"
              prop="payeeAmountTotal"
            >
              <el-input
                v-model="form.payeeAmountTotal"
                placeholder="请输入本次拨款额"
                clearable
              >
                <i slot="suffix">元</i>
              </el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="24">
            <el-form-item
              label="收款单位"
              prop="registerPersonName"
            >
              <el-input
                v-model="form.registerPersonName"
                placeholder="请输入收款单位"
                type="textarea"
                :rows="2"
                clearable
              >
              </el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="24">
            <el-form-item
              label="账号"
              prop="handlerPerson"
            >
              <el-input
                v-model="form.handlerPerson"
                placeholder="请输入账号"
                type="textarea"
                :rows="2"
                clearable
              >
              </el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="24">
            <el-form-item
              label="开户行"
              prop="registerPersonId"
            >
              <el-input
                v-model="form.registerPersonId"
                placeholder="请输入开户行"
                type="textarea"
                :rows="2"
                clearable
              >
              </el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="24">
            <el-form-item
              label="项目进度情况及已完成工作量"
              prop="measurementData"
            >
              <el-input
                v-model="form.measurementData"
                placeholder="请输入项目进度情况及已完成工作量"
                type="textarea"
                :rows="2"
                clearable
              >
              </el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="24">
            <el-form-item
              label="备注"
              prop="remarks"
            >
              <el-input
                v-model="form.remarks"
                placeholder="请输入备注"
                type="textarea"
                :rows="2"
                clearable
              >
              </el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <file-table
          @handleFile="handleFile"
          :file="form.accessoryInfo"
          :info='"上传工程支付审批文件"'
        />
      </el-form> -->
    </template>
    <template v-slot:showTotalData>
      <span class="show-slected">
        已选中<i>{{ selected.numbers }}</i>
        条数据， 拨款金额合计
        <i>{{ moneyFormatter(selected.payeeAmountTotal) }} </i>元
      </span>
    </template>
    <project-info-dialog
      ref="project"
      :single="true"
      @select="handleSelectProject"
    ></project-info-dialog>
    <project-contract-dialog
      ref="contract"
      :single="true"
      @select="handleSelectContract"
    ></project-contract-dialog>
  </at-table>
</template>
<script>
const eipUserSelector = () =>
  import('@/components/selector/EipUserSelector.vue')
import ProjectInfoDialog from '@/components/dialog/ProjectInfoDialog.vue'
import ProjectContractDialog from '@/components/dialog/ProjectContractDialog.vue'
import {duration} from 'moment'
import utils from '@/utils.js'
import req from '@/request.js'
const BigNumber = require('bignumber.js')
export default {
  name: 'PaymentApproval',
  components: {
    ProjectInfoDialog,
    ProjectContractDialog,
    // eipUserSelector
  },
  props: {
    pid: {
      type: String,
      default: '',
    },
    isShow: {
      type: Boolean,
      default: true,
    },
    alias: {
      type: String,
      default: '',
    },
  },
  data() {
    return {
      total: {
        projectInfo: {
          projectName: '合计',
        },
        contractInfo: {
          name: '----',
        },
        purpose: '----',
        registerDate: '----',
        totalInvestment: '----',
        payeeAmountTotal: 0,
        amountAppropriated: '----',
      },
      selected: {
        numbers: 0,
        payeeAmountTotal: '0',
      },
      options: [
        {
          id: '50001023600050001574',
          label: '50001023600050001574',
        },
        {
          id: '500501004141000002640040',
          label: '500501004141000002640040',
        },
      ],
      importData: {
        title: '工程支付导入',
        templateName: '支付审批模板.xlsx',
        downloadUrl: '/../fvue/static/excel/PaymentApproval.xlsx',
        importUrl:
          window.context.cqxy +
          '/biz/processManagement/progressManage/v1/importExcelData',
        showProject: true,
        showContract: true,
        projectId: '',
        contractId: '',
        // params: {
        //   contractId: '',
        //   // registerPersonId: '',
        //   // registerPersonName: '',
        // },
      },
      importDataDetailed: {
        title: '拨款明细导入',
        templateName: '拨款明细模板.xls',
        downloadUrl: '/../fvue/static/excel/PaymentApprovalList.xlsx',
        importUrl:
          window.context.cqxy +
          '/biz/processManagement/progressManageDefinite/v1/readExcelData',
      },
      projectObj: {}, //获取当前项目
      searchForm: {
        projectId: '',
        dept: '',
        registerDate: '',
      }, //顶部搜索参数
      dataBaseOptions: {
        dataBaseId: '',
        tableName: '', // 必填
        tableSchema: '',
      },
      ConstructionModeArr: [],
      ProjectTypeArr: [],
      originAPIOptions: {
        url: '', // 列表请求接口地址
        method: 'post', // 列表请求方法
        moduleRoot: '', // 微服务根路径
      },
      exportQuery: {},
      data: [], //表格数据
      pageResult: {
        page: 1,
        pageSize: 20,
        total: 0,
      },
      form: {
        contractInfo: {
          name: '',
          id: '',
        },
        projectInfo: {
          projectName: '',
          projectCode: '',
        },
      }, //基本信息表单
      dialogVisible: false,
      dialogTitle: '添加',
      selectionArr: [],
      active: 0,
      loading: false,
      routeKey: '',
      rules: {
        'projectInfo.projectName': {
          required: true,
          message: '请选择项目名称',
          trigger: 'blur',
        },
        'contractInfo.name': {
          required: true,
          message: '请选择合同名称',
          trigger: 'blur',
        },
        purpose: {
          required: true,
          message: '请选择用途',
          trigger: 'change',
        },
      },
      routerParams: null,
    }
  },
  computed: {
    deleteUrl: function () {
      return (
        window.context.cqxy + '/biz/processManagement/progressManage/v1/delete'
      )
    },
  },

  methods: {
    //重置
    handleReset() {
      this.searchForm.projectId = ''
      this.searchForm.dept = ''
      this.searchForm.registerDate = ''
      this.$refs['searchForm'].resetFields()
      this.pageResult = {
        page: 1,
        pageSize: 20,
        total: 0,
      }
      this.$nextTick(() => {
        this.$refs.AtTable.load()
      })
    },
    countTotal() {
      let arr = this.form.definiteInfo
      let total = 0
      arr.forEach((item) => {
        if (item.payeeAmount !== '') {
          let pay = parseFloat(item.payeeAmount)
          total += pay
        } else {
          this.form.payeeAmountTotal = 0
        }
      })
      this.form.payeeAmountTotal = total
      this.form.amountTotalWords = utils.convertCurrency(total)
    },
    //打开合同信息
    handleFocusContract() {
      this.$refs.contract.open(this.form.projectId)
    },
    //选择合同信息
    handleSelectContract(data) {
      // console.log(data,'data')
      this.form.totalInvestment = data.contractAmount

      if (!data.payee) {
        this.form.registerPersonName = data.payeeAccountPhone
      } else {
        this.form.registerPersonName = data.payee
      }

      this.form.contractId = data.id
      this.form.contractInfo.name = data.name
      this.form.contractInfo.id = data.id
      this.form.handlerPerson = data.payeeAccount
      this.form.registerPersonId = data.payeeContactPhone

      let params = {
        projectId: this.form.projectId,
        registerDate: this.form.registerDate,
        contractId: this.form.contractId,
      }
      this.$http
        .post(
          '${cqxy}/biz/processManagement/progressManage/v1/getAppropriatedl',
          params
        )
        .then((res) => {
          if (res.data.state) {
            this.form.amountAppropriated = res.data.value
          }
        })
    },
    filterHandler(value, row, column) {
      const property = column['property']
      return row[property] === value
    },
    //导入后重新加载数据
    load() {
      this.$refs.AtTable.load()
    },
    //导出
    handleExport() {
      let query = [
        {
          group: 'filter',
          operation: 'EQUAL',
          property: 'purpose',
          relation: 'AND',
          value: '1',
        },
      ]
      let search = {
        'pm.ID_': this.searchForm.projectId,
        register_date_: this.searchForm.registerDate,
        register_person_name_: this.searchForm.registerPersonName,
      }
      if (this.pid) {
        search['pm.ID_'] = this.pid
        this.importData.projectId = this.pid
      } else if (this.routerParams) {
        search['pm.ID_'] = this.$route.params.id
        search.contract_id_ = this.routerParams.contract.id
      }
      for (let i in search) {
        if (search[i]) {
          query.push({
            group: 'advance',
            operation: 'LIKE',
            property: i,
            relation: 'AND',
            value: search[i],
          })
        }
      }
      let param = {
        pageBean: {
          page: 1,
          pageSize: -1,
          showTotal: true,
        },

        querys: query,
        sorter: [],
      }
      console.log(param)
      req
        .downloadPostCopy(
          '${cqxy}/biz/processManagement/progressManage/v1/exportDataToExcel',
          param
        )
        .then((res) => {
          if (res.status === 200) {
            this.$message.success('导出成功')
          } else {
            this.$message.error('导出失败')
          }
        })
    },
    loadDetailed(data) {
      for (let i = 0; i < data.length; i++) {
        data[i].key = this.form.definiteInfo.length + i
      }
      this.form.definiteInfo.push(...data)
      this.countTotal()
    },
    handleExportDetailed() {
      let param = {
        pageBean: {
          page: 1,
          pageSize: -1,
          showTotal: true,
        },
        querys: [],
        sorter: [],
      }
      req
        .downloadPostCopy(
          '${cqxy}/biz/processManagement/progressManageDefinite/v1/exportDataToExcel',
          param
        )
        .then((res) => {
          if (res.status === 200) {
            this.$message.success('导出成功')
          } else {
            this.$message.error('导出失败')
          }
        })
    },
    //上一步
    prevSteps() {
      this.active--
      this.active = this.active
    },
    //下一步
    nextSteps() {
      if (this.active == 0) {
        let _this = this
        let vaitalArr = [
          'projectInfo.projectName',
          // 'projectInfo.projectCode',
          'contractInfo.name',
          // 'registerPersonName',
        ]
        Promise.all(
          vaitalArr.map((item) => {
            const p = new Promise((resolve, reject) => {
              _this.$refs.form.validateField(item, (vaild) => {
                resolve(vaild)
              })
            })
            return p
          })
        ).then((result) => {
          result = result.filter((item) => item)
          if (!result.length) {
            this.active++
            this.active = this.active
            this.$refs['form'].clearValidate()
          }
        })
      } else {
        this.active++
        this.active = this.active
        this.$refs['form'].clearValidate()
      }
    },
    handleAdd() {
      this.dialogTitle = '添加'
      let date = new Date()
      this.form = {
        purpose: 1,
        haveFundPlan: 1,
        handlerPerson: '',
        projectId: this.$route.params.id,
        contractId: '',
        payeeAmountTotal: 0,
        registerPersonId: '',
        registerPersonName: '',
        totalInvestment: '',
        amountAppropriated: '',
        registerDate: utils.formatDateYear(date),
        month: (date.getMonth() + 1).toString(),
        year: date.getFullYear().toString(),
        contractInfo: {
          name: '',
          id: '',
        },
        definiteInfo: [],
        dept: '建设部',
        projectInfo: {
          projectName: this.$route.params.projectName,
          projectCode: '',
        },
        accessoryInfo: [],
      }
      if (this.routerParams) {
        if (this.data.length) {
          let data = this.data[0]
          this.form.contractId = data.contractId
          this.form.contractInfo.name = data.contractInfo.name
          this.form.registerPersonName = data.registerPersonName
          this.form.handlerPerson = data.handlerPerson
          this.form.registerPersonId = data.registerPersonId
          this.form.totalInvestment = data.totalInvestment
        } else {
          let data = this.routerParams.contract
          this.form.contractId = data.id
          this.form.contractInfo.name = data.name //合同名称
          this.form.registerPersonName = data.payee //收款单位
          this.form.totalInvestment = data.contractAmount
        }
      }
      let params = {
        projectId: this.form.projectId,
        registerDate: this.form.registerDate,
        contractId: this.form.contractId,
      }
      this.$http
        .post(
          '${cqxy}/biz/processManagement/progressManage/v1/getAppropriatedl',
          params
        )
        .then((res) => {
          if (res.data.state) {
            this.form.amountAppropriated = res.data.value
          }
        })
      this.dialogVisible = true
      // console.log(this.form)
    },
    handleRowDBClick(data) {
      this.dialogTitle = '修改'
      this.$http
        .post(
          '${cqxy}/biz/processManagement/progressManage/v1/detail/' + data.id
        )
        .then((res) => {
          this.dialogVisible = true
          let response = res.data.value
          if (!response.contractInfo) {
            let obj = {
              contractInfo: {},
            }
            this.form = {...response, ...obj}
          } else {
            this.form = response
          }
          // this.form.year = this.form.year
          this.form.month = this.form.month.toString()
        })
    },
    handleFocusProject() {
      this.$refs.project.open()
    },
    handleSelectProject(data) {
      this.form.contractInfo.name = ''
      this.form.contractInfo.id = ''
      this.form.projectId = data.id
      this.form.projectInfo.projectCode = data.projectCode
      this.form.projectInfo.projectName = data.projectName
      // this.form.handlerPerson = data.projectManager
      this.$refs.form.clearValidate()
    },
    handleSelect(selection) {
      selection.forEach((item, index) => {
        if (item.projectInfo.projectName === '合计') {
          selection.splice(index, 1)
        }
      })
      this.selected.numbers = selection.length
      let total = this.calculationTotal(selection, 'payeeAmountTotal')
      this.selected.payeeAmountTotal = total
    },
    handleDialogCancel() {
      this.dialogVisible = false
      this.active = 0
      this.form = {
        projectId: '',
        contractId: '',
        registerPersonId: '',
        registerPersonName: '',
        payeeAmountTotal: 0,
        contractInfo: {},
        definiteInfo: [],
        projectInfo: {},
        accessoryInfo: [],
      }
      /* 发送一个事件用于侧边栏按钮监听是否显示 */
      this.$bus.$emit('handleAsideBtn', true)
    },
    handleDialogClose() {
      this.dialogVisible = false
      this.active = 0
      this.form = {
        projectId: '',
        contractId: '',
        payeeAmountTotal: 0,
        registerPersonId: '',
        registerPersonName: '',
        contractInfo: {},
        definiteInfo: [],
        projectInfo: {},
        accessoryInfo: [],
      }
    },
    handleFile(file) {
      this.form.accessoryInfo = file
    },
    //保存
    handleDialogSubmit() {
      if (!this.form.contractId) return this.$message.info('请选择合同名称')
      if (this.form.accessoryInfo && this.form.accessoryInfo.length > 0) {
        this.form.accessoryInfo.forEach((item) => {
          if (item.id) {
            delete item.id
          }
        })
      }
      if (this.form.payeeAmountTotal == 0) {
        this.$message.error(`'本次拨款额'不能为0元`)
        return
      }
      this.loading = true
      this.$http
        .post('${cqxy}/biz/processManagement/progressManage/v1/save', this.form)
        .then((res) => {
          if (res.data.state) {
            // this.$refs.form.resetFields()
            this.$message.success(res.data.message)
            // this.handleDialogClose()
            this.$refs.AtTable.load()
            this.form = res.data.value
          } else {
            this.$message.error(res.data.message)
          }
          this.loading = false
        })
        .catch((err) => {
          this.loading = false
        })
    },
    loadData(param, cb) {
      let query = [
        {
          group: 'filter',
          operation: 'EQUAL',
          property: 'purpose',
          relation: 'AND',
          value: '1',
        },
      ]
      let search = {
        'pm.ID_': this.searchForm.projectId,
        register_date_: this.searchForm.registerDate,
        register_person_name_: this.searchForm.registerPersonName,
      }
      this.routerParams = JSON.parse(sessionStorage.getItem('routerParams'))
      if (this.pid) {
        search['pm.ID_'] = this.pid
        this.importData.projectId = this.pid
      } else if (this.routerParams) {
        search['pm.ID_'] = this.$route.params.id
        search.contract_id_ = this.routerParams.contract.id
        this.importData.projectId = this.$route.params.id
        this.importData.contractId = this.routerParams.contract.id
        this.importData.showContract = false
        query = []
      }
      for (let i in search) {
        if (search[i]) {
          query.push({
            group: 'main',
            operation: 'LIKE',
            property: i,
            relation: 'AND',
            value: search[i],
          })
        }
      }
      if (param.querys && param.querys.length) {
        param.querys.push(...query)
      } else {
        param.querys = query
      }
      this.$http
        .post('${cqxy}/biz/processManagement/progressManage/v1/page', param)
        .then(
          (resp) => {
            let response = resp.data.value
            this.selected = {
              numbers: 0,
              payeeAmountTotal: '0',
            }
            let data = response.rows
            // this.total.totalInvestment = this.calculationTotal(
            //   data,
            //   'totalInvestment'
            // )
            this.total.payeeAmountTotal = this.calculationTotal(
              data,
              'payeeAmountTotal'
            )
            // this.total.amountAppropriated = this.calculationTotal(
            //   data,
            //   'amountAppropriated'
            // )
            if (data.length !== 0) {
              data.push(this.total)
            }
            this.data = data
            this.pageResult = {
              page: response.page,
              pageSize: response.pageSize,
              total: response.total,
            }
          },
          (error) => {
            reject(error)
          }
        )
        .finally(() => {
          if (cb) {
            cb()
          }
        })
    },
    findinfo() {
      this.$refs.AtTable.load()
    },
    addListItem() {
      let length
      length = this.form.definiteInfo.length
      let newData = {
        key: length + 1,
        subjectName: '',
        payeeUnit: '重庆建工集团股份有限公司',
        bankOfDeposit: '中国建设银行重庆中山路支行营业部',
        payeeAmount: '',
        payeeNum: '',
        purpose: 1,
        remarks: '',
      }
      this.form.definiteInfo.push(newData)
    },

    deleteTableData(key, id) {
      this.form.definiteInfo = this.form.definiteInfo.filter((item) => {
        if (key) {
          return item.key !== key
        } else {
          return item.id !== id
        }
      })

      this.countTotal()
      if (id) {
        this.$http
          .remove(
            '${cqxy}/biz/processManagement/progressManageDefinite/v1/' + id
          )
          .then((res) => {
            if (res.data.state) {
              this.$message.success(res.data.message)
            } else {
              this.$message.error(res.data.message)
            }
          })
      }
    },
    handleChangeRegisterDate(date) {
      let params = {
        projectId: this.form.projectId,
        registerDate: date,
        contractId: this.form.contractId,
      }
      this.$http
        .post(
          '${cqxy}/biz/processManagement/progressManage/v1/getAppropriatedl',
          params
        )
        .then((res) => {
          if (res.data.state) {
            this.form.amountAppropriated = res.data.value
          }
        })
    },
    handleDialogExport() {
      if (this.form.id) {
        req
          .downloadGetCopy(
            '${cqxy}/biz/processManagement/progressManage/v1/exportApprovalForm?id=' +
              this.form.id
          )
          .then((res) => {
            if (res.status == 200) {
              this.$message.success('导出成功')
            } else {
              this.$message.error('导出失败')
            }
          })
      } else {
        this.$message.error('请先保存这条数据')
      }
    },
    handleBack() {
      this.$router.push({
        name: 'ProjectFlowChart',
        params: {
          id: this.$route.params.id,
          alias: this.routerParams.alias,
        },
      })
    },
    // 计算列表合同金额合计金额
    calculationTotal(data, key) {
      let total = new BigNumber(0)
      if (key && data && data.length !== 0) {
        data.forEach((item) => {
          if (item[key]) {
            total = total.plus(item[key])
          } else {
            total = total.plus(0)
          }
        })
      }
      return this.moneyFormatter(total)
    },
    cellClassNameFn(row) {
      // 列表项目名称为【合计】隐藏复选框
      if (row.row.projectInfo.projectName === '合计') {
        return 'table-column-hidden'
      }
    },
  },
  destroyed() {
    // this.routerParams=JSON.parse( sessionStorage.getItem('routerParams'))
    sessionStorage.removeItem('routerParams')
  },
}
</script>
<style lang="scss" scoped>
@import '@/assets/css/common.scss';

/deep/ .el-step.is-simple:not(:last-of-type) .el-step__title {
  max-width: 60% !important;
}
.button-box {
  display: flex;
  justify-content: flex-end;
  // position: absolute;
  // bottom: 30px;
  // right: 30px;
  div {
    padding: 10px;
    background: #2f86ff;
    margin: 10px;
    border-radius: 4px;
    cursor: pointer;
    color: #ffffff;
  }
}
.loading {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  i {
    font-size: 30px;
  }
}
.modelDiv {
  position: absolute;
  width: 1000px;
  height: 700px;
  top: 50px;
  left: 0;
  background-color: rgba($color: #000000, $alpha: 0.2);
}
.btnDetailed {
  display: flex;
  // margin-bottom: 20px;
}
// .totalBorder {
//   width: 100%;
// }
.totalBorder > div {
  padding-right: 10px;
  float: right;
  font-size: 16px;
}
.totalBorder > div > span {
  color: red;
}
.contarctName {
  position: relative;
}
.contarctName::before {
  position: absolute;
  content: '*';
  display: inline-block;
  color: red;
  top: -2px;
  left: -12px;
  font-size: 18px;
}
.show-slected {
  font-size: 18px;
  i {
    font-style: normal;
    font-weight: 700;
    margin: 0 5px;
    color: #f40;
  }
}
/deep/ .table-column-hidden .el-checkbox__input {
  display: none;
}
/deep/ .table-column-hidden .cell > div {
  display: none;
}
</style>
