重构分配用户页面，面包屑增加切换动画，取消页面过渡动画，防止开发环境白屏，源码地址修改，图标icon菜单改为配置

src/components/Breadcrumb/index.vue

@@ -1,13 +1,13 @@
 <template>
   <el-breadcrumb class="app-breadcrumb" separator="/">
-    <!-- <transition-group name="breadcrumb"> -->
+    <transition-group name="breadcrumb">
       <el-breadcrumb-item v-for="(item, index) in levelList" :key="item.path">
         <span v-if="item.redirect === 'noRedirect' || index == levelList.length - 1" class="no-redirect">{{ item.meta.title }}</span>
         <span v-else @click.prevent="handleLink(item)" style="cursor: pointer">
           {{ item.meta.title }}
         </span>
       </el-breadcrumb-item>
-    <!-- </transition-group> -->
+    </transition-group>
   </el-breadcrumb>
 </template>
 
@@ -69,4 +69,21 @@ getBreadcrumb()
 .mobile .app-breadcrumb.el-breadcrumb {
   display: none;
 }
+
+.breadcrumb-move, /* 对移动中的元素应用的过渡 */
+.breadcrumb-enter-active,
+.breadcrumb-leave-active {
+  transition: all 0.5s ease;
+}
+.breadcrumb-enter-from,
+.breadcrumb-leave-to {
+  opacity: 0;
+  transform: translateX(30px);
+}
+
+/* 确保将离开的元素从布局流中删除
+  以便能够正确地计算移动的动画。 */
+.breadcrumb-leave-active {
+  position: absolute;
+}
 </style>

src/components/Zr/Git/index.vue

@@ -6,15 +6,15 @@
 <script>
 export default {
   setup() {
-    const url = ref("https://gitee.com/izory/ZrAdminNetCore");
+    const url = ref('https://gitee.com/wenyongda/ZRAdmin-vue')
 
     function goto() {
-      window.open(url.value);
+      window.open(url.value)
     }
 
     return {
-      goto,
+      goto
-    };
+    }
-  },
+  }
-};
+}
 </script>

src/layout/index.vue

@@ -20,11 +20,11 @@
       </el-header>
       <el-main class="app-main">
         <router-view v-slot="{ Component, route }">
-          <transition name="fade-transform" mode="out-in">
+          <!-- <transition name="fade-transform" mode="out-in"> -->
           <keep-alive :include="cachedViews">
             <component v-if="!route.meta.link" :is="Component" :key="route.path" />
           </keep-alive>
-          </transition>
+          <!-- </transition> -->
         </router-view>
         <iframe-toggle />
       </el-main>

src/router/index.js

@@ -104,23 +104,23 @@ export const constantRoutes = [
         meta: { title: '通知中心', icon: 'Bell' }
       }
     ]
-  },
+  }
   // 不用可删掉
