From 4b1de8bdac9fcc9dda44b5de2942640ef7b923d0 Mon Sep 17 00:00:00 2001
From: unknown <staryou@126.com>
Date: Thu, 23 May 2024 01:38:19 +0800
Subject: [PATCH] =?UTF-8?q?feat(=E7=99=BB=E5=BD=95)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 pages/index/login.vue  | 235 +++++++++++++++++----------
 peach/scss/_tools.scss | 316 ++++++++++++++++++------------------
 peach/store/app.js     | 352 +++++++++++++++++++++--------------------
 peach/store/sys.js     |  59 ++++---
 peach/validate/form.js | 182 +++++++++++++++++++++
 5 files changed, 701 insertions(+), 443 deletions(-)
 create mode 100644 peach/validate/form.js

diff --git a/pages/index/login.vue b/pages/index/login.vue
index eb3a726..d3e9af9 100644
--- a/pages/index/login.vue
+++ b/pages/index/login.vue
@@ -1,100 +1,173 @@
 <template>
-    <pb-layout :leftIcon="''" navbar="inner" :bgStyle="{ backgroundColor: '#fff' }">
-        <view class="login-module">
-            <view>
-                {{ title }}
-            </view>
-            <uni-forms ref="smsLoginRef" v-model="state.model" :rules="state.rules" validateTrigger="bind">
-                <uni-forms-item name="mobile">
-                    <uni-easyinput
-                        placeholder="请输入手机号"
-                        v-model="state.model.mobile"
-                        :inputBorder="false"
-                        type="number"
-                    />
-                </uni-forms-item>
-                <uni-forms-item name="code">
-                    <uni-easyinput
-                        placeholder="验证码"
-                        v-model="state.model.code"
-                        :inputBorder="false"
-                        type="number"
-                        maxlength="4"
-                    >
-                        <template #right>
-                            <button class="ss-reset-button code-btn code-btn-start" @tap="smsLoginSubmit">
-                                获取验证码
-                            </button>
-                        </template>
-                    </uni-easyinput>
-                </uni-forms-item>
-            </uni-forms>
-            <button class="ss-reset-button login-btn-start" @tap="smsLoginSubmit">登录</button>
-        </view>
-    </pb-layout>
+  <pb-layout :leftIcon="''" navbar="inner" :bgStyle="{ backgroundColor: '#fff' }">
+    <view class="login-module ss-p-x-30">
+      <view class="login-title ss-font-56 ss-m-b-72">
+        {{ title }}
+      </view>
+      <uni-forms ref="smsLoginRef" v-model="state.model" :rules="state.rules" validateTrigger="bind">
+        <uni-forms-item name="mobile">
+          <uni-easyinput :styles="state.inputStyle" trim="all" placeholder="请输入手机号" v-model="state.model.mobile"
+            :inputBorder="false" type="number" />
+        </uni-forms-item>
+        <uni-forms-item name="code">
+          <uni-easyinput :styles="state.inputStyle" trim="all" placeholder="验证码" v-model="state.model.code"
+            :inputBorder="false" type="number" maxlength="4">
+            <template #right>
+              <button :disabled="state.isMobileEnd" :class="{ 'code-btn-end': state.isMobileEnd }"
+                class="ss-reset-button code-btn code-btn-start" @tap="getSmsCode('smsLogin', state.model.mobile)">
+                {{ getSmsTimer('smsLogin') }}
+              </button>
+            </template>
+          </uni-easyinput>
+        </uni-forms-item>
+      </uni-forms>
+      <button class="ss-reset-button login-btn-start" @tap="smsLoginSubmit">登录</button>
+      <view class="agreement-box ss-flex ss-row-center" :class="{ shake: state.isShaking }">
+        <label class="radio ss-flex" @tap="onChange">
+          <radio :checked="state.agreeStatus" color="var(--ui-BG-Main)" style="transform: scale(0.8)"
+            @tap.stop="onChange" />
+          <view class="agreement-text ss-flex ss-m-l-8">
+            我已阅读并遵守
+            <view class="tcp-text" @tap.stop="onProtocol('商家入驻协议')"> 《商家入驻协议》 </view>
+          </view>
+        </label>
+      </view>
+    </view>
+  </pb-layout>
 </template>
 
 <script setup>
 import { ref } from 'vue'
+import { code, mobile } from '@/peach/validate/form';
+import { showAuthModal, closeAuthModal, getSmsCode, getSmsTimer } from '@/peach/hooks/useModal';
 
 const title = ref('欢迎登录')
