<template>
  <div v-if="show">
    <div>
      <img src="https://hnyea.0rui.cn/uploads/1/20240820/7c06389c1dd2fbd4f2d191cdb6c67bb1.png" style="width: 100%"/>
    </div>
    <div style="padding: 20px; margin-top: 20px">
      <div style="width: 80%; margin: 0 auto">
        <div>
          <div style="color: #2e2e2e; font-size: 30px">1.入会资料</div>
          <div style="height: 2px; background-color: #999999; width: 100%; margin-top: 20px"></div>
          <div style="padding: 30px 0px">
            <t-form layout="inline" labelAlign="top" :labelWidth="100">
              <t-form-item name="name" label="推荐方式">
                <t-select size="large" v-model="formData.reporting_method">
                  <t-option label="个人自荐" :value="3"/>
                  <t-option label="会员推荐" :value="2"/>
                  <t-option label="组织推荐" :value="1"/>
                </t-select>
              </t-form-item>
              <template v-if="formData.reporting_method == 3">
                <t-form-item name="name" label="来源渠道">
                  <t-select size="large" v-model="formData.source_channel" placeholder="请选择来源渠道">
                    <t-option value="网络来源" label="网络来源" key="网络来源"></t-option>
                    <t-option value="微信公众号来源" label="微信公众号来源" key="微信公众号来源"></t-option>
                    <t-option value="朋友推荐" label="朋友推荐" key="朋友推荐"></t-option>
                    <t-option value="其他渠道" label="其他渠道" key="其他渠道"></t-option>
                  </t-select>
                </t-form-item>
              </template>
              <template v-if="formData.reporting_method == 1">
                <t-form-item name="name" label="推荐地市">
                  <t-select size="large" v-model="formData.recommended_cities" placeholder="请选择推荐地市">
                    <t-option
                      v-for="item in region_list"
                      :value="item.label"
                      :label="item.label"
                      :key="item.label"
                    ></t-option>
                  </t-select>
                </t-form-item>
              </template>
              <template v-if="formData.reporting_method == 2">
                <t-form-item name="name" label="推荐人姓名">
                  <!--                  <t-input size="large"  placeholder="推荐人姓名" />-->
                  <t-select
                    v-model="formData.recommendation_name"
                    filterable
                    placeholder="推荐人姓名"
                    :options="member_list"
                    :keys="{value:'id',label:'nikename',key:'id'}"
                    size="large"
                    @change="getMemberInfo"
                  ></t-select>
                </t-form-item>
                <t-form-item label="推荐人单位名称及职务">
                  <t-input size="large" readonly v-model="formData.recommendation_content"
                           placeholder="推荐人单位名称及职务"/>
                </t-form-item>
              </template>
              <t-form-item label="意向协会职务">
                <t-select size="large" v-model="formData.intentional_association_position" :style="{ width: '200px' }">
                  <t-option key="会员" label="会员" value="会员"></t-option>
                  <t-option key="理事" label="理事" value="理事"></t-option>
                  <t-option key="常务理事" label="常务理事" value="常务理事"></t-option>
                </t-select>
              </t-form-item>
            </t-form>
          </div>
        </div>
        <div style="margin-top: 20px">
          <div style="color: #2e2e2e; font-size: 30px">2.基本信息</div>
          <div style="height: 2px; background-color: #999999; width: 100%; margin-top: 20px"></div>
          <div style="display: flex; justify-items: center; padding: 30px 0px">
            <div style="width: 50%">
              <div style="display: flex; align-items: center; margin-bottom: 10px">
                <span style="color: red; margin-right: 5px">*</span>
                <span style="color: #000;">证件照</span>
              </div>
              <div style="height: 1px; background-color: #999999; width: 100%; margin-top: 10px"></div>
              <div class="t-upload" @click="openCai" style="margin-top: 20px">
                <div
                  style="
                    cursor: pointer;
                    text-align: center;
                    width: 200px;
                    height: 200px;
                    line-height: 200px;
                    border: 1px dashed #999999;
                  "
                >
                  <img
                    :src="$store.state.user.apiUrl + formData.photo_image"
                    style="width: 200px; display: block"
                    v-if="formData.photo_image != ''"
                  />
                  <svg
                    style="font-size: 35px"
                    fill="none"
                    viewBox="0 0 24 24"
                    width="100px"
                    height="100px"
                    class="t-icon t-icon-add"
                    v-if="formData.photo_image == ''"
                  >
                    <path fill="currentColor" d="M13 4v7h7v2h-7v7h-2v-7H4v-2h7V4h2z"></path>
                  </svg>
                </div>
                <small class="t-upload__tips t-size-s">请上传证件照，照片将作为会员证照</small>
              </div>
            </div>
            <div style="margin-left: 50px">
              <t-space direction="vertical">
                <t-form layout="inline" labelAlign="top" :labelWidth="100">
                  <t-form-item label="姓名" :requiredMark="true">
                    <t-input size="large" v-model="formData.nikename" placeholder="请输入姓名"/>
                  </t-form-item>
                  <t-form-item label="性别" name="name" :requiredMark="true">
                    <t-select size="large" v-model="formData.gender" :style="{ width: '200px' }">
                      <t-option :key="0" label="女" :value="0"></t-option>
                      <t-option :key="1" label="男" :value="1"></t-option>
                    </t-select>
                  </t-form-item>
                  <t-form-item label="出生年月日" :requiredMark="true">
                    <t-date-picker size="large" :style="{ width: '200px' }" v-model="formData.birth_time"/>
                  </t-form-item>
                  <t-form-item label="民族" :requiredMark="true">
                    <t-input size="large" v-model="formData.nation" placeholder="请输入民族"/>
                  </t-form-item>
                  <t-form-item label="政治面貌" :requiredMark="true">
                    <t-select
                      size="large"
                      v-model="formData.political"
                      placeholder="请选择政治面貌"
                      :style="{ width: '200px' }"
                    >
                      <t-option value="中共党员" label="中共党员" key="中共党员"></t-option>
                      <t-option value="中共预备党员" label="中共预备党员" key="中共预备党员"></t-option>
                      <t-option value="共青团员" label="共青团员" key="共青团员"></t-option>
                      <t-option value="民革党员" label="民革党员" key="民革党员"></t-option>
                      <t-option value="民盟盟员" label="民盟盟员" key="民盟盟员"></t-option>
                      <t-option value="民建会员" label="民建会员" key="民建会员"></t-option>
                      <t-option value="民进会员" label="民进会员" key="民进会员"></t-option>
                      <t-option value="农工党党员" label="农工党党员" key="农工党党员"></t-option>
                      <t-option value="致公党党员" label="致公党党员" key="致公党党员"></t-option>
                      <t-option value="九三学社社员" label="九三学社社员" key="九三学社社员"></t-option>
                      <t-option value="台盟盟员" label="台盟盟员" key="台盟盟员"></t-option>
                      <t-option value="无党派人士" label="无党派人士" key="无党派人士"></t-option>
                      <t-option value="群众" label="群众" key="群众"></t-option>
                    </t-select>
                  </t-form-item>
                  <t-form-item label="身份证号码" :requiredMark="true">
                    <t-input size="large" v-model="formData.card_number" placeholder="请输入身份证号码"/>
                  </t-form-item>
                  <t-form-item label="工作单位" :requiredMark="true">
                    <t-input size="large" v-model="formData.work_unit" placeholder="请输入工作单位"/>
                  </t-form-item>
                  <t-form-item label="单位职务" :requiredMark="true">
                    <t-input size="large" v-model="formData.unit_position" placeholder="请输入单位职务"/>
                  </t-form-item>
                  <t-form-item label="通讯地址" :requiredMark="true">
                    <t-input size="large" v-model="formData.mail_address" placeholder="请输入通讯地址"/>
                  </t-form-item>
                  <t-form-item label="籍贯" :requiredMark="true">
                    <t-input size="large" v-model="formData.jiguan" placeholder="请输入籍贯"/>
                  </t-form-item>
                  <t-form-item label="毕业院校">
                    <t-input size="large" v-model="formData.institution" placeholder="请输入毕业院校"/>
                  </t-form-item>
                  <t-form-item label="学历">
                    <t-select
                      size="large"
                      v-model="formData.education"
                      placeholder="请选择学历"
                      :style="{ width: '200px' }"
                    >
                      <t-option value="博士研究生" label="博士研究生" key="博士研究生"></t-option>
                      <t-option value="硕士研究生" label="硕士研究生" key="硕士研究生"></t-option>
                      <t-option value="本科" label="本科" key="本科"></t-option>
                      <t-option value="专科" label="专科" key="专科"></t-option>
                      <t-option value="其他" label="其他" key="其他"></t-option>
                    </t-select>
                  </t-form-item>
                  <t-form-item label="学位">
                    <t-select
                      size="large"
                      v-model="formData.academic_degree"
                      placeholder="请选择学位"
                      :style="{ width: '200px' }"
                    >
                      <t-option value="博士" label="博士" key="博士"></t-option>
                      <t-option value="硕士" label="硕士" key="硕士"></t-option>
                      <t-option value="学士" label="学士" key="学士"></t-option>
                      <t-option value="其他" label="其他" key="其他"></t-option>
                    </t-select>
                  </t-form-item>
                  <t-form-item label="邮编">
                    <t-input size="large" v-model="formData.zip_code" placeholder="请输入邮编"/>
                  </t-form-item>
                  <t-form-item label="手机号" :rules="[{ required: true, message: '此项必填' }]">
                    <t-input size="large" v-model="formData.phone" placeholder="请输入手机号"/>
                  </t-form-item>
                  <t-form-item label="邮箱">
                    <t-input size="large" v-model="formData.mailbox" placeholder="请输入邮箱"/>
                  </t-form-item>
                  <t-form-item label="微信">
                    <t-input size="large" v-model="formData.wx_number" placeholder="请输入微信"/>
                  </t-form-item>
                  <t-form-item label="固定电话">
                    <t-input size="large" v-model="formData.fixed_telephone" placeholder="请输入固定电话"/>
                  </t-form-item>
                  <t-form-item label="所在区域" name="region_id">
                    <t-cascader
                      size="large"
                      v-model="formData.region_id"
                      :options="region_list"
                      :style="{ width: '200px' }"
                    ></t-cascader>
                  </t-form-item>
                </t-form>
              </t-space>
            </div>
          </div>
          <div>
            <div>身份证照</div>
            <div style="height: 1px; background-color: #999999; width: 100%; margin-top: 10px"></div>
            <div style="display: flex; justify-items: center; padding: 30px 0px">
              <div style="text-align: center">
                <div class="sfz">
                  <span v-if="formData.cardz_image == ''"
                  ><svg
                    style="font-size: 30px"
                    fill="none"
                    viewBox="0 0 24 24"
                    width="100px"
                    height="100px"
                    class="t-icon t-icon-add"
                    v-if="formData.cardz_image == ''"
                  >
                      <path fill="currentColor" d="M13 4v7h7v2h-7v7h-2v-7H4v-2h7V4h2z"></path></svg
                  ></span>
                  <img
                    v-if="formData.cardz_image != ''"
                    :src="$store.state.user.apiUrl + formData.cardz_image"
                    style="width: 100%; max-height: 200px"
                  />
                </div>
                <div style="margin: 10px 0px">请上传身份证正面照片</div>
                <t-upload
                  :action="$store.state.user.apiUrl + '/api/common/upload'"
                  v-model="formData.cardz_image_show"
                  theme="custom"
                  :data="{ association_id: 1 }"
                  accept="image/*"
                  :format-response="(response) => formatResponse(response, 1)"
                >
                  <t-button>上传图片</t-button>
                </t-upload>
              </div>
              <div style="margin-left: 100px; text-align: center">
                <div class="sfz">
                  <span v-if="formData.cardf_image == ''"
                  ><svg
                    style="font-size: 30px"
                    fill="none"
                    viewBox="0 0 24 24"
                    width="100px"
                    height="100px"
                    class="t-icon t-icon-add"
                    v-if="formData.cardf_image == ''"
                  >
                      <path fill="currentColor" d="M13 4v7h7v2h-7v7h-2v-7H4v-2h7V4h2z"></path></svg
                  ></span>
                  <img
                    v-if="formData.cardf_image != ''"
                    :src="$store.state.user.apiUrl + formData.cardf_image"
                    style="width: 100%; max-height: 200px"
                  />
                </div>
                <div style="margin: 10px 0px">请上传身份证背面照片</div>
                <t-upload
                  :action="$store.state.user.apiUrl + '/api/common/upload'"
                  v-model="formData.cardf_image_show"
                  :data="{ association_id: 1 }"
                  theme="custom"
                  accept="image/*"
                  :format-response="(response) => formatResponse(response, 2)"
                >
                  <t-button>上传图片</t-button>
                </t-upload>
              </div>
            </div>
          </div>
          <div style="display: flex; justify-items: center; justify-content: space-between">
            <div style="width: 49%">
              <div>个人简介</div>
              <div style="height: 1px; background-color: #999999; width: 100%; margin-top: 10px"></div>
              <div style="margin-top: 20px">
                <!--                <t-textarea placeholder="请输入个人简介" :autosize="{ minRows: 15, maxRows: 20 }"-->
                <!--                            v-model="formData.introduction"/>-->
                <div style="border: 1px solid #ccc">
                  <!-- 工具栏 -->
                  <Toolbar
                    style="border-bottom: 1px solid #ccc"
                    mode="default"
                    :editor="editorJJ"
                    :defaultConfig="toolbarConfig"
                  />

                  <Editor
                    style="height: 300px"
                    v-model="formData.introduction"
                    :defaultConfig="editorConfig"
                    mode="default"
                    @customPaste="customPaste"
                    @onCreated="(e) => onCreatedJJ(e)"
                  />
                </div>
              </div>
            </div>
            <div style="width: 49%">
              <div>主要成就以及获奖情况</div>
              <div style="height: 1px; background-color: #999999; width: 100%; margin-top: 10px"></div>
              <div style="margin-top: 20px">
                <!--                <t-textarea placeholder="请输入主要成就以及获奖情况" :autosize="{ minRows: 15, maxRows: 20 }"-->
                <!--                            v-model="formData.achievement_award"/>-->
                <div style="border: 1px solid #ccc">
                  <!-- 工具栏 -->
                  <Toolbar
                    style="border-bottom: 1px solid #ccc"
                    mode="default"
                    :editor="editorCJ"
                    :defaultConfig="toolbarConfig"
                  />

                  <Editor
                    style="height: 300px"
                    v-model="formData.achievement_award"
                    :defaultConfig="editorConfig"
                    mode="default"
                    @customPaste="customPaste"
                    @onCreated="(e) => onCreatedCJ(e)"
                  />
                </div>
              </div>
            </div>
          </div>
        </div>
        <div style="margin-top: 30px">学习工作经历</div>
        <div style="height: 1px; background-color: #999999; width: 100%; margin-top: 10px"></div>
        <div style="display: flex; margin-top: 20px">
          <div style="width: 30%">
            <t-space direction="vertical">
              <t-form labelAlign="top" :labelWidth="100">
                <t-form-item label="起止日期">
                  <!--                  <t-input v-model="work.time" placeholder="起止日期"/>-->
                  <t-date-range-picker size="large" mode="month" v-model="work_time" allow-input @change="onChange"/>
                </t-form-item>
                <t-form-item label="地区单位">
                  <t-input size="large" v-model="work.address" placeholder="请输入地区单位"/>
                </t-form-item>
                <t-form-item label="担任职务">
                  <t-input size="large" v-model="work.book" placeholder="请输入担任职务"/>
                </t-form-item>
              </t-form>
              <t-button @click="addWork" theme="primary">添加</t-button>
            </t-space>
          </div>
          <div style="width: 100%">
            <table style="width: 100%; border-collapse: collapse">
              <tr align="center">
                <th>起止日期</th>
                <th>地区单位</th>
                <th>担任职务</th>
                <th>操作</th>
              </tr>
              <tr align="center" v-for="(item, index) in workList" :key="index">
                <td>{{ item.time }}</td>
                <td>{{ item.address }}</td>
                <td>{{ item.book }}</td>
                <td>
                  <t-button @click="delWork(index)" theme="danger" size="small">移除</t-button>
                </td>
              </tr>
            </table>
          </div>
        </div>
        <div style="margin-top: 30px">社会职务资料</div>
        <div style="height: 1px; background-color: #999999; width: 100%; margin-top: 10px"></div>
        <div style="display: flex; margin-top: 20px">
          <div style="width: 35%">
            <div>主要社会职务(可多选)</div>
            <div style="margin-top: 20px">
              <t-space direction="vertical">
                <t-form>
                  <t-form-item>
                    <t-checkbox-group v-model="social_duties">
                      <t-checkbox value="全国人大代表">全国人大代表</t-checkbox>
                      <t-checkbox value="全国政协委员">全国政协委员</t-checkbox>
                      <t-checkbox value="全国青联委员">全国青联委员</t-checkbox>
                      <t-checkbox value="省级人大代表">省级人大代表</t-checkbox>
                      <t-checkbox value="省级政协委员">省级政协委员</t-checkbox>
                      <t-checkbox value="省级青联委员">省级青联委员</t-checkbox>
                      <t-checkbox value="市级人大代表">市级人大代表</t-checkbox>
                      <t-checkbox value="市级政协委员">市级政协委员</t-checkbox>
                      <t-checkbox value="市级青联委员">市级青联委员</t-checkbox>
                    </t-checkbox-group>
                  </t-form-item>
                </t-form>
              </t-space>
            </div>
          </div>
          <div style="width: 100%">
            <div style="width: 49%">
              <div>其他社会职务</div>
              <div style="margin-top: 20px">
                <t-textarea
                  placeholder="其他社会职务"
                  :autosize="{ minRows: 7, maxRows: 7 }"
                  v-model="formData.other_social_positions"
                />
              </div>
            </div>
          </div>
        </div>
        <div style="margin-top: 30px">紧急（助理）联系人</div>
        <div style="height: 1px; background-color: #999999; width: 100%; margin-top: 10px"></div>
        <div style="display: flex; margin-top: 20px">
          <div style="width: 30%">
            <t-space direction="vertical">
              <t-form labelAlign="top" :labelWidth="100">
                <t-form-item label="姓名">
                  <t-input size="large" v-model="contacts.name" placeholder="请输入姓名"/>
                </t-form-item>
                <t-form-item label="职务">
                  <t-input size="large" v-model="contacts.post" placeholder="请输入职务"/>
                </t-form-item>
                <t-form-item label="电话">
                  <t-input size="large" v-model="contacts.phone" placeholder="请输入电话"/>
                </t-form-item>
              </t-form>
              <t-button @click="addContacts" theme="primary">添加</t-button>
            </t-space>
          </div>
          <div style="width: 100%">
            <table style="width: 100%; border-collapse: collapse">
              <thead>
              <tr align="center">
                <th>姓名</th>
                <th>职务</th>
                <th>电话</th>
                <th>操作</th>
              </tr>
              </thead>
              <tbody>
              <tr align="center" v-for="(item, index) in contactsList" :key="index">
                <td>{{ item.name }}</td>
                <td>{{ item.post }}</td>
                <td>{{ item.phone }}</td>
                <td style="text-align: center">
                  <t-button @click="delContacts(index)" theme="danger" size="small">移除</t-button>
                </td>
              </tr>
              </tbody>
            </table>
          </div>
        </div>
        <div style="margin-top: 30px">
          <div style="color: #2e2e2e; font-size: 30px">3.企业信息</div>
          <div style="height: 2px; background-color: #999999; width: 100%; margin-top: 20px"></div>
          <div style="display: flex; justify-items: center; padding: 30px 0px">
            <div style="width: 100%">
              <t-space direction="vertical">
                <t-form layout="inline" labelAlign="top" :labelWidth="100">
                  <t-form-item label="企业名称" :requiredMark="true">
                    <t-input size="large" v-model="formData.enterprise_name" placeholder="请输入企业名称"/>
                  </t-form-item>
                  <t-form-item label="统一社会信用代码" :requiredMark="true">
                    <t-input size="large" v-model="formData.unified_code" placeholder="请输入统一社会信用代码"/>
                  </t-form-item>
                  <t-form-item label="企业注册地" :requiredMark="true">
                    <t-input size="large" v-model="formData.enterprise_location" placeholder="请输入企业注册地"/>
                  </t-form-item>
                  <t-form-item
                    :requiredMark="true"
                    label="企业位置经度"
                    help="坐标拾取：https://lbs.qq.com/tool/getpoint/get-point.html"
                  >
                    <t-input size="large" v-model="formData.longitude" placeholder="地图经度（如：116.xxx ）"/>
                  </t-form-item>
                  <t-form-item
                    :requiredMark="true"
                    label="企业位置纬度"
                    help="坐标拾取：https://lbs.qq.com/tool/getpoint/get-point.html"
                  >
                    <t-input size="large" v-model="formData.dimension" placeholder="地图纬度（如：39.xxx ）"/>
                  </t-form-item>
                  <t-form-item label="注册资金（万元）" :requiredMark="true">
                    <t-input size="large" v-model="formData.registered_capital" placeholder="注册资金（万元）"/>
                  </t-form-item>
                  <t-form-item label="是否上市" name="name">
                    <t-select size="large" v-model="formData.if_list" :style="{ width: '200px' }">
                      <t-option key="0" label="是" :value="0"></t-option>
                      <t-option key="1" label="否" :value="1"></t-option>
                    </t-select>
                  </t-form-item>
                  <t-form-item label="员工人数">
                    <t-input size="large" v-model="formData.employee" placeholder="请输入员工人数"/>
                  </t-form-item>
                  <t-form-item label="所属行业" name="name" :requiredMark="true">
                    <t-select size="large" v-model="formData.industry_id" :style="{ width: '200px' }">
                      <t-option
                        v-for="(item, index) in industry_list"
                        :label="item.industry_name"
                        :value="item.id"
                      ></t-option>
                    </t-select>
                  </t-form-item>
                  <t-form-item label="企业网址">
                    <t-input size="large" v-model="formData.enterprise_website" placeholder="企业网址"/>
                  </t-form-item>

                  <t-form-item label="企业性质">
                    <t-select size="large" v-model="formData.enterprise_nature" :style="{ width: '200px' }">
                      <t-option key="国有" label="国有" value="国有"></t-option>
                      <t-option key="私营" label="私营" value="私营"></t-option>
                      <t-option key="混合所有制" label="混合所有制" value="混合所有制"></t-option>
                      <t-option key="集体" label="集体" value="集体"></t-option>
                      <t-option key="外贸" label="外贸" value="外贸"></t-option>
                      <t-option key="其他" label="其他" value="其他"></t-option>
                    </t-select>
                  </t-form-item>
                  <t-form-item label="上年营业额（万元）">
                    <t-input size="large" v-model="formData.previous_revenue" placeholder="上年营业额（万元）"/>
                  </t-form-item>
                  <t-form-item label="上年纳税额（万元）">
                    <t-input size="large" v-model="formData.previous_tax" placeholder="上年纳税额（万元）"/>
                  </t-form-item>
                  <t-form-item label="上年度净利润（万元）">
                    <t-input size="large" v-model="formData.previous_profit" placeholder="上年度净利润（万元）"/>
                  </t-form-item>
                  <t-form-item label="上年公益性捐赠支出（万元）">
                    <t-input
                      size="large"
                      v-model="formData.previous_donation"
                      placeholder="上年公益性捐赠支出（万元）"
                    />
                  </t-form-item>
                </t-form>
              </t-space>
            </div>
          </div>
          <div>
            <div>公司形象</div>
            <div style="height: 1px; background-color: #999999; width: 100%; margin-top: 10px"></div>
            <div style="display: flex; justify-items: center; padding: 30px 0px">
              <div style="text-align: center">
                <div class="sfz">
                  <span v-if="formData.business_license_image == ''"
                  ><svg
                    style="font-size: 30px"
                    fill="none"
                    viewBox="0 0 24 24"
                    width="100px"
                    height="100px"
                    class="t-icon t-icon-add"
                    v-if="formData.business_license_image == ''"
                  >
                      <path fill="currentColor" d="M13 4v7h7v2h-7v7h-2v-7H4v-2h7V4h2z"></path></svg
                  ></span>
                  <img
                    v-if="formData.business_license_image != ''"
                    :src="$store.state.user.apiUrl + formData.business_license_image"
                    style="width: 100%; max-height: 200px"
                  />
                </div>
                <div style="margin: 10px 0px">
                  <span style="color: red; margin-right: 5px">*</span>
                  <span style="color: #000;">请上传营业执照</span>
                </div>
                <t-upload
                  :action="$store.state.user.apiUrl + '/api/common/upload'"
                  v-model="formData.business_license_image_show"
                  theme="custom"
                  :data="{ association_id: 1 }"
                  accept="image/*"
                  :format-response="(response) => formatResponse(response, 3)"
                >
                  <t-button>上传图片</t-button>
                </t-upload>
              </div>
              <div style="margin-left: 100px; text-align: center">
                <div class="sfz">
                  <span v-if="formData.company_image == ''"
                  ><svg
                    style="font-size: 30px"
                    fill="none"
                    viewBox="0 0 24 24"
                    width="100px"
                    height="100px"
                    class="t-icon t-icon-add"
                    v-if="formData.company_image == ''"
                  >
                      <path fill="currentColor" d="M13 4v7h7v2h-7v7h-2v-7H4v-2h7V4h2z"></path></svg
                  ></span>
                  <img
                    v-if="formData.company_image != ''"
                    :src="$store.state.user.apiUrl + formData.company_image"
                    style="width: 100%; max-height: 200px"
                  />
                </div>
                <div style="margin: 10px 0px">
                  <span style="color: red; margin-right: 5px">*</span>
                  <span style="color: #000;">请上传公司LOGO</span>
                </div>
                <t-upload
                  :action="$store.state.user.apiUrl + '/api/common/upload'"
                  v-model="formData.company_image_show"
                  :data="{ association_id: 1 }"
                  theme="custom"
                  accept="image/*"
                  :format-response="(response) => formatResponse(response, 5)"
                >
                  <t-button>上传图片</t-button>
                </t-upload>
              </div>
            </div>
          </div>
          <div style="display: flex; justify-items: center; justify-content: space-between; margin-top: 20px">
            <div style="width: 49%">
              <div>公司介绍</div>
              <div style="height: 1px; background-color: #999999; width: 100%; margin-top: 10px"></div>
              <div style="margin-top: 20px">
                <!--                <t-textarea placeholder="请输入公司介绍" :autosize="{ minRows: 15, maxRows: 20 }"-->
                <!--                            v-model="formData.enterprise_Introduction"/>-->
                <div style="border: 1px solid #ccc">
                  <!-- 工具栏 -->
                  <Toolbar
                    style="border-bottom: 1px solid #ccc"
                    mode="default"
                    :editor="editorGS"
                    :defaultConfig="toolbarConfig"
                  />

                  <Editor
                    style="height: 300px"
                    v-model="formData.enterprise_Introduction"
                    :defaultConfig="editorConfig"
                    mode="default"
                    @customPaste="customPaste"
                    @onCreated="(e) => onCreatedGS(e)"
                  />
                </div>
              </div>
            </div>
            <div style="width: 49%">
              <div>主营业务介绍</div>
              <div style="height: 1px; background-color: #999999; width: 100%; margin-top: 10px"></div>
              <div style="margin-top: 20px">
                <!--                <t-textarea placeholder="请输入主营业务介绍" :autosize="{ minRows: 15, maxRows: 20 }"-->
                <!--                            v-model="formData.introdiction"/>-->
                <div style="border: 1px solid #ccc">
                  <!-- 工具栏 -->
                  <Toolbar
                    style="border-bottom: 1px solid #ccc"
                    mode="default"
                    :editor="editorZY"
                    :defaultConfig="toolbarConfig"
                  />

                  <Editor
                    style="height: 300px"
                    v-model="formData.introdiction"
                    :defaultConfig="editorConfig"
                    mode="default"
                    @customPaste="customPaste"
                    @onCreated="(e) => onCreatedZY(e)"
                  />
                </div>
              </div>
            </div>
          </div>
          <div style="display: flex; justify-items: center; justify-content: space-between; margin-top: 20px">
            <div style="width: 49%">
              <div>企业所获荣誉以及专利</div>
              <div style="height: 1px; background-color: #999999; width: 100%; margin-top: 10px"></div>
              <div style="margin-top: 20px">
                <!--                <t-textarea placeholder="请输入企业所获荣誉以及专利" :autosize="{ minRows: 15, maxRows: 20 }"-->
                <!--                            v-model="formData.enterprise_honor"/>-->
                <div style="border: 1px solid #ccc">
                  <!-- 工具栏 -->
                  <Toolbar
                    style="border-bottom: 1px solid #ccc"
                    mode="default"
                    :editor="editorRY"
                    :defaultConfig="toolbarConfig"
                  />

                  <Editor
                    style="height: 300px"
                    v-model="formData.enterprise_honor"
                    :defaultConfig="editorConfig"
                    mode="default"
                    @customPaste="customPaste"
                    @onCreated="(e) => onCreatedRY(e)"
                  />
                </div>
              </div>
            </div>
            <div style="width: 49%">
              <div>其他企业任职情况</div>
              <div style="height: 1px; background-color: #999999; width: 100%; margin-top: 10px"></div>
              <div style="margin-top: 20px">
                <!--                <t-textarea placeholder="请输入其他企业任职情况" :autosize="{ minRows: 15, maxRows: 20 }"-->
                <!--                            v-model="formData.qitaqiyerenzhiqingkuang"/>-->
                <div style="border: 1px solid #ccc">
                  <!-- 工具栏 -->
                  <Toolbar
                    style="border-bottom: 1px solid #ccc"
                    mode="default"
                    :editor="editorQT"
                    :defaultConfig="toolbarConfig"
                  />

                  <Editor
                    style="height: 300px"
                    v-model="formData.qitaqiyerenzhiqingkuang"
                    :defaultConfig="editorConfig"
                    mode="default"
                    @customPaste="customPaste"
                    @onCreated="(e) => onCreatedQT(e)"
                  />
                </div>
              </div>
            </div>
          </div>
          <div style="display: flex; justify-items: center; justify-content: space-between; margin-top: 20px">
            <div style="width: 49%">
              <div>企业履行社会责任情况</div>
              <div style="height: 1px; background-color: #999999; width: 100%; margin-top: 10px"></div>
              <div style="margin-top: 20px">
                <!--                <t-textarea placeholder="请输入企业履行社会责任情况" :autosize="{ minRows: 15, maxRows: 20 }"-->
                <!--                            v-model="formData.enterprise_lvxingzeren"/>-->
                <div style="border: 1px solid #ccc">
                  <!-- 工具栏 -->
                  <Toolbar
                    style="border-bottom: 1px solid #ccc"
                    mode="default"
                    :editor="editorLX"
                    :defaultConfig="toolbarConfig"
                  />

                  <Editor
                    style="height: 300px"
                    v-model="formData.enterprise_lvxingzeren"
                    :defaultConfig="editorConfig"
                    mode="default"
                    @customPaste="customPaste"
                    @onCreated="(e) => onCreatedLX(e)"
                  />
                </div>
              </div>
            </div>
          </div>
        </div>
        <div style="margin-top: 30px">
          <div style="color: #2e2e2e; font-size: 30px">4.建团信息</div>
          <div style="height: 2px; background-color: #999999; width: 100%; margin-top: 20px"></div>
          <div style="padding: 30px 0px">
            <t-space direction="vertical">
              <t-form layout="inline" labelAlign="top" :labelWidth="100">
                <t-form-item label="是否建立团组织" name="name">
                  <t-select size="large" v-model="formData.if_organization" :style="{ width: '200px' }">
                    <t-option key="0" label="是" :value="0"></t-option>
                    <t-option key="1" label="否" :value="1"></t-option>
                  </t-select>
                </t-form-item>
              </t-form>
              <div v-if="formData.if_organization == 0">
                <div style="display: flex">
                  <div>
                    <t-form labelAlign="top" layout="inline">
                      <t-form-item label="团组织性质" name="nature">
                        <t-select
                          size="large"
                          v-model="formData.nature"
                          placeholder="团组织性质"
                          :style="{ width: '200px' }"
                        >
                          <t-option value="团支部" label="团支部" key="团支部"></t-option>
                          <t-option value="团总支部" label="团总支部" key="团总支部"></t-option>
                          <t-option value="团的基层委员会" label="团的基层委员会" key="团的基层委员会"></t-option>
                        </t-select>
                      </t-form-item>
                      <t-form-item label="建团时间" name="jiantuan_time">
                        <t-date-picker size="large" :style="{ width: '200px' }" v-model="formData.jiantuan_time"/>
                      </t-form-item>
                      <t-form-item label="建团人数" name="jiantuan_number">
                        <t-input size="large" v-model="formData.jiantuan_number" placeholder="建团人数"></t-input>
                      </t-form-item>

                      <!--                <t-form-item label="团委负责人信息" name="tuanweifuzerenxinxi">-->
                      <!--                  <t-input size="large" v-model="formData.tuanweifuzerenxinxi" placeholder="团委负责人信息"></t-input>-->
                      <!--                </t-form-item>-->
                    </t-form>
                    <t-form labelAlign="top" layout="inline" style="margin-top: 10px">
                      <t-form-item label="青年人数" name="youth_number">
                        <t-input size="large" v-model="formData.youth_number" placeholder="青年人数"></t-input>
                      </t-form-item>
                      <t-form-item label="上级团组织" name="superior_nature">
                        <t-input size="large" v-model="formData.superior_nature" placeholder="上级团组织"></t-input>
                      </t-form-item>
                    </t-form>
                  </div>
                  <div>
                    <div style="text-align: center">
                      <div class="sfz">
                        <span v-if="formData.documents_file == ''"
                        ><svg
                          style="font-size: 30px"
                          fill="none"
                          viewBox="0 0 24 24"
                          width="100px"
                          height="100px"
                          class="t-icon t-icon-add"
                          v-if="formData.documents_file == ''"
                        >
                            <path fill="currentColor" d="M13 4v7h7v2h-7v7h-2v-7H4v-2h7V4h2z"></path></svg
                        ></span>
                        <img
                          v-if="formData.documents_file != ''"
                          :src="$store.state.user.apiUrl + formData.documents_file"
                          style="width: 100%; max-height: 200px"
                        />
                      </div>
                      <div style="margin: 10px 0px">请上传批复文件</div>
                      <t-upload
                        :action="$store.state.user.apiUrl + '/api/common/upload'"
                        v-model="formData.documents_file_show"
                        :data="{ association_id: 1 }"
                        theme="custom"
                        accept="image/*"
                        :format-response="(response) => formatResponse(response, 4)"
                      >
                        <t-button>上传图片</t-button>
                      </t-upload>
                    </div>
                  </div>
                </div>

                <div style="margin-top: 30px">团委负责人信息</div>
                <div style="height: 1px; background-color: #999999; width: 100%; margin-top: 10px"></div>
                <div style="display: flex; margin-top: 20px">
                  <div style="width: 30%">
                    <t-space direction="vertical">
                      <t-form labelAlign="top" :labelWidth="100">
                        <t-form-item label="姓名">
                          <t-input size="large" v-model="tuan.name" placeholder="姓名"/>
                        </t-form-item>
                        <t-form-item label="性别">
                          <t-input size="large" v-model="tuan.sex" placeholder="性别"/>
                        </t-form-item>
                        <t-form-item label="单位职务">
                          <t-input size="large" v-model="tuan.job" placeholder="单位职务"/>
                        </t-form-item>
                        <t-form-item label="团委职务">
                          <t-input size="large" v-model="tuan.tun_job" placeholder="团委职务"/>
                        </t-form-item>
                        <t-form-item label="手机号">
                          <t-input size="large" v-model="tuan.phone" placeholder="手机号"/>
                        </t-form-item>
                      </t-form>
                      <t-button @click="addTuan" theme="primary">添加</t-button>
                    </t-space>
                  </div>
                  <div style="width: 100%">
                    <table style="width: 100%; border-collapse: collapse">
                      <thead>
                      <tr align="center">
                        <th>姓名</th>
                        <th>性别</th>
                        <th>单位职务</th>
                        <th>团委职务</th>
                        <th>手机号</th>
                        <th>操作</th>
                      </tr>
                      </thead>
                      <tbody>
                      <tr align="center" v-for="(item, index) in tuan_list" :key="index">
                        <td>{{ item.name }}</td>
                        <td>{{ item.sex }}</td>
                        <td>{{ item.job }}</td>
                        <td>{{ item.tun_job }}</td>
                        <td>{{ item.phone }}</td>
                        <td style="text-align: center">
                          <t-button @click="delTuan(index)" theme="danger" size="small">移除</t-button>
                        </td>
                      </tr>
                      </tbody>
                    </table>
                  </div>
                </div>
              </div>
            </t-space>
          </div>
        </div>
        <div style="padding: 100px 0px; text-align: center">
          <t-button @click="submit" size="large">确定保存</t-button>
          <t-button size="large" @click="download" theme="warning" style="margin-left: 50px">生成PDF</t-button>
        </div>
      </div>
      <t-dialog header="图片上传" :visible="caiMode" width="40%" top="20px" :onClose="onCloseMy" @confirm="onSubmit">
        <div class="cropper-content">
          <div class="cropper">
            <vue-cropper
              ref="cropper"
              :img="caiImg"
              :canMoveBox="false"
              :output-size="1"
              output-type="png"
              :info="true"
              :full="false"
              :auto-crop="true"
              autoCropWidth="200px"
              autoCropHeight="200px"
              mode="100%"
              @realTime="realTime"
              @imgLoad="imgLoad"
              :fixed="true"
              :fixedNumber="[1, 1]"
            ></vue-cropper>
          </div>
          <div
            class="show-preview"
            :style="{ width: previews.w + 'px', height: previews.h + 'px', overflow: 'hidden', margin: '5px' }"
          >
            <div :style="previews.div" class="preview">
              <img :src="previews.url" :style="previews.img"/>
            </div>
          </div>
        </div>
        <div class="footer-btn">
          <div class="scope-btn">
            <label class="btn" for="uploads">上传图片</label>
            <input
              type="file"
              id="uploads"
              style="position: absolute; clip: rect(0 0 0 0)"
              accept="image/png, image/jpeg, image/gif, image/jpg"
              @change="uploadImg($event, 1)"
            />
          </div>
        </div>
      </t-dialog>
    </div>
  </div>
