<template>
  <div class="temporary whiteBlock">
    <div class="content">
      <div class="title_wrap flex">
        <el-form :inline="true" class="demo-form-inline" size="medium">
          <el-form-item label="审批状态">
            <el-select
              v-model="tableParameter.applyStatus"
              :placeholder="$t('message.laborMange.pleaseChoose')"
              clearable
            >
              <el-option
                v-for="(item, index) in statusListData"
                :key="index"
                :label="item.name"
                :value="item.value"
              ></el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="资质申请时间">
            <el-date-picker
              v-model="tableParameter.timeRange"
              type="daterange"
              value-format="yyyy-MM-dd"
              range-separator="至"
              start-placeholder="开始日期"
              end-placeholder="结束日期"
            >
            </el-date-picker>
          </el-form-item>
          <el-form-item>
            <el-button type="primary" plain @click="searchData">{{
              $t("message.laborMange.inquire")
            }}</el-button>
            <el-button type="warning" plain @click="refresh">{{
              $t("message.laborMange.refresh")
            }}</el-button>
            <el-button type="primary" plain @click="inviteCBS"
              >邀请新承包商入场</el-button
            >
          </el-form-item>
        </el-form>
      </div>
      <vue-scroll style="height: 86%">
        <el-table class="tables" :data="tableData" height="500">
          <el-table-column
            prop="applyTime"
            align="center"
            label="提交申请时间"
          ></el-table-column>
          <el-table-column
            prop="enterpriseName"
            label="承包商名称"
            align="center"
          ></el-table-column>
          <el-table-column
            prop="replyTime"
            label="审批回复时间"
            align="center"
          ></el-table-column>
          <el-table-column label="审批状态" align="center">
            <template slot-scope="scope">
              <span
                :style="{
                  color:
                    scope.row.applyStatus == 1
                      ? '#66A972'
                      : scope.row.applyStatus == 2
                      ? '#5F73CD'
                      : scope.row.applyStatus == 3
                      ? '#E14655'
                      : scope.row.applyStatus == 4
                      ? '#B8B8BA'
                      : '',
                }"
              >
                {{
                  scope.row.applyStatus == 1
                    ? "待审批"
                    : scope.row.applyStatus == 2
                    ? "已审批"
                    : scope.row.applyStatus == 3
                    ? "已驳回"
                    : scope.row.applyStatus == 4
                    ? "已撤销"
                    : ""
                }}
              </span>
            </template>
          </el-table-column>
          <el-table-column
            prop="applyUser"
            label="审批人"
            align="center"
          ></el-table-column>
          <el-table-column
            :label="$t('message.deviceManage.operation')"
            align="center"
            width="400"
          >
            <template slot-scope="scope">
              <div class="tableBtns">
                <div @click="showAudit(scope.row)" class="operationText">
                  <img
                    src="@/assets/images/tableIcon/showReply.png"
                    width="15px"
                    height="15px"
                  />
                  <span>查看详情</span>
                </div>
              </div>
            </template>
          </el-table-column>
        </el-table>
      </vue-scroll>
      <el-pagination
        style="margin: 10px 20px 0"
        class="pagerBox"
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
        :current-page="page"
        :page-sizes="$store.state.PAGESIZRS"
        :page-size="pageSize"
        layout="total, sizes, prev, pager, next"
        :total="Number(total)"
        background
      ></el-pagination>
    </div>
    <!-- 查看详情 -->
    <el-dialog
      class="auditDialog"
      title="查看详情"
      :visible.sync="relativeGroupDialog"
      :modal-append-to-body="false"
      width="80%"
    >
      <div class="dialog_content">
        <div class="tab-content">
          <span
            :class="activeTab == 0 ? 'activeStyle' : ''"
            @click="activeTab = 0"
            >基本信息</span
          >
          <span
            :class="activeTab == 3 ? 'activeStyle' : ''"
            @click="activeTab = 3"
            >承包项目信息</span
          >
          <span
            :class="activeTab == 1 ? 'activeStyle' : ''"
            @click="activeTab = 1"
            >企业资质</span
          >
          <span
            :class="activeTab == 2 ? 'activeStyle' : ''"
            @click="activeTab = 2"
            v-if="[2, 3].includes(rowData.applyStatus)"
            >审批回复</span
          >
        </div>
        <div class="basic-info" v-show="activeTab == 0">
          <div class="custom_tab">
            <div class="flex4">
              <div class="type_content" style="z-index: 2">
                <div class="flex3">
                  <span class="width_35">企业名称</span>
                  <span class="width_65">{{
                    supplierDetail.enterpriseName
                  }}</span>
                </div>
                <div class="flex3">
                  <span class="width_35 bg_color">企业类型</span>
                  <span class="width_65 bg_color">{{
                    supplierDetail.companyTypeName
                  }}</span>
                </div>
                <div class="flex3">
                  <span class="width_35">开户行</span>
                  <span class="width_65">{{ supplierDetail.bankname }}</span>
                </div>
                <div class="flex3">
                  <span class="width_35 bg_color">注册人申请电话</span>
                  <span class="width_65 bg_color">{{
                    supplierDetail.registerPersonPhoneTel
                  }}</span>
                </div>
                <div class="flex3">
                  <span class="width_35">法人电话</span>
                  <span class="width_65">{{
                    supplierDetail.legalPersonTel
                  }}</span>
                </div>
                <div class="flex3">
                  <span class="width_35 bg_color">营业执照截止日期</span>
                  <span class="width_65 bg_color">{{
                    supplierDetail.businessLicenseEndDate
                  }}</span>
                </div>
                <div class="flex3">
                  <span class="width_35">企业邮箱</span>
                  <span class="width_65">{{
                    supplierDetail.enterpriseEmail
                  }}</span>
                </div>
                <div class="flex3">
                  <span class="width_35 bg_color">劳资证书号</span>
                  <span class="width_65 bg_color">{{
                    supplierDetail.qualificationNumber
                  }}</span>
                </div>
                <div class="flex3">
                  <span class="width_35">单位性质</span>
                  <span class="width_65" style="white-space: nowrap">{{
                    supplierDetail.enterpriseProperty == 1
                      ? "国有企业"
                      : supplierDetail.enterpriseProperty == 2
                      ? "三资企业"
                      : supplierDetail.enterpriseProperty == 3
                      ? "集体企业"
                      : supplierDetail.enterpriseProperty == 4
                      ? "私营企业"
                      : ""
                  }}</span>
                </div>
                <div class="flex3">
                  <span class="width_35 bg_color">项目负责人</span>
                  <span class="width_65 bg_color">{{
                    supplierDetail.projectDirectorName
                  }}</span>
                </div>
              </div>
              <div class="type_content">
                <div class="flex3">
                  <span class="width_35 border_l">资质图片</span>
                  <span class="width_65"
                    ><img
                      v-show="supplierDetail.enterpriseQualificationUrl"
                      :src="supplierDetail.enterpriseQualificationUrl"
                      style="
                        width: 40px;
                        height: 40px;
                        margin-top: 2px;
                        cursor: pointer;
                      "
                      @click="
                        bigImageDialog = true;
                        bigImageUrl = supplierDetail.enterpriseQualificationUrl;
                      "
                  /></span>
                </div>
                <div class="flex3">
                  <span class="width_35 bg_color border_l">法定代表人</span>
                  <span class="width_65 bg_color">{{
                    supplierDetail.enterpriseLegalPerson
                  }}</span>
                </div>
                <div class="flex3">
                  <span class="width_35 border_l">统一社会信用代码</span>
                  <span class="width_65">{{ supplierDetail.socialCode }}</span>
                </div>
                <div class="flex3">
                  <span class="width_35 bg_color border_l">注册资金(万元)</span>
                  <span class="width_65 bg_color">{{
                    supplierDetail.registeredCapital
                  }}</span>
                </div>
                <div class="flex3">
                  <span class="width_35 border_l">银行账号</span>
                  <span class="width_65">{{
                    supplierDetail.bankcardnumber
                  }}</span>
                </div>
                <div class="flex3">
                  <span class="width_35 bg_color border_l">营业执照注册号</span>
                  <span class="width_65 bg_color">{{
                    supplierDetail.businessNumber
                  }}</span>
                </div>
                <div class="flex3">
                  <span class="width_35 border_l">企业地址</span>
                  <span class="width_65">{{
                    supplierDetail.enterpriseAddress
                  }}</span>
                </div>
                <div class="flex3">
                  <span class="width_35 bg_color border_l">安全生产许可证</span>
                  <span class="width_65 bg_color">{{
                    supplierDetail.enterpriseSafeAllow
                  }}</span>
                </div>
                <div class="flex3">
                  <span class="width_35 border_l">logo</span>
                  <span class="width_65"
                    ><img
                      v-show="supplierDetail.logo"
                      :src="supplierDetail.logo"
                      style="
                        width: 40px;
                        height: 40px;
                        margin-top: 2px;
                        cursor: pointer;
                      "
                      @click="
                        bigImageDialog = true;
                        bigImageUrl = supplierDetail.logo;
                      "
                  /></span>
                </div>
                <div class="flex3">
                  <span class="width_35 bg_color border_l">项目负责人电话</span>
                  <span class="width_65 bg_color">{{
                    supplierDetail.projectDirectorPhone
                  }}</span>
                </div>
              </div>
            </div>
          </div>
        </div>
        <vue-scroll v-show="activeTab == 3" style="height: 580px">
          <div class="basic-info">
            <div
              class="custom_tab"
              v-for="(item, index) in supplierDetailCBS"
              :key="item.id"
            >
              <div class="flex4">
                <div class="type_content" style="z-index: 2">
                  <div class="flex3">
                    <span class="width_35">承包项目名称</span>
                    <span class="width_65">{{ item.cbsName }}</span>
                  </div>
                  <div class="flex3">
                    <span class="width_35 bg_color">项目经理</span>
                    <span class="width_65 bg_color">{{
                      item.projectManage
                    }}</span>
                  </div>
                  <div class="flex3">
                    <span class="width_35">施工阶段</span>
                    <span class="width_65">{{
                      item.constructionStageName
                    }}</span>
                  </div>
                  <div class="flex3">
                    <span class="width_35 bg_color">经度位置</span>
                    <span class="width_65 bg_color">{{ item.longitude }}</span>
                  </div>

                  <div class="flex3">
                    <span class="width_35">项目编号</span>
                    <span class="width_65">{{ item.projectNumber }}</span>
                  </div>
                  <div class="flex3">
                    <span class="width_35 bg_color">项目面积(m²)</span>
                    <span class="width_65 bg_color">{{
                      item.projectAcreage
                    }}</span>
                  </div>
                  <div class="flex3">
                    <span class="width_35">开工日期</span>
                    <span class="width_65">{{ item.startWorkDate }}</span>
                  </div>
                  <div class="flex3">
                    <span class="width_35 bg_color">现场布置图</span>
                    <span class="width_65 bg_color"
                      ><img
                        v-show="item.layoutImage"
                        :src="item.layoutImage"
                        style="
                          width: 40px;
                          height: 40px;
                          margin-top: 2px;
                          cursor: pointer;
                        "
                        @click="
                          bigImageDialog = true;
                          bigImageUrl = item.layoutImage;
                        "
                    /></span>
                  </div>
                  <div class="flex3">
                    <span class="width_35">联系电话</span>
                    <span class="width_65">{{ item.projectTel }}</span>
                  </div>
                </div>
                <div class="type_content">
                  <div class="flex3">
                    <span class="width_35 border_l">项目施工区域</span>
                    <span class="width_65">{{ item.projectBuildArea }}</span>
                  </div>
                  <div class="flex3">
                    <span class="width_35 bg_color border_l">项目类型</span>
                    <span class="width_65 bg_color">{{
                      item.cbsProjectTypeName
                    }}</span>
                  </div>
                  <div class="flex3">
                    <span class="width_35 border_l">维度位置</span>
                    <span class="width_65">{{ item.latitude }}</span>
                  </div>
                  <div class="flex3">
                    <span class="width_35 bg_color border_l">工程类别</span>
                    <span class="width_65 bg_color">{{
                      item.projectTypeName
                    }}</span>
                  </div>
                  <div class="flex3">
                    <span class="width_35 border_l">结构类型</span>
                    <span class="width_65" style="white-space: nowrap">{{
                      item.structureTypeName
                    }}</span>
                  </div>
                  <div class="flex3">
                    <span class="width_35 bg_color border_l">工程状态</span>
                    <span class="width_65 bg_color">{{
                      typeof item.bulidStatus === "number"
                        ? $t("message.companyDiagram.BUILDSTATUS")[
                            item.bulidStatus
                          ].name
                        : ""
                    }}</span>
                  </div>
                  <div class="flex3">
                    <span class="width_35 border_l"> 竣工日期</span>
                    <span class="width_65">{{ item.completionDate }}</span>
                  </div>
                  <div class="flex3">
                    <span class="width_35 bg_color border_l">现场施工图</span>
                    <span class="width_65 bg_color"
                      ><img
                        v-show="item.constructionMapUrl"
                        :src="item.constructionMapUrl"
                        style="
                          width: 40px;
                          height: 40px;
                          margin-top: 2px;
                          cursor: pointer;
                        "
                        @click="
                          bigImageDialog = true;
                          bigImageUrl = item.constructionMapUrl;
                        "
                    /></span>
                  </div>
                  <div class="flex3">
                    <span class="width_35 border_l"></span>
                    <span class="width_65"></span>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </vue-scroll>
        <div class="company-qualification" v-show="activeTab == 1">
          <el-table class="tables" :data="dialogTableData" height="300">
            <el-table-column
              width="50"
              type="index"
              align="center"
              label="序号"
            ></el-table-column>
            <el-table-column
              prop="qualificationType"
              label="资质类型"
              align="center"
            >
              <template slot slot-scope="scope">
                {{ scope.row.qualificationTypeName }}
              </template>
            </el-table-column>
            <el-table-column
              prop="fileName"
              label="资质文件名称"
              align="center"
            ></el-table-column>
            <el-table-column
              prop="fileNumber"
              label="资质文件编号"
              align="center"
            ></el-table-column>
            <el-table-column label="资质文件" align="center">
              <div slot slot-scope="scope">
                <!-- <img
                  :src="scope.row.fileUrl ? scope.row.fileUrl : []"
                  alt=""
                  width="50px"
                  @click="
                    bigImageDialog = true;
                    bigImageUrl = scope.row.fileUrl;
                  "
                /> -->
                <a :href="scope.row.fileUrl" target="_blank">{{
                  scope.row.originFileName
                }}</a>
              </div>
            </el-table-column>
            <el-table-column
              prop="remarks"
              label="备注"
              align="center"
            ></el-table-column>
          </el-table>
        </div>
        <div
          class="dialog-footer relative-group"
          v-show="activeTab == 1 && rowData.applyStatus == 1"
        >
          <el-button
            type="primary"
            @click="auditReplyDialog = true"
            size="medium"
            >审批
          </el-button>
        </div>
        <div class="audit-reply" v-show="activeTab == 2">
          <div class="audit-content">
            <div class="audit-content-item">
              <span>审批人：</span>
              <span>{{ replyData.applyUser }}</span>
            </div>
            <div class="audit-content-item">
              <span>审批回复时间：</span>
              <span>{{ replyData.replyTime }}</span>
            </div>
            <div class="audit-content-item">
              <span>审批回复：</span>
              <el-input
                v-model="replyData.applyContent"
                disabled
                type="textarea"
                :rows="5"
                style="flex: 1; align-self: flex-start"
              ></el-input>
            </div>
          </div>
        </div>
      </div>
    </el-dialog>
    <!-- 查看审批回复 -->
    <el-dialog
      class="replyDialog"
      title="审批回复"
      :visible.sync="auditReplyDialog"
      :modal-append-to-body="false"
      width="668px"
    >
      <div class="reply-content">
        <div class="reply-content-item">
          <span>审批人：</span>
          <span>{{ $store.state.userInfo.realName }}</span>
        </div>
        <div class="reply-content-item">
          <span>审批回复：</span>
          <el-input
            v-model="auditReplyVal"
            type="textarea"
            :rows="5"
            placeholder="请输入"
            style="width: 300px; align-self: flex-start"
          ></el-input>
        </div>
      </div>
      <div class="dialog-footer relative-group">
        <el-button
          class="cancleBtn"
          @click="noPassFn"
          icon="el-icon-circle-close"
          size="medium"
          type="danger"
          plain
          >审核拒绝
        </el-button>
        <el-button
          type="primary"
          icon="el-icon-circle-check"
          @click="auditPass"
          size="medium"
          >审核通过
        </el-button>
      </div>
    </el-dialog>
    <!-- 查看大图 -->
    <el-dialog
      :modal-append-to-body="false"
      title="查看大图"
      :visible.sync="bigImageDialog"
    >
      <img width="100%" :src="bigImageUrl" alt />
    </el-dialog>
    <!-- 查看大图 -->
    <el-dialog
      :modal-append-to-body="false"
      title="邀请链接"
      :visible.sync="inviteCBSDialog"
    >
      <div class="invitecbs">
        <div>
          {{ $store.state.userInfo.account }}邀请您加入{{
            $store.state.currentProDetail.name
          }}
        </div>
        <div>邀请时间: {{ selectNowDate() }}</div>
        <div>点击链接进入承包商入场申请:</div>
        <div>
          <a :href="inviteCBSUrl1" target="_blank">{{ inviteCBSUrl1 }}</a>
        </div>
      </div>
      <template #footer>
        <div class="dialog-footer">
          <el-button @click="inviteCBSDialog = false">取消</el-button>
          <el-button type="primary" @click="onCopy"> 复制链接 </el-button>
        </div>
      </template>
    </el-dialog>
  </div>
