。

src/App.vue

@@ -8,5 +8,6 @@
 
 <script setup>
 import { useDark } from '@vueuse/core'
+import { ConfigProvider as VantConfigProvider } from 'vant'
 const dark = useDark()
 </script>

src/main.js

@@ -40,9 +40,9 @@ import common from './mixins/common'
 
 const app = createApp(App)
 app.use(i18n)
-app.use(createPinia())
 app.use(IonicVue)
 app.use(router)
+app.use(createPinia())
 app.use(http)
 app.use(Vant)
 app.use(toast)

src/router/index.js

@@ -9,28 +9,37 @@ const router = createRouter({
     routes: [
         {
             path: '/',
-            redirect: '/home'
+            redirect: '/home',
+            meta: {
+                allowGuest: true
+            }
         },
         {
             path: '/',
             component: TabsPage,
+            meta: {
+                allowGuest: true
+            },
             children: [
                 {
                     path: '',
-                    redirect: '/home'
+                    redirect: '/home',
+                    meta: {
+                        allowGuest: true
+                    }
                 },
                 {
                     path: 'home',
                     component: () => import('@/views/HomePage.vue'),
                     meta: {
-                        pageType: Page.Every
+                        allowGuest: true
                     }
                 },
                 {
                     path: 'mine',
                     component: () => import('@/views/MinePage.vue'),
                     meta: {
-                        pageType: Page.Every
+                        allowGuest: true
                     }
                 }
             ]
@@ -40,7 +49,8 @@ const router = createRouter({
             name: 'login',
             component: () => import('@/views/LoginPage.vue'),
             meta: {
-                pageType: Page.Login
+                allowGuest: true,
+                guestOnly: true
             }
         },
         {
@@ -48,7 +58,8 @@ const router = createRouter({
             name: 'loginPhone',
             component: () => import('@/views/LoginPhonePage.vue'),
             meta: {
-                pageType: Page.Login
+                allowGuest: true,
+                guestOnly: true
             }
         },
         {
@@ -56,7 +67,8 @@ const router = createRouter({
             name: 'register',
             component: () => import('@/views/RegisterPage.vue'),
             meta: {
-                pageType: Page.Login
+                allowGuest: true,
+                guestOnly: true
             }
         },
         {
@@ -84,7 +96,7 @@ const router = createRouter({
             name: 'productList',
             component: () => import('@/views/ProductListPage.vue'),
             meta: {
-                pageType: Page.Every
+                allowGuest: true
             }
         },
         {
@@ -92,7 +104,7 @@ const router = createRouter({
             name: 'productDetail',
             component: () => import('@/views/ProductDetailPage.vue'),
             meta: {
-                pageType: Page.Every
+                allowGuest: true
             }
         },
         {
@@ -100,7 +112,7 @@ const router = createRouter({
             name: 'productSearch',
             component: () => import('@/views/ProductSearchPage.vue'),
             meta: {
-                pageType: Page.Every
+                allowGuest: true
             }
         },
         {
@@ -130,34 +142,26 @@ const router = createRouter({
         }
     ]
 })
-
-router.beforeEach((to, from, next) => {
-    const userStore = useUserStore()
-    if (to.meta.pageType != Page.Every) {
-        if (!userStore.user && to.meta.pageType !== Page.Login) {
-            userStore
-                .get()
-                .then(() => {
-                    next()
-                })
-                .catch(() => {
-                    showConfirmDialog({
-                        title: '提示',
-                        message: '用户未登录,是否立即登录'
-                    })
-                        .then(() => {
-                            next('/login')
-                        })
-                        .catch(() => {
-                            next(false)
-                        })
-                })
-        } else {
+router.beforeEach(async (to, from, next) => {
+    const { user, get: getUser } = useUserStore()
+    if (!to.meta.allowGuest && !user) {
+        try {
+            await getUser()
             next()
+        } catch (error) {
+            const confirm = await showConfirmDialog({
+                title: '提示',
+                message: '用户未登录,是否立即登录'
+            }).catch(() => {
+                next(false)
+            })
+            if (confirm) {
+                next('/login')
+            }
         }
     } else {
-        if (!userStore.user) {
-            userStore.get()
+        if (!user) {
+            getUser().catch(() => {})
         }
         next()
     }

src/stores/user.js

@@ -36,9 +36,9 @@ export const useUserStore = defineStore('user', () => {
                 })
         })
     }
-    const loginByCode = (phone, code) => {
+    const loginByCode = (phone, code, invitor) => {
         return new Promise((resolve, reject) => {
-            http.post('/auth/phoneLogin', { phone, code })
+            http.post('/auth/phoneLogin', { phone, code, invitor })
                 .then(token => {
                     http.setToken(token)
                     return http.get('/user/my')
@@ -52,9 +52,9 @@ export const useUserStore = defineStore('user', () => {
                 })
         })
     }
-    const register = (phone, code, password) => {
+    const register = (phone, code, password, invitor) => {
         return new Promise((resolve, reject) => {
-            http.post('/auth/register', { phone, code, password })
+            http.post('/auth/register', { phone, code, password, invitor })
                 .then(token => {
                     http.setToken(token)
                     return http.get('/user/my')

src/views/LoginPage.vue

@@ -84,7 +84,6 @@ export default {
     },
     beforeRouteEnter(to, from) {
         fromRoute = from
-        console.log(to, from)
     },
     methods: {
         onSubmit(e) {

src/views/RegisterPage.vue

@@ -94,6 +94,19 @@
                             </div>
                         </template>
                     </van-field>
+                    <van-field
+                        v-model="formData.invitor"
+                        name="邀请码"
+                        placeholder="邀请码(选填)"
+                        type="digit"
+                        clearable
+                    >
+                        <template #left-icon>
+                            <div class="icon-wrapper">
+                                <ion-icon :icon="personAddOutline"></ion-icon>
+                            </div>
+                        </template>
+                    </van-field>
                     <van-cell class="xieyi">
                         <van-checkbox v-model="checked">
                             已阅读并同意
@@ -103,7 +116,7 @@
                     </van-cell>
                 </van-cell-group>
                 <div class="submit">
-                    <van-button radius="4" block type="primary" native-type="submit"> 登录 </van-button>
+                    <van-button radius="4" block type="primary" native-type="submit"> 注册 </van-button>
                 </div>
 
                 <div class="btns">
@@ -117,6 +130,7 @@
 import phone from '../mixins/phone'
 import { ref } from 'vue'
 import { useUserStore } from '../stores/user'
+import { phonePortraitOutline, lockOpenOutline, shieldCheckmarkOutline, personAddOutline } from 'ionicons/icons'
 
 let fromRoute = null
 export default {
@@ -135,7 +149,16 @@ export default {
 
         const userStore = useUserStore()
 
-        return { formData, checked, showPsd, userStore }
+        return {
+            formData,
+            checked,
+            showPsd,
+            userStore,
+            phonePortraitOutline,
+            lockOpenOutline,
+            shieldCheckmarkOutline,
+            personAddOutline
+        }
     },
     beforeRouteEnter(to, from) {
         fromRoute = from
@@ -164,11 +187,12 @@ export default {
             })
 
             this.userStore
-                .register(this.formData.phone, this.formData.code, this.formData.password)
+                .register(this.formData.phone, this.formData.code, this.formData.password, this.formData.invitor)
                 .then(() => {
                     this.$toast.success('注册成功')
                     setTimeout(() => {
                         if (
+                            !fromRoute ||
                             !fromRoute.name ||
                             fromRoute.name === 'register' ||
                             fromRoute.name === 'login' ||
@@ -204,7 +228,16 @@ ion-back-button {
 
 .van-form {
     padding: 30px 40px;
-
+    .icon-wrapper {
+        width: 24px;
+        height: 24px;
+        .f();
+        justify-content: center;
+    }
+    ion-icon {
+        font-size: 20px;
+        color: #a108ff;
+    }
     .title {
         font-size: 24px;
         font-weight: bold;