增加注册页

master
expressgy 2 years ago
parent a43f7c8f5d
commit 2c1d6c2e5d
  1. 17
      baseSys/userSys/vision/src/router/index.jsx
  2. 17
      baseSys/userSys/vision/src/store/userStore.js
  3. 2
      baseSys/userSys/vision/src/view/Index/index.jsx
  4. 11
      baseSys/userSys/vision/src/view/SignIn/index.jsx
  5. 0
      baseSys/userSys/vision/src/view/SignIn/index.module.scss
  6. 0
      baseSys/userSys/vision/src/view/SignIn/next.svg
  7. 10
      baseSys/userSys/vision/src/view/SignUp/index.jsx
  8. 16
      baseSys/userSys/vision/src/view/SignUp/index.module.scss

@ -1,8 +1,9 @@
import { Navigate } from 'react-router-dom' import { Navigate } from 'react-router-dom'
import Home from '@/view/Home'
import Login from '@/view/Login'
import Index from '@/view/Index' import Index from '@/view/Index'
import SignIn from '@/view/SignIn'
import SignUp from '@/view/SignUp'
import Home from '@/view/Home'
export default [ export default [
// //
@ -11,16 +12,20 @@ export default [
element: <Index /> element: <Index />
}, },
{ {
path:'/login', path:'/signIn',
element: <Login /> element: <SignIn />
},
{
path:'/signUp',
element: <SignUp />
}, },
{ {
path: '/home', path: '/home',
element: <Home />, element: <Home />,
children:[ children:[
{ {
path: 'login', path: 'signIn',
element: <Login />, element: <SignIn />,
} }
] ]
}, },

@ -5,7 +5,13 @@ import {config} from "@/config/sys22";
class UserStore { class UserStore {
// 系统配置 // 系统配置
config = config; config = config;
// Token
token = ''; token = '';
// 登陆时的注册名称
signInUsername = null;
name = 'kangkang000'; name = 'kangkang000';
sex = '男'; sex = '男';
userObj = { userObj = {
@ -19,6 +25,7 @@ class UserStore {
makeObservable(this, { makeObservable(this, {
config: observable, config: observable,
token:observable, token:observable,
signInUsername:observable,
name: observable, name: observable,
sex: observable, sex: observable,
@ -29,10 +36,12 @@ class UserStore {
} }
// 设置Token
setToken(token){ setToken(token){
window.localStorage.setItem('token',token) window.localStorage.setItem('token',token)
this.token = token this.token = token
} }
// 获取Token
get token(){ get token(){
if(!this.token){ if(!this.token){
this.token = window.localStorage.getItem('token') this.token = window.localStorage.getItem('token')
@ -42,6 +51,14 @@ class UserStore {
} }
} }
// 设置SignInUsername
setSignInUsername(username){
this.signInUsername = username
}
get signInUsername(){
return this.signInUsername
}
setName(v) { setName(v) {

@ -12,7 +12,7 @@ export default function Index(){
function go(){ function go(){
setGoOutAnimate('animate__fadeOutUp'); setGoOutAnimate('animate__fadeOutUp');
setTimeout(() => { setTimeout(() => {
navigate('/login') navigate('/signIn')
},900) },900)
} }
return (<div className={[css.Index, 'animate__animated', goOutAnimate].join(' ')} onClick={go} > return (<div className={[css.Index, 'animate__animated', goOutAnimate].join(' ')} onClick={go} >

@ -184,6 +184,15 @@ export default function Login(){
} }
} }
//
function signUp(){
userStore.setSignInUsername(userInfo)
setLoginStyle(['animate__zoomOut', 'animate__animated', 'animate__faster'].join(' '))
setTimeout(() => {
navigate('/signUp')
},500)
}
return( return(
<div className={css.login}> <div className={css.login}>
<div className={loginStyle}> <div className={loginStyle}>
@ -225,7 +234,7 @@ export default function Login(){
<div onClick={goBackPage1}>返回</div> <div onClick={goBackPage1}>返回</div>
<div> <div>
{!signInOrOut && <div onClick={signIn}>登录</div>} {!signInOrOut && <div onClick={signIn}>登录</div>}
{signInOrOut && <div>注册</div>} {signInOrOut && <div onClick={signUp}>注册</div>}
</div> </div>
</div> </div>
</div> </div>

Before

Width:  |  Height:  |  Size: 573 B

After

Width:  |  Height:  |  Size: 573 B

@ -0,0 +1,10 @@
import css from './index.module.scss'
import {userStore, netStore} from "@/store";
export default function SignUp(){
console.log(userStore.signInUsername)
return <div className={css.SignUp}>
SignUp
</div>
}

@ -0,0 +1,16 @@
.SignUp {
position: relative;
height: 100%;
width: 100%;
background-image: linear-gradient(to bottom, transparent 75%, #ffffff 100%), radial-gradient(at 0% 0%, hsla(154, 4%, 50%, 0.25) 0, transparent 50%), radial-gradient(at 0% 50%, hsla(120, 5%, 50%, 0.23) 0, transparent 50%), radial-gradient(at 40% 40%, hsla(120, 4%, 50%, 0.21) 0, transparent 50%), radial-gradient(at 80% 0%, #ffffff 0, transparent 50%), radial-gradient(at 80% 50%, #ffffff 0, transparent 50%), radial-gradient(at 80% 50%, #ffffff 0, transparent 50%), linear-gradient(to bottom, transparent 75%, #ffffff 100%);
background-position: center;
background-size: cover;
background-repeat: no-repeat;
display: flex;
align-items: center;
justify-content: center;
user-select: none;
}
Loading…
Cancel
Save