新增注册页

src/api/register/index.js

@@ -0,0 +1,31 @@
+import request from '@/utils/request'
+
+// 注册前校验
+export function registerCheck(memberName, idcard, mobile) {
+  const data = {
+    memberName,
+    idcard,
+    mobile
+  }
+  return request({
+    url: '/register/check',
+    method: 'post',
+    data: data
+  })
+}
+//注册
+export function registerOn(memberName, idcard, mobile, smsCode,uuid) {
+  const data = {
+    memberName,
+    idcard,
+    mobile,
+    smsCode,
+    uuid
+  }
+  return request({
+    url: '/register/on',
+    method: 'post',
+    data: data
+  })
+}
+

src/assets/css/base.scss

@@ -44,6 +44,7 @@ figcaption {
     }
 }
 
+* { touch-action: pan-y; }
 body {
     color: #323233;
 }

src/assets/images/icon/compriseWx.svg

@@ -1,21 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<svg width="31px" height="31px" viewBox="0 0 31 31" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
-    <!-- Generator: Sketch 63.1 (92452) - https://sketch.com -->
-    <title>企业微信</title>
-    <desc>Created with Sketch.</desc>
-    <g id="页面-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
-        <g id="其他登录hover/点击" transform="translate(-1718.000000, -768.000000)">
-            <g id="编组" transform="translate(1512.000000, 732.000000)">
-                <g id="编组-8复制-2" transform="translate(99.000000, 37.000000)">
-                    <g id="企业微信" transform="translate(108.000000, 0.000000)">
-                        <circle id="Oval-Copy-3备份-2" stroke="#B6C1D8" stroke-width="0.9" cx="14.5" cy="14.5" r="14.5"></circle>
-                        <g id="企业微信-(1)" transform="translate(5.000000, 6.000000)" fill="#B6C1D8" fill-rule="nonzero">
-                            <path d="M10.9293676,13.9529926 C10.2234853,14.1647574 9.49407353,14.2941691 8.75289706,14.3176985 C7.79995588,14.3647574 6.87054412,14.2706397 5.94113235,14.0471103 C5.79995588,14.0235809 5.62348529,14.0471103 5.48230882,14.0941691 C4.77642647,14.4353456 4.05877941,14.8000515 3.35289706,15.1412279 C3.08230882,15.2824044 2.83525,15.3059338 2.59995588,15.1176985 C2.37642647,14.9529926 2.35289706,14.7059338 2.37642647,14.4118162 C2.47054412,13.8235809 2.54113235,13.2353456 2.59995588,12.6471103 C2.59995588,12.5294632 2.52936765,12.3529926 2.43525,12.258875 C1.50583824,11.3294632 0.705838235,10.3059338 0.305838235,9.01181618 C-0.447102941,6.44711029 0.23525,4.24711029 2.09407353,2.41181618 C5.49407353,-0.917595588 11.43525,-0.764654412 14.6823088,2.68240441 C15.83525,3.90593382 16.4705441,5.35299265 16.4940735,7.03534559 C16.2117206,6.90593382 15.8940735,6.83534559 15.5646618,6.83534559 L15.5176029,6.83534559 C14.4117206,6.88240441 13.5176029,7.71769853 13.3881912,8.81181618 C13.3646618,9.01181618 13.3646618,9.21181618 13.3881912,9.40005147 C12.9764265,9.81181618 12.4705441,10.0706397 11.8470147,10.1765221 L11.83525,10.1765221 C10.8470147,10.3765221 10.1293676,11.2706397 10.1293676,12.2706397 C10.1293676,12.9412279 10.43525,13.5529926 10.9293676,13.9529926 Z" id="路径"></path>
-                            <path d="M15.5646618,7.89416912 C16.0823088,7.89416912 16.5646618,8.23534559 16.6705441,8.77652206 C16.8117206,9.58828676 17.1646618,10.2941691 17.7411324,10.8824044 C17.8117206,10.9529926 17.7646618,11.1529926 17.7881912,11.2706397 C17.6470147,11.2706397 17.4705441,11.3176985 17.3999559,11.2471103 C16.8117206,10.6353456 16.0823088,10.3176985 15.2705441,10.1412279 C14.7293676,10.0235809 14.3646618,9.48240441 14.43525,8.94122794 C14.5176029,8.35299265 14.9764265,7.91769853 15.5646618,7.89416912 L15.5646618,7.89416912 Z M19.9411324,12.2941691 C19.9411324,12.858875 19.5999559,13.3176985 19.03525,13.4235809 C18.2587794,13.5647574 17.5646618,13.9176985 17.0117206,14.4706397 C16.8940735,14.5882868 16.7176029,14.6941691 16.5999559,14.5176985 C16.5528971,14.4235809 16.5764265,14.2000515 16.6470147,14.1294632 C17.2117206,13.5412279 17.5528971,12.8824044 17.6940735,12.0706397 C17.8117206,11.4824044 18.3528971,11.0941691 18.9176029,11.1647574 C19.5058382,11.2353456 19.9411324,11.7059338 19.9411324,12.2941691 L19.9411324,12.2941691 Z M16.6940735,15.5412279 C16.6940735,16.1059338 16.2823088,16.5882868 15.7176029,16.6706397 C15.1764265,16.7412279 14.6117206,16.4000515 14.4940735,15.858875 C14.3293676,15.0235809 13.9764265,14.2941691 13.3646618,13.6824044 C13.2940735,13.6118162 13.3411324,13.458875 13.3176029,13.3412279 C13.43525,13.3412279 13.63525,13.2941691 13.6823088,13.3412279 C14.2940735,13.9529926 15.0470147,14.2941691 15.8823088,14.4941691 C16.3999559,14.5882868 16.6705441,15.058875 16.6940735,15.5412279 L16.6940735,15.5412279 Z M11.1881912,12.2706397 C11.1881912,11.7765221 11.5528971,11.3176985 12.0470147,11.2235809 C12.8587794,11.0824044 13.5646618,10.7294632 14.1528971,10.1529926 C14.2234853,10.0824044 14.3999559,10.1059338 14.5176029,10.1059338 C14.4940735,10.2235809 14.5411324,10.4000515 14.4705441,10.4706397 C13.8823088,11.058875 13.5646618,11.7647574 13.3999559,12.5765221 C13.2823088,13.1647574 12.7411324,13.5059338 12.1764265,13.4118162 C11.6117206,13.3176985 11.1881912,12.8235809 11.1881912,12.2706397 L11.1881912,12.2706397 Z" id="形状"></path>
-                        </g>
-                    </g>
-                </g>
-            </g>
-        </g>
-    </g>
-</svg>

