【同步】前端项目源码

【修复】工作流兼容问题

frontend/apps/allin-ssl/src/views/layout/useController.tsx

@@ -0,0 +1,183 @@
+import { NIcon } from 'naive-ui'
+import { RouterLink, useRoute } from 'vue-router'
+import { useMessage, useDialog } from '@baota/naive-ui/hooks'
+import { useError } from '@baota/hooks/error'
+import { signOut } from '@api/public'
+import { routes } from '@router/index'
+import { $t } from '@locales/index'
+import { useStore } from './useStore'
+
+import { SettingsOutline, LogOutOutline } from '@vicons/ionicons5'
+import { CloudMonitoring, Home, Flow } from '@vicons/carbon'
+import { Certificate20Regular, AddSquare24Regular } from '@vicons/fluent'
+import { ApiOutlined } from '@vicons/antd'
+
+import type { MenuOption } from 'naive-ui/es/menu/src/interface'
+import type { RouteName } from './types'
+
+/**
+ * @description 图标映射类型
+ */
+type IconMap = Record<RouteName, Component>
+
+/**
+ * @description 布局控制器
+ * @returns 返回布局相关状态和方法
+ */
+export const useController = () => {
+	const store = useStore()
+	const router = useRouter()
+	const route = useRoute()
+	const message = useMessage()
+	// const { useFormInput } = useFormHooks()
+	const { handleError } = useError()
+	const { resetDataInfo, menuActive, updateMenuActive } = store
+
+	/**
+	 * 当前路由是否为子路由
+	 */
+	const isChildRoute = ref(false)
+
+	/**
+	 * 当前子路由配置
+	 */
+	const childRouteConfig = ref<Record<string, any>>({})
+
+	/**
+	 * ==================== 弹窗相关功能 ====================
+	 */
+
+	// ==============================
+	// 图标渲染方法
+	// ==============================
+
+	/**
+	 * @description 渲染导航图标
+	 * @param name - 路由名称
+	 * @returns 对应的图标组件
+	 */
+	const renderIcon = (name: RouteName) => {
+		const iconObj: IconMap = {
+			certManage: Certificate20Regular,
+			autoDeploy: Flow,
+			home: Home,
+			certApply: AddSquare24Regular,
+			monitor: CloudMonitoring,
+			settings: SettingsOutline,
+			logout: LogOutOutline,
+			authApiManage: ApiOutlined,
+		}
+		return () => h(NIcon, null, () => h(iconObj[name] || 'div'))
+	}
+
+	// ==============================
+	// 菜单相关方法
+	// ==============================
+	const menuItems = computed(() => {
+		const routeMenuItems: MenuOption[] = routes.map((route) => ({
+			key: route.name as RouteName,
+			label: () => <RouterLink to={route.path}>{route?.meta?.title as string}</RouterLink>,
+			icon: renderIcon(route.name as RouteName),
+		}))
+		return [
+			...routeMenuItems,
+			{
+				key: 'logout',
+				label: () => <a onClick={handleLogout}>{$t('t_0_1744168657526')}</a>,
+				icon: renderIcon('logout'),
+			},
+		]
+	})
+
+	/**
+	 * @description 检查当前路由是否为子路由
+	 * @returns {void}
+	 */
+	const checkIsChildRoute = () => {
+		// 获取当前路由路径
+		const currentPath = route.path
+		// 检查路由是否包含 /children/ 标识子路由
+		isChildRoute.value = currentPath.includes('/children/')
+
+		// 如果是子路由，获取子路由配置
+		if (isChildRoute.value) {
+			// 获取当前激活的主路由
+			const parentRoute = routes.find((route) => route.name === menuActive.value)
+			// 如果找到了父路由，且父路由有子路由配置
+			if (parentRoute && parentRoute.children) {
+				// 查找当前的子路由
+				const currentChild = parentRoute.children.find((child) => route.path.includes(child.path))
+				childRouteConfig.value = currentChild || {}
+			} else {
+				childRouteConfig.value = {}
+			}
+		} else {
+			childRouteConfig.value = {}
+		}
+	}
+
+	watch(
+		() => route.name,
+		() => {
+			if (route.name !== menuActive.value) {
+				// 更新当前激活的菜单项
+				updateMenuActive(route.name as RouteName)
+			}
+			// 检查是否为子路由
+			checkIsChildRoute()
+		},
+		{ immediate: true },
+	)
+
+	/**
+	 * ==================== 用户操作功能 ====================
+	 */
+
+	/**
+	 * @description 退出登录
+	 * @returns {Promise<void>}
+	 */
+	const handleLogout = async () => {
+		try {
+			await useDialog({
+				title: $t('t_15_1745457484292'),
+				content: $t('t_16_1745457491607'),
+				onPositiveClick: async () => {
+					try {
+						message.success($t('t_17_1745457488251'))
+						await signOut().fetch()
+						setTimeout(() => {
+							// 重置数据信息
+							resetDataInfo()
+							// 删除会话存储
+							sessionStorage.clear()
+							// 路由跳转
+							router.push('/login')
+						}, 1000)
+					} catch (error) {
+						handleError(error)
+					}
+				},
+			})
+		} catch (error) {
+			handleError(error)
+		}
+	}
+
+	/**
+	 * ==================== 初始化逻辑 ====================
+	 */
+
+	onMounted(async () => {
+		// 初始化时检查是否为子路由
+		checkIsChildRoute()
+	})
+
+	return {
+		...store,
+		handleLogout,
+		menuItems,
+		isChildRoute,
+		childRouteConfig,
+	}
+}