wangys/urbanLifeline
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

web iframe结构实现

Browse Source
This commit is contained in:
wangys
2025-12-13 14:13:31 +08:00
parent e002f0d989
commit 1776aa2d1e
53 changed files with 3280 additions and 275 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
urbanLifelineWeb/packages/platform/index.html
View File

@@ -8,9 +8,6 @@
<!-- 加载运行时配置（必须在其他脚本之前加载） -->
<script src="/app-config.js"></script>
<!-- Module Federation - 预加载远程入口 -->
<link rel="modulepreload" href="http://localhost:5000/remoteEntry.js">
</head>
<body>
<div id="app"></div>

7
urbanLifelineWeb/packages/platform/public/app-config.js
View File

@@ -51,6 +51,13 @@ window.APP_RUNTIME_CONFIG = {
publicImgPath: '/img',
publicWebPath: '/',
// 单点登录配置
sso: {
platformUrl: '/', // platform 平台地址
workcaseUrl: '/workcase', // workcase 服务地址
biddingUrl: '/bidding' // bidding 服务地址
},
// 功能开关
features: {
enableDebug: false,

11
urbanLifelineWeb/packages/platform/src/layouts/SidebarLayout/SidebarLayout.vue
View File

@@ -135,7 +135,6 @@ function getUserName(): string {
return loginDomain.user?.username || loginDomain.userInfo?.username || '管理员'
}
} catch (error) {
console.error('❌ 获取用户名失败:', error)
}
return '管理员'
}
@@ -149,20 +148,20 @@ function loadMenuFromStorage(): MenuItem[] {
try {
const loginDomainStr = localStorage.getItem('loginDomain')
if (!loginDomainStr) {
console.warn('⚠️ 未找到 loginDomain')
return []
}
const loginDomain = JSON.parse(loginDomainStr)
const userViews = loginDomain.userViews || []
console.log('📋 加载用户视图:', userViews)
// 过滤出 SidebarLayout 的顶级菜单（没有 parentId）
// 过滤出 SidebarLayout 的顶级菜单（没有 parentId，且属于 platform 服务，且不是admin路由）
const sidebarViews = userViews.filter((view: any) =>
view.layout === 'SidebarLayout' &&
!view.parentId &&
view.type === 1 // type 1 是侧边栏菜单
view.type === 1 && // type 1 是侧边栏菜单
view.service === 'platform' && // 只显示 platform 服务的视图
!view.url?.startsWith('/admin') // 排除 admin 路由（由 AdminSidebar 管理）
)
// 按 orderNum 排序
@@ -189,10 +188,8 @@ function loadMenuFromStorage(): MenuItem[] {
}
})
console.log('✅ 侧边栏菜单:', menuItems)
return menuItems
} catch (error) {
console.error('❌ 加载菜单失败:', error)
return []
}
}

4
urbanLifelineWeb/packages/platform/src/layouts/index.ts
View File

@@ -1 +1,3 @@
export { default as SidebarLayout } from "./SidebarLayout/SidebarLayout.vue";
export { default as SidebarLayout } from "./SidebarLayout/SidebarLayout.vue";
// BlankLayout从shared导入
export { BlankLayout } from 'shared/layouts';

94
urbanLifelineWeb/packages/platform/src/router/dynamicRoute.ts
View File

