feat(登录)

This commit is contained in:
unknown 2024-05-23 01:38:19 +08:00
parent c6ba320a80
commit 4b1de8bdac
5 changed files with 701 additions and 443 deletions

View File

@ -1,100 +1,173 @@
<template> <template>
<pb-layout :leftIcon="''" navbar="inner" :bgStyle="{ backgroundColor: '#fff' }"> <pb-layout :leftIcon="''" navbar="inner" :bgStyle="{ backgroundColor: '#fff' }">
<view class="login-module"> <view class="login-module ss-p-x-30">
<view> <view class="login-title ss-font-56 ss-m-b-72">
{{ title }} {{ title }}
</view> </view>
<uni-forms ref="smsLoginRef" v-model="state.model" :rules="state.rules" validateTrigger="bind"> <uni-forms ref="smsLoginRef" v-model="state.model" :rules="state.rules" validateTrigger="bind">
<uni-forms-item name="mobile"> <uni-forms-item name="mobile">
<uni-easyinput <uni-easyinput :styles="state.inputStyle" trim="all" placeholder="请输入手机号" v-model="state.model.mobile"
placeholder="请输入手机号" :inputBorder="false" type="number" />
v-model="state.model.mobile" </uni-forms-item>
:inputBorder="false" <uni-forms-item name="code">
type="number" <uni-easyinput :styles="state.inputStyle" trim="all" placeholder="验证码" v-model="state.model.code"
/> :inputBorder="false" type="number" maxlength="4">
</uni-forms-item> <template #right>
<uni-forms-item name="code"> <button :disabled="state.isMobileEnd" :class="{ 'code-btn-end': state.isMobileEnd }"
<uni-easyinput class="ss-reset-button code-btn code-btn-start" @tap="getSmsCode('smsLogin', state.model.mobile)">
placeholder="验证码" {{ getSmsTimer('smsLogin') }}
v-model="state.model.code" </button>
:inputBorder="false" </template>
type="number" </uni-easyinput>
maxlength="4" </uni-forms-item>
> </uni-forms>
<template #right> <button class="ss-reset-button login-btn-start" @tap="smsLoginSubmit">登录</button>
<button class="ss-reset-button code-btn code-btn-start" @tap="smsLoginSubmit"> <view class="agreement-box ss-flex ss-row-center" :class="{ shake: state.isShaking }">
获取验证码 <label class="radio ss-flex" @tap="onChange">
</button> <radio :checked="state.agreeStatus" color="var(--ui-BG-Main)" style="transform: scale(0.8)"
</template> @tap.stop="onChange" />
</uni-easyinput> <view class="agreement-text ss-flex ss-m-l-8">
</uni-forms-item> 我已阅读并遵守
</uni-forms> <view class="tcp-text" @tap.stop="onProtocol('商家入驻协议')"> 商家入驻协议 </view>
<button class="ss-reset-button login-btn-start" @tap="smsLoginSubmit">登录</button> </view>
</view> </label>
</pb-layout> </view>
</view>
</pb-layout>
</template> </template>
<script setup> <script setup>
import { ref } from 'vue' import { ref } from 'vue'
import { code, mobile } from '@/peach/validate/form';
import { showAuthModal, closeAuthModal, getSmsCode, getSmsTimer } from '@/peach/hooks/useModal';
const title = ref('欢迎登录') const title = ref('欢迎登录')
const smsLoginRef = ref(null)
const state = ref({ const state = ref({
model: { isMobileEnd: false,
mobile: '', agreeStatus: false,
code: '', isShaking: false,
}, model: {
rules: { mobile: '',
mobile: { code: '',
rules: [ },
{ rules: {
required: true, mobile,
errorMessage: '手机号不能为空', code
}, },
{ inputStyle: {
pattern: /^1[3-9]\d{9}$/, backgroundColor: '#ECECEC'
errorMessage: '手机号格式错误', }
},
],
},
code: {
rules: [
{
required: true,
errorMessage: '验证码不能为空',
},
{
pattern: /^\d{4}$/,
errorMessage: '验证码格式错误',
},
],
},
},
}) })
function onChange() {
state.value.agreeStatus = !state.value.agreeStatus
}
async function smsLoginSubmit() {
const validate = await smsLoginRef.value.validate().catch(err => {
console.log('err', err)
})
if (!validate) return
if (!state.agreeStatus) {
state.value.isShaking = true
setTimeout(() => {
state.value.isShaking = false
}, 1000)
peach.$helper.toast('请勾选同意')
return
}
const { code } = await AuthUtil.smsLogin(state.value.model)
if (code === 0) {
}
}
</script> </script>
<style lang="scss">
.login-module {
.uni-easyinput {
::v-deep .uni-easyinput__content {
border-radius: 41rpx;
padding: 0 10rpx;
}
}
}
</style>
<style lang="scss" scoped> <style lang="scss" scoped>
.login-module { .login-module {
.login-btn-start { margin-top: 50%;
width: 158rpx; overflow: hidden;
height: 56rpx;
line-height: normal; .login-title {
background: linear-gradient(90deg, var(--ui-BG-Main), var(--ui-BG-Main-gradient)); color: '#1818d';
border-radius: 28rpx; font-weight: 600;
font-size: 26rpx; }
font-weight: 500;
color: #fff; .login-btn-start {
height: 82rpx;
line-height: normal;
background: linear-gradient(90deg, var(--ui-BG-Main), var(--ui-BG-Main-gradient));
border-radius: 28rpx;
font-size: 26rpx;
font-weight: 500;
color: #fff;
}
.code-btn-start {
width: 160rpx;
height: 56rpx;
line-height: normal;
border-radius: 28rpx;
font-size: 26rpx;
font-weight: 400;
color: var(--ui-BG-Main);
opacity: 1;
}
.agreement-box {
margin: -10px auto 10px;
position: absolute;
bottom: 30rpx;
left: 50%;
transform: translateX(-50%);
width: 100%;
.protocol-check {
transform: scale(0.7);
} }
.code-btn-start {
width: 160rpx; .agreement-text {
height: 56rpx; font-size: 26rpx;
line-height: normal; font-weight: 500;
border: 2rpx solid var(--ui-BG-Main); color: #999999;
border-radius: 28rpx;
font-size: 26rpx; .tcp-text {
font-weight: 400;
color: var(--ui-BG-Main); color: var(--ui-BG-Main);
opacity: 1; }
} }
}
.shake {
animation: shake 0.05s linear 4 alternate;
}
@keyframes shake {
from {
transform: translateX(-10rpx);
}
to {
transform: translateX(10rpx);
}
}
} }
</style> </style>

