<template>
  <div class="detail-base">
    <t-card title="" :bordered="false" class="info-block" style="padding: 30px">
      <t-steps :current="0" readonly>
        <t-step-item title="信息审核" content="提交的信息审核"></t-step-item>
        <t-step-item title="会费缴纳" content="等待会费缴纳"></t-step-item>
        <t-step-item title="成功入会" content="已成功入会"></t-step-item>
      </t-steps>
      <t-descriptions :column="3" bordered layout="horizontal" item-layout="horizontal" style="margin-top: 40px">
        <t-descriptions-item label="形象照">
          <div slot="content">
            <t-image-viewer v-model="visible" :draggable="true" mode="modeless" :images="[$store.state.user.apiUrl+info.photo_image]">
              <template #trigger="{ open }">
                <div class="tdesign-demo-image-viewer__ui-image" @click="open">
                  <img alt="" :src="$store.state.user.apiUrl+info.photo_image" style="width: 100px;height: 100px;" class="tdesign-demo-image-viewer__ui-image--img" />
                </div>
              </template>
            </t-image-viewer>
          </div>
        </t-descriptions-item>
        <t-descriptions-item label="身份证正面照">
          <div slot="content">
            <t-image-viewer v-model="visibleZm" :draggable="true" mode="modeless" :images="[$store.state.user.apiUrl+info.cardz_image]">
              <template #trigger="{ open }">
                <div class="tdesign-demo-image-viewer__ui-image" @click="open">
                  <img alt="" :src="$store.state.user.apiUrl+info.cardz_image" style="width: 150px;" class="tdesign-demo-image-viewer__ui-image--img" />
                </div>
              </template>
            </t-image-viewer>
          </div>
        </t-descriptions-item>
        <t-descriptions-item label="身份证反面照">
          <div slot="content">
            <t-image-viewer v-model="visibleFm" :draggable="true" mode="modeless" :images="[$store.state.user.apiUrl+info.cardf_image]">
              <template #trigger="{ open }">
                <div class="tdesign-demo-image-viewer__ui-image" @click="open">
                  <img alt="" :src="$store.state.user.apiUrl+info.cardf_image" style="width: 150px;" class="tdesign-demo-image-viewer__ui-image--img" />
                </div>
              </template>
            </t-image-viewer>
          </div>
        </t-descriptions-item>
        <t-descriptions-item label="会员姓名" :content="info.nikename"></t-descriptions-item>
        <t-descriptions-item label="身份证号码" :content="info.card_number"></t-descriptions-item>
        <t-descriptions-item label="手机号" :content="info.phone"></t-descriptions-item>
        <t-descriptions-item label="出生日期" :content="info.birth_time"></t-descriptions-item>
        <t-descriptions-item label="职位" :content="info.position_name"></t-descriptions-item>
        <t-descriptions-item label="行业" :content="info.industry_id==-1?'其他行业':info.industry_name"></t-descriptions-item>
        <t-descriptions-item label="区域" :content="info.region_name"></t-descriptions-item>
        <t-descriptions-item label="微信号" :content="info.wx_number"></t-descriptions-item>
        <t-descriptions-item label="性别">
          <div slot="content">
            {{info.gender==1?"男":"女"}}
          </div>
        </t-descriptions-item>
        <t-descriptions-item label="籍贯" :content="info.jiguan"></t-descriptions-item>
        <t-descriptions-item label="民族" :content="info.nation"></t-descriptions-item>
        <t-descriptions-item label="政治面貌" :content="info.political"></t-descriptions-item>
        <t-descriptions-item label="毕业院校" :content="info.institution"></t-descriptions-item>
        <t-descriptions-item label="学历" :content="info.education"></t-descriptions-item>
        <t-descriptions-item label="学位" :content="info.academic_degree"></t-descriptions-item>
        <t-descriptions-item :span="3" label="自我介绍">
          <div slot="content" style="width: 600px;">
            {{info.introduction}}
          </div>
        </t-descriptions-item>


        <!--        <t-descriptions-item label="工作单位" :content="info.work_unit"></t-descriptions-item>-->
        <t-descriptions-item label="单位职务" :content="info.unit_position"></t-descriptions-item>

        <t-descriptions-item label="邮箱地址" :content="info.mailbox"></t-descriptions-item>
        <t-descriptions-item label="固定电话" :content="info.fixed_telephone"></t-descriptions-item>
        <t-descriptions-item label="其他社会职务" :content="info.other_social_positions"></t-descriptions-item>
        <t-descriptions-item label="其他联系人" :content="info.other_contacts"></t-descriptions-item>
        <t-descriptions-item label="主要成就以及获奖情况" :content="info.achievement_award"></t-descriptions-item>
        <t-descriptions-item label="营业执照">
          <div slot="content">
            <t-image-viewer v-model="visibleZz" :draggable="true" mode="modeless" :images="[$store.state.user.apiUrl+info.business_license_image]">
              <template #trigger="{ open }">
                <div class="tdesign-demo-image-viewer__ui-image" @click="open">
                  <img alt="" :src="$store.state.user.apiUrl+info.business_license_image" style="width: 150px;" class="tdesign-demo-image-viewer__ui-image--img" />
                </div>
              </template>
            </t-image-viewer>
          </div>
        </t-descriptions-item>
        <t-descriptions-item label="公司Logo">
          <div slot="content">
            <t-image-viewer v-model="visiblelogo" :draggable="true" mode="modeless" :images="[$store.state.user.apiUrl+info.company_image]">
              <template #trigger="{ open }">
                <div class="tdesign-demo-image-viewer__ui-image" @click="open">
                  <img alt="" :src="$store.state.user.apiUrl+info.company_image" style="width: 150px;" class="tdesign-demo-image-viewer__ui-image--img" />
                </div>
              </template>
            </t-image-viewer>
          </div>
        </t-descriptions-item>
        <t-descriptions-item label="统一社会信用代码" :content="info.unified_code"></t-descriptions-item>
        <t-descriptions-item label="公司名称" :content="info.enterprise_name"></t-descriptions-item>
        <t-descriptions-item label="企业性质" :content="info.enterprise_nature"></t-descriptions-item>
        <t-descriptions-item label="企业网址" :content="info.enterprise_website "></t-descriptions-item>
        <t-descriptions-item label="是否上市">
          <div slot="content">
            {{info.if_list==1?"否":"是"}}
          </div>
        </t-descriptions-item>
        <t-descriptions-item label="企业地址" :content="info.enterprise_location"></t-descriptions-item>
        <t-descriptions-item label="上年度营业额" :content="!info.previous_revenue?'':info.previous_revenue+'万'"></t-descriptions-item>
        <t-descriptions-item label="上年度纳税额" :content="!info.previous_tax?'':info.previous_tax+'万'"></t-descriptions-item>
        <t-descriptions-item label="上年度净利润" :content="!info.previous_profit?'':info.previous_profit+'万'"></t-descriptions-item>
        <t-descriptions-item label="上年度公益性捐赠支出" :content="!info.previous_donation?'':info.previous_donation+'万'"></t-descriptions-item>
        <t-descriptions-item label="企业介绍" >
          <div slot="content"  style="width: 300px;">
            {{info.enterprise_Introduction}}
          </div>
        </t-descriptions-item>
        <t-descriptions-item label="业务介绍" :content="info.introdiction"></t-descriptions-item>
        <t-descriptions-item label="企业所获荣誉以及专利" :content="info.enterorise_honor"></t-descriptions-item>
        <t-descriptions-item label="其他企业任职情况" :content="info.qitaqiyerenzhiqingkuang"></t-descriptions-item>

        <t-descriptions-item label="是否建立团组织">
          <div slot="content">
            {{info.if_organization==1?"否":"是"}}
          </div>
        </t-descriptions-item>
        <template v-if="info.if_organization==0">
          <t-descriptions-item label="团组织性质" :content="info.nature"></t-descriptions-item>
          <t-descriptions-item label="建团时间" :content="info.jiantuan_time"></t-descriptions-item>
          <t-descriptions-item label="建团人数" :content="info.jiantuan_number"></t-descriptions-item>
          <t-descriptions-item label="青年人数" :content="info.youth_number"></t-descriptions-item>
          <t-descriptions-item label="上级团组织" :content="info.superior_nature"></t-descriptions-item>
          <t-descriptions-item label="批复文件">
            <div slot="content">
              <t-image-viewer v-model="visiblePf" :draggable="true" mode="modeless" :images="[$store.state.user.apiUrl+info.documents_file]">
                <template #trigger="{ open }">
                  <div class="tdesign-demo-image-viewer__ui-image" @click="open">
                    <img alt="" :src="$store.state.user.apiUrl+info.documents_file" class="tdesign-demo-image-viewer__ui-image--img" />
                  </div>
                </template>
              </t-image-viewer>
            </div>
          </t-descriptions-item>
          <t-descriptions-item label="团委负责人信息" :content="info.tuanweifuzerenxinxi"></t-descriptions-item>
          <t-descriptions-item label="建团时间" :content="info.jiantuan_time"></t-descriptions-item>
        </template>
      </t-descriptions>
      <div v-if="info.if_xianshi==0" style="text-align: center;margin-top: 50px">
        <t-popconfirm theme="danger"  @confirm="tgSelect(2)">
          <template slot="content">
            <p class="title">拒绝理由</p>
            <p class="describe" style="margin-top: 10px">
              <t-input v-model="reason" placeholder="请输入拒绝理由"/>
            </p>
          </template>
          <t-button theme="danger" size="large" style="margin: 0px 10px">审核拒绝</t-button>
        </t-popconfirm>
        <t-popconfirm content="确认通过审核吗？" @confirm="tgSelect(3)">
          <t-button theme="primary" size="large" style="margin-left: 20px">通过审核</t-button>
        </t-popconfirm>
      </div>
    </t-card>
  </div>
</template>
<script lang="ts">
export default {
  data() {
    return {
      visible:false,
      visibleTg:false,
      visibleZz:false,
      visibleZm:false,
      visibleFm:false,
      visiblePf:false,
      visiblelogo:false,
      info:{},
      member_id:0,
      reason:'',
    }
  },
  mounted() {
    this.member_id=this.$route.query.id;
    this.getInfo();
  },
  methods: {
    getInfo() {
      this.$request
        .post("/member/find",{member_id:this.member_id})
        .then( (res) => {
          console.log(res);
          this.info=res.data;
        })
        .catch((e) => {
          console.log(e);
        });
    },
    tgSelect(type){
      this.$request
        .post("/member/update",{member_id:this.member_id,if_xianshi:type,reason:this.reason})
        .then( (res) => {
          console.log(res);
          if (res.code==1){
            this.$message.success(res.msg);
          }else{
            this.$message.error(res.msg);
          }
          this.getInfo();
        })
        .catch((e) => {
          console.log(e);
        });
    },
  }
}
</script>
<style scoped lang="less">
  .info-block{
    margin-bottom: 20px;
  }
</style>
