<template>
  <div>
    <div class="img-box">
      <img @click="imgShow = true" :src="images[0]" alt="">
    </div>
    <van-image-preview v-model="imgShow" :images="images"></van-image-preview>
    <div class="tips">确认资料信息无误后，可长按图片保存下载，将信息页打印后，请在个人签名处签名后上传，注意签名不要连笔。</div>
    <div class="btn-box">
      <van-button class="b" @click="backEdit" color="linear-gradient(180deg, #FF9B96 0%, #CE3E3A 100%)">返回修改</van-button>
      <van-button @click="goUpload" class="b" color="linear-gradient(180deg, #FF9B96 0%, #CE3E3A 100%)">已签名，去上传</van-button>
    </div>
  </div>
</template>
<script>
import { ImagePreview } from 'vant'
export default {
  components: {
    [ImagePreview.name]: ImagePreview
  },
  data() {
    return {
      imgShow: false,
      images: []
    }
  },
  mounted() {
    this.images = [window.sessionStorage.dataUrl]
  },
  methods: {
    backEdit() {
      // this.$router.go(-1)
      if (this.$route.query.edit) {
        this.$router.replace({
          path: '/attestation/form',
          query: {
            id: this.$route.query.id,
            edit: 1
          }
        })
      } else {
        this.$router.replace({
          path: '/attestation/form',
          query: {
            id: this.$route.query.id
          }
        })
      }
    },
    goUpload() {
      if (this.$route.query.edit) {
        this.$router.replace({
          path: '/attestation/upload',
          query: {
            id: this.$route.query.id,
            edit: 1
          }
        })
      } else {
        this.$router.replace({
          path: '/attestation/upload',
          query: {
            id: this.$route.query.id
          }
        })
      }
    }
  }
}
</script>
<style lang="scss" scoped>
.img-box{
  img{
    width: 100%;
  }
}
.tips{
  padding: .1rem;
}
.btn-box{
  margin-top: .8rem;
  display: flex;
  justify-content: space-around;
  .b{
    width: 1.3rem;
  }
}
</style>
