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

web打包修改

Browse Source
This commit is contained in:
wangys
2026-01-08 13:20:40 +08:00
parent 4784971d97
commit 5190a0cc9c
63 changed files with 463 additions and 600 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
urbanLifelineWeb/packages/shared/src/components/ai/knowledge/documentDetail/DocumentDetail.vue
View File

@@ -4,6 +4,9 @@
<script setup lang="ts">
</script>
<style scoped lang="scss">
@import url("./DocumentDetail.scss");
<style lang="scss">
// DocumentDetail 样式 - 去掉 scoped 以支持 Module Federation
.document-detail {
width: 100%;
}
</style>

42
urbanLifelineWeb/packages/shared/src/components/ai/knowledge/documentSegment/DocumentSegment.scss
View File

@@ -1,3 +1,4 @@
// 文档分段组件样式 - 去掉 scoped 以支持 Module Federation
.segment-dialog {
:deep(.el-dialog) {
border-radius: 14px;
@@ -10,7 +11,6 @@
font-size: 18px;
font-weight: 500;
color: #101828;
letter-spacing: -0.02em;
}
}
@@ -47,21 +47,12 @@
overflow-y: auto;
padding-right: 4px;
&::-webkit-scrollbar {
width: 6px;
}
&::-webkit-scrollbar-track {
background: transparent;
}
&::-webkit-scrollbar { width: 6px; }
&::-webkit-scrollbar-track { background: transparent; }
&::-webkit-scrollbar-thumb {
background: #D1D5DB;
border-radius: 3px;
&:hover {
background: #9CA3AF;
}
&:hover { background: #9CA3AF; }
}
.segment-item {
@@ -77,9 +68,7 @@
box-shadow: 0 4px 12px rgba(64, 158, 255, 0.12);
}
&:last-child {
margin-bottom: 0;
}
&:last-child { margin-bottom: 0; }
}
.segment-header {
@@ -93,7 +82,6 @@
font-weight: 500;
color: #101828;
font-size: 14px;
letter-spacing: -0.01em;
white-space: nowrap;
}
@@ -101,7 +89,6 @@
flex: 1;
font-size: 12px;
color: #6A7282;
letter-spacing: -0.01em;
white-space: nowrap;
}
@@ -115,14 +102,6 @@
.segment-content {
margin-bottom: 12px;
.el-textarea {
textarea {
font-family: inherit;
font-size: 14px;
line-height: 1.6;
}
}
.segment-text {
padding: 12px;
@@ -134,7 +113,6 @@
font-size: 14px;
white-space: pre-wrap;
word-break: break-word;
letter-spacing: -0.01em;
}
}
@@ -170,7 +148,6 @@
gap: 6px;
font-size: 13px;
color: #667085;
letter-spacing: -0.01em;
.el-icon {
font-size: 14px;
@@ -190,13 +167,6 @@
font-size: 14px;
color: #6A7282;
margin: 0;
letter-spacing: -0.01em;
}
}
}
.pagination-container {
margin-top: 16px;
display: flex;
justify-content: center;
}
}

4
urbanLifelineWeb/packages/shared/src/components/ai/knowledge/documentSegment/DocumentSegment.vue
View File

@@ -496,6 +496,6 @@ function formatTimestamp(timestamp: number): string {
}
</script>
<style lang="scss" scoped>
@import url("./DocumentSegment.scss");
<style lang="scss">
// 样式已分离到 styles/components.scss 统一管理
</style>

4
urbanLifelineWeb/packages/shared/src/components/dynamicFormItem/DynamicFormItem.vue
View File

@@ -576,6 +576,6 @@ defineExpose({
})
</script>
<style lang="scss" scoped>
@import url("./DynamicFormItem.scss");
<style lang="scss">
// 样式已分离到 styles/components.scss 统一管理
</style>

4
urbanLifelineWeb/packages/shared/src/components/file/fileHistory/FileHistory.vue
View File

@@ -150,6 +150,6 @@ const handleCustomAction = (key: string, row: KnowledgeFileVO) => {
}
</script>
<style lang="scss" scoped>
@import url('./FileHistory.scss');
<style lang="scss">
// 样式已分离到 styles/components.scss 统一管理
</style>

4
urbanLifelineWeb/packages/shared/src/components/file/fileupload/FileUpload.vue
View File

@@ -574,6 +574,6 @@ defineExpose({
})
</script>
<style lang="scss" scoped>
@import url('./FileUpload.scss');
<style lang="scss">
// 样式已分离到 styles/components.scss 统一管理
</style>

