fix: only allow staff to add products at their own store

refactor: router guard if-else

src/router/index.ts

@@ -97,34 +97,69 @@ const router = createRouter({
 
 router.beforeEach((to, _, next) => {
     const token:string|null = sessionStorage.getItem('token');
-    const role:string|null = sessionStorage.getItem('role')
+    const role:string|null = sessionStorage.getItem('role');
+    const storeId:string|null = sessionStorage.getItem('storeId');
 
     if (to.meta.title) {
         document.title = to.meta.title;
     }
 
-    if (token) {
-        if(to.meta.permission) {
-            if(to.meta.permission.includes(role!)) {
-                next();
-            }
-            else {
-                next('/404');
-            }
-        } else {
-            next()
-        }
-    } else {
-        if(to.path === '/login') {
-            next();
-        }
-        else if(to.path === '/register') {
+    // if (token) {
+    //     if(to.meta.permission) {
+    //         if(to.meta.permission.includes(role!)) {
+    //             if (to.name === 'createProduct') {
+    //                 if (to.params.storeId === storeId) {
+    //                     next();
+    //                 } else {
+    //                     next('/404')
+    //                 }
+    //             } else {
+    //                 next();
+    //             }
+    //         }
+    //         else {
+    //             next('/404');
+    //         }
+    //     } else {
+    //         next()
+    //     }
+    // } else {
+    //     if(to.path === '/login') {
+    //         next();
+    //     }
+    //     else if(to.path === '/register') {
+    //         next();
+    //     }
+    //     else {
+    //         next('/login');
+    //     }
+    // }
+
+    if (!token) {
+        if (to.path === '/login' || to.path === '/register') {
             next();
-        }
-        else {
+        } else {
             next('/login');
         }
+        return;
     }
+
+    if (!to.meta.permission) {
+        next();
+        return;
+    }
+
+    if (!to.meta.permission.includes(role!)) {
+        next('/404');
+        return;
+    }
+
+    if (to.name === 'createProduct' && to.params.storeId !== storeId) {
+        next('/404');
+        return;
+    }
+
+
 });
 
 

src/views/store/StoreDetail.vue

@@ -9,6 +9,7 @@ import ProductItem from "../../components/ProductItem.vue"
 const role = sessionStorage.getItem("role")
 // 从当前router地址中获得storeId参数值
 const storeId = router.currentRoute.value.params.storeId
+const actualStoreId = sessionStorage.getItem("storeId")
 const storeVO = ref()
 const name = ref('')
 const logoUrl = ref('')
@@ -77,7 +78,7 @@ function toBackPage() {
         </el-descriptions>
 
         <el-button class="create-product-button" type="primary" plain
-                   @click="toCreateProductPage()" v-if="role === 'STAFF' || role === 'MANAGER'">新增商品
+                   @click="toCreateProductPage()" v-if="role === 'STAFF' && storeId === actualStoreId">新增商品
         </el-button>
       </div>
     </el-aside>

src/views/user/Login.vue

@@ -41,6 +41,11 @@ function handleLogin() {
       userInfo().then(res => {
         sessionStorage.setItem('name', res.data.result.name)
         sessionStorage.setItem('role', res.data.result.role)
+
+        if (res.data.result.role === 'STAFF' ) {
+          sessionStorage.setItem('storeId', res.data.result.storeId)
+        }
+
         router.push({path: "/allStore"})
       })
     } else if (res.data.code === '400') {