<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>电子工牌</title>
  <meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=0">
  <link rel="stylesheet" type="text/css" href="../../assets/css/weui.css" />
  <link rel="stylesheet" type="text/css" href="../../assets/css/weuix.css" />
  <link rel="stylesheet" type="text/css" href="../../../bi/css/vant.css" />

  <!-- vue -->
  <script src="../../../bi/js/vue.js"></script>
  <script src="../../../bi/js/vant.min.js"></script>
  <!--全局配置-->
  <script src="../../../config.js"></script>
</head>
<body style="background-color: #f1f1f1;">
<div id="app" class="dy-card" >
  <van-cell-group>
    <van-cell title="照片">
      <van-image v-if="imgUrl"
        width="50px"
        height="50px"
        :src="imgUrl"
        @click="fnImagePreview([imgUrl],0)"
      ></van-image>
    </van-cell>
    <van-cell title="姓名" :value="pd.NAME"></van-cell>
    <van-cell title="性别" :value="gender"></van-cell>
    <van-cell title="出生年月" :value="pd.DATE_OF_BIRTH"></van-cell>
    <van-cell title="年龄" :value="pd.AGE"></van-cell>
    <van-cell title="身份证" :value="pd.CARD_ID" :title-style="{width:'100px',flex:'unset'}"></van-cell>
    <van-cell title="身份证照片">
      <van-image
        width="50px"
        height="50px"
        v-for="(item,index) in userCardIDPhotoFile"
        :key="item"
        :src="item"
        @click="userCardIDPhotoFile(workInsurancePhotoFile,index)"
      ></van-image>
    </van-cell>
    <van-cell title="户口所在地" :value="pd.HKLOCAL"></van-cell>
    <van-cell title="现住址" :value="pd.ADDRESS"></van-cell>
    <van-cell title="联系电话" :value="pd.PHONE"></van-cell>
    <van-cell title="文化程度" :value="pd.DEGREE_OF_EDUCATION_NAME"></van-cell>
    <van-cell title="社会保障号码" :value="pd.SOCIAL_NUMBER" :title-style="{width:'100px',flex:'unset'}"></van-cell>
    <van-cell title="社会保障卡照片">
      <van-image
        width="50px"
        height="50px"
        v-for="(item,index) in socialPhotoFile"
        :key="item"
        :src="item"
        @click="socialPhotoFile(workInsurancePhotoFile,index)"
      ></van-image>
    </van-cell>
    <van-cell title="是否流动人员" :value="formatLabel(pd.ISFLOW)"></van-cell>
    <van-cell title="是否缴纳保险" :value="formatLabel(pd.IS_BF)"></van-cell>
    <van-cell title="岗位名称(工种)" :value="pd.POST_ID"></van-cell>
<!--    <van-cell title="本企业从业开始日期" :value="pd.CORP_START_DATE"></van-cell>-->
<!--    <van-cell title="本岗位从业开始日期" :value="pd.ENTRY_DATE"></van-cell>-->
<!--    <van-cell title="是否签订劳动合同" :value="formatLabel(pd.IS_SIGN_LABOR)"></van-cell>-->
<!--    <van-cell title="劳动合同附件" v-if="pd.IS_SIGN_LABOR == '1'">-->
<!--      <van-image v-if="contractFileList"-->
<!--        width="50px"-->
<!--        height="50px"-->
<!--        v-for="(item,index) in contractFileList"-->
<!--        :key="item"-->
<!--        :src="item"-->
<!--        @click="fnImagePreview(contractFileList,index)"-->
<!--      ></van-image>-->
<!--    </van-cell>-->
<!--    <van-cell title="是否缴纳工伤保险" :value="formatLabel(pd.IS_INJURIES_PAY)"></van-cell>-->
<!--    <van-cell title="工伤保险有效期" :value="formatLabel(pd.IS_INJURIES_PAY)"></van-cell>-->
<!--    <van-cell title="工伤保险凭证" v-if="pd.IS_INJURIES_PAY === '1'">-->
<!--      <van-image-->
<!--        width="50px"-->
<!--        height="50px"-->
<!--        v-for="(item,index) in workInsurancePhotoFile"-->
<!--        :key="item"-->
<!--        :src="item"-->
<!--        @click="fnImagePreview(workInsurancePhotoFile,index)"-->
<!--      ></van-image>-->
<!--    </van-cell>-->
<!--    <van-cell title="是否缴纳商业保险" :value="formatLabel(pd.ISPAY)"></van-cell>-->
<!--    <van-cell title="商业保险单号" :value="formatLabel(pd.ISPAY)"></van-cell>-->
<!--    <van-cell title="商业保险附件" v-if="pd.ISPAY === '1'">-->
<!--      <van-image-->
<!--        width="50px"-->
<!--        height="50px"-->
<!--        v-for="(item,index) in insuranceFileList"-->
<!--        :key="item"-->
<!--        :src="item"-->
<!--        @click="fnImagePreview(insuranceFileList,index)"-->
<!--      ></van-image>-->
<!--    </van-cell>-->
    <van-cell title="是否参加三级安全培训" :value="formatLabel(pd.IS_LEVEL_THREE)"></van-cell>
    <van-cell title="三级安全培训照片" v-if="pd.IS_LEVEL_THREE === '1'">
            <van-image
              width="50px"
              height="50px"
              v-for="(item,index) in photosOfLevel"
              :key="item"
              :src="item"
              @click="fnImagePreview(photosOfLevel,index)"
            ></van-image>
    </van-cell>
