<template>
  <div class="jcap" style="width: 100%;height: 100%;">
    <el-main>
      <div style="padding: 15px;">
        <div style="margin-bottom: 15px;">
          <el-row>
            <el-col :span="3" style="text-align: left;display: flex;align-items: center;">
              <h3>当前稽察计划</h3>
            </el-col>
            <el-col :span="9" style="display: flex;align-items: center;line-height: 36px;font-size: 14px;">
              <span>年度&nbsp;</span>
              <el-date-picker
                v-model="year"
                type="year"
                format="yyyy"
                value-format="yyyy"
                clearble
                placeholder="选择年">
              </el-date-picker>
              <el-button type="primary" @click="search" size="small">查询</el-button>
            </el-col>
            <el-col :span="12" style="text-align: right;">
              <el-button type="primary" @click="addJcJh" size="medium">新增稽察计划</el-button>
            </el-col>
          </el-row>
        </div>
        <el-table
          v-loading="loading"
          border
          ref="multipleTable"
          :height="tableHeight"
          :data="dangQianResult"
          tooltip-effect="dark"
          style="width: 100%">
          <el-table-column align="center" type="index" label="序号" min-width="25">
            <template #default="scope">{{ (pageNum - 1) * pageSize + (scope.$index + 1) }}</template>
          </el-table-column>
          <el-table-column
            header-align="center"
            align="center"
            min-width="100"
            label="年度批次"
            show-overflow-tooltip
          >
            <template #default="scope">
              <span>{{ scope.row.year + "年第" + scope.row.batch + "批次" }}</span>
            </template>
          </el-table-column>
          <el-table-column
            header-align="center"
            align="center"
            min-width="100"
            label="是否测评"
            show-overflow-tooltip
          >
            <template #default="scope">
              <span v-if="scope.row.isAppraisal == '1'">是</span>
              <span v-if="scope.row.isAppraisal == '2'">否</span>
            </template>
          </el-table-column>
          <el-table-column
            header-align="center"
            align="center"
            min-width="100"
            label="是否地区分组"
            show-overflow-tooltip
          >
            <template #default="scope">
              <span v-if="scope.row.isAreaGroup == '1'">是</span>
              <span v-if="scope.row.isAreaGroup == '2'">否</span>
            </template>
          </el-table-column>
          <el-table-column
            header-align="center"
            align="center"
            min-width="100"
            label="是否人员分组"
            show-overflow-tooltip
          >
            <template #default="scope">
              <span v-if="scope.row.isPersGroup == '1'">是</span>
              <span v-if="scope.row.isPersGroup == '2'">否</span>
            </template>
          </el-table-column>
          <el-table-column
            header-align="center"
            align="center"
            min-width="200"
            label="操作"
            show-overflow-tooltip>
            <template #default="scope">
              <el-button type="primary" size="medium" @click="jcEdit(scope.row)">编辑</el-button>
              <el-button type="danger" size="medium" @click="delPlan(scope.row)">删除</el-button>
            </template>
          </el-table-column>
        </el-table>
        <el-pagination
          style="margin: 15px auto"
          background
          :pager-count="5"
          :current-page="pageNum"
          :page-size="pageSize"
          :page-sizes="[10, 20, 30, 40, 50, 100]"
          layout="sizes, total, prev, pager, next"
          :total="total"
          @current-change="pageIndexChange"
          @size-change="handleSizeChange"
        ></el-pagination>
      </div>
    </el-main>
    <el-dialog :close-on-click-modal="false" v-model="dialogFormVisible" width="70%" :append-to-body="true">
      <el-row>
      </el-row>
      <el-row>
        <el-col :span="24">
          <el-button type="primary" size="medium" plain @click="determineLcation">确定地点</el-button>
          <el-button type="success" size="medium" plain @click="identifyingTime">确定时间</el-button>
          <el-button type="warning" size="medium" plain @click="auditNotification">稽察通知单</el-button>
        </el-col>
      </el-row>
      <div style="padding: 15px; margin-top: 15px;">
        <fenPeiDidian v-show="distributionLocationDialog" :distributionLocationResult="distributionLocationResult" :persAreaId="persAreaId" :yearBatchId="yearBatchId" :jiChaJiHuaResults="jiChaJiHuaResult" ref="fpdd"></fenPeiDidian>
      </div>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="updateDqRoleInfo" size="medium">保 存</el-button>
      </div>
    </el-dialog>
    <div v-if="dialogAddVisible" style="position:fixed;top:0;left:0;z-index:9999;background:red;color:white;padding:20px;">DIALOG VISIBLE</div>
    <el-dialog :close-on-click-modal="false" v-model="dialogAddVisible" width="40%" :append-to-body="true">
      <el-row>
        <el-col :span="24" style="text-align: center;">
          <el-form
            :inline="true"
            size="small"
            class="demo-form-inline"
            :model="editRole">
            <el-form-item label="选择年度">
              <el-select v-model="addForm.year" @change="changeYear">
                <el-option :lable="item.year" :value="item.year" :key="item.id" v-for="item in yearList"></el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="选择批次">
              <el-select v-model="addForm.batch">
                <el-option :lable="item.batch" :value="item.batch" :key="item.id" v-for="item in pcList"></el-option>
              </el-select>
            </el-form-item>
          </el-form>
        </el-col>
      </el-row>
      <div slot="footer" class="dialog-footer" style="text-align: center;">
        <el-button type="danger"  @click="dialogAddVisible = false" size="medium">取 消</el-button>
        <el-button type="primary" @click="updateRoleInfo" size="medium">确 定</el-button>
      </div>
    </el-dialog>

    <el-dialog :close-on-click-modal="false" :title="'确定专家人数及原则'" v-model="dialogJcAddVisible" width="40%" :append-to-body="true">
      <div style="height: 50vh; overflow: auto; padding-top: 20px;">
        <div style="margin: 30px auto; border: 1px dotted #000000; padding: 10px;">
          <p class="title">确定稽察人数</p>
          <el-row>
            <el-col :span="4">
              <span class="spanBt">一般库</span>
            </el-col>
            <el-col :span="4">
              <span>一般库共{{commTotal}}人</span>
            </el-col>
            <el-col :span="4">
              <span>所选{{commXzTotal}}人</span>
            </el-col>
            <el-col :span="4">
              <span>所选占比{{commCycle}}%</span>
            </el-col>
          </el-row>
          <el-row style="margin: 10px 0;">
            <el-col :span="24">
              <span>没有特殊属性现役普通库</span>
            </el-col>
          </el-row>
          <div>
            <el-table
              :data="areaPrisForm.commList"
              border
              style="width: 100%">
              <el-table-column
                prop="name"
                label="角色"
                min-width="120">
              </el-table-column>
              <el-table-column
                prop="selectCount"
                label="所选人数"
                min-width="120">
                <template #default="scope">
                  <el-input
                    type="number"
                    v-model="scope.row.selectCount"
                    :max="scope.row.count"
                    min="0"
                    @change="handleEdit(scope.$index, scope.row)"></el-input>
                </template>
              </el-table-column>
              <el-table-column
                prop="count"
                label="可用人数"
                min-width="120">
              </el-table-column>
              <el-table-column
                prop="scal"
                label="所选占比"
                min-width="120">
                <template>

                </template>
              </el-table-column>

            </el-table>
          </div>
          <el-row style="margin: 10px 0;">
            <el-col :span="4">
              <span class="spanBt">见习专家库</span>
            </el-col>
            <el-col :span="4">
              <span>一般库共{{proTotal}}人</span>
            </el-col>
            <el-col :span="4">
              <span>所选{{proXzTotal}}人</span>
            </el-col>
            <el-col :span="4">
              <span>所选占比{{proCycle}}%</span>
            </el-col>
          </el-row>
          <el-row style="margin: 10px 0;">
            <el-col :span="24">
              <span>没有特殊属性现役普通库</span>
            </el-col>
          </el-row>
          <div>
            <el-table
              :data="areaPrisForm.proList"
              border
              style="width: 100%">
              <el-table-column
                prop="name"
                label="角色"
                min-width="120">
              </el-table-column>
              <el-table-column
                label="所选人数"
                min-width="120">
                <template #default="scope">
                  <el-input
                    readyOnly
                    type="number"
                    v-model="scope.row.selectCount"
                    :max="scope.row.count"
                    min="0"
                    @change="handleProEdit(scope.$index, scope.row)"></el-input>
                </template>
              </el-table-column>
              <el-table-column
                prop="count"
                label="可用人数"
                min-width="120">
              </el-table-column>
              <el-table-column
                prop="scal"
                label="所选占比"
                min-width="120">
              </el-table-column>

            </el-table>
          </div>
        </div>

        <div style="margin: 30px auto; border: 1px dotted #000000; padding: 10px;">
          <p class="title">确定稽察原则</p>
          <el-checkbox v-model="areaPrisForm.isPick" true-label="1" false-label="2" @change="changeZySy">择优使用原则</el-checkbox>
          <el-row style="margin: 10px 0px;">
            <el-col :span="4">
              <span class="spanBt">金名单</span>
            </el-col>
            <el-col :span="4">
              <span>金名单共{{goldTotal}}人</span>
            </el-col>
            <el-col :span="4">
              <span>所选{{goldXzTotal}}人</span>
            </el-col>
            <el-col :span="4">
              <span>所选占比{{goldCycle}}%</span>
            </el-col>
          </el-row>
          <el-row style="margin: 10px 0;">
            <el-col :span="24">
              <span>测评优秀人员</span>
            </el-col>
          </el-row>
          <div>
            <el-table
              :data="areaPrisForm.goldList"
              border
              style="width: 100%">
              <el-table-column
                prop="name"
                label="角色"
                min-width="120">
              </el-table-column>
              <el-table-column
                prop="selectCount"
                label="所选人数"
                min-width="120">
                <template #default="scope">
                  <el-input
                    :disabled="isZySychecked"
                    type="number"
                    v-model="scope.row.selectCount"
                    :max="scope.row.count"
                    min="0"
                    @change="handleGoldEdit(scope.$index, scope.row)"></el-input>
                </template>
              </el-table-column>
              <el-table-column
                prop="count"
                label="可用人数"
                min-width="120">
              </el-table-column>
              <el-table-column
                prop="scal"
                label="所选占比"
                min-width="120">
              </el-table-column>
            </el-table>
          </div>
          <el-row style="margin: 10px 0px;">
            <el-col :span="4">
              <span class="spanBt">红名单</span>
            </el-col>
            <el-col :span="4">
              <span>红名单共{{redTotal}}人</span>
            </el-col>
            <el-col :span="4">
              <span>所选{{redXzTotal}}人</span>
            </el-col>
            <el-col :span="4">
              <span>所选占比{{redCycle}}%</span>
            </el-col>
          </el-row>
          <el-row style="margin: 10px 0;">
            <el-col :span="24">
              <span>公认优秀人员</span>
            </el-col>
          </el-row>
          <div>
            <el-table
              :data="areaPrisForm.redList"
              border
              style="width: 100%">
              <el-table-column
                prop="name"
                label="角色"
                min-width="120">
              </el-table-column>
              <el-table-column
                prop="selectCount"
                label="所选人数"
                min-width="120">
                <template #default="scope">
                  <el-input
                    type="number"
                    v-model="scope.row.selectCount"
                    :max="scope.row.count"
                    min="0"
                    @change="handleRedEdit(scope.$index, scope.row)"></el-input>
                </template>
              </el-table-column>
              <el-table-column
                prop="count"
                label="可用人数"
                min-width="120">
              </el-table-column>
              <el-table-column
                prop="scal"
                label="所选占比"
                min-width="120">
              </el-table-column>
            </el-table>
          </div>
          <el-checkbox v-model="areaPrisForm.isFit" class="spanBt" style="margin-top: 15px;" @change="changeZcYx" true-label="1" false-label="2">专长优先原则</el-checkbox>
          <div>
            <div>
              <el-row style="margin: 15px 0;">
                <el-col :span="12">
                  <el-checkbox v-model="areaPrisForm.isA" :disabled="isZcYx" true-label="1" false-label="2">适合A类项目</el-checkbox>
                </el-col>
                <el-col :span="12">
                  <el-checkbox v-model="areaPrisForm.isB" :disabled="isZcYx" true-label="1" false-label="2">适合B类项目</el-checkbox>
                </el-col>
              </el-row>
              <el-row style="margin: 15px 0;">
                <el-col :span="12">
                  <el-checkbox v-model="areaPrisForm.isC" :disabled="isZcYx" true-label="1" false-label="2">适合C类项目</el-checkbox>
                </el-col>
                <el-col :span="12">
                  <el-checkbox v-model="areaPrisForm.isD" :disabled="isZcYx" true-label="1" false-label="2">适合D类项目</el-checkbox>
                </el-col>
              </el-row>
              <el-row style="margin: 15px 0;">
                <el-col :span="12">
                  <el-checkbox v-model="areaPrisForm.isE" :disabled="isZcYx" true-label="1" false-label="2">适合E类项目</el-checkbox>
                </el-col>
                <el-col :span="12">
                </el-col>
              </el-row>
            </div>
          </div>

          <el-checkbox v-model="areaPrisForm.isNew" class="spanBt" style="margin-top: 15px;" @change="changeXrSl" true-label="1" false-label="2">新人适量原则</el-checkbox>
          <div>
            <div>
              <el-row style="margin: 15px 0;">
                <el-col :span="12">
                  <span>
                    该年度未达到
                    <el-input
                      type="number"
                      v-model="areaPrisForm.newSize"
                      style="width: 15%;"
                      :disabled="isXrSlchecked"
                      min="0">
                  </el-input>
                    次算新人
                  </span>
                </el-col>
                <el-col :span="12">
                  <el-button type="text" @click="newPersInfo" :disabled="isXrSlchecked">查看新人信息</el-button>
                </el-col>
              </el-row>
              <el-row style="margin: 10px 0;">
                <el-col :span="8">
                  <span>新人共{{newTotal}}人</span>
                </el-col>
                <el-col :span="8">
                  <span>所选{{newXzTotal}}人</span>
                </el-col>
                <el-col :span="8">
                  <span>所选占比{{newCycle}}%</span>
                </el-col>
              </el-row>
              <div>
                <el-table
                  :data="areaPrisForm.newList"
                  border
                  style="width: 100%">
                  <el-table-column
                    prop="name"
                    label="角色"
                    min-width="120">
                  </el-table-column>
                  <el-table-column
                    prop="selectCount"
                    label="所选人数"
                    min-width="120">
                    <template #default="scope">
                      <el-input
                        type="number"
                        v-model="scope.row.selectCount"
                        :max="scope.row.count"
                        min="0"
                        @change="handleNewEdit(scope.$index, scope.row)"></el-input>
                    </template>
                  </el-table-column>
                  <el-table-column
                    prop="count"
                    label="可用人数"
                    min-width="120">
                  </el-table-column>
                  <el-table-column
                    prop="scal"
                    label="所选占比"
                    min-width="120">
                  </el-table-column>
                </el-table>
              </div>
            </div>
          </div>
          <el-checkbox v-model="areaPrisForm.isReason" style="margin-top: 15px;" true-label="1" false-label="2">合理周期原则</el-checkbox>
        </div>
      </div>

      <div slot="footer" class="dialog-footer">
        <el-button type="danger"  @click="dialogJcAddVisible = false" size="medium">取 消</el-button>
        <el-button type="primary" @click="updateJcForm" size="medium">确 定</el-button>
      </div>
    </el-dialog>
    <el-dialog :close-on-click-modal="false" title="新人信息" v-model:visible="dialogNewPersVisible" width="60%">
      <NewPersInfo :newSize="areaPrisForm.newSize"></NewPersInfo>
    </el-dialog>
    <el-dialog :close-on-click-modal="false" title="请选择角色" v-model:visible="dialogAddPersVisible" width="40%" @close="roleCloseDialog">
      <div style="text-align: center;">
        <span>请选择角色</span>
        <el-select v-model="roleType" clearable placeholder="请选择">
          <el-option :label="item.label" :value="item.value" v-for="(item,index) in roleTypeData" :key="index"></el-option>
        </el-select>
      </div>
      <div slot="footer" class="dialog-footer">
        <el-button type="danger"  @click="dialogAddPersVisible = false" size="medium">取 消</el-button>
        <el-button type="primary" @click="addPersInfo" size="medium">确 定</el-button>
      </div>
    </el-dialog>

    <!--选择人员-->

    <NewPersXzInfo :roleTypes="roleType" :yearBatchId="yearBatchId" v-if="XzRyDialog" @closeXzPers="closeXzPers"></NewPersXzInfo>

    <!--删除人员-->
    <el-dialog :close-on-click-modal="false" title="删除人员" v-model:visible="dialogDelPersVisible" width="40%">
      <div style="text-align: center; font-size: 18px; font-weight: bold;height: 20vh;line-height: 20vh;">
        <span>请选择删除原因</span>
        <el-radio v-model="delRadio" label="回复超时">回复超时</el-radio>
        <el-radio v-model="delRadio" label="回复不参加">回复不参加</el-radio>
        <el-radio v-model="delRadio" label="其他原因">其他原因</el-radio>
      </div>
      <div slot="footer" class="dialog-footer" style="text-align: center;">
        <el-button type="danger"  @click="dialogDelPersVisible = false" size="medium">取 消</el-button>
        <el-button type="primary" @click="delPersInfo" size="medium">确 定</el-button>
      </div>
    </el-dialog>
    <!--选择时间-->

    <el-dialog :close-on-click-modal="false" title="确定时间" v-model:visible="dialogTimeVisible" width="40%">
        <div style="padding: 0;display: flex;flex-wrap: wrap;">
          <div class="block">
            <span class="demonstration">开始时间</span>
            <el-date-picker
              v-model="sttm"
              type="date"
              value-format="yyyy-MM-dd"
              placeholder="选择日期">
            </el-date-picker>
          </div>
          <div class="block" style="border: none;">
            <span class="demonstration">结束时间</span>
            <el-date-picker
              v-model="entm"
              align="right"
              type="date"
              value-format="yyyy-MM-dd"
              placeholder="选择日期">
            </el-date-picker>
          </div>
        </div>
        <div slot="footer" class="dialog-footer" style="text-align: center;">
          <el-button type="danger" @click="dialogTimeVisible = false" size="medium">取 消</el-button>
          <el-button type="primary" @click="confirmTimeInfo" size="medium">确 定</el-button>
        </div>
    </el-dialog>
    <!--稽察通知单-->
    <el-dialog
      title="稽察通知单"
      v-model:visible="inspectionNoticeVisible"
      width="50%">
        <el-upload
          class="upload-demo"
          style="text-align: center;"
          ref="upload"
          drag
          accept=".pdf"
          :action="UploadUrl()"
          :headers="header"
          :on-success="fileSuccess"
          :file-list="fileList"
          :auto-upload="false"
          :on-error="fileUpErr"
          :before-remove="beforeRemove"
          :on-preview="handlePreview"
          :on-change="changeUpload">
          <el-icon><Upload /></el-icon>
          <div class="el-upload__text">将文件拖到此处，或<em>点击上传</em></div>
          <div slot="tip" class="el-upload__tip">只限上传pdf文件</div>
        </el-upload>
        <div slot="footer" class="dialog-footer">
          <el-button @click="inspectionNoticeVisible = false">取 消</el-button>
          <el-button type="primary"  @click="exportPlan" >确 定</el-button>
        </div>

    </el-dialog>
  </div>

