email.vue 2.2 KB
<template>
  <div>
    <Top></Top>
    <div class="email_wrap">
      <div class="email_box layout align_center flex_diection justify_center">
        <div class="layout align_center flex_row justify_around">
          <div>
            <img :src="isEmail?src1:src2" alt />
          </div>
          <div class="email_tips">{{tips}}</div>
        </div>
        <div class="email_btn" @click="toIndex()">返回首页</div>
      </div>
    </div>
    <Bottom2></Bottom2>

    <!-- 邮箱验证 -->
  </div>
</template>
<script>
import Top from "../common/Top";
import Bottom2 from "../common/Bottom2";
import {post} from "@/api/http";
export default {
  data() {
    return {
      email:"",
      captcha:"",
      userId:"",
      tips:"",
      test:"",
      isEmail:true,
      src1:require("../../assets/img/emailR.png"),
      src2:require("../../assets/img/emailE.png")
    };
  },
  methods:{
    // 返回首页
    toIndex(){
      this.$router.push({path:'/Index',query:{test:this.test}})
    },
    changeemail(){
      let url = "/api/common/changeemail";
      let params = {
        email:this.email,
        captcha:this.captcha,
        user_id:this.userId,
      };
      post(url,params)
      .then(res=>{
        this.tips = "邮箱绑定成功";
      })
      .catch(err=>{
        this.isEmail = false;
        this.tips = err.msg;
      })
    },
  },
  components: {
    Top,
    Bottom2
  },
  mounted(){
    this.email = this.$route.query.email;
    this.captcha = this.$route.query.code;
    this.userId = this.$route.query.user;
    this.test = this.$route.query.test;
    this.changeemail()
  },
};
</script>
<style scoped>
.email_wrap {
  width: 100%;
  background-color: #f2f5fa;
  padding: 110px 0 180px;
}
.email_box {
  margin: 0 auto;
  width: 800px;
  height: 357px;
  background-image: url("../../assets/img/emailBg.png");
  background-repeat: no-repeat;
  background-size: cover;
  background-position: 0 0;
}
.email_tips {
  font-size: 26px;
  color: #34485e;
  margin-left: 50px;
}
.email_btn {
  width: 180px;
  height: 40px;
  background: #409eff;
  font-size: 14px;
  line-height: 40px;
  text-align: center;
  color: #fff;
  border-radius: 3px;
  margin-top:50px;
}
</style>