移动验证邮箱页面

assets/scss/mobileCommon.scss

@@ -211,3 +211,41 @@
     margin-bottom:.4rem;
   }
 }
+
+//未验证手机弹框
+.valid-phone .el-dialog {
+  position: absolute;
+  width: 5rem;
+  height: 2rem;
+  margin: 0 auto;
+  left: 50%;
+  top: 50%;
+  margin-left: -2.5rem;
+  margin-top: -1rem !important;
+}
+.valid-phone .el-dialog .el-dialog__header {
+  display: none;
+}
+.valid-phone .el-dialog .el-dialog__body .set-tip{
+  margin: 0 auto;
+  text-align: center;
+  width: 100%;
+  height: 100%;
+}
+.valid-phone .el-dialog .el-dialog__body .set-tip p{
+  margin-bottom: .2rem;
+  margin-top: 0;
+  font-size: .24rem;
+  color: #000;
+}
+.valid-phone .el-dialog .el-dialog__body .set-tip a{
+  display: inline-block;
+  width: 1rem;
+  height: .5rem;
+  line-height: .5rem;
+  text-align: center;
+  font-size: .24rem;
+  color: #fff;
+  background: #00a0e9;
+  border-radius: 0.06rem;
+}

components/appeal/PasswordRestAppeal.vue

