555

.nuxt/router.js

@@ -6,6 +6,8 @@ import scrollBehavior from './router.scrollBehavior.js'
 const _578f272f = () => interopDefault(import('..\\pages\\club\\index.vue' /* webpackChunkName: "pages_club_index" */))
 const _616e5366 = () => interopDefault(import('..\\pages\\home\\index.vue' /* webpackChunkName: "pages_home_index" */))
 const _0612e07c = () => interopDefault(import('..\\pages\\login.vue' /* webpackChunkName: "pages_login" */))
+const _e5ead240 = () => interopDefault(import('..\\pages\\register.vue' /* webpackChunkName: "pages_register" */))
+const _0f3a46dd = () => interopDefault(import('..\\pages\\ucenter.vue' /* webpackChunkName: "pages_ucenter" */))
 const _3c6b3d65 = () => interopDefault(import('..\\pages\\index.vue' /* webpackChunkName: "pages_index" */))
 
 // TODO: remove in Nuxt 3
@@ -37,6 +39,14 @@ export const routerOptions = {
     component: _0612e07c,
     name: "login"
   }, {
+    path: "/register",
+    component: _e5ead240,
+    name: "register"
+  }, {
+    path: "/ucenter",
+    component: _0f3a46dd,
+    name: "ucenter"
+  }, {
     path: "/",
     component: _3c6b3d65,
     name: "index"

package.json

@@ -1,8 +1,8 @@
 {
-  "name": "guli-site",
+  "name": "AI小财神",
   "version": "1.0.0",
-  "description": "谷粒学院",
-  "author": "admin <admin@atguigu.com>",
+  "description": "AI小财神",
+  "author": "赵如慧",
   "private": true,
   "scripts": {
     "dev": "nuxt",

pages/register.vue

@@ -0,0 +1,129 @@
+<template>
+  <div class="main">
+    <div class="title">
+      <a href="/login">登录</a>
+      <span>·</span>
+      <a class="active" href="/register">注册</a>
+    </div>
+
+    <div class="sign-up-container">
+      <form action="register">
+        <div class="input-prepend restyle">
+          <input
+            v-model="member.nickname"
+            type="text"
+            placeholder="你的昵称">
+          <i class="iconfont icon-user"/>
+        </div>
+        <div class="input-prepend restyle no-radius">
+          <input
+            v-model="member.mobile"
+            type="text"
+            placeholder="手机号">
+          <i class="iconfont icon-phone"/>
+        </div>
+        <div class="input-prepend restyle no-radius" style="position:relative">
+          <input
+            v-model="member.code"
+            type="text"
+            placeholder="验证码">
+          <i class="iconfont icon-yanzhengma"/>
+          <a
+            href="javascript:"
+            type="button"
+            style="position:absolute;right: 10px;top: 15px;"
+            @click="getCodeFun()">{{ codeText }}</a>
+        </div>
+        <div class="input-prepend">
+          <input
+            v-model="member.password"
+            type="password"
+            placeholder="设置密码">
+          <i class="iconfont icon-password"/>
+        </div>
+        <div class="btn">
+          <input
+            type="button"
+            class="sign-up-button"
+            value="注册"
+            @click="submitRegister()">
+        </div>
+        <p class="sign-up-msg">
+          点击 “注册” 即表示您同意并愿意遵守简书
+          <br>
+          <a target="_blank" href="http://www.jianshu.com/p/c44d171298ce">用户协议</a>
+          和
+          <a target="_blank" href="http://www.jianshu.com/p/2ov8x3">隐私政策</a> 。
+        </p>
+      </form>
+      <!-- 更多注册方式 -->
+      <div class="more-sign">
+        <h6>社交帐号直接注册</h6>
+        <ul>
+          <li><a id="weixin" class="weixin" href="http://localhost:8160/api/ucenter/wx/login"><i class="iconfont icon-weixin"/></a></li>
+          <li><a id="qq" class="qq" target="_blank" href="#"><i class="iconfont icon-qq"/></a></li>
+        </ul>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import '~/assets/css/sign.css'
+import '~/assets/css/iconfont.css'
+import registerApi from '~/api/register'
+
+export default {
+  layout: 'sign',
+  data() {
+    return {
+      member: {
+        mobile: '',
+        code: '',
+        nickname: '',
+        password: ''
+      },
+      sending: false, // 是否发送验证码
+      second: 30, // 倒计时间
+      codeText: '获取验证码'
+    }
+  },
+  methods: {
+    // 获取验证码
+    getCodeFun() {
+      if (this.sending) return
+      this.sending = true// 用户已点击
+      registerApi.sendMessage(this.member.mobile).then(response => {
+        // 倒计时
+        this.timeDown()
+        // 提示用户发送成功
+        this.$message.success(response.message)
+      })
+    },
+
+    // 倒计时
+    timeDown() {
+      this.codeText = this.second
+      // 定义计数器
+      const timer = setInterval(() => {
+        this.codeText--
+        if (this.codeText < 1) {
+          clearInterval(timer)
+          this.codeText = '获取验证码'
+          this.sending = false
+          // this.second = 30
+        }
+      }, 1000)
+    },
+
+    // 注册
+    submitRegister() {
+      registerApi.register(this.member).then(response => {
+        // 提示注成功
+        this.$message.success(response.message)
+        this.$router.push({ path: 'login' })
+      })
+    }
+  }
+}
+</script>