View File

@ -3,8 +3,8 @@
==================== */ ==================== */
.ss-bg-opactity-block { .ss-bg-opactity-block {
background-color: rgba(#000, 0.2); background-color: rgba(#000, 0.2);
color: #fff; color: #fff;
} }
/* ================== /* ==================
@ -12,80 +12,80 @@
==================== */ ==================== */
.ss-flex { .ss-flex {
display: flex; display: flex;
flex-direction: row; flex-direction: row;
align-items: center; align-items: center;
} }
.ss-flex-1 { .ss-flex-1 {
flex: 1; flex: 1;
} }
.ss-flex-col { .ss-flex-col {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
} }
.ss-flex-wrap { .ss-flex-wrap {
flex-wrap: wrap; flex-wrap: wrap;
} }
.ss-flex-nowrap { .ss-flex-nowrap {
flex-wrap: nowrap; flex-wrap: nowrap;
} }
.ss-col-center { .ss-col-center {
align-items: center; align-items: center;
} }
.ss-col-top { .ss-col-top {
align-items: flex-start; align-items: flex-start;
} }
.ss-col-bottom { .ss-col-bottom {
align-items: flex-end; align-items: flex-end;
} }
.ss-col-stretch { .ss-col-stretch {
align-items: stretch; align-items: stretch;
} }
.ss-row-center { .ss-row-center {
justify-content: center; justify-content: center;
} }
.ss-row-left { .ss-row-left {
justify-content: flex-start; justify-content: flex-start;
} }
.ss-row-right { .ss-row-right {
justify-content: flex-end; justify-content: flex-end;
} }
.ss-row-between { .ss-row-between {
justify-content: space-between; justify-content: space-between;
} }
.ss-row-around { .ss-row-around {
justify-content: space-around; justify-content: space-around;
} }
.ss-self-start { .ss-self-start {
align-self: flex-start; align-self: flex-start;
} }
.ss-self-end { .ss-self-end {
align-self: flex-end; align-self: flex-end;
} }
.ss-self-center { .ss-self-center {
align-self: center; align-self: center;
} }
.ss-h-100 { .ss-h-100 {
height: 100%; height: 100%;
} }
.ss-w-100 { .ss-w-100 {
width: 100%; width: 100%;
} }
/* ================== /* ==================
@ -94,60 +94,60 @@
==================== */ ==================== */
@for $i from 0 through 100 { @for $i from 0 through 100 {
// 只要双数和能被5除尽的数 // 只要双数和能被5除尽的数
@if $i % 2==0 or $i % 5==0 { @if $i % 2==0 or $i % 5==0 {
// 得出u-margin-30或者u-m-30 // 得出u-margin-30或者u-m-30
.ss-margin-#{$i}, .ss-margin-#{$i},
.ss-m-#{$i} { .ss-m-#{$i} {
margin: $i + rpx; margin: $i + rpx;
}
.ss-m-x-#{$i} {
margin-left: $i + rpx;
margin-right: $i + rpx;
}
.ss-m-y-#{$i} {
margin-top: $i + rpx;
margin-bottom: $i + rpx;
}
// 得出u-padding-30或者u-p-30
.ss-padding-#{$i},
.ss-p-#{$i} {
padding: $i + rpx;
}
.ss-p-x-#{$i} {
padding-left: $i + rpx;
padding-right: $i + rpx;
}
.ss-p-y-#{$i} {
padding-top: $i + rpx;
padding-bottom: $i + rpx;
}
@each $short, $long in l left, t top, r right, b bottom {
// 缩写版结果如 u-m-l-30
// 定义外边距
.ss-m-#{$short}-#{$i} {
margin-#{$long}: $i + rpx;
}
// 定义内边距
.ss-p-#{$short}-#{$i} {
padding-#{$long}: $i + rpx;
}
// 完整版结果如u-margin-left-30
// 定义外边距
.ss-margin-#{$long}-#{$i} {
margin-#{$long}: $i + rpx;
}
// 定义内边距
.ss-padding-#{$long}-#{$i} {
padding-#{$long}: $i + rpx;
}
}
} }
.ss-m-x-#{$i} {
margin-left: $i + rpx;
margin-right: $i + rpx;
}
.ss-m-y-#{$i} {
margin-top: $i + rpx;
margin-bottom: $i + rpx;
}
// 得出u-padding-30或者u-p-30
.ss-padding-#{$i},
.ss-p-#{$i} {
padding: $i + rpx;
}
.ss-p-x-#{$i} {
padding-left: $i + rpx;
padding-right: $i + rpx;
}
.ss-p-y-#{$i} {
padding-top: $i + rpx;
padding-bottom: $i + rpx;
}
@each $short, $long in l left, t top, r right, b bottom {
// 缩写版结果如 u-m-l-30
// 定义外边距
.ss-m-#{$short}-#{$i} {
margin-#{$long}: $i + rpx;
}
// 定义内边距
.ss-p-#{$short}-#{$i} {
padding-#{$long}: $i + rpx;
}
// 完整版结果如u-margin-left-30
// 定义外边距
.ss-margin-#{$long}-#{$i} {
margin-#{$long}: $i + rpx;
}
// 定义内边距
.ss-padding-#{$long}-#{$i} {
padding-#{$long}: $i + rpx;
}
}
}
} }
/* ================== /* ==================
@ -156,35 +156,37 @@
==================== */ ==================== */
@for $i from 0 through 100 { @for $i from 0 through 100 {
// 只要双数和能被5除尽的数 // 只要双数和能被5除尽的数
@if $i % 2==0 or $i % 5==0 { @if $i % 2==0 or $i % 5==0 {
.ss-radius-#{$i}, .ss-radius-#{$i},
.ss-r-#{$i} { .ss-r-#{$i} {
border-radius: $i + rpx; border-radius: $i + rpx;
}
.ss-r-t-#{$i} {
border-top-left-radius: $i + rpx;
border-top-right-radius: $i + rpx;
}
.ss-r-b-#{$i} {
border-bottom-left-radius: $i + rpx;
border-bottom-right-radius: $i + rpx;
}
@each $short, $long in tl 'top-left', tr 'top-right', bl 'bottom-right', br 'bottom-right' {
// 定义外边距
.ss-r-#{$short}-#{$i} {
border-#{$long}-radius: $i + rpx;
}
// 定义内边距
.ss-radius-#{$long}-#{$i} {
border-#{$long}-radius: $i + rpx;
}
}
} }
.ss-r-t-#{$i} {
border-top-left-radius: $i + rpx;
border-top-right-radius: $i + rpx;
}
.ss-r-b-#{$i} {
border-bottom-left-radius: $i + rpx;
border-bottom-right-radius: $i + rpx;
}
@each $short, $long in tl "top-left", tr "top-right", bl "bottom-right",
br "bottom-right"
{
// 定义外边距
.ss-r-#{$short}-#{$i} {
border-#{$long}-radius: $i + rpx;
}
// 定义内边距
.ss-radius-#{$long}-#{$i} {
border-#{$long}-radius: $i + rpx;
}
}
}
} }
/* ================== /* ==================
@ -194,41 +196,41 @@
==================== */ ==================== */
@mixin ellipsis($rowCount: 1) { @mixin ellipsis($rowCount: 1) {
// @if $rowCount <=1 { // @if $rowCount <=1 {
// overflow: hidden; // overflow: hidden;
// text-overflow: ellipsis; // text-overflow: ellipsis;
// white-space: nowrap; // white-space: nowrap;
// } @else { // } @else {
// min-width: 0; // min-width: 0;
// overflow: hidden; // overflow: hidden;
// text-overflow: ellipsis; // text-overflow: ellipsis;
// display: -webkit-box; // display: -webkit-box;
// -webkit-line-clamp: $rowCount; // -webkit-line-clamp: $rowCount;
// -webkit-box-orient: vertical; // -webkit-box-orient: vertical;
// } // }
min-width: 0; min-width: 0;
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
display: -webkit-box; display: -webkit-box;
-webkit-line-clamp: $rowCount; -webkit-line-clamp: $rowCount;
-webkit-box-orient: vertical; -webkit-box-orient: vertical;
} }
@for $i from 1 through 6 { @for $i from 1 through 6 {
.ss-line-#{$i} { .ss-line-#{$i} {
@include ellipsis($i); @include ellipsis($i);
} }
} }
/* ================== /* ==================
hover hover
==================== */ ==================== */
.ss-hover-class { .ss-hover-class {
background-color: $gray-c; background-color: $gray-c;
opacity: 0.6; opacity: 0.6;
} }
.ss-hover-btn { .ss-hover-btn {
transform: translate(1px, 1px); transform: translate(1px, 1px);
} }
/* ================== /* ==================
@ -236,9 +238,9 @@
==================== */ ==================== */
.ss-safe-bottom { .ss-safe-bottom {
padding-bottom: 0; padding-bottom: 0;
padding-bottom: calc(constant(safe-area-inset-bottom) / 5 * 3); padding-bottom: calc(constant(safe-area-inset-bottom) / 5 * 3);
padding-bottom: calc(env(safe-area-inset-bottom) / 5 * 3); padding-bottom: calc(env(safe-area-inset-bottom) / 5 * 3);
} }
/* ================== /* ==================
@ -247,40 +249,40 @@
==================== */ ==================== */
@for $i from 20 through 50 { @for $i from 20 through 60 {
.ss-font-#{$i} { .ss-font-#{$i} {
font-size: $i + rpx; font-size: $i + rpx;
} }
} }
/* ================== /* ==================
按钮 按钮
==================== */ ==================== */
.ss-reset-button { .ss-reset-button {
padding: 0; padding: 0;
margin: 0; margin: 0;
font-size: inherit; font-size: inherit;
background-color: transparent; background-color: transparent;
color: inherit; color: inherit;
position: relative; position: relative;
border: 0rpx; border: 0rpx;
/* #ifndef APP-NVUE */ /* #ifndef APP-NVUE */
display: flex; display: flex;
/* #endif */ /* #endif */
align-items: center; align-items: center;
justify-content: center; justify-content: center;
box-sizing: border-box; box-sizing: border-box;
text-align: center; text-align: center;
text-decoration: none; text-decoration: none;
white-space: nowrap; white-space: nowrap;
vertical-align: baseline; vertical-align: baseline;
transform: translate(0, 0); transform: translate(0, 0);
} }
.ss-reset-button.button-hover { .ss-reset-button.button-hover {
transform: translate(1px, 1px); transform: translate(1px, 1px);
background: none; background: none;
} }
.ss-reset-button::after { .ss-reset-button::after {
border: none; border: none;
} }

