<template>
<div>
  <h2 class="imtil">基础信息</h2>
<div class="wrap">
  <div class="masks"></div>
  <el-form ref="form" :model="form" class="formr" label-width="120px">
    <el-form-item label="姓名">
    <el-input v-model="form.name"></el-input>
  </el-form-item>
   <el-form-item label="性别">
    <el-input v-model="form.sex"></el-input>
  </el-form-item>
  <el-form-item label="民族">
    <el-input v-model="form.nation"></el-input>
  </el-form-item>
  <el-form-item label="缴费标准">
    <el-input v-model="form.pay_type"></el-input>
  </el-form-item>
  <el-form-item label="特殊参保群体">
    <el-input v-model="form.special_type"></el-input>
  </el-form-item>
  <el-form-item label="险种类型">
    <el-input v-model="form.org_insuranceType"></el-input>
  </el-form-item>
</el-form>
<el-form ref="form" :model="form" class="forml" label-width="90px">
  <el-form-item label="身份证号">
    <el-input v-model="form.identity_number"></el-input>
  </el-form-item>
  <el-form-item label="户籍性质">
    <el-input v-model="form.nation_type"></el-input>
  </el-form-item>
   <el-form-item label="户籍所在地">
    <el-input v-model="form.townName"></el-input>
  </el-form-item>


  <el-form-item label="联系电话">
    <el-input v-model="form.telphoneValue"></el-input>
  </el-form-item>
  <el-form-item label="开户银行">
    <el-input v-model="form.pay_bank"></el-input>
  </el-form-item>
  <el-form-item label="缴费账号">
    <el-input v-model="form.pay_account"></el-input>
  </el-form-item>
</el-form>
</div>
<h2 class="imtil">变更信息</h2>
<div class="wrap">
  <div class="masks"></div>
  <el-form ref="form" :model="form" class="formr" label-width="150px">
    <el-form-item :label="old">
    <el-input v-model="form.old"></el-input>
  </el-form-item>
</el-form>
<el-form ref="form" :model="form" class="forml" label-width="150px">
  <el-form-item :label="now">
    <el-input v-model="form.now"></el-input>
  </el-form-item>

</el-form>
</div>
<h2 class="imtil">附件</h2>
<div class="imgcon">
<div class="demo-image__placeholder">
  <div v-show="bb" class="block">
    <p class="demonstration">{{itmebs}}</p>
    <el-image :src="urls[0]"></el-image>
  </div>
  <div class="block">
    <p class="demonstration">签名</p>
    <el-image :src="urls[1]">
      <div slot="placeholder" class="image-slot">
        加载中<span class="dot">...</span>
      </div>
    </el-image>
  </div>
  <div class="block">
    <p class="demonstration">身份证正面</p>
    <el-image :src="urls[2]">
      <div slot="placeholder" class="image-slot">
        加载中<span class="dot">...</span>
      </div>
    </el-image>
  </div>
  <div class="block">
    <p class="demonstration">身份证反面</p>
    <el-image :src="urls[3]">
      <div slot="placeholder" class="image-slot">
        加载中<span class="dot">...</span>
      </div>
    </el-image>
  </div>
</div>
</div>
<div style="text-align:center;margin-bottom:40px" v-show="show">
  <el-button type="success" @click="pass"><i class="el-icon-circle-check"></i> 审核通过</el-button>
   <el-button type="danger" @click="nopass"><i class="el-icon-circle-close"></i> 审核不通过</el-button>
</div>
</div>
</template>
<script>
  import CryptoJS from 'crypto-js'

import { Loading } from 'element-ui';

