<template>
  <div class="common-wrap-cnt">
    <section class="header-top">
      <div class="header_top_left">
        <div class="icon_box">
          <div class="header_icon_box">
            <img
              src="../../../../../assets/imgs/icon_company.png"
              alt=""
              class="header_icon"
            >
          </div>
        </div>
        <div class="base-info">
          <el-form ref="profileForm" :model="baseHeaderForm" class="headerForm">
            <el-form-item prop="custName" label-width="20px">
              <span slot="label">
                <el-tooltip
                  placement="top"
                  trigger="hover"
                  content="建档输入/取新华社数据"
                >
                  <span class="quesiton"><i class="el-icon-question" /></span>
                </el-tooltip>
              </span>
              <span
                v-if="!isEditing"
                style="font-size: 24px; font-weight: 600; text-align: center"
              >{{ baseHeaderForm.custName }}</span>
              <!-- <el-tag v-if="isShow" type="danger" class="wjd">未建档</el-tag> -->
              <el-tag v-if="canEdit" type="danger" class="wjd">行外客户</el-tag>
              <el-input
                v-if="isEditing"
                v-model="baseHeaderForm.custName"
                maxlength="18"
              />
            </el-form-item>
            <el-form-item
              label-width="62px"
              prop="socialCreditCode"
              label="统信码："
            >
              <span>{{ baseHeaderForm.socialCreditCode }}</span>
            </el-form-item>
          </el-form>
        </div>
      </div>
      <section class="form-operate">
        <span style="margin-right: 20px; color: #f50;font-weight: bold;">{{ customLevel }}</span>
        <el-button
          type="plain"
          size="small"
          @click="goBackToIndex"
        >返回</el-button>
        <el-button
          v-if="!isEditing"
          type="primary"
          size="small"
          :disabled="canEdit"
          @click="handleEdit"
        >编辑</el-button>
        <el-button
          v-if="isEditing"
          type="primary"
          size="small"
          @click="handleCancle"
        >取消</el-button>
        <el-button
          type="primary"
          size="small"
          :disabled="isSaveDisable"
          @click="handleSave"
        >保存</el-button>
        <el-button
          type="primary"
          size="small"
          @click="handleExport"
        >导出</el-button>
        <el-button
          v-if="
            isHeadAdmin || isPublic || isPrivate || isHeadOps || isBranchAdmin
          "
          type="primary"
          size="small"
          @click="handleAddZf"
        >添加走访</el-button>
        <el-button
          type="primary"
          size="small"
          @click="handleSecondVisit"
        >二次走访</el-button>
        <el-button
          type="primary"
          size="small"
          @click="handleRecource"
        >资源申请</el-button>
      </section>
    </section>
    <section class="common-create-main">
      <p class="common-title">基础信息</p>
      <div class="line" />
      <el-form
        ref="profileForm"
        :model="baseForm"
        :rules="rules"
        class="profileForm"
      >
        <el-row>
          <el-col :span="8">
            <el-form-item label-width="113px" prop="lpName">
              <span slot="label">
                <el-tooltip
                  class="item"
                  effect="dark"
                  placement="top"
                  trigger="hover"
                  content="建档输入/取核心法人表信息"
                  width="200"
                >
                  <span class="quesiton"><i class="el-icon-question" /></span>
                </el-tooltip>
                法人姓名：
              </span>
              <span v-if="!isEditing">{{ baseForm.lpName }}</span>
              <el-input
                v-if="isEditing"
                v-model="baseForm.lpName"
                maxlength="18"
              />
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label-width="85px" prop="custGender">
              <span slot="label">
                <el-tooltip
                  placement="top"
                  trigger="hover"
                  content="取身份证号17位值计算"
                >
                  <span class="quesiton"><i class="el-icon-question" /></span>
                </el-tooltip>
                性别：
              </span>
              <span v-if="!isEditing">{{ baseForm.custGender }}</span>
              <el-select v-if="isEditing" v-model="baseForm.custGender">
                <el-option
                  v-for="(item, index) in genderList"
                  :key="index"
                  :label="item.label"
                  :value="item.value"
                />
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label-width="85px" prop="custAge">
              <span slot="label">
                <el-tooltip
                  placement="top"
                  trigger="hover"
                  content="取身份证号7-14位值计算"
                >
                  <span class="quesiton"><i class="el-icon-question" /></span>
                </el-tooltip>
                年龄：
              </span>
              <span v-if="!isEditing">{{ baseForm.custAge }}</span>
              <el-input
                v-if="isEditing"
                v-model="baseForm.custAge"
                maxlength="3"
              />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="8">
            <el-form-item label-width="113px" prop="custIdc">
              <span slot="label">
                <el-tooltip
                  placement="top"
                  trigger="hover"
                  content="建档输入/取核心法人信息表"
                >
                  <span class="quesiton"><i class="el-icon-question" /></span>
                </el-tooltip>
                身份证号：
              </span>
              <span>{{ baseForm.custIdc }}</span>
              <!-- <el-input v-model="baseForm.custIdc" v-if="isEditing"></el-input> -->
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label-width="141px" prop="custPhone">
              <span slot="label">
                <el-tooltip
                  placement="top"
                  trigger="hover"
                  content="建档输入/取核心法人信息表数据"
                >
                  <span class="quesiton"><i class="el-icon-question" /></span>
                </el-tooltip>
                法人联系方式：
              </span>
              <span v-if="!isEditing">{{ baseForm.custPhone }}</span>
              <el-input v-if="isEditing" v-model="baseForm.custPhone" />
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label-width="113px" prop="birthday">
              <span slot="label">
                <el-tooltip
                  placement="top"
                  trigger="hover"
                  content="取身份证号7-14位值计算"
                >
                  <span class="quesiton"><i class="el-icon-question" /></span>
                </el-tooltip>
                出生日期：
              </span>
              <span v-if="!isEditing">{{ baseForm.birthday }}</span>
              <el-date-picker
                v-if="isEditing"
                v-model="baseForm.birthday"
                type="date"
                placeholder="选择日期"
                value-format="yyyy-MM-dd"
                @change="handleChangeBirthday"
              />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="8">
            <el-form-item label="客户号：">
              <span>{{ baseForm.custId }}</span>
              <!-- <el-input v-model="baseForm.custId" v-if="isEditing"></el-input> -->
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label-width="113px">
              <span slot="label">
                <el-tooltip
                  placement="top"
                  trigger="hover"
                  content="新华社数据"
                >
                  <span class="quesiton"><i class="el-icon-question" /></span>
                </el-tooltip>
                客户内码：
              </span>
              <span>{{ baseForm.custIsn }}</span>
              <!-- <el-input v-model="baseForm.custIsn" v-if="isEditing"></el-input> -->
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label-width="100px" prop="socialCreditCode">
              <span slot="label">
                <el-tooltip
                  placement="top"
                  trigger="hover"
                  content="建档输入/新华社数据"
                >
                  <span class="quesiton"><i class="el-icon-question" /></span>
                </el-tooltip>
                统信码：
              </span>
              <span>{{ baseForm.socialCreditCode }}</span>
              <!-- <el-input v-model="baseForm.socialCreditCode" v-if="isEditing" maxlength="18"></el-input> -->
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="8">
            <el-form-item label-width="113px">
              <span slot="label">
                <el-tooltip
                  placement="top"
                  trigger="hover"
                  content="建档输入/新华社数据"
                >
                  <span class="quesiton"><i class="el-icon-question" /></span>
                </el-tooltip>
                行业名称：
              </span>
              <span v-if="!isEditing" :title="industryStr" class="ccyc">{{
                !isNaN(Number(baseForm.industry))
                  ? baseForm.industry
                    ? industryStr
                    : baseForm.belongBusiness
                  : baseForm.industry
              }}</span>
              <el-cascader
                v-if="isEditing"
                v-model="baseForm.industry"
                :options="industryOptions"
                :props="{
                  expandTrigger: 'hover',
                  label: 'label',
                  value: 'value',
                  checkStrictly: true,
                }"
              />
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label-width="113px">
              <span slot="label">
                <el-tooltip
                  placement="top"
                  trigger="hover"
                  content="建档输入/新华社数据"
                >
                  <span class="quesiton"><i class="el-icon-question" /></span>
                </el-tooltip>
                经营状态：
              </span>
              <span v-if="!isEditing">
                <span>{{ initStatus(baseForm.status) }}</span>
              </span>
              <el-select v-if="isEditing" v-model="baseForm.status">
                <el-option
                  v-for="(item, index) in statusList"
                  :key="index"
                  :label="item.label"
                  :value="item.value"
                />
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label-width="113px">
              <span slot="label">
                <el-tooltip
                  placement="top"
                  trigger="hover"
                  content="建档输入/新华社数据"
                >
                  <span class="quesiton"><i class="el-icon-question" /></span>
                </el-tooltip>
                经营范围：
              </span>
              <span
                v-if="!isEditing"
                :title="baseForm.businessScope"
                class="ccyc"
              >{{ baseForm.businessScope }}</span>
              <el-input
                v-if="isEditing"
                v-model="baseForm.businessScope"
                maxlength="18"
              />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="8">
            <el-form-item label-width="113px">
              <span slot="label">
                <el-tooltip
                  placement="top"
                  trigger="hover"
                  content="建档输入/新华社数据"
                >
                  <span class="quesiton"><i class="el-icon-question" /></span>
                </el-tooltip>
                注册资本：
              </span>
              <span v-if="!isEditing">{{ baseForm.custCapital }}</span>
              <el-input
                v-if="isEditing"
                v-model="baseForm.custCapital"
                maxlength="18"
              />
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label-width="113px" prop="tel">
              <span slot="label">
                <el-tooltip
                  placement="top"
                  trigger="hover"
                  content="建档输入/新华社数据"
                >
                  <span class="quesiton"><i class="el-icon-question" /></span>
                </el-tooltip>
                联系方式：
              </span>
              <span v-if="!isEditing">{{ baseForm.tel }}</span>
              <el-input v-if="isEditing" v-model="baseForm.tel" />
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="更新时间：">
              <span>{{ baseForm.updateTime }}</span>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <!-- <el-col :span="8">
            <el-form-item label="资产情况：">
              <span>{{ baseForm.asset }}</span>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="信用状况：">
              <span>{{ baseForm.credit }}</span>
            </el-form-item>
          </el-col> -->
          <el-col :span="8">
            <el-form-item label="行政归属网格区划：">
              <span>{{ baseForm.community }}</span>
            </el-form-item>
          </el-col>
          <el-col v-if="!isHeadOps" :span="8">
            <el-form-item label="行政网格客户经理(公司部)：">
              <span>{{ baseForm.xzGsGridUserName }}</span>
            </el-form-item>
          </el-col>
          <el-col v-if="!isHeadOps" :span="8">
            <el-form-item label="行政归属网格(公司部)：">
              <span>{{ baseForm.xzGsGridName }}</span>
            </el-form-item>
          </el-col>
          <el-col v-if="!isPublic" :span="8">
            <el-form-item label="行政网格客户经理(运管部)：">
              <span>{{ baseForm.xzYgGridUserName }}</span>
            </el-form-item>
          </el-col>
          <el-col v-if="!isPublic" :span="8">
            <el-form-item label="行政归属网格(运管部)：">
              <span>{{ baseForm.xzYgGridName }}</span>
            </el-form-item>
          </el-col>
          <el-col v-for="(item, index) in cliList" :key="index" :span="8">
            <el-form-item
              v-if="item.cmpmType == '贷款客户经理'"
              :label="`${item.cmpmType}：`"
            >
              <span>{{ is932Dept ? `${baseForm.belongUserName}-${baseForm.belongUserId}` : item.cmpmUserList }}</span>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
    </section>
    <el-collapse
      v-model="activeName"
      accordion
      class="collapse_main"
      @change="handleCollapse"
    >
      <el-collapse-item name="0">
        <template slot="title">
          <p class="common-title">地址信息</p>
        </template>
        <div class="dzBox">
          <div class="dzBox_top">
            <div class="dzBox_item">
              <div class="dzBox_title">经营地址</div>
              <div class="dzBox_wapper">
                <div
                  v-for="(item, index) in jydzList"
                  :key="index"
                  class="dzBox_content"
                >
                  <div>
                    <span>{{ item.address }}</span>
                    <el-tag style="margin-left: 5px">{{ item.source }}</el-tag>
                  </div>
                </div>
              </div>
            </div>
            <div class="dzBox_item">
              <div class="dzBox_title">注册地址</div>
              <div class="dzBox_wapper">
                <div
                  v-for="(item, index) in zcdzList"
                  :key="index"
                  class="dzBox_content"
                >
                  <div>
                    <span>{{ item.address }}</span>
                    <el-tag style="margin-left: 5px">{{ item.source }}</el-tag>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
      </el-collapse-item>
      <el-collapse-item name="1">
        <template slot="title">
          <p class="common-title">签约产品</p>
        </template>
        <div style="height: 250px">
          <div
            v-if="Object.keys(this.signedProducts).length != 0"
            class="t360-production"
          >
            <div class="title_box1">
              <div
                v-if="this.signedProducts.deposit"
                class="t360-production-item"
              >
                存款
              </div>
              <div class="ejTitle">
                <div class="ejTitle_item">
                  {{
                    this.signedProducts.deposit
                      ? this.signedProducts.deposit.currdeposFlag
                        ? this.signedProducts.deposit.currdeposFlag
                        : ""
                      : ""
                  }}
                </div>
              </div>
            </div>
            <div class="t360-production">
              <div class="title_box2">
                <div
                  v-if="this.signedProducts.loan"
                  class="t360-production-item"
                >
                  贷款
                </div>
                <div class="ejTitle">
                  <div class="ejTitle_item">
                    {{
                      this.signedProducts.loan
                        ? this.signedProducts.loan.hatflowcostbookFlag
                          ? this.signedProducts.loan.hatflowcostbookFlag
                          : ""
                        : ""
                    }}
                  </div>
                  <div class="ejTitle_item">
                    {{
                      this.signedProducts.loan
                        ? this.signedProducts.loan.zheliloanFlag
                          ? this.signedProducts.loan.zheliloanFlag
                          : ""
                        : ""
                    }}
                  </div>
                  <div class="ejTitle_item">
                    {{
                      this.signedProducts.loan
                        ? this.signedProducts.loan.phmortgloanFlag
                          ? this.signedProducts.loan.phmortgloanFlag
                          : ""
                        : ""
                    }}
                  </div>
                </div>
              </div>
            </div>
            <div class="t360-production">
              <div class="title_box3">
                <div
                  v-if="this.signedProducts.wealth"
                  class="t360-production-item"
                >
                  财富
                </div>
                <div class="ejTitle">
                  <div class="ejTitle_item">
                    {{
                      this.signedProducts.wealth
                        ? this.signedProducts.wealth.bondbookFlag
                          ? this.signedProducts.wealth.bondbookFlag
                          : ""
                        : ""
                    }}
                  </div>
                  <div class="ejTitle_item">
                    {{
                      this.signedProducts.wealth
                        ? this.signedProducts.wealth.financialbookFlag
                          ? this.signedProducts.wealth.financialbookFlag
                          : ""
                        : ""
                    }}
                  </div>
                  <div class="ejTitle_item">
                    {{
                      this.signedProducts.wealth
                        ? this.signedProducts.wealth.fundbookFlag
                          ? this.signedProducts.wealth.fundbookFlag
                          : ""
                        : ""
                    }}
                  </div>
                  <div class="ejTitle_item">
                    {{
                      this.signedProducts.wealth
                        ? this.signedProducts.wealth.frcdFlag
                          ? this.signedProducts.wealth.frcdFlag
                          : ""
                        : ""
                    }}
                  </div>
                  <div class="ejTitle_item">
                    {{
                      this.signedProducts.wealth
                        ? this.signedProducts.wealth.insurbookFlag
                          ? this.signedProducts.wealth.insurbookFlag
                          : ""
                        : ""
                    }}
                  </div>
                </div>
              </div>
            </div>
            <div class="t360-production">
              <div class="title_box4">
                <div
                  v-if="this.signedProducts.intermediate"
                  class="t360-production-item"
                >
                  中间业务
                </div>
                <div class="ejTitle">
                  <div class="ejTitle_item">
                    {{
                      this.signedProducts.intermediate
                        ? this.signedProducts.intermediate.elefeeWhcFlag
                          ? this.signedProducts.intermediate.elefeeWhcFlag
                          : ""
                        : ""
                    }}
                  </div>
                  <div class="ejTitle_item">
                    {{
                      this.signedProducts.intermediate
                        ? this.signedProducts.intermediate.gasfeeWhcFlag
                          ? this.signedProducts.intermediate.gasfeeWhcFlag
                          : ""
                        : ""
                    }}
                  </div>
                  <div class="ejTitle_item">
                    {{
                      this.signedProducts.intermediate
                        ? this.signedProducts.intermediate.watfeeWhcFlag
                          ? this.signedProducts.intermediate.watfeeWhcFlag
                          : ""
                        : ""
                    }}
                  </div>
                  <div class="ejTitle_item">
                    {{
                      this.signedProducts.intermediate
                        ? this.signedProducts.intermediate.etcFlag
                          ? this.signedProducts.intermediate.etcFlag
                          : ""
                        : ""
                    }}
                  </div>
                </div>
              </div>
            </div>
          </div>
          <div v-if="Object.keys(this.signedProducts).length == 0">
            <el-empty description="无签约产品" />
          </div>
        </div>
      </el-collapse-item>
      <!-- <el-collapse-item name="2">
          <template slot="title">
            <p class="common-title">经营状况</p>
          </template>
          <div style="margin-top: 30px">
            <el-empty description="经营状况准备中..."></el-empty>
          </div>
        </el-collapse-item>
        <el-collapse-item>
          <template slot="title">
            <p class="common-title">经营风险</p>
          </template>
          <div style="margin-top: 30px">
            <el-empty description="经营风险准备中..."></el-empty>
          </div>
        </el-collapse-item>
        <el-collapse-item>
          <template slot="title">
            <p class="common-title">工商信息</p>
          </template>
          <div style="margin-top: 30px">
            <el-empty description="工商信息准备中..."></el-empty>
          </div>
        </el-collapse-item> -->
      <el-collapse-item name="9">
        <template slot="title">
          <p class="common-title">自定义备注</p>
        </template>
        <el-form
          ref="bzFormRef"
          :model="bzForm"
          :rules="bzRules"
          class="special_bzform"
          style="margin-top:20px"
        >
          <el-row>
            <el-col :span="16">
              <el-form-item label="备注" prop="label" label-width="85px">
                <el-input
                  v-model="bzForm.label"
                  placeholder="请输入备注"
                  style="width:100%"
                  :disabled="bzFlag"
                />
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <div class="bz_row_end">
                <el-button
                  type="primary"
                  size="small"
                  @click="bzEditFn"
                >{{bzFlag?'编辑':'退出编辑'}}</el-button>
                <el-button
                  type="primary"
                  size="small"
                  @click="bzSaveFn"
                  v-if="!bzFlag"
                >保存</el-button>
              </div>
            </el-col>
          </el-row>
        </el-form>
      </el-collapse-item>
      <el-collapse-item name="3">
        <template slot="title">
          <p class="common-title">省行客户标签</p>
        </template>
        <div class="message-box">
          <div class="message-box-right">
            <div style="margin-bottom:20px">
              <el-cascader v-model="tagName" :options="selectTagsList" :props="tagProps" @change="tagChangeFn"></el-cascader>
            </div>
            <el-tag
              v-for="(item, index) in showTagsList"
              :key="index"
              :type="item.enableFlag == true ? '' : 'info'"
              :style="{
                'margin-right': '15px',
                'margin-bottom': '12px',
                cursor: editTag ? 'pointer' : 'default',
              }"
              :closable="editTag && item.enableFlag == true"
              @click="handleClickTag(item)"
              @close="handleCloseTag(item)"
            >{{ item.names }}</el-tag>
            <div>
              <el-button
                v-if="!editTag"
                size="mini"
                type="primary"
                @click="handleEditTag"
              >编辑标签</el-button>
              <el-button
                v-if="editTag"
                type="success"
                size="mini"
                @click="handleSaveTag"
              >保存</el-button>
              <el-button
                v-if="editTag"
                size="mini"
                @click="handleCancelEditTag"
              >取消</el-button>
            </div>
            <!-- <div style="margin-top:20px">
              <el-input
                v-if="editTag"
                v-model="addTagName"
                placeholder="请输入新增客户标签"
              />
              <el-button
                style="margin-left:20px"
                v-if="editTag"
                type="success"
                @click="handleAddTag"
              >新增</el-button>
            </div> -->
          </div>
        </div>
      </el-collapse-item>
      <Custom :tagManualList="tagManualList" nameKey="10" typeKey="gs" @getDetailData="initBusinessDetail" />
      <el-collapse-item name="4">
        <template slot="title">
          <p class="common-title">
            走访记录（总共走访{{ visitRecords.length }}次）
          </p>
        </template>
        <el-table
          :data="visitRecords"
          style="width: 100%"
          max-height="600"
        >
          <el-table-column
            align="left"
            prop="campaignName"
            label="活动名称"
            show-overflow-tooltip
            width="150px"
          ></el-table-column>
          <el-table-column
            align="left"
            prop="visName"
            label="柜员名称"
            show-overflow-tooltip
            width="150px"
          ></el-table-column>
          <el-table-column
            align="left"
            prop="visId"
            label="柜员号"
            show-overflow-tooltip
            width="150px"
          ></el-table-column>
          <el-table-column
            align="left"
            prop="deptId"
            label="柜员部门"
            show-overflow-tooltip
            width="150px"
          ></el-table-column>
          <el-table-column
            align="left"
            prop="deptName"
            label="部门名称"
            show-overflow-tooltip
            width="200px"
          ></el-table-column>
          <el-table-column
            align="left"
            prop="custName"
            label="走访客户名称"
            show-overflow-tooltip
            width="150px"
          ></el-table-column>
          <el-table-column
            align="left"
            prop="socialCreditCode"
            label="企业（商户）统信码"
            show-overflow-tooltip
            width="150px"
          ></el-table-column>
          <el-table-column
            align="left"
            prop="custType"
            label="客户类型"
            show-overflow-tooltip
          >
            <template slot-scope="scope">
              <span v-if="scope.row.custType == '0'">个人</span>
              <span v-if="scope.row.custType == '1'">商户</span>
              <span v-if="scope.row.custType == '2'">企业</span>
            </template>
          </el-table-column>
          <el-table-column
            align="left"
            prop="signInTime"
            label="签到时间"
            show-overflow-tooltip
            width="180px"
          ></el-table-column>
          <el-table-column
            align="left"
            prop="signOutTime"
            label="签退时间"
            show-overflow-tooltip
            width="180px"
          ></el-table-column>
          <el-table-column
            align="left"
            prop="signInAddress"
            label="签到地址"
            show-overflow-tooltip
            width="150px"
          ></el-table-column>
          <el-table-column
            align="left"
            prop="signOutAddress"
            label="签退地址"
            show-overflow-tooltip
            width="150px"
          ></el-table-column>
          <el-table-column
            align="left"
            prop="signInCoordinate"
            label="签到坐标"
            show-overflow-tooltip
            width="150px"
          ></el-table-column>
          <el-table-column
            align="left"
            prop="signOutCoordinate"
            label="签退坐标"
            show-overflow-tooltip
            width="150px"
          ></el-table-column>
          <el-table-column
            align="left"
            prop="abnormalVisitTag"
            label="异常走访标签"
            show-overflow-tooltip
            width="150px"
            v-if="is875"
          >
            <template slot-scope="scope">
              <span v-if="scope.row.abnormalVisitTag == '0'">正常</span>
              <span v-if="scope.row.abnormalVisitTag == '1'">走访频率异常</span>
              <span v-if="scope.row.abnormalVisitTag == '2'">走访持续时长异常</span>
              <span v-if="scope.row.abnormalVisitTag == '3'">签退时间异常</span>
            </template>
          </el-table-column>
          <el-table-column
            align="left"
            prop="abnormalVisitInfo"
            label="异常走访信息"
            show-overflow-tooltip
            width="150px"
            v-if="is875"
          ></el-table-column>
          <el-table-column
            align="left"
            prop="isValidCust"
            label="是否为有效客户"
            show-overflow-tooltip
            width="150px"
          >
            <template slot-scope="scope">
              <span v-if="scope.row.isValidCust == '0'">否</span>
              <span v-if="scope.row.isValidCust == '1'">是</span>
            </template>
          </el-table-column>
          <el-table-column
            align="left"
            prop="remark"
            label="走访备注"
            show-overflow-tooltip
            width="150px"
          ></el-table-column>
        </el-table>
        <!-- <el-timeline v-if="visitRecords.length > 0" style="margin-top: 30px">
          <el-timeline-item
            v-for="(record, index) in visitRecords"
            :key="index"
            :timestamp="record.date"
          >
            <el-card>
              <p class="record_item">任务名称：{{ record.campaignName }}</p>
              <p class="record_item">走访时间：{{ record.visTime }}</p>
              <p class="record_item">走访机构：{{ record.deptName }}</p>
              <p class="record_item">走访人：{{ record.visName }}</p>
              <p class="zfRemark record_item">
                走访备注：
                <span v-if="record.isRemarkEdit">{{ record.remark }}</span>
                <el-input
                  v-if="!record.isRemarkEdit"
                  v-model="record.remark"
                  class="remarkTitle"
                  type="textarea"
                  :row="3"
                />
              </p>
              <div class="record_btn">
                <el-button
                  v-if="record.isRemarkEdit && record.isZfEdit"
                  type="primary"
                  size="small"
                  @click="handleClickRecord(record, index)"
                >编辑</el-button>
                <el-button
                  v-if="!record.isRemarkEdit"
                  type="primary"
                  size="small"
                  @click="handleCommitRecord(record, index)"
                >保存</el-button>
                <el-button
                  v-if="!record.isRemarkEdit"
                  type="plain"
                  size="small"
                  @click="handleCancleRecord(record, index)"
                >取消</el-button>
              </div>
            </el-card>
          </el-timeline-item>
        </el-timeline> -->
      </el-collapse-item>

      <el-collapse-item name="5">
        <template slot="title">
          <p class="common-title">
            关联关系
            <el-tooltip
              placement="top"
              trigger="hover"
              content="大信贷股东信息表"
            >
              <span class="quesiton"><i class="el-icon-question" /></span>
            </el-tooltip>
          </p>
        </template>
        <el-table :data="affiliatedData" class="affiliatedData">
          <el-table-column label="客户名称" align="center">
            <template slot-scope="scope">
              <el-button type="text" @click="goIndexcharts(scope.row)">{{
                scope.row.name
              }}</el-button>
            </template>
          </el-table-column>
          <el-table-column label="证件号" align="center" prop="custIdc" />
          <el-table-column label="持股比例" align="center">
            <template slot-scope="scope">
              <span
                v-if="scope.row.percent"
              >{{ scope.row.percent * 100 }}%</span>
              <span v-else>--</span>
            </template>
          </el-table-column>
        </el-table>
      </el-collapse-item>

      <el-collapse-item v-if="is825" name="11">
        <template slot="title">
          <p class="common-title">企业九维数据</p>
        </template>
        <div v-if="ent9vPortrait || nineVFinalInfo" class="nine-dimension-data">
          <!-- 企业九维画像 -->
          <div v-if="ent9vPortrait" class="nine-dimension-section">
            <h4 class="section-title">1.企业九维画像</h4>
            <div class="nine-dimension-chart-container">
              <div class="radar-chart-wrapper">
                <div ref="nineDimensionRadar" class="nine-dimension-radar"></div>
              </div>
              <div class="nine-dimension-summary">
                <div class="summary-item">
                  <span class="summary-label">综合评分</span>
                  <div class="summary-content">
                    <span class="summary-value">{{ formatPortraitDisplay(ent9vPortrait.scoreAll) }}</span>
                    <span class="summary-unit">分</span>
                  </div>
                </div>
                <div class="summary-item">
                  <span class="summary-label">总分排名</span>
                  <div class="summary-content">
                    <span class="summary-value is-rank">{{ formatPortraitDisplay(ent9vPortrait.scoreAllRank) }}</span>
                    <span class="summary-unit">名</span>
                  </div>
                </div>
              </div>
            </div>
          </div>

          <!-- 九维细项指标 -->
          <div v-if="nineVFinalInfo" class="nine-dimension-section">
            <h4 class="section-title">2.九维细项指标</h4>
            <div class="nine-dimension-detail-table">
              <table class="detail-table">
                <tbody>
                  <template v-for="group in nineDimensionDetailGroups">
                    <tr
                      v-for="(row, rowIndex) in group.rows"
                      :key="`${group.title}-${rowIndex}`"
                    >
                      <td
                        v-if="rowIndex === 0"
                        class="category-cell"
                        :rowspan="group.rows.length"
                      >
                        {{ group.title }}
                      </td>
                      <template v-for="metric in row">
                        <td :key="`${group.title}-${metric.key}-label`" class="metric-label-cell">
                          {{ metric.label }}
                        </td>
                        <td :key="`${group.title}-${metric.key}-value`" class="metric-value-cell">
                          {{ formatNineDimensionValue(metric) }}
                        </td>
                      </template>
                      <template v-if="row.length === 1">
                        <td class="metric-label-cell is-empty"></td>
                        <td class="metric-value-cell is-empty"></td>
                      </template>
                    </tr>
                  </template>
                </tbody>
              </table>
            </div>
          </div>
        </div>
        <el-empty v-else description="暂无企业九维数据"></el-empty>
      </el-collapse-item>
    </el-collapse>
    <el-dialog
      title="该客户尚未建档，请先进行营销建档"
      :visible.sync="filingVisible"
      width="25%"
      :before-close="handleClosefiling"
      class="filingDialog"
    >
      <span slot="footer" class="person-footer">
        <el-button @click="handleClosefiling">取消</el-button>
        <el-button
          type="primary"
          class="commit_btn"
          @click="handlFilingCommit"
        >确定</el-button>
      </span>
    </el-dialog>
    <el-dialog
      :title="addressTitle"
      :visible.sync="addressVisible"
      width="500px"
      class="fimalyDialog"
    >
      <el-table :data="addressList">
        <el-table-column label="地址类型" align="center" prop="addressName" />
        <el-table-column label="地址" align="center" prop="address" />
        <el-table-column label="来源" align="center" prop="source" />
      </el-table>
    </el-dialog>
    <el-dialog
      title="添加走访"
      :visible.sync="zfVisible"
      width="25%"
      :before-close="handleCloseZf"
      class="zfDialog"
    >
      <el-form
        ref="formObj"
        :model="formObj"
        :rules="formRules"
        class="my-form"
      >
        <el-form-item label="" prop="campaignId" label-width="50px">
          <el-select
            v-model="formObj.campaignId"
            style="width: 300px"
            placeholder="请选择任务"
            filterable
          >
            <el-option
              v-for="item in taskOptions"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            >{{ item.label }}</el-option>
          </el-select>
        </el-form-item>
      </el-form>
      <span slot="footer" class="person-footer">
        <el-button @click="handleCloseZf">取消</el-button>
        <el-button
          type="primary"
          class="commit_btn"
          @click="handlZfCommit"
        >确定</el-button>
      </span>
    </el-dialog>
    <el-dialog
      title="二次走访"
      :visible.sync="secondVisitShow"
      width="500px"
      class="fimalyDialog"
    >
      <el-form ref="secondRef" :model="secondForm" :rules="secondRules" label-width="100px">
        <el-form-item prop="visitTime" label="走访时间">
          <el-date-picker
            v-model="secondForm.visitTime"
            align="right"
            type="date"
            clearable
            placeholder="请选择走访时间"
            :picker-options="pickerOptions"
          />
        </el-form-item>
      </el-form>
      <span slot="footer" class="person-footer">
        <el-button @click="handleCloseSecond">取消</el-button>
        <el-button
          type="primary"
          class="commit_btn"
          @click="handleSubmitSecond"
        >确定</el-button>
      </span>
    </el-dialog>
    <el-dialog
      title="资源申请"
      :visible.sync="secoureShow"
      width="500px"
      class="fimalyDialog"
    >
      <el-form ref="secoureRef" :model="secoureForm" :rules="secoureRules" label-width="100px">
        <!-- <el-form-item prop="userName" label="客户经理">
          <el-select v-model="secoureForm.userName" filterable clearable>
            <el-option
              v-for="(item, index) in secoureOption"
              :key="index"
              :label="item.nickName"
              :value="item.userName"
            />
          </el-select>
        </el-form-item> -->
        <el-form-item label="" label-width="0">
          <section class="user-info">
          <span>归属机构</span>
          <treeselect
            ref="orgTree"
            size="small"
            v-model="userDeptList"
            :options="deptOptions"
            placeholder="请选择"
            :show-count="true"
            noOptionsText="暂无数据"
            noResultsText="暂无数据"
            @select="(node) => onDeptTreeSelect(node)"
            @deselect="clearTreeSelect"
            @open="onOrgTreeFocus"
            :flat="false"
            style="margin-bottom: 10px"
          />
          </section>
        <section class="user-info">
          <span>客户经理</span>
          <el-select
            @focus="onClientManagerFocus"
            ref="clientManager"
            v-model="authUser"
            :multiple-limit="0"
            filterable
            placeholder="请选择"
            class="input-box"
            style="width: 100%"
          >
              <el-option
                v-for="option in managerOptions"
                :key="option.userId"
                :label="`${option.deptName}-${option.userName}-${option.nickName}`"
                :value="`${option.userName}-${option.nickName}`"
              ></el-option>
          </el-select>
        </section>
        </el-form-item>
        <el-form-item prop="remark" label="备注">
          <el-input v-model="secoureForm.remark" :rows="5" type="textarea" />
        </el-form-item>
      </el-form>
      <span slot="footer" class="person-footer">
        <el-button @click="handleCloseSecoure">取消</el-button>
        <el-button
          type="primary"
          class="commit_btn"
          @click="handleSubmitSecoure"
        >确定</el-button>
      </span>
    </el-dialog>
  </div>
