|
|
@@ -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>
|