@@ -202,7 +202,6 @@
         if (value === '') {
           callback(new Error('请输入密码'))
           this.passwordChecked = false
-          console.log(this.passwordChecked)
         } else {
           if (this.passwordRest.password !== '') {
             if (value.length <= 20 && value.length >= 8) {
@@ -221,7 +220,6 @@
               this.passwordChecked = false
             }
             if (this.passwordRest.confirm) {
-              console.log(this.passwordRest.confirm)
               if (value !== this.passwordRest.confirm) {
                 this.showPasswordError = true
                 // callback(new Error('两次输入密码不一致!'))

components/mobile/reset/stepSecurity .vue

@@ -116,7 +116,6 @@
             .then(response => {
               this.$indicator.close()
               if (response.data.success) {
-                console.log(response.data, type)
                 this.$emit('stepEvent', type)
                 this.$emit('tokenEvent', response.data.content.token)
               } else {

components/mobile/validation/StepAppeal.vue

@@ -134,7 +134,6 @@
       },
       // 验证正确的验证码
       validateCode () {
-        console.log('tokenCode', this.tokenCode)
         if (!this.valid.token) {
           this.downToast('请先填写验证码')
           this.state.token = 'error'
@@ -184,7 +183,6 @@
               .then(response => {
                 this.$indicator.close()
                 if (response.data) {
-                  console.log('res', response.data)
                   this.tokenCode = response.data.content.token
                   this.$toast({
                     message: '验证码已经发送到您的手机，请注意查收',

components/mobile/validation/ValidationEmailStepEmail.vue

@@ -0,0 +1,72 @@
+<template>
+  <div class="f-main">
+    <div class="content-top">
+      <p>验证邮箱</p>
+      <a href="javascript:void(0)" class="back" @click="jump('select')"><i class="el-icon-back"></i></a>
+    </div>
+    <div class="f-form">
+      <div class="page-part">
+        <span>使用电子邮箱 <strong>{{info | hide}}</strong> 进行验证，有效期7天</span>
+      </div>
+      <div class="page-part">
+        <mt-button :disabled="hasSend" size="large"
+                   type="primary"
+                   @click="sureAccount()"
+                   v-text="secretEmail">发送验证请求</mt-button>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+  export default {
+    name: 'step-email',
+    props: ['info'],
+    data () {
+      return {
+        secretEmail: '发送验证请求',
+        hasSend: false
+      }
+    },
+    filters: {
+      hide: function (value) {
+        let getEmailIndex = value.indexOf('@')
+        if (getEmailIndex > 3) {
+          let len = value.substring(3, getEmailIndex)
+          value = value.replace(len, '***')
+        }
+        return value
+      }
+    },
+    methods: {
+      jump (type) {
+        this.$emit('stepEvent', type)
+      },
+      // 警告弹窗
+      downToast (type) {
+        this.$toast({
+          message: type,
+          iconClass: 'el-icon-warning'
+        })
+      },
+      // 发送邮件
+      sureAccount () {
+        this.$indicator.open('发送过程中...')
+        this.$http.get(`/update/user/check/email`, {params: {email: this.info, operate: 'email'}})
+          .then(response => {
+            this.$indicator.close()
+            if (response.data.success) {
+              this.hasSend = true
+              this.secretEmail = '已发送验证邮件，请查收'
+            } else {
+              this.hasSend = false
+              this.downToast(response.data.errMsg)
+            }
+          }).catch(() => {
+            this.$indicator.close()
+            this.downToast('请检查网络是否正常或联系服务商')
+          })
+      }
+    }
+  }
+</script>

components/mobile/validation/ValidationEmailStepMobile.vue

@@ -0,0 +1,148 @@
+<template>
+  <div class="f-main">
+    <div class="content-top">
+      <p>验证邮箱</p>
+      <a href="javascript:void(0)" class="back" @click="jump('select')"><i class="el-icon-back"></i></a>
+    </div>
+    <div class="f-form">
+      <div class="page-part">
+        <span>使用手机号<strong>{{info | hide}}</strong>接收验证码</span>
+      </div>
+      <div class="page-part">
+        <mt-field auto-complete="off"
+                  placeholder="短信验证码"
+                  v-model="code"
+                  :state="state.code"
+                  @blur.native.capture="validateCode">
+          <span class="token" @click="getCheckCode" v-text="tokenText">获取验证码</span>
+        </mt-field>
+      </div>
+      <div class="page-part">
+        <mt-button size="large" type="primary" @click="sureAccount">确 定</mt-button>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+  export default {
+    name: 'step-mobile',
+    props: ['info'],
+    data () {
+      return {
+        state: {
+          code: 'error'
+        },
+        code: '',
+        tokenCode: '',
+        tokenText: '获取验证码',
+        tokenTime: '60'
+      }
+    },
+    filters: {
+      hide: function (value) {
+        let reg = /^(\d{3})\d{6}(\d{2})$/
+        return value.replace(reg, '$1******$2')
+      }
+    },
+    methods: {
+      jump (type) {
+        this.$emit('stepEvent', type)
+      },
+      // 警告弹窗
+      downToast (type) {
+        this.$toast({
+          message: type,
+          iconClass: 'el-icon-warning'
+        })
+      },
+      // 验证码验证
+      validateCode () {
+        if (!this.code) {
+          this.downToast('请填写验证码信息')
+          this.state.code = 'error'
+        } else {
+          let param = new FormData()
+          param.append('mobile', this.info)
+          param.append('code', this.code)
+          param.append('token', this.tokenCode)
+          let config = {
+            headers: {'Content-Type': 'multipart/form-data'}
+          }
+          this.$http.post(`/update/user/checkCode/mobile`, param, config)
+            .then(response => {
+              if (response.data.success) {
+                this.state.code = 'success'
+              } else {
+                this.state.code = 'error'
+                return Promise.reject(response.data)
+              }
+            }).catch(err => {
+              this.downToast(err.errMsg)
+            })
+        }
+      },
+      // 获取验证码
+      getCheckCode () {
+        if (this.tokenTime > 0 && this.tokenTime < 60) {
+          this.downToast('请稍后再点击，我在倒计时')
+        } else {
+          this.$indicator.open('获取中...')
+          let _this = this
+          this.$http.get('/update/user/check/mobile', {params: {mobile: this.info}})
+            .then(response => {
+              this.$indicator.close()
+              if (response.data) {
+                this.tokenCode = response.data.content.token
+                this.$toast({
+                  message: '验证码已经发送到您的手机，请注意查收',
+                  iconClass: 'el-icon-success'
+                })
+                this.tokenText = '已发送(' + this.tokenTime + 'S)'
+                let setTime = setInterval(() => {
+                  _this.tokenTime--
+                  this.tokenText = '已发送(' + this.tokenTime + 'S)'
+                  if (this.tokenTime <= 0) {
+                    clearInterval(setTime)
+                    _this.tokenText = '获取验证码'
+                    _this.tokenTime = 60
+                  }
+                }, 1000)
+              }
+            }).catch(() => {
+              this.$indicator.close()
+              this.downToast('请检查网络是否正常或联系服务商')
+            })
+        }
+      },
+      // 验证信息
+      sureAccount () {
+        if (this.state.code !== 'success') {
+          this.downToast('请确认填写部分是否有误')
+        } else {
+          this.$indicator.open('验证过程中...')
+          let param = new FormData()
+          param.append('mobile', this.info)
+          param.append('code', this.code)
+          param.append('token', this.tokenCode)
+          let config = {
+            headers: {'Content-Type': 'multipart/form-data'}
+          }
+          this.$http.post('/update/user/check/mobile', param, config)
+            .then(response => {
+              this.$indicator.close()
+              if (response.data.success) {
+                this.$emit('stepEvent', 'new')
+                this.$emit('tokenEvent', response.data.content)
+              } else {
+                this.downToast(response.data.errMsg)
+              }
+            }).catch(() => {
+              this.$indicator.close()
+              this.downToast('请检查网络是否正常或联系服务商')
+            })
+        }
+      }
+    }
+  }
+</script>

components/mobile/validation/ValidationEmailStepNew.vue

@@ -0,0 +1,99 @@
+<template>
+  <div class="f-main">
+    <div class="content-top">
+      <p>验证邮箱</p>
+    </div>
+    <div class="f-form">
+      <div class="page-part">
+        <mt-field placeholder="新邮箱地址"
+                  v-model="valid.email"
+                  :state="state.email"
+                  @blur.native.capture="validateEmail"
+        ></mt-field>
+      </div>
+      <div class="page-part">
+        <mt-button :disabled="hasSend" size="large"
+                   type="primary"
+                   @click="sureAccount()"
+                   v-text="secretEmail">发送验证请求</mt-button>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+  export default {
+    name: 'step-one',
+    props: ['tokenId'],
+    data () {
+      return {
+        state: {
+          email: 'error'
+        },
+        valid: {
+          email: ''
+        },
+        secretEmail: '发送验证请求',
+        hasSend: false
+      }
+    },
+    methods: {
+      // 弹窗处理
+      downToast (type) {
+        this.$toast({
+          message: type,
+          iconClass: 'el-icon-warning'
+        })
+      },
+      // 验证邮箱号
+      validateEmail () {
+        let reg = /^([\w-])+(\.\w+)*@([\w-])+((\.\w{2,3}){1,3})$/
+        if (!this.valid.email) {
+          this.downToast('请先填写邮箱号')
+          this.state.email = 'error'
+        } else {
+          if (!reg.test(this.valid.email)) {
+            this.downToast('请填写正确的邮箱号')
+            this.state.email = 'warning'
+          } else {
+            this.$http.get(`/update/user/email/hasRegister`, {params: {email: this.valid.email}})
+              .then(response => {
+                if (response.data.content.hasRegister) {
+                  this.$toast({
+                    message: '该邮箱号已被注册',
+                    iconClass: 'el-icon-error'
+                  })
+                } else {
+                  this.state.email = 'success'
+                }
+              }).catch(() => {
+                this.$indicator.close()
+                this.downToast('请检查网络是否正常或联系服务商')
+              })
+          }
+        }
+      },
+      sureAccount () {
+        if (this.state.email !== 'success') {
+          this.downToast('请确认填写是否有误')
+        } else {
+          this.$indicator.open('发送过程中...')
+          this.$http.get(`/update/user/setEmail`, {params: {email: this.valid.email, token: this.tokenId ? this.tokenId : this.$route.query.token}})
+            .then(response => {
+              this.$indicator.close()
+              if (response.data.success) {
+                this.hasSend = true
+                this.secretEmail = '已发送验证邮件，请查收'
+              } else {
+                this.hasSend = false
+                this.downToast(response.data.errMsg)
+              }
+            }).catch(() => {
+              this.$indicator.close()
+              this.downToast('请检查网络是否正常或联系服务商')
+            })
+        }
+      }
+    }
+  }
+</script>

components/mobile/validation/ValidationEmailStepSecurity.vue

@@ -0,0 +1,132 @@
+<template>
+  <div class="f-main">
+    <div class="content-top">
+      <p>验证邮箱</p>
+      <a href="javascript:void(0)" class="back" @click="jump('select')"><i class="el-icon-back"></i></a>
+    </div>
+    <div class="f-form">
+      <div class="page-part">
+        <p class="security">密保问题一：<span v-text="questions[0].question"></span></p>
+      </div>
+      <div class="page-part">
+        <mt-field placeholder="请填写答案一"
+                  :state="state.answer1"
+                  @blur.native.capture="validAnswer1"
+                  v-model="valid.answer1"></mt-field>
+      </div>
+      <div class="page-part">
+        <p class="security">密保问题二：<span v-text="questions[1].question"></span></p>
+      </div>
+      <div class="page-part">
+        <mt-field placeholder="请填写答案二"
+                  :state="state.answer2"
+                  @blur.native.capture="validAnswer2"
+                  v-model="valid.answer2"></mt-field>
+      </div>
+
+      <div class="page-part">
+        <mt-button size="large" type="primary" @click="sureAccount('new')">下一步</mt-button>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+  export default {
+    name: 'step-security',
+    data () {
+      return {
+        state: {
+          answer1: 'error',
+          answer2: 'error'
+        },
+        valid: {
+          answer1: '',
+          answer2: ''
+        },
+        questions: '',
+        token: ''
+      }
+    },
+    mounted () {
+      this.$nextTick(() => {
+        this.loadIssue()
+      })
+    },
+    methods: {
+      jump (type) {
+        this.$emit('stepEvent', type)
+      },
+      // 警告弹窗
+      downToast (type) {
+        this.$toast({
+          message: type,
+          iconClass: 'el-icon-warning'
+        })
+      },
+      // 验证密保答案一
+      validAnswer1 () {
+        if (!this.valid.answer1) {
+          this.downToast('请填写问题一的正确答案')
+          this.state.answer1 = 'error'
+        } else {
+          this.state.answer1 = 'success'
+        }
+      },
+      // 验证密保答案二
+      validAnswer2 () {
+        if (!this.valid.answer2) {
+          this.downToast('请填写问题二的正确答案')
+          this.state.answer2 = 'error'
+        } else {
+          this.state.answer2 = 'success'
+        }
+      },
+      // 获取密保问题
+      loadIssue () {
+        this.$http.get('/update/user/check/question')
+          .then(response => {
+            if (response.data.success) {
+              this.questions = response.data.content.questions
+            } else {
+              this.downToast(response.data.errMsg)
+            }
+          })
+      },
+      sureAccount (type) {
+        if (this.state.answer1 !== 'success' || this.state.answer2 !== 'success') {
+          this.downToast('请确认填写部分是否有误')
+        } else {
+          this.$indicator.open('验证过程中...')
+          let param = new FormData()
+          let answer = []
+          answer.push({'answer': this.valid.answer1, sort: this.questions[0].sort}, {
+            'answer': this.valid.answer2, sort: this.questions[1].sort
+          })
+          let answers = JSON.stringify(answer)
+          param.append('answers', answers)
+          let config = {
+            headers: {'Content-Type': 'multipart/form-data'}
+          }
+          this.$http.post(`/update/user/check/question`, param, config)
+            .then(response => {
+              this.$indicator.close()
+              if (response.data.success) {
+                this.$emit('stepEvent', type)
+                this.$emit('tokenEvent', response.data.content.token)
+              } else {
+                this.downToast(response.data.errMsg)
+              }
+            }).catch(() => {
+              this.$indicator.close()
+              this.downToast('请检查网络是否正常或联系服务商')
+            })
+        }
+      }
+    }
+  }
+</script>
+
+<style scoped type="text/scss" lang="scss">
+
+</style>

components/mobile/validation/ValidationEmailStepSelect.vue

@@ -0,0 +1,126 @@
+<template>
+  <div class="f-main">
+    <div class="content-top">
+      <p>验证邮箱</p>
+    </div>
+    <div>
+      <ul class="select-item">
+        <li class="item" @click="jump('mobile')">
+          <img src="/images/all/icon01.png">
+          <span>通过验证手机</span>
+          <i class="fa fa-angle-right second"></i>
+        </li>
+        <li class="item" @click="jump('email')" v-if="hasEmail">
+          <img src="/images/all/icon02.png">
+          <span>通过验证邮箱</span>
+          <i class="fa fa-angle-right second"></i>
+        </li>
+        <li class="item" @click="jump('questions')" v-if="hasQuestion">
+          <img src="/images/all/icon03.png">
+          <span>通过验证密保</span>
+          <i class="fa fa-angle-right second"></i>
+        </li>
+        <li class="item" @click="jump('appeal')">
+          <img src="/images/all/icon04.png">
+          <i></i><span>通过人工申诉</span>
+          <i class="fa fa-angle-right second"></i>
+        </li>
+      </ul>
+    </div>
+    <!--未验证手机弹出框-->
+    <div v-show="goValidPhone">
+      <el-dialog class="valid-phone"
+                 :visible.sync="goValidPhone"
+                 @close="goValidPhoneStep"
+                 size="tiny">
+        <div class="set-tip">
+          <p>您的账号未验证手机，请先验证手机号</p>
+          <a href="/validation/phoneValidation">确定</a>
+        </div>
+      </el-dialog>
+    </div>
+  </div>
+</template>
+
+<script>
+  export default {
+    name: 'step-select',
+    data () {
+      return {
+        hasEmail: false,
+        hasQuestion: false,
+        goValidPhone: false,
+        mobile: '',
+        email: '',
+        questions: ''
+      }
+    },
+    mounted () {
+      this.$nextTick(() => {
+        this.getVerifyWay()
+      })
+    },
+    methods: {
+      jump (type) {
+        this.$emit('stepEvent', type)
+        if (type === 'mobile') {
+          this.$emit('setDataEvent', this.mobile)
+        } else if (type === 'email') {
+          this.$emit('setDataEvent', this.email)
+        }
+      },
+      // 获取验证方式
+      getVerifyWay () {
+        this.$http.get('/update/user/checkType')
+          .then(response => {
+            if (response.data.success) {
+              if (response.data.content.mobile) {
+                this.mobile = response.data.content.mobile
+              } else {
+                this.goValidPhone = true
+              }
+              if (response.data.content.email) {
+                this.hasEmail = true
+                this.email = response.data.content.email
+              }
+              if (response.data.content.questions) {
+                this.hasQuestion = true
+                this.questions = response.data.content.questions
+              }
+            }
+          }).catch(err => {
+            console.log(err)
+          })
+      },
+      goValidPhoneStep () {
+        this.$router.push({ path: '/validation/phoneValidation' })
+      }
+    }
+  }
+</script>
+
+<style scoped type="text/scss" lang="scss">
+  .select-item {
+    padding-top:.5rem;
+    .item {
+      position:relative;
+      padding-left:.4rem;
+      margin-bottom:.2rem;
+      line-height: 1.5rem;
+      background: #f4f4f4;
+      font-size: .32rem;
+      span{
+        color:#505050;
+        margin-left:.4rem;
+      }
+      i{
+        display:inline-block;
+        position:absolute;
+        right:.4rem;
+        line-height: 1.5rem;
+        font-size:.45rem;
+
+      }
+    }
+  }
+</style>

components/mobile/validation/ValidationEmailStepSuccess.vue

@@ -0,0 +1,40 @@
+<template>
+  <div class="f-main">
+    <template v-if="stepLast === 'last'">
+      <div class="content-top">
+        <p>验证邮箱</p>
+      </div>
+      <div class="page-part page-last">
+        <h4><img src="/images/all/pass.png"><span>重置成功</span></h4>
+        <p>及时更新电子邮箱能极大地提高账号安全性！</p>
+      </div>
+      <div class="page-part">
+        <mt-button size="large" type="primary" @click="sureAccount()">完 成</mt-button>
+      </div>
+    </template>
+    <template v-if="stepLast === 'appeal'">
+      <div class="content-top">
+        <p>账号验证</p>
+      </div>
+      <div class="page-part page-last">
+        <h4><img src="/images/all/pass.png"><span>申诉已提交</span></h4>
+        <p>申诉内容已提交，请耐心等待审核</p>
+      </div>
+      <div class="page-part">
+        <mt-button size="large" type="primary" @click="sureAccount()">确 认</mt-button>
+      </div>
+    </template>
+  </div>
+</template>
+
+<script>
+  export default {
+    name: 'step-success',
+    props: ['stepLast'],
+    methods: {
+      sureAccount () {
+        this.$router.push('/cloudcenter')
+      }
+    }
+  }
+</script>

components/mobile/validation/ValidationPhoneStepMobile.vue

@@ -116,7 +116,7 @@
         }
       },
       // 验证信息
-      sureAccount (type) {
+      sureAccount () {
         if (this.state.token !== 'success') {
           this.downToast('请确认填写部分是否有误')
         } else {

components/mobile/validation/index.js

@@ -5,5 +5,11 @@ import ValidationPhoneStepSecurity from './ValidationPhoneStepSecurity'
 import ValidationPhoneStepNew from './ValidationPhoneStepNew.vue'
 import ValidationPhoneStepSuccess from './ValidationPhoneStepSuccess.vue'
 import StepAppeal from './StepAppeal.vue'
+import ValidationEmailStepSelect from './ValidationEmailStepSelect.vue'
+import ValidationEmailStepMobile from './ValidationEmailStepMobile.vue'
+import ValidationEmailStepEmail from './ValidationEmailStepEmail.vue'
+import ValidationEmailStepSecurity from './ValidationEmailStepSecurity.vue'
+import ValidationEmailStepNew from './ValidationEmailStepNew.vue'
+import ValidationEmailStepSuccess from './ValidationEmailStepSuccess.vue'
 
-export {ValidationPhoneStepSelect, ValidationPhoneStepMobile, ValidationPhoneStepEmail, ValidationPhoneStepSecurity, ValidationPhoneStepNew, ValidationPhoneStepSuccess, StepAppeal}
+export {ValidationPhoneStepSelect, ValidationPhoneStepMobile, ValidationPhoneStepEmail, ValidationPhoneStepSecurity, ValidationPhoneStepNew, ValidationPhoneStepSuccess, StepAppeal, ValidationEmailStepSelect, ValidationEmailStepMobile, ValidationEmailStepEmail, ValidationEmailStepSecurity, ValidationEmailStepNew, ValidationEmailStepSuccess}

components/register/EnterpriseRegistration.vue

@@ -519,7 +519,6 @@
       },
       // 注册
       goRegister () {
-        console.log(this.queryLink)
         window.location.href = `/register/personalRegistration?${this.queryLink}`
       },
 //      我同意是否被选中

components/validation/PhoneValidationSecondStep.vue

@@ -168,7 +168,6 @@
 //      获取第二步手机验证码
       getSecondCheckCode () {
         this.isShowLoading = true
-        console.log(this.isShowLoading)
         this.$http.get(`/update/user/setMobile`, {params: {mobile: this.valid2.mobile, token: this.firstStepToken}})
           .then(response => {
             this.isShowLoading = false

pages/reset/forgetPasswordValidationAccount.vue

@@ -53,13 +53,16 @@
     mounted () {
       if (this.$route.query.token) {
         this.step = 'security'
-      } else if (this.$store.state.option.isLogin.logged) {
+      } else if (this.logged) {
         this.step = 'select'
       } else {
         this.step = 'first'
       }
     },
     computed: {
+      logged () {
+        return this.$store.state.option.isLogin.data.content
+      },
       isMobile () {
         return this.$store.state.option.isMobile
       }

pages/validation/emailValidation.vue

@@ -1,17 +1,88 @@
 <template>
   <div>
-    <accountCenter-header/>
-    <email-validation/>
+    <template v-if="isMobile">
+      <validationEmail-stepSelect v-if="step === 'select'" @stepEvent="setStep" @setDataEvent="setInfo"/>
+      <validationEmail-stepMobile v-if="step === 'mobile'" @stepEvent="setStep" @tokenEvent="loadToken" :info="info"/>
+      <validationEmail-stepEmail v-if="step === 'email'" @stepEvent="setStep" :info="info"/>
+      <validationEmail-stepSecurity v-if="step === 'questions'" @stepEvent="setStep" @tokenEvent="loadToken"/>
+      <validationEmail-stepNew v-if="step === 'new'" @stepEvent="setStep" @lastEvent="setStepLast" :tokenId="tokenId"/>
+      <validationEmail-stepSuccess v-if="step === 'last'" @stepEvent="setStep" :stepLast="stepLast"/>
+      <step-appeal v-if="step === 'appeal'" @stepEvent="setStep" @lastEvent="setStepLast"/>
+    </template>
+    <template v-else>
+      <accountCenter-header/>
+      <email-validation/>
+    </template>
   </div>
 </template>
 <script>
   import AccountCenterHeader from '~components/default/AccountCenterHeader.vue'
   import EmailValidation from '~components/validation/EmailValidation.vue'
+  import {ValidationEmailStepSelect, ValidationEmailStepMobile, ValidationEmailStepEmail, ValidationEmailStepSecurity, ValidationEmailStepNew, ValidationEmailStepSuccess, StepAppeal} from '~components/mobile/validation'
   export default {
-    layout: 'default',
+    layout (content) {
+      // console.log(content, 'content')
+      return content.store.state.option.isMobile ? 'mobile' : 'default'
+    },
+    middleware: 'authenticated',
+    transition: {
+      name: 'fade',
+      mode: 'out-in'
+    },
+    data () {
+      return {
+        step: 'select',
+        info: '',
+        tokenId: '',
+        stepLast: 'new'
+      }
+    },
     components: {
       AccountCenterHeader,
-      EmailValidation
+      EmailValidation,
+      ValidationEmailStepSelect,
+      ValidationEmailStepMobile,
+      ValidationEmailStepEmail,
+      ValidationEmailStepSecurity,
+      ValidationEmailStepNew,
+      ValidationEmailStepSuccess,
+      StepAppeal
+    },
+    mounted () {
+      console.log('111')
+      if (this.logged.isLogin) {
+        if (this.$route.query.token) {
+          this.step = 'last'
+        } else {
+          this.step = 'select'
+        }
+      } else {
+        if (this.$route.query.token) {
+          this.step = 'last'
+        } else {
+          this.$router.push('/')
+        }
+      }
+    },
+    computed: {
+      logged () {
+        // console.log(this.$store.state.option.isLogin.data.content.isLogin)
+        return this.$store.state.option.isLogin.data.content
+      },
+      isMobile () {
+        return this.$store.state.option.isMobile
+      }
+    },
+    methods: {
+      setStep (step) {
+        this.step = step
+      },
+      setInfo (info) {
+        this.info = info
+      },
+      loadToken (token) {
+        this.tokenId = token
+      }
     }
   }
 </script>

pages/validation/emailValidationThirdStep.vue

@@ -12,6 +12,11 @@
     components: {
       AccountCenterHeader,
       EmailValidationThirdStep
+    },
+    mounted () {
+      if (this.$store.state.option.isMobile) {
+        this.$router.push('/validation/emailValidation?token=' + this.$route.query.token)
+      }
     }
   }
 </script>

server.js

@@ -70,4 +70,4 @@ if (config.dev) {
 // Listen the server
 app.listen(port)
 // eslint-disable-line no-console
-console.log(`Nuxt.js SSR Server listening on ${host} : ${port}, at ${new Date().toLocaleString()} \nusing api ${config.env.baseUrl}`)
+// console.log(`Nuxt.js SSR Server listening on ${host} : ${port}, at ${new Date().toLocaleString()} \nusing api ${config.env.baseUrl}`)

store/index.js

@@ -15,7 +15,6 @@ export const actions = {
     // 保存链接?之后的所有键值对以字符串形式
     let fullPath = route.fullPath.slice(route.fullPath.lastIndexOf('?')) || ''
     store.commit('option/SET_FULLPATH', fullPath)
-    // console.log('111', route.fullPath.slice(route.fullPath.lastIndexOf('?')))
     if (route.query) {
       let appId = route.query.appId || ''
       let returnUrl = route.query.returnURL || ''