feat: 菜单增加单独的动画选择机制

Author: pixelmaxQm

server/model/system/sys_base_menu.go

@@ -6,35 +6,36 @@ import (
 
 type SysBaseMenu struct {
 	global.GVA_MODEL
-	MenuLevel     uint                                       `json:"-"`
-	ParentId      uint                                       `json:"parentId" gorm:"comment:父菜单ID"`     // 父菜单ID
-	Path          string                                     `json:"path" gorm:"comment:路由path"`        // 路由path
-	Name          string                                     `json:"name" gorm:"comment:路由name"`        // 路由name
-	Hidden        bool                                       `json:"hidden" gorm:"comment:是否在列表隐藏"`     // 是否在列表隐藏
-	Component     string                                     `json:"component" gorm:"comment:对应前端文件路径"` // 对应前端文件路径
-	Sort          int                                        `json:"sort" gorm:"comment:排序标记"`          // 排序标记
-	Meta          `json:"meta" gorm:"embedded;comment:附加属性"` // 附加属性
-	SysAuthoritys []SysAuthority                             `json:"authoritys" gorm:"many2many:sys_authority_menus;"`
-	Children      []SysBaseMenu                              `json:"children" gorm:"-"`
-	Parameters    []SysBaseMenuParameter                     `json:"parameters"`
-	MenuBtn       []SysBaseMenuBtn                           `json:"menuBtn"`
+	MenuLevel     uint                   `json:"-"`
+	ParentId      uint                   `json:"parentId" gorm:"comment:父菜单ID"`          // 父菜单ID
+	Path          string                 `json:"path" gorm:"comment:路由path"`              // 路由path
+	Name          string                 `json:"name" gorm:"comment:路由name"`              // 路由name
+	Hidden        bool                   `json:"hidden" gorm:"comment:是否在列表隐藏"`      // 是否在列表隐藏
+	Component     string                 `json:"component" gorm:"comment:对应前端文件路径"` // 对应前端文件路径
+	Sort          int                    `json:"sort" gorm:"comment:排序标记"`              // 排序标记
+	Meta          `json:"meta" gorm:"embedded;comment:附加属性"`                            // 附加属性
+	SysAuthoritys []SysAuthority         `json:"authoritys" gorm:"many2many:sys_authority_menus;"`
+	Children      []SysBaseMenu          `json:"children" gorm:"-"`
+	Parameters    []SysBaseMenuParameter `json:"parameters"`
+	MenuBtn       []SysBaseMenuBtn       `json:"menuBtn"`
 }
 
 type Meta struct {
-	ActiveName  string `json:"activeName" gorm:"comment:高亮菜单"`
-	KeepAlive   bool   `json:"keepAlive" gorm:"comment:是否缓存"`           // 是否缓存
-	DefaultMenu bool   `json:"defaultMenu" gorm:"comment:是否是基础路由（开发中）"` // 是否是基础路由（开发中）
-	Title       string `json:"title" gorm:"comment:菜单名"`                // 菜单名
-	Icon        string `json:"icon" gorm:"comment:菜单图标"`                // 菜单图标
-	CloseTab    bool   `json:"closeTab" gorm:"comment:自动关闭tab"`         // 自动关闭tab
+	ActiveName     string `json:"activeName" gorm:"comment:高亮菜单"`
+	KeepAlive      bool   `json:"keepAlive" gorm:"comment:是否缓存"`                 // 是否缓存
+	DefaultMenu    bool   `json:"defaultMenu" gorm:"comment:是否是基础路由（开发中）"` // 是否是基础路由（开发中）
+	Title          string `json:"title" gorm:"comment:菜单名"`                       // 菜单名
+	Icon           string `json:"icon" gorm:"comment:菜单图标"`                      // 菜单图标
+	CloseTab       bool   `json:"closeTab" gorm:"comment:自动关闭tab"`               // 自动关闭tab
+	TransitionType string `json:"transitionType" gorm:"comment:路由切换动画"`        // 路由切换动画
 }
 
 type SysBaseMenuParameter struct {
 	global.GVA_MODEL
 	SysBaseMenuID uint
 	Type          string `json:"type" gorm:"comment:地址栏携带参数为params还是query"` // 地址栏携带参数为params还是query
-	Key           string `json:"key" gorm:"comment:地址栏携带参数的key"`            // 地址栏携带参数的key
-	Value         string `json:"value" gorm:"comment:地址栏携带参数的值"`            // 地址栏携带参数的值
+	Key           string `json:"key" gorm:"comment:地址栏携带参数的key"`              // 地址栏携带参数的key
+	Value         string `json:"value" gorm:"comment:地址栏携带参数的值"`             // 地址栏携带参数的值
 }
 
 func (SysBaseMenu) TableName() string {

server/service/system/sys_base_menu.go

@@ -72,6 +72,7 @@ func (baseMenuService *BaseMenuService) UpdateBaseMenu(menu system.SysBaseMenu)
 	var oldMenu system.SysBaseMenu
 	upDateMap := make(map[string]interface{})
 	upDateMap["keep_alive"] = menu.KeepAlive
+	upDateMap["transition_type"] = menu.TransitionType
 	upDateMap["close_tab"] = menu.CloseTab
 	upDateMap["default_menu"] = menu.DefaultMenu
 	upDateMap["parent_id"] = menu.ParentId

web/src/view/layout/index.vue

@@ -34,7 +34,7 @@
               id="gva-base-load-dom"
               class="gva-body-h bg-gray-50 dark:bg-slate-800"
             >
-              <transition mode="out-in" :name="config.transition_type">
+              <transition mode="out-in" :name="route.meta.transitionType || config.transition_type">
                 <keep-alive :include="routerStore.keepAliveRouters">
                   <component :is="Component" :key="route.fullPath" />
                 </keep-alive>

web/src/view/superAdmin/menu/menu.vue

@@ -300,6 +300,34 @@
               </el-select>
             </el-form-item>
           </el-col>
+          <el-col :span="8">
+            <el-form-item>
+              <template #label>
+                <div>
+                  <span> 路由切换动画 </span>
+                  <el-tooltip
+                      content="如果设置了路由切换动画，在本路由下的动画优先级高于全局动画切换优先级。"
+                      placement="top"
+                      effect="light"
+                  >
+                    <el-icon><QuestionFilled /></el-icon>
+                  </el-tooltip>
+                </div>
+              </template>
+
+              <el-select
+                  v-model="form.meta.transitionType"
+                  style="width: 100%"
+                  placeholder="跟随全局"
+                  clearable
+              >
+                <el-option value="fade" label="淡入淡出" />
+                <el-option value="slide" label="滑动" />
+                <el-option value="zoom" label="缩放" />
+                <el-option value="none" label="无动画" />
+              </el-select>
+            </el-form-item>
+          </el-col>
         </el-row>
       </el-form>
       <div>