</template>
<script lang="ts">
import {Editor, Toolbar} from '@wangeditor/editor-for-vue';
import store from '@/store';
import {VueCropper} from 'vue-cropper';
import axios from 'axios';
import {CheckCircleIcon, LockOnIcon, UserIcon} from 'tdesign-icons-vue';

export default {
  components: {
    VueCropper,
    Editor,
    Toolbar,
  },
  data() {
    return {
      editorJJ: null,
      editorCJ: null,
      editorGS: null,
      editorZY: null,
      editorRY: null,
      editorQT: null,
      editorLX: null,
      toolbarConfig: {
        showLinkImg: false,
        uploadImgShowBase64: true,
        excludeKeys: [
          'insertVideo', // 删除视频
          'uploadVideo',
          'group-video',
          'insertImage', // 删除网络图片上传
          'uploadImage',
          'group-image',
          'insertLink', // 删除链接
          'insertTable', // 删除表格
          'codeBlock', // 删除代码块
        ],
      },
      editorConfig: {
        placeholder: '',
        readOnly: false, // 是否只允许阅读，不可编辑
        autoFocus: true,
      },
      show: false,
      caiMode: false,
      previews: {},
      caiImg: '',
      work: {
        time: '',
        address: '',
        book: '',
      },
      work_time: [],
      workList: [],
      contacts: {
        name: '',
        post: '',
        phone: '',
      },
      contactsList: [],
      social_duties: [],
      tuan: {
        name: '',
        sex: '',
        job: '',
        tun_job: '',
        phone: '',
      },
      tuan_list: [],
      formData: {
        enterprise_lvxingzeren: '',
        registered_capital: '',
        zip_code: '',
        mail_address: '',
        intentional_association_position: '',
        source_channel: '',
        region_id: null,
        recommendation_id: '',
        recommendation_name:'',
        position_id: null,
        industry_id: null,
        phone: '',
        password: '',
        nikename: '',
        gender: null,
        birth_time: '',
        nation: '',
        political: '',
        jiguan: '',
        institution: '',
        education: '',
        academic_degree: '',
        card_number: '',
        work_unit: '',
        unit_position: '',
        wx_number: '',
        mailbox: '',
        fixed_telephone: '',
        achievement_award: '',
        other_contacts: '',
        other_social_positions: '',
        position: '',
        cardf_image_show: [],
        cardz_image_show: [],
        photo_image_show: [],
        cardf_image: '',
        cardz_image: '',
        photo_image: '',
        business_license_image_show: [],
        business_license_image: '',
        unified_code: '',
        enterprise_nature: '',
        enterprise_website: '',
        if_list: null,
        employee: '',
        previous_revenue: '',
        previous_tax: '',
        previous_profit: '',
        previous_donation: '',
        qitaqiyerenzhiqingkuang: '',
        enterprise_Introduction: '',
        introdiction: '',
        enterprise_honor: '',
        if_organization: null,
        nature: '',
        jiantuan_time: '',
        jiantuan_number: '',
        youth_number: '',
        superior_nature: '',
        tuanweifuzerenxinxi: '',
        documents_file: '',
        documents_file_show: [],
        enterprise_location: '',
        introduction: '',
        enterprise_name: '',
        company_image: '',
        company_image_show: [],
        token: '',
        openid: '',
        work_experience: '',
        main_social_positions: '',
        reporting_method: 3,
        recommendation_content: '',
        recommended_cities: '',
        longitude: '',
        dimension: '',
      },
      current: 2,
      industry_list: [],
      plan_list: [],
      member_list: [],
      region_list: [],
    };
  },
  mounted() {
    console.log(this.$route.query.id);
    this.formData.token = this.$route.query.token;
    this.formData.openid = this.$route.query.openid;
    this.getIndustry();
    this.getRegion();
    this.getInfo();
    this.getUserList();
  },
  methods: {
    getMemberInfo(d) {
      var index = this.member_list.findIndex(item => item.id == d.id);
      this.formData.recommendation_content = this.member_list[index].work_unit + this.member_list[index].unit_position;
    },
    getUserList() {
      if (typeof (this.$route.query.recommendation_id) != 'undefined') {
        this.formData.reporting_method = 2;
      } else {
        this.member_list = [];
        return false;
      }
      var recommendation_id = this.$route.query.recommendation_id;
      this.$request
        .post('/move/member/getrecommendationSelect', {openid: this.$route.query.openid})
        .then((res) => {
          console.log(res);
          this.member_list = res.data;
          var index = res.data.findIndex(item => item.id == recommendation_id);
          this.formData.recommendation_content = this.member_list[index].work_unit + this.member_list[index].unit_position;
            this.formData.recommendation_id = this.member_list[index].id;
            this.formData.recommendation_name = this.member_list[index].nikename;
        })
        .catch((e) => {
          console.log(e);
        });
    },
    onChange(value, context) {
      this.work.time = value[0] + '至' + value[1];
    },
    addTuan() {
      if (this.tuan.name == '') {
        this.$message.error('请输入姓名！', 1500);
        return;
      }
      if (this.tuan.sex == '') {
        this.$message.error('请输入性别！', 1500);
        return;
      }
      if (this.tuan.job == '') {
        this.$message.error('请输入单位职务！', 1500);
        return;
      }
      if (this.tuan.tun_job == '') {
        this.$message.error('请输入团委职务！', 1500);
        return;
      }
      if (this.tuan.phone == '') {
        this.$message.error('请输入手机号！', 1500);
        return;
      }
      var k = {...this.tuan};
      this.tuan_list.push(k);
      this.tuan.name = '';
      this.tuan.sex = '';
      this.tuan.job = '';
      this.tuan.tun_job = '';
      this.tuan.phone = '';
    },
    delTuan(index) {
      this.tuan_list.splice(index, 1);
    },
    addWork() {
      if (this.workList.length >= 12) {
        this.$message.error('最多添加12条数据！', 1500);
        return;
      }
      if (this.work.time == '') {
        this.$message.error('请输入起止日期！', 1500);
        return;
      }
      if (this.work.address == '') {
        this.$message.error('请输入地区单位！', 1500);
        return;
      }
      if (this.work.book == '') {
        this.$message.error('请输入担任职务！', 1500);
        return;
      }
      var k = {...this.work};
      this.workList.push(k);
      this.work.time = '';
      this.work.address = '';
      this.work.book = '';
      this.work_time = [];
    },

    delWork(index) {
      this.workList.splice(index, 1);
    },
    addContacts() {
      if (this.contacts.name == '') {
        this.$message.error('请输入姓名！', 1500);
        return;
      }
      if (this.contacts.post == '') {
        this.$message.error('请输入职务！', 1500);
        return;
      }
      if (this.contacts.phone == '') {
        this.$message.error('请输入电话！', 1500);
        return;
      }
      var k = {...this.contacts};
      this.contactsList.push(k);
      this.contacts.name = '';
      this.contacts.post = '';
      this.contacts.phone = '';
    },
    delContacts(index) {
      this.contactsList.splice(index, 1);
    },
    download() {
      //https://hnyea.0rui.cn/api/move/pdf_member/exportPdf      PDF导出
      //window.location.href="https://hnyea.0rui.cn/api/move/pdf_member/exportPdf?openid="+this.formData.openid;
      const link = document.createElement('a');
      link.href = `https://hnyea.0rui.cn/api/move/pdf_member/exportPdf?openid=${this.formData.openid}`;
      link.target = '_blank'; // 新标签页打开
      link.rel = 'noopener noreferrer'; // 安全考虑
      link.style.display = 'none';
      document.body.appendChild(link);
      link.click();
      document.body.removeChild(link); // 清理 DOM
    },
    uploadImg(e, num) {
      // 上传图片
      // this.option.img
      const file = e.target.files[0];
      if (!/\.(gif|jpg|jpeg|png|bmp|GIF|JPG|PNG)$/.test(e.target.value)) {
        alert('图片类型必须是.gif,jpeg,jpg,png,bmp中的一种');
        return false;
      }
      const reader = new FileReader();
      reader.onload = (e) => {
        let data;
        if (typeof e.target.result === 'object') {
          // 把Array Buffer转化为blob 如果是base64不需要
          data = window.URL.createObjectURL(new Blob([e.target.result]));
        } else {
          data = e.target.result;
        }
        if (num === 1) {
          this.caiImg = data;
        } else if (num === 2) {
          this.example2.img = data;
        }
      };
      // 转化为base64
      // reader.readAsDataURL(file)
      // 转化为blob
      reader.readAsArrayBuffer(file);
    },
    onSubmit() {
      this.$refs.cropper.getCropBlob((data) => {
        // do something
        console.log(data);
        console.log(this.caiImg);
        const formData = new FormData();
        formData.append('file', data, 'image.jpg');
        formData.append('association_id', 1);
        console.log(formData);
        axios
          .post(`${store.state.user.apiUrl}/api/common/upload`, formData, {
            headers: {
              'Content-Type': 'multipart/form-data',
            },
          })
          .then((response) => {
            console.log(response);
            const {data} = response;
            if (data.code == 1) {
              this.formData.photo_image = data.data.url;
              this.$message.success('图片上传成功！');
              this.caiMode = false;
              this.caiImg = '';
              this.$refs.cropper.stopCrop();
              this.$refs.cropper.clearCrop();
            } else {
              this.$message.error('图片上传失败！');
            }
          })
          .catch((error) => {
            console.error('文件上传失败', error);
          });
      });
    },
    onCloseMy() {
      this.caiMode = false;
    },
    realTime(data) {
      this.previews = data;
    },
    imgLoad(msg) {
      console.log(msg);
    },
    openCai() {
      this.caiImg = store.state.user.apiUrl + this.formData.photo_image;
      this.$refs.cropper.startCrop();
      this.caiMode = true;
    },
    getInfo() {
      this.$request
        .post('/move/temporary_token/tokenMember', {openid: this.formData.openid, token: this.formData.token})
        .then((res) => {
          console.log(res);
          if (res.code == 0) {
            this.$message.error('入会链接有误，请前往小程序重新获取！', 5000);
          } else {
            this.show = true;
            this.formData.phone = res.data.phone;
            this.formData.position_id = res.data.position_id;
            this.formData.industry_id = res.data.industry_id == 0 ? null : res.data.industry_id;
            this.formData.region_id = res.data.region_id;
            this.formData.password = res.data.password;
            this.formData.nikename = res.data.nikename;
            this.formData.gender = res.data.gender;
            this.formData.birth_time = res.data.birth_time;
            this.formData.nation = res.data.nation;
            this.formData.political = res.data.political;
            this.formData.jiguan = res.data.jiguan;
            this.formData.institution = res.data.institution;
            this.formData.education = res.data.education;
            this.formData.academic_degree = res.data.academic_degree;
            this.formData.card_number = res.data.card_number;
            this.formData.work_unit = res.data.work_unit;
            this.formData.unit_position = res.data.unit_position;
            this.formData.wx_number = res.data.wx_number;
            this.formData.mailbox = res.data.mailbox;
            this.formData.fixed_telephone = res.data.fixed_telephone;
            this.formData.achievement_award = res.data.achievement_award;
            this.formData.other_contacts = res.data.other_contacts;
            this.formData.other_social_positions = res.data.other_social_positions;
            this.formData.position = res.data.position;
            this.formData.cardf_image = res.data.cardf_image == null ? '' : res.data.cardf_image;
            this.formData.cardz_image = res.data.cardz_image == null ? '' : res.data.cardz_image;
            this.formData.photo_image = res.data.photo_image == null ? '' : res.data.photo_image;
            this.formData.company_image = res.data.company_image == null ? '' : res.data.company_image;
            this.formData.business_license_image =
              res.data.business_license_image == null ? '' : res.data.business_license_image;
            this.formData.unified_code = res.data.unified_code;
            this.formData.enterprise_nature = res.data.enterprise_nature;
            this.formData.enterprise_website = res.data.enterprise_website;
            this.formData.if_list = parseInt(res.data.if_list);
            this.formData.employee = res.data.employee;
            this.formData.previous_revenue = res.data.previous_revenue;
            this.formData.previous_tax = res.data.previous_tax;
            this.formData.previous_profit = res.data.previous_profit;
            this.formData.previous_donation = res.data.previous_donation;
            this.formData.qitaqiyerenzhiqingkuang = res.data.qitaqiyerenzhiqingkuang;
            this.formData.enterprise_Introduction = res.data.enterprise_Introduction;
            this.formData.introdiction = res.data.introdiction;
            this.formData.enterprise_honor = res.data.enterprise_honor;
            this.formData.if_organization = res.data.if_organization;
            this.formData.nature = res.data.nature;
            this.formData.jiantuan_time = res.data.jiantuan_time;
            this.formData.jiantuan_number = res.data.jiantuan_number;
            this.formData.youth_number = res.data.youth_number;
            this.formData.superior_nature = res.data.superior_nature;
            this.formData.tuanweifuzerenxinxi = res.data.tuanweifuzerenxinxi;
            this.formData.documents_file = res.data.documents_file;
            this.formData.enterprise_location = res.data.enterprise_location;
            this.formData.introduction = res.data.introduction;
            this.formData.enterprise_name = res.data.enterprise_name;
            this.formData.main_social_positions = res.data.main_social_positions;

            this.formData.work_experience = res.data.work_experience;
            if (res.data.reporting_method != null) {
              this.formData.reporting_method = res.data.reporting_method;
            }
            this.formData.recommendation_content = res.data.recommendation_content;
            this.formData.documents_file = res.data.documents_file;
            if (res.data.documents_file == '') {
              this.formData.documents_file_show = [];
            } else {
              this.formData.documents_file_show = [{url: store.state.user.apiUrl + res.data.documents_file}];
            }
            this.formData.recommended_cities = res.data.recommended_cities;
            this.formData.source_channel = res.data.source_channel;
            this.formData.intentional_association_position = res.data.intentional_association_position;
            this.formData.mail_address = res.data.mail_address;
            this.formData.zip_code = res.data.zip_code;
            this.formData.registered_capital = res.data.registered_capital;
            this.formData.enterprise_lvxingzeren = res.data.enterprise_lvxingzeren;

            this.formData.longitude = res.data.longitude;
            this.formData.dimension = res.data.dimension;
            if (res.data.work_experience != null) {
              this.workList = JSON.parse(res.data.work_experience);
            } else {
              this.workList = [];
            }
            this.social_duties = res.data.main_social_positions.split(',');
            this.contactsList = JSON.parse(res.data.other_contacts);
            this.tuan_list = JSON.parse(res.data.tuanweifuzerenxinxi);
          }
        })
        .catch((e) => {
          console.log(e);
        });
    },
    getRegion() {
      this.$request
        .post('/region')
        .then((res) => {
          console.log(res);
          if (res.code == 1) {
            this.region_list = res.data;
          }
        })
        .catch((e) => {
          console.log(e);
        });
    },
    getIndustry() {
      this.$request
        .post('/move/industry/index', {association_id: 1})
        .then((res) => {
          console.log(res);
          if (res.code == 1) {
            this.industry_list = res.data;
            this.industry_list.push({id: -1, industry_name: '其他行业'});
          }
        })
        .catch((e) => {
          console.log(e);
        });
    },
    formatResponse(res, type) {
      console.log(res);

      if (type == 0) {
        this.formData.photo_image = res.data.url;
      } else if (type == 1) {
        this.formData.cardz_image = res.data.url;
      } else if (type == 2) {
        this.formData.cardf_image = res.data.url;
      } else if (type == 3) {
        this.formData.business_license_image = res.data.url;
      } else if (type == 4) {
        this.formData.documents_file = res.data.url;
      } else {
        this.formData.company_image = res.data.url;
      }
      return {url: res.data.fullurl};
    },
    submit() {
      console.log(this.formData)
      if (this.formData.nikename == '') {
        this.$message.error('请输入姓名！');
        return;
      }
      if (this.formData.phone == '') {
        this.$message.error('请输入手机号！');
        return;
      }
      if (this.formData.region_id == null) {
        this.$message.error('请选择区域！');
        return;
      }
      if (this.formData.birth_time == null) {
        this.$message.error('请选择出生日期！');
        return;
      }
      if (this.formData.gender == null) {
        this.$message.error('请选择性别！');
        return;
      }
      if (this.formData.political == '') {
        this.$message.error('请输入政治面貌！');
        return;
      }
      if (this.formData.nation == '') {
        this.$message.error('请输入民族！');
        return;
      }
      if (this.formData.card_number == '') {
        this.$message.error('请输入身份证号码！');
        return;
      }
      if (this.formData.work_unit == '') {
        this.$message.error('请输入工作单位！');
        return;
      }
      if (this.formData.unit_position == '') {
        this.$message.error('请输入单位职务！');
        return;
      }
      if (this.formData.mail_address == '') {
        this.$message.error('请输入通讯地址！');
        return;
      }
      if (this.formData.business_license_image == '') {
        this.$message.error('请上传营业执照！');
        return;
      }
      if (this.formData.unified_code == '') {
        this.$message.error('请输入统一社会信用代码！');
        return;
      }
      if (this.formData.enterprise_name == '') {
        this.$message.error('请输入企业名称！');
        return;
      }
      if (this.formData.industry_id == null) {
        this.$message.error('请选择行业！');
        return;
      }
      if (this.formData.longitude == '') {
        this.$message.error('请输入企业位置经度');
        return;
      }
      if (this.formData.dimension == '') {
        this.$message.error('请输入企业位置纬度');
        return;
      }
      // if (this.formData.if_organization == 0) {
      //   if (this.formData.nature == '') {
      //     this.$message.error('请输主团组织性质！');
      //     return;
      //   }
      //   if (this.formData.jiantuan_time == '') {
      //     this.$message.error('请输入建团时间！');
      //     return;
      //   }
      //   if (this.formData.jiantuan_number == '') {
      //     this.$message.error('请输入建团人数！');
      //     return;
      //   }
      //   if (this.formData.youth_number == '') {
      //     this.$message.error('请输入青年人数！');
      //     return;
      //   }
      //   if (this.formData.superior_nature == '') {
      //     this.$message.error('请输入上级团组织！');
      //     return;
      //   }
      //   if (this.formData.tuanweifuzerenxinxi == '') {
      //     this.$message.error('请输入团委负责人信息！');
      //     return;
      //   }
      //   if (this.formData.documents_file == '') {
      //     this.$message.error('请上传批复文件！');
      //     return;
      //   }
      // }
      this.formData.association_id = 1;
      if (this.workList.length > 0) {
        this.formData.work_experience = JSON.stringify(this.workList);
      }
      if (this.contactsList.length > 0) {
        this.formData.other_contacts = JSON.stringify(this.contactsList);
      }
      if (this.tuan_list.length > 0) {
        this.formData.tuanweifuzerenxinxi = JSON.stringify(this.tuan_list);
      }
      if (this.social_duties.length > 0) {
        const splitAndJoin = this.social_duties
          .map((item) => item.split(','))
          .flat()
          .filter((item) => item.trim() !== '') // 过滤掉空字符串和仅含空格的字符串
          .join(',');
        this.formData.main_social_positions = splitAndJoin;
      }

      this.$request
        .post('/move/temporary_token/shenqing', this.formData)
        .then((res) => {
          console.log(res);
          if (res.code == 1) {
            this.$message.success(res.msg);
          } else {
            this.$message.error(res.msg);
          }
          // setTimeout(() => {
          //   this.$router.push(`/login?id=`+this.id);
          // }, 1000);
          //this.getInfo();
        })
        .catch((e) => {
          console.log(e);
        });
    },
    onCreatedJJ(editor) {
      this.editorJJ = Object.seal(editor);
    },
    onCreatedCJ(editor) {
      this.editorCJ = Object.seal(editor);
    },
    onCreatedGS(editor) {
      this.editorGS = Object.seal(editor);
    },
    onCreatedZY(editor) {
      this.editorZY = Object.seal(editor);
    },
    onCreatedRY(editor) {
      this.editorRY = Object.seal(editor);
    },
    onCreatedQT(editor) {
      this.editorQT = Object.seal(editor);
    },
    onCreatedLX(editor) {
      this.editorLX = Object.seal(editor);
    },
    customPaste(editor, event, callback) {
      console.log('ClipboardEvent 粘贴事件对象', event);
      var text = event.clipboardData.getData('text/plain');
      text = text.replace(/\s+/g, '');
      editor.insertText(text);
      event.preventDefault();
      callback(false);
      // 返回 true ，继续默认的粘贴行为
    },
  },
};
</script>
<style src="@wangeditor/editor/dist/css/style.css"></style>
<style lang="less" scoped>
@import '@/style/variables.less';