export default {
    data(){
        return{
          itmebs:"",
          show:'',
            old:"原姓名",
            now:"变更后姓名",
            bb:false,
            form:{
                "name":"",
                "bank_photo":"",
                "groupName":"",
                "identity_number":"",
                "nation":'',
                "nation_type":"",
                "other_social":"",
                "pay_account":"",
                "pay_bank":"",
                "pay_type":'',
                "recordType":'',
                "sex":'',
                "sign_photo":"",
                "social_time":"",
                "special_type":"",
                "telphoneValue":"",
                "townName":"",
                "villageName":"",
                "address":"",
                "wuserId":'',
                "old":"",
                "now":"",
              org_insuranceType: ""
        },
          urls: [

        ],
        show:""
        }

    },
    methods:{
      //审核通过
      pass(){
         this.$confirm('是否审核通过?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',

        }).then(() => {
           Loading.service();
           var data={
               recordId: sessionStorage.getItem("recordId"),
                examineState:1,
               remark:"",
               userId:1
           };
          this.$api.getlist.shenhe(data).then((res) => {
                    let loadingInstance = Loading.service();
            this.$nextTick(() => { // 以服务的方式调用的 Loading 需要异步关闭
              loadingInstance.close();
            });
              if(res.code==200){
          this.$message({
            type: 'success',
            message: res.data
          });
          this.$router.push({
            name:"信息审核"
          })
          }else{
             this.$message({
            type: 'info',
            message: res.message
          });
          }

        }).catch((res) => {
                let loadingInstance = Loading.service();
            that.$nextTick(() => { // 以服务的方式调用的 Loading 需要异步关闭
              loadingInstance.close();
            });
               this.$message({
            type: 'info',
            message: '操作失败!'+res
          });
        });

        }).catch(() => {
          this.$message({
            type: 'info',
            message: '已取消操作'
          });
        });
      },
      //审核不通过
      nopass(){
        var that=this
        this.$prompt('请输入原因', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',

        }).then(({ value }) => {
           if(value){
          Loading.service();
          var data={
               recordId: sessionStorage.getItem("recordId"),
               examineState:2,
               remark:value,
               userId:1
             };
          this.$api.getlist.shenhe(data).then((res) => {
                    let loadingInstance = Loading.service();
            this.$nextTick(() => { // 以服务的方式调用的 Loading 需要异步关闭
              loadingInstance.close();
            });
              if(res.code==200){
          this.$message({
            type: 'success',
            message: res.data
          });
          // this.$router.push({
          //   name:"Xxsh"
          // })
          }else{
             this.$message({
            type: 'info',
            message: res.message
          });
          }

        }).catch((res) => {
                let loadingInstance = Loading.service();
            this.$nextTick(() => { // 以服务的方式调用的 Loading 需要异步关闭
              loadingInstance.close();
            });
               this.$message({
            type: 'info',
            message: '操作失败!'+res
          });
        });

          }else{
              let loadingInstance = Loading.service();
            that.$nextTick(() => { // 以服务的方式调用的 Loading 需要异步关闭
              loadingInstance.close();
            });
          that.$message({
            type: 'info',
            message: '请输入原因'
          });
          }
        }).catch(() => {
          this.$message({
            type: 'info',
            message: '已取消输入'
          });
        });
      },
        decrypt(word){
			    var key = CryptoJS.enc.Utf8.parse("KkweInfo23255625");
			    var decrypt = CryptoJS.AES.decrypt(word, key, {mode:CryptoJS.mode.ECB,padding: CryptoJS.pad.Pkcs7});
			    return CryptoJS.enc.Utf8.stringify(decrypt).toString();
      },
      decryptByDES(ciphertext) {
                var keyHex = CryptoJS.enc.Utf8.parse("KkweFace95271124");
                var decrypted = CryptoJS.DES.decrypt({
                    ciphertext: CryptoJS.enc.Base64.parse(ciphertext)
                }, keyHex, {
                    mode: CryptoJS.mode.ECB,
                    padding: CryptoJS.pad.Pkcs7
                });
                return decrypted.toString(CryptoJS.enc.Utf8);
            }
    },
    created(){
       this.show=this.$route.params.show
      this.show=this.$route.params.show
      if(this.$route.params.info){
      sessionStorage.setItem("info",this.$route.params.info)
      }

      if(this.$route.params.info){
        var a=JSON.stringify(this.$route.params)
      sessionStorage.setItem("items",a)
      }
       this.form =JSON.parse(sessionStorage.getItem("info"))
        this.form.special_type=this.form.org_name.org_insuranceType

         this.form.name=this.decrypt(this.form.org_name)
         //this.form.name=this.form.org_name
        this.form.identity_number=this.decrypt(this.form.org_idNum)
        // this.form.telphoneValue=this.decrypt(this.form.telphoneValue)
        this.form.nation=this.form.nation
        this.form.pay_bank=this.form.org_bankName
        this.form.pay_type=this.form.org_pay
        this.form.special_type=this.form.org_position
        this.form.telphoneValue=this.decrypt(this.form.org_telPhone)
        this.form.address=this.form.org_address
         this.form.pay_account=this.form.org_bankNum

//根据type_son判断变更内容
         if(this.form.type_son==1){
            this.form.old=this.form.pay_type,
            this.form.now=this.form.change_pay
            this.now="变更后档次"
            this.old="变更前档次"
         }else if(this.form.type_son==2){
           this.bb=true
            this.form.old=this.form.org_bankNum,
            this.form.now=this.form.change_bankNum
            this.now="变更后银行卡号"
            this.old="变更前银行卡号"
         }else if(this.form.type_son==3){
            this.form.old=this.form.telphoneValue,
            this.form.now=this.form.change_tel
            this.now="变更后手机号"
            this.old="变更前手机号"
         }else if(this.form.type_son==4){
            this.form.old=this.form.special_type,
            this.form.now=this.form.change_position,
            this.now="变更后参保身份"
            this.old="变更前参保身份"
         }else if(this.form.type_son==5){
            this.form.old=this.form.org_address,
            this.form.now=this.form.change_adress,
            this.now="变更后地址"
            this.old="变更前地址"
         }else if(this.form.type_son==6){
            this.form.old=this.form.name,
            this.form.now=this.form.change_name,
            this.now="变更后姓名"
            this.old="变更前姓名"

         }else if(this.form.type_son==7){
            this.form.old=this.form.identity_number,
            this.form.now=this.decrypt(this.form.change_idNum),
            this.now="变更后身份证"
            this.old="变更前身份证"
         }
        var obj=JSON.parse(sessionStorage.getItem("items"))
        console.log(obj)
        if(obj.bankpic){
          this.itmebs="银行卡"
        this.urls.push("http://socialsecurity.oss-cn-beijing.aliyuncs.com/"+obj.bankpic)
        }else if(obj.bookPic){

          this.itmebs="户口本"
          this.urls.push("http://socialsecurity.oss-cn-beijing.aliyuncs.com/"+obj.bookPic)
        }else if(obj.specialPhotoPic){
          this.itmebs="特殊身份证明"
            this.urls.push("http://socialsecurity.oss-cn-beijing.aliyuncs.com/"+obj.specialPhotoPic)
        }else{
            this.urls.push(" ")
        }

        this.urls.push("http://socialsecurity.oss-cn-beijing.aliyuncs.com/"+obj.signpic)




        this.urls.push("http://socialsecurity.oss-cn-beijing.aliyuncs.com/"+obj.idcardfrontpic)
          this.urls.push("http://socialsecurity.oss-cn-beijing.aliyuncs.com/"+obj.idcardbackpic)


         this.form.sex= this.form.sex==1?"男":"女"
    }
}
</script>
<style>
.wrap{
  overflow: hidden;
  position: relative;
}
.masks{
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  z-index: 200
}
.forml{
  float: left;
  width: 45%
}
.formr{
  float: left;
  width: 40%;
  margin-left: 20px
}
.imgcon{
  margin: 0 auto;
  box-shadow: 0 0 15px lightgray;
  overflow: hidden;
  margin-bottom: 40px
}
.block{
  width: 23%
}
.block{
  float: left;
  height: 100%;
  margin-right: 20px
}

.imtil{
  padding:0 0 20px 0
}
</style>
