<template>
  <van-nav-bar
    fixed
    title="人员档案信息"
    left-arrow
    @click-left="onClickLeft"
    :style="{ 'background-color': selectColor }"
  />
  <div class="main">
    <div class="banner">
      <img src="../../../public/loginbg/banner.jpg" alt="" />
    </div>
    <div class="info">
      <p class="miniTitle">个人信息-{{ data.data.name }}</p>
      <van-row justify="space-between">
        <van-col span="14">
          <van-row class="item">
            <van-col span="24">
              <van-row justify="space-between">
                <!-- <van-col span="8"> 姓名： </van-col>
                <van-col span="8" style="text-align: right">
                  {{ data.data.name }}
                </van-col> -->
                <van-field
                  v-model="data.data.name"
                  center
                  readonly
                  clearable
                  label="姓名:"
                  input-align="right"
                />
              </van-row>
            </van-col>
          </van-row>
          <van-row class="item">
            <van-col span="24">
              <van-row justify="space-between">
                <van-field
                  v-model="data.data.sex"
                  center
                  readonly
                  clearable
                  label="性别:"
                  input-align="right"
                />
              </van-row>
            </van-col>
          </van-row>
          <van-row class="item">
            <van-col span="24">
              <van-row justify="space-between">
                <!-- <van-col span="12"> 证件类型： </van-col>
                <van-col span="6" style="text-align: right">
                  <span v-if="data.data.idType == 1">身份证</span>
                  <span v-if="data.data.idType == 2">护照</span>
                  <span v-if="data.data.idType == 3">港澳通行证</span>
                  <span v-if="data.data.idType == 4">其他</span>
                </van-col> -->
                <van-field
                  v-model="data.data.idType"
                  center
                  readonly
                  clearable
                  label="证件类型:"
                  input-align="right"
                >
                  <template #input>
                    <template v-if="data.data.idType == 1">身份证</template>
                    <template v-if="data.data.idType == 2">护照</template>
                    <template v-if="data.data.idType == 3">港澳通行证</template>
                    <template v-if="data.data.idType == 4">其他</template>
                  </template>
                </van-field>
              </van-row>
            </van-col>
          </van-row>
        </van-col>
        <van-col span="8">
          <van-image width="100" height="100" :src="data.data.workPicture" />
        </van-col>
      </van-row>
      <van-row class="item">
        <van-col span="24">
          <van-row justify="space-between">
            <van-field
              v-model="data.data.idcard"
              center
              readonly
              clearable
              label="证件号码："
              input-align="right"
            />
          </van-row>
        </van-col>
      </van-row>
      <van-row class="item">
        <van-col span="24">
          <van-row justify="space-between">
            <!-- <van-col span="10"> 手机号： </van-col>
            <van-col span="14" style="text-align: right">
              {{ data.data.phone }}
            </van-col> -->
            <van-field
              v-model="data.data.phone"
              center
              readonly
              clearable
              label="手机号："
              input-align="right"
            />
          </van-row>
        </van-col>
      </van-row>
      <van-row class="item">
        <van-col span="24">
          <van-row justify="space-between">
            <van-field
              v-model="data.data.locationName"
              center
              readonly
              clearable
              label="所属场所："
              input-align="right"
            />
          </van-row>
        </van-col>
      </van-row>
      <van-row class="item">
        <van-col span="24">
          <van-row justify="space-between">
            <van-field
              v-model="data.data.personnelType"
              center
              readonly
              clearable
              label="人员类型："
              input-align="right"
            >
              <template #input>
                <template v-if="data.data.personnelType == 1"
                  >宗教从业人员</template
                >
                <template v-else-if="data.data.personnelType == 2"
                  >民族场所从业人员</template
                >
                <template v-else-if="data.data.personnelType == 3"
                  >教职人员</template
                >
                <template v-else-if="data.data.personnelType == 4"
                  >固定信徒</template
                >
                <template v-else-if="data.data.personnelType == 5"
                  >场所居住人员</template
                >
                <template v-else-if="data.data.personnelType == 6"
                  >境外人员</template
                >
                <template v-else-if="data.data.personnelType == 7"
                  >非本市人员</template
                >
                <template v-else-if="data.data.personnelType == 8"
                  >非本教人员</template
                >
                <template v-else-if="data.data.personnelType == 9"
                  >新增信徒人员</template
                >
                <template v-else-if="data.data.personnelType == 10"
                  >临时人员</template
                >
                <template v-else-if="data.data.personnelType == 11"
                  >异常人员</template
                >
                <template v-else-if="data.data.personnelType == 12"
                  >邪教人员</template
                >
                <template v-else-if="data.data.personnelType == 13"
                  >管理人员</template
                >
                <template v-else-if="data.data.personnelType == 14"
                  >全能神离家人员</template
                >
                <template v-else-if="data.data.personnelType == 15"
                  >全能神骨干人员</template
                >
                <template v-else-if="data.data.personnelType == 16"
                  >网络运营人员</template
                >
                <template v-else-if="data.data.personnelType == 17"
                  >涉政有害活动人员</template
                >
                <template v-else-if="data.data.personnelType == 18"
                  >境内外记者</template
                >
                <template v-else-if="data.data.personnelType == 19"
                  >境外法轮功骨干人员</template
                >
                <template v-else-if="data.data.personnelType == 20"
                  >其他邪教骨干人员</template
                >
                <template v-else-if="data.data.personnelType == 21"
                  >心灵法门骨干人员</template
                >
                <template v-else>“精神控制”有害培训骨干人员</template>
              </template>
            </van-field>
          </van-row>
        </van-col>
      </van-row>
      <van-row class="item">
        <van-col span="24">
          <van-row justify="space-between">
            <van-field
              v-model="data.data.typeOfEmployees"
              center
              readonly
              clearable
              label="从业类型:"
              input-align="right"
            >
              <template #input>
                <template v-if="data.data.typeOfEmployees == 1"
                  >场所负责人</template
                >
                <template v-if="data.data.typeOfEmployees == 2"
                  >堂管会成员</template
                >
                <template v-if="data.data.typeOfEmployees == 3"
                  >小组负责人</template
                >
                <template v-if="data.data.typeOfEmployees == 4">财会</template>
                <template v-if="data.data.typeOfEmployees == 5">义工</template>
                <template v-if="data.data.typeOfEmployees == 6">保安</template>
                <template v-if="data.data.typeOfEmployees == 7"
                  >信息审核员</template
                >
              </template>
            </van-field>
          </van-row>
        </van-col>
      </van-row>
      <van-row class="item">
        <van-col span="24">
          <van-row justify="space-between">
            <van-field
              v-model="data.data.nativePlace"
              center
              readonly
              clearable
              label="籍贯："
              input-align="right"
            />
          </van-row>
        </van-col>
      </van-row>
      <van-row class="item">
        <van-col span="24">
          <van-row justify="space-between">
            <van-field
              v-model="data.data.currentResidence"
              center
              readonly
              clearable
              label="现居地："
              input-align="right"
            />
          </van-row>
        </van-col>
      </van-row>
      <van-row class="item">
        <van-col span="24">
          <van-row justify="space-between">
            <van-field
              v-model="data.data.currentResidenceDetail"
              center
              readonly
              clearable
              label="详细地址："
              input-align="right"
            />
          </van-row>
        </van-col>
      </van-row>
      <p class="miniTitle">拓展信息</p>
      <van-row
        class="item"
        v-for="(item, index) in data.data.userManagenmetDetailsDTOList"
        :key="index"
      >
        <van-col
          span="24"
          v-if="item.dataType === '1' && item.dataDictionary == ''"
        >
          <van-row justify="space-between">
            <van-field
              v-model="item.value"
              center
              readonly
              clearable
              :label="item.chineseName"
              input-align="right"
            />
          </van-row>
        </van-col>
        <van-col
          span="24"
          v-if="
            item.dataType === '1' && item.dataDictionary == 'hs_religion_type'
          "
        >
          <van-row justify="space-between">
            <van-field
              v-model="data.data.idType"
              center
              readonly
              clearable
              :label="item.chineseName"
              input-align="right"
            >
              <template #input>
                <template v-if="item.value == 1">伊斯兰教</template>
                <template v-if="item.value == 2">基督教</template>
                <template v-if="item.value == 3">天主教</template>
                <template v-if="item.value == 4">佛教</template>
                <template v-if="item.value == 5">道教</template>
              </template>
            </van-field>
          </van-row>
        </van-col>
        <van-col
          span="24"
          v-if="
            item.dataType === '1' && item.dataDictionary == 'hs_faculty_type'
          "
        >
          <van-row justify="space-between">
            <van-field
              v-model="data.data.idType"
              center
              readonly
              clearable
              :label="item.chineseName"
              input-align="right"
            >
              <template #input>
                <template v-if="item.value == 1">负责人</template>
                <template v-if="item.value == 2">牧师</template>
                <template v-if="item.value == 3">长老</template>
                <template v-if="item.value == 4">传道员</template>
                <template v-if="item.value == 5">神学生</template>
              </template>
            </van-field>
          </van-row>
        </van-col>
        <van-col span="24" v-if="item.dataType === '5'">
          <van-row justify="space-between">
            <van-field
              v-model="item.value"
              center
              readonly
              clearable
              :label="item.chineseName"
              input-align="right"
            />
          </van-row>
        </van-col>
        <van-col span="24" v-if="item.dataType === '6'">
          <van-row justify="space-between">
            <van-field
              v-model="item.value"
              center
              readonly
              clearable
              :label="item.chineseName"
              input-align="right"
            />
          </van-row>
        </van-col>
        <van-col span="24" v-if="item.dataType === '4'">
          <van-field
            center
            readonly
            clearable
            :label="item.chineseName"
            label-align="top"
          >
            <template #input>
              <van-image width="100" height="100" :src="item.value" />
            </template>
          </van-field>
        </van-col>
      </van-row>
    </div>
  </div>