View File

@ -1,181 +1,185 @@
import { ref } from 'vue' import { ref } from "vue";
import { defineStore } from 'pinia' import { defineStore } from "pinia";
import $platform from '@/peach/platform' import $platform from "@/peach/platform";
import $router from '@/peach/router' import $router from "@/peach/router";
import user from './user' import user from "./user";
import sys from './sys' import useSysStore from "./sys";
const useAppStore = defineStore( const useAppStore = defineStore(
'app', "app",
() => { () => {
/** /**
* @description 应用信息 * @description 应用信息
* @param string name 应用名称 * @param string name 应用名称
* @param string logo 应用logo * @param string logo 应用logo
* @param string version 应用版本 * @param string version 应用版本
* @param string copyright 版权信息 * @param string copyright 版权信息
* @param string copyrightTime 版权时间 * @param string copyrightTime 版权时间
* @param string cdnurl 静态资源域名 * @param string cdnurl 静态资源域名
* @param string filesystem 文件系统 * @param string filesystem 文件系统
*/ */
const info = ref({ const info = ref({
name: '', name: "",
logo: '', logo: "",
version: '', version: "",
copyright: '', copyright: "",
copytime: '', copytime: "",
cdnurl: '', cdnurl: "",
filesystem: '', filesystem: "",
}) });
/** /**
* @description 平台信息 * @description 平台信息
* @param Array share.methods 分享方式 * @param Array share.methods 分享方式
* @param Object share.forwardInfo 转发信息 * @param Object share.forwardInfo 转发信息
* @param Object share.posterInfo 海报信息 * @param Object share.posterInfo 海报信息
* @param string share.linkAddress 分享链接地址 * @param string share.linkAddress 分享链接地址
* @param number bindMobile 绑定手机号提醒 0: 提醒 1: 不提醒 * @param number bindMobile 绑定手机号提醒 0: 提醒 1: 不提醒
*/ */
const platform = ref({ const platform = ref({
share: { share: {
methods: [], methods: [],
forwardInfo: {}, forwardInfo: {},
posterInfo: {}, posterInfo: {},
linkAddress: '', linkAddress: "",
},
bindMobile: 0,
});
const chat = ref({});
/**
* @description 模板信息
* @param Object basic 基础模板
* @param Object tabbar 底部导航模板
*/
const template = ref({
basic: {
tabbar: {
items: [
{
activeIconUrl:
"http://mall.yudao.iocoder.cn/static/images/1-002.png",
iconUrl: "http://mall.yudao.iocoder.cn/static/images/1-001.png",
text: "首页",
url: "/pages/index/index",
}, },
bindMobile: 0, {
}) activeIconUrl:
"http://mall.yudao.iocoder.cn/static/images/2-002.png",
const chat = ref({}) iconUrl: "http://mall.yudao.iocoder.cn/static/images/2-001.png",
text: "分类",
/** url: "/pages/index/category?id=3",
* @description 模板信息
* @param Object basic 基础模板
* @param Object tabbar 底部导航模板
*/
const template = ref({
basic: {
tabbar: {
items: [
{
activeIconUrl: 'http://mall.yudao.iocoder.cn/static/images/1-002.png',
iconUrl: 'http://mall.yudao.iocoder.cn/static/images/1-001.png',
text: '首页',
url: '/pages/index/index',
},
{
activeIconUrl: 'http://mall.yudao.iocoder.cn/static/images/2-002.png',
iconUrl: 'http://mall.yudao.iocoder.cn/static/images/2-001.png',
text: '分类',
url: '/pages/index/category?id=3',
},
{
activeIconUrl: 'http://mall.yudao.iocoder.cn/static/images/3-002.png',
iconUrl: 'http://mall.yudao.iocoder.cn/static/images/3-001.png',
text: '购物车',
url: '/pages/index/icons',
},
{
activeIconUrl: 'http://mall.yudao.iocoder.cn/static/images/4-002.png',
iconUrl: 'http://mall.yudao.iocoder.cn/static/images/4-001.png',
text: '我的',
url: '/pages/index/user',
},
],
style: {
activeColor: '#fc4141',
bgColor: '#fff',
bgType: 'color',
color: '#282828',
},
theme: 'red',
},
}, },
}) {
activeIconUrl:
// 全局分享信息 "http://mall.yudao.iocoder.cn/static/images/3-002.png",
const shareInfo = ref({}) iconUrl: "http://mall.yudao.iocoder.cn/static/images/3-001.png",
text: "购物车",
// 小程序发货信息管理 0: 没有 1 url: "/pages/index/icons",
const hasWechatTradeManaged = ref(0) },
{
/** activeIconUrl:
* @author Ankkaya "http://mall.yudao.iocoder.cn/static/images/4-002.png",
* @description 小程序初始化 iconUrl: "http://mall.yudao.iocoder.cn/static/images/4-001.png",
* @param {Type} - text: "我的",
* @returns {Type} url: "/pages/index/user",
*/ },
async function init() { ],
// 检查网络 style: {
const networkStatus = await $platform.checkNetwork() activeColor: "#fc4141",
if (!networkStatus) { bgColor: "#fff",
$router.error('NetworkError') bgType: "color",
} color: "#282828",
},
if (true) { theme: "red",
this.info = {
name: '🍑商城',
logo: 'https://static.iocoder.cn/ruoyi-vue-pro-logo.png',
version: '1.0.0',
copyright: '全部开源,个人与企业可 100% 免费使用',
copytime: 'Copyright© 2018-2024',
cdnurl: 'https://file.sheepjs.com', // 云存储域名
filesystem: 'qcloud', // 云存储平台
}
this.platform = {
share: {
methods: ['poster', 'link'],
linkAddress: 'https://shopro.sheepjs.com/#/',
posterInfo: {
user_bg: '/static/img/shop/config/user-poster-bg.png',
goods_bg: '/static/img/shop/config/goods-poster-bg.png',
groupon_bg: '/static/img/shop/config/groupon-poster-bg.png',
},
},
bind_mobile: 0,
}
this.chat = {
chat_domain: 'https://api.shopro.sheepjs.com/chat',
room_id: 'admin',
}
this.has_wechat_trade_managed = 0
// 加载主题
const sysStore = sys()
sysStore.setTheme()
// 模拟用户登录
const userStore = user()
if (userStore.isLogin) {
userStore.loginAfter()
}
return Promise.resolve(true)
} else {
$router.error('InitError', res.msg || '加载失败')
}
}
return {
info,
platform,
chat,
template,
shareInfo,
hasWechatTradeManaged,
init,
}
},
{
persist: {
enabled: true,
strategies: [
{
key: 'app-store',
},
],
}, },
} },
) });
export default useAppStore // 全局分享信息
const shareInfo = ref({});
// 小程序发货信息管理 0: 没有 1
const hasWechatTradeManaged = ref(0);
/**
* @author Ankkaya
* @description 小程序初始化
* @param {Type} -
* @returns {Type}
*/
async function init() {
// 检查网络
const networkStatus = await $platform.checkNetwork();
if (!networkStatus) {
$router.error("NetworkError");
}
if (true) {
this.info = {
name: "🍑商城",
logo: "https://static.iocoder.cn/ruoyi-vue-pro-logo.png",
version: "1.0.0",
copyright: "全部开源,个人与企业可 100% 免费使用",
copytime: "Copyright© 2018-2024",
cdnurl: "https://file.sheepjs.com", // 云存储域名
filesystem: "qcloud", // 云存储平台
};
this.platform = {
share: {
methods: ["poster", "link"],
linkAddress: "https://shopro.sheepjs.com/#/",
posterInfo: {
user_bg: "/static/img/shop/config/user-poster-bg.png",
goods_bg: "/static/img/shop/config/goods-poster-bg.png",
groupon_bg: "/static/img/shop/config/groupon-poster-bg.png",
},
},
bind_mobile: 0,
};
this.chat = {
chat_domain: "https://api.shopro.sheepjs.com/chat",
room_id: "admin",
};
this.has_wechat_trade_managed = 0;
// 加载主题
const sysStore = useSysStore();
sysStore.setTheme();
// 模拟用户登录
const userStore = user();
if (userStore.isLogin) {
userStore.loginAfter();
}
return Promise.resolve(true);
} else {
$router.error("InitError", res.msg || "加载失败");
}
}
return {
info,
platform,
chat,
template,
shareInfo,
hasWechatTradeManaged,
init,
};
},
{
persist: {
enabled: true,
strategies: [
{
key: "app-store",
},
],
},
}
);
export default useAppStore;

