<template>
  <el-dialog title="社保申报信息" v-model="visible" width="100%" append-to-body draggable @close="close"
    :close-on-click-modal="false">
    <!-- <div slot="title" class="dialog-title-container">
      <span class="title-label"><i class="el-icon-document" /> 工资信息</span>
      <i class="el-icon-close" @click="close" />
    </div> -->
    <!-- 功能按钮 -->
    <div v-loading="loading">
      <div style="padding: 8px 24px 16px 24px">
        <el-form size="small" label-width="100px" v-model="form">
          <el-row :gutter="30">
            <el-col :span="12">
              <el-form-item label="客户名称">
                <div>{{ form.companyName }}</div>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="所属月份">
                <!-- <div>{{ form.year }}-{{ form.month }}</div> -->
                <el-date-picker v-model="currentMonth" type="month" placeholder="请选择时间" format="YYYY-MM"
                  @change="changeMonthHandle" />
              </el-form-item>
            </el-col>
            <el-col v-if="form.status === 4" :span="12">
              <el-form-item label="驳回原因">
                <div>{{ form.feedbackContent }}</div>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="政务网账号" required class="edit-label">
                <template #label>
                  <div>政务网账号</div>
                </template>
                <div>{{ form.governmentAccountNo }}</div>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="政务网密码" required class="edit-label">
                <template #label>
                  <div>政务网密码</div>
                </template>
                <div>{{ form.governmentPassword }}</div>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="社保账号" required class="edit-label">
                <template #label>
                  <div>社保账号</div>
                </template>
                <div>{{ form.socialSecurityAccountNo }}</div>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="社保密码" required class="edit-label">
                <template #label>
                  <div>社保密码</div>
                </template>
                <div>{{ form.socialSecurityPassword }}</div>
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item label="用工密码" required class="edit-label">
                <template #label>
                  <div>用工密码</div>
                </template>
                <div>{{ form.employeePassword }}</div>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="单位工伤险比例:" required  label-width="130px">
                <div v-if="form.status !== 3">
                  <el-input-number v-model="form.injuryRadio" size="small" placeholder="单位工伤险比例" :precision="2"
                    :controls="false" style="width: 80%;" @change="changeUnitInjuryRadio" />
                  <span style="margin-left: 5px;">%</span>
                </div>
                <div v-else>{{ rowNum(form.injuryRadio) }}</div>
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <div style="display: flex; justify-content: flex-end;margin-bottom: 10px;" v-hasPermi="['business:socialSecurityDeclare:exportDetail']">
                <el-button type="primary" @click="exportExcel" v-if="tableData!= null && tableData.length > 0" >导出明细表</el-button>
              </div>
            </el-col>
            <el-table :data="tableData" style="width: 100%" show-summary :summary-method="getSummaries">
              <el-table-column label="" width="100">
                <el-table-column label="序号" align="center" type="index" />
                <el-table-column prop="name" label="职工姓名" align="center" width="70" />
                <el-table-column prop="basePayment" label="养老、工伤、失业缴费基数" align="center">
                  <template #default="scope">
                    <div> {{ scope.row.basePayment == 0? "0.00":rowNum(scope.row.basePayment) }} </div>
                  </template>
                </el-table-column>
                <el-table-column prop="mmBasePayment" label="医疗、生育缴费基数" align="center">
                  <template #default="scope">
                    <div> {{ scope.row.mmBasePayment == 0? "0.00":rowNum(scope.row.mmBasePayment) }} </div>
                  </template>
                </el-table-column>
                <el-table-column prop="heatingPayment" label="采暖基数" align="center" width="70">
                  <template #default="scope">
                    <div>{{ scope.row.heatingPayment == 0? "0.00":rowNum(scope.row.heatingPayment) }}</div>
                  </template>
                </el-table-column>
              </el-table-column>
              <el-table-column label="公司承担" align="center">
                <el-table-column prop="companyBirth" label="生育保险公司" align="center">
                  <template #default="scope">
                    <div>{{ scope.row.companyBirth == 0? "0.00":rowNum(scope.row.companyBirth) }}</div>
                  </template>
                </el-table-column>
                <el-table-column prop="companyLargeMedical" label="大额医疗" align="center" width="70">
                  <template #default="scope">
                    <div>{{ scope.row.companyLargeMedical == 0? "0.00":rowNum(scope.row.companyLargeMedical) }}</div>
                  </template>
                </el-table-column>
                <el-table-column prop="companyMedical" label="医疗" align="center" width="70">
                  <template #default="scope">
                    <div>{{ scope.row.companyMedical == 0? "0.00":rowNum(scope.row.companyMedical) }}</div>
                  </template>
                </el-table-column>
                <el-table-column prop="companyElderly" label="养老" align="center" width="70">
                  <template #default="scope">
                    <div>{{ scope.row.companyElderly == 0? "0.00":rowNum(scope.row.companyElderly) }}</div>
                  </template>
                </el-table-column>
                <el-table-column prop="companyUnemployment" label="失业保险" align="center" width="70">
                  <template #default="scope">
                    <div>{{ scope.row.companyUnemployment == 0? "0.00":rowNum(scope.row.companyUnemployment) }}</div>
                  </template>
                </el-table-column>
                <el-table-column prop="companyInjury" label="工伤" align="center" width="70">
                  <template #default="scope">
                    <div>{{ scope.row.companyInjury == 0? "0.00":rowNum(scope.row.companyInjury) }}</div>
                  </template>
                </el-table-column>
                <el-table-column prop="companyHeat" label="采暖" align="center" width="70">
                  <template #default="scope">
                    <div>{{ scope.row.companyHeat == 0? "0.00":rowNum(scope.row.companyHeat) }}</div>
                  </template>
                </el-table-column>
                <el-table-column prop="companyCount" label="小计" align="center">
                  <template #default="scope">
                    <div>{{ scope.row.companyCount == 0? "0.00":rowNum(scope.row.companyCount) }}</div>
                  </template>
                </el-table-column>
              </el-table-column>
              <el-table-column label="个人承担" align="center">
                <el-table-column prop="oneSelfLargeMedical" label="大病" align="center" width="70">
                  <template #default="scope">
                    <div>{{ scope.row.oneSelfLargeMedical == 0? "0.00":rowNum(scope.row.oneSelfLargeMedical) }}</div>
                  </template>
                </el-table-column>
                <el-table-column prop="oneSelfElderly" label="养老保险" align="center" width="70">
                  <template #default="scope">
                    <div>{{ scope.row.oneSelfElderly == 0? "0.00":rowNum(scope.row.oneSelfElderly) }}</div>
                  </template>
                </el-table-column>
                <el-table-column prop="oneSelfUnemployment" label="失业保险" align="center" width="70">
                  <template #default="scope">
                    <div>{{ scope.row.oneSelfUnemployment == 0? "0.00":rowNum(scope.row.oneSelfUnemployment) }}</div>
                  </template>
                </el-table-column>
                <el-table-column prop="oneSelfEMedical" label="医疗保险" align="center" width="70">
                  <template #default="scope">
                    <div>{{ scope.row.oneSelfEMedical == 0? "0.00":rowNum(scope.row.oneSelfEMedical) }}</div>
                  </template>
                </el-table-column>
                <el-table-column prop="oneSelfCount" label="小计" align="center">
                  <template #default="scope">
                    <div>{{ scope.row.oneSelfCount == 0? "0.00":rowNum(scope.row.oneSelfCount) }}</div>
                  </template>
                </el-table-column>
              </el-table-column>
              <el-table-column label="">
                <el-table-column prop="totalAmount" label="缴费金额" align="center">
                  <template #default="scope">
                    <div>{{ scope.row.totalAmount == 0? "0.00":rowNum(scope.row.totalAmount) }}</div>
                  </template>
                </el-table-column>
              </el-table-column>
            </el-table>


            <el-col :span="24">
              <el-divider />
            </el-col>
            <el-col :span="12">
              <el-form-item label="单位养老金：">
                <el-input-number v-if="form.status !==3" v-model="form.unitPension" size="small" placeholder="单位养老金"
                  :precision="2" :controls="false" style="width: 100%" @change="amountChangeHandler" />
                <div v-else>{{ rowNum(form.unitPension) }}</div>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="单位医疗险：">
                <el-input-number v-if="form.status !==3" v-model="form.unitMedical" size="small" placeholder="单位医疗险"
                  :precision="2" :controls="false" style="width: 100%" @change="amountChangeHandler" />
                <div v-else>{{ rowNum(form.unitMedical) }}</div>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="单位工伤险：">
                <el-input-number v-if="form.status !==3" v-model="form.unitInjury" size="small" placeholder="单位工伤险"
                  :precision="2" :controls="false" style="width: 100%" @change="amountChangeHandler" />
                <div v-else>{{ rowNum(form.unitInjury) }}</div>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="单位失业金：">
                <el-input-number v-if="form.status !==3" v-model="form.unitUnemployment" size="small"
                  placeholder="单位失业金" :precision="2" :controls="false" style="width: 100%"
                  @change="amountChangeHandler" />
                <div v-else>{{ rowNum(form.unitUnemployment) }}</div>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="单位生育险：">
                <el-input-number v-if="form.status !==3" v-model="form.unitProcreate" size="small" placeholder="单位生育险"
                  :precision="2" :controls="false" style="width: 100%" @change="amountChangeHandler" />
                <div v-else>{{ rowNum(form.unitProcreate) }}</div>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="单位大病险：">
                <el-input-number v-if="form.status !==3" v-model="form.unitSeriousIllness" size="small"
                  placeholder="单位大病险" :precision="2" :controls="false" style="width: 100%"
                  @change="amountChangeHandler" />
                <div v-else>{{ rowNum(form.unitSeriousIllness) }}</div>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="单位采暖费：">
                <el-input-number v-if="form.status !==3" v-model="form.unitHeatingFee" size="small" placeholder="单位大病险"
                  :precision="2" :controls="false" style="width: 100%" @change="amountChangeHandler" />
                <div v-else>{{ rowNum(form.unitHeatingFee) }}</div>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="个人养老金：">
                <el-input-number v-if="form.status !==3" v-model="form.individualPension" size="small"
                  placeholder="个人养老金" :precision="2" :controls="false" style="width: 100%"
                  @change="amountChangeHandler" />
                <div v-else>{{ rowNum(form.individualPension) }}</div>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="个人医疗险：">
                <el-input-number v-if="form.status !==3" v-model="form.individualMedical" size="small"
                  placeholder="个人医疗险" :precision="2" :controls="false" style="width: 100%"
                  @change="amountChangeHandler" />
                <div v-else>{{ rowNum(form.individualMedical) }}</div>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="个人失业金：">
                <el-input-number v-if="form.status !==3" v-model="form.individualUnemployment" size="small"
                  placeholder="个人失业金" :precision="2" :controls="false" style="width: 100%"
                  @change="amountChangeHandler" />
                <div v-else>{{ rowNum(form.individualUnemployment) }}</div>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="个人大病险：">
                <el-input-number v-if="form.status !==3" v-model="form.individualSeriousIllness" size="small"
                  placeholder="个人大病险" :precision="2" :controls="false" style="width: 100%"
                  @change="amountChangeHandler" />
                <div v-else>{{ rowNum(form.individualSeriousIllness) }}</div>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="合计：">
                <!-- <el-input-number
                v-model="form.amount"
                size="small"
                placeholder="合计"
                :precision="2"
                :controls="false"
                style="width: 100%"
              /> -->
                {{ rowNum(form.amount) }}
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-divider />
            </el-col>
            <el-col :span="24">
              <el-form-item label="备注">
                <el-input v-model.trim="form.content" v-if="form.status !==3" maxlength="200" show-word-limit
                  type="textarea" rows="2" />
                <div v-else>{{form.content}}</div>
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item label="凭证" required>
                <dragUpload :accept="accept" style="width:100%" @file="upload"
                  v-if="form.evidenceFiles == null || form.evidenceFiles == ''" />
                <img v-else style="height: 148px; width: 148px" :src="`${baseUrl}/${form.evidenceFiles[0].fileUrl}`"
                  class="avatar" @click="openEvidience('evidenceFiles[0]')" />
                <div v-if="form.status !== 3">
                  <el-icon :size="20" v-if="form.evidenceFiles !== '' ||form.evidenceFiles == null "
                    @click="form.evidenceFiles = []" class="delete-button">
                    <Delete />
                  </el-icon>
                </div>
                <!-- <el-upload action="#" :http-request="upload" :with-credentials="true" :show-file-list="false" multiple>
                  <el-button size="small" type="primary" icon="Upload" v-if="form.status !==3">点击上传</el-button>
                </el-upload>" -->
                <!-- <dragUpload :accept="accept" style="width:100%" @file="upload"/>
                <el-table ref="dbTable" :data="form.evidenceFiles" size="small" border
                  header-row-class-name="list-header-row" row-class-name="list-row">
                  <el-table-column label="文件名" prop="originalFileName" align="center" show-overflow-tooltip>
                    <template #default="scope">
                      <el-button size="small" type="text" @click="openFile(scope.row)">{{
                        scope.row.originalFileName == ""
                        ? "打开文件"
                        : scope.row.originalFileName
                        }}</el-button>
                    </template>
                  </el-table-column>
                  <el-table-column label="操作" width="80" prop="fileType" align="center">
                    <template #default="scope">
                      <el-button size="small" link type="danger" v-if=" form.status !== 3"
                        @click="handlerEportFilesDel(scope.row, scope.$index)">删除</el-button>
                    </template>
                  </el-table-column>
                </el-table> -->
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item label="报表">
                <el-upload action="#" :http-request="uploadStatement" :with-credentials="true" :show-file-list="false"
                  multiple>
                  <el-button size="small" type="primary" icon="Upload" v-if="form.status !==3">点击上传</el-button>
                </el-upload>
                <el-table ref="dbTable" :data="form.reportFiles" size="small" border
                  header-row-class-name="list-header-row" row-class-name="list-row">
                  <el-table-column label="文件名" prop="originalFileName" align="center" show-overflow-tooltip>
                    <template #default="scope">
                      <el-button size="small" type="text" @click="openFile(scope.row)">{{
                        scope.row.originalFileName == ""
                        ? "打开文件"
                        : scope.row.originalFileName
                        }}</el-button>
                    </template>
                  </el-table-column>

                  <el-table-column label="操作" width="80" prop="fileType" align="center">
                    <template #default="scope">
                      <el-button size="small" link type="danger" v-if=" form.status !== 3"
                        @click="handleDel(scope.row, scope.$index)">删除</el-button>
                    </template>
                  </el-table-column>
                </el-table>
              </el-form-item>
            </el-col>
          </el-row>
        </el-form>
      </div>
      <div class="form-btns-container" style="height: 40px" v-if="!stopUseBack">
        <el-button size="small" v-if="form.status !== 3" icon="close"
          style="float: right; margin-left: 12px; margin-right: 12px" @click="close">
          取消</el-button>
        <el-button type="primary" v-if="form.status !== 3" size="small" icon="Finished" style="float: right"
          @click="handleSave">
          保存</el-button>
        <el-button v-hasPermi="['business:socialSecurityDeclare:edit']" style="float: right;" 
          icon="back" size="small" type="warning" :disabled="
      form == null || form.status !== 3
    " @click="turnBack(form)">退回</el-button>
      </div>
    </div>
    <!-- <feedback-dialog ref="feedbackDialogView" :parent="this" />
    <print-dialog ref="printDialog" :parent="this" /> -->
  </el-dialog>