src/assets/images/icon/qq.svg

@@ -1,18 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<svg width="31px" height="31px" viewBox="0 0 31 31" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
-    <!-- Generator: Sketch 63.1 (92452) - https://sketch.com -->
-    <title>qq</title>
-    <desc>Created with Sketch.</desc>
-    <g id="页面-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
-        <g id="其他登录hover/点击" transform="translate(-1610.000000, -768.000000)">
-            <g id="编组" transform="translate(1512.000000, 732.000000)">
-                <g id="编组-8复制-2" transform="translate(99.000000, 37.000000)">
-                    <g id="qq">
-                        <path d="M14.4,9.05941988e-14 C6.44684796,9.05941988e-14 -3.48165941e-13,6.44725001 -3.48165941e-13,14.4 C-3.48165941e-13,22.35275 6.44688104,28.8 14.4,28.8 C22.353119,28.8 28.8,22.35275 28.8,14.4 C28.8,6.44725001 22.3531521,9.05941988e-14 14.4,9.05941988e-14 Z" id="Path-Copy-3" stroke="#B6C1D8" stroke-width="0.9"></path>
-                        <path d="M22.0591135,19.187179 C21.4889537,19.6760278 20.7484897,17.5776468 20.6421033,17.9003707 C20.3827135,18.6855465 20.2610851,19.2103185 19.4971435,20.0651279 C19.4563344,20.1107924 20.3804394,20.4447018 20.6421033,21.1574783 C20.8926122,21.8404778 21.3803241,22.9225952 18.1892853,23.2621589 C16.3167988,23.4613184 14.9637679,22.2643947 14.828895,22.2760412 C14.5790314,22.2980745 14.6902731,22.2760412 14.4216643,22.2760412 C14.2019159,22.2760412 14.18735,22.2920822 13.9805695,22.2760412 C13.9235658,22.2718313 13.3012884,23.2621589 10.5181564,23.2621589 C8.36086644,23.2621589 7.80253762,21.9042727 8.23619584,21.1574783 C8.67031502,20.4108376 9.39409282,20.1933939 9.29194712,20.0750229 C8.78963861,19.4929092 8.44294558,18.8702938 8.23619584,18.3077857 C8.18500007,18.1677195 8.14210134,18.0313716 8.1082679,17.9003707 C8.02987633,17.5999874 7.42914042,19.6640432 6.7843688,19.187179 C6.13959718,18.7104683 6.19709255,17.4971656 6.61452547,16.3358576 C7.03570742,15.1651463 8.09646768,14.0380098 8.10829861,13.7891296 C8.15070567,12.8632422 8.01693906,12.7094091 8.10829861,12.4662139 C8.31179102,11.9214983 8.55953425,12.1303684 8.55953428,11.8476547 C8.55953428,8.28678345 11.2058575,5.4 14.4700637,5.4 C17.7341163,5.4 20.3804702,8.28678345 20.3804702,11.8476547 C20.3804702,11.9843406 20.7350915,11.8476547 20.9049348,12.4662139 C20.9399053,12.5939574 20.9640281,13.0870163 20.9225737,13.7891296 C20.9028145,14.1264193 21.8216033,14.5368766 22.2965008,16.3358576 C22.7720744,18.1349923 22.2965008,18.9834714 22.0591135,19.187179 L22.0591135,19.187179 Z" id="QQ" fill="#B6C1D8" fill-rule="nonzero"></path>
-                    </g>
-                </g>
-            </g>
-        </g>
-    </g>
-</svg>