</template>
<script>
import {
  getBusinessDetail,
  updateBusinessDetail,
  getIndustryTree,
  exportBusinessDetail,
  getRegStatus,
  visitInfoList,
  editVisitInfo,
  editCustTag,
  getcustomLevel,
  appointmentSecondVisit,
  systemUserAllTreeUser,
  appointmentResourceAssist
} from '@/api/system/listByRetailKeywords.js'
import { Message } from 'element-ui'
import { getVisitData } from '@/api/task/taskList.js'
import { getAddressTree, getDetailRegion, systemUserDeptTreeAll } from '@/api/grid/address/tree.js'
import { getCurrentExistTask,systemRecordEditLable } from '@/api/system/grouplist'
import { addAppointCustCamp } from '@/api/grid/mycustomer.js'
import { getUserListByDeptIds } from "@/api/grid/region.js";
import { downloadFiles } from '@/utils'
import { mapGetters } from 'vuex'
import { cloneDeep, isEmpty } from 'lodash'
import _ from 'lodash'
import * as echarts from 'echarts'
import Custom from '../custom.vue'

const NINE_DIMENSION_DETAIL_CONFIG = [
  {
    title: '企业合规经营模块',
    metrics: [
      { key: 'score11', label: '是否存在经营异常名录信息', valueMap: { '1': '是', '2': '否' } },
      { key: 'score12', label: '是否存在严重违法失信企业名单信息', valueMap: { '1': '是', '2': '否' } },
      { key: 'score13', label: '企业环境行为信用等级是否为“E”或“D”', valueMap: { '1': '是', '2': '否' } },
      { key: 'score14', label: '是否存在税务重大税收违法黑名单信息', valueMap: { '1': '是', '2': '否' } },
      { key: 'score15', label: '是否存在拖欠工资黑名单', valueMap: { '1': '是', '2': '否' } },
      { key: 'score16', label: '是否存在工商吊销企业信息', valueMap: { '1': '是', '2': '否' } }
    ]
  },
  {
    title: '企业风险准入模块',
    metrics: [
      { key: 'score21', label: '是否存在注销企业信息', valueMap: { '1': '是', '2': '否' } },
      { key: 'score22', label: '是否存在执行案件信息', valueMap: { '1': '是', '2': '否' } },
      { key: 'score23', label: '是否存在查封信息', valueMap: { '1': '是', '2': '否' } },
      { key: 'score24', label: '是否存在单位未履行生效裁判信息', valueMap: { '1': '是', '2': '否' } },
      { key: 'score25', label: '是否存在企业破产清算信息', valueMap: { '1': '是', '2': '否' } },
      { key: 'score26', label: '是否失信被执行人', valueMap: { '1': '是', '2': '否' } },
      { key: 'score27', label: '是否为诉讼案件被告', valueMap: { '1': '是', '2': '否' } }
    ]
  },
  {
    title: '高管信用评价模块',
    metrics: [
      { key: 'score31', label: '是否存在查封信息', valueMap: { '1': '是', '2': '否' } },
      { key: 'score32', label: '是否存在执行案件信息', valueMap: { '1': '是', '2': '否' } },
      { key: 'score33', label: '是否存在个人未履行生效裁判信息', valueMap: { '1': '是', '2': '否' } },
      { key: 'score34', label: '是否存在拖欠工资黑名单', valueMap: { '1': '是', '2': '否' } },
      { key: 'score35', label: '是否失信被执行人', valueMap: { '1': '是', '2': '否' } },
      { key: 'score36', label: '是否存在刑事案件被告人生效判决信息', valueMap: { '1': '是', '2': '否' } },
      { key: 'score37', label: '是否为诉讼案件被告', valueMap: { '1': '是', '2': '否' } }
    ]
  },
  {
    title: '股东信用评价模块',
    metrics: [
      { key: 'score41', label: '是否存在查封信息', valueMap: { '1': '是', '2': '否' } },
      { key: 'score42', label: '是否存在执行案件信息', valueMap: { '1': '是', '2': '否' } },
      { key: 'score43', label: '是否存在个人未履行生效裁判信息', valueMap: { '1': '是', '2': '否' } },
      { key: 'score44', label: '是否存在拖欠工资黑名单', valueMap: { '1': '是', '2': '否' } },
      { key: 'score45', label: '是否失信被执行人', valueMap: { '1': '是', '2': '否' } },
      { key: 'score46', label: '是否存在刑事案件被告人生效判决信息', valueMap: { '1': '是', '2': '否' } },
      { key: 'score47', label: '是否为诉讼案件被告', valueMap: { '1': '是', '2': '否' } },
      { key: 'score48', label: '是否存在企业未履行生效裁判信息', valueMap: { '1': '是', '2': '否' } }
    ]
  },
  {
    title: '企业社会贡献模块',
    metrics: [
      { key: 'score51', label: '前12个月纳税金额', valueMap: { '1': '0', '2': '0－5（含）万元', '3': '5-10（含）万元', '4': '10-50（含）万元', '5': '50-100（含）万元', '6': '100-500（含）万元', '7': '500-1000（含）万元', '8': '1000万元以上' } },
      { key: 'score52', label: '纳税等级', valueMap: { '1': 'A', '2': 'B', '3': 'M', '4': 'C、D', '5': '未评' } },
      { key: 'score53', label: '缴纳社保人数', valueMap: { '1': '0', '2': '3（含）人以内', '3': '3-10（含）人', '4': '10-30（含）人', '5': '30-50（含）人', '6': '50-100（含）人', '7': '100-500（含）人', '8': '500人以上' } },
      { key: 'score54', label: '公积金缴纳人数', valueMap: { '1': '0', '2': '3（含）人以内', '3': '3-10（含）人', '4': '10-30（含）人', '5': '30-50（含）人', '6': '50-100（含）人', '7': '100-500（含）人', '8': '500人以上' } },
      { key: 'score55', label: '是否为出口退税生产清单企业', valueMap: { '1': '是', '2': '否' } }
    ]
  },
  {
    title: '企业稳定经营模块',
    metrics: [
      { key: 'score61', label: '市场主体经营年限', valueMap: { '1': '1年以内', '2': '1-3年', '3': '3-5年', '4': '5-10年', '5': '10年以上' } },
      { key: 'score62', label: '股东（或发起人）或投资人信息认缴出资人数', valueMap: { '1': '1人独资', '2': '2-5人', '3': '5人以上' } },
      { key: 'score63', label: '股东（或发起人）或投资人信息最大股东持股占比', valueMap: { '1': '10%以内（含）', '2': '10%-30%（含）', '3': '30%-50%（含）', '4': '50%-66.6%（含）', '5': '66.6%以上' } },
      { key: 'score64', label: '近三年法定代表人变更次数', valueMap: { '1': '0次', '2': '1次', '3': '2次', '4': '3次及以上' } },
      { key: 'score65', label: '近三年股东变更次数', valueMap: { '1': '0次', '2': '1次', '3': '2次', '4': '3次及以上' } },
      { key: 'score66', label: '近三年经营范围变更次数', valueMap: { '1': '0次', '2': '1次', '3': '2次', '4': '3次及以上' } },
      { key: 'score67', label: '近三年经营地址变更次数', valueMap: { '1': '0次', '2': '1次', '3': '2次', '4': '3次及以上' } },
      { key: 'score68', label: '近三年缴税年数', valueMap: { '1': '0', '2': '1年', '3': '2年', '4': '3年' } },
      { key: 'score69', label: '法人户籍', valueMap: { '1': '户籍本地、原籍本地', '2': '户籍本地、原籍浙江其他地区', '3': '户籍本地、原籍未浙江', '4': '非本地户籍、浙江籍', '5': '非本地户籍、未浙江籍' } },
      { key: 'score610', label: '法人婚姻状况', valueMap: { '1': '未婚', '2': '已婚', '3': '丧偶', '4': '离婚' } }
    ]
  },
  {
    title: '企业经营能力模块',
    metrics: [
      { key: 'score71', label: '上年增值税金额', valueMap: { '1': '0', '2': '0－5（含）万元', '3': '5-10（含）万元', '4': '10-30（含）万元', '5': '30-50（含）万元', '6': '50-100（含）万元', '7': '100-500（含）万元', '8': '500-1000（含）万元', '9': '1000万元以上' } },
      { key: 'score72', label: '今年增值税同比变动', valueMap: { '1': '0及以下', '2': '0－5%（含）', '3': '5%－10%（含）', '4': '10%-20%(含）', '5': '20%以上' } },
      { key: 'score73', label: '上年企业所得税金额', valueMap: { '1': '0', '2': '0－5（含）万元', '3': '5-10（含）万元', '4': '10-30（含）万元', '5': '30-50（含）万元', '6': '50-100（含）万元', '7': '100-500（含）万元', '8': '500-1000（含）万元', '9': '1000万元以上' } },
      { key: 'score74', label: '今年所得税同比变动', valueMap: { '1': '0及以下', '2': '0－5%（含）', '3': '5%－10%（含）', '4': '10%-20%(含）', '5': '20%以上' } },
      { key: 'score75', label: '缴纳社保人数同比变动', valueMap: { '1': '0及以下', '2': '0－5%（含）', '3': '5%－10%（含）', '4': '10%-20%(含）', '5': '20%以上' } },
      { key: 'score76', label: '公积金缴纳人数同比变动', valueMap: { '1': '0及以下', '2': '0－5%（含）', '3': '5%－10%（含）', '4': '10%-20%(含）', '5': '20%以上' } },
      { key: 'score77', label: '当年纳税金额同比变动', valueMap: { '1': '0及以下', '2': '0－5%（含）', '3': '5%－10%（含）', '4': '10%-20%(含）', '5': '20%以上' } },
      { key: 'score78', label: '上年出口退税金额', valueMap: { '1': '0', '2': '0－5（含）万元', '3': '5-10（含）万元', '4': '10-50（含）万元', '5': '50-100（含）万元', '6': '100万元以上' } }
    ]
  },
  {
    title: '企业偿债能力模块',
    metrics: [
      { key: 'score81', label: '房产套数', valueMap: { '1': '0', '2': '1套', '3': '2套', '4': '3套', '5': '4套及以上' } },
      { key: 'score82', label: '房产面积', valueMap: { '1': '0', '2': '0－500（含）平方米', '3': '500－1000（含）平方米以下', '4': '1000-3000（含）平方米', '5': '3000-5000（含）平方米', '6': '5000-10000（含）平方米', '7': '10000平方米及以上' } },
      { key: 'score83', label: '未抵押房产套数', valueMap: { '1': '0', '2': '1套', '3': '2套', '4': '3套', '5': '4套及以上' } },
      { key: 'score84', label: '未抵押房产面积', valueMap: { '1': '0', '2': '0－500（含）平方米', '3': '500－1000（含）平方米以下', '4': '1000-3000（含）平方米', '5': '3000-5000（含）平方米', '6': '5000-10000（含）平方米', '7': '10000平方米及以上' } },
      { key: 'score85', label: '已抵押房产被担保债权数额', valueMap: { '1': '0', '2': '0－100（含）万元', '3': '100－500（含）万元', '4': '500－1000（含）万元', '5': '1000－3000（含）万元', '6': '3000－5000（含）万元', '7': '5000－10000（含）万元', '8': '10000万元以上' } },
      { key: 'score86', label: '企业车产金额', valueMap: { '1': '0', '2': '0－20（含）万元', '3': '20－40（含）万元', '4': '40－60（含）万元', '5': '60－80（含）万元', '6': '80－100（含）万元', '7': '100万元以上' } }
    ]
  },
  {
    title: '潜在代偿资源模块',
    metrics: [
      { key: 'score91', label: '法人代表及股东房产面积合计', valueMap: { '1': '0', '2': '0－500（含）平方米', '3': '500－1000（含）平方米以下', '4': '1000-3000（含）平方米', '5': '3000-5000（含）平方米', '6': '5000-10000（含）平方米', '7': '10000平方米及以上' } },
      { key: 'score92', label: '法人代表及股东房产套数合计', valueMap: { '1': '0', '2': '1套', '3': '2套', '4': '3套', '5': '4套及以上' } },
      { key: 'score93', label: '法人代表及股东未抵押房产套数合计', valueMap: { '1': '0', '2': '1套', '3': '2套', '4': '3套', '5': '4套及以上' } },
      { key: 'score94', label: '法人代表及股东未抵押房产面积', valueMap: { '1': '0', '2': '0－500（含）平方米', '3': '500－1000（含）平方米以下', '4': '1000-3000（含）平方米', '5': '3000-5000（含）平方米', '6': '5000-10000（含）平方米', '7': '10000平方米及以上' } },
      { key: 'score95', label: '法人代表及股东已抵押房产被担保债权数额合计', valueMap: { '1': '0', '2': '0－100（含）万元', '3': '100－500（含）万元', '4': '500－1000（含）万元', '5': '1000－3000（含）万元', '6': '3000－5000（含）万元', '7': '5000－10000（含）万元', '8': '10000万元以上' } },
      { key: 'score96', label: '法人代表车产金额', valueMap: { '1': '0', '2': '0－20（含）万元', '3': '20－40（含）万元', '4': '40－60（含）万元', '5': '60－80（含）万元', '6': '80－100（含）万元', '7': '100万元以上' } }
    ]
  }
]

