完善登录，注册，修改密码页面

components/moblie/nav.vue

@@ -18,6 +18,7 @@
         v-for="(item, index) in navList"
         :class="{active:index === actived}"
         :flex-v="['column','flex-start','center']"
+        :key="item.label"
       >
         <span @click="toggle(index, item.id)">{{item.label}}</span>
         <yun-div :width-v="16" :height-v="4" :border-r="[2,2,0,0]" :margin-v="[16,0,0]" :bg-color-v="index === actived ? '#00AAE6' : '#fff'"></yun-div>

layouts/blank.vue

 <template>
+  <div class="default-layout__wrap">
     <nuxt/>
+  </div>
 </template>
 
 <script>
     export default {
-        name: "blank"
-    }
-</script>
+        name: "blank",
+        mounted() {
+          if(process.browser){
+            this.fontSelfAdaption()
+          }
+        },
+
+        methods:{
+          fontSelfAdaption(){
+            let  e = document,
+              that = this,
+              t = e.documentElement,
+              defaultWidth = 750;
 
-<style scoped>
+            let  eventName = "orientationchange" in window ? "orientationchange" : "resize",
+              functionName = function () {
+                let n = t.clientWidth;
+                n < 320 && (n = 320);
+                n > 750 && (n = 750);
+                t.style.fontSize = n / defaultWidth + "px";
+                that.$store.commit('page/changeRemRate',n/defaultWidth);
+              };
+            functionName();
+            window.addEventListener(eventName, functionName, !1);
+          }
+        },
+      }
+</script>
 
+<style lang="scss" scoped>
+  .default-layout__wrap{
+    background:$bgImage ;
+  }
 </style>

pages/users/login.vue

 <template>
-  <yun-div
-    :width-v="704"
-    :padding-v="[65,60,0,60]"
-    :margin-v="[0,'auto']"
-    :extend-style="{boxSizing: 'border-box'}"
-    :border-r="[8]"
-  >
+  <yun-div :extend-style="{position: 'fixed', top:0,bottom:0,left:0,right:0}" class="default-layout__wrap">
     <yun-div
-      :show-ske="false"
-      :margin-v="[0,0,56,0]"
-      :font-style="[32,43,500,'#999','center']"
-    >
-      <span :class="{actived: isPassword}" @click="handleLoginWayOne">密码登录</span>
-      <span :style="{margin: commonReturnFlexedLength(18)}">·</span>
-      <span :class="{actived: !isPassword}" @click="handleLoginWayTwo">短信登录</span>
+      :flex-v="['row','space-between','center']"
+      :margin-v="[26,paddingL]">
+      <!--logo-->
+      <yun-img
+        :height-v="36"
+        :width-v="153"
+        :ske-w="153"
+        :ske-h="36"
+        :src="Logo">
+      </yun-img>
+      <yun-div :font-style="[28,37,500,'#333','left']" @click.native="toRegister">注册</yun-div>
     </yun-div>
-    <yun-input
-      :key="inputKey"
-      :width-v="584"
-      :height-v="86"
+    <yun-div
+      :width-v="704"
+      :padding-v="[65,60,0,60]"
+      :margin-v="[0,'auto']"
+      :extend-style="{boxSizing: 'border-box'}"
       :border-r="[8]"
-      left-word="手机号："
-      v-model="account"
-      :validate="validate"
-    ></yun-input>
-    <yun-div :show-ske="false" v-if="isPassword">
-      <yun-input
-        key="loginPassword"
-        :width-v="584"
-        :height-v="86"
-        :border-r="[8,0,0,8]"
-        left-word="密码："
-        v-model="password"
-        :validate="validatePassword"
-        :input-type="inputType"
-      ></yun-input>
+      bg-color-v="#fff"
+    >
       <yun-div