+const smsLoginRef = ref(null)
 
 const state = ref({
-    model: {
-        mobile: '',
-        code: '',
-    },
-    rules: {
-        mobile: {
-            rules: [
-                {
-                    required: true,
-                    errorMessage: '手机号不能为空',
-                },
-                {
-                    pattern: /^1[3-9]\d{9}$/,
-                    errorMessage: '手机号格式错误',
-                },
-            ],
-        },
-        code: {
-            rules: [
-                {
-                    required: true,
-                    errorMessage: '验证码不能为空',
-                },
-                {
-                    pattern: /^\d{4}$/,
-                    errorMessage: '验证码格式错误',
-                },
-            ],
-        },
-    },
+  isMobileEnd: false,
+  agreeStatus: false,
+  isShaking: false,
+  model: {
+    mobile: '',
+    code: '',
+  },
+  rules: {
+    mobile,
+    code
+  },
+  inputStyle: {
+    backgroundColor: '#ECECEC'
+  }
 })
+
+
+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>
 
+<style lang="scss">
+.login-module {
+
+  .uni-easyinput {
+
+    ::v-deep .uni-easyinput__content {
+      border-radius: 41rpx;
+      padding: 0 10rpx;
+    }
+  }
+}
+</style>
+
 <style lang="scss" scoped>
 .login-module {
-    .login-btn-start {
-        width: 158rpx;
-        height: 56rpx;
-        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;
+  margin-top: 50%;
+  overflow: hidden;
+
+  .login-title {
+    color: '#1818d';
+    font-weight: 600;
+  }
+
+  .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;
-        height: 56rpx;
-        line-height: normal;
-        border: 2rpx solid var(--ui-BG-Main);
-        border-radius: 28rpx;
-        font-size: 26rpx;
-        font-weight: 400;
+
+    .agreement-text {
+      font-size: 26rpx;
+      font-weight: 500;
+      color: #999999;
+
+      .tcp-text {
         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>
diff --git a/peach/scss/_tools.scss b/peach/scss/_tools.scss
index d854a67..75ea3f4 100644
--- a/peach/scss/_tools.scss
+++ b/peach/scss/_tools.scss
@@ -3,8 +3,8 @@
  ==================== */
 
 .ss-bg-opactity-block {
-    background-color: rgba(#000, 0.2);
-    color: #fff;
+  background-color: rgba(#000, 0.2);
+  color: #fff;
 }
 
 /* ==================
@@ -12,80 +12,80 @@
  ==================== */
 
 .ss-flex {
-    display: flex;
-    flex-direction: row;
-    align-items: center;
+  display: flex;
+  flex-direction: row;
+  align-items: center;
 }
 
 .ss-flex-1 {
-    flex: 1;
+  flex: 1;
 }
 
 .ss-flex-col {
-    display: flex;
-    flex-direction: column;
+  display: flex;
+  flex-direction: column;
 }
 
 .ss-flex-wrap {
-    flex-wrap: wrap;
+  flex-wrap: wrap;
 }
 
 .ss-flex-nowrap {
-    flex-wrap: nowrap;
+  flex-wrap: nowrap;
 }
 
 .ss-col-center {
-    align-items: center;
+  align-items: center;
 }
 
 .ss-col-top {
-    align-items: flex-start;
+  align-items: flex-start;
 }
 
 .ss-col-bottom {
-    align-items: flex-end;
+  align-items: flex-end;
 }
 
 .ss-col-stretch {
-    align-items: stretch;
+  align-items: stretch;
 }
 
 .ss-row-center {
-    justify-content: center;
+  justify-content: center;
 }
 
 .ss-row-left {
-    justify-content: flex-start;
+  justify-content: flex-start;
 }
 
 .ss-row-right {
-    justify-content: flex-end;
+  justify-content: flex-end;
 }
 
 .ss-row-between {
-    justify-content: space-between;
+  justify-content: space-between;
 }
 
 .ss-row-around {
-    justify-content: space-around;
+  justify-content: space-around;
 }
 
 .ss-self-start {
-    align-self: flex-start;
+  align-self: flex-start;
 }
 
 .ss-self-end {
-    align-self: flex-end;
+  align-self: flex-end;
 }
 
 .ss-self-center {
-    align-self: center;
+  align-self: center;
 }
 .ss-h-100 {
-    height: 100%;
+  height: 100%;
 }
 .ss-w-100 {
-    width: 100%;
+  width: 100%;
 }
 
 /* ==================
@@ -94,60 +94,60 @@
 	
  ==================== */
 @for $i from 0 through 100 {
-    // 只要双数和能被5除尽的数
-    @if $i % 2==0 or $i % 5==0 {
-        // 得出：u-margin-30或者u-m-30
-        .ss-margin-#{$i},
-        .ss-m-#{$i} {
-            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;
-            }
-        }
+  // 只要双数和能被5除尽的数
+  @if $i % 2==0 or $i % 5==0 {
+    // 得出：u-margin-30或者u-m-30
+    .ss-margin-#{$i},
+    .ss-m-#{$i} {
+      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;
+      }
+    }
+  }
 }
 
 /* ==================
@@ -156,35 +156,37 @@
 	
  ==================== */
 @for $i from 0 through 100 {
-    // 只要双数和能被5除尽的数
-    @if $i % 2==0 or $i % 5==0 {
-        .ss-radius-#{$i},
-        .ss-r-#{$i} {
-            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;
-            }
-        }
+  // 只要双数和能被5除尽的数
+  @if $i % 2==0 or $i % 5==0 {
+    .ss-radius-#{$i},
+    .ss-r-#{$i} {
+      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;
+      }
+    }
+  }
 }
 
 /* ==================
@@ -194,41 +196,41 @@
 	
  ==================== */
 @mixin ellipsis($rowCount: 1) {
-    // @if $rowCount <=1 {
-    //   overflow: hidden;
-    //   text-overflow: ellipsis;
-    //   white-space: nowrap;
-    // } @else {
-    //   min-width: 0;
-    //   overflow: hidden;
-    //   text-overflow: ellipsis;
-    //   display: -webkit-box;
-    //   -webkit-line-clamp: $rowCount;
-    //   -webkit-box-orient: vertical;
-    // }
-    min-width: 0;
-    overflow: hidden;
-    text-overflow: ellipsis;
-    display: -webkit-box;
-    -webkit-line-clamp: $rowCount;
-    -webkit-box-orient: vertical;
+  // @if $rowCount <=1 {
+  //   overflow: hidden;
+  //   text-overflow: ellipsis;
+  //   white-space: nowrap;
+  // } @else {
+  //   min-width: 0;
+  //   overflow: hidden;
+  //   text-overflow: ellipsis;
+  //   display: -webkit-box;
+  //   -webkit-line-clamp: $rowCount;
+  //   -webkit-box-orient: vertical;
+  // }
+  min-width: 0;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  display: -webkit-box;
+  -webkit-line-clamp: $rowCount;
+  -webkit-box-orient: vertical;
 }
 
 @for $i from 1 through 6 {
-    .ss-line-#{$i} {
-        @include ellipsis($i);
-    }
+  .ss-line-#{$i} {
+    @include ellipsis($i);
+  }
 }
 
 /* ==================
     hover
  ==================== */
 .ss-hover-class {
-    background-color: $gray-c;
-    opacity: 0.6;
+  background-color: $gray-c;
+  opacity: 0.6;
 }
 .ss-hover-btn {
-    transform: translate(1px, 1px);
+  transform: translate(1px, 1px);
 }
 
 /* ==================
@@ -236,9 +238,9 @@
  ==================== */
 
 .ss-safe-bottom {
-    padding-bottom: 0;
-    padding-bottom: calc(constant(safe-area-inset-bottom) / 5 * 3);
-    padding-bottom: calc(env(safe-area-inset-bottom) / 5 * 3);
+  padding-bottom: 0;
+  padding-bottom: calc(constant(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 {
-    .ss-font-#{$i} {
-        font-size: $i + rpx;
-    }
+@for $i from 20 through 60 {
+  .ss-font-#{$i} {
+    font-size: $i + rpx;
+  }
 }
 
 /* ==================
     按钮
  ==================== */
 .ss-reset-button {
-    padding: 0;
-    margin: 0;
-    font-size: inherit;
-    background-color: transparent;
-    color: inherit;
-    position: relative;
-    border: 0rpx;
-    /* #ifndef APP-NVUE */
-    display: flex;
-    /* #endif */
-    align-items: center;
-    justify-content: center;
-    box-sizing: border-box;
-    text-align: center;
-    text-decoration: none;
-    white-space: nowrap;
-    vertical-align: baseline;
-    transform: translate(0, 0);
+  padding: 0;
+  margin: 0;
+  font-size: inherit;
+  background-color: transparent;
+  color: inherit;
+  position: relative;
+  border: 0rpx;
+  /* #ifndef APP-NVUE */
+  display: flex;
+  /* #endif */
+  align-items: center;
+  justify-content: center;
+  box-sizing: border-box;
+  text-align: center;
+  text-decoration: none;
+  white-space: nowrap;
+  vertical-align: baseline;
+  transform: translate(0, 0);
 }
 .ss-reset-button.button-hover {
-    transform: translate(1px, 1px);
-    background: none;
+  transform: translate(1px, 1px);
+  background: none;
 }
 
 .ss-reset-button::after {
-    border: none;
+  border: none;
 }
diff --git a/peach/store/app.js b/peach/store/app.js
index 7d1917a..a56ba34 100644
--- a/peach/store/app.js
+++ b/peach/store/app.js
@@ -1,181 +1,185 @@
-import { ref } from 'vue'
-import { defineStore } from 'pinia'
-import $platform from '@/peach/platform'
-import $router from '@/peach/router'
-import user from './user'
-import sys from './sys'
+import { ref } from "vue";
+import { defineStore } from "pinia";
+import $platform from "@/peach/platform";
+import $router from "@/peach/router";
+import user from "./user";
+import useSysStore from "./sys";
 
 const useAppStore = defineStore(
-    'app',
-    () => {
-        /**
-         * @description 应用信息
-         * @param string name 应用名称
-         * @param string logo 应用logo
-         * @param string version 应用版本
-         * @param string copyright 版权信息
-         * @param string copyrightTime 版权时间
-         * @param string cdnurl 静态资源域名
-         * @param string filesystem 文件系统
-         */
-        const info = ref({
-            name: '',
-            logo: '',
-            version: '',
-            copyright: '',
-            copytime: '',
-            cdnurl: '',
-            filesystem: '',
-        })
+  "app",
+  () => {
+    /**
+     * @description 应用信息
+     * @param string name 应用名称
+     * @param string logo 应用logo
+     * @param string version 应用版本
+     * @param string copyright 版权信息
+     * @param string copyrightTime 版权时间
+     * @param string cdnurl 静态资源域名
+     * @param string filesystem 文件系统
+     */
+    const info = ref({
+      name: "",
+      logo: "",
+      version: "",
+      copyright: "",
+      copytime: "",
+      cdnurl: "",
+      filesystem: "",
+    });
 
-        /**
-         * @description 平台信息
-         * @param Array share.methods 分享方式
-         * @param Object share.forwardInfo 转发信息
-         * @param Object share.posterInfo 海报信息
-         * @param string share.linkAddress 分享链接地址
-         * @param number bindMobile 绑定手机号提醒 0: 提醒 1: 不提醒
-         */
-        const platform = ref({
-            share: {
-                methods: [],
-                forwardInfo: {},
-                posterInfo: {},
-                linkAddress: '',
+    /**
+     * @description 平台信息
+     * @param Array share.methods 分享方式
+     * @param Object share.forwardInfo 转发信息
+     * @param Object share.posterInfo 海报信息
+     * @param string share.linkAddress 分享链接地址
+     * @param number bindMobile 绑定手机号提醒 0: 提醒 1: 不提醒
+     */
+    const platform = ref({
+      share: {
+        methods: [],
+        forwardInfo: {},
+        posterInfo: {},
+        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,
-        })
-
-        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',
-                        },
-                        {
-                            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/2-002.png",
+              iconUrl: "http://mall.yudao.iocoder.cn/static/images/2-001.png",
+              text: "分类",
+              url: "/pages/index/category?id=3",
             },
-        })
-
-        // 全局分享信息
-        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 = 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',
-                },
-            ],
+            {
+              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",
         },
-    }
-)
+      },
+    });
 