</template>

<script>
import { findFileByBiz } from '@/api/duChaPlan';
import { hostUrl } from '@/utils/global_variable.js';
import request from '@/utils/gw_ajax_request';
import fenPeiDidian from './fenPeiDidian';
import { jcState } from './jcStore';
import NewPersInfo from './NewPersInfo';
import NewPersXzInfo from './NewPersXzInfo';
export default {
  name: 'jiChaAnPai',
  components: {
    Upload,
    NewPersInfo: NewPersInfo,
    NewPersXzInfo: NewPersXzInfo,
    fenPeiDidian: fenPeiDidian,
  },
  computed: {
    userId: () =>
      localStorage.getItem('userid')
        ? localStorage.getItem('userid')
        : '1098101939614724096',
    groupTypeData() {
      return jcState.groupTypeData;
    },
    roleTypeData() {
      return jcState.roleTypeData;
    },
    hostUrl() {
      return hostUrl;
    },
  },
  data() {
    return {
      header: {
        persId: localStorage.getItem('userid'),
        accessToken: localStorage.getItem('accessToken'),
        orgId: localStorage.getItem('currentOrgId'),
      },
      year: new Date().getFullYear().toString(),
      tableHeight: window.innerHeight - 240,
      tableHeight1: window.innerHeight * 0.5 - 50,
      kbType: '',
      pageSize: 20,
      pageNum: 1,
      total: 0,
      dialogFormVisible: false,
      editRole: {
        roleName: '',
      },
      jiChaJiHuaResult: [],
      dialogAddVisible: false,
      dialogJcAddVisible: false,
      dangQianResult: [],
      loading: false,
      addForm: {
        year: '',
        batch: '',
        persId: localStorage.getItem('userid'),
      },
      editForm: {
        year: '',
        batch: '',
        persId: localStorage.getItem('userid'),
      },
      yearList: [],
      pcList: [],
      areaPrisForm: {
        id: null,
        yearBatchId: null,
        year: null,
        batch: null,
        isCommon: null,
        isProbation: null,
        isPick: null,
        isFit: null,
        isA: false,
        isB: false,
        isC: false,
        isD: false,
        isE: false,
        isNew: null,
        newSize: null,
        isReason: null,
        avoidSize: null,
        isArea: null,
        isPorc: null,
        persId: null,
        inTm: null,
        upTm: null,
        dataStat: null,
        commList: [],
        proList: [],
        goldList: [],
        redList: [],
        newList: null,
      },
      zySychecked: false,
      zcYxchecked: false,
      isZcYx: true,
      xrSlchecked: false,
      newInput: '',
      hlZqchecked: false,
      isXrSlchecked: true,
      isZySychecked: true,
      persAreaId: '',
      commTotal: null,
      commXzTotal: null,
      commCycle: null,
      proTotal: null,
      proXzTotal: null,
      proCycle: null,
      goldTotal: null,
      goldXzTotal: null,
      goldCycle: null,
      redTotal: null,
      redXzTotal: null,
      redCycle: null,
      newTotal: null,
      newXzTotal: null,
      newCycle: null,
      dialogNewPersVisible: false,
      yearBatchId: '',
      areaPrisId: '',
      dialogAddPersVisible: false,
      roleType: '',
      roleTypeSx: '',
      dialogDelPersVisible: false,
      delRadio: '',
      delObj: {},
      indexRow: '',
      rowValue: null,
      random: false,
      confirmConfirmDialog: true,
      distributionLocationDialog: true,
      distributionLocationResult: [],
      XzRyDialog: false,
      filterText: '',
      isReadPers: false,
      sttm: '',
      entm: '',
      dialogTimeVisible: false,
      inspectionNoticeVisible: false,
      fileList: [],
    };
  },
  mounted() {
    this.getDangQianJiHua();
  },
  methods: {
    search() {
      this.getDangQianJiHua();
    },
    getDangQianJiHua() {
      const obj = {
        pageSize: this.pageSize,
        pageNum: this.pageNum,
        year: this.year,
        dataStat: '0',
      };
      this.loading = true;
      request
        .post(`/tac/insp/year/batch/getTacInspYearBatchPage`, obj)
        .then((res) => {
          if (res.success) {
            this.loading = false;
            this.dangQianResult = res.data.list;
            this.total = res.data.total;
          }
        });
    },
    async jcEdit(row) {
      console.log(row);

      this.rowValue = row;
      await request
        .get(`/tac/insp/year/batch/${this.rowValue.id}`)
        .then((res) => {
          if (res.success) {
            this.persAreaId = res.data.persAreaId;
            this.editForm = res.data;
            this.yearBatchId = res.data.id;
            this.jiChaJiHuaResult = res.data.workersList;
            this.distributionLocationResult = res.data.groupList;
          }
        });
      this.getYearPc();
      this.changeYear(this.editForm.year);
      this.dialogFormVisible = true;
    },
    //保存为历史计划
    saveHistoryPlan(row) {
      this.$confirm('确定要保存为历史计划, 是否继续?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning',
      })
        .then(() => {
          request
            .post(`/tac/insp/year/batch`, {
              id: row.id,
              dataStat: '1',
            })
            .then((res) => {
              if (res.success) {
                this.$message.success('保存成功');
                this.getDangQianJiHua();
              }
            });
        })
        .catch(() => {
          this.$message({
            type: 'info',
            message: '已取消保存为历史计划',
            duration: 1000,
          });
        });
    },
    //删除
    delPlan(row) {
      this.$confirm('确定要删除该计划所有数据, 是否继续?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning',
      })
        .then(() => {
          request
            .post(`/tac/insp/year/batch/deleteYearBatchAllObj/${row.id}`)
            .then((res) => {
              if (res.success) {
                this.$message.success('删除成功');
                this.getDangQianJiHua();
              } else {
                this.$message.warning(res.message);
              }
            });
        })
        .catch(() => {
          this.$message({
            type: 'info',
            message: '已取消删除该计划',
            duration: 1000,
          });
        });
    },
    updateRoleInfo() {
      request.post(`/tac/insp/year/batch`, this.addForm).then((res) => {
        if (res.success) {
          this.$message({
            type: 'success',
            message: '添加成功',
            duration: 1000,
          });
          this.dialogAddVisible = false;
          this.getDangQianJiHua();
        }
      });
    },
    getYearPc() {
      request.post(`/tac/insp/year/getYearList`).then((res) => {
        if (res.success) {
          this.$nextTick(() => {
            this.yearList = res.data;
          });
        }
      });
    },
    changeYear(item) {
      console.log(item);
      request
        .post(`/tac/insp/batch/getBatchListByYear`, {
          year: item,
        })
        .then((res) => {
          if (res.success) {
            this.pcList = res.data;
          }
        });
    },
    //新增稽察计划
    addJcJh() {
      this.dialogAddVisible = true;
      this.getYearPc();
      for (var obj in this.addForm) {
        this.addForm[obj] = '';
      }
    },
    //分页
    pageIndexChange(val) {
      this.pageNum = val;
      this.getDangQianJiHua();
    },
    handleSizeChange(val) {
      this.pageSize = val;
      this.getDangQianJiHua();
    },
    //库别
    groupType(row) {
      if (row) {
        jcState.groupTypeData.forEach((ele) => {
          if (ele.value == row) {
            row = ele.label;
          }
        });
        return row;
      } else {
        return '';
      }
    },
    //添加人员
    addPers() {
      this.dialogAddPersVisible = true;
    },
    //随机添加人员
    randomAddPers() {
      this.random = true;
      request
        .get(
          `/tac/insp/pers/area/pris/getAreaPris?id=null&yearBatchId=${this.yearBatchId}`,
        )
        .then((res) => {
          if (res.success) {
            this.areaPrisForm = res.data;
            if (this.areaPrisForm.isPick == '1') {
              this.isZySychecked = false;
            } else {
              this.isZySychecked = true;
            }
            if (this.areaPrisForm.isNew == '1') {
              this.isXrSlchecked = false;
            } else {
              this.isXrSlchecked = true;
            }
            if (this.areaPrisForm.isFit == '1') {
              this.isZcYx = false;
            } else {
              this.isZcYx = true;
            }
            this.dialogJcAddVisible = true;
          }
        });
    },
    //  确认专家人数及原则
    qrZjYz() {
      this.random = false;
      request
        .get(
          `/tac/insp/pers/area/pris/getAreaPris?id=${this.persAreaId}&yearBatchId=${this.yearBatchId}`,
        )
        .then((res) => {
          if (res.success) {
            this.$nextTick(() => {
              this.areaPrisForm = res.data;
              if (this.areaPrisForm.commList.length > 0) {
                (this.commTotal = null),
                  (this.commXzTotal = null),
                  (this.commCycle = null),
                  this.areaPrisForm.commList.forEach((item, index) => {
                    if (!item.selectCount) {
                      item.selectCount = 0;
                    }
                    this.commTotal += parseInt(item.count);
                    this.commXzTotal += parseInt(item.selectCount);
                  });
                this.commCycle = (
                  (this.commXzTotal / this.commTotal) *
                  100
                ).toFixed(2);
              }
              if (this.areaPrisForm.proList.length > 0) {
                (this.proTotal = null),
                  (this.proXzTotal = null),
                  (this.proCycle = null),
                  this.areaPrisForm.proList.forEach((item, index) => {
                    if (!item.selectCount) {
                      item.selectCount = 0;
                    }
                    this.proTotal += parseInt(item.count);
                    this.proXzTotal += parseInt(item.selectCount);
                  });
                this.proCycle = (
                  (this.proXzTotal / this.proTotal) *
                  100
                ).toFixed(2);
              }
              if (this.areaPrisForm.commList.length > 0) {
                (this.goldTotal = null),
                  (this.goldXzTotal = null),
                  (this.goldCycle = null),
                  this.areaPrisForm.goldList.forEach((item, index) => {
                    if (!item.selectCount) {
                      item.selectCount = 0;
                    }
                    this.goldTotal += parseInt(item.count);
                    this.goldXzTotal += parseInt(item.selectCount);
                  });
                this.goldCycle = (
                  (this.goldXzTotal / this.goldTotal) *
                  100
                ).toFixed(2);
              }
            });
            if (this.areaPrisForm.isPick == '1') {
              this.isZySychecked = false;
            } else {
              this.isZySychecked = true;
            }
            if (this.areaPrisForm.isNew == '1') {
              this.isXrSlchecked = false;
            } else {
              this.isXrSlchecked = true;
            }
            if (this.areaPrisForm.isFit == '1') {
              this.isZcYx = false;
            } else {
              this.isZcYx = true;
            }
            this.dialogJcAddVisible = true;
          }
        });
    },
    //查看新人信息
    newPersInfo() {
      if (
        this.areaPrisForm.newSize == null ||
        this.areaPrisForm.newSize == ''
      ) {
        this.$message({
          type: 'warning',
          message: '该年度未达到次数不能为空',
          duration: 2000,
        });
        return;
      } else {
        this.dialogNewPersVisible = true;
        request
          .post(
            `/tac/worker/b/countRoleNew?newSize=${this.areaPrisForm.newSize}`,
          )
          .then((res) => {
            if (res.success) {
              this.$nextTick(() => {
                this.areaPrisForm.newList = res.data;
              });
            }
          });
      }
    },
    //择优使用原则
    changeZySy(bol) {
      if (bol == '1') {
        this.isZySychecked = false;
      } else {
        this.isZySychecked = true;
      }
    },
    //专长优先原则
    changeZcYx(bol) {
      if (bol == '1') {
        this.isZcYx = false;
      } else {
        this.isZcYx = true;
      }
    },
    //change新人适量
    changeXrSl(bol) {
      if (bol == '1') {
        this.isXrSlchecked = false;
      } else {
        this.isXrSlchecked = true;
      }
    },
    handleEdit(index, row) {
      (this.commTotal = null),
        (this.commXzTotal = null),
        (this.commCycle = null),
        (row.scal = ((row.selectCount / row.count) * 100).toFixed(2) + '%');
      console.log(index, row);
      this.$nextTick(() => {
        this.areaPrisForm.commList.forEach((item, index) => {
          if (!item.selectCount) {
            item.selectCount = 0;
          }
          this.commTotal += parseInt(item.count);
          this.commXzTotal += parseInt(item.selectCount);
        });
        this.commCycle = ((this.commXzTotal / this.commTotal) * 100).toFixed(2);
      });
    },
    handleProEdit(index, row) {
      (this.proTotal = null),
        (this.proXzTotal = null),
        (this.proCycle = null),
        (row.scal = ((row.selectCount / row.count) * 100).toFixed(2) + '%');
      console.log(index, row);
      this.$nextTick(() => {
        this.areaPrisForm.proList.forEach((item, index) => {
          if (!item.selectCount) {
            item.selectCount = 0;
          }
          this.proTotal += parseInt(item.count);
          this.proXzTotal += parseInt(item.selectCount);
        });
        this.proCycle = ((this.proXzTotal / this.proTotal) * 100).toFixed(2);
      });
    },
    handleGoldEdit(index, row) {
      (this.goldTotal = null),
        (this.goldXzTotal = null),
        (this.goldCycle = null),
        (row.scal = ((row.selectCount / row.count) * 100).toFixed(2) + '%');
      console.log(index, row);
      this.$nextTick(() => {
        this.areaPrisForm.goldList.forEach((item, index) => {
          if (!item.selectCount) {
            item.selectCount = 0;
          }
          this.goldTotal += parseInt(item.count);
          this.goldXzTotal += parseInt(item.selectCount);
        });
        this.goldCycle = ((this.goldXzTotal / this.goldTotal) * 100).toFixed(2);
      });
    },
    handleRedEdit(index, row) {
      (this.redTotal = null),
        (this.redXzTotal = null),
        (this.redCycle = null),
        (row.scal = ((row.selectCount / row.count) * 100).toFixed(2) + '%');
      console.log(index, row);
      this.$nextTick(() => {
        this.areaPrisForm.redList.forEach((item, index) => {
          if (!item.selectCount) {
            item.selectCount = 0;
          }
          this.redTotal += parseInt(item.count);
          this.redXzTotal += parseInt(item.selectCount);
        });
        this.redCycle = ((this.redXzTotal / this.redTotal) * 100).toFixed(2);
      });
    },
    handleNewEdit(index, row) {
      (this.newTotal = null),
        (this.newXzTotal = null),
        (this.newCycle = null),
        (row.scal = ((row.selectCount / row.count) * 100).toFixed(2) + '%');
      console.log(index, row);
      this.$nextTick(() => {
        this.areaPrisForm.newList.forEach((item, index) => {
          if (!item.selectCount) {
            item.selectCount = 0;
          }
          this.newTotal += parseInt(item.count);
          this.newXzTotal += parseInt(item.selectCount);
        });
        this.newCycle = ((this.newXzTotal / this.newTotal) * 100).toFixed(2);
      });
    },

    // 保存确定专家人数及原则
    updateJcForm() {
      this.areaPrisForm.yearBatchId = this.yearBatchId;
      this.areaPrisForm['isCommon'] = '1';
      this.areaPrisForm['isProbation'] = '1';
      this.areaPrisForm['persId'] = this.userId;
      if (this.random) {
        request
          .post(`/tac/worker/b/getWorkerListByPris`, this.areaPrisForm)
          .then((res) => {
            console.log(this.areaPrisForm);
            if (res.success) {
              this.$message({
                type: 'success',
                message: '保存成功',
                duration: 2000,
              });
              this.persAreaId = res.data.id;
              this.dialogJcAddVisible = false;
              this.refreshConfirmPers();
            } else {
              this.$message.warning(res.message);
            }
          });
      } else {
        request
          .post(`/tac/insp/pers/area/pris`, this.areaPrisForm)
          .then((res) => {
            console.log(this.areaPrisForm);
            if (res.success) {
              this.$message({
                type: 'success',
                message: '保存成功',
                duration: 2000,
              });
              this.persAreaId = res.data.id;
              this.dialogJcAddVisible = false;
              // this.getDangQianJiHua();
              this.refreshConfirmPers();
            } else {
              this.$message.warning(res.message);
            }
          });
      }
    },
    //  人员抽取
    researchersDraw() {
      const obj = {
        prisId: this.persAreaId,
        yearBatchId: this.yearBatchId,
        currPersId: this.userId,
      };
      this.loading = true;
      request.post(`/tac/worker/b/getWorkerListById`, obj).then((res) => {
        if (res.success) {
          this.loading = false;
          this.jiChaJiHuaResult = res.data;
          this.refreshConfirmPers();
        } else {
          this.$message.warning(res.message);
          this.loading = false;
        }
      });
    },
    //人员分配
    PersFenPei() {
      if (this.jiChaJiHuaResult.length > 0) {
        request
          .post(`/tac/worker/b/distributePers`, {
            currPersId: this.userId,
            prisId: this.persAreaId,
          })
          .then((res) => {
            if (res.success) {
              this.$message.success('人员分配成功');
              setTimeout(() => {
                this.$refs.fpdd.refreshDistributionLocation();
              }, 10);
            }
          });
      } else {
        this.$message.warning('人员或组不能为空');
      }
    },
    //清空
    emptyClick() {
      this.$confirm('此操作会清空所有数据, 是否继续?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning',
      })
        .then(() => {
          request
            .post(
              `/tac/insp/year/batch/cleanObjByYearBatchId/${this.yearBatchId}`,
            )
            .then((res) => {
              if (res.success) {
                this.$message.success('操作成功');
                this.refreshConfirmPers();
                setTimeout(() => {
                  this.$refs.fpdd.refreshDistributionLocation();
                }, 10);
              } else {
                this.$message.warning(res.message);
              }
            });
        })
        .catch(() => {
          this.$message({
            type: 'info',
            message: '已取消',
            duration: 1000,
          });
        });
    },
    //  选择角色确定
    addPersInfo() {
      this.XzRyDialog = true;
    },
    //角色翻译
    roleTypes(row) {
      if (row) {
        jcState.roleTypeData.forEach((ele) => {
          if (ele.value == row) {
            row = ele.label;
          }
        });
        return row;
      } else {
        return '';
      }
    },
    //删除人员
    delPers(index, row) {
      console.log(row);
      this.indexRow = index;
      this.dialogDelPersVisible = true;
      this.delObj = {
        yearBatchId: this.yearBatchId,
        roleType: row.roleType,
        persId: this.userId,
        persId2: row.id,
      };
    },
    //删除确定
    delPersInfo() {
      if (!this.delRadio) {
        this.$message.warning('请选择删除原因');
        return;
      } else {
        this.delObj['ninReason'] = this.delRadio;
      }
      request.post(`/tac/insp/year/batch/reason`, this.delObj).then((res) => {
        if (res.success) {
          this.dialogDelPersVisible = false;
          this.$message({
            type: 'success',
            message: '删除成功',
            duration: 1000,
          });
          this.jiChaJiHuaResult.splice(this.indexRow, 1);
        }
      });
    },

    //  选择人员closeXzPers
    closeXzPers() {
      this.XzRyDialog = false;
      this.refreshConfirmPers();
    },
    roleCloseDialog() {
      this.roleType = '';
    },
    //确定地点
    determineLcation() {
      setTimeout(() => {
        this.$refs.fpdd.qrJcDd();
      }, 10);
    },
    //确定时间
    identifyingTime() {
      this.dialogTimeVisible = true;
    },
    //确定人选
    pickCandidates() {
      this.isReadPers = true;
    },
    //稽察通知单
    auditNotification() {
      this.getUpLoadData();
      this.inspectionNoticeVisible = true;
    },
    getUpLoadData() {
      this.fileList = [];
      findFileByBiz(this.yearBatchId).then((res) => {
        if (res.data) {
          res.data.forEach((item) => {
            var obj = {};
            obj.name = item.fileName;
            obj.url = item.filePath;
            obj.bizId = item.bizId;
            obj.id = item.id;
            this.fileList.push(obj);
          });
        }
      });
    },

    //确定时间确认
    confirmTimeInfo() {
      const obj = {
        sttm: this.sttm,
        entm: this.entm,
        batchId: this.yearBatchId,
      };
      request
        .post(`/tac/insp/year/batch/group/updateGroupList`, obj)
        .then((res) => {
          if (res.success) {
            this.$message.success('确定时间成功！');
            this.dialogTimeVisible = false;
            this.jcEdit(this.rowValue);
          }
        });
    },
    //  大保存
    updateDqRoleInfo() {
      console.log(this.editForm);
      request.post(`/tac/insp/year/batch`, this.editForm).then((res) => {
        if (res.success) {
          this.$message({
            type: 'success',
            message: '保存成功',
            duration: 1000,
          });
          this.dialogFormVisible = false;
        }
      });
    },
    //  刷新确定人员
    refreshConfirmPers() {
      request
        .post(`/tac/worker/b/getWorkerbsListById`, {
          yearBatchId: this.yearBatchId,
        })
        .then((res) => {
          if (res.success) {
            this.$nextTick(() => {
              this.jiChaJiHuaResult = res.data;
            });
          }
        });
    },
    UploadUrl: function () {
      return `/pdcApi/file/insert?bizId=${this.yearBatchId}&isNotice=1`;
    },
    exportPlan() {
      this.$refs.upload.submit();
    },
    fileSuccess() {
      this.$message.success('上传成功');
      this.inspectionNoticeVisible = false;
      this.$refs.upload.init();
    },
    fileUpErr(err, file, fileList) {
      if (file.status == 413) {
        this.$message({
          message: '文件过大',
          type: 'warning',
        });
      } else {
        this.$message.warning('上传出错!');
        this.fileList = [];
        return false;
      }
    },
    beforeRemove(file, fileList) {
      return this.$confirm(`确定移除 ${file.name}？`)
        .then(() => {
          request.post(`/file/${file.id}`).then((res) => {
            if (res.success) {
              this.$message({
                type: 'success',
                message: '删除成功!',
              });
              console.log(fileList.length);
              if (fileList.length == '0') {
                this.fileList = [];
              }
            } else {
              this.$alert('删除失败！', '提示', {
                confirmButtonText: '确定',
                type: 'warning',
              });
            }
          });
        })
        .catch(() => {
          this.$message({
            type: 'info',
            message: '已取消删除',
          });
          this.getUpLoadData();
        });
    },
    handlePreview(file) {
      const userAgent = navigator.userAgent;
      if (!!window.ActiveXObject || 'ActiveXObject' in window) {
        this.$message.info('推荐谷歌进行文件预览');
      } else {
        if (file.url) {
          window.open(`${this.hostUrl}${file.url}`, '_blank');
        } else {
          this.$message.warning('请先上传再预览');
        }
      }
    },
    changeUpload(file, fileList) {
      this.fileList = fileList.slice(-1);
    },
  },
  watch: {
    filterText(val) {
      this.jiChaJiHuaResult = this.jiChaJiHuaResult.filter(
        (item) => ~item.name.indexOf(val),
      );
      if (val == '' || val == null) {
        this.refreshConfirmPers();
      }
    },
    roleTypeSx(val) {
      this.jiChaJiHuaResult = this.jiChaJiHuaResult.filter(
        (item) => ~item.roleType.indexOf(val),
      );
      if (val == '' || val == null) {
        this.refreshConfirmPers();
      }
    },
  },
};
</script>

<style>
  .spanBt{
    font-weight: bold;
    font-size: 16px;
  }
  p.title{
    display:block;
    width:120px;
    height:30px;
    position:relative;
    top:-20px;
    text-align: center;
    background: white;
    font-size: 18px;
    color: #000;
    font-weight: bold;
  }
  .jcap .el-input__inner {
    padding: 0 0 0 25px;
  }
  .jcap .block {
    padding: 30px 0;
    text-align: center;
    border-right: 1px solid #eff2f6;
    flex: 1;
  }
  .jcap .block .el-input__inner {
    padding: 0 0 0 30px;
  }
  .jcap .demonstration {
    display: block;
    color: #8492a6;
    font-size: 14px;
    margin-bottom: 20px;
  }


</style>
