<template>
  <ai-detail class="party-detail">
    <template slot="title">
      <ai-title
        title="发展党员信息详情"
        isShowBack
        isShowBottomBorder
        @onBackClick="cancel(true)"
      ></ai-title>
    </template>
    <template slot="content">
      <div>
        <ai-card title="基本信息">
          <template #content>
            <ai-wrapper label-width="150px">
              <ai-avatar
                class="party-avatar"
                v-model="info.avatarUrl"
                :editable="false"
              ></ai-avatar>
              <ai-info-item label="姓名">{{ info.name }}</ai-info-item>
              <ai-info-item
                label="性别"
                :value="dict.getLabel('sex', info.sex)"
              ></ai-info-item>
              <ai-info-item label="身份证号">
                <ai-id mode="show" :value="info.idNumber" rightBtn />
              </ai-info-item>
              <ai-info-item
                label="民族"
                :value="dict.getLabel('nation', info.nation)"
              ></ai-info-item>
              <ai-info-item
                label="出生日期"
                :value="info.birthday"
              ></ai-info-item>
              <ai-info-item label="年龄">{{ info.age }}</ai-info-item>
              <ai-info-item label="发展状态">{{ dict.getLabel('developStatus', info.developStatus)}}</ai-info-item>
              <ai-info-item
                label="籍贯"
                isLine
                :value="info.birthplaceAreaName"
              ></ai-info-item>
              <ai-info-item
                label="户籍地"
                isLine
                :value="info.householdAddressName"
              ></ai-info-item>
            </ai-wrapper>
          </template>
        </ai-card>
        <ai-card title="联络信息">
          <template #content>
            <ai-wrapper label-width="150px">
              <ai-info-item label="联系方式">{{ info.phone }}</ai-info-item>
              <ai-info-item
                label="现住址"
                isLine
                :value="info.currentAddressName"
              ></ai-info-item>
            </ai-wrapper>
          </template>
        </ai-card>
        <ai-card title="团籍信息">
          <template #content>
            <ai-wrapper label-width="150px">
              <ai-info-item label="入团日期">{{ info.joinLeagueMemberTime }}</ai-info-item>
              <ai-info-item label="文化程度">{{ dict.getLabel('education', info.education) }}</ai-info-item>
              <ai-info-item label="学位职称">{{ info.position }}</ai-info-item>
              <ai-info-item label="奖励情况" isLine :value="info.rewardRemark"></ai-info-item>
              <ai-info-item label="处分情况" isLine :value="info.punishmentRemark"></ai-info-item>
              <ai-info-item label="简历" isLine :value="info.resume"></ai-info-item>
              <ai-info-item label="附件" isLine>
                <ai-file-list v-if="info.fileList && info.fileList.length"
                  :fileList="info.fileList"
                  :fileOps="{ name: 'name', size: 'fileSizeStr' }"
                ></ai-file-list>
              </ai-info-item>
            </ai-wrapper>
          </template>
        </ai-card>
        <ai-card title="申请入党">
          <template #content>
            <ai-wrapper label-width="150px">
              <ai-info-item label="申请入党时间">{{ info.applyJoinPartyTime }}</ai-info-item>
              <ai-info-item
                label="申请入党形式"
                isLine
                :value="info.applyJoinPartyWay"
              ></ai-info-item>
            </ai-wrapper>
          </template>
        </ai-card>

        <ai-card title="入党积极分子的确定和教育培养"  v-if="info.developStatus > 0">
          <template #content>
            <ai-wrapper label-width="150px">
              <ai-info-item label="确定为入党积极分子时间" isLine>{{ info.activistTime }}</ai-info-item>
              <ai-info-item label="确定为积极分子的根据和意见" isLine :value="info.activistAccordingRemark"></ai-info-item>
              <ai-info-item label="培养教育情况及鉴定意见" isLine :value="info.activistEducationRemark"></ai-info-item>
            </ai-wrapper>
          </template>
        </ai-card>
        <ai-card title="入党介绍人/培养人"  v-if="info.developStatus > 0">
          <template #content>
            <ai-table
              :border="true"
              :tableData="info.introducerList"
              :isShowPagination="false"
              :col-configs="colConfigs"
              :stripe="false"
              @getList="() => {}"
              >
            </ai-table>
          </template>
        </ai-card>
        <ai-card title="发展对象的确定和考察" v-if="info.developStatus > 1">
          <template #content>
            <ai-wrapper label-width="150px">
              <ai-info-item label="确定为发展对象时间" isLine>{{ info.determineTime }}</ai-info-item>
              <ai-info-item label="政治历史的考察及结论" isLine :value="info.determinePoliticsRemark"></ai-info-item>
              <ai-info-item label="社会关系考察及结论" isLine :value="info.determineSocialRemark"></ai-info-item>
              <ai-info-item label="现实考察及结论" isLine :value="info.determineRealityRemark"></ai-info-item>
              <ai-info-item label="党的基本知识考核及考试成绩" isLine :value="info.determineKnowledgeRemark"></ai-info-item>
              <ai-info-item label="综合考察结论意见" isLine :value="info.determineComprehensiveRemark"></ai-info-item>
              <ai-info-item label="党内讨论是否确定为发展对象的意见" isLine :value="info.determinePartyInnerRemark"></ai-info-item>
              <ai-info-item label="确定为发展对象后的谈话记录" isLine :value="info.determineChatRemark"></ai-info-item>
              <ai-info-item label="支委会研究意见" isLine :value="info.determineBranchRemark"></ai-info-item>
            </ai-wrapper>
          </template>
        </ai-card>
        <ai-card title="预备党员的接收" v-if="info.developStatus > 2">
          <template #content>
            <ai-wrapper label-width="150px">
              <ai-info-item label="吸收入党时间" isLine>{{ info.acceptTime }}</ai-info-item>
              <ai-info-item label="吸收入党地点" isLine :value="info.acceptAddress"></ai-info-item>
              <ai-info-item label="吸收入党时支部大会上党员提的意见和要求及个人的态度" isLine :value="info.acceptBranchMeetingOpinion"></ai-info-item>
              <ai-info-item label="预备期间的教育情况" isLine :value="info.acceptEducationRemark"></ai-info-item>
              <ai-info-item label="党小组对其转正的讨论意见" isLine :value="info.acceptPartyGroupRemark"></ai-info-item>
              <ai-info-item label="预备期间的考察情况" isLine :value="info.acceptInvestigateRemark"></ai-info-item>
              <ai-info-item label="党支部对其转正的意见" isLine :value="info.acceptBranchRemark"></ai-info-item>
            </ai-wrapper>
          </template>
        </ai-card>
        <ai-card title="预备党员的教育考察和转正" v-if="info.developStatus == 4">
          <template #content>
            <ai-wrapper label-width="150px">
              <ai-info-item label="转正时间" isLine>{{ info.becomePartyTime }}</ai-info-item>
              <ai-info-item label="预备期间的教育情况" isLine :value="info.becomePartyEducationRemark"></ai-info-item>
              <ai-info-item label="预备期间的考察情况" isLine :value="info.becomePartyInvestigateRemark"></ai-info-item>
              <ai-info-item label="党小组对其转正的讨论意见" isLine :value="info.becomePartyGroupRemark"></ai-info-item>
              <ai-info-item label="党支部对其转正的意见" isLine :value="info.becomePartyBranchRemark"></ai-info-item>
            </ai-wrapper>
          </template>
        </ai-card>
      </div>
    </template>
  </ai-detail>