<!--    <van-cell title="是否开展入场安全告知" :value="formatLabel(pd.IS_SAFETY_TELL)"></van-cell>-->
<!--    <van-cell title="身体状况是否适应本岗位工作" :value="formatLabel(pd.IS_BODY_ADAPT)"></van-cell>-->
    <van-cell title="是否特殊工种" :value="formatLabel(pd.IS_SPECIAL_JOB)"></van-cell>
  </van-cell-group>
  <van-image-preview v-model="show" :images="images" :start-position="startPosition">
  </van-image-preview>
</div>
<script type="text/javascript" src="../../assets/js/jquery-3.7.1.min.js"></script>
<script type="text/javascript">
  var vm = new Vue({
    el: '#app',
    data:{
      USER_ID : '',
      pd:{
        NAME: '',
        SEX: '',
        AGE: '',
        RELEVANT_UNIT_NAME: '',
        POST_NAME: '',
        PHONE: '',
        TRAIN_AREA: ''
      },
      show: false,
      startPosition: 0,
      images: [],
      photosOfLevel: [],
      contractFileList: [],
      insuranceFileList: [],
      workInsurancePhotoFile: [],
      socialPhotoFile: [],
      userCardIDPhotoFile: [],
      imgUrl: '',
      gender: ''
    },
    methods: {
      //初始执行
      init() {
        this.USER_ID = this.getUrlKey('USER_ID');
        this.getData();
      },
      formatLabel(value) {
        if (value == '1') {
          return '是'
        } else if (value == '0') {
          return '否'
        } else {
          return ''
        }
      },
      getData: function(){
        var _this = this;
        _this.loading = true;
        $.ajax({
          xhrFields: {
            withCredentials: true
          },
          type: "POST",
          url: config.httpurl +'/app/user/getUserInfoByH5' ,
          dataType: 'json',
          data: {
            USER_ID: _this.USER_ID,
          },
          success: function(data){
            _this.pd = Object.assign(_this.pd, data.pd)

            if (_this.pd.PHOTO) {
              if (data.userPhotoFile[0]) {
                _this.imgUrl = config.fileUrl + data.userPhotoFile[0].FILEPATH
              }
            }
            if (_this.pd.SEX == '0') {
              _this.gender = '男'
            } else if (_this.pd.SEX == '1') {
              _this.gender = '女'
            }
            // 三级培训照片
            for (let i = 0; i < data.photosOfLevel.length; i++) {
              _this.photosOfLevel.push(config.fileUrl + data.photosOfLevel[i].FILEPATH)
            }
            // 身份证
            for (let i = 0; i < data.userCardIDPhotoFile.length; i++) {
              _this.userCardIDPhotoFile.push(config.fileUrl + data.userCardIDPhotoFile[i].FILEPATH)
            }
            // 社保卡附件
            for (let i = 0; i < data.socialPhotoFile.length; i++) {
              _this.socialPhotoFile.push(config.fileUrl + data.socialPhotoFile[i].FILEPATH)
            }
            // // 劳动合同
            // for (let i = 0; i < data.contractFile.length; i++) {
            //   _this.contractFileList.push(config.fileUrl + data.contractFile[i].FILEPATH)
            // }
            // // 保险附件
            // for (let i = 0; i < data.insuranceFile.length; i++) {
            //   _this.insuranceFileList.push(config.fileUrl + data.insuranceFile[i].FILEPATH)
            // }
            // // 工伤保险附件
            // for (let i = 0; i < data.workInsurancePhotoFile.length; i++) {
            //   _this.workInsurancePhotoFile.push(config.fileUrl + data.workInsurancePhotoFile[i].FILEPATH)
            // }


          }
        })
      },
      //根据url参数名称获取参数值
      getUrlKey: function (name) {
        return decodeURIComponent(
          (new RegExp('[?|&]' + name + '=' + '([^&;]+?)(&|#|;|$)').exec(location.href) || [, ""])[1].replace(/\+/g, '%20')) || null;
      },
      fnImagePreview(images, startPosition) {
        this.images = images;
        this.startPosition = startPosition
        this.show = true
      },
    },
    mounted(){
      this.init();
    }
  })

  function back(e) {
    window.history.go(-1);
  }
</script>
</body>
</html>