export default {
  data() {
    var validatePhone = (rule, value, callback) => {
      if (!value?.trim()) {
        callback()
      }
      const regExp = /^1(3|4|5|6|7|8|9)[0-9]{9}$/
      if (!regExp.test(value)) {
        this.showCode = false
        this.canClick = false
        callback(new Error('请输入正确的手机号'))
      } else {
        this.canClick = true
        callback()
      }
    }
    var validateCustIdc = (rule, value, callback) => {
      if (!value?.trim()) {
        return callback(new Error('请输入身份证号码'))
      }
      const regex =
        /^[1-9]\d{5}(19|20)\d{2}((0[1-9])|(1[0-2]))(([0-2][1-9])|10|20|30|31)\d{3}[0-9Xx]$/
      if (!regex.test(value)) {
        callback(new Error('请输入正确的身份证号码'))
      } else {
        callback()
      }
    }
    return {
      customLevel: '',
      activeName: '',
      jydzList: [],
      zcdzList: [],
      isSaveDisable: true,
      filingVisible: false,
      isShow: false,
      baseHeaderForm: {
        custName: '',
        socialCreditCode: ''
      },
      baseForm: {
        lpName: '',
        custGender: '',
        custAge: '',
        custIdc: '',
        custPhone: '',
        birthday: '',
        custId: '',
        custIsn: '',
        socialCreditCode: '',
        custLocation: '',

        registerLocation: '',
        industry: '',
        status: '',
        businessScope: '',
        custCapital: '',
        tel: '',
        gridUserName: '',
        belongUserName: '',
        belongUserId: '',
        updateTime: ''
      },
      registerLocationNum: '',
      custLocationNum: '',
      registerLocationStr: '',
      custLocationStr: '',
      rules: {
        // socialCreditCode: [{ required: true, message: '请输入', trigger: 'blur' }],
        // custName: [{ required: true, message: '请输入', trigger: 'blur' }],
        // lpName: [{ required: true, message: '请输入', trigger: 'blur' }],
        // custGender: [{ required: true, message: '请选择', trigger: 'change' }],
        // custAge: [{ required: true, message: '请选择', trigger: 'change' }],
        // custIdc: [{ required: true, validator: validateCustIdc, trigger: 'blur' }],
        // custPhone: [{ validator: validatePhone, trigger: 'blur' }],
        // birthday: [{ required: true, message: '请选择出生日期', trigger: 'change' }],
        // tel: [{ validator: validatePhone, trigger: 'change' }],
      },
      canEdit: false, // true的时候代表为外部客户
      isEditing: false,
      visitList: [{ date: '2020-12-12' }, { date: '2020-12-16' }],
      originTagList: [],
      editTag: false,
      tagsList: [],
      isAddTag: false,
      newTag: '',
      addressTitle: '',
      addressVisible: false,
      addressList: [],
      adressArr: [],
      affiliatedData: [],
      signedProducts: {},
      statusList: [],
      genderList: [
        { label: '男', value: '男' },
        { label: '女', value: '女' }
      ],
      cliList: [],
      industryOptions: [],
      zfVisible: false,
      formObj: {
        campaignId: ''
      },
      taskOptions: [],
      formRules: {
        campaignId: [
          {
            required: true,
            message: '任务不能为空',
            trigger: 'blur'
          }
        ]
      },
      industryStr: '',
      adressOptions: [],
      visitRecords: [],
      bzForm:{
        label:"",
        oldLabel:"",
      },
      bzRules:{},
      bzFlag:true,
      tagName:[],
      tagProps:{
        label:"names",
        value:"names",
        children:"children"
      },
      selectTagsList:[],
      showTagsList:[],
      addTagName:"",
      newCustTag:[],
      // 企业九维数据
      ent9vPortrait: null,
      nineVFinalInfo: null,
      nineDimensionRadarChart: null,  // 九维画像雷达图实例
      nineDimensionRadarResizeObserver: null,
      nineDimensionRadarRenderTimer: null,
      regAddress: {
        lazy: true,
        lazyLoad(node, resolve) {
          setTimeout(() => {
            const nodes = []
            const query = {
              level: node.level + 1,
              code: node.level == 0 ? '33' : node.value.value
            }
            getAddressTree(query).then((res) => {
              res.data.map((item) => {
                const obj = {
                  value: item,
                  label: item.label,
                  leaf: item.level >= 5
                }
                nodes.push(obj)
              })

              resolve(nodes)
            })
          }, 500)
        }
      },
      tagManualList: [],
      secondVisitShow: false,
      secoureShow: false,
      secondForm: {
        visitTime: null
      },
      secondRules: {
        visitTime: [{ required: true, message:'请选择走访时间', trigger:'change' }]
      },
      secoureOption: [],
      secoureForm: {
        // userName: null,
        remark: null
      },
      secoureRules: {
        // userName: [{ required: true, message:'请选择客户经理', trigger:'change' }]
      },
      pickerOptions: {
        disabledDate: this.disabledBeforeToday
      },
      authUser: '',
      deptOptions: [],
      userDeptList: null,
      managerOptions: [],
    }
  },
  watch: {
    userDeptList(val) {
      if (!val) {
        this.managerOptions = []
        this.authUser = ''
      }
    },
    ent9vPortrait: {
      handler(newVal) {
        if (!newVal) {
          this.destroyNineDimensionRadar()
          return
        }
        this.scheduleNineDimensionRadarRender()
      },
      deep: true
    }
  },
  components: {
    Custom
  },
  computed: {
    ...mapGetters(['roles', 'userName', 'deptId']),
    nineDimensionDetailGroups() {
      return NINE_DIMENSION_DETAIL_CONFIG.map(group => ({
        title: group.title,
        rows: this.buildNineDimensionRows(group.metrics)
      }))
    },
    nineDimensionScores() {
      if (!this.ent9vPortrait) {
        return []
      }
      return [1, 2, 3, 4, 5, 6, 7, 8, 9].map(index =>
        this.normalizePortraitScore(this.ent9vPortrait[`score${index}`])
      )
    },
    nineDimensionRadarScale() {
      return this.getAdaptiveRadarScale(this.nineDimensionScores)
    },
    isHeadAdmin() {
      return this.roles.includes('headAdmin')
    },
    // 公司部
    isPublic() {
      return this.roles.includes('headPublic')
    },
    // 零售部
    isPrivate() {
      return this.roles.includes('headPrivate')
    },
    // 运管部
    isHeadOps() {
      return this.roles.includes('headOps')
    },
    // 支行
    isBranchAdmin() {
      return this.roles.includes('branchAdmin')
    },
    // 网点主任
    isOutletAdmin() {
      return this.roles.includes('outletAdmin')
    },
    // 客户经理
    isCommonManager() {
      return this.roles.includes('commonManager')
    },
    pageId() {
      return this.$route.query.custId
    },
    // 海宁
    is875() {
      return this.userName.slice(0, 3) === '875'
    },
    is825() {
      return String(this.deptId || '').substring(0, 3) === '825'
    },
    is932Dept() {
      return String(this.deptId || '').substring(0, 3) === '932'
    }
  },
  created() {
    // console.log(this.userName, 'userNameuserNameuserName')
    // if (this.userName.indexOf('875') === 0 || this.userName.indexOf('965') === 0) {
    //   if (!this.pageId) return
    //   getcustomLevel(2, this.pageId).then(res => {
    //     if (res.code === 200) {
    //       this.customLevel = res.msg
    //     }
    //   })
    // }
    this.initRegStatus()
    this.initIndustryTree()
    this.initBusinessDetail()
    this.getDeptTreeSelect()
  },
  mounted() {
    // systemUserAllTreeUser().then(res => {
    //   this.secoureOption = res
    // })
    window.addEventListener('resize', this.handleRadarResize);
  },
  activated() {
    this.scheduleNineDimensionRadarRender(120)
  },
  beforeDestroy() {
    this.clearNineDimensionRadarRenderTimer()
    this.destroyNineDimensionRadarObserver()
    this.destroyNineDimensionRadar()
    window.removeEventListener('resize', this.handleRadarResize);
  },
  methods: {
    handleAddTag(){
      if(!this.addTagName){
        this.$message.error('请输入客户标签')
        return;
      }
      let existsFlag=_.includes(_.map(this.showTagsList,'names'),this.addTagName)
      if(existsFlag){
        this.$message.error('客户标签已存在')
        return;
      }
      this.showTagsList.push({
        children: [],
        enableFlag: true,
        names: this.addTagName,
        type: "",
        useFlag: false,
      })
      this.updateListFn(this.showTagsList);
      this.newCustTag.push({
        custTagLevel1:this.tagName[0],
        custTagLevel2:this.tagName[1],
        custTagName:this.addTagName,
      })
      this.addTagName="";
    },
    bzEditFn(){
      if(this.bzFlag){
        this.bzForm.oldLabel=this.bzForm.label
      }else{
        this.bzForm.label=this.bzForm.oldLabel
      }
      this.bzFlag=!this.bzFlag
    },
    bzSaveFn(){
      systemRecordEditLable({
        custId:this.pageId,
        custType:"2",
        lable:this.bzForm.label
      }).then((res) => {
        this.$message.success('保存成功')
        this.bzFlag=true;
      })
    },
    initRegStatus() {
      getRegStatus().then((res) => {
        if (res.code == 200) {
          this.statusList = res.data.map((item) => {
            return {
              label: item.dictLabel,
              value: item.dictValue
            }
          })
        }
      })
    },
    initStatus(data) {
      const arr = this.statusList.filter((item) => item.value === data)
      if (arr && arr.length > 0) {
        return arr[0].label
      }
    },
    initIndustryTree() {
      getIndustryTree().then((res) => {
        this.industryOptions = res.data.map((item) => {
          return {
            value: item.code,
            label: item.name,
            children: item.industryTrees
          }
        })
        this.industryOptions.forEach((item) => {
          item.children.forEach((el) => {
            el.value = el.code
            el.label = el.name
          })
        })
        this.initIndustryBusiStr(this.baseForm.industry)
      })
    },
    initBusinessDetail() {
      getBusinessDetail(this.pageId).then((res) => {
        if (res.code == 200) {
          this.baseForm = res.data.custInfoBusiness
          this.baseHeaderForm.custName = res.data.custInfoBusiness.custName
          this.baseHeaderForm.socialCreditCode =
            res.data.custInfoBusiness.socialCreditCode
          this.canEdit = res.data.radarCustFlag == '1'
          if (res.data.addressDetails && res.data.addressDetails.length > 0) {
            this.adressArr = res.data.addressDetails
          }
          this.signedProducts = res.data.signedProducts
            ? res.data.signedProducts
            : {}
          this.affiliatedData = res.data.corporateShareholders
          this.id = res.data.custInfoBusiness.id
          this.baseForm.community = res.data.community
          this.baseForm.xzGsGridUserName = res.data.xzGsGridUserName
          this.baseForm.xzGsGridName = res.data.xzGsGridName
          this.baseForm.xzYgGridUserName = res.data.xzYgGridUserName
          this.baseForm.xzYgGridName = res.data.xzYgGridName
          this.cliList = res.data.cmpmUserLists

          this.originTagList = cloneDeep(res.data.tabEnmuVos) || []
          this.tagsList = cloneDeep(res.data.tabEnmuVos) || []
          if (this.baseForm.recordStatus && this.baseForm.recordStatus != '0') {
            this.isShow = false
          } else {
            this.isShow = true
          }
          this.baseForm.industry = res.data.custInfoBusiness.industry
          this.baseForm.belongBusiness =
            res.data.custInfoBusiness.belongBusiness
          this.registerLocationStr = res.data.custInfoBusiness.registerLocation
          this.customLevel = res.data.custInfoBusiness.custLevel
          this.custLocationStr = res.data.custInfoBusiness.custLocation
          this.bzForm.label = res.data.custInfoBusiness.label||"";
          this.initGetVisitInfoList()
          this.selectTagsList=this.getTwoLevels(this.tagsList);
          if (this.selectTagsList.length > 0) {
            this.tagName=[this.selectTagsList[0].names,this.selectTagsList[0].children[0].names];
          }
          if (this.tagsList.length > 0) {
            this.showTagsList=this.tagsList[0].children[0].children||[];
          }
          this.tagManualList = cloneDeep(res.data.tagManual) || []
          // 企业九维数据
          this.ent9vPortrait = res.data.ent9vPortrait || null
          this.nineVFinalInfo = res.data.nineVFinalInfo || null
        }
      })
    },
    getTwoLevels(nodes){
      return _.map(nodes, parent => ({
        names: parent.names,
        children: _.map(parent.children, child => ({
          names: child.names // 清除子节点的 children 属性
          // 或：_.omit(child, ['children']) // 如果需要保留其他属性
        }))
      }));
    },
    initIndustryBusiStr(data) {
      this.industryOptions.forEach((item) => {
        if (item.value == data) {
          this.industryStr = item.label
        } else {
          item.children.forEach((el) => {
            if (el.value == data) {
              this.industryStr = el.label
            }
          })
        }
      })
    },
    handleClosefiling() {
      this.filingVisible = false
    },
    handlFilingCommit() {
      this.$router.push({ path: '/individual' })
    },
    goBackToIndex() {
      const { query } = this.$route
      if (query.backUrl) {
        this.$router.replace({
          path: query.backUrl,
          query
        })
      } else {
        this.$router.go(-1)
      }
    },
    handleEdit() {
      this.isEditing = true
      this.isSaveDisable = false
    },
    handleCancle() {
      this.isEditing = false
      this.isSaveDisable = true
      this.$refs.profileForm.clearValidate()
      this.initBusinessDetail()
    },
    handleChangeBirthday(val) {
      const currentYear = new Date().getFullYear()
      const birthdayYear = Number(val.slice(0, 4))
      this.baseForm.custAge = currentYear - birthdayYear
    },
    initgetVisitData() {
      getVisitData({ custId: this.pageId }).then((res) => {
        if (res.code == 200) {
          const list = res.data.addressDetails
          this.jydzList = list.filter((item) => item.addressName == '经营地址')
          this.zcdzList = list.filter((item) => item.addressName == '注册地址')
        }
      })
    },
    handleSave() {
      if (
        this.baseForm.custPhone == '' &&
        this.baseForm.registerLocation == null &&
        this.baseForm.custLocation == null
      ) {
        Message.warning('请输入手机号或者任意一个地址!')
      } else {
        this.$refs.profileForm.validate((valid) => {
          if (valid) {
            let registerLocationStrs = ''
            let custLocationStrs = ''
            // 户籍地址
            if (Array.isArray(this.baseForm.registerLocation)) {
              const registerLocationArr = this.baseForm.registerLocation.map(
                (item) => {
                  return item.label
                }
              )
              registerLocationStrs = registerLocationArr
                .join(' ')
                .replace(/\s/g, '')
            }
            // 住宅地址
            if (Array.isArray(this.baseForm.custLocation)) {
              const custLocationArr = this.baseForm.custLocation.map((item) => {
                return item.label
              })
              custLocationStrs = custLocationArr.join(' ').replace(/\s/g, '')
            }
            this.baseForm.registerLocation = Array.isArray(
              this.baseForm.registerLocation
            )
              ? `${registerLocationStrs}${this.registerLocationNum}`
              : this.baseForm.registerLocation
            this.baseForm.custLocation = Array.isArray(
              this.baseForm.custLocation
            )
              ? `${custLocationStrs}${this.custLocationNum}`
              : this.baseForm.custLocation
            this.baseForm.industry = Array.isArray(this.baseForm.industry)
              ? this.baseForm.industry.pop()
              : this.baseForm.industry
            this.baseForm.custName = this.baseHeaderForm.custName
            updateBusinessDetail(this.baseForm).then((res) => {
              console.log(res, 'ressssssssssssss')
              if (res.code == 200) {
                Message.success('保存成功!')
                this.isEditing = false
                this.isSaveDisable = true
                this.initBusinessDetail()
                this.initIndustryTree()
              }
            })
          } else {
            return false
          }
        })
      }
    },
    goIndexcharts(row) {
      if (row.perCustType == '0') {
        const custIdc = `101${row.custIdc}`
        this.$router.push({
          path: '/360charts/indexcharts/',
          query: { custId: custIdc }
        })
      } else if (row.perCustType == '1') {
        const custIdc = `202${row.custIdc}`
        this.$router.push({
          path: '/360charts/commercial/',
          query: { custId: custIdc }
        })
      } else if (row.perCustType == '2') {
        this.pageId = `202${row.custIdc}`
        this.initBusinessDetail()
      }
    },
    handleExport() {
      exportBusinessDetail(this.pageId).then((res) => {
        downloadFiles(res, `企业详情_${new Date().getTime()}.xlsx`)
      })
    },
    handleViewRegisterLocation() {
      this.addressTitle = '注册地址'
      this.addressVisible = true
      this.addressList = this.adressArr.filter(
        (item) => item.addressName == '注册地址'
      )
    },
    handleViewCustLocationStr() {
      this.addressTitle = '经营地址'
      this.addressVisible = true
      this.addressList = this.adressArr.filter(
        (item) => item.addressName == '经营地址'
      )
    },
    handleCollapse(val) {
      if (val == '0') {
        this.initgetVisitData()
      }
    },
    initGetVisitInfoList() {
      visitInfoList((this.pageId+"").substring(3), 2).then((res) => {
        if (res.code == 200) {
          // const arr = res.rows.map((item) => {
          //   return item.infoList
          // })
          // const list = arr.flat()
          // list.forEach((item) => {
          //   item.isRemarkEdit = true
          //   item.isZfEdit = item.visId == this.userName
          // })
          // this.visitRecords = JSON.parse(JSON.stringify(list))
          this.visitRecords = res.rows
        }
      })
    },
    handleClickRecord(item, index) {
      this.$set(this.visitRecords[index], 'isRemarkEdit', false)
    },
    handleCancleRecord(item, index) {
      this.initGetVisitInfoList()
    },
    handleCommitRecord(item, index) {
      const params = {
        id: item.id,
        remark: item.remark
      }
      editVisitInfo(params).then((res) => {
        if (res.code == 200) {
          Message.success('修改成功!')
          this.initGetVisitInfoList()
        }
      })
    },
    handleAddZf() {
      this.zfVisible = true
      this.searchCurrentExistTask()
    },
    handleCloseZf() {
      this.zfVisible = false
      this.formObj.campaignId = ''
    },
    handlZfCommit() {
      const params = {
        custName: this.baseForm.custName,
        custIdc: this.baseForm.custIdc,
        custPhone: this.baseForm.custPhone,
        custIsn: this.baseForm.custIsn,
        socialCreditCode: this.baseForm.socialCreditCode,
        lpName: this.baseForm.lpName,
        custId: this.baseForm.custId,
        campaignId: this.formObj.campaignId,
        custType: 2
      }
      addAppointCustCamp(params).then((res) => {
        if (res.code == 200) {
          this.zfVisible = false
          this.formObj.campaignId = ''
          Message.success('添加成功!')
        }
      })
    },

    handleClickTag(val) {
      if (!this.editTag || val.enableFlag == true) return
      this.showTagsList.filter(
        (item) => item.names === val.names
      )[0].enableFlag = true
      this.updateListFn(this.showTagsList);
    },
    handleCloseTag(val) {
      this.showTagsList.filter(
        (item) => item.names === val.names
      )[0].enableFlag = false
      this.updateListFn(this.showTagsList);
    },
    updateListFn(showTagsList){
      for(let i=0;i<this.tagsList.length;i++){
        if(this.tagsList[i].names == this.tagName[0]){
          for(let j=0;j<this.tagsList[i].children.length;j++){
            if(this.tagsList[i].children[j].names == this.tagName[1]){
              this.tagsList[i].children[j].children=showTagsList;
            }
          }
        }
      }
    },
    handleEditTag() {
      this.editTag = true
    },
    handleCancelEditTag() {
      this.editTag = false
      this.tagsList = cloneDeep(this.originTagList)
    },
    tagChangeFn(){
      for(let i=0;i<this.tagsList.length;i++){
        if(this.tagsList[i].names == this.tagName[0]){
          for(let j=0;j<this.tagsList[i].children.length;j++){
            if(this.tagsList[i].children[j].names == this.tagName[1]){
              this.showTagsList=this.tagsList[i].children[j].children||[];
            }
          }
        }
      }
    },
    collectNamesWithFlagTrue(nodes){
      return _.flatMap(nodes, (node) => {
        // 1. 收集当前节点的name（若 flag 为 true）
        const current = node.enableFlag ? [{ custTagName: node.names, id: node.id }] : [];
        // 2. 递归处理 children（若存在）并获取子节点中符合的 name
        const children = _.get(node, 'children', []);
        const childNames = children.length
          ? this.collectNamesWithFlagTrue(children) // 递归处理子节点
          : [];
        // 3. 合并当前节点和子节点的结果
        return [...current, ...childNames];
      });
    },
    handleSaveTag() {
      const custTagList = this.collectNamesWithFlagTrue(this.tagsList)
      editCustTag({
        custTagList: custTagList,
        custId: this.$route.query.custId,
        newCustTags:this.newCustTag,
        custTagType:"gs"
      }).then((res) => {
        if (res.code === 200) {
          this.$message.success('修改成功')
          this.originTagList = cloneDeep(this.tagsList)
          this.editTag = false
        }
      })
    },
    searchCurrentExistTask() {
      const params = {
        custType: 2
      }
      getCurrentExistTask(params).then((res) => {
        if (res.code == 200) {
          this.taskOptions = res.data.map((item) => {
            return {
              label: item.campaignName,
              value: item.campaignId
            }
          })
        }
      })
    },
    handleSecondVisit() {
      this.secondVisitShow = true
    },
    handleCloseSecond() {
      this.secondVisitShow = false
      this.secondForm.visitTime = null
    },
    handleSubmitSecond() {
      this.$refs.secondRef.validate((valid) => {
        if(valid) {
          const params = {
            custIdc: this.baseForm.custId,
            custName: this.baseHeaderForm.custName,
            custType: 2
          }
          const time = this.secondForm.visitTime.toLocaleDateString('zh-CN', {
            year: 'numeric',
            month: '2-digit',
            day: '2-digit'
          }).replace(/\//g, '-')
          appointmentSecondVisit(time, params).then(res => {
            this.secondVisitShow = false
            this.$message.success(res.msg)
            this.secondForm.visitTime = null
          })
        }
      })
    },
    handleRecource() {
      this.secoureShow = true
    },
    handleCloseSecoure() {
      this.secoureShow = false
      this.secoureForm.userName = null
      this.secoureForm.remark = null
    },
    handleSubmitSecoure() {
      this.$refs.secoureRef.validate((valid) => {
        if(valid) {
          // const nickName = this.secoureOption.filter(item => item.userName === this.secoureForm.userName)[0].nickName
          if (!this.authUser) {
            Message.success('客户经理不能为空!')
            return
          }
          const nickName = this.authUser.split('-')[1]
          const userName = this.authUser.split('-')[0]
          const params = {
            custIdc: this.baseForm.custId,
            custName: this.baseHeaderForm.custName,
            custType: 2,
            applyRemark: this.secoureForm.remark
          }
          appointmentResourceAssist(userName, nickName, params).then(res => {
            this.secoureShow = false
            this.$message.success(res.msg)
            // this.secoureForm.userName = null
            this.secoureForm.remark = null
            this.authUser = ''
            this.userDeptList = null
          })
        }
      })
    },
    disabledBeforeToday(date) {
      const today = new Date()
      today.setHours(0, 0, 0, 0)
      return date < today
    },
    getDeptTreeSelect() {
      systemUserDeptTreeAll().then((response) => {
        this.deptOptions = response.data
      })
    },
      // 选择归属机构
    onDeptTreeSelect(node) {
      this.fetchSelectOptions([node.id]);
    },
    // 取消勾选归属机构
    clearTreeSelect(node) {
      const index = this.checkedArr.findIndex((id) => id === node.id);
      if (index > -1) {
        this.checkedArr.splice(index, 1);
      }
      const { children = [] } = node;
      if (children.length > 0) {
        children.map((child) => {
          const index = this.checkedArr.findIndex((id) => id === child.id);
          if (index > -1) {
            this.checkedArr.splice(index, 1);
          }
        });
      }
    },
    onOrgTreeFocus() {
      // this.$refs.clientManager.blur()
    },
    onClientManagerFocus() {
      // this.$refs.orgTree.blurInput()
    },
    fetchSelectOptions(deptIds) {
      if (isEmpty(deptIds)) {
        return (this.managerOptions = []);
      }
      getUserListByDeptIds({ deptIds: deptIds }).then((response) => {
        this.managerOptions = response.data;
      });
    },
    normalizePortraitScore(value) {
      const numericValue = Number(value)
      return Number.isFinite(numericValue) ? numericValue : 0
    },
    getAdaptiveRadarScale(scores) {
      const maxScore = Math.max(...scores, 0)
      if (maxScore <= 0) {
        return {
          max: 10,
          splitNumber: 5,
          step: 2
        }
      }

      const splitNumber = 5
      const roughStep = maxScore / splitNumber
      const magnitude = Math.pow(10, Math.floor(Math.log10(roughStep)))
      const normalized = roughStep / magnitude

      let niceFactor = 10
      if (normalized <= 1) {
        niceFactor = 1
      } else if (normalized <= 2) {
        niceFactor = 2
      } else if (normalized <= 2.5) {
        niceFactor = 2.5
      } else if (normalized <= 5) {
        niceFactor = 5
      }

      const step = niceFactor * magnitude
      let max = Math.ceil(maxScore / step) * step
      if (max <= maxScore) {
        max += step
      }

      return {
        max,
        splitNumber,
        step
      }
    },
    formatPortraitDisplay(value) {
      if (value === null || value === undefined || value === '') {
        return '-'
      }

      const numericValue = Number(value)
      if (!Number.isFinite(numericValue)) {
        return value
      }

      return Number.isInteger(numericValue) ? `${numericValue}` : numericValue.toFixed(2)
    },
    clearNineDimensionRadarRenderTimer() {
      if (this.nineDimensionRadarRenderTimer) {
        clearTimeout(this.nineDimensionRadarRenderTimer)
        this.nineDimensionRadarRenderTimer = null
      }
    },
    scheduleNineDimensionRadarRender(delay = 80) {
      this.clearNineDimensionRadarRenderTimer()
      this.nineDimensionRadarRenderTimer = setTimeout(() => {
        this.initNineDimensionRadar()
      }, delay)
    },
    destroyNineDimensionRadar() {
      if (this.nineDimensionRadarChart) {
        this.nineDimensionRadarChart.dispose();
        this.nineDimensionRadarChart = null;
      }
    },
    destroyNineDimensionRadarObserver() {
      if (this.nineDimensionRadarResizeObserver) {
        this.nineDimensionRadarResizeObserver.disconnect()
        this.nineDimensionRadarResizeObserver = null
      }
    },
    initNineDimensionRadarObserver(chartDom) {
      if (!chartDom || typeof ResizeObserver === 'undefined' || this.nineDimensionRadarResizeObserver) {
        return
      }

      this.nineDimensionRadarResizeObserver = new ResizeObserver((entries) => {
        const targetRect = entries && entries[0] ? entries[0].contentRect : null
        if (this.nineDimensionRadarChart) {
          this.handleRadarResize()
          return
        }
        if (targetRect && targetRect.width >= 360 && targetRect.height >= 260) {
          this.scheduleNineDimensionRadarRender(0)
        }
      })
      this.nineDimensionRadarResizeObserver.observe(chartDom)
      if (chartDom.parentElement) {
        this.nineDimensionRadarResizeObserver.observe(chartDom.parentElement)
      }
    },
    formatRadarLabel(label, chunkSize = 7) {
      if (!label || label.length <= chunkSize) {
        return label
      }

      const segments = []
      for (let index = 0; index < label.length; index += chunkSize) {
        segments.push(label.slice(index, index + chunkSize))
      }

      return segments.join('\n')
    },
    // 九维画像分数字段标签映射
    getPortraitLabel(key) {
      const labelMap = {
        uniscid: '统一社会信用代码',
        cstId: '客户内码',
        orgNo: '机构号',
        score1: '企业合规经营模块',
        score2: '企业风险准入模块',
        score3: '高管信用评价模块',
        score4: '股东信用评价模块',
        score5: '企业社会贡献模块',
        score6: '企业稳定经营模块',
        score7: '企业经营能力模块',
        score8: '企业偿债能力模块',
        score9: '潜在代偿资源模块',
        scoreAll: '九维总分',
        scoreAllRank: '九维总分排名',
        datDt: '会计日期'
      };
      return labelMap[key] || key;
    },
    // 获取九维画像维度名称列表
    getNineDimensionLabels() {
      return [
        '企业合规经营模块',
        '企业风险准入模块',
        '高管信用评价模块',
        '股东信用评价模块',
        '企业社会贡献模块',
        '企业稳定经营模块',
        '企业经营能力模块',
        '企业偿债能力模块',
        '潜在代偿资源模块'
      ];
    },
    // 初始化九维画像雷达图
    initNineDimensionRadar() {
      if (!this.ent9vPortrait) {
        this.destroyNineDimensionRadar()
        return;
      }

      this.$nextTick(() => {
        const chartDom = this.$refs.nineDimensionRadar;
        if (!chartDom) return;
        this.initNineDimensionRadarObserver(chartDom)
        const chartWidth = chartDom.clientWidth || 0
        const chartHeight = chartDom.clientHeight || 0
        if (chartWidth < 360 || chartHeight < 260) {
          this.scheduleNineDimensionRadarRender(140)
          return
        }

        const scores = this.nineDimensionScores
        const radarScale = this.nineDimensionRadarScale
        const dimensionLabels = this.getNineDimensionLabels()
        const isCompactChart = chartWidth > 0 && chartWidth < 760

        const currentInstance = echarts.getInstanceByDom(chartDom)
        if (currentInstance) {
          this.nineDimensionRadarChart = currentInstance
        } else {
          this.destroyNineDimensionRadar()
          this.nineDimensionRadarChart = echarts.init(chartDom);
        }

        const option = {
          tooltip: {
            trigger: 'item',
            backgroundColor: 'rgba(17, 24, 39, 0.92)',
            borderColor: 'rgba(99, 102, 241, 0.35)',
            borderWidth: 1,
            padding: [10, 14],
            textStyle: {
              color: '#f8fafc',
              fontSize: 13
            },
            formatter: (params) => {
              const lines = dimensionLabels.map((name, index) => `${name}: ${this.formatPortraitDisplay(params.value[index])}`)
              return lines.join('<br/>')
            }
          },
          radar: {
            indicator: dimensionLabels.map(name => ({ name, max: radarScale.max })),
            shape: 'polygon',
            splitNumber: radarScale.splitNumber,
            radius: isCompactChart ? '76%' : '82%',
            center: ['50%', '54%'],
            name: {
              formatter: name => (isCompactChart ? this.formatRadarLabel(name, 6) : name),
              textStyle: {
                color: '#364152',
                fontSize: isCompactChart ? 13 : 14,
                fontWeight: 500
              }
            },
            splitLine: {
              lineStyle: {
                color: 'rgba(122, 108, 255, 0.34)',
                width: 1
              }
            },
            splitArea: {
              show: true,
              areaStyle: {
                color: [
                  'rgba(107, 114, 128, 0.12)',
                  'rgba(148, 163, 184, 0.1)',
                  'rgba(203, 213, 225, 0.08)',
                  'rgba(226, 232, 240, 0.06)',
                  'rgba(241, 245, 249, 0.04)'
                ]
              }
            },
            axisLine: {
              lineStyle: {
                color: 'rgba(148, 163, 184, 0.4)',
                width: 1
              }
            },
            axisNameGap: isCompactChart ? 4 : 8
          },
          series: [
            {
              name: '企业九维画像',
              type: 'radar',
              data: [
                {
                  value: scores,
                  name: '当前企业',
                  itemStyle: {
                    color: '#ffbf2f'
                  },
                  areaStyle: {
                    color: 'rgba(255, 191, 47, 0.68)'
                  },
                  lineStyle: {
                    color: '#f5b700',
                    width: 2.5
                  },
                  symbol: 'circle',
                  symbolSize: 6
                }
              ]
            }
          ],
          animationDuration: 650
        };

        this.nineDimensionRadarChart.setOption(option);
        this.handleRadarResize()
        setTimeout(() => {
          this.handleRadarResize()
        }, 120)
      });
    },
    // 处理雷达图窗口大小变化
    handleRadarResize() {
      if (this.nineDimensionRadarChart) {
        this.$nextTick(() => {
          this.nineDimensionRadarChart.resize();
        })
      }
    },
    buildNineDimensionRows(metrics) {
      const rows = []
      for (let index = 0; index < metrics.length; index += 2) {
        const firstMetric = metrics[index]
        const secondMetric = metrics[index + 1]
        rows.push([
          {
            ...firstMetric,
            value: this.nineVFinalInfo ? this.nineVFinalInfo[firstMetric.key] : null
          },
          ...(secondMetric
            ? [{
                ...secondMetric,
                value: this.nineVFinalInfo ? this.nineVFinalInfo[secondMetric.key] : null
              }]
            : [])
        ])
      }
      return rows
    },
    formatNineDimensionValue(metric) {
      const value = metric ? metric.value : null
      if (value === null || value === undefined || value === '') {
        return '-'
      }

      const rawValue = `${value}`.trim()
      const normalizedValue = /^-?\d+(\.0+)?$/.test(rawValue) ? `${Number(rawValue)}` : rawValue

      if (metric && metric.valueMap) {
        if (Object.prototype.hasOwnProperty.call(metric.valueMap, normalizedValue)) {
          return metric.valueMap[normalizedValue]
        }
        if (Object.prototype.hasOwnProperty.call(metric.valueMap, rawValue)) {
          return metric.valueMap[rawValue]
        }
      }

      if (metric && metric.label && metric.label.includes('是否')) {
        if (['1', 1, true, 'true', 'TRUE', '是'].includes(value)) {
          return '是'
        }
        if (['2', 2, false, 'false', 'FALSE', '否'].includes(value)) {
          return '否'
        }
      }

      return value
    },
    // 九维详细信息字段标签映射（部分常用字段）
    getFinalInfoLabel(key) {
      const labelMap = {
        uniscid: '统一社会信用代码',
        orgNo: '机构号',
        // 维度1 - 合规经营
        score11: '是否存在经营异常名录信息',
        score12: '是否存在严重违法失信企业名单信息',
        score13: '企业环境行为信用等级是否为E或D',
        score14: '是否存在税务重大税收违法黑名单信息',
        score15: '是否存在拖欠工资黑名单',
        score16: '是否存在工商吊销企业信息',
        // 维度2 - 风险准入
        score21: '是否存在注销企业信息',
        score22: '是否存在执行案件信息',
        score23: '是否存在查封信息',
        score24: '是否存在单位未履行生效裁判信息',
        score25: '是否存在企业破产清算信息',
        score26: '是否失信被执行人',
        score27: '是否为诉讼案件被告',
        // 维度5 - 社会贡献度
        score51: '前12个月纳税金额',
        score52: '纳税等级',
        score53: '缴纳社保人数',
        score54: '公积金缴纳人数',
        score55: '是否为出口退税生产清单企业',
        // 维度6 - 稳定经营
        score61: '市场主体经营年限',
        score62: '认缴出资人数',
        score63: '最大股东持股占比',
        score64: '近三年法定代表人变更次数',
        score65: '近三年股东变更次数',
        score69: '法人户籍',
        score610: '法人婚姻状况',
        // 维度7 - 经营能力
        score71: '上年增值税金额',
        score72: '今年增值税同比变动',
        score73: '上年企业所得税金额',
        score74: '今年所得税同比变动',
        score75: '缴纳社保人数同比变动',
        score77: '当年纳税金额同比变动',
        score78: '上年出口退税金额',
        // 维度8 - 偿债能力
        score81: '房产套数',
        score82: '房产面积',
        score83: '未抵押房产套数',
        score84: '未抵押房产面积',
        score85: '已抵押房产被担保债权数额',
        score86: '企业车产金额'
      };
      return labelMap[key] || key;
    },
  }
}
</script>
<style lang="scss" scoped>
.common-wrap-cnt {
  background-color: rgb(242, 243, 245);
  overflow: hidden;
  box-shadow: 0 3px 8px 0 #00000017;
  border-radius: 16px 16px 0 0;
  height: calc(100vh - 135px);
  overflow-y: auto;
  padding: 10px;
}

.header-top {
  display: flex;
  justify-content: space-between;
  align-items: center;
  background: #fff;
  padding: 20px;
  border-radius: 10px;
}

.create-form-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-bottom: 1px solid #ebebeb;
  padding: 0 30px;

  .form-title {
    font-weight: 600;
    font-size: 18px;
    color: #222222;
    letter-spacing: 0.5px;
    line-height: 25px;
  }

  .form-operate {
  }
}