src/assets/images/icon/rlsb.svg

@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1616304878947" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1076" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><defs><style type="text/css"></style></defs><path d="M94.31466667 260.21333333c-11.78666667 0-21.33333333-9.54666667-21.33333334-21.33333333v-76.288c0-49.408 40.20266667-89.61066667 89.61066667-89.61066667h76.39466667c11.78666667 0 21.33333333 9.54666667 21.33333333 21.33333334s-9.54666667 21.33333333-21.33333333 21.33333333h-76.39466667c-25.888 0-46.944 21.056-46.944 46.944v76.288c0 11.78666667-9.55733333 21.33333333-21.33333333 21.33333333zM238.98666667 953.16266667h-76.39466667c-49.408 0-89.61066667-40.20266667-89.61066667-89.61066667v-76.288c0-11.78666667 9.54666667-21.33333333 21.33333334-21.33333333s21.33333333 9.54666667 21.33333333 21.33333333v76.288c0 25.888 21.056 46.944 46.944 46.944h76.39466667c11.78666667 0 21.33333333 9.54666667 21.33333333 21.33333333s-9.54666667 21.33333333-21.33333333 21.33333334z" p-id="1077" fill="#b6c1d8"></path><path d="M932.256 260.21333333c-11.78666667 0-21.33333333-9.54666667-21.33333333-21.33333333v-76.288c0-25.888-21.056-46.944-46.944-46.944h-76.39466667c-11.78666667 0-21.33333333-9.54666667-21.33333333-21.33333333s9.54666667-21.33333333 21.33333333-21.33333334h76.39466667c49.41866667 0 89.61066667 40.20266667 89.61066666 89.61066667v76.288c0 11.78666667-9.54666667 21.33333333-21.33333333 21.33333333zM863.97866667 953.16266667h-76.39466667c-11.78666667 0-21.33333333-9.54666667-21.33333333-21.33333334s9.54666667-21.33333333 21.33333333-21.33333333h76.39466667c25.888 0 46.944-21.056 46.944-46.944v-76.288c0-11.78666667 9.54666667-21.33333333 21.33333333-21.33333333s21.33333333 9.54666667 21.33333333 21.33333333v76.288c0 49.408-40.192 89.61066667-89.61066666 89.61066667z" p-id="1078" fill="#b6c1d8"></path><path d="M580.384 578.90133333v-25.74933333c54.34666667-31.02933333 91.968-98.06933333 91.968-175.78666667 0-107.24266667-71.63733333-194.176-160-194.176s-160 86.93333333-160 194.176c0 77.472 37.39733333 144.34133333 91.46666667 175.49866667v27.04c-111.072 24.08533333-193.67466667 102.64533333-193.67466667 188.88533333h524.72533333c0-87.47733333-81.952-167.05066667-194.48533333-189.888z" p-id="1079" fill="#b6c1d8"></path></svg>