75
urbanLifelineWeb/packages/shared/src/components/iframe/IframeView.scss Normal file
View File

@@ -0,0 +1,75 @@
// IframeView 组件样式
.iframe-view {
position: relative;
width: 100%;
height: 100%;
overflow: hidden;
display: flex;
flex-direction: column;
.iframe-header {
display: flex;
align-items: center;
justify-content: space-between;
padding: 12px 16px;
background: var(--el-bg-color);
border-bottom: 1px solid var(--el-border-color-light);
flex-shrink: 0;
.iframe-title {
font-size: 16px;
font-weight: 500;
color: var(--el-text-color-primary);
}
}
.iframe-content {
width: 100%;
height: 100%;
border: none;
flex: 1;
&.with-header {
height: calc(100% - 49px);
}
}
.iframe-error {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
height: 100%;
color: var(--el-text-color-secondary);
.error-icon {
font-size: 48px;
margin-bottom: 16px;
color: var(--el-color-warning);
}
}
.iframe-loading {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
background: var(--el-bg-color);
gap: 12px;
.is-loading {
animation: iframe-rotating 1.5s linear infinite;
color: var(--el-color-primary);
}
}
}
@keyframes iframe-rotating {
from { transform: rotate(0deg); }
to { transform: rotate(360deg); }
}

82
urbanLifelineWeb/packages/shared/src/components/iframe/IframeView.vue
View File

@@ -140,83 +140,7 @@ onUnmounted(() => {
})
</script>
<style lang="scss" scoped>
.iframe-view {
position: relative;
width: 100%;
height: 100%;
overflow: hidden;
display: flex;
flex-direction: column;
}
.iframe-header {
display: flex;
align-items: center;
justify-content: space-between;
padding: 12px 16px;
background: var(--el-bg-color);
border-bottom: 1px solid var(--el-border-color-light);
flex-shrink: 0;
.iframe-title {
font-size: 16px;
font-weight: 500;
color: var(--el-text-color-primary);
}
}
.iframe-content {
width: 100%;
height: 100%;
border: none;
flex: 1;
&.with-header {
height: calc(100% - 49px);
}
}
.iframe-error {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
height: 100%;
color: var(--el-text-color-secondary);
.error-icon {
font-size: 48px;
margin-bottom: 16px;
color: var(--el-color-warning);
}
}
.iframe-loading {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
background: var(--el-bg-color);
gap: 12px;
.is-loading {
animation: rotating 1.5s linear infinite;
color: var(--el-color-primary);
}
}
@keyframes rotating {
from {
transform: rotate(0deg);
}
to {
transform: rotate(360deg);
}
}
<style lang="scss">
// 样式已分离到 styles/components.scss 统一管理
// 这里保留空的 style 标签以便后续扩展
</style>

4
urbanLifelineWeb/packages/shared/src/layouts/AdminSidebarLayout/AdminSidebarLayout.vue
View File

@@ -353,6 +353,6 @@ watch(
)
</script>
<style lang="scss" scoped>
@import url("./SubSidebarLayout.scss");
<style lang="scss">
// 样式已分离到 styles/layouts.scss 统一管理
</style>

8
urbanLifelineWeb/packages/shared/src/layouts/BlankLayout/BlankLayout.vue
View File

@@ -9,10 +9,6 @@
// 适用于全屏页面，如聊天页面、独立功能页等
</script>
<style scoped lang="scss">
.blank-layout {
width: 100%;
height: 100vh;
overflow: hidden;
}
<style lang="scss">
// 样式已分离到 styles/layouts.scss 统一管理
</style>

624
urbanLifelineWeb/packages/shared/src/layouts/SubSidebarLayout/SubSidebarLayout.scss
View File

