소스 검색

个人注册部分页面

Administrator 7 년 전
부모
커밋
8ef5677773
2개의 변경된 파일84개의 추가작업 그리고 1개의 파일을 삭제
  1. 4 1
      assets/scss/mobileCommon.scss
  2. 80 0
      pages/mobile/registerPerson/index.vue

+ 4 - 1
assets/scss/mobileCommon.scss

@@ -1,5 +1,5 @@
 .mobile{
-  padding:0 30px;
+  padding:0 15px;
   height:100vh;
   background: #eaeaea;
   color:#333;
@@ -7,3 +7,6 @@
 .page-part{
   margin-bottom:.4rem;
 }
+.mint-cell-wrapper{
+  border:1px solid #b5b5b5;
+}

+ 80 - 0
pages/mobile/registerPerson/index.vue

@@ -0,0 +1,80 @@
+<template>
+<div class="person">
+  <header-mobile/>
+  <div class="f-main">
+    <p>个人注册</p>
+    <div class="f-form">
+      <div class="page-part">
+        <mt-field placeholder="会员名" v-model="vipName"></mt-field>
+      </div>
+      <div class="page-part">
+        <mt-field placeholder="密码" v-model="password"></mt-field>
+      </div>
+      <div class="page-part">
+        <mt-field placeholder="确认密码" v-model="password"></mt-field>
+      </div>
+      <div class="page-part">
+        <mt-field placeholder="手机号码" v-model="mobile"></mt-field>
+      </div>
+      <div class="page-part">
+        <mt-field placeholder="短信验证码" v-model="token">
+          <span class="token">获取验证码</span>
+        </mt-field>
+      </div>
+    </div>
+    <div class="form-btn">
+      <div class="page-part">
+        <el-checkbox v-model="checked">我已阅读并同意 <a href="#">《优软云服务条款》</a></el-checkbox>
+      </div>
+      <mt-button type="primary" size="large">完成注册</mt-button>
+    </div>
+  </div>
+  <div class="f-footer">
+    <p>已有账号? <a href="#">立即登录</a></p>
+  </div>
+</div>
+</template>
+
+<script>
+  import { HeaderMobile } from '~components/mobile'
+  export default {
+    name: 'registerPerson',
+    layout: 'mobile',
+    components: {
+      HeaderMobile
+    },
+    data () {
+      return {
+        vipName: '',
+        password: '',
+        mobile: '',
+        token: '',
+        checked: ''
+      }
+    }
+  }
+</script>
+
+<style scoped type="text/scss" lang="scss">
+.person{
+  .f-main{
+    background: #fff;
+    padding:0.55rem .3rem 1.1rem;
+    p{
+      font-size: .4rem;
+      color:#787878;
+      margin-bottom:.35rem;
+    }
+    .f-form{
+      border-top:1px solid #b5b5b5;
+      padding-top:.6rem;
+      .token{
+        display:inline-block;
+        padding: 0 .5rem;
+        text-align: center;
+        border-left:1px solid #b5b5b5;
+      }
+    }
+  }
+}
+</style>