src/router/index.js

@@ -23,7 +23,6 @@ export const constantRoutes = [
     name: 'index',
     meta: {
       title: '主页',
-      index: 1,
       keepAlive: true
     },
     component: (resolve) => require(['@/views/index'], resolve)
@@ -37,12 +36,20 @@ export const constantRoutes = [
     },
     component: (resolve) => require(['@/views/login'], resolve)
   },
+  {
+    path: '/register',
+    name: 'register',
+    meta: {
+      title: '注册页',
+      hidden: true,
+    },
+    component: (resolve) => require(['@/views/register'], resolve)
+  },
   {
     path: '/document',
     name: 'document',
     meta: {
       title: '文档',
-      index: 2
     },
     component: (resolve) => require(['@/views/document'], resolve)
   },
@@ -50,8 +57,7 @@ export const constantRoutes = [
     path: '/workbench',
     name: 'workbench',
     meta: {
-      title: '工作台',
-      index: 3
+      title: '工作台'
     },
     component: (resolve) => require(['@/views/workbench'], resolve)
   },
@@ -59,8 +65,7 @@ export const constantRoutes = [
     path: '/addressBook',
     name: 'addressBook',
     meta: {
-      title: '通讯录',
-      index: 4
+      title: '通讯录'
     },
     component: (resolve) => require(['@/views/addressBook'], resolve)
   },
@@ -68,8 +73,7 @@ export const constantRoutes = [
     path: '/mynsgk',
     name: 'mynsgk',
     meta: {
-      title: '我的',
-      index: 5
+      title: '我的'
     },
     component: (resolve) => require(['@/views/mynsgk'], resolve)
   }

src/utils/request.js