.result-success {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  height: 75vh;

  &-icon {
    font-size: 72px;
    color: var(--td-success-color);
  }

  &-title {
    margin-top: 28px;
    font-size: 20px;
    color: var(--td-text-color-primary);
    text-align: center;
    line-height: 28px;
    font-weight: 500;
  }

  &-describe {
    margin: 8px 0 32px;
    font-size: 14px;
    color: var(--td-text-color-secondary);
    line-height: 22px;
  }
}

.t-button + .t-button {
  margin-left: var(--td-comp-margin-s);
}

.cropper-content {
  display: flex;
  display: -webkit-flex;
  justify-content: flex-end;
  -webkit-justify-content: flex-end;

  .cropper {
    width: 350px;
    height: 300px;
  }

  .show-preview {
    flex: 1;
    -webkit-flex: 1;
    display: flex;
    display: -webkit-flex;
    justify-content: center;
    -webkit-justify-content: center;

    .preview {
      overflow: hidden;
      border-radius: 50%;
      border: 1px solid #cccccc;
      background: #cccccc;
      margin-left: 40px;
    }
  }
}

.footer-btn {
  margin-top: 30px;
  display: flex;
  display: -webkit-flex;
  justify-content: flex-end;
  -webkit-justify-content: flex-end;

  .scope-btn {
    width: 350px;
    display: flex;
    display: -webkit-flex;
    justify-content: space-between;
    -webkit-justify-content: space-between;
  }

  .upload-btn {
    flex: 1;
    -webkit-flex: 1;
    display: flex;
    display: -webkit-flex;
    justify-content: center;
    -webkit-justify-content: center;
  }

  .btn {
    outline: none;
    display: inline-block;
    line-height: 1;
    white-space: nowrap;
    cursor: pointer;
    -webkit-appearance: none;
    text-align: center;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    outline: 0;
    margin: 0;
    -webkit-transition: 0.1s;
    transition: 0.1s;
    font-weight: 500;
    padding: 8px 15px;
    font-size: 12px;
    border-radius: 3px;
    color: #fff;
    background-color: #67c23a;
    border-color: #67c23a;
  }
}

.sfz {
  cursor: pointer;
  text-align: center;
  width: 300px;
  height: 200px;
  line-height: 200px;
  border: 1px dashed #999999;
}

.sfz:hover {
  color: #409eff;
  border: 1px dashed #409eff;
}

.w-e-full-screen-container {
  z-index: 1024;
}
</style>