</template>

<script>
import { mapState } from "vuex";

export default {
  name: "detail",

  props: {
    instance: Function,
    dict: Object,
    params: Object,
  },

  data() {
    return {
      info: {},
      colConfigs: [
        {prop: "name", label: "姓名", align: "center"},
        {prop: "position", label: "职务", align: "center"},
      ],
    }
  },

  computed: {
    ...mapState(["user"]),
  },

  created() {
    this.dict.load("education", "sex", "nation", "developStatus").then(() => {
      this.getInfo()
    })
  },

  methods: {
    getInfo() {
      let { id } = this.$route.query;
      id && this.instance.post(`/app/apppartydevelop/queryDetailById`, null, { params: { id },}).then((res) => {
        if (res?.data) {
          this.info = res.data;
          if (this.info.birthday) {
            this.info.birthday = this.info.birthday.substring(0, 10);
          }
        }
      });
    },

    cancel() {
      this.$router.push({});
    },
  },
};
</script>

<style scoped lang="scss">
.party-detail {
  ::v-deep .AiID {
    line-height: 1.4;
    color: #222;

    .el-button {
      height: auto;
      padding: 0 8px 0 0;
    }
  }

  .party-avatar {
    position: absolute;
    right: 100px;
  }
}

.audit-0 {
  color: #ff8822 !important;
}

.audit-1 {
  color: #2ea222 !important;
}

.add-btn {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin: 10px 0 20px;

  div {
    display: flex;
    align-items: center;
    color: #2266ff;
    font-size: 14px;

    &:hover {
      opacity: 0.6;
      cursor: pointer;
      user-select: none;
    }

    i {
      line-height: 1;
      margin-right: 4px;
    }
  }
}
</style>