.common-create-main {
  padding: 20px;
  background-color: #ffffff;
  margin-top: 20px;
  border-radius: 10px;

  ::v-deep .el-form {
    .el-form-item {
      margin-bottom: 16px;

      .el-input__inner {
        border: 1px solid #ccc;
        color: #3d3d3d;
      }

      .el-input {
        width: 200px;
      }
    }

    .el-form-item__label {
      font-weight: 400;
      line-height: 38px;
      font-size: 14px;
      color: #3d3d3d;
      padding-right: 24px;
    }
  }
}

.edit-box {
  display: flex;
}

.t360-production {
  display: flex;
  align-items: center;
}

.t360-production-item {
  width: 250px;
  height: 43px;
  background: #eaf5ff;
  border-radius: 4px;
  text-align: center;
  line-height: 43px;
  margin-right: 20px;
  margin-top: 25px;
  margin-bottom: 25px;
}

.common-title {
  position: relative;
  color: #222222;
  line-height: 16px;
  font-weight: 600;
  font-size: 16px;
  padding-left: 10px;
  margin: 0;

  &::before {
    position: absolute;
    top: 50%;
    transform: translatey(-50%);
    left: 0;
    content: "";
    width: 3px;
    background-color: #4886f8;
    height: 16px;
    border-radius: 2px;
  }
}