-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;
diff --git a/peach/store/sys.js b/peach/store/sys.js
index 7c1e96a..185572f 100644
--- a/peach/store/sys.js
+++ b/peach/store/sys.js
@@ -1,36 +1,33 @@
-import { ref } from 'vue'
-import { defineStore } from 'pinia'
+import { ref } from "vue";
+import { defineStore } from "pinia";
 
 const useSysStore = defineStore(
-    'sys',
-    () => {
-        const theme = ref('')
-        const mode = ref('light')
-        const modeAuto = ref(false)
-        const fontSize = ref(1)
+  "sys",
+  () => {
+    const theme = ref("");
+    const mode = ref("light");
+    const modeAuto = ref(false);
+    const fontSize = ref(1);
 
-        function setTheme(stheme = '') {
-            if (theme === '') {
-                theme.value = 'orange'
-            } else {
-                theme.value = stheme
-            }
-        }
-
-        return {
-            theme,
-            mode,
-            modeAuto,
-            fontSize,
-            setTheme,
-        }
-    },
-    {
-        persist: {
-            enabled: true,
-            strategies: [{ key: 'sys-store' }],
-        },
+    function setTheme(stheme = "") {
+      console.log("setTheme", stheme);
+      theme.value = stheme ? stheme : "orange";
     }
-)
 
-export default useSysStore
+    return {
+      theme,
+      mode,
+      modeAuto,
+      fontSize,
+      setTheme,
+    };
+  },
+  {
+    persist: {
+      enabled: true,
+      strategies: [{ key: "sys-store" }],
+    },
+  }
+);
+
+export default useSysStore;
diff --git a/peach/validate/form.js b/peach/validate/form.js
new file mode 100644
index 0000000..8768e01
--- /dev/null
+++ b/peach/validate/form.js
@@ -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,
+};