</template>
<script setup>
  import {
    getDetail,
    saveDetail, turnBackDetail,
    getTableDetail, exportDetail
  } from "@/api/business/production/socialSecurityDeclare";
  import match from "@/utils/match";
  import { uploadFile } from "@/api/tool/file";
  import { rowNum } from "@/utils/index";
  import dragUpload from "@/components/dragUpload"
  import { ref } from "vue";
  const { proxy } = getCurrentInstance();
  const visible = ref(false);
  const width = ref(1600);
  const selections = ref([]);
  const currentSource = ref(null);
  const editStatus = ref(false);
  const canSave = ref(false);
  const loading = ref(false);
  const stopUseBack = ref(false);
  const tableData = ref([]);
  const currentMonth = ref(
    proxy.moment().format("YYYY-MM-01")
  );
  const baseUrl = ref(import.meta.env.VITE_APP_BASE_API);
  const props = defineProps({
    getList: {
      type: Function,
      default: () => { },
    },
  });

  const { getList } = toRefs(props);
  const total = ref(0);

  const employeeEmptyData = {
    id: null,
    title: "",
    remark: "",
    employeeName: "",
    departmentName: "",
    idCardImage: "",
    idCardImageBack: "",
    idiograph: "",
    details: [],
    editStatus: true,
  };

  const form = ref({});

  const emptyForm = {
    details: [],
  };

  function open(detail) {
    visible.value = true;
    currentMonth.value = proxy.moment().format("YYYY-MM-01")
    form.value = detail;
    console.log(detail);
    loadData();
  }

  function loadData() {
    loading.value = true;
    form.value.year = proxy.moment(currentMonth.value).format("YYYY");
    form.value.month = proxy.moment(currentMonth.value).format("MM");
    const { year, month, socialSecurityDeclareId, companyId,injuryRadio } = form.value
    const clearForm = { year, month, socialSecurityDeclareId, companyId,injuryRadio }
    getDetail(clearForm).then((res) => {
      form.value = { ...proxy.deepClone(emptyForm), ...res.data };
      // if (form.value.status === 2 || form.value.status === 3) {
      //   proxy.$modal.msgError("该信息已提交待审核");
      //   close();
      // }

      getTableDetail(clearForm).then((res) => {
        tableData.value = res.data;
        if (form.value.unitPension === undefined || form.value.unitPension == 0) {
          let amount = 0
          tableData.value.map(item => {
            amount += item.companyElderly

          })
          form.value.unitPension = amount

        }

        if (form.value.unitMedical === undefined || form.value.unitMedical == 0) {
          let amount = 0
          tableData.value.map(item => {
            amount += item.companyMedical

          })
          form.value.unitMedical = amount
        }

        if (form.value.unitInjury === undefined || form.value.unitInjury == 0) {
          let amount = 0
          tableData.value.map(item => {
            amount += item.companyInjury

          })
          form.value.unitInjury = amount
        }

        if (form.value.unitUnemployment === undefined || form.value.unitUnemployment == 0) {
          let amount = 0
          tableData.value.map(item => {
            amount += item.companyUnemployment

          })
          form.value.unitUnemployment = amount
        }

        if (form.value.unitProcreate === undefined || form.value.unitProcreate == 0) {
          let amount = 0
          tableData.value.map(item => {
            amount += item.companyBirth

          })
          form.value.unitProcreate = amount
        }

        if (form.value.unitSeriousIllness === undefined || form.value.unitSeriousIllness == 0) {
          let amount = 0
          tableData.value.map(item => {
            amount += item.companyLargeMedical

          })
          form.value.unitSeriousIllness = amount
        }

        if (form.value.unitHeatingFee === undefined || form.value.unitHeatingFee == 0) {
          let amount = 0
          tableData.value.map(item => {
            amount += item.companyHeat

          })
          form.value.unitHeatingFee = amount
        }

        if (form.value.individualPension === undefined || form.value.individualPension == 0) {
          let amount = 0
          tableData.value.map(item => {
            amount += item.oneSelfElderly

          })
          form.value.individualPension = amount
        }


        if (form.value.individualMedical === undefined || form.value.individualMedical == 0) {
          let amount = 0
          tableData.value.map(item => {
            amount += item.oneSelfEMedical

          })
          form.value.individualMedical = amount
        }


        if (form.value.individualUnemployment === undefined || form.value.individualUnemployment == 0) {
          let amount = 0
          tableData.value.map(item => {
            amount += item.oneSelfUnemployment

          })
          form.value.individualUnemployment = amount
        }

        if (form.value.individualSeriousIllness === undefined || form.value.individualSeriousIllness == 0) {
          let amount = 0
          tableData.value.map(item => {
            amount += item.oneSelfLargeMedical

          })
          form.value.individualSeriousIllness = amount
        }
        amountChangeHandler();
      });
    }).finally(() => {

      loading.value = false;
    });
  }
  function changeMonthHandle() {
    // isView.value = true
    const nowDate = ref(
      proxy.moment().format("YYYY-MM-01")
    );
    let nowyear = proxy.moment(nowDate.value).format("YYYY");
    let nowmonth = proxy.moment(nowDate.value).format("MM");
    const year = proxy.moment(currentMonth.value).format("YYYY");
    const month = proxy.moment(currentMonth.value).format("MM");
    if (nowyear + nowmonth == year + month) {
      // if(emptyForm.value.status === 3 ){
      //   isView.value =true
      // }else{
      //   isView.value =false
      // }
      stopUseBack.value = false
    } else {
      stopUseBack.value = true
    }
    loadData()
  }
  function close() {
    visible.value = false;
    reset();
  }
  function exportExcel() {
    let data = {
      "companyId": form.value.companyId,
      "year": form.value.year,
      "month": form.value.month,
      "radio": form.value.injuryRadio
    }
    exportDetail(data)
  }
  function reset() {
    form.value = proxy.deepClone(emptyForm);
    canSave.value = false;
  }
  const getSummaries = (param) => {

    const { columns, data } = param;
    const sums = [];
    columns.forEach((column, index) => {
      if (index === 0) {
        sums[index] = '合计';
        return;
      }
      if (index === 1) {
        return;
      }

      const values = data.map(item => Number(item[column.property]));
      // if (column.property === 'companyAmount') {
      //   if (form.value.unitAmount) {
      //     sums[index] = form.value.unitAmount
      //     return
      //   }
      // } else if (column.property === 'oneSelfAmount') {
      //   if (form.value.unitAmount) {
      //     sums[index] = form.value.individualAmount
      //     return
      //   }
      // }
      // else if (column.property === 'totalAmount') {
      //   if (form.value.unitAmount && form.value.individualAmount) {
      //     sums[index] = form.value.individualAmount + form.value.unitAmount
      //     return
      //   }
      // }

      sums[index] = values.reduce((prev, curr) => {
        const value = Number(curr);
        if (!isNaN(value)) {
          return prev + curr;
        } else {
          return prev;
        }
      }, 0).toFixed(2);
    });

    return sums
  }
  function handleCurrentChange(row) {
    currentSource.value = row;
  }
  function turnBack(detail) {
    loading.value = true
    form.value.status = 1;
    form.value.year = proxy.moment(currentMonth.value).format("YYYY");
    form.value.month = proxy.moment(currentMonth.value).format("MM");
    turnBackDetail(form.value)
      .then((res) => {
        getList.value();

      })
      .catch((err) => {
        proxy.$modal.msgError(err.message);
      }).finally(() => {
        loading.value = false
        visible.value = false;
      });
  }
  function changeUnitInjuryRadio(e) {
    tableData.value.forEach((item) => {
      let radio = match.divide(form.value.injuryRadio, 100);
      let tempInjury = item.companyInjury
      item.companyInjury = Number(match.multiply(item.basePayment, radio).toFixed(2));
      let tempcompanyCount = match.subtract(item.companyCount, tempInjury);
      item.companyCount = match.add(tempcompanyCount, item.companyInjury);
      item.totalAmount = match.add(item.companyCount, item.oneSelfCount);
    });
    let amount = 0
    tableData.value.map(item => {
      amount += item.companyInjury
      console.log(item.companyInjury);

    })
    form.value.unitInjury = amount
    amountChangeHandler()
  }
  function changeUnitMedicalRadio(e) {
    console.log(form.value.medicalRadio);
    tableData.value.forEach((item) => {
      let radio = match.divide(form.value.medicalRadio, 100);
      let tempMedical = item.companyMedical
    })

  }
  function handleCheckChange(selection) {
    selections.value = selection.map((item) => item);
  }

  function handleSave() {
    console.log("form.value.injuryRadio",form.value.injuryRadio);
    
    if (form.value.injuryRadio  == null) {
        proxy.$modal.msgError("请输入单位工伤险比例");
        return;
      }
    if (form.value.isFirstSocialSecurity === 0) {
    
      if (!form.value.governmentAccountNo) {
        proxy.$modal.msgError("请输入政务网账号");
        return;
      }
    
      if (!form.value.governmentPassword) {
        proxy.$modal.msgError("请输入政务网密码");
        return;
      }
      if (!passwordCheck(form.value.governmentPassword)) {
        proxy.$modal.msgError("请输入正确的政务网密码");
        return;
      }
      if (!form.value.socialSecurityAccountNo) {
        proxy.$modal.msgError("请输入社保账号");
        return;
      }
      if (!form.value.socialSecurityPassword) {
        proxy.$modal.msgError("请输入社保密码");
        return;
      }
      if (!passwordCheck(form.value.socialSecurityPassword)) {
        proxy.$modal.msgError("请输入正确的社保密码");
        return;
      }
      if (!form.value.employeePassword) {
        proxy.$modal.msgError("请输入用工密码");
        return;
      }
      if (!passwordCheck(form.value.employeePassword)) {
        proxy.$modal.msgError("请输入正确的用工密码");
        return;
      }
    }
    if (
      form.value.evidenceFiles == null ||
      form.value.evidenceFiles.length === 0
    ) {
      proxy.$modal.msgError("请上传凭证");
      return;
    }
    // if (form.value.reportFiles == null || form.value.reportFiles.length === 0) {
    //   proxy.$modal.msgError("请上传报表");
    //   return;
    // }

    proxy.$modal
      .confirm("确认保存么？")
      .then(() => {
        const saveValue = proxy.deepClone(form.value);
        saveValue.status = 3;
        saveValue.year = proxy.moment(currentMonth.value).format("YYYY");
        saveValue.month = proxy.moment(currentMonth.value).format("MM");
        saveDetail(saveValue).then((res) => {
          proxy.$modal.msgSuccess("保存成功");
          reset();
          close();
          getList.value();
        });
      })
      .catch((err) => {
        proxy.$modal.msg("取消保存");
      });
  }

  function passwordCheckHandler(value, field) {
    // console.log(value)
    if (!passwordCheck(form.value[field])) {
      proxy.$modal.msgError("请输入正确密码");
    }
  }

  function passwordCheck(value) {
    const pattern = /^[A-Za-z0-9~!@#$%^&*()_+-=]*$/;
    if (!pattern.test(value)) {
      return false;
    }
    return true;
  }

  function upload(param) {
    const formData = new FormData();
    formData.append("file", param);
    uploadFile(formData).then((res) => {
      if (res.code === 200) {
        const file = {};
        file.fileName = res.newFileName;
        file.url = res.url;
        file.fileType =
          res.newFileName.split(".")[res.newFileName.split(".").length - 1];
        file.originalFileName = res.originalFilename;
        file.fileUrl = res.fileName;
        form.value.evidenceFiles.push(file);

      }
    });
  }
  function openEvidience() {

    window.open(`${baseUrl.value}${form.value.evidenceFiles[0].fileUrl}`);
  }
  function uploadStatement(param) {
    const formData = new FormData();
    formData.append("file", param.file);
    uploadFile(formData).then((res) => {
      if (res.code === 200) {
        const file = {};
        file.fileName = res.newFileName;
        file.url = res.url;
        file.fileType =
          res.newFileName.split(".")[res.newFileName.split(".").length - 1];
        file.originalFileName = res.originalFilename;
        file.fileUrl = res.fileName;
        form.value.reportFiles.push(file);
      }
    });
  }

  function openFile(row) {
    window.open(`${baseUrl.value}${row.fileUrl}`);
  }

  function changeEdit() {
    editStatus.value = !editStatus.value;
  }

  function amountChangeHandler() {
    let amount = 0;
    amount += form.value.unitInjury == null ? 0 : form.value.unitInjury;
    amount += form.value.unitMedical == null ? 0 : form.value.unitMedical;
    amount += form.value.unitPension == null ? 0 : form.value.unitPension;
    amount += form.value.unitProcreate == null ? 0 : form.value.unitProcreate;
    amount +=
      form.value.unitSeriousIllness == null ? 0 : form.value.unitSeriousIllness;
    amount +=
      form.value.unitUnemployment == null ? 0 : form.value.unitUnemployment;
    amount +=
      form.value.individualMedical == null ? 0 : form.value.individualMedical;
    amount +=
      form.value.individualPension == null ? 0 : form.value.individualPension;
    amount +=
      form.value.individualSeriousIllness == null
        ? 0
        : form.value.individualSeriousIllness;
    amount +=
      form.value.individualUnemployment == null
        ? 0
        : form.value.individualUnemployment;
    amount += form.value.unitHeatingFee == null ? 0 : form.value.unitHeatingFee;
   
    
    form.value.amount = amount;
    canSave.value =
      form.value.unitInjury !== undefined &&
      form.value.unitMedical !== undefined &&
      form.value.unitPension !== undefined &&
      form.value.unitProcreate !== undefined &&
      form.value.unitSeriousIllness !== undefined &&
      form.value.unitUnemployment !== undefined &&
      form.value.individualMedical !== undefined &&
      form.value.individualPension !== undefined &&
      form.value.individualSeriousIllness !== undefined &&
      form.value.individualUnemployment !== undefined &&
      form.value.unitHeatingFee !== undefined;
  }

  function handlerEportFilesDel(row, index) {
    proxy.$modal
      .confirm("确定删除吗？")
      .then((_) => {
        form.value.evidenceFiles.splice(index, 1);
      })
      .catch((_) => {
        proxy.$modal.msg("已取消删除");
      });
  }

  function handleDel(row, index) {
    proxy.$modal
      .confirm("确定删除吗？")
      .then((_) => {
        form.value.reportFiles.splice(index, 1);
      })
      .catch((_) => {
        proxy.$modal.msg("已取消删除");
      });
  }

  // 暴露给父组件的方法
  defineExpose({
    open,
  });
</script>
<style scoped>
  .img {
    width: 23px;
    height: 23px;
    display: flex;
    justify-content: center;
    align-items: center;
  }

  ::v-deep(.el-upload) {
    display: flex;
    text-align: center;
    justify-content: center;
    cursor: pointer;
    outline: 0;
  }

  .required::after {
    content: "*";
    color: red;
  }
</style>