登录逻辑+注册有礼
This commit is contained in:
@@ -1,3 +1,5 @@
|
||||
import { UserState } from '@/store/modules/user/types';
|
||||
|
||||
export interface LoginParams {
|
||||
// phone: string;
|
||||
code: string;
|
||||
@@ -10,8 +12,9 @@ export interface LoginByCodeParams {
|
||||
}
|
||||
|
||||
export interface LoginResult {
|
||||
|
||||
sessionKey: string;
|
||||
user: UserState;
|
||||
userInfo: any;
|
||||
token: string;
|
||||
user_id: number;
|
||||
user_name: string;
|
||||
avatar: string;
|
||||
}
|
||||
|
@@ -21,8 +21,8 @@
|
||||
},
|
||||
"mp-weixin":
|
||||
{
|
||||
// "appid": "wx92e663dc11d0c0a8",
|
||||
"appid": "wx67a750d0ceed4d88",
|
||||
"appid": "wx92e663dc11d0c0a8",
|
||||
// "appid": "wx67a750d0ceed4d88",
|
||||
"setting":
|
||||
{
|
||||
"urlCheck": false
|
||||
|
@@ -42,6 +42,12 @@
|
||||
"path": "login/index",
|
||||
"navigationStyle": "custom"
|
||||
},
|
||||
{
|
||||
"path": "register/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "注册有礼"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "webview/index",
|
||||
"navigationBarTitleText": "网页"
|
||||
|
@@ -92,7 +92,11 @@ function getCode() {
|
||||
}
|
||||
|
||||
function wechatLogin() {
|
||||
userStore.authLogin();
|
||||
uni.showLoading();
|
||||
userStore.authLogin().then(() => {
|
||||
uni.hideLoading();
|
||||
uni.reLaunch({ url: '/pages/home/index' });
|
||||
});
|
||||
}
|
||||
|
||||
function submit() {
|
||||
|
143
src/pages/common/register/index.vue
Normal file
143
src/pages/common/register/index.vue
Normal file
@@ -0,0 +1,143 @@
|
||||
<template>
|
||||
<view class='content'>
|
||||
<image class='bg-image' :src='assetsUrl("bg_register.png")' />
|
||||
<view class='card-view'>
|
||||
<view class='mobile-view c-flex-row'>
|
||||
<image :src='assetsUrl("ic_register_mobile.png")' />
|
||||
<input placeholder='请输入手机号' inputmode='number' maxlength='11' />
|
||||
</view>
|
||||
|
||||
<view class='captcha-view c-flex-row'>
|
||||
<view class='c-flex-row'>
|
||||
<image :src='assetsUrl("ic_register_captcha.png")' />
|
||||
<input placeholder='请输入验证码' inputmode='number' maxlength='6' />
|
||||
</view>
|
||||
<text @click.stop='startCountdown'>{{ countdown }}</text>
|
||||
</view>
|
||||
|
||||
<text class='btn_register' @click.stop='register'>注册领券</text>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script lang='ts' setup>
|
||||
import { assetsUrl } from '@/utils/assets';
|
||||
|
||||
const countdown = ref('获取验证码');
|
||||
|
||||
onLoad((e) => {
|
||||
|
||||
});
|
||||
|
||||
const startCountdown = () => {
|
||||
if(countdown.value !== '获取验证码') {
|
||||
return;
|
||||
}
|
||||
let time = 120;
|
||||
let interval = setInterval(() => {
|
||||
time--;
|
||||
countdown.value = `${time}s 重新获取`;
|
||||
if(time == 0) {
|
||||
clearInterval(interval);
|
||||
countdown.value = '获取验证码';
|
||||
}
|
||||
}, 1000);
|
||||
};
|
||||
|
||||
const register = () => {
|
||||
};
|
||||
|
||||
</script>
|
||||
|
||||
<style lang='scss' scoped>
|
||||
.content {
|
||||
position: relative;
|
||||
height: 100vh;
|
||||
background: #F32B2B;
|
||||
}
|
||||
|
||||
.bg-image {
|
||||
position: fixed;
|
||||
height: 100vh;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
}
|
||||
|
||||
.card-view {
|
||||
background: #FFFFFF;
|
||||
border-radius: 10rpx;
|
||||
margin: 230px 50rpx 0 50rpx;
|
||||
padding: 40rpx;
|
||||
position: relative;
|
||||
|
||||
.mobile-view {
|
||||
border-radius: 10rpx;
|
||||
border: 1rpx solid #D8D8D8;
|
||||
padding-left: 28rpx;
|
||||
|
||||
image {
|
||||
width: 36rpx;
|
||||
height: 36rpx;
|
||||
}
|
||||
|
||||
input {
|
||||
flex: 1;
|
||||
height: 80rpx;
|
||||
font-size: 30rpx;
|
||||
color: #333333;
|
||||
margin-left: 26rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.captcha-view {
|
||||
margin-top: 20rpx;
|
||||
|
||||
.c-flex-row {
|
||||
border-radius: 10rpx;
|
||||
border: 1rpx solid #D8D8D8;
|
||||
padding-left: 28rpx;
|
||||
flex: 1;
|
||||
|
||||
image {
|
||||
width: 33rpx;
|
||||
height: 26rpx;
|
||||
}
|
||||
|
||||
input {
|
||||
height: 80rpx;
|
||||
font-size: 30rpx;
|
||||
color: #333333;
|
||||
margin-left: 26rpx;
|
||||
}
|
||||
}
|
||||
|
||||
text {
|
||||
display: flex;
|
||||
height: 80rpx;
|
||||
background: #FFD436;
|
||||
border-radius: 10rpx;
|
||||
margin-left: 12rpx;
|
||||
padding: 0 15rpx;
|
||||
font-size: 28rpx;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
}
|
||||
|
||||
.btn_register {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
height: 90rpx;
|
||||
background: #F53636;
|
||||
border-radius: 10rpx;
|
||||
font-weight: 400;
|
||||
font-size: 30rpx;
|
||||
color: #FFFFFF;
|
||||
margin-top: 46rpx;
|
||||
}
|
||||
}
|
||||
</style>
|
@@ -15,15 +15,15 @@
|
||||
</view>
|
||||
|
||||
<view class='user-info-card'>
|
||||
<image class='user-avatar' :src='bannerList[0]' mode='aspectFill' />
|
||||
<text class='user-name primary-text-color'>设计小仙女</text>
|
||||
<image class='user-avatar' :src='userInfo.image' mode='aspectFill' />
|
||||
<text class='user-name primary-text-color'>{{ userInfo?.nickName }}</text>
|
||||
<view class='integral-view primary-text-color'>
|
||||
<text>1000</text>
|
||||
<text>{{ userInfo?.integration }}</text>
|
||||
<text>积分</text>
|
||||
</view>
|
||||
<view class='divider' style='height: 83rpx' />
|
||||
<view class='balance-view'>
|
||||
<text class='accent-text-color'>998.00</text>
|
||||
<text class='accent-text-color'>{{ userInfo?.balance }}</text>
|
||||
<text>余额(元)</text>
|
||||
</view>
|
||||
</view>
|
||||
@@ -67,9 +67,10 @@ import { getCompanyInfo } from '@/api/company';
|
||||
import { useUserStore } from '@/store';
|
||||
import { assetsUrl } from '@/utils/assets';
|
||||
import { goPath } from '@/utils';
|
||||
import { storeToRefs } from 'pinia';
|
||||
|
||||
const store = useUserStore();
|
||||
|
||||
const { userInfo } = storeToRefs(store);
|
||||
const bannerList = ref<string[]>([]);
|
||||
const currentBannerIndex = ref(0);
|
||||
const recommendBannerList = ref<string[]>([]);
|
||||
@@ -78,7 +79,7 @@ const submenuList = [
|
||||
{
|
||||
title: '注册有礼',
|
||||
icon: assetsUrl('ic_register_gift.png'),
|
||||
path: '/pages/order/order'
|
||||
path: '/pages/common/register/index'
|
||||
},
|
||||
{
|
||||
title: '团购秒杀',
|
||||
@@ -102,8 +103,6 @@ onLoad(async (e) => {
|
||||
const swiperChange = (e: any) => {
|
||||
currentBannerIndex.value = e.detail.current;
|
||||
};
|
||||
|
||||
console.log('store.user_name', store.user_name);
|
||||
</script>
|
||||
|
||||
<style lang='scss'>
|
||||
|
@@ -7,23 +7,23 @@
|
||||
/>
|
||||
|
||||
<view class='top-row'>
|
||||
<image :src=' assetsUrl("ic_coupon.png")' />
|
||||
<image :src='userInfo.image' />
|
||||
|
||||
<view class='u-flex-column'>
|
||||
<text>设计小仙女</text>
|
||||
<text>15542535625</text>
|
||||
<text>{{ userInfo.nickName}}</text>
|
||||
<text>{{ userInfo.telephone }}</text>
|
||||
</view>
|
||||
|
||||
<image :src=' assetsUrl("ic_qrcode_white.png")' />
|
||||
<image :src='assetsUrl("ic_qrcode_white.png")' />
|
||||
</view>
|
||||
|
||||
<view class='bottom-row'>
|
||||
<view>
|
||||
<text>100</text>
|
||||
<text>{{ userInfo.integration }}</text>
|
||||
<text>积分</text>
|
||||
</view>
|
||||
<view @click.stop='goPath("/pages/mine/subs/recharge/index")'>
|
||||
<text>255.00</text>
|
||||
<text>{{ userInfo.balance }}</text>
|
||||
<text>余额</text>
|
||||
</view>
|
||||
<view @click.stop='goPath("/pages/mine/subs/coupon/coupon-list")'>
|
||||
@@ -121,7 +121,8 @@ const title = ref<string>();
|
||||
title.value = import.meta.env.VITE_APP_TITLE;
|
||||
|
||||
const store = useUserStore();
|
||||
console.log('store.user_name', store.user_name);
|
||||
const { userInfo } = storeToRefs(store);
|
||||
|
||||
</script>
|
||||
|
||||
<style lang='scss' scoped>
|
||||
|
@@ -53,7 +53,7 @@ const codeRefreshInterval = ref(30);
|
||||
|
||||
onLoad(() => {
|
||||
generateCode();
|
||||
getDynamicCode()
|
||||
// getDynamicCode()
|
||||
|
||||
setInterval(() => {
|
||||
codeRefreshInterval.value -= 1;
|
||||
|
BIN
src/static/images/bg_register.png
Normal file
BIN
src/static/images/bg_register.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 2.1 MiB |
BIN
src/static/images/ic_register_captcha.png
Normal file
BIN
src/static/images/ic_register_captcha.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 1.3 KiB |
BIN
src/static/images/ic_register_mobile.png
Normal file
BIN
src/static/images/ic_register_mobile.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 3.2 KiB |
@@ -5,12 +5,12 @@ import { createPinia } from 'pinia';
|
||||
import useAppStore from './modules/app';
|
||||
import useUserStore from './modules/user';
|
||||
|
||||
// import piniaPersist from 'pinia-plugin-persist-uni';
|
||||
import piniaPersist from 'pinia-plugin-persistedstate';
|
||||
|
||||
// 安装pinia状态管理插件
|
||||
function setupStore(app: App) {
|
||||
const store = createPinia();
|
||||
// store.use(piniaPersist);
|
||||
store.use(piniaPersist);
|
||||
|
||||
app.use(store);
|
||||
}
|
||||
|
@@ -5,16 +5,33 @@ import {
|
||||
login as userLogin,
|
||||
logout as userLogout, login
|
||||
} from '@/api/user/index';
|
||||
import { clearToken, setToken } from '@/utils/auth';
|
||||
import { clearToken, setCompanyId, setToken } from '@/utils/auth';
|
||||
import type { LoginParams } from '@/api/user/types';
|
||||
|
||||
const useUserStore = defineStore('user', {
|
||||
state: (): UserState => ({
|
||||
user_id: '',
|
||||
user_name: '江阳小道',
|
||||
avatar: '',
|
||||
token: ''
|
||||
state: (): UserState => <UserState>({
|
||||
id: '',
|
||||
unionId: '',
|
||||
name: '未登录',
|
||||
nickName: '未登录',
|
||||
image: '',
|
||||
telephone: '',
|
||||
balance: 0,
|
||||
integration: 0,
|
||||
birthday: ''
|
||||
}),
|
||||
|
||||
persist: true,
|
||||
|
||||
// persist: {
|
||||
// // 修改存储中使用的键名称,默认为当前 Store的 id
|
||||
// key: 'userState',
|
||||
// // 修改为 sessionStorage,默认为 localStorage
|
||||
// // storage: window.localStorage,
|
||||
// // 部分持久化状态的点符号路径数组,[]意味着没有状态被持久化(默认为undefined,持久化整个状态)
|
||||
// paths: undefined
|
||||
// },
|
||||
|
||||
getters: {
|
||||
userInfo(state: UserState): UserState {
|
||||
return { ...state };
|
||||
@@ -22,7 +39,7 @@ const useUserStore = defineStore('user', {
|
||||
},
|
||||
actions: {
|
||||
// 设置用户的信息
|
||||
setInfo(partial: Partial<UserState>) {
|
||||
setUserInfo(partial: Partial<UserState>) {
|
||||
this.$patch(partial);
|
||||
},
|
||||
// 重置用户信息
|
||||
@@ -32,7 +49,7 @@ const useUserStore = defineStore('user', {
|
||||
// 获取用户信息
|
||||
async info() {
|
||||
const result = await getUserProfile();
|
||||
this.setInfo(result);
|
||||
this.setUserInfo(result);
|
||||
},
|
||||
// 异步登录并存储token
|
||||
login(loginForm: LoginParams) {
|
||||
@@ -63,7 +80,6 @@ const useUserStore = defineStore('user', {
|
||||
success: async (result: UniApp.LoginRes) => {
|
||||
if(result.code) {
|
||||
const wechatUserInfo = await uni.getUserInfo();
|
||||
console.log(wechatUserInfo);
|
||||
const userInfo = {
|
||||
...wechatUserInfo.userInfo,
|
||||
encryptedData: wechatUserInfo?.encryptedData,
|
||||
@@ -77,6 +93,10 @@ const useUserStore = defineStore('user', {
|
||||
userInfo: userInfo,
|
||||
referrerUserId: '1727303781559697409'
|
||||
});
|
||||
|
||||
this.setUserInfo(res.user);
|
||||
setToken(res.token);
|
||||
setCompanyId(res.user.companyId);
|
||||
resolve(res);
|
||||
} else {
|
||||
reject(new Error(result.errMsg));
|
||||
|
@@ -1,9 +1,55 @@
|
||||
export type RoleType = '' | '*' | 'user';
|
||||
|
||||
export interface UserState {
|
||||
user_id?: string;
|
||||
user_name?: string;
|
||||
avatar?: string;
|
||||
token?: string;
|
||||
address: string;
|
||||
balance: number;
|
||||
birthday: string;
|
||||
birthdayMD: string;
|
||||
birthdayType: number;
|
||||
card: string;
|
||||
companyId: string;
|
||||
consumption: string;
|
||||
consumptionDay: string;
|
||||
couponsCount: number;
|
||||
createTime: string;
|
||||
creatorId: string;
|
||||
creatorName: string;
|
||||
customerPrice: string;
|
||||
email: string;
|
||||
gender: number;
|
||||
gold: string;
|
||||
goodsNum: number;
|
||||
id: string;
|
||||
image: string;
|
||||
integration: number;
|
||||
lastConsumTime: string;
|
||||
levelEntity: string;
|
||||
levelId: string;
|
||||
levelName: string;
|
||||
maOpenId: string;
|
||||
memberLabel: string;
|
||||
name: string;
|
||||
nickName: string;
|
||||
openId: string;
|
||||
orderNum: number;
|
||||
ownerId: string;
|
||||
ownerName: string;
|
||||
registerDay: number;
|
||||
relatedRate: number;
|
||||
remark: string;
|
||||
salePrice: number;
|
||||
source: string;
|
||||
status: string;
|
||||
storeId: string;
|
||||
telephone: string;
|
||||
totalConsumption: string;
|
||||
totalIncoming: number;
|
||||
totalIntegral: number;
|
||||
unionId: string;
|
||||
updateTime: string;
|
||||
useCouponsPrice: number;
|
||||
wirelinedTelephone: string;
|
||||
}
|
||||
|
||||
export type providerType =
|
||||
|
@@ -1,15 +1,30 @@
|
||||
const TokenKey = 'admin-token';
|
||||
const TokenKey = 'access-token';
|
||||
const CompanyIdKey = 'companyId';
|
||||
const TokenPrefix = 'Bearer ';
|
||||
|
||||
function isLogin() {
|
||||
return !!uni.getStorageSync(TokenKey);
|
||||
}
|
||||
|
||||
function getToken() {
|
||||
return uni.getStorageSync(TokenKey);
|
||||
}
|
||||
|
||||
function setToken(token: string) {
|
||||
uni.setStorageSync(TokenKey, token);
|
||||
}
|
||||
|
||||
function getCompanyId() {
|
||||
return uni.getStorageSync(CompanyIdKey);
|
||||
}
|
||||
|
||||
function setCompanyId(companyId: string) {
|
||||
uni.setStorageSync(CompanyIdKey, companyId);
|
||||
}
|
||||
|
||||
function clearToken() {
|
||||
uni.removeStorageSync(TokenKey);
|
||||
uni.removeStorageSync(CompanyIdKey);
|
||||
}
|
||||
export { TokenPrefix, isLogin, getToken, setToken, clearToken };
|
||||
|
||||
export { TokenPrefix, isLogin, getToken, setToken, getCompanyId, setCompanyId, clearToken };
|
||||
|
@@ -4,7 +4,7 @@ import type {
|
||||
HttpResponse
|
||||
} from 'uview-plus/libs/luch-request';
|
||||
import { showMessage } from './status';
|
||||
import { getToken } from '@/utils/auth';
|
||||
import { getCompanyId, getToken } from '@/utils/auth';
|
||||
import useUserStore from '@/store/modules/user';
|
||||
|
||||
// 是否正在刷新token的标记
|
||||
@@ -26,8 +26,7 @@ function requestInterceptors() {
|
||||
const token = getToken();
|
||||
if(token && config.header) {
|
||||
config.header.token = token;
|
||||
config.header.Authorization = token;
|
||||
config.header.companyid = '1471673498334113794';
|
||||
config.header.companyid = getCompanyId();
|
||||
}
|
||||
return config;
|
||||
},
|
||||
|
Reference in New Issue
Block a user