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

2级sidebar

Browse Source
This commit is contained in:
wangys
2025-12-13 15:56:12 +08:00
parent 3442f96214
commit b57a002de8
46 changed files with 1529 additions and 203 deletions
Download Patch File Download Diff File Expand all files Collapse all files

44
urbanLifelineWeb/packages/workcase/src/layouts/SidebarLayout/SidebarLayout.scss
View File

@@ -5,17 +5,17 @@
overflow: hidden;
}
// ==================== 侧边栏 ====================
// ==================== 侧边栏（内层子导航样式）====================
.sidebar {
width: 220px;
width: 180px;
height: 100%;
background: #F0EAF4;
background: #fff;
display: flex;
flex-direction: column;
color: #333;
flex-shrink: 0;
transition: width 0.3s ease;
border-right: 1px solid rgba(0, 0, 0, 0.08);
border-right: 1px solid #e4e7ed;
&.collapsed {
width: 64px;
@@ -49,7 +49,7 @@
// 侧边栏头部
.sidebar-header {
padding: 16px 20px;
border-bottom: 1px solid rgba(0, 0, 0, 0.08);
border-bottom: 1px solid #e4e7ed;
display: flex;
align-items: center;
justify-content: space-between;
@@ -63,7 +63,7 @@
justify-content: center;
border-radius: 6px;
cursor: pointer;
color: #888;
color: #909399;
transition: all 0.2s;
&:hover {
@@ -78,18 +78,16 @@
gap: 10px;
.logo-img {
width: 40px;
height: 40px;
width: 36px;
height: 36px;
border-radius: 6px;
object-fit: contain;
background: #fff;
padding: 2px;
}
.logo-text {
font-size: 16px;
font-weight: 600;
color: #333;
color: #303133;
}
}
@@ -97,31 +95,31 @@
.nav-menu {
flex: 1;
overflow-y: auto;
padding: 12px 0;
padding: 16px 0;
&::-webkit-scrollbar {
width: 4px;
}
&::-webkit-scrollbar-thumb {
background: rgba(0, 0, 0, 0.2);
background: rgba(0, 0, 0, 0.15);
border-radius: 4px;
}
}
.nav-section {
padding: 8px 0;
padding: 0;
}
.nav-item {
display: flex;
align-items: center;
gap: 12px;
padding: 14px 20px;
margin-bottom: 4px;
gap: 10px;
padding: 10px 20px;
margin-bottom: 0;
cursor: pointer;
transition: all 0.2s ease;
color: #555;
color: #606266;
font-size: 14px;
&:hover {
@@ -132,11 +130,11 @@
&.active {
background: rgba(124, 58, 237, 0.15);
color: #7c3aed;
font-weight: 500;
border-right: 3px solid #7c3aed;
}
.el-icon {
font-size: 18px;
font-size: 16px;
flex-shrink: 0;
}
@@ -150,7 +148,7 @@
// 用户信息
.user-section {
padding: 16px 20px;
border-top: 1px solid rgba(0, 0, 0, 0.08);
border-top: 1px solid #e4e7ed;
cursor: pointer;
transition: background 0.2s;
@@ -171,7 +169,7 @@
.user-name {
font-size: 14px;
font-weight: 500;
color: #333;
color: #303133;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
@@ -245,7 +243,7 @@
width: 64px;
&:not(.collapsed) {
width: 220px;
width: 180px;
position: fixed;
left: 0;
top: 0;

25
urbanLifelineWeb/packages/workcase/src/layouts/SidebarLayout/SidebarLayout.vue
View File

@@ -30,31 +30,6 @@
</div>
</nav>
<!-- 用户信息 -->
<el-dropdown class="user-section" trigger="click" @command="handleUserCommand">
<div class="user-info-wrapper">
<div class="user-avatar">
<el-avatar :size="36" src="/avatar.svg" @error="handleAvatarError" />
</div>
<span v-if="!collapsed" class="user-name">{{ userName }}</span>
</div>
<template #dropdown>
<el-dropdown-menu>
<el-dropdown-item command="profile">
<el-icon><User /></el-icon>
个人中心
</el-dropdown-item>
<el-dropdown-item command="settings" divided>
<el-icon><Setting /></el-icon>
系统设置
</el-dropdown-item>
<el-dropdown-item command="logout" divided>
<el-icon><SwitchButton /></el-icon>
退出登录
</el-dropdown-item>
</el-dropdown-menu>
</template>
</el-dropdown>
</aside>
<!-- 主内容区 -->

3
urbanLifelineWeb/packages/workcase/src/layouts/index.ts
View File

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

5
urbanLifelineWeb/packages/workcase/src/router/dynamicRoute.ts
View File

@@ -18,14 +18,15 @@ import {
import type { TbSysViewDTO } from 'shared/types'
import type { RouteRecordRaw } from 'vue-router'
import router from './index'
import { SidebarLayout, BlankLayout } from '@/layouts'
import { SidebarLayout, BlankLayout, AdminSidebarLayout } from '@/layouts'
// Workcase 布局组件映射
const workcaseLayoutMap: Record<string, () => Promise<any>> = {
'SidebarLayout': () => Promise.resolve({ default: SidebarLayout }),
'BlankLayout': () => Promise.resolve({ default: BlankLayout }),
'NavigationLayout': () => Promise.resolve({ default: SidebarLayout }),
'BasicLayout': () => Promise.resolve({ default: SidebarLayout })
'BasicLayout': () => Promise.resolve({ default: SidebarLayout }),
'AdminSidebarLayout': () => Promise.resolve({ default: AdminSidebarLayout })
}
// 视图组件加载器

142
urbanLifelineWeb/packages/workcase/src/router/index.ts
View File

@@ -73,19 +73,153 @@ router.beforeEach((to, from, next) => {
console.log('[Workcase Router] 所有路由:', router.getRoutes().map(r => r.path))
if (loaded) {
// 动态路由加载成功，重新导航以匹配新添加的路由
console.log('[Workcase Router] 动态路由加载成功，重新导航到:', to.path)
next({ ...to, replace: true })
return
if (to.path === '/') {
// 访问根路径，重定向到第一个可用路由
const firstRoute = getFirstAvailableRoute()
if (firstRoute && firstRoute !== '/') {
// 只有当第一个路由不是 / 时才重定向，避免无限循环
console.log('[Workcase Router] 根路径重定向到:', firstRoute)
next({ path: firstRoute, replace: true })
return
} else {
// 第一个路由就是 /，直接放行
console.log('[Workcase Router] 第一个路由就是根路径，直接放行')
}
} else if (to.path === '/admin') {
// 访问 /admin 路径，重定向到第一个 admin 路由
const firstAdminRoute = getFirstAdminRoute()
if (firstAdminRoute) {
console.log('[Workcase Router] /admin 重定向到:', firstAdminRoute)
next({ path: firstAdminRoute, replace: true })
return
}
} else {
// 动态路由加载成功，重新导航以匹配新添加的路由
console.log('[Workcase Router] 动态路由加载成功，重新导航到:', to.path)
next({ ...to, replace: true })
return
}
} else {
console.warn('[Workcase Router] 动态路由加载失败')
}
}
// 如果已登录且访问根路径，但动态路由已加载，重定向到第一个可用路由
if (hasToken && to.path === '/' && dynamicRoutesLoaded) {
const firstRoute = getFirstAvailableRoute()
if (firstRoute && firstRoute !== '/') {
// 只有当第一个路由不是 / 时才重定向，避免无限循环
console.log('[Workcase Router] 已登录访问根路径，重定向到:', firstRoute)
next({ path: firstRoute, replace: true })
return
}
}
// 如果访问 /admin，重定向到第一个 admin 路由
if (hasToken && to.path === '/admin' && dynamicRoutesLoaded) {
const firstAdminRoute = getFirstAdminRoute()
if (firstAdminRoute) {
console.log('[Workcase Router] 访问 /admin，重定向到:', firstAdminRoute)
next({ path: firstAdminRoute, replace: true })
return
}
}
console.log('[Workcase Router] 继续正常导航')
next()
})
/**
* 获取第一个可用的路由路径
*/
function getFirstAvailableRoute(): string | null {
try {
console.log('[Workcase Router] 开始获取第一个可用路由...')
const loginDomainStr = localStorage.getItem('loginDomain')
if (!loginDomainStr) {
console.warn('[Workcase Router] localStorage 中没有 loginDomain')
return null
}
const loginDomain = JSON.parse(loginDomainStr)
const userViews = loginDomain.userViews || []
console.log('[Workcase Router] 所有用户视图:', userViews.length)
// 过滤出 workcase 服务的非 admin 视图
// 注意：不限制 type，因为首页路由可能是 type=3（路由类型）而不是 type=1（菜单类型）
const workcaseViews = userViews.filter((view: any) =>
view.service === 'workcase' &&
!view.url?.startsWith('/admin') &&
view.url // 必须有 url 字段
)
console.log('[Workcase Router] Workcase 服务视图:', workcaseViews)
if (workcaseViews.length === 0) {
console.warn('[Workcase Router] 没有找到 workcase 服务的菜单视图')
return null
}
// 按 orderNum 排序
workcaseViews.sort((a: any, b: any) => (a.orderNum || 0) - (b.orderNum || 0))
const firstRoute = workcaseViews[0].url
console.log('[Workcase Router] 第一个路由:', firstRoute, '视图:', workcaseViews[0].name)
return firstRoute
} catch (error) {
console.error('[Workcase Router] 获取首页路由失败:', error)
return null
}
}
/**
* 获取第一个 admin 路由
*/
function getFirstAdminRoute(): string | null {
try {
console.log('[Workcase Router] 开始获取第一个 admin 路由...')
const loginDomainStr = localStorage.getItem('loginDomain')
if (!loginDomainStr) {
console.warn('[Workcase Router] localStorage 中没有 loginDomain')
return null
}
const loginDomain = JSON.parse(loginDomainStr)
const userViews = loginDomain.userViews || []
// 过滤出 workcase 服务的 admin 路由（排除目录类型）
const adminViews = userViews.filter((view: any) =>
view.service === 'workcase' &&
view.url?.startsWith('/admin') &&
view.layout === 'AdminSidebarLayout' &&
!view.parentId && // 顶级菜单
view.url // 必须有 url 字段
)
console.log('[Workcase Router] Admin 视图:', adminViews)
if (adminViews.length === 0) {
console.warn('[Workcase Router] 没有找到 workcase admin 路由')
return null
}
// 按 orderNum 排序
adminViews.sort((a: any, b: any) => (a.orderNum || 0) - (b.orderNum || 0))
const firstRoute = adminViews[0].url
console.log('[Workcase Router] 第一个 admin 路由:', firstRoute, '视图:', adminViews[0].name)
return firstRoute
} catch (error) {
console.error('[Workcase Router] 获取 admin 路由失败:', error)
return null
}
}
// 重置动态路由加载状态
export function resetDynamicRoutes() {
dynamicRoutesLoaded = false

1
urbanLifelineWeb/packages/workcase/src/types/shared.d.ts vendored
View File

@@ -176,4 +176,5 @@ declare module 'shared/layouts' {
import { DefineComponent } from 'vue'
export const BlankLayout: DefineComponent<{}, {}, any>
export const AdminSidebarLayout: DefineComponent<{}, {}, any>
}

0
urbanLifelineWeb/packages/workcase/src/views/admin/agent/AgentView.scss Normal file
View File

11
urbanLifelineWeb/packages/workcase/src/views/admin/agent/AgentView.vue Normal file
View File

@@ -0,0 +1,11 @@
<template>
<div class="agent">
<!-- 智能体管理视图 -->
</div>
</template>
<script setup lang="ts">
</script>
<style lang="scss" scoped>
@import url("./AgentView.scss");
</style>

0
urbanLifelineWeb/packages/workcase/src/views/admin/customerChat/CustomerChatView.scss Normal file
View File

11
urbanLifelineWeb/packages/workcase/src/views/admin/customerChat/CustomerChatView.vue Normal file
View File

@@ -0,0 +1,11 @@
<template>
<div class="customer-chat">
<!-- 客服对话管理视图 -->
</div>
</template>
<script setup lang="ts">
</script>
<style lang="scss" scoped>
@import url("./CustomerChatView.scss");
</style>

0
urbanLifelineWeb/packages/workcase/src/views/admin/knowledge/KnowLedgeView.scss Normal file
View File

11
urbanLifelineWeb/packages/workcase/src/views/admin/knowledge/KnowLedgeView.vue Normal file
View File

@@ -0,0 +1,11 @@
<template>
<div class="knowledge">
<!-- 知识库管理视图 -->
</div>
</template>
<script setup lang="ts">
</script>
<style lang="scss" scoped>
@import url("./KnowLedgeView.scss");
</style>

0
urbanLifelineWeb/packages/workcase/src/views/admin/log/knowledgeLog/KnowledgeLogView.scss Normal file
View File

11
urbanLifelineWeb/packages/workcase/src/views/admin/log/knowledgeLog/KnowledgeLogView.vue Normal file
View File

@@ -0,0 +1,11 @@
<template>
<div class="knowledge-log">
<!-- 知识库日志管理视图 -->
</div>
</template>
<script setup lang="ts">
</script>
<style lang="scss" scoped>
@import url("./KnowledgeLogView.scss");
</style>

0
urbanLifelineWeb/packages/workcase/src/views/admin/log/systemLog/SystemLogView.scss Normal file
View File

11
urbanLifelineWeb/packages/workcase/src/views/admin/log/systemLog/SystemLogView.vue Normal file
View File

@@ -0,0 +1,11 @@
<template>
<div class="system-log">
<!-- 系统日志管理视图 -->
</div>
</template>
<script setup lang="ts">
</script>
<style lang="scss" scoped>
@import url("./SystemLogView.scss");
</style>

0
urbanLifelineWeb/packages/workcase/src/views/admin/log/workcaseLog/WorkcaseLogView.scss Normal file
View File

11
urbanLifelineWeb/packages/workcase/src/views/admin/log/workcaseLog/WorkcaseLogView.vue Normal file
View File

@@ -0,0 +1,11 @@
<template>
<div class="workcase-log">
<!-- 工单日志管理视图 -->
</div>
</template>
<script setup lang="ts">
</script>
<style lang="scss" scoped>
@import url("./WorkcaseLogView.scss");
</style>

0
urbanLifelineWeb/packages/workcase/src/views/admin/overview/OverviewView.scss Normal file
View File

11
urbanLifelineWeb/packages/workcase/src/views/admin/overview/OverviewView.vue Normal file
View File

@@ -0,0 +1,11 @@
<template>
<div class="overview">
<!-- 数据概览视图 -->
</div>
</template>
<script setup lang="ts">
</script>
<style lang="scss" scoped>
@import url("./OverviewView.scss");
</style>

0
urbanLifelineWeb/packages/workcase/src/views/admin/workcase/WorkcaseView.scss Normal file
View File

11
urbanLifelineWeb/packages/workcase/src/views/admin/workcase/WorkcaseView.vue Normal file
View File

@@ -0,0 +1,11 @@
<template>
<div class="workcase">
<!-- 工单管理视图 -->
</div>
</template>
<script setup lang="ts">
</script>
<style lang="scss" scoped>
@import url("./WorkcaseView.scss");
</style>