@@ -74,10 +74,11 @@ service.interceptors.response.use(res => {
         })
       })
   } else if (code === 500) {
-    Notify({ type: 'warning', message: msg });
+    Dialog.alert({ type: 'warning', message: msg });
+    
     return Promise.reject(new Error(msg))
   } else if (code !== 200) {
-    Notify({ type: 'warning', message: msg });
+    Dialog.alert({ type: 'warning', message: msg });
     return Promise.reject('error')
   } else {
     return res.data
@@ -101,7 +102,7 @@ service.interceptors.response.use(res => {
     //   type: 'error',
     //   duration: 5 * 1000
     // })
-    Notify({ type: 'warning', message: message });
+    Dialog.alert({ type: 'warning', message: message });
     return Promise.reject(error)
   }
 )

src/views/addressBook/index.vue

@@ -52,7 +52,6 @@ export default {
     getList(){
       this.loading = true;
       ListPhones(this.queryParams).then(response => {
-        console.log(response)
         response.rows.forEach(element => {
           this.phonesList.push(element);
         })

src/views/login.vue

@@ -1,96 +1,97 @@
 <template>
-  <div class="login_page">
+  <div class="app-container">
     <div class="focus-logo">
       <img src="@/assets/images/login-logo.png" />
+      <p class="describe">登录页</p>
     </div>
 
-    <ul class="head_nav clear">
-      <li @click="isSmsLogin = false" :class="{ active: !isSmsLogin }">
-        账号登录
-      </li>
-      <li @click="isSmsLogin = true" :class="{ active: isSmsLogin }">
-        验证码登录
-      </li>
-    </ul>
+    <div class="login-main">
+      <ul class="head_nav clear">
+        <li @click="isSmsLogin = false" :class="{ active: !isSmsLogin }">
+          账号登录
+        </li>
+        <li @click="isSmsLogin = true" :class="{ active: isSmsLogin }">
+          验证码登录
+        </li>
+      </ul>
 
-    <div class="form_main">
-      <van-form @submit="handleLogin">
-        <van-field
-          v-model="formData.username"
-          name="username"
-          label="用户名"
-          placeholder="用户名"
-          v-if="!isSmsLogin"
-        />
-        <van-field
-          v-model="formData.password"
-          type="password"
-          name="password"
-          label="密码"
-          placeholder="密码"
-          v-if="!isSmsLogin"
-        />
-        <van-field
-          v-model="formData.code"
-          center
-          clearable
-          label="验证码"
-          placeholder="请输入图形验证码"
-          v-if="!isSmsLogin"
-        >
-          <template #button>
-            <img class="code-img" :src="codeUrl" @click="getCode" />
-          </template>
-        </van-field>
-        <van-field
-          v-model="formData.mobile"
-          v-if="isSmsLogin"
-          label="手机号"
-          placeholder="请输入手机号码"
-        />
-        <van-field
-          v-model="formData.smsCode"
-          center
-          clearable
-          label="短信验证码"
-          placeholder="请输入短信验证码"
-          v-if="isSmsLogin"
-        >
-          <template #button>
+      <div class="form_main">
+        <van-form @submit="handleLogin">
+          <div v-show="!isSmsLogin">
+            <van-field
+              v-model="formData.username"
+              name="username"
+              label="用户名"
+              placeholder="用户名"
+            />
+            <van-field
+              v-model="formData.password"
+              type="password"
+              name="password"
+              label="密码"
+              placeholder="密码"
+            />
+            <van-field
+              v-model="formData.code"
+              center
+              clearable
+              label="验证码"
+              placeholder="图形验证码"
+            
+            >
+              <template #button>
+                <img class="code-img" :src="codeUrl" @click="getCode" />
+              </template>
+            </van-field>
+          </div>
+          <div v-show="isSmsLogin">
+            <van-field
+              v-model="formData.mobile"
+              label="手机号"
+              placeholder="请输入手机号码"
+            />
+            <van-field
+              v-model="formData.smsCode"
+              center
+              clearable
+              label="短信验证码"
+              placeholder="请输入短信验证码"
+            >
+              <template #button>
+                <van-button
+                  size="small"
+                  type="primary"
+                  @click.native.prevent="getSmsCode"
+                  >{{
+                    computeTime > 0 ? `(${computeTime}s)已发送` : "获取验证码"
+                  }}</van-button
+                >
+              </template>
+            </van-field>
+          </div>
+          <div class="form-submit">
             <van-button
-              size="small"
-              type="primary"
-              @click.native.prevent="getSmsCode"
-              >{{
-                computeTime > 0 ? `(${computeTime}s)已发送` : "获取验证码"
-              }}</van-button
+              round
+              block
+              type="info"
+              native-type="submit"
+              :loading="loading"
+              >登录</van-button
             >
-          </template>
-        </van-field>
-
-        <div class="form-submit">
-          <van-button
-            round
-            block
-            type="info"
-            native-type="submit"
-            :loading="loading"
-            >登录</van-button
-          >
-        </div>
-      </van-form>
+          </div>
+        </van-form>
+      </div>
     </div>
 
     <div class="reveal-modal-con">
       <div class="dd_txt">
-        <router-link to="/">忘记密码</router-link>
+        <router-link to="/register">注册账户</router-link>
       </div>
       <div class="other-login">
         <p class="desc">—— 更多登录方式 ——</p>
         <p class="icon-other-logins">
-          <router-link class="qq" to="/"></router-link>
           <router-link class="wx" to="/"></router-link>
-          <router-link class="qywx" to="/"></router-link>
+          <router-link class="rlsb" to="/"></router-link>
         </p>
       </div>
     </div>
@@ -109,6 +110,8 @@ export default {
       formData: {
         username: "admin", //账号
         password: "admin123", //密码
+        // username:'',
+        // password:'',
         code: null, //图片验证码
         uuid: null, //识别uuid
         mobile: null, //手机号
@@ -131,7 +134,6 @@ export default {
     //     signature: res.signature,// 必填，签名，见附录1
     //     jsApiList: ['scanQRCode'] // 必填，需要使用的JS接口列表，所有JS接口列表见附录2
     //   });
-
     //分享要用encodeURIComponent()方法
   },
   methods: {
@@ -145,12 +147,16 @@ export default {
       if (!this.computeTime) {
         let myreg = /^[1][3,4,5,7,8,9][0-9]{9}$/;
         if (!myreg.test(this.formData.mobile)) {
-          this.$notify({ type: "warning", message: "手机号格式不正确" });
+          this.$dialog.alert({
+            message: '手机号格式不正确',
+          });
           return false;
         }
         getSmsCode(this.formData.mobile).then((res) => {
           if (res.code === 200) {
-            this.$notify({ type: "success", message: "验证码已发送" });
+             this.$dialog.alert({
+              message: '验证码已发送',
+            });
             this.loginForm.uuid = res.uuid;
             this.computeTime = 60;
             this.timer = setInterval(() => {
@@ -168,10 +174,14 @@ export default {
         //短信登录
         let myreg = /^[1][3,4,5,7,8,9][0-9]{9}$/;
         if (!myreg.test(this.formData.mobile)) {
-          this.$notify({ type: "warning", message: "手机号格式不正确" });
+          this.$dialog.alert({
+              message: '手机号格式不正确',
+            });
           return false;
         } else if (this.formData.smsCode == "") {
-          this.$notify({ type: "warning", message: "短信验证码不能为空" });
+          this.$dialog.alert({
+              message: '短信验证码不能为空',
+            });
           return false;
         }
         this.loading = true;
@@ -186,13 +196,19 @@ export default {
       } else {
         //账号密码登录
         if (this.formData.username == "") {
-          this.$notify({ type: "warning", message: "账号不能为空" });
+          this.$dialog.alert({
+              message: '账号不能为空',
+          });
           return false;
         } else if (this.formData.password == "") {
-          this.$notify({ type: "warning", message: "密码不能为空" });
+          this.$dialog.alert({
+              message: '密码不能为空',
+          });
           return false;
         } else if (this.formData.code == "") {
-          this.$notify({ type: "warning", message: "图片验证码不能为空" });
+          this.$dialog.alert({
+              message: '图片验证码不能为空',
+          });
           return false;
         }
         this.$store
@@ -212,7 +228,7 @@ export default {
 
 <!-- Add "scoped" attribute to limit CSS to this component only -->
 <style scoped lang="scss">
-.login_page {
+.app-container {
   .focus-logo {
     width: 310px;
     margin: 0 auto 40px;
@@ -220,8 +236,23 @@ export default {
     img {
       width: 100%;
     }
+    .describe{
+      text-align: center;
+      font-size: 34px;
+      padding:10px 0 0;
+      color: #666;
+    }
   }
 
+  .login-main{
+    width: 95%;
+    margin: 0 auto;
+    background: #fff;
+    border-radius: 20px;
+    overflow: hidden;
+    border: 1px solid #ddd;
+    padding-bottom:40px;
+  }
   .head_nav {
     li {
       width: 50%;
@@ -230,7 +261,6 @@ export default {
       line-height: 90px;
       text-align: center;
       font-size: 30px;
-
       border-bottom: 2px solid #ddd;
       &.active {
         background: #fff;
@@ -242,9 +272,9 @@ export default {
       }
     }
     background: #f5f5f5;
-    border-top: 1px solid #ddd;
   }
   .form_main {
+    padding-top: 20px;
     .form-submit {
       margin: 40px 40px 0;
     }
@@ -276,21 +306,18 @@ export default {
       .icon-other-logins {
         margin-top: 26px;
         a {
-          &.qq {
-            background-image: url("~@/assets/images/icon/qq.svg");
-          }
           &.wx {
             background-image: url("~@/assets/images/icon/wx.svg");
           }
-          &.qywx {
-            background-image: url("~@/assets/images/icon/compriseWx.svg");
+          &.rlsb {
+            background-image: url("~@/assets/images/icon/rlsb.svg");
           }
           position: relative;
           display: inline-block;
           margin: 0 12px;
           width: 60px;
           height: 60px;
-          border-radius: 50%;
+          // border-radius: 50%;
           text-indent: -9999px;
           background-size: 100% 100%;
           background-repeat: no-repeat;

src/views/register.vue

@@ -0,0 +1,191 @@
+<template>
+    <div class="app-container">
+        <div class="focus-logo">
+            <img src="@/assets/images/login-logo.png" />
+            <p class="describe">注册页</p>
+        </div>
+         <div class="login-main">
+             <van-form @submit="handleRegister">
+                 <van-field
+                    v-model="formData.memberName"
+                    name="memberName"
+                    label="真实姓名"
+                    placeholder="真实姓名"
+                />
+                <van-field
+                    v-model="formData.idcard"
+                    name="idcard"
+                    label="身份证号"
+                    placeholder="身份证号"
+                />
+                <van-field
+                    v-model="formData.mobile"
+                    name="mobile"
+                    label="手机号"
+                    placeholder="手机号"
+                />
+                <van-field
+                    v-model="formData.smsCode"
+                    center
+                    clearable
+                    label="短信验证码"
+                    placeholder="请输入短信验证码"
+                    >
+                    <template #button>
+                        <van-button
+                        size="small"
+                        type="primary"
+                        @click.native.prevent="getSmsCode"
+                        >{{
+                            computeTime > 0 ? `(${computeTime}s)已发送` : "获取验证码"
+                        }}</van-button
+                        >
+                    </template>
+                </van-field>
+                <div class="form-submit">
+                    <van-button
+                    round
+                    block
+                    type="info"
+                    native-type="submit"
+                    :loading="loading"
+                    >立即注册</van-button
+                    >
+                </div>
+             </van-form>
+         </div>
+
+          <div class="reveal-modal-con">
+            <div class="dd_txt">
+                <router-link to="/login">跳转登录页</router-link>
+            </div>
+
+          </div>
+
+    </div>
+</template>
+
+<script>
+import { registerCheck,registerOn } from "@/api/register";
+export default {
+    name: "register",
+    data() {
+        return {
+            formData: {
+                memberName: '张月旺', //姓名
+                idcard: '14022619700803051X', //身份证号码
+                // uuid: null, //识别uuid
+                mobile: '15254587248', //手机号
+                // smsCode: null, //短信验证码
+            },
+            loading: false,
+            computeTime: 0,
+        };
+    },
+    methods: {
+        handleRegister(){
+            if(this.checkFun()){
+                let oData = this.formData;
+                  if(oData.smsCode==''){
+                    this.$dialog.alert({
+                        message: '请输入短信验证码',
+                    });
+                    return false;
+                }
+                
+                registerOn(this.formData).then((res) => {
+                    console.log(res)
+                })
+
+
+            }
+        },
+        getSmsCode() {
+            if (!this.computeTime) {
+                if(this.checkFun()){
+                   registerCheck(this.formData).then((res) => {
+                    if (res.code === 200) {
+                        this.$dialog.alert({
+                            message: '验证码已发送',
+                        });
+                        this.loginForm.uuid = res.uuid;
+                        this.computeTime = 60;
+                        this.timer = setInterval(() => {
+                        this.computeTime--;
+                        if (this.computeTime <= 0) {
+                            clearInterval(this.timer);
+                        }
+                        }, 1000);
+                    }
+                    });
+                }
+            }
+        },
+        checkFun(){
+            let oData = this.formData;
+            let memberName_Regexp=/^[\u4e00-\u9fa5]{1,6}(·[\u4e00-\u9fa5]{1,6}){0,2}$/; //校验姓名
+            let idcard_Regexp = /^[1-9][0-9]{5}([1][9][0-9]{2}|[2][0][0|1][0-9])([0][1-9]|[1][0|1|2])([0][1-9]|[1|2][0-9]|[3][0|1])[0-9]{3}([0-9]|[X])$/; //身份证
+            let mobile_Regexp=/^1[3|4|5|7|8]\d{9}$/;
+            console.log(oData.mobile)
+            if (!memberName_Regexp.test(oData.memberName)) {
+                this.$dialog.alert({
+                    message: '姓名格式不正确',
+                });
+                return false;
+            }else if(!idcard_Regexp.test(oData.idcard)){
+                this.$dialog.alert({
+                    message: '身份证号码格式不正确',
+                });
+                return false;
+            }else if(!mobile_Regexp.test(oData.mobile)){
+                this.$dialog.alert({
+                    message: '手机号码格式不正确',
+                });
+                return false;
+            }
+            return true;
+        }
+    },
+}
+</script>
+
+<style scoped lang="scss">
+.app-container {
+  .focus-logo {
+    width: 310px;
+    margin: 0 auto 40px;
+    padding-top: 60px;
+    img {
+      width: 100%;
+    }
+    .describe{
+      text-align: center;
+      font-size: 34px;
+      padding:10px 0 0;
+      color: #666;
+    }
+  }
+  .login-main{
+    width: 95%;
+    margin: 0 auto;
+    background: #fff;
+    border-radius: 20px;
+    overflow: hidden;
+    border: 1px solid #ddd;
+    padding-bottom:40px;
+    .form-submit {
+      margin: 40px 40px 0;
+    }
+  }
+  .reveal-modal-con {
+    margin: 30px 40px 0;
+    .dd_txt {
+      text-align: center;
+      font-size: 28px;
+      a {
+        color: #666;
+      }
+    }
+  }
+}
+</style>