</template>
<script>
import {
  getQualificationApplyListApi,
  getSupplierInfoRecordApi,
  getQualificationFileRecordApi,
  auditQualificationApplyApi,
  qualificationApplyInfoApi,
  getEnterpriseSupplierInfoListApi,
  auditQualificationApplyPassApi,
  auditQualificationApplyRefuseApi,
} from "@/assets/js/api/supplier.js";
import { getComapnyStatisticsListApi, getContractorFlowPageApi } from "@/assets/js/api/company/project";
import { getEnterpriseTypeList } from "@/assets/js/api/laborPerson";
import { getDictionaryItemApi } from "@/assets/js/api/companyDiagram";
import moment from "moment";
export default {
  name: "temporary",
  data() {
    return {
      bigImageDialog: false,
      bigImageUrl: "",
      auditReplyVal: "",
      dialogTableData: [],
      activeTab: 0,
      tableData: [],
      page: 1,
      pageSize: 10,
      total: 0,
      workerName: "",
      projectSn: "",
      statusListData: [
        { name: "待审批", value: 1 },
        { name: "已审批", value: 2 },
        { name: "已驳回", value: 3 },
        // { name: "已撤销", value: 4 },
      ],
      tableParameter: {
        applyStatus: "",
        timeRange: [],
      },
      relativeGroupDialog: false,
      level1CompanyData: [],
      filterText: "",
      defaultProps: {
        children: "list",
        label: "name",
      },
      auditReplyDialog: false,
      supplierDetail: {
        enterpriseName: "",
        enterpriseQualificationUrl: "",
        companyTypeName: "",
        xzSupplierTypeId: "",
        enterpriseLegalPerson: "",
        bankname: "",
        socialCode: "",
        registerPersonPhoneTel: "",
        registeredCapital: "",
        legalPersonTel: "",
        bankcardnumber: "",
        businessLicenseEndDate: "",
        businessNumber: "",
        enterpriseEmail: "",
        enterpriseAddress: "",
        qualificationNumber: "",
        enterpriseSafeAllow: "",
        enterpriseProperty: "",
        logo: "",
        projectDirectorName: "",
        projectDirectorPhone: "",
      },
      supplierDetailCBS: [
        {
          cbsName: "", // 承包项目名称
          projectBuildArea: "", // 项目施工区域
          completionDate: "", // 竣工日期
          cbsProjectType: "", // 项目类型
          projectManage: "", // 项目经理
          latitude: "", // 维度位置
          longitude: "", // 经度位置
          projectType: "", // 工程类别
          projectNumber: "", // 项目编号
          structureType: "", // 结构类型
          projectAcreage: "", // 项目面积(m²)
          bulidStatus: "", // 工程状态
          startWorkDate: "", // 开工日期
          constructionStage: "", // 施工阶段
          layoutImage: "", // 现场布置图
          constructionMapUrl: "", // 现场施工图
          projectTel: "", // 联系电话
        },
      ],
      rowData: {},
      replyData: {},
      inviteCBSDialog: false,
      inviteCBSUrl: "",
      inviteCBSUrl1: "",
      companyTypeList: [],
    };
  },
  computed: {
    xzSupplierType() {
      const find = this.companyTypeList.find(
        (item) => item.id == this.supplierDetail.xzSupplierTypeId
      );
      console.log(
        find,
        this.companyTypeList,
        this.supplierDetail.xzSupplierTypeId
      );
      if (find) {
        return find.companyTypeName;
      }
    },
    constructionStageUp() {
      return (typeList, constructionStage) => {
        const find = typeList.find((item) => item.data == constructionStage);
        if (find) {
          return find.name;
        }
      };
    },
  },
  created() {
    this.projectSn = this.$store.state.projectSn;
    this.getTableList();
    this.loadData();
    this.getCompanyTypeList();
  },
  watch: {
    filterText(val) {
      this.$refs.tree.filter(val);
    },
  },
  methods: {
    // 获取企业类型列表
    getCompanyTypeList() {
      getEnterpriseTypeList({}).then((res) => {
        console.log(res, "企业类型列表");
        if (res.result) {
          this.companyTypeList = res.result;
        }
      });
    },
    // 邀请新承包商入场
    inviteCBS() {
      console.log(this.inviteCBSDialog);
      getContractorFlowPageApi({}).then((res) => {
        console.log(res, "邀请新承包商入场");
        this.inviteCBSUrl1 = `${this.$store.state.CONTRACTORURL2}?token=${res.result}&projectSn=${this.$store.state.projectSn}`;
       });

      // this.inviteCBSUrl = `${this.$store.state.CONTRACTORURL}?sn=${this.$store.state.projectSn}`;
      this.inviteCBSDialog = true;
    },
    onCopy() {
      const resultUrl = `${this.$store.state.userInfo.account}邀请您加入${this.$store.state.currentProDetail.name}\n邀请时间：${this.selectNowDate()}\n点击链接进入承包商入场申请:\n${this.inviteCBSUrl1}`;
      if (navigator.clipboard && window.isSecureContext) {
        navigator.clipboard.writeText(resultUrl);
      } else {
        let textArea = document.createElement("textarea");
        textArea.value = resultUrl;
        // 使text area不在viewport，同时设置不可见
        textArea.style.position = "absolute";
        textArea.style.opacity = 0;
        document.body.appendChild(textArea);
        textArea.focus();
        textArea.select();
        // 执行复制命令并移除文本框
        document.execCommand("copy");
        textArea.remove();
      }

      this.$message.success("复制成功");
    },
    // 获取当前时间 返回YYYY-MM-DD HH:mm:ss
    selectNowDate() {
      var date = new Date(),
        year = date.getFullYear(),
        month = date.getMonth() + 1,
        day = date.getDate(),
        hours = date.getHours(), //获取当前小时数(0-23)
        minutes = date.getMinutes(), //获取当前分钟数(0-59)
        seconds = date.getSeconds();
      month >= 1 && month <= 9 ? (month = "0" + month) : "";
      day >= 0 && day <= 9 ? (day = "0" + day) : "";
      hours >= 0 && hours <= 9 ? (hours = "0" + hours) : "";
      minutes >= 0 && minutes <= 9 ? (minutes = "0" + minutes) : "";
      seconds >= 0 && seconds <= 9 ? (seconds = "0" + seconds) : "";
      var timer =
        year +
        "-" +
        month +
        "-" +
        day +
        " " +
        hours +
        ":" +
        minutes +
        ":" +
        seconds; // 获取至当前的时间
      console.log(timer);
      return timer;
    },
    // 查看详情-审批回复内容
    loadqulificationReplyRecord() {
      let requestData = {
        id: this.rowData.id,
      };
      qualificationApplyInfoApi(requestData).then((res) => {
        if (res.result) {
          this.replyData = res.result;
        }
      });
    },
    // 查看详情-企业资质
    loadCompanyQulificationRecord() {
      let requestData = {
        xzSupplierQualificationApplyId: this.rowData.id,
      };
      getQualificationFileRecordApi(requestData).then((res) => {
        console.log(res, "资质文件表格");
        if (res.result) {
          this.dialogTableData = res.result;
          this.dialogTableData.map((item) => {
            // if (!item.fileUrl.includes(this.$store.state.FILEURL)) {
            //   item.fileUrl = this.$store.state.FILEURL + item.fileUrl;
            // }
            if (!item.fileUrl.includes(this.$store.state.FILEURL)) {
              if (item.fileUrl.includes("name")) {
                item.fileUrl =
                  this.$store.state.FILEURL + JSON.parse(item.fileUrl)[0].url;
              } else {
                item.fileUrl = this.$store.state.FILEURL + item.fileUrl;
              }
            }
          });
        }
      });
    },
    // 查看详情-基本信息
    loadBasicInfoRecord() {
      getSupplierInfoRecordApi({
        xzSupplierQualificationApplyId: this.rowData.id,
      }).then((res) => {
        console.log(res, "基本信息");
        if (res.result) {
          this.supplierDetail = {
            ...res.result,
            enterpriseQualificationUrl: res.result.enterpriseQualificationUrl ? (res.result.enterpriseQualificationUrl.includes(this.$store.state.FILEURL) ? res.result.enterpriseQualificationUrl : this.$store.state.FILEURL + res.result.enterpriseQualificationUrl) : res.result.enterpriseQualificationUrl,
            logo: res.result.logo ? (res.result.logo.includes(this.$store.state.FILEURL) ? res.result.logo : this.$store.state.FILEURL + res.result.logo) : res.result.logo,
          };
        }
      });
    },
    // 刷新
    refresh() {
      this.tableParameter = {
        applyStatus: "",
        timeRange: [],
      };
      this.searchData();
    },
    // 表格搜索
    searchData() {
      this.page = 1; // 回归第一页
      this.getTableList();
    },
    // 获取表格数据
    getTableList() {
      let requestData = {
        userId: this.$store.state.userInfo.userId,
        pageNo: this.page,
        pageSize: this.pageSize,
        applyStatus: this.tableParameter.applyStatus,
        projectSn: this.$store.state.projectSn,
      };
      if (
        this.tableParameter.timeRange &&
        this.tableParameter.timeRange.length > 0
      ) {
        requestData.createTime_begin = this.tableParameter.timeRange[0];
        requestData.createTime_end = this.tableParameter.timeRange[1];
      }
      getQualificationApplyListApi(requestData).then((res) => {
        console.log(res, "资质申请表格");
        if (res.result && res.result.records) {
          this.tableData = res.result.records;
          this.total = res.result.total;
        }
      });
    },
    // 查看审批详情
    showAudit(item) {
      this.rowData = item;
      this.activeTab = 0; // tab回归默认
      this.auditReplyVal = ""; // 审核回复内容框回归默认
      this.loadBasicInfoRecord();
      this.loadCompanyQulificationRecord();
      this.getEnterpriseSupplierInfoList();
      if ([2, 3].includes(this.rowData.applyStatus)) {
        this.loadqulificationReplyRecord();
      }
      this.relativeGroupDialog = true;
    },
    // 承包项目信息
    getEnterpriseSupplierInfoList() {
      let requestData = {
        xzSupplierQualificationApplyId: this.rowData.id,
        type: 1,
      };
      getEnterpriseSupplierInfoListApi(requestData).then((res) => {
        console.log(res, "承包项目信息");
        if (res.result) {
          this.supplierDetailCBS = res.result.map(item => {
            return {
              ...item,
              constructionMapUrl: item.constructionMapUrl ? (item.constructionMapUrl.includes(this.$store.state.FILEURL) ? item.constructionMapUrl : this.$store.state.FILEURL + item.constructionMapUrl) : item.constructionMapUrl,
              layoutImage: item.layoutImage ? (item.layoutImage.includes(this.$store.state.FILEURL) ? item.layoutImage : this.$store.state.FILEURL + item.layoutImage) : item.layoutImage,
            }
          });
        }
      });
    },
    loadData() {
      let sn = this.$store.state.userInfo.sn;
      let projectType = 1; // 展示项目列表
      if (this.$store.state.userInfo.addProjectType == 1) {
        projectType = 0; // 不展示项目列表
      }
      getComapnyStatisticsListApi({
        sn: sn,
        projectType: projectType,
      }).then((res) => {
        console.log(res, "111222333");
        this.level1CompanyData = res.result.companyList
          ? res.result.companyList
          : res.result.projectList;
      });
      console.log(this.level1CompanyData, "111222333");
    },
    filterNode(value, data) {
      if (!value) return true;
      return data.name.indexOf(value) !== -1;
    },
    // 拒绝申请
    noPassFn() {
      let item = this.rowData;
      this.$confirm(
        `确定要拒绝审核吗？`,
        this.$t("message.companyDiagram.Tips"),
        {
          confirmButtonText: this.$t(
            "message.companyDiagram.confirmButtonText"
          ), //确定
          cancelButtonText: this.$t("message.companyDiagram.cancelButtonText"), //取消
          type: "warning",
        }
      ).then(() => {
        auditQualificationApplyRefuseApi({
          id: item.id,
          applyStatus: 3,
          applyContent: this.auditReplyVal,
          applyUser: this.$store.state.userInfo.realName,
          replyTime: moment().format("YYYY-MM-DD HH:mm:ss"),
          resubmitApplicationUrl: `${this.$store.state.CONTRACTORURL}?sn=${this.$store.state.projectSn}&xzSupplierQualificationApplyId=${this.rowData.id}`,
        }).then((res) => {
          this.$message.error("已拒绝");
          this.relativeGroupDialog = false;
          this.auditReplyDialog = false;
          this.getTableList();
        });
      });
    },
    // 审批通过
    auditPass() {
      let item = this.rowData;
      this.$confirm(
        `确定要通过审核吗？`,
        this.$t("message.companyDiagram.Tips"),
        {
          confirmButtonText: this.$t(
            "message.companyDiagram.confirmButtonText"
          ), //确定
          cancelButtonText: this.$t("message.companyDiagram.cancelButtonText"), //取消
          type: "warning",
        }
      ).then(() => {
        auditQualificationApplyPassApi({
          id: item.id,
          applyStatus: 2,
          applyContent: this.auditReplyVal,
          applyUser: this.$store.state.userInfo.realName,
          replyTime: moment().format("YYYY-MM-DD HH:mm:ss"),
          // projectSn: this.$store.state.userInfo.sn,
          // noticeEmail:"",
          // resubmitApplicationUrl: `http://192.168.34.175:5173/#/contractorApply?sn=${this.$store.state.projectSn}&xzSupplierQualificationApplyId=${this.rowData.id}`,
        }).then((res) => {
          this.$message.success("已通过");
          this.relativeGroupDialog = false;
          this.auditReplyDialog = false;
          this.getTableList();
        });
      });
    },
    //切换数量
    handleSizeChange(value) {
      this.pageSize = value;
      this.getTableList();
    },
    handleCurrentChange(value) {
      this.page = value;
      this.getTableList();
    },
  },
};
</script>
<style lang="less" scoped>
.invitecbs {
  > div {
    line-height: 30px;
  }
}
.treeStyle() {
  /deep/.el-tree {
    font-size: 15px;
    width: 100%;
    background-color: transparent;
    .el-tree-node {
      white-space: normal;
      &:focus > .el-tree-node__content {
        background-color: transparent;
      }
      &.is-current > .el-tree-node__content {
        background-color: rgba(81, 129, 246, 0.14);
        color: #5181f6;
      }
    }
    .el-tree-node__content {
      // height: 32px;
      padding: 7px 0;
      height: auto;
      line-height: 16px;
      position: relative;
      // margin-bottom: 7px;
      &:hover {
        background-color: rgba(81, 129, 246, 0.14);
        color: #5181f6;
      }

      .videoName {
        font-size: 14px;
      }
      .projectName {
        font-size: 14px;
        width: calc(100% - 55px);
        display: inline-block;
      }
      .companyName2 {
        font-size: 16px;
        font-weight: bold;
        display: inline-block;
        width: 192px;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
      }
    }
    .el-tree-node__expand-icon {
      font-size: 16px;
      padding: 0 6px;
      &.is-leaf {
        color: transparent !important;
      }
    }
    .treeTitle {
      background-color: #f7f7f7;
      margin-bottom: 10px;
    }
  }
}
.flex {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.flex2 {
  display: flex;
  align-items: center;
  justify-content: space-around;
}
.flex3 {
  display: flex;
  align-items: center;
}
.flex4 {
  display: flex;
  justify-content: space-between;
}
.flex5 {
  display: flex;
  align-items: center;
  justify-content: center;
}
.temporary {
  width: 100%;
  height: 100%;

  .content {
    padding: 15px 0;
    box-sizing: border-box;
    width: 100%;
    height: calc(100% - 42px);
  }
  .title_wrap {
    width: 100%;
    box-sizing: border-box;
    padding: 0 20px;
    border-bottom: 2px solid @borderColor;
  }
  .tableBtns {
    .flex();
    justify-content: center;
  }
}
// 查看详情弹框样式
.auditDialog /deep/ .el-dialog__body {
  padding-top: 0px;
  padding-bottom: 30px;
}
.dialog_content {
  padding: 0px;
  .tab-content {
    margin-top: 10px;
    display: flex;
    align-items: center;
    span {
      font-family: Source Han Sans CN, Source Han Sans CN;
      font-weight: 400;
      color: #272d45;
      font-style: normal;
      text-transform: none;
      cursor: pointer;
    }
    span:not(:last-child) {
      margin-right: 20px;
    }
    .activeStyle {
      color: #5181f6;
    }
  }
  .basic-info {
    margin-top: 20px;
    .custom_tab {
      width: 100%;
      height: 100%;
      box-sizing: border-box;
      border: 1px solid rgba(148, 148, 148, 0.5);
      border-bottom: none;
      margin-top: 20px;
      // color: #333;
      .title {
        width: 100%;
        font-size: 14px;
        padding: 12px 20px;
        border-bottom: 1px solid rgba(148, 148, 148, 0.5);
        box-sizing: border-box;
        height: 44px;
        background: #eeeeee;
      }

      .type_content {
        width: 50%;
        div {
          font-size: 14px;
          padding: 12px 0;
          height: 44px;
          line-height: 44px;
          box-sizing: border-box;
          border-bottom: 1px solid rgba(148, 148, 148, 0.5);
        }
      }

      .width_65 {
        width: 80%;
        display: inline-block;
        box-sizing: border-box;
        height: 44px;
        padding: 0 15px;
      }
      .width_35 {
        width: 20%;
        display: inline-block;
        box-sizing: border-box;
        border-right: 1px solid rgba(148, 148, 148, 0.5);
        padding: 0 15px;
        text-align: left;
      }
    }
    .bg_color {
      background: rgba(235, 234, 234, 0.5);
      display: inline-block;
      box-sizing: border-box;
    }
    .border_l {
      border-left: 1px solid rgba(148, 148, 148, 0.5);
    }
  }
  .company-qualification {
    margin-top: 20px;
  }
  .audit-reply {
    width: 90%;
    margin: 0 auto;
    margin-top: 20px;
    .audit-content {
      width: 100%;
      line-height: 40px;
      &-item {
        display: flex;
        span {
          font-family: Source Han Sans CN, Source Han Sans CN;
          font-weight: 400;
          color: #272d45;
          font-style: normal;
          text-transform: none;
        }
        span:nth-child(1) {
          display: inline-block;
          width: 105px;
          text-align: right;
        }
      }
    }
  }
}
// 审批回复弹框样式
.replyDialog /deep/ .el-dialog__body {
  padding: 10px 20px 15px 20px;
}
.reply-content {
  width: max-content;
  margin: 0 auto;
  line-height: 40px;
  &-item {
    display: flex;
    span {
      font-family: Source Han Sans CN, Source Han Sans CN;
      font-weight: 400;
      color: #272d45;
      font-style: normal;
      text-transform: none;
    }
    span:nth-child(1) {
      display: inline-block;
      width: 105px;
      text-align: right;
    }
  }
  &-item:nth-child(1) {
    align-items: center;
  }
}
</style>