-        :width-v="56"
-        :height-v="86"
-        :border-r="[8]"
-        :extend-style="{lineHeight:commonReturnFlexedLength(86),position: 'absolute',top: 0,right: 0}">
-        <yun-icon :name="iconName" :size="20" color="#999" @click.native="showPassword"></yun-icon>
+        :show-ske="false"
+        :margin-v="[0,0,56,0]"
+        :font-style="[32,43,500,'#999','center']"
+      >
+        <span :class="{actived: isPassword}" @click="handleLoginWayOne">密码登录</span>
+        <span :style="{margin: commonReturnFlexedLength(18)}">·</span>
+        <span :class="{actived: !isPassword}" @click="handleLoginWayTwo">短信登录</span>
       </yun-div>
-    </yun-div>
-    <yun-div :show-ske="false" v-else>
       <yun-input
-        key="loginVerificationCode"
+        :key="inputKey"
         :width-v="584"
         :height-v="86"
-        :border-r="[8,0,0,8]"
-        left-word="验证码："
-        v-model="VerificationCode"
-        :validate="validateCode"
-        :input-type="inputType"
+        :border-r="[8]"
+        left-word="手机号："
+        v-model="account"
+        :validate="validate"
       ></yun-input>
+      <yun-div :show-ske="false" v-if="isPassword">
+        <yun-input
+          key="loginPassword"
+          :width-v="584"
+          :height-v="86"
+          :border-r="[8,0,0,8]"
+          left-word="密码："
+          v-model="password"
+          :validate="validatePassword"
+          :input-type="inputType"
+        ></yun-input>
+        <yun-div
+          :width-v="56"
+          :height-v="86"
+          :border-r="[8]"
+          :extend-style="{lineHeight:commonReturnFlexedLength(86),position: 'absolute',top: 0,right: 0}">
+          <yun-icon :name="iconName" :size="20" color="#999" @click.native="showPassword"></yun-icon>
+        </yun-div>
+      </yun-div>
+      <yun-div :show-ske="false" v-else>
+        <yun-input
+          key="loginVerificationCode"
+          :width-v="584"
+          :height-v="86"
+          :border-r="[8,0,0,8]"
+          left-word="验证码："
+          v-model="VerificationCode"
+          :validate="validateCode"
+          :input-type="inputType"
+        ></yun-input>
+        <yun-div
+          :show-ske="false"
+          :height-v="86"
+          :margin-v="[0,30,0,0]"
+          :border-r="[8]"
+          :font-style="[26,35,500,'#75D098','left']"
+          :extend-style="{lineHeight:commonReturnFlexedLength(86),position: 'absolute',top: 0,right: 0}"
+          @click.native="sendSms"
+        >
+          {{timing}}
+        </yun-div>
+      </yun-div>
+      <yun-button :disabled="isClick" :size="[584,86]" :style="{backgroundColor:commonReturnPrimaryColor(opacity)}">登 录
+      </yun-button>
       <yun-div
         :show-ske="false"
-        :height-v="86"
-        :margin-v="[0,30,0,0]"
-        :border-r="[8]"
-        :font-style="[26,35,500,'#75D098','left']"
-        :extend-style="{lineHeight:commonReturnFlexedLength(86),position: 'absolute',top: 0,right: 0}"
-        @click.native="sendSms"
+        :margin-v="[25,0,0,0]"
+        :width-v="584"
+        :flex-v="['row','space-between','center']"
+        :font-style="[24,24,500,'#999','left']"
       >
