wenhuayun_index/src/components/page/examine.vue

<template>
  <div class="body">
      <p class="title">标的挂牌</p>
      <!-- <p class="title_info">第三方服务机构开户用于服务平台中标的托管时的标的价格评估或标的价值评估，需有相关资质机构方能注册成功。</p> -->
      <div class="examine_content">
        <img src="../../assets/img/examine_img.png" alt="" class="examine_img" v-if="assetLists.asset_status==5&& assetLists.asset_check_status==0 ||check_status==0 || assetLists.asset_status==0">
        <img src="../../assets/img/examine_img1.png" alt="" class="examine_img" v-else-if="assetLists.asset_check_status==2 || assetLists.asset_status==1">
        <p class="examine_tips">
          <template v-if="check_status==0 || assetLists.asset_status==0">
            <span >挂牌资料已经提交，请耐心等待审核</span>
          </template>
          <template v-else-if="assetLists.asset_check_status==0 && assetLists.payment_document=='' &&assetLists.asset_status==5 ||assetLists.asset_check_status==2" >
            <span v-if="assetLists.asset_check_status==0">
              挂牌资料审核已通过,您需要支付挂牌费用
              <span style="color:red">（{{assetLists.cartellino_money}}元）</span>
              ,请上传支付凭证
            </span>
            <span v-else-if="assetLists.asset_check_status==2 &&  assetLists.payment_document==''">挂牌费的支付凭证未通过审核，请查看原因重新提交</span>
            <span v-else>挂牌费的支付凭证已重新提交，请耐心等待审核</span>
            <el-upload
              class="upload-demo"
              :action="action"
              :show-file-list="false"
              list-type="picture"
              :on-change="fileChange"
              :on-success="(res)=>{handleAvatarSuccess(res)}"
              >
              <span class="examine_tips_span"  >{{assetLists.asset_check_status==0? '点击上传':'重新上传'}}</span>
            </el-upload>
          </template>
          <template v-else-if="assetLists.asset_check_status==0 && assetLists.payment_document!='' ">
            <span >挂牌费的支付凭证用已经提交，请耐心等待审核</span>
          </template>
          <template v-else-if="assetLists.asset_status==1 ">
            <span >资产审核不通过，请查看原因，重新提交</span>
          </template>
        </p>
        <div class="error_msg" v-if="assetLists.asset_check_status==2  || assetLists.asset_status==1 ">
          <p>失败原因：</p>
          <p >{{assetLists.message}}</p>
        </div>
      </div>
  </div>