@@ -18,43 +18,47 @@ import {
import type { TbSysViewDTO } from 'shared/types'
import type { RouteRecordRaw } from 'vue-router'
import router from './index'
import { SidebarLayout } from '../layouts'
import { SidebarLayout, BlankLayout } from '@/layouts'
// Platform 布局组件映射
const platformLayoutMap: Record<string, () => Promise<any>> = {
'SidebarLayout': () => Promise.resolve({ default: SidebarLayout }),
'BlankLayout': () => Promise.resolve({ default: BlankLayout }),
'NavigationLayout': () => Promise.resolve({ default: SidebarLayout }),
'BasicLayout': () => Promise.resolve({ default: SidebarLayout })
}
// 视图组件加载器
const VIEW_MODULES = import.meta.glob<{ default: any }>('../views/**/*.vue')
const VIEW_MODULES = import.meta.glob<{ default: any }>('@/views/**/*.vue')
/**
* 视图组件加载函数
* @param componentPath 组件路径
* @param componentPath 组件路径（如 "public/Chat/AIChatView.vue"）
*/
function viewLoader(componentPath: string): (() => Promise<any>) | null {
// 将后台路径转换为实际路径
// 将后台路径转换为 @/views 格式
let path = componentPath
// 如果不是以 ../ 开头，则认为是相对 views 目录的路径
if (!path.startsWith('../')) {
if (!path.startsWith('/')) {
path = '/' + path
}
path = '../views' + path
// 移除开头的斜杠（如果有）
if (path.startsWith('/')) {
path = path.substring(1)
}
// 补全 .vue 后缀
// 补全 .vue 后缀（如果没有）
if (!path.endsWith('.vue')) {
path += '.vue'
}
const loader = VIEW_MODULES[path]
// 转换为 /src/views 格式（匹配 import.meta.glob 的 key）
const fullPath = `/src/views/${path}`
console.log('[Platform viewLoader] 尝试加载组件:', componentPath, '→', fullPath)
const loader = VIEW_MODULES[fullPath]
if (!loader) {
console.warn(`[路由生成] 未找到组件: ${componentPath}，期望路径: ${path}`)
console.warn('[Platform viewLoader] 组件未找到:', fullPath)
console.log('[Platform viewLoader] 可用的组件:', Object.keys(VIEW_MODULES))
return null
}
@@ -74,12 +78,8 @@ const routeConfig: RouteGeneratorConfig = {
// Platform 路由生成选项
const routeOptions: GenerateSimpleRoutesOptions = {
asRootChildren: true, // 作为 Root 路由的子路由
iframePlaceholder: () => Promise.resolve({
default: {
template: '<div class="iframe-placeholder"></div>'
}
}),
asRootChildren: false, // 直接作为根级路由，不是某个布局的子路由
iframePlaceholder: () => import('shared/components').then(m => ({ default: m.IframeView })),
verbose: true // 启用详细日志
}
@@ -89,31 +89,34 @@ const routeOptions: GenerateSimpleRoutesOptions = {
*/
export function addDynamicRoutes(views: TbSysViewDTO[]) {
if (!views || views.length === 0) {
console.warn('[Platform 路由] 视图列表为空')
console.warn('[Platform] addDynamicRoutes: 视图列表为空')
return
}
console.log('[Platform 路由] 开始生成路由，视图数量:', views.length)
console.log('[Platform] addDynamicRoutes: 开始添加动态路由，视图数量:', views.length)
try {
// 使用 shared 中的通用方法生成路由
const routes = generateSimpleRoutes(views, routeConfig, routeOptions)
// 将生成的路由添加到 Platform 的 router
// 直接将路由添加到根级别（不是作为Root的children）
routes.forEach(route => {
router.addRoute('Root', route)
console.log('[Platform 路由] 已添加路由:', {
path: route.path,
name: route.name,
hasComponent: !!route.component,
childrenCount: route.children?.length || 0
})
console.log('[Platform] addDynamicRoutes: 添加路由', route.path, '使用布局:', route.component?.name || 'unknown')
router.addRoute(route)
})
console.log('✅ Platform 动态路由添加完成')
console.log('所有路由:', router.getRoutes().map(r => ({ path: r.path, name: r.name })))
// 动态添加根路径重定向到第一个菜单项
if (routes.length > 0) {
const firstRoute = routes[0]
router.addRoute({
path: '/',
redirect: firstRoute.path
})
console.log('[Platform] addDynamicRoutes: 添加根路径重定向到', firstRoute.path)
}
} catch (error) {
console.error('❌ Platform 动态路由生成失败:', error)
console.error('[Platform] addDynamicRoutes: 添加路由失败', error)
throw error
}
}
@@ -130,18 +133,35 @@ export function addDynamicRoutes(views: TbSysViewDTO[]) {
*/
export function loadRoutesFromStorage(): boolean {
try {
// 使用 shared 中的通用方法加载视图数据
const views = loadViewsFromStorage('loginDomain', 'userViews')
console.log('[Platform] loadRoutesFromStorage: 开始加载动态路由')
if (views) {
// 使用 shared 中的通用方法加载视图数据
const allViews = loadViewsFromStorage('loginDomain', 'userViews')
console.log('[Platform] loadRoutesFromStorage: 加载的所有视图数量:', allViews?.length || 0)
if (allViews) {
// 过滤出 platform 服务的视图
const platformViews = allViews.filter((view: TbSysViewDTO) =>
view.service === 'platform'
)
console.log('[Platform] loadRoutesFromStorage: 过滤后的 platform 视图:', platformViews)
if (platformViews.length === 0) {
console.warn('[Platform] loadRoutesFromStorage: 没有找到 platform 服务的视图')
return false
}
// 使用 Platform 的 addDynamicRoutes 添加路由
addDynamicRoutes(views)
addDynamicRoutes(platformViews)
return true
}
console.warn('[Platform] loadRoutesFromStorage: 未能加载视图数据')
return false
} catch (error) {
console.error('[Platform 路由] 从 LocalStorage 加载路由失败:', error)
console.error('[Platform] loadRoutesFromStorage: 加载路由失败', error)
return false
}
}

8
urbanLifelineWeb/packages/platform/src/router/index.ts
View File

@@ -1,15 +1,9 @@
import { createRouter, createWebHistory, RouteRecordRaw } from 'vue-router'
import { SidebarLayout } from '../layouts'
import { TokenManager } from 'shared/api'
import { loadRoutesFromStorage } from './dynamicRoute'
// platform应用的动态路由会根据layout字段自动添加，不需要预定义Root布局
const routes: RouteRecordRaw[] = [
{
path: '/',
name: 'Root',
component: SidebarLayout,
children: []
},
{
path: '/login',
name: 'Login',

36
urbanLifelineWeb/packages/platform/src/types/shared.d.ts vendored
View File

@@ -7,6 +7,7 @@
declare module 'shared/components' {
export const FileUpload: any
export const DynamicFormItem: any
export const IframeView: any
}
declare module 'shared/components/FileUpload' {
@@ -21,6 +22,18 @@ declare module 'shared/components/DynamicFormItem' {
export default DynamicFormItem
}
declare module 'shared/components/iframe/IframeView.vue' {
import { DefineComponent } from 'vue'
const IframeView: DefineComponent<{}, {}, any>
export default IframeView
}
declare module 'shared/components/iframe/IframeView.vue' {
import { DefineComponent } from 'vue'
const IframeView: DefineComponent<{}, {}, any>
export default IframeView
}
// ========== API 模块 ==========
declare module 'shared/api' {
export const api: any
@@ -35,6 +48,13 @@ declare module 'shared/api/file' {
export const fileAPI: any
}
declare module 'shared/api' {
export const authAPI: any
export const fileAPI: any
export const TokenManager: any
export const api: any
}
// 保留旧的导出路径（向后兼容）
declare module 'shared/FileUpload' {
import { DefineComponent } from 'vue'
@@ -48,14 +68,6 @@ declare module 'shared/DynamicFormItem' {
export default DynamicFormItem
}
declare module 'shared/authAPI' {
export const authAPI: any
}
declare module 'shared/fileAPI' {
export const fileAPI: any
}
declare module 'shared/utils' {
export const initAesEncrypt: any
export const getAesInstance: any
@@ -83,6 +95,7 @@ declare module 'shared/types' {
parentId?: string
url?: string
component?: string
service?: string
iframeUrl?: string
icon?: string
type?: number
@@ -162,3 +175,10 @@ declare module 'shared/utils/device' {
export function isDesktop(): boolean
export function useDevice(): any
}
// ========== Layouts 布局模块 ==========
declare module 'shared/layouts' {
import { DefineComponent } from 'vue'
export const BlankLayout: DefineComponent<{}, {}, any>
}

4
urbanLifelineWeb/packages/platform/src/views/public/Login/Login.vue
View File

@@ -68,9 +68,9 @@ import { reactive, ref } from 'vue'
import { useRouter } from 'vue-router'
import { ElMessage, type FormInstance, type FormRules } from 'element-plus'
import type { LoginParam } from 'shared/types'
import { authAPI } from 'shared/authAPI'
import { getAesInstance } from 'shared/utils'
import { authAPI } from 'shared/api/auth'
import { TokenManager } from 'shared/api'
import { getAesInstance } from 'shared/utils'
import { resetDynamicRoutes } from '@/router'
// 路由

5
urbanLifelineWeb/packages/platform/vite.config.ts
View File

@@ -7,7 +7,11 @@ import { fileURLToPath } from 'url'
const __filename = fileURLToPath(import.meta.url)
const __dirname = dirname(__filename)
export default defineConfig({
// Platform 是根路径应用
base: '/',
plugins: [
vue({
script: {
@@ -50,6 +54,7 @@ export default defineConfig({
port: 5001,
host: true,
cors: true,
open: '/', // 开发时自动打开到根路径
proxy: {
'/api': {
target: 'http://localhost:8180',