-        {{timing}}
-      </yun-div>
-    </yun-div>
-    <yun-button :disabled="isClick" :size="[584,86]" :style="{backgroundColor:commonReturnPrimaryColor(opacity)}">登 录
-    </yun-button>
-    <yun-div
-      :show-ske="false"
-      :margin-v="[25,0,0,0]"
-      :width-v="584"
-      :flex-v="['row','space-between','center']"
-      :font-style="[24,24,500,'#999','left']"
-    >
-      <yun-div :flex-v="['row','space-between','center']">
-        <input id="automatic" type="checkbox" v-model="isSelect">
-        <label for="automatic"></label>
-        <yun-div :margin-v="[0,0,0,16]">下次自动登录</yun-div>
-      </yun-div>
-      <yun-div @click.native="toReset">忘记密码</yun-div>
-    </yun-div>
-    <yun-div :width-v="344" :flex-v="['row','space-between','center']" :margin-v="[69,120,72]">
-      <yun-div :width-v="80" :height-v="80" :flex-v="['row','center','center']" :border-r="['50%']"
-               bg-color-v="#F4F8FA">
-        <yun-img :ske-w="80" :ske-h="80" :width-v="40" :height-v="40" :src="QQ"></yun-img>
+        <yun-div :flex-v="['row','space-between','center']">
+          <input id="automatic" type="checkbox" v-model="isSelect">
+          <label for="automatic"></label>
+          <yun-div :margin-v="[0,0,0,16]">下次自动登录</yun-div>
+        </yun-div>
+        <yun-div @click.native="toReset">忘记密码</yun-div>
       </yun-div>
-      <yun-div :width-v="80" :height-v="80" :flex-v="['row','center','center']" :border-r="['50%']"
-               bg-color-v="#F4F8FA">
-        <yun-img :ske-w="80" :ske-h="80" :width-v="40" :height-v="40" :border-r="['50%']" :src="wechat"></yun-img>
-      </yun-div>
-      <yun-div :width-v="80" :height-v="80" :flex-v="['row','center','center']" :border-r="['50%']"
-               bg-color-v="#F4F8FA">
-        <yun-img :ske-w="80" :ske-h="80" :width-v="40" :height-v="40" :border-r="['50%']" :src="dingding"></yun-img>
+      <yun-div :width-v="344" :flex-v="['row','space-between','center']" :margin-v="[69,120,72]">
+        <yun-div :width-v="80" :height-v="80" :flex-v="['row','center','center']" :border-r="['50%']"
+                 bg-color-v="#F4F8FA">
+          <yun-img :ske-w="80" :ske-h="80" :width-v="40" :height-v="40" :src="QQ"></yun-img>
+        </yun-div>
+        <yun-div :width-v="80" :height-v="80" :flex-v="['row','center','center']" :border-r="['50%']"
+                 bg-color-v="#F4F8FA">
+          <yun-img :ske-w="80" :ske-h="80" :width-v="40" :height-v="40" :border-r="['50%']" :src="wechat"></yun-img>
+        </yun-div>
+        <yun-div :width-v="80" :height-v="80" :flex-v="['row','center','center']" :border-r="['50%']"
+                 bg-color-v="#F4F8FA">
+          <yun-img :ske-w="80" :ske-h="80" :width-v="40" :height-v="40" :border-r="['50%']" :src="dingding"></yun-img>
+        </yun-div>
       </yun-div>
     </yun-div>
+    <page-footer style="position: fixed;bottom:0;"></page-footer>
   </yun-div>
 </template>
 <script>
@@ -105,14 +122,19 @@ import commonMixin from "../../components/moblie/commonMixin";
 import QQ from '../../assets/svg/qq.svg'
 import wechat from '../../assets/svg/wechat.svg'
 import dingding from '../../assets/svg/dingding.svg'