.message-box {
  display: flex;
  margin: 20px;
}

.message-box-left {
  display: flex;
  width: 10%;
  justify-content: center;
  align-items: center;
}

.message-box-right-item {
  padding: 10px;
}

.tag-box {
  margin-bottom: 10px;
}

::v-deep .el-input {
  width: 200px;
}

.affiliatedData {
  margin-top: 20px;
}

.title_box1 {
  position: relative;
}

.title_box1:hover .ejTitle {
  display: block;
}

.title_box2 {
  position: relative;
}

.title_box2:hover .ejTitle {
  display: block;
}

.title_box3 {
  position: relative;
}

.title_box3:hover .ejTitle {
  display: block;
}

.title_box4 {
  position: relative;
}

.title_box4:hover .ejTitle {
  display: block;
}

.ejTitle {
  width: 250px;
  line-height: 32px;
  background: #ffffff;
  border-radius: 4px;
  box-shadow: 0 6px 16px 0 #1e1f2714;
  margin-right: 20px;
  margin-top: 8px;
  padding-left: 10px;
  padding-bottom: 10px;
  position: absolute;
  top: 80px;
  z-index: 100;
  display: none;
}

.ejTitle_item {
  line-height: 32px;
  font-size: 14px;
}

.profileForm {
  ::v-deep .el-form-item__content {
    padding-right: 20px;
  }
}