@@ -1,8 +1,11 @@
// ==================== 品牌色变量 ====================
// ==================== Shared Layouts 样式 ====================
// 所有样式都用根类名包裹，避免全局污染
$brand-color: #0055AA;
$brand-color-light: #EBF5FF;
$brand-color-hover: #004488;
// ==================== SubSidebarLayout ====================
.sidebar-layout {
display: flex;
width: 100%;
@@ -10,451 +13,246 @@ $brand-color-hover: #004488;
overflow: hidden;
background: #f8fafc;
font-family: 'Inter', 'Noto Sans SC', sans-serif;
}
// ==================== 2级侧边栏（子导航样式）====================
.sidebar {
width: 224px;
height: 100%;
background: #fff;
display: flex;
flex-direction: column;
color: #333;
flex-shrink: 0;
transition: all 0.3s ease;
border-right: 1px solid #f1f5f9;
position: relative;
&.collapsed {
width: 64px;
overflow: visible;
.sidebar {
width: 224px;
height: 100%;
background: #fff;
display: flex;
flex-direction: column;
color: #333;
flex-shrink: 0;
transition: all 0.3s ease;
border-right: 1px solid #f1f5f9;
position: relative;
.sidebar-header {
padding: 16px 0;
justify-content: center;
&.collapsed {
width: 64px;
overflow: visible;
.logo {
display: none;
.sidebar-header {
padding: 16px 0;
justify-content: center;
.logo { display: none; }
.collapse-btn { display: flex; }
}
.collapse-btn {
display: flex;
}
}
.nav-item {
justify-content: center;
padding: 10px;
margin: 2px 8px;
span {
display: none;
.nav-item {
justify-content: center;
padding: 10px;
margin: 2px 8px;
span { display: none; }
.expand-icon { display: none; }
&:hover .nav-tooltip { opacity: 1; visibility: visible; }
}
.expand-icon {
display: none;
}
// 折叠状态下显示 tooltip
&:hover .nav-tooltip {
opacity: 1;
visibility: visible;
}
}
.nav-child-item {
display: none;
}
.user-section {
justify-content: center;
padding: 16px 8px;
.nav-child-item { display: none; }
.user-section { justify-content: center; padding: 16px 8px; }
}
}
}
// 侧边栏头部
.sidebar-header {
height: 64px;
padding: 0 16px;
border-bottom: 1px solid #f1f5f9;
display: flex;
align-items: center;
justify-content: space-between;
}
.sidebar-header {
height: 64px;
padding: 0 16px;
border-bottom: 1px solid #f1f5f9;
display: flex;
align-items: center;
justify-content: space-between;
}
.collapse-btn {
width: 32px;
height: 32px;
display: flex;
align-items: center;
justify-content: center;
border-radius: 8px;
cursor: pointer;
color: #94a3b8;
background: transparent;
border: none;
transition: all 0.2s;
flex-shrink: 0;
&:hover {
background: #f1f5f9;
color: #64748b;
}
svg {
width: 20px;
height: 20px;
}
}
// 展开按钮（折叠状态显示在右侧）
.expand-toggle {
position: absolute;
right: -12px;
top: 80px;
width: 24px;
height: 24px;
background: #fff;
border: 1px solid #e2e8f0;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
cursor: pointer;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
transition: all 0.2s;
z-index: 10;
&:hover {
background: #f8fafc;
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}
.el-icon {
font-size: 14px;
color: #64748b;
}
}
.logo {
display: flex;
align-items: center;
gap: 8px;
.logo-icon {
.collapse-btn {
width: 32px;
height: 32px;
background: #3b82f6;
border-radius: 8px;
display: flex;
align-items: center;
justify-content: center;
flex-shrink: 0;
.el-icon {
font-size: 18px;
color: #fff;
}
}
.logo-img {
width: 100%;
height: 32px;
border-radius: 8px;
object-fit: contain;
}
.logo-text {
font-size: 15px;
font-weight: 600;
color: #1e293b;
white-space: nowrap;
}
}
// 导航菜单
.nav-menu {
flex: 1;
// overflow-y: auto;
padding: 8px 0;
&::-webkit-scrollbar {
width: 4px;
}
&::-webkit-scrollbar-thumb {
background: rgba(0, 0, 0, 0.1);
border-radius: 4px;
}
&::-webkit-scrollbar-track {
background: transparent;
}
}
.nav-section {
padding: 0;
}
// 导航分组容器
.nav-group {
margin-bottom: 4px;
}
// 子菜单容器（二级）
.nav-children {
padding-left: 12px;
}
// 子菜单项包装器
.nav-child-wrapper {
margin-bottom: 2px;
}
// 三级菜单容器
.nav-sub-children {
padding-left: 12px;
}
// 1级导航项（分组标题）
.nav-item {
position: relative;
display: flex;
align-items: center;
justify-content: space-between;
gap: 8px;
padding: 10px 16px;
margin: 2px 8px;
border-radius: 8px;
cursor: pointer;
transition: all 0.2s ease;
color: #64748b;
font-size: 14px;
font-weight: 500;
&:hover {
background: #f8fafc;
color: #475569;
}
&.active {
background: $brand-color-light;
color: $brand-color;
}
&.has-children {
cursor: pointer;
}
.el-icon {
font-size: 18px;
flex-shrink: 0;
}
span {
flex: 1;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.expand-icon {
font-size: 14px;
color: #94a3b8;
transition: transform 0.2s;
}
// 折叠时的 Tooltip
.nav-tooltip {
position: absolute;
left: calc(100% + 16px);
top: 50%;
transform: translateY(-50%);
background: #1e293b;
color: #fff;
padding: 6px 12px;
border-radius: 6px;
font-size: 12px;
white-space: nowrap;
z-index: 100;
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
opacity: 0;
visibility: hidden;
background: transparent;
border: none;
transition: all 0.2s;
pointer-events: none;
flex-shrink: 0;
.tooltip-arrow {
position: absolute;
right: 100%;
top: 50%;
transform: translateY(-50%);
border: 5px solid transparent;
border-right-color: #1e293b;
}
&:hover { background: #f1f5f9; color: #64748b; }
svg { width: 20px; height: 20px; }
}
}
// 2级导航项（子菜单）
.nav-child-item {
padding: 8px 16px 8px 40px;
margin: 1px 8px;
border-radius: 6px;
font-size: 13px;
font-weight: 400;
&:hover {
background: #f8fafc;
color: #475569;
}
&.active {
background: $brand-color;
color: #fff;
font-weight: 500;
.el-icon {
color: #fff;
}
}
.el-icon {
font-size: 16px;
}
}
// 3级导航项
.nav-sub-child-item {
padding: 6px 16px 6px 56px;
margin: 1px 8px;
border-radius: 6px;
font-size: 13px;
font-weight: 400;
color: #64748b;
&:hover {
background: #f8fafc;
color: #475569;
}
&.active {
background: $brand-color;
color: #fff;
}
}
// 用户信息
.user-section {
padding: 16px;
border-top: 1px solid #f1f5f9;
cursor: pointer;
transition: background 0.2s;
&:hover {
background: #f8fafc;
}
.user-info-wrapper {
.expand-toggle {
position: absolute;
right: -12px;
top: 80px;
width: 24px;
height: 24px;
background: #fff;
border: 1px solid #e2e8f0;
border-radius: 50%;
display: flex;
align-items: center;
gap: 12px;
justify-content: center;
cursor: pointer;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
transition: all 0.2s;
z-index: 10;
&:hover { background: #f8fafc; box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1); }
}
.user-avatar {
flex-shrink: 0;
.logo {
display: flex;
align-items: center;
gap: 8px;
.logo-img {
width: 100%;
height: 32px;
border-radius: 8px;
object-fit: contain;
}
.logo-text {
font-size: 15px;
font-weight: 600;
color: #1e293b;
white-space: nowrap;
}
}
.user-name {
.nav-menu {
flex: 1;
padding: 8px 0;
&::-webkit-scrollbar { width: 4px; }
&::-webkit-scrollbar-thumb { background: rgba(0, 0, 0, 0.1); border-radius: 4px; }
&::-webkit-scrollbar-track { background: transparent; }
}
.nav-section { padding: 0; }
.nav-group { margin-bottom: 4px; }
.nav-children { padding-left: 12px; }
.nav-child-wrapper { margin-bottom: 2px; }
.nav-sub-children { padding-left: 12px; }
.nav-item {
position: relative;
display: flex;
align-items: center;
justify-content: space-between;
gap: 8px;
padding: 10px 16px;
margin: 2px 8px;
border-radius: 8px;
cursor: pointer;
transition: all 0.2s ease;
color: #64748b;
font-size: 14px;
font-weight: 500;
color: #374151;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
}
// ==================== 主内容区 ====================
.main-content {
flex: 1;
height: 100%;
overflow: hidden;
background: #f8fafc;
position: relative;
}
// iframe 容器
.iframe-container {
width: 100%;
height: 100%;
display: flex;
flex-direction: column;
position: relative;
}
.iframe-header {
height: 56px;
padding: 0 24px;
display: flex;
align-items: center;
justify-content: space-between;
border-bottom: 1px solid #e2e8f0;
background: #fff;
flex-shrink: 0;
}
.iframe-title {
font-size: 16px;
font-weight: 600;
color: #1e293b;
}
.content-iframe {
flex: 1;
width: 100%;
height: 100%;
border: none;
background: #fff;
}
.iframe-loading {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
display: flex;
flex-direction: column;
align-items: center;
gap: 12px;
color: $brand-color;
font-size: 14px;
z-index: 10;
.el-icon {
font-size: 32px;
}
}
// ==================== 响应式 ====================
@media (max-width: 768px) {
.sidebar {
width: 64px;
&:not(.collapsed) {
width: 224px;
position: fixed;
left: 0;
top: 0;
z-index: 1000;
box-shadow: 4px 0 16px rgba(0, 0, 0, 0.1);
&:hover { background: #f8fafc; color: #475569; }
&.active { background: $brand-color-light; color: $brand-color; }
&.has-children { cursor: pointer; }
span {
flex: 1;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
}
.iframe-header {
padding: 0 16px;
.iframe-title {
.expand-icon {
font-size: 14px;
color: #94a3b8;
transition: transform 0.2s;
}
.nav-tooltip {
position: absolute;
left: calc(100% + 16px);
top: 50%;
transform: translateY(-50%);
background: #1e293b;
color: #fff;
padding: 6px 12px;
border-radius: 6px;
font-size: 12px;
white-space: nowrap;
z-index: 100;
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
opacity: 0;
visibility: hidden;
transition: all 0.2s;
pointer-events: none;
.tooltip-arrow {
position: absolute;
right: 100%;
top: 50%;
transform: translateY(-50%);
border: 5px solid transparent;
border-right-color: #1e293b;
}
}
}
.nav-child-item {
padding: 8px 16px 8px 40px;
margin: 1px 8px;
border-radius: 6px;
font-size: 13px;
font-weight: 400;
&:hover { background: #f8fafc; color: #475569; }
&.active {
background: $brand-color;
color: #fff;
font-weight: 500;
}
}
.nav-sub-child-item {
padding: 6px 16px 6px 56px;
margin: 1px 8px;
border-radius: 6px;
font-size: 13px;
font-weight: 400;
color: #64748b;
&:hover { background: #f8fafc; color: #475569; }
&.active { background: $brand-color; color: #fff; }
}
.main-content {
flex: 1;
height: 100%;
overflow: hidden;
background: #f8fafc;
position: relative;
}
&.no-sidebar .main-content {
width: 100%;
}
// 响应式
@media (max-width: 768px) {
.sidebar {
width: 64px;
&:not(.collapsed) {
width: 224px;
position: fixed;
left: 0;
top: 0;
z-index: 1000;
box-shadow: 4px 0 16px rgba(0, 0, 0, 0.1);
}
}
}
}
// ==================== BlankLayout ====================
.blank-layout {
width: 100%;
height: 100vh;
overflow: hidden;
}

4
urbanLifelineWeb/packages/shared/src/layouts/SubSidebarLayout/SubSidebarLayout.vue
View File

@@ -497,6 +497,6 @@ watch(
)
</script>
<style lang="scss" scoped>
@import url("./SubSidebarLayout.scss");
<style lang="scss">
// 样式已分离到 styles/layouts.scss 统一管理
</style>

8
urbanLifelineWeb/packages/shared/src/styles/components.scss Normal file
View File

@@ -0,0 +1,8 @@
// ==================== Shared Components 样式 ====================
// 导入各组件的 scss 文件
@use '../components/iframe/IframeView.scss';
@use '../components/file/fileupload/FileUpload.scss';
@use '../components/file/fileHistory/FileHistory.scss';
@use '../components/dynamicFormItem/DynamicFormItem.scss';
@use '../components/ai/knowledge/documentSegment/DocumentSegment.scss';

6
urbanLifelineWeb/packages/shared/src/styles/index.scss Normal file
View File

@@ -0,0 +1,6 @@
// ==================== Shared 全局样式 ====================
// 这个文件需要在宿主应用的 main.ts 中导入
// import 'shared/styles'
@use './layouts.scss';
@use './components.scss';

9
urbanLifelineWeb/packages/shared/src/styles/index.ts Normal file
View File

@@ -0,0 +1,9 @@
// ==================== Shared 全局样式入口 ====================
// 这个文件作为样式的 JS 入口，确保 CSS 被正确加载
// 在宿主应用中使用: import 'shared/styles'
// 导入所有样式（Vite 会自动处理 CSS 注入）
import './index.scss'
// 导出空对象，让 Module Federation 能正确处理
export {}

1
urbanLifelineWeb/packages/shared/src/styles/layouts.scss Normal file
View File

@@ -0,0 +1 @@
@use '../layouts/SubSidebarLayout/SubSidebarLayout.scss'