+import Logo from '../../assets/svg/logo.svg'
+import PageFooter from "../../components/moblie/pageFooter";
 
 export default {
+  components: {PageFooter},
+  layout: 'blank',
   mixins: [commonMixin],
   data() {
     return {
       QQ,
       wechat,
       dingding,
+      Logo,
       account: '',
       password: '',
       VerificationCode: '',
@@ -158,6 +180,9 @@ export default {
     toReset() {
       this.$router.push('/users/reset')
     },
+    toRegister() {
+      this.$router.push('/users/register')
+    },
     showPassword() {
       this.inputType = this.inputType === 'password' ? 'text' : 'password'
       this.iconName = this.iconName === 'invisible' ? 'visible' : 'invisible'
@@ -227,4 +252,3 @@ export default {
     display: none;
   }
 </style>
-

pages/users/register.vue

 <template>
-  <yun-div
-    :width-v="704"
-    :padding-v="[65,60,0,60]"
-    :margin-v="[0,'auto']"
-    :extend-style="{boxSizing: 'border-box'}"
-    :border-r="[8]"
-  >
+  <yun-div :extend-style="{position: 'fixed', top:0,bottom:0,left:0,right:0}" class="default-layout__wrap">
     <yun-div
-      :show-ske="false"
-      :margin-v="[0,0,56,0]"
-      :font-style="[32,43,500,'#999','center']"
-    >
-      <span :class="{actived: isPhone}" @click="handleLoginWayOne">手机号注册</span>
-      <span :style="{margin: commonReturnFlexedLength(18)}">·</span>
-      <span :class="{actived: !isPhone}" @click="handleLoginWayTwo">邮箱号注册</span>
+      :flex-v="['row','space-between','center']"
+      :margin-v="[26,paddingL]">
+      <!--logo-->
+      <yun-img
+        :height-v="36"
+        :width-v="153"
+        :ske-w="153"
+        :ske-h="36"
+        :src="Logo">
+      </yun-img>
+      <yun-div :font-style="[28,37,500,'#333','left']" @click.native="toLogin">登录</yun-div>
     </yun-div>
-    <yun-input
-      v-if="isPhone"
-      key="registerPhone"
-      :width-v="584"
-      :height-v="86"
-      :border-r="[8]"
-      left-word="手机号："
-      v-model="account"
-      :validate="validate"
-    ></yun-input>
-    <yun-input
-      v-else
-      key="registerEmail"
-      :width-v="584"
-      :height-v="86"
+    <yun-div
+      :width-v="704"
+      :padding-v="[65,60,0,60]"
+      :margin-v="[0,'auto']"
+      :extend-style="{boxSizing: 'border-box'}"
       :border-r="[8]"
-      left-word="邮箱号："
-      v-model="account"
-      :validate="validateEmail"
-    ></yun-input>
-    <yun-div :show-ske="false">
+      bg-color-v="#fff"
+    >
+      <yun-div
+        :show-ske="false"
+        :margin-v="[0,0,56,0]"
+        :font-style="[32,43,500,'#999','center']"
+      >
+        <span :class="{actived: isPhone}" @click="handleLoginWayOne">手机号注册</span>
+        <span :style="{margin: commonReturnFlexedLength(18)}">·</span>
+        <span :class="{actived: !isPhone}" @click="handleLoginWayTwo">邮箱号注册</span>
+      </yun-div>
       <yun-input
-        :key="inputKey"
+        v-if="isPhone"
+        key="registerPhone"
         :width-v="584"
         :height-v="86"
-        :border-r="[8,0,0,8]"
-        left-word="密码："
-        v-model="password"
-        :validate="validatePassword"
-        :input-type="inputType"
-      ></yun-input>
-      <yun-div
-        :width-v="56"
-        :height-v="86"
         :border-r="[8]"
-        :extend-style="{lineHeight:commonReturnFlexedLength(86),position: 'absolute',top: 0,right: 0}">
-        <yun-icon :name="iconName" :size="20" color="#999" @click.native="showPassword"></yun-icon>
-      </yun-div>
-    </yun-div>
-    <yun-div :show-ske="false" v-if="isPhone">
+        left-word="手机号："
+        v-model="account"
+        :validate="validate"
+      ></yun-input>
       <yun-input
-        key="VerificationCode"
+        v-else
+        key="registerEmail"
         :width-v="584"
         :height-v="86"
-        :border-r="[8,0,0,8]"
-        left-word="验证码："
-        v-model="VerificationCode"
-        :validate="validateCode"
-        :input-type="inputType"
+        :border-r="[8]"
+        left-word="邮箱号："
+        v-model="account"
+        :validate="validateEmail"
       ></yun-input>
+      <yun-div :show-ske="false">
+        <yun-input
+          :key="inputKey"
+          :width-v="584"
+          :height-v="86"
+          :border-r="[8,0,0,8]"
+          left-word="密码："
+          v-model="password"
+          :validate="validatePassword"
+          :input-type="inputType"
+        ></yun-input>
+        <yun-div
+          :width-v="56"
+          :height-v="86"
+          :border-r="[8]"
+          :extend-style="{lineHeight:commonReturnFlexedLength(86),position: 'absolute',top: 0,right: 0}">
+          <yun-icon :name="iconName" :size="20" color="#999" @click.native="showPassword"></yun-icon>
+        </yun-div>
+      </yun-div>
+      <yun-div :show-ske="false" v-if="isPhone">
+        <yun-input
+          key="VerificationCode"
+          :width-v="584"
+          :height-v="86"
+          :border-r="[8,0,0,8]"
+          left-word="验证码："
+          v-model="VerificationCode"
+          :validate="validateCode"
+          :input-type="inputType"
+        ></yun-input>
+        <yun-div
+          :show-ske="false"
+          :height-v="86"
+          :margin-v="[0,30,0,0]"
+          :border-r="[8]"
+          :font-style="[26,35,500,'#75D098','left']"
+          :extend-style="{lineHeight:commonReturnFlexedLength(86),position: 'absolute',top: 0,right: 0}"
+          @click.native="sendSms"
+        >
+          {{timing}}
+        </yun-div>
+      </yun-div>
+      <yun-button :disabled="isClick" :size="[584,86]" :style="{backgroundColor:commonReturnPrimaryColor(opacity)}">
+        注 册
+      </yun-button>
       <yun-div
         :show-ske="false"
-        :height-v="86"
-        :margin-v="[0,30,0,0]"
-        :border-r="[8]"
-        :font-style="[26,35,500,'#75D098','left']"
-        :extend-style="{lineHeight:commonReturnFlexedLength(86),position: 'absolute',top: 0,right: 0}"
-        @click.native="sendSms"
+        :margin-v="[25,0,0,0]"
+        :width-v="584"
+        :flex-v="['row','space-between','center']"
+        :font-style="[24,24,500,'#999','left']"
       >
-        {{timing}}
+        <yun-div :flex-v="['row','space-between','center']">
+          <input id="automatic" type="checkbox" v-model="isSelect">
+          <label for="automatic"></label>
+          <yun-div :margin-v="[0,0,0,16]">我已阅读并同意<span style="color: #666666">用户协议</span>和<span style="color:#666666;">隐私政策</span></yun-div>
+        </yun-div>
+        <yun-div @click.native="toReset">忘记密码</yun-div>
       </yun-div>
-    </yun-div>
-    <yun-button :disabled="isClick" :size="[584,86]" :style="{backgroundColor:commonReturnPrimaryColor(opacity)}">
-      注 册
-    </yun-button>
-    <yun-div
-      :show-ske="false"
-      :margin-v="[25,0,0,0]"
-      :width-v="584"
-      :flex-v="['row','space-between','center']"
-      :font-style="[24,24,500,'#999','left']"
-    >
-      <yun-div :flex-v="['row','space-between','center']">
-        <input id="automatic" type="checkbox" v-model="isSelect">
-        <label for="automatic"></label>
-        <yun-div :margin-v="[0,0,0,16]">我已阅读并同意<span style="color: #666666">用户协议</span>和<span style="color:#666666;">隐私政策</span></yun-div>
-      </yun-div>
-      <yun-div @click.native="toReset">忘记密码</yun-div>
-    </yun-div>
-    <yun-div :width-v="344" :flex-v="['row','space-between','center']" :margin-v="[69,120,72]">
-      <yun-div :width-v="80" :height-v="80" :flex-v="['row','center','center']" :border-r="['50%']"
-               bg-color-v="#F4F8FA">
-        <yun-img :ske-w="80" :ske-h="80" :width-v="40" :height-v="40" :src="QQ"></yun-img>
-      </yun-div>
-      <yun-div :width-v="80" :height-v="80" :flex-v="['row','center','center']" :border-r="['50%']"
-               bg-color-v="#F4F8FA">
-        <yun-img :ske-w="80" :ske-h="80" :width-v="40" :height-v="40" :border-r="['50%']" :src="wechat"></yun-img>
-      </yun-div>
-      <yun-div :width-v="80" :height-v="80" :flex-v="['row','center','center']" :border-r="['50%']"
-               bg-color-v="#F4F8FA">
-        <yun-img :ske-w="80" :ske-h="80" :width-v="40" :height-v="40" :border-r="['50%']" :src="dingding"></yun-img>
+      <yun-div :width-v="344" :flex-v="['row','space-between','center']" :margin-v="[69,120,72]">
+        <yun-div :width-v="80" :height-v="80" :flex-v="['row','center','center']" :border-r="['50%']"
+                 bg-color-v="#F4F8FA">
+          <yun-img :ske-w="80" :ske-h="80" :width-v="40" :height-v="40" :src="QQ"></yun-img>
+        </yun-div>
+        <yun-div :width-v="80" :height-v="80" :flex-v="['row','center','center']" :border-r="['50%']"
+                 bg-color-v="#F4F8FA">
+          <yun-img :ske-w="80" :ske-h="80" :width-v="40" :height-v="40" :border-r="['50%']" :src="wechat"></yun-img>
+        </yun-div>
+        <yun-div :width-v="80" :height-v="80" :flex-v="['row','center','center']" :border-r="['50%']"
+                 bg-color-v="#F4F8FA">
+          <yun-img :ske-w="80" :ske-h="80" :width-v="40" :height-v="40" :border-r="['50%']" :src="dingding"></yun-img>
+        </yun-div>
       </yun-div>
     </yun-div>
+    <page-footer style="position: fixed;bottom:0;"></page-footer>
   </yun-div>
 </template>
 <script>
@@ -117,14 +134,19 @@ import commonMixin from "../../components/moblie/commonMixin";
 import QQ from '../../assets/svg/qq.svg'
 import wechat from '../../assets/svg/wechat.svg'
 import dingding from '../../assets/svg/dingding.svg'
+import PageFooter from "../../components/moblie/pageFooter";
+import Logo from "../../assets/svg/logo.svg";
 
 export default {
+  layout: 'blank',
   mixins: [commonMixin],
+  components: {PageFooter},
   data() {
     return {
       QQ,
       wechat,
       dingding,
+      Logo,
       account: '',
       password: '',
       VerificationCode: '',
@@ -186,6 +208,9 @@ export default {
     toReset() {
       this.$router.push('/users/reset')
     },
+    toLogin() {
+      this.$router.push('/users/login')
+    },
     showPassword() {
       this.inputType = this.inputType === 'password' ? 'text' : 'password'
       this.iconName = this.iconName === 'invisible' ? 'visible' : 'invisible'

pages/users/reset.vue

 <template>
-  <yun-div
-    :width-v="704"
-    :padding-v="[65,60,0,60]"
-    :margin-v="[0,'auto']"
-    :extend-style="{boxSizing: 'border-box'}"
-    :border-r="[8]"
-  >
+  <yun-div :extend-style="{position: 'fixed', top:0,bottom:0,left:0,right:0}" class="default-layout__wrap">
     <yun-div
-      :show-ske="false"
-      :margin-v="[0,0,56,0]"
-      :font-style="[32,43,500,'#999','center']"
-    >
-      <span class="actived">忘记密码</span>
+      :flex-v="['row','space-between','center']"
+      :margin-v="[26,paddingL]">
+      <!--logo-->
+      <yun-img
+        :height-v="36"
+        :width-v="153"
+        :ske-w="153"
+        :ske-h="36"
+        :src="Logo">
+      </yun-img>
+      <yun-div :font-style="[28,37,500,'#333','left']" @click.native="toRegister">注册</yun-div>
     </yun-div>
-    <yun-input
-      :width-v="584"
-      :height-v="86"
+    <yun-div
+      :width-v="704"
+      :padding-v="[65,60,0,60]"
+      :margin-v="[0,'auto']"
+      :extend-style="{boxSizing: 'border-box'}"
       :border-r="[8]"
-      left-word="手机号："
-      v-model="account"
-      :validate="validate"
-    ></yun-input>
-    <yun-div :show-ske="false">
-      <yun-input
-        :width-v="584"
-        :height-v="86"
-        :border-r="[8,0,0,8]"
-        left-word="新密码："
-        v-model="password"
-        :validate="validatePassword"
-        :input-type="inputType"
-      ></yun-input>
+      bg-color-v="#fff"
+    >
       <yun-div
-        :width-v="56"
-        :height-v="86"
-        :border-r="[8]"
-        :extend-style="{lineHeight:commonReturnFlexedLength(86),position: 'absolute',top: 0,right: 0}">
-        <yun-icon :name="iconName" :size="20" color="#999" @click.native="showPassword"></yun-icon>
+        :show-ske="false"
+        :margin-v="[0,0,56,0]"
+        :font-style="[32,43,500,'#999','center']"
+      >
+        <span class="actived">忘记密码</span>
       </yun-div>
-    </yun-div>
-    <yun-div :show-ske="false">
       <yun-input
         :width-v="584"
         :height-v="86"
-        :border-r="[8,0,0,8]"
-        left-word="验证码："
-        v-model="VerificationCode"
-        :validate="validateCode"
-        :input-type="inputType"
+        :border-r="[8]"
+        left-word="手机号："
+        v-model="account"
+        :validate="validate"
       ></yun-input>
+      <yun-div :show-ske="false">
+        <yun-input
+          :width-v="584"
+          :height-v="86"
+          :border-r="[8,0,0,8]"
+          left-word="新密码："
+          v-model="password"
+          :validate="validatePassword"
+          :input-type="inputType"
+        ></yun-input>
+        <yun-div
+          :width-v="56"
+          :height-v="86"
+          :border-r="[8]"
+          :extend-style="{lineHeight:commonReturnFlexedLength(86),position: 'absolute',top: 0,right: 0}">
+          <yun-icon :name="iconName" :size="20" color="#999" @click.native="showPassword"></yun-icon>
+        </yun-div>
+      </yun-div>
+      <yun-div :show-ske="false">
+        <yun-input
+          :width-v="584"
+          :height-v="86"
+          :border-r="[8,0,0,8]"
+          left-word="验证码："
+          v-model="VerificationCode"
+          :validate="validateCode"
+          :input-type="inputType"
+        ></yun-input>
+        <yun-div
+          :show-ske="false"
+          :height-v="86"
+          :margin-v="[0,30,0,0]"
+          :border-r="[8]"
+          :font-style="[26,35,500,'#75D098','left']"
+          :extend-style="{lineHeight:commonReturnFlexedLength(86),position: 'absolute',top: 0,right: 0}"
+          @click.native="sendSms"
+        >
+          {{timing}}
+        </yun-div>
+      </yun-div>
+      <yun-button :disabled="isClick" :size="[584,86]" :style="{backgroundColor:commonReturnPrimaryColor(opacity)}">
+        重置账号
+      </yun-button>
       <yun-div
         :show-ske="false"
-        :height-v="86"
-        :margin-v="[0,30,0,0]"
-        :border-r="[8]"
-        :font-style="[26,35,500,'#75D098','left']"
-        :extend-style="{lineHeight:commonReturnFlexedLength(86),position: 'absolute',top: 0,right: 0}"
-        @click.native="sendSms"
+        :margin-v="[25,0,0,0]"
+        :width-v="584"
+        :flex-v="['row','space-between','']"
+        :font-style="[24,24,500,'#999','left']"
       >
-        {{timing}}
-      </yun-div>
-    </yun-div>
-    <yun-button :disabled="isClick" :size="[584,86]" :style="{backgroundColor:commonReturnPrimaryColor(opacity)}">
-      重置账号
-    </yun-button>
-    <yun-div
-      :show-ske="false"
-      :margin-v="[25,0,0,0]"
-      :width-v="584"
-      :flex-v="['row','space-between','']"
-      :font-style="[24,24,500,'#999','left']"
-    >
-      <yun-div :flex-v="['row','space-between','']">
-        <input id="automatic" type="checkbox" v-model="isSelect">
-        <label for="automatic"></label>
-        <yun-div :margin-v="[0,0,0,16]">我已阅读并同意<span style="color: #666666">用户协议</span>和<span style="color:#666666;">隐私政策</span></yun-div>
-      </yun-div>
-      <yun-div>
-        <span @click="toLogin">登录</span>
-        <span>·</span>
-        <span @click="toRegister">注册</span>
-      </yun-div>
-    </yun-div>
-    <yun-div :width-v="344" :flex-v="['row','space-between','center']" :margin-v="[69,120,72]">
-      <yun-div :width-v="80" :height-v="80" :flex-v="['row','center','center']" :border-r="['50%']"
-               bg-color-v="#F4F8FA">
-        <yun-img :ske-w="80" :ske-h="80" :width-v="40" :height-v="40" :src="QQ"></yun-img>
-      </yun-div>
-      <yun-div :width-v="80" :height-v="80" :flex-v="['row','center','center']" :border-r="['50%']"
-               bg-color-v="#F4F8FA">
-        <yun-img :ske-w="80" :ske-h="80" :width-v="40" :height-v="40" :border-r="['50%']" :src="wechat"></yun-img>
+        <yun-div :flex-v="['row','space-between','']">
+          <input id="automatic" type="checkbox" v-model="isSelect">
+          <label for="automatic"></label>
+          <yun-div :margin-v="[0,0,0,16]">我已阅读并同意<span style="color: #666666">用户协议</span>和<span style="color:#666666;">隐私政策</span></yun-div>
+        </yun-div>
+        <yun-div>
+          <span @click="toLogin">登录</span>
+          <span>·</span>
+          <span @click="toRegister">注册</span>
+        </yun-div>
       </yun-div>
-      <yun-div :width-v="80" :height-v="80" :flex-v="['row','center','center']" :border-r="['50%']"
-               bg-color-v="#F4F8FA">
-        <yun-img :ske-w="80" :ske-h="80" :width-v="40" :height-v="40" :border-r="['50%']" :src="dingding"></yun-img>
+      <yun-div :width-v="344" :flex-v="['row','space-between','center']" :margin-v="[69,120,72]">
+        <yun-div :width-v="80" :height-v="80" :flex-v="['row','center','center']" :border-r="['50%']"
+                 bg-color-v="#F4F8FA">
+          <yun-img :ske-w="80" :ske-h="80" :width-v="40" :height-v="40" :src="QQ"></yun-img>
+        </yun-div>
+        <yun-div :width-v="80" :height-v="80" :flex-v="['row','center','center']" :border-r="['50%']"
+                 bg-color-v="#F4F8FA">
+          <yun-img :ske-w="80" :ske-h="80" :width-v="40" :height-v="40" :border-r="['50%']" :src="wechat"></yun-img>
+        </yun-div>
+        <yun-div :width-v="80" :height-v="80" :flex-v="['row','center','center']" :border-r="['50%']"
+                 bg-color-v="#F4F8FA">
+          <yun-img :ske-w="80" :ske-h="80" :width-v="40" :height-v="40" :border-r="['50%']" :src="dingding"></yun-img>
+        </yun-div>
       </yun-div>
     </yun-div>
+    <page-footer style="position: fixed;bottom:0;"></page-footer>
   </yun-div>
 </template>
 <script>
@@ -105,14 +122,19 @@ import commonMixin from "../../components/moblie/commonMixin";
 import QQ from '../../assets/svg/qq.svg'
 import wechat from '../../assets/svg/wechat.svg'
 import dingding from '../../assets/svg/dingding.svg'
+import Logo from "../../assets/svg/logo.svg";
+import PageFooter from "../../components/moblie/pageFooter";
 
 export default {
+  layout: 'blank',
   mixins: [commonMixin],
+  components: {PageFooter},
   data() {
     return {
       QQ,
       wechat,
       dingding,
+      Logo,
       account: '',
       password: '',
       VerificationCode: '',