</template>
<script>
import {assetList,uploadPayFile} from '../../api/index';
export default {
  data(){
    return{
      check_status:0,
      ruleForm:{},
      query:{
        id:'',
        payment_document:''
      },
      assetLists:{},
      host:'http://rccqapi.szcaee.cn',
      action:'http://rccqapi.szcaee.cn/api/Index/uploadimg',

    }
  },
  created(){
    if (this.$route.query.id) {
      this.query.id=this.$route.query.id
      this.assetList()
    }
    // this.getAccountInfo()
  },
  methods:{
    fileChange(file){
      const typeArr = ['image/png', 'image/gif', 'image/jpeg', 'image/jpg'];
      const isJPG = typeArr.indexOf(file.raw.type) !== -1;
      const isLt3M = file.size / 1024 / 1024 < 10;
      if (!isJPG) {
        this.$message.error('只能是图片!');
        this.$refs.upload.clearFiles();
        return;
      }
      if (!isLt3M) {
        this.$message.error('上传图片大小不能超过 10MB!');
        this.$refs.upload.clearFiles();
        return;
      }
    },
    handleAvatarSuccess(res) {
      console.info(res)
      if(res.code == 1){
        let url=this.host + res.data.img_url
        this.query.payment_document=url
        uploadPayFile(this.query).then(res=>{
          console.info(res)
          if (res.code==100) {
            this.$message.success('上传成功!');
            this.assetList()
          }else{
            this.$message.error(res.msg);
          }
        })
      }
    },
    assetList(){
      assetList(this.query).then(res => {
        console.info(res)
        if(res.code==100){
          this.assetLists=res.data.list[0];
          this.check_status=1
        }else{
          this.$message.error(res.msg)
        }
      })
    },
    checkStatus(){
      this.check_status=-1
    },
    submit(){
      console.info(this.ruleForm)

      this.$refs["ruleForm1"].validate((valid) => {
        if(valid){
          if(this.ruleForm.account_type==1){
            this.ruleForm.establish_time=this.ruleForm.establish_time/1000
          }
          openAccount(this.ruleForm).then(res => {
            console.info(res)
            if(res.code==101){
              this.$message.error(res.msg);
            }else{
              this.$message.success('上传资料成功！请等待审核~');
              this.disabled=true
              this.check_status=0
            }
            this.ruleForm.establish_time=this.ruleForm.establish_time*1000
          });
        }
      })
    },


  }
}
</script>
<style scoped>
  .body{
    margin-top: 20px;
  }
  .upload-demo{
    margin-top: 10px;
  }
  .error_msg{
    text-align: left;
    color: black;
    margin-top: 20px;
  }
  .error_msg p{
    margin-bottom: 10px;
  }
  .examine_tips_span{
    display: inline-block;
    color: #C94C4C;
    text-decoration: underline;
    margin-left: 10px;
    cursor: pointer;
  }
  .title{
    font-size: 18px;
    margin-bottom: 10px;
  }
  .title_info{
    font-size: 12px;
    color: #AAAAAA;
  }
  .table_right{
    padding-left: 50px;
  }
  .table_right_content{
    margin-top: 20px;
  }
  .table_right_item{
    width: 300px;
    display: flex;
    align-items: center;
    color: #333333;
    font-size: 14px;
    justify-content: space-between;
  }
  .table_right_item>span{
    cursor: pointer;
  }
  .table_right_item>span:hover{
    text-decoration: underline;
  }
  .table_right_item>i{
    cursor: pointer;
  }
  .subject{
    display: flex;
    font-size: 14px;
    display: flex;
    align-items: center;
    margin-top: 30px;
  }
  .subject >>>.el-radio, .el-radio__input{
    line-height: inherit;
    margin-left: 30px;
  }
  .table{
    display: flex;
    margin-top: 15px;
  }
  .table_left{
    width: 800px;
    border-right: 1px solid #EAB1B1;
  }
  .table_title{
    font-size: 14px;
    margin-bottom: 15px;
  }
  .table_content{
    padding-left: 30px;
    margin-bottom: 15px;
    padding-right: 50px;
  }
  .table_content_item{
    font-size: 14px;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 15px;
  }
  .table_content_item_upload{
    display: flex;
    align-items: center;
    color: #C94C4C;
  }
  .el-icon-success{
    font-size: 18px;
  }
  .upload-demo{
    margin-right: 20px;
  }
  .upload_span{
    color: #C94C4C;
    text-decoration: underline;
  }
  .ruleForm>>>.el-form-item__label{
    color: black;
  }
  .ruleForm>>>.el-input{
    width: 500px;
  }
  .footer{
    margin-top: 20px;
    text-align: center;
    font-size: 12px;
  }
  .submit{
    width: 340px;
    height: 40px;
    background: -moz-linear-gradient(top, #F8D89F 0%, #D98282 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#F8D89F), color-stop(100%,#D98282));
    background: -webkit-linear-gradient(top, #F8D89F 0%,#D98282 100%);
    background: -o-linear-gradient(top, #F8D89F 0%,#D98282 100%);
    background: -ms-linear-gradient(top, #F8D89F 0%,#D98282 100%);
    background: linear-gradient(to bottom, #F8D89F 0%,#D98282 100%);
    font-size: 14px;
    color: #FFFFFF;
    border: none;
    margin-bottom: 10px;
  }
  .footer_span{
    color: rgb(127, 127, 127);
  }
  .footer_span1{
    color: rgb(201, 76, 76);
    text-decoration: underline;
  }
  .examine_content{
    width: 100%;
    text-align: center;
    padding-top: 40px;
    color: #C3CBD6;
    font-size: 14px;
    height: 700px;
    box-sizing: border-box;
  }
  .table_content_item_span{
    color: red;
  }
</style>