Photoz.vue 3.3 KB
<template>
 <div class="home">
   <div class="header">
           <h2 @click="back1"><</h2><h1>上传证件照</h1>
         </div>
         <p><span>*</span>身份证上传(正面)</p>
         <div class="nav1">
             <van-uploader v-model="fileList" multiple :max-count="1" upload-text="添加照片" preview-full-image  preview-size="width:100%;height:100%;" />
         </div>
         <p><span>*</span>身份证上传(反面)</p>
          <div class="nav2">
             <van-uploader v-model="fileList1" multiple :max-count="1" upload-text="添加照片" preview-full-image/>
         </div>
         <p><span>*</span>毕业证上传</p>
          <div class="nav2">
             <van-uploader v-model="fileList2" multiple :max-count="1" upload-text="添加照片" preview-full-image/>
         </div>
           <p><span>*</span>离婚证上传</p>
          <div class="nav2">
             <van-uploader v-model="fileList3" multiple :max-count="1" upload-text="添加照片" preview-full-image/>
         </div>
         <button class="btn" @click="getSubmit">提交</button>

 </div>
</template>
<script>

export default {
  name: 'home',
  components: {

  },
  data () {
    return {
      fileList: [],
      fileList1: [],
      fileList2: [],
      fileList3: []
    }
  },
  mounted: function () {
  //     this.getSubmit()
  },
  methods: {
     back1 () {
       this.$router.go(-1)
     },

    getSubmit () {
         let that = this
         let  params = {
              card_zheng_avatar: that.fileList,
              card_fan_avatar: that.fileList1,
              card_school_avatar: that.fileList2,
                 card_marriage_avata: that.fileList3
         }
         that.$axios.post('/api/Register/register_is_seventh', params).then((res) => {
              that.card_zheng_avatar = res.data
              console.log(that.card_zheng_avatar)
         }).catch((err)  => {
             console.log(err)
         })
    }
  }
}
</script>
<style lang="scss" scoped>
  .home{
    width:100%;
    height:212%;
    background:#11A7FC;
     padding-top:10%;
    padding-left:5%;
    .header{
       width:90%;
       height:.3rem;
      //  background:red;
      margin-bottom:.3rem;
       h1{
         font-size:.2rem;
         line-height:.3rem;
         color:#fff;
         text-align:center;
       }
       h2{
      font-size:.2rem;
      color:#fff;
      margin-bottom:.5rem;
      line-height:.3rem;
      float:left;
      }

     }
     p{
       font-size:.16rem;
       color:#fff;
       margin-bottom:0.2rem;
       span{
          font-size:.2rem;
       color:red;
       margin-right:.1rem;
       line-height:.2rem;
        text-align:center;
       }
     }
     .nav1{
       width:90%;
       height:2.5rem;
       background:#fff;
       display:flex;
       justify-content:center;
       align-items:center;
       border-radius:0.2rem;
       margin-bottom:.4rem;
       margin-left:0%;
     }
     .nav2{
       width:90%;
       height:2.5rem;
       background:#fff;
       display:flex;
       justify-content:center;
       align-items:center;
       border-radius:0.2rem;
        margin-bottom:.4rem;

     }
     .btn{
       width:90%;
       height:.5rem;
       background:#11A7FC;
       font-size:.25rem;
       line-height:.5rem;
       color:#fff;
       border-radius:.2rem;
       border:none;
       margin-bottom:0.2rem;
     }
  }
</style>