fix: "账户操作页面路由优化"

src/components/SimpleHeader.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="block">
-    <header class="simple-header van-hairline--bottom" :style="{position:isFixed?'fixed':'relative'}">
+    <header class="simple-header van-hairline--bottom" :style="{ position: isFixed ? 'fixed' : 'relative' }">
       <i v-if="!isback" class="nbicon nbfanhui" @click="goBack"></i>
       <!-- <i v-else>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</i> -->
       <i v-else></i>
@@ -28,9 +28,14 @@ export default {
       default: false
     },
     // 是否固定在顶部
-    isFixed:{
+    isFixed: {
       type: Boolean,
       default: true
+    },
+    // 锁定要跳转的页面路径
+    targetPath: {
+      type: String,
+      default: ''
     }
   },
   emits: ['callback'],
@@ -38,7 +43,9 @@ export default {
     const isback = ref(props.noback)
     const router = useRouter()
     const goBack = () => {
-      if (!props.back) {
+      if (props.targetPath) {
+        router.replace({ path: props.targetPath })
+      } else if (!props.back) {
         router.go(-1)
       } else {
         router.push({ path: props.back })
@@ -54,30 +61,34 @@ export default {
 </script>
 
 <style lang="less" scoped>
-  @import '../common/style/mixin';
-  .simple-header {
-    // position: fixed;
-    top: 0;
-    left: 0;
-    z-index: 999;
-    .fj();
-    .wh(100%, 44px);
-    line-height: 44px;
-    padding: 0 10px;
-    .boxSizing();
-    color: #404d74;
-    background: #fff;
-    .simple-header-name {
-      white-space: nowrap;
-      font-size: 16px;
-      font-weight: 600;
-    }
-  }
-  .block {
-    width: 100%;
-    height: 44px;
-  }
-  .moreIcon {
-    visibility: hidden;
+@import '../common/style/mixin';
+
+.simple-header {
+  // position: fixed;
+  top: 0;
+  left: 0;
+  z-index: 999;
+  .fj();
+  .wh(100%, 44px);
+  line-height: 44px;
+  padding: 0 10px;
+  .boxSizing();
+  color: #404d74;
+  background: #fff;
+
+  .simple-header-name {
+    white-space: nowrap;
+    font-size: 16px;
+    font-weight: 600;
   }
+}
+
+.block {
+  width: 100%;
+  height: 44px;
+}
+
+.moreIcon {
+  visibility: hidden;
+}
 </style>

src/router/index.js

@@ -516,6 +516,18 @@ const router = createRouter({
 });
 // 路由守卫处理
 router.beforeEach((to, from, next) => {
+  // 从账户操作页面回到home页面
+  if (from.name === "accountOperation" && to.name === "home") {
+    // router.push("/home");
+    location.reload();
+    // 阻止重定向回 账户操作页
+    if (to.path === '/accountOperation') {
+      next(false);
+    } else {
+      next();
+    }
+  }
+
   // 页面带有不需要识别登录状态的跳过登录验证
   if (to.meta.noLogin) {
     next();

src/views/accountOperation/index.vue

@@ -58,8 +58,10 @@ export default {
     onMounted(async () => { });
     const pushPageList = (url) => {
       router.push(url);
-    }
-    return { pushPageList };
+    };
+    return { 
+      pushPageList,
+    };
   }
 };
 </script>

src/views/accountPer/add.vue

@@ -185,7 +185,8 @@ export default {
         const { data } = await updataLoginUser(params);
         if (data.code === "00000") {
           Toast.success(t("accountPer.successfullyModifiedTheAccount"));
-          router.push("/accountPer");
+          // router.push("/accountPer");
+          router.replace("/accountPer");
         } else {
           Toast.fail(t("accountPer.failedToModifyTheAccount"), data.message);
         }
@@ -194,7 +195,8 @@ export default {
         const { data } = await addLoginUser(params);
         if (data.code === "00000") {
           Toast.success(t("accountPer.accountAddedSuccessfully"));
-          router.push("/accountPer");
+          // router.push("/accountPer");
+          router.replace("/accountPer");
         } else {
           Toast.fail(t("accountPer.failedToAddAccount"), data.message);
         }

src/views/accountPer/index.vue

@@ -2,6 +2,9 @@
   <!-- 账号权限 -->
   <div class="accountPerPage flex-col">
     <s-header :name="$t('accountPer.accountPermission')" :noback="false"></s-header>
+    <!-- <s-header :name="$t('accountPer.accountPermission')" :noback="false" targetPath="/accountOperation"></s-header> -->
+    <!-- <van-nav-bar :title="$t('accountPer.accountPermission')" left-text="" left-arrow @click-left="onClickLeft" /> -->
+
     <div class="accountPerBox flex-col">
       <div class="searchRow flex-row justify-between">
         <div class="flex-col">
@@ -67,6 +70,7 @@ import { useRouter } from "vue-router";
 export default {
   name: 'accountPer',
   components: { sHeader, accountPerSearch },
+  // components: { accountPerSearch },
   setup() {
     const router = useRouter();
     const searchRef = ref(null);
@@ -117,7 +121,12 @@ export default {
     const accountClick = (item) => {
       localStorage.setItem('accoutPerSet', JSON.stringify(item));
       router.push('/accountPerAdd');
-    }
+    };
+
+    // 回到上一页 账户操作页
+    // const onClickLeft = () => {
+    //   router.push('/accountOperation');
+    // };
     return {
       searchRef,
       searchClick,
@@ -127,6 +136,7 @@ export default {
       accountPerList,
       ...toRefs(searchParams),
       accountClick,
+      // onClickLeft,
     };
   },
 };

src/views/role/add.vue

@@ -173,7 +173,8 @@ export default {
       const { data } = await addSysRole(params);
       if (data.code === "00000") {
         Toast.success(t("role.roleAddedSuccessfully"));
-        router.push("/role");
+        // router.push("/role");
+        router.replace("/role");
       } else {
         Toast.fail(`${t("role.failedToAddRole")} ${data.message}`);
       }
@@ -189,7 +190,8 @@ export default {
       const { data } = await updateSysRole(params);
       if (data.code === "00000") {
         Toast.success(t("role.successfullyModifiedRole"));
-        router.go(-1);
+        // router.go(-1);
+        router.replace("/role");
       } else {
         Toast.fail(`${t("role.failedToModifyRole")} ${data.message}`);
       }

src/views/role/index.vue

@@ -2,6 +2,9 @@
   <!-- 角色权限设置 -->
   <div class="accountPerPage flex-col">
     <s-header :name="$t('role.rolePermissionSettings')" :noback="false"></s-header>
+    <!-- <s-header :name="$t('role.rolePermissionSettings')" :noback="false" targetPath="/accountPer"></s-header> -->
+    <!-- <van-nav-bar :title="$t('role.rolePermissionSettings')" left-text="" left-arrow @click-left="onClickLeft" /> -->
+
     <div class="accountPerBox flex-col">
       <div class="searchRow flex-row justify-between">
         <div class="flex-col">
@@ -154,7 +157,13 @@ export default {
         searchGetList();
       } else { Toast.fail(data.message); }
     }
-    const roleEdit = async (item) => { localStorage.setItem('roleItem', JSON.stringify(item)); router.push('/roleSet'); }
+    const roleEdit = async (item) => { localStorage.setItem('roleItem', JSON.stringify(item)); router.push('/roleSet'); };
+
+    // // 回到上一页 账号权限页
+    // const onClickLeft = () => {
+    //   router.push('/accountPer');
+    // };
+
     return {
       searchRef,
       searchClick,
@@ -168,6 +177,7 @@ export default {
       operCheck,
       roleEdit,
       ...toRefs(searchParams),
+      // onClickLeft,
     };
   },
 };