-  {
+  // {
-    path: '',
+  //   path: '',
-    component: Layout,
+  //   component: Layout,
-    hidden: false,
+  //   hidden: false,
-    meta: { title: '组件示例', icon: 'icon', noCache: 'fasle' },
+  //   meta: { title: '组件示例', icon: 'icon', noCache: 'fasle' },
-    children: [
+  //   children: [
-      {
+  //     {
-        path: 'icon',
+  //       path: 'icon',
-        component: () => import('@/views/components/icons/index'),
+  //       component: () => import('@/views/components/icons/index'),
-        //component: () => import('@/views/business/GenDemo'),
+  //       //component: () => import('@/views/business/GenDemo'),
-        name: 'icon',
+  //       name: 'icon',
-        meta: { title: '图标icon', icon: 'icon1', noCache: 'fasle', titleKey: 'menu.icon' }
+  //       meta: { title: '图标icon', icon: 'icon1', noCache: 'fasle', titleKey: 'menu.icon' }
-      }
+  //     }
-    ]
+  //   ]
-  }
+  // }
 ]
 
 const router = createRouter({

src/views/system/role/index.vue

@@ -81,7 +81,7 @@
     <pagination v-show="total > 0" :total="total" v-model:page="queryParams.pageNum" v-model:limit="queryParams.pageSize" @pagination="getList" />
 
     <!-- 角色菜单弹框 -->
-    <el-dialog title="角色权限分配" v-model="showRoleScope" width="500px">
+    <el-dialog title="角色权限分配" v-model="showRoleScope" width="500px" draggable>
       <el-form :model="form" label-width="80px">
         <el-form-item label="菜单搜索">
           <el-input placeholder="请输入关键字进行过滤" v-model="searchText"></el-input>
@@ -112,7 +112,7 @@
     </el-dialog>
 
     <!-- 添加或修改角色配置对话框 -->
-    <el-dialog :title="title" v-model="open" width="600px" append-to-body>
+    <el-dialog :title="title" v-model="open" width="600px" append-to-body draggable>
       <el-form ref="formRef" :model="form" :rules="rules" label-width="80px">
         <el-row>
           <el-col :lg="12">

src/views/system/rolefields/index.vue

@@ -0,0 +1,31 @@
+<template>
+  <div class="app-container">
+    <el-card v-loading="cardLoading">
+      <el-page-header @back="goBack">
+        <template #content>
+          <el-row :gutter="10">
+            <el-col :span="1.5">
+              <el-button type="default" plain icon="Refresh" @click="handleInit"> 初始化 </el-button>
+            </el-col>
+          </el-row>
+        </template>
+      </el-page-header>
+      <el-divider />
+    </el-card>
+  </div>
+</template>
+
+<script setup lang="ts">
+import useTagsViewStore from '@/store/modules/tagsView.js'
+const router = useRouter()
+const route = useRoute()
+const cardLoading = ref(false)
+const goBack = () => {
+  useTagsViewStore().delView(router.currentRoute.value)
+  router.push('/system/role')
+}
+console.log(route.query.roleId)
+const handleInit = () => {}
+</script>
+
+<style scoped></style>

src/views/system/roleusers/index.vue

@@ -1,5 +1,26 @@
 <template>
   <div class="app-container">
+    <el-card v-loading="cardLoading">
+      <el-page-header @back="handleClose">
+        <template #content>
+          <el-row :gutter="10">
+            <el-col :span="1.5">
+              <el-button type="primary" plain icon="plus" @click="handleGetUserTable" v-hasPermi="['system:roleusers:add']">
+                {{ $t('btn.add') }}
+              </el-button>
+            </el-col>
+            <el-col :span="1.5">
+              <el-button type="danger" plain icon="circle-close" @click="cancelAuthUserAll" v-hasPermi="['system:roleusers:remove']">
+                {{ $t('btn.multi') }}{{ $t('btn.cancel') }}{{ $t('btn.authorize') }}
+              </el-button>
+            </el-col>
+            <!-- <el-col :span="1.5">
+          <el-button type="warning" plain icon="close" @click="handleClose">{{ $t('btn.close') }}</el-button>
+        </el-col> -->
+          </el-row>
+        </template>
+      </el-page-header>
+      <el-divider />
       <el-form :inline="true" @submit.prevent>
         <el-form-item label="角色名">
           <el-input v-model="roleUserQueryParams.roleName" disabled />
@@ -21,22 +42,6 @@
         </el-form-item>
       </el-form>
 
-    <el-row :gutter="10" class="mb8">
-      <el-col :span="1.5">
-        <el-button type="primary" plain icon="plus" @click="handleGetUserTable" v-hasPermi="['system:roleusers:add']">
-          {{ $t('btn.add') }}
-        </el-button>
-      </el-col>
-      <el-col :span="1.5">
-        <el-button type="danger" plain icon="circle-close" @click="cancelAuthUserAll" v-hasPermi="['system:roleusers:remove']">
-          {{ $t('btn.multi') }}{{ $t('btn.cancel') }}{{ $t('btn.authorize') }}
-        </el-button>
-      </el-col>
-      <el-col :span="1.5">
-        <el-button type="warning" plain icon="close" @click="handleClose">{{ $t('btn.close') }}</el-button>
-      </el-col>
-    </el-row>
-
       <el-table
         ref="roleUserTableRef"
         v-loading="loading"
@@ -122,6 +127,7 @@
           </div>
         </template>
       </el-dialog>
+    </el-card>
   </div>
 </template>
 <script setup name="roleUsers">