.ccyc {
  display: inline-block;
  width: 95%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.qbdz {
  ::v-deep .el-form-item__content {
    display: flex;
  }
}

.quesiton {
  color: #b9b9b9;
}

.zfRemark {
  display: flex;
}

.remarkTitle {
  width: 70%;
}

.record_btn {
  margin-top: 20px;
}

.record_item {
  line-height: 30px;
}

.dzBox_top {
  display: flex;
}

.dzBox_item {
  width: 50%;
  display: flex;
  min-height: 80px;
  gap: 2%;
  border: 1px solid #ddd;
}

.dzBox_title {
  width: 20%;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: #eaf5ff;
  border-right: 1px solid #ddd;
}

.dzBox_content {
  padding: 15px;
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;

  div {
    line-height: 25px;
  }
}

.dzBox_wapper {
  width: 80%;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.headerForm {
  ::v-deep .el-form-item {
    margin-bottom: 0px;
  }

  ::v-deep .el-form-item__label {
    padding-right: 5px;
  }

  ::v-deep .el-form-item__content {
    display: flex;
    align-items: center;
  }
}

.header_top_left {
  display: flex;
}

.icon_box {
  width: 60px;
  height: 60px;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: rgb(231, 242, 255);
}

.header_icon_box {
  background-color: #4886f8;
  width: 35px;
  height: 35px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.header_icon {
  width: 28px;
  height: 28px;
}

.base-info {
  margin-left: 20px;
}

.wjd {
  margin-left: 20px;
}

.line {
  width: 100%;
  background-color: #ccc;
  height: 1px;
  margin: 15px 0;
}

::v-deep .el-collapse-item {
  margin-top: 15px;
  border-radius: 10px;
}

::v-deep .el-collapse-item__header {
  padding-left: 20px;
}

::v-deep .el-collapse-item__content {
  padding-left: 20px;
}

.my-form {
  ::v-deep .el-input {
    width: 300px;
  }
}

.bz_row_end{
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
  padding-right: 20px;
}
.user-info {
  margin-bottom: 5px;
  margin-left: 26px;
  display: flex;
  align-items: center;

  ::v-deep .vue-treeselect__control {
    width: 320px !important;
    height: 32px;
  }
  ::v-deep .el-input {
    width: 100%
  }

  span {
    width: 70px !important;
    margin-right: 10px;
    font-size: 14px;
    color: #606266;

    &::before {
      content: "*";
      left: -3px;
      color: #ff4d42;
      position: relative;
      top: 2px;
    }
  }

  .input-box {
    width: 320px !important;
  }
}

// 企业九维数据样式
.nine-dimension-data {
  padding: 20px 0;
  background: linear-gradient(180deg, #ffffff 0%, #f8fbff 100%);
  border-radius: 14px;

  .nine-dimension-section {
    margin-bottom: 30px;

    &:last-child {
      margin-bottom: 0;
    }

    .section-title {
      font-size: 15px;
      font-weight: 600;
      color: #202938;
      margin-bottom: 18px;
      padding-bottom: 12px;
      border-bottom: 1px solid #edf1f7;
    }

    .nine-dimension-chart-container {
      display: flex;
      align-items: stretch;
      gap: 30px;
      padding: 26px 30px;
      justify-content: space-between;
      background: linear-gradient(135deg, #ffffff 0%, #fbfcff 100%);
      border: 1px solid #e7edf7;
      border-radius: 14px;
      box-shadow: 0 8px 26px rgba(31, 55, 88, 0.06);

      .radar-chart-wrapper {
        flex: 1;
        min-width: 0;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: stretch;
        padding: 4px 18px 4px 0;
        border-right: 1px solid #edf1f7;

        .nine-dimension-radar {
          width: 100%;
          max-width: none;
          height: 430px;
          margin: 0 auto;
        }
      }

      .nine-dimension-summary {
        width: 236px;
        flex-shrink: 0;
        padding: 18px 20px;
        background: #fff;
        border: 1px solid #edf1f7;
        border-radius: 12px;
        box-shadow: 0 12px 28px rgba(34, 65, 120, 0.08);
        align-self: center;

        .summary-item {
          display: flex;
          flex-direction: column;
          gap: 10px;
          padding: 16px 0;
          border-bottom: 1px solid #edf1f7;

          &:last-child {
            padding-bottom: 6px;
            border-bottom: 0;
          }

          .summary-label {
            display: block;
            font-size: 15px;
            color: #202938;
            font-weight: 600;
          }

          .summary-content {
            display: flex;
            align-items: baseline;
            justify-content: flex-end;
            gap: 8px;
          }

          .summary-value {
            display: block;
            font-size: 40px;
            line-height: 1;
            font-weight: 700;
            color: #1f6feb;
            letter-spacing: -1px;

            &.is-rank {
              color: #22c55e;
            }
          }

          .summary-unit {
            font-size: 18px;
            font-weight: 600;
            color: #202938;
          }
        }
      }
    }

    .nine-dimension-detail-table {
      overflow-x: auto;

      .detail-table {
        width: 100%;
        min-width: 980px;
        border-collapse: collapse;
        table-layout: fixed;
        border: 1px solid #ebeef5;

        td {
          padding: 18px 16px;
          border: 1px solid #ebeef5;
          font-size: 13px;
          line-height: 1.6;
          color: #303133;
          vertical-align: middle;
          word-break: break-word;
        }

        .category-cell {
          width: 184px;
          background: #eef3f9;
          color: #1f6feb;
          font-size: 15px;
          font-weight: 700;
          text-align: center;
        }

        .metric-label-cell {
          background: #f6f8fb;
          font-weight: 600;
        }

        .metric-value-cell {
          width: 120px;
          background: #fff;
          font-weight: 500;
          text-align: center;
        }

        .is-empty {
          background: #fff;
        }
      }
    }

    .data-item {
      margin-bottom: 12px;
      padding: 10px;
      background-color: #f5f7fa;
      border-radius: 4px;

      .data-label {
        display: inline-block;
        width: 120px;
        font-size: 14px;
        color: #606266;
        font-weight: 500;
      }

      .data-value {
        font-size: 14px;
        color: #303133;
      }
    }
  }
}

@media (max-width: 1400px) {
  .nine-dimension-data {
    .nine-dimension-section {
      .nine-dimension-chart-container {
        flex-direction: column;
        align-items: stretch;

        .radar-chart-wrapper {
          padding-right: 0;
          border-right: 0;
          border-bottom: 1px solid #edf1f7;
          padding-bottom: 18px;
          margin-bottom: 4px;

          .nine-dimension-radar {
            max-width: 100%;
            height: 390px;
          }
        }

        .nine-dimension-summary {
          width: 100%;
        }
      }
    }
  }
}
</style>