View File

@ -1,36 +1,33 @@
import { ref } from 'vue' import { ref } from "vue";
import { defineStore } from 'pinia' import { defineStore } from "pinia";
const useSysStore = defineStore( const useSysStore = defineStore(
'sys', "sys",
() => { () => {
const theme = ref('') const theme = ref("");
const mode = ref('light') const mode = ref("light");
const modeAuto = ref(false) const modeAuto = ref(false);
const fontSize = ref(1) const fontSize = ref(1);
function setTheme(stheme = '') { function setTheme(stheme = "") {
if (theme === '') { console.log("setTheme", stheme);
theme.value = 'orange' theme.value = stheme ? stheme : "orange";
} else {
theme.value = stheme
}
}
return {
theme,
mode,
modeAuto,
fontSize,
setTheme,
}
},
{
persist: {
enabled: true,
strategies: [{ key: 'sys-store' }],
},
} }
)
export default useSysStore return {
theme,
mode,
modeAuto,
fontSize,
setTheme,
};
},
{
persist: {
enabled: true,
strategies: [{ key: "sys-store" }],
},
}
);
export default useSysStore;

182
peach/validate/form.js Normal file
View File

@ -0,0 +1,182 @@
/**
* Validate v1.0.0 通用验证
* @description 项目中用到的表单验证规则
*/
import test from "@/peach/helper/test.js";
// 身份证号
export const idCard = {
rules: [
{
required: true,
errorMessage: "请输入身份证号",
},
{
validateFunction: function (rule, value, data, callback) {
if (!test.idCard(value)) {
callback("身份证号格式不正确");
}
return true;
},
},
],
};
// 手机号
export const mobile = {
rules: [
{
required: true,
errorMessage: "请输入手机号",
},
{
validateFunction: function (rule, value, data, callback) {
if (!test.mobile(value)) {
callback("手机号码格式不正确");
}
return true;
},
},
],
};
// 密码
export const password = {
rules: [
{
required: true,
errorMessage: "请输入密码",
},
{
validateFunction: function (rule, value, data, callback) {
if (!/^(?![0-9]+$)(?![a-zA-Z]+$)[0-9A-Za-z]+\S{5,12}$/.test(value)) {
callback("需包含字母和数字,长度在6-12之间");
}
return true;
},
},
],
};
// 短信验证码
export const code = {
rules: [
{
required: true,
errorMessage: "请输入验证码",
},
],
};
// 真实姓名
export const realName = {
rules: [
{
required: true,
errorMessage: "请输入姓名",
},
{
validateFunction: function (rule, value, data, callback) {
if (!test.chinese(value)) {
callback("请输入汉字");
}
return true;
},
},
],
};
export const taxName = {
rules: [
{
required: true,
errorMessage: "请输入发票抬头名称",
},
{
validateFunction: function (rule, value, data, callback) {
if (!test.chinese(value)) {
callback("请输入汉字");
}
return true;
},
},
],
};
// 税号
export const taxNo = {
rules: [
{
required: true,
errorMessage: "请输入税号",
},
],
};
// 开户行
export const bankName = {
rules: [
{
required: true,
errorMessage: "请输入银行名称",
},
{
validateFunction: function (rule, value, data, callback) {
if (!test.chinese(value)) {
callback("请输入汉字");
}
return true;
},
},
],
};
// 银行卡号
export const bankCode = {
rules: [
{
required: true,
errorMessage: "请输入银行卡号",
},
{
validateFunction: function (rule, value, data, callback) {
if (!test.bankCode(value)) {
callback("请输入正确银行卡号");
}
return true;
},
},
],
};
// 支付宝账号
export const alipayAccount = {
rules: [
{
required: true,
errorMessage: "请输入支付宝账号",
},
{
validateFunction: function (rule, value, data, callback) {
let isEmail = test.email(value);
let isMobile = test.mobile(value);
if (!isEmail && !isMobile) {
callback("请输入正确账号");
}
return true;
},
},
],
};
export default {
mobile,
alipayAccount,
bankCode,
bankName,
realName,
password,
code,
taxNo,
taxName,
};