</template>

<script>
import { useRouter } from "vue-router";
import { onMounted, reactive, ref } from "vue";
import $base from "@/utils/config";
export default {
  setup() {
    const data = reactive({
      //个人数据
      data: {},
      idType: "",
    });
    // 导航栏颜色
    const selectColor = ref(window.localStorage.getItem("MZ_COLOR"));
    //数据接收
    const router = useRouter();
    onMounted(() => {
      var item = JSON.parse(router.currentRoute.value.query.data);
      data.data = item;
      if (data.data.sex == 1) {
        data.data.sex = "男";
      } else {
        data.data.sex = "女";
      }
      switch (data.data.idType) {
        case 1:
          data.idType = "身份证";
          break;
        case 2:
          data.idType = "护照";
          break;
        case 3:
          data.idType = "港澳通行证";
          break;
        case 4:
          data.idType = "其他";
          break;
      }

      data.data.workPicture = `${$base}` + data.data.workPicture;
      data.data.userManagenmetDetailsDTOList.forEach((item2) => {
        if (item2.dataType === "4") {
          item2.value = `${$base}` + item2.value;
        }
      });
    });
    //返回
    const onClickLeft = () => {
      history.back();
    };
    return {
      onClickLeft,
      data,
      selectColor,
    };
  },
};
</script>

<style lang="less" scoped>
</style>