/** * 知识库管理器 - Dify 风格布局 */ /* 外层容器 */ .dataset-manager-wrapper { display: flex; flex-direction: column; height:90%; max-height: 100%; background: #fff; overflow: hidden; border-radius: 0.5rem; } /* ============================================================================ * 左右分栏布局 * ============================================================================ */ .dataset-layout { display: flex; flex: 1; min-height: 0; height: 100%; } /* 左侧侧边栏 */ .dataset-sidebar { width: 26vh; min-width: 11vh; background: #fafafa; border-right: 1px solid #f0f0f0; display: flex; flex-direction: column; overflow: hidden; max-height: 90vh; } /* 返回按钮 */ .sidebar-back { padding: 12px 16px; border-bottom: 1px solid #f0f0f0; } .sidebar-back .back-btn { color: #666; font-size: 13px; padding: 4px 8px; height: auto; } .sidebar-back .back-btn:hover { color: rgb(0 104 74); background: rgba(0, 104, 74, 0.08); } /* 知识库信息头部 */ .sidebar-header { display: flex; align-items: flex-start; gap: 12px; padding: 20px 16px 12px; } .dataset-icon { width: 40px; height: 40px; background: linear-gradient(135deg, rgb(0 104 74) 0%, rgb(0 140 100) 100%); border-radius: 8px; display: flex; align-items: center; justify-content: center; color: #fff; font-size: 18px; flex-shrink: 0; } .dataset-info { flex: 1; min-width: 0; overflow: hidden; } .dataset-name { font-size: 14px; font-weight: 600; color: #1a1a1a; margin: 0 0 4px 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .dataset-type { font-size: 12px; color: #999; } /* 知识库选择器 */ .dataset-selector { flex: 1; min-width: 0; overflow: hidden; display: flex; flex-direction: column; gap: 4px; } .dataset-select { width: 100%; } .dataset-select .ant-select-selector { border: 1px solid #e5e5e5 !important; border-radius: 6px !important; background: #fff !important; padding: 2px 8px !important; height: auto !important; min-height: 32px !important; } .dataset-select .ant-select-selection-item { font-weight: 600; font-size: 13px; color: #1a1a1a; } .dataset-select:hover .ant-select-selector { border-color: rgb(0 104 74) !important; } .dataset-select.ant-select-focused .ant-select-selector { border-color: rgb(0 104 74) !important; box-shadow: 0 0 0 2px rgba(0, 104, 74, 0.1) !important; } /* 知识库下拉选项 */ .dataset-option { display: flex; align-items: center; gap: 8px; padding: 4px 0; } .dataset-option-name { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .dataset-option-tag { font-size: 10px; padding: 1px 6px; border-radius: 4px; background: rgba(0, 104, 74, 0.1); color: rgb(0 104 74); white-space: nowrap; } .dataset-option-tag.public { background: rgba(24, 144, 255, 0.1); color: #1890ff; } /* 统计信息 */ .sidebar-stats { padding: 0 16px 16px; border-bottom: 1px solid #f0f0f0; } .stat-item { font-size: 12px; color: #666; } /* 导航菜单 */ .sidebar-menu { flex: 1; padding: 12px 8px; display: flex; flex-direction: column; gap: 4px; } .menu-item { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border: none; background: transparent; border-radius: 6px; cursor: pointer; transition: all 0.2s; width: 100%; text-align: left; } .menu-item:hover { background: rgba(0, 104, 74, 0.08); } .menu-item.active { background: rgba(0, 104, 74, 0.12); color: rgb(0 104 74); } .menu-icon { font-size: 16px; color: #666; display: flex; align-items: center; } .menu-item.active .menu-icon { color: rgb(0 104 74); } .menu-label { font-size: 14px; color: #333; } .menu-item.active .menu-label { color: rgb(0 104 74); font-weight: 500; } /* 右侧主内容区 */ .dataset-main { flex: 1; height: 85vh; min-width: 0; display: flex; flex-direction: column; overflow: hidden; background: #fff; } /* ============================================================================ * 通用页面样式 * ============================================================================ */ /* 页面头部 */ .page-header { display: flex; justify-content: space-between; align-items: flex-start; padding: 20px 24px 16px; border-bottom: 1px solid #f0f0f0; flex-shrink: 0; gap: 16px; } .page-header h1 { font-size: 18px; font-weight: 600; color: #1a1a1a; margin: 0 0 4px 0; } .page-description { font-size: 13px; color: #666; margin: 0; } /* 工具栏 */ .detail-toolbar { display: flex; justify-content: space-between; align-items: center; padding: 16px 24px; flex-shrink: 0; } /* 表格容器 */ .detail-table-container { flex: 1; min-height: 0; padding: 0 24px 24px; overflow-y: auto; } /* 加载状态 */ .loading-state { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 60px 0; gap: 16px; } .loading-text { color: #999; font-size: 14px; } /* 空状态 */ .empty-state { padding: 60px 0; } /* ============================================================================ * 召回测试页面样式 * ============================================================================ */ .retrieve-test-page { display: flex; flex-direction: column; height: 100%; overflow: hidden; } .retrieve-settings { margin: 16px 24px; flex-shrink: 0; } .search-row { display: flex; gap: 12px; margin-bottom: 16px; } .search-row .search-input { flex: 1; } .options-row { display: flex; gap: 24px; align-items: center; flex-wrap: wrap; } .option-item { display: flex; align-items: center; gap: 8px; } .option-label { font-size: 13px; color: #666; } .option-value { font-size: 13px; color: #333; min-width: 24px; } .retrieve-results { flex: 1; min-height: 0; padding: 0 24px 24px; overflow-y: auto; } .results-header { padding: 8px 0 16px; font-size: 13px; color: #666; } /* ============================================================================ * 设置页面样式 * ============================================================================ */ .dataset-settings-page { display: flex; flex-direction: column; height: 100%; overflow: hidden; } .settings-card { margin: 16px 24px; flex-shrink: 0; } .settings-loading { display: flex; align-items: center; justify-content: center; height: 100%; } .readonly-info { margin-top: 24px; padding-top: 24px; border-top: 1px solid #f0f0f0; } .readonly-info .info-item { display: flex; align-items: center; padding: 8px 0; } .readonly-info .info-label { width: 120px; font-size: 13px; color: #666; } .readonly-info .info-value { font-size: 13px; color: #333; } .form-actions { display: flex; justify-content: flex-end; gap: 12px; margin-top: 24px; padding-top: 24px; border-top: 1px solid #f0f0f0; } /* ============================================================================ * 文档列表页面样式 * ============================================================================ */ .document-list-page { display: flex; flex-direction: column; height: 100%; overflow: hidden; } .document-list-page .page-header { flex-shrink: 0; } .document-list-page .header-left { flex: 1; } .document-list-page .header-actions { display: flex; gap: 12px; align-items: center; } .document-search-bar { padding: 16px 24px; flex-shrink: 0; } .document-table-wrapper { flex: 1; min-height: 0; padding: 0 24px; overflow: hidden; display: flex; flex-direction: column; } .document-table-wrapper .document-table { flex: 1; min-height: 0; } .document-table-wrapper .document-table .ant-table-wrapper, .document-table-wrapper .document-table .ant-table, .document-table-wrapper .document-table .ant-table-container { height: 100%; } .document-table-wrapper .document-table .ant-table-body { max-height: none !important; overflow-y: auto !important; } .document-list-page .document-pagination { padding: 12px 24px; margin-top: 0; } /* ============================================================================ * 文档详情页面样式 - Dify 布局风格 + 项目主题色 * ============================================================================ */ .document-detail-page { display: flex; flex-direction: column; height: 100%; overflow: hidden; background: #fff; } .document-detail-empty { display: flex; align-items: center; justify-content: center; height: 100%; background: #fff; } .document-detail-content { display: flex; flex: 1; min-height: 0; overflow: hidden; } /* 左侧设置面板 */ .settings-panel { width: 420px; min-width: 420px; background: #fafafa; padding: 24px; overflow-y: auto; border-right: 1px solid #f0f0f0; } .settings-panel .ant-divider { border-color: #e5e5e5; margin: 20px 0; } .settings-section { margin-bottom: 8px; } .section-title { font-size: 14px; font-weight: 600; color: #1a1a1a; margin: 0 0 16px 0; } /* 分块模式选择器 */ .mode-selector { margin-bottom: 20px; } .mode-option { display: flex; align-items: flex-start; gap: 12px; padding: 12px 16px; background: #fff; border: 2px solid #e5e5e5; border-radius: 8px; cursor: pointer; transition: all 0.2s; } .mode-option:hover { border-color: rgba(0, 104, 74, 0.5); } .mode-option.active { border-color: #00684a; background: rgba(0, 104, 74, 0.05); } .mode-icon { width: 36px; height: 36px; background: linear-gradient(135deg, #00684a 0%, #008c64 100%); border-radius: 8px; display: flex; align-items: center; justify-content: center; color: #fff; font-size: 18px; flex-shrink: 0; } .mode-info { display: flex; flex-direction: column; gap: 4px; } .mode-name { font-size: 14px; font-weight: 500; color: #1a1a1a; } .mode-desc { font-size: 12px; color: #666; line-height: 1.4; } /* 设置项 */ .setting-item { margin-bottom: 16px; } .setting-label { display: flex; align-items: center; gap: 6px; font-size: 13px; color: #333; margin-bottom: 8px; } .help-icon { color: #999; font-size: 12px; cursor: help; } .setting-input { background: #fff !important; border-color: #d9d9d9 !important; color: #333 !important; } .setting-input:hover, .setting-input:focus { border-color: #00684a !important; } .setting-input::placeholder { color: #999; } .setting-input-with-suffix { display: flex; align-items: center; gap: 8px; } .setting-input-number { flex: 1; background: #fff !important; border-color: #d9d9d9 !important; } .setting-input-number .ant-input-number-input { color: #333 !important; } .setting-input-number:hover, .setting-input-number.ant-input-number-focused { border-color: #00684a !important; } .input-suffix { font-size: 13px; color: #666; } /* 复选框组 */ .checkbox-group { display: flex; flex-direction: column; gap: 12px; } .checkbox-group .ant-checkbox-wrapper { color: #333; font-size: 13px; } .checkbox-group .ant-checkbox-checked .ant-checkbox-inner { background-color: #00684a; border-color: #00684a; } /* Q&A 分段行 */ .qa-segment-row { display: flex; align-items: center; gap: 12px; } .qa-segment-row .ant-checkbox-wrapper { color: #333; font-size: 13px; } .qa-segment-row .ant-select { min-width: 100px; } .qa-segment-row .ant-select-selector { background: #fff !important; border-color: #d9d9d9 !important; color: #333 !important; } /* 设置操作按钮 */ .settings-actions { display: flex; gap: 12px; margin-top: 20px; } .settings-actions .ant-btn { background: #fff; border-color: #d9d9d9; color: #333; } .settings-actions .ant-btn:hover { border-color: #00684a; color: #00684a; } /* 保存操作按钮 */ .save-actions { margin-top: 20px; } .save-actions .ant-btn-primary { background: #00684a; border-color: #00684a; } .save-actions .ant-btn-primary:hover { background: #005a3f; border-color: #005a3f; } .save-actions .ant-btn-default { background: #fff; border-color: #d9d9d9; color: #333; } .save-actions .ant-btn-default:hover { border-color: #00684a; color: #00684a; } /* 右侧预览面板 */ .preview-panel { height: 85vh; flex: 1; min-width: 0; background: #f5f5f5; padding: 24px; overflow: hidden; display: flex; flex-direction: column; } .preview-card { flex: 1; display: flex; flex-direction: column; background: #fff !important; border: 1px solid #e5e5e5 !important; min-height: 0; overflow: hidden; } .preview-card > .ant-card-head { background: #fafafa; border-bottom: 1px solid #e5e5e5; padding: 12px 16px; min-height: auto; flex-shrink: 0; } .preview-card > .ant-card-head .ant-card-head-title { padding: 0; } .preview-card > .ant-card-body { flex: 1; overflow-y: auto; overflow-x: hidden; padding: 16px; min-height: 0; max-height: 100%; } /* 滚动条样式 */ .preview-card > .ant-card-body::-webkit-scrollbar { width: 6px; } .preview-card > .ant-card-body::-webkit-scrollbar-thumb { background: #d9d9d9; border-radius: 3px; } .preview-card > .ant-card-body::-webkit-scrollbar-thumb:hover { background: #bfbfbf; } .preview-card > .ant-card-body::-webkit-scrollbar-track { background: transparent; } .preview-header { display: flex; align-items: center; gap: 16px; color: #1a1a1a; font-size: 14px; } .preview-header .ant-select-selector { background: #fff !important; border-color: #d9d9d9 !important; color: #333 !important; } .segment-count { color: #666; font-size: 12px; } /* 预览加载状态 */ .preview-loading { display: flex; flex-direction: column; align-items: center; justify-content: center; height: 100%; gap: 16px; } .preview-loading .loading-text { color: #666; } /* 预览空状态 */ .preview-empty { display: flex; flex-direction: column; align-items: center; justify-content: center; height: 100%; color: #999; } .preview-empty .empty-icon { font-size: 48px; margin-bottom: 16px; color: #d9d9d9; } .preview-empty p { margin: 0; font-size: 14px; } /* 预览分段列表 */ .preview-segments { display: flex; flex-direction: column; gap: 12px; /* 关键修复:添加高度约束和内部滚动 */ height: 100%; min-height: 0; overflow-y: auto; overflow-x: hidden; } .segment-item { background: #fafafa; border: 1px solid #e5e5e5; border-radius: 8px; padding: 12px; } .segment-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 8px; } .segment-index { font-size: 12px; font-weight: 600; color: #00684a; } .segment-chars { font-size: 12px; color: #999; } .segment-content { font-size: 13px; color: #333; line-height: 1.6; white-space: pre-wrap; word-break: break-word; } /* Ant Design 组件主题色覆盖 */ .document-detail-page .ant-input:hover, .document-detail-page .ant-input:focus, .document-detail-page .ant-input-number:hover, .document-detail-page .ant-input-number-focused { border-color: #00684a; } .document-detail-page .ant-input:focus, .document-detail-page .ant-input-focused, .document-detail-page .ant-input-number-focused { box-shadow: 0 0 0 2px rgba(0, 104, 74, 0.1); } .document-detail-page .ant-select-focused .ant-select-selector { border-color: #00684a !important; box-shadow: 0 0 0 2px rgba(0, 104, 74, 0.1) !important; } .document-detail-page .ant-select-item-option-selected { background: rgba(0, 104, 74, 0.1) !important; } .document-detail-page .ant-select-item-option-active { background: rgba(0, 104, 74, 0.05) !important; } .document-detail-page .ant-checkbox-checked .ant-checkbox-inner { background-color: #00684a; border-color: #00684a; } .document-detail-page .ant-checkbox-wrapper:hover .ant-checkbox-inner { border-color: #00684a; } /* 响应式调整 */ @media (max-width: 1200px) { .settings-panel { width: 360px; min-width: 360px; } } @media (max-width: 992px) { .document-detail-content { flex-direction: column; } .settings-panel { width: 100%; min-width: 100%; max-height: 50%; } .preview-panel { max-height: 50%; } } /* ============================================================================ * 旧样式保留(向后兼容) * ============================================================================ */ /* 卡片容器 - 无边框阴影,直接融入 */ .dataset-manager-card { display: flex; flex-direction: column; flex: 1; min-height: 0; max-height: 100%; background: #fff; overflow: hidden; } /* 加载状态 */ .dataset-loading-state { display: flex; flex-direction: column; align-items: center; justify-content: center; height: 100%; gap: 16px; } .dataset-loading-state .loading-text { color: #666; font-size: 14px; } /* Spin 组件主题色 */ .dataset-loading-state .ant-spin .ant-spin-dot-item, .dataset-loading .ant-spin .ant-spin-dot-item { background-color: rgb(0 104 74); } /* 错误状态 */ .dataset-error-state { display: flex; flex-direction: column; align-items: center; justify-content: center; height: 100%; padding: 40px; text-align: center; } .dataset-error-state .error-icon { font-size: 48px; color: #ff4d4f; margin-bottom: 16px; } .dataset-error-state h3 { font-size: 18px; font-weight: 600; color: #1a1a1a; margin: 0 0 8px 0; } .dataset-error-state p { font-size: 14px; color: #666; margin: 0; } /* 内容区域 */ .dataset-content { display: flex; flex-direction: column; flex: 1; min-height: 0; padding: 16px 20px; overflow: hidden; } /* 头部区域 */ .dataset-header { display: flex; justify-content: space-between; align-items: center; flex-shrink: 0; padding-bottom: 12px; border-bottom: 1px solid #f0f0f0; margin-bottom: 12px; } .dataset-header h1 { font-size: 18px; font-weight: 600; color: #1a1a1a; margin: 0; display: flex; align-items: center; gap: 8px; } /* 可编辑标题样式 */ .dataset-header h1.editable-title { cursor: pointer; padding: 4px 8px; margin: -4px -8px; border-radius: 6px; transition: background-color 0.2s; } .dataset-header h1.editable-title:hover { background-color: #f5f5f5; } .dataset-header h1.editable-title .edit-icon { font-size: 14px; color: #999; opacity: 0; transition: opacity 0.2s; } .dataset-header h1.editable-title:hover .edit-icon { opacity: 1; } /* 编辑名称状态 */ .dataset-name-edit { display: flex; align-items: center; gap: 8px; } .dataset-name-edit .ant-input { border-color: #00684a; box-shadow: 0 0 0 2px rgba(0, 104, 74, 0.1); } .dataset-name-edit .ant-input:focus { border-color: #00684a; box-shadow: 0 0 0 2px rgba(0, 104, 74, 0.2); } .dataset-header-actions { display: flex; gap: 12px; } /* 工具栏 */ .document-list-toolbar { display: flex; justify-content: space-between; align-items: center; flex-shrink: 0; margin-bottom: 12px; } .document-list-search { width: 280px; } .document-list-actions { display: flex; align-items: center; gap: 12px; } /* 表格容器 */ .document-table-container { flex: 1; min-height: 0; overflow: hidden; } .document-table { height: 100%; background: transparent; } .document-table .ant-table-wrapper, .document-table .ant-table, .document-table .ant-table-container { height: 100%; background: transparent; } /* 表头样式 */ .document-table .ant-table-thead > tr > th { background: #fafafa !important; font-weight: 600; font-size: 13px; color: #1a1a1a; padding: 8px 12px !important; } /* 压缩行高 */ .document-table .ant-table-tbody > tr > td { padding: 6px 12px !important; font-size: 13px; } .document-table .ant-table-tbody > tr:hover > td { background: #f5f7f9; } /* 表格内部滚动区域 */ .document-table .ant-table-body { scrollbar-width: thin; } .document-table .ant-table-body::-webkit-scrollbar { width: 6px; } .document-table .ant-table-body::-webkit-scrollbar-thumb { background: #d9d9d9; border-radius: 3px; } .document-table .ant-table-body::-webkit-scrollbar-thumb:hover { background: #bfbfbf; } /* 固定底部分页器 */ .document-pagination { display: flex; justify-content: space-between; align-items: center; padding: 15px 0 4px 0; border-top: 1px solid #f0f0f0; flex-shrink: 0; background: #fff; margin-top: 15px; } .pagination-total { color: #666; font-size: 13px; } .pagination-controls { display: flex; align-items: center; gap: 8px; } .pagination-info { color: #666; font-size: 13px; } /* 空状态 */ .dataset-empty { display: flex; flex-direction: column; align-items: center; justify-content: center; flex: 1; padding: 60px 40px; color: #999; } /* 加载状态 */ .dataset-loading { display: flex; flex-direction: column; align-items: center; justify-content: center; flex: 1; gap: 16px; } /* 响应式 */ @media (max-width: 991px) { .dataset-content { padding: 16px; } .dataset-header { flex-direction: column; align-items: flex-start; gap: 12px; } .dataset-header-actions { width: 100%; justify-content: flex-end; } .document-list-toolbar { flex-direction: column; align-items: stretch; gap: 12px; } .document-list-search { width: 100%; } .document-list-actions { justify-content: space-between; } } @media (max-width: 576px) { .dataset-content { padding: 12px; } .dataset-header h1 { font-size: 16px; } } /* ============================================================================ * 分段管理组件样式(页面模式) * ============================================================================ */ /* 分段管理页面容器 */ .segment-manager-page { display: flex; flex-direction: column; height: 100%; background: #fff; overflow: hidden; } /* 分段管理头部 */ .segment-manager-header { display: flex; justify-content: space-between; align-items: center; flex-shrink: 0; padding: 16px 24px; border-bottom: 1px solid #f0f0f0; } .segment-header-left { display: flex; align-items: center; gap: 8px; } .segment-manager-header .back-button { font-size: 16px; color: #666; padding: 4px 8px; border-radius: 6px; transition: all 0.2s; } .segment-manager-header .back-button:hover { color: #00684a; background-color: rgba(0, 104, 74, 0.08); } .segment-manager-header .segment-title { font-size: 18px; font-weight: 600; color: #1a1a1a; margin: 0; } /* 分段管理内容区域 */ .segment-manager-content { flex: 1; min-height: 0; padding: 16px 24px; overflow-y: auto; overflow-x: hidden; } /* Tabs 样式 */ .segment-manager-content .ant-tabs-tab-active { color: #00684a !important; } .segment-manager-content .ant-tabs-ink-bar { background-color: #00684a !important; } /* 分段内容预览 */ .segment-content-preview { font-size: 13px; line-height: 1.5; color: #333; } /* 检索结果内容 */ .retrieve-result-content { display: flex; flex-direction: column; gap: 8px; } .retrieve-result-content .content-text { font-size: 13px; line-height: 1.6; color: #333; } .retrieve-result-content .answer-text { font-size: 12px; line-height: 1.5; color: #666; padding: 8px 12px; background: #f9f9f9; border-radius: 4px; border-left: 3px solid #00684a; } /* 分段工具栏 */ .segment-toolbar { margin-bottom: 16px; display: flex; justify-content: space-between; } /* 分段弹窗内的按钮主题色 */ .ant-modal-root .ant-btn-primary { background-color: #00684a; border-color: #00684a; } .ant-modal-root .ant-btn-primary:hover { background-color: #005a3f; border-color: #005a3f; } /* Switch 组件主题色 */ .ant-switch-checked { background-color: #00684a !important; } /* Tag 主题色 */ .ant-tag-success { color: #00684a; border-color: #b7eb8f; background: #f6ffed; } /* Tabs 主题色 */ .ant-tabs-tab.ant-tabs-tab-active .ant-tabs-tab-btn { color: #00684a; } .ant-tabs-ink-bar { background-color: #00684a; } .ant-tabs-tab:hover { color: #00684a; } /* Slider 主题色 */ .ant-slider-track { background-color: #00684a !important; } .ant-slider-handle::after { box-shadow: 0 0 0 2px #00684a !important; } .ant-slider:hover .ant-slider-track { background-color: #005a3f !important; } /* Select 主题色 */ .ant-select-item-option-selected { background-color: rgba(0, 104, 74, 0.1) !important; } .ant-select:hover .ant-select-selector { border-color: #00684a !important; } .ant-select-focused .ant-select-selector { border-color: #00684a !important; box-shadow: 0 0 0 2px rgba(0, 104, 74, 0.1) !important; } /* Input 主题色 */ .ant-input:hover, .ant-input-affix-wrapper:hover { border-color: #00684a; } .ant-input:focus, .ant-input-affix-wrapper:focus, .ant-input-focused, .ant-input-affix-wrapper-focused { border-color: #00684a; box-shadow: 0 0 0 2px rgba(0, 104, 74, 0.1); } /* 分页组件主题色 */ .ant-pagination-item-active { border-color: #00684a; } .ant-pagination-item-active a { color: #00684a; } /* ============================================================================ * 全局加载/刷新图标颜色 - 统一使用主题绿色 * ============================================================================ */ /* Spin 加载动画 */ .dataset-manager-wrapper .ant-spin .ant-spin-dot-item, .segment-manager-page .ant-spin .ant-spin-dot-item { background-color: rgb(0 104 74) !important; } /* Button loading 状态图标 */ .dataset-manager-wrapper .ant-btn-loading-icon .anticon, .segment-manager-page .ant-btn-loading-icon .anticon { color: rgb(0 104 74) !important; } /* 同步中图标 (SyncOutlined spin) */ .dataset-manager-wrapper .anticon-sync, .segment-manager-page .anticon-sync { color: rgb(0 104 74) !important; } /* processing 状态的 Tag 图标 */ .dataset-manager-wrapper .ant-tag-processing, .segment-manager-page .ant-tag-processing { color: rgb(0 104 74) !important; border-color: rgb(0 104 74) !important; background: rgba(0, 104, 74, 0.1) !important; } .dataset-manager-wrapper .ant-tag-processing .anticon, .segment-manager-page .ant-tag-processing .anticon { color: rgb(0 104 74) !important; } /* 刷新按钮 loading 状态 */ .dataset-manager-wrapper .ant-btn .anticon-loading, .segment-manager-page .ant-btn .anticon-loading { color: rgb(0 104 74) !important; } /* 确保所有 spin 动画图标都是绿色 */ .dataset-manager-wrapper .anticon-spin, .segment-manager-page .anticon-spin { color: rgb(0 104 74) !important; } /* ============================================================================ * 上传配置对话框样式 * ============================================================================ */ .upload-config-modal .ant-modal-header { border-bottom: 1px solid #f0f0f0; padding: 16px 24px; } .upload-config-modal .ant-modal-title { font-size: 16px; font-weight: 600; color: #1a1a1a; } .upload-config-modal .ant-modal-body { padding: 24px; } .upload-config-modal .ant-modal-footer { border-top: 1px solid #f0f0f0; padding: 12px 24px; } .upload-config-modal .ant-btn-primary { background-color: #00684a; border-color: #00684a; } .upload-config-modal .ant-btn-primary:hover { background-color: #005a3f; border-color: #005a3f; } /* 文件信息区域 */ .upload-config-form .file-info-section, .upload-progress-container .file-info-section { margin-bottom: 16px; } .upload-config-form .file-info, .upload-progress-container .file-info { display: flex; align-items: center; gap: 12px; padding: 12px 16px; background: #f5f7f9; border-radius: 8px; border: 1px solid #e5e5e5; } .upload-config-form .file-icon, .upload-progress-container .file-icon { font-size: 24px; color: #00684a; } .upload-config-form .file-details, .upload-progress-container .file-details { display: flex; flex-direction: column; gap: 2px; flex: 1; min-width: 0; } .upload-config-form .file-name, .upload-progress-container .file-name { font-size: 14px; font-weight: 500; color: #1a1a1a; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .upload-config-form .file-size, .upload-progress-container .file-size { font-size: 12px; color: #666; } /* 设置项样式 */ .upload-config-form .setting-item { margin-bottom: 16px; } .upload-config-form .setting-label { display: flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 500; color: #333; margin-bottom: 8px; } .upload-config-form .help-icon { color: #999; font-size: 12px; cursor: help; } .upload-config-form .checkbox-group { display: flex; flex-direction: column; gap: 10px; } .upload-config-form .checkbox-group .ant-checkbox-wrapper { color: #333; font-size: 13px; } .upload-config-form .checkbox-group .ant-checkbox-checked .ant-checkbox-inner { background-color: #00684a; border-color: #00684a; } /* 进度容器 */ .upload-progress-container { min-height: 200px; } .upload-progress-container .progress-section { padding: 24px 0; } .upload-progress-container .status-text { display: flex; align-items: center; justify-content: center; gap: 8px; margin-top: 16px; font-size: 14px; color: #666; } .upload-progress-container .status-icon { color: #00684a; } /* 成功状态 */ .upload-progress-container .success-state { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 24px; } .upload-progress-container .success-icon { font-size: 48px; color: #52c41a; margin-bottom: 16px; } .upload-progress-container .success-text { font-size: 16px; font-weight: 500; color: #1a1a1a; } /* 错误状态 */ .upload-progress-container .error-state { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 24px; } .upload-progress-container .error-icon { font-size: 48px; color: #ff4d4f; margin-bottom: 16px; } .upload-progress-container .error-text { font-size: 14px; color: #ff4d4f; text-align: center; } /* 索引阶段指示器 */ .upload-progress-container .indexing-stages { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 24px; padding: 16px; background: #f5f7f9; border-radius: 8px; } .upload-progress-container .stage-item { display: flex; align-items: center; gap: 6px; font-size: 12px; color: #999; padding: 4px 8px; background: #fff; border-radius: 4px; border: 1px solid #e5e5e5; transition: all 0.2s; } .upload-progress-container .stage-item.active { color: #00684a; border-color: #00684a; background: rgba(0, 104, 74, 0.05); } .upload-progress-container .stage-dot { width: 6px; height: 6px; border-radius: 50%; background: #d9d9d9; transition: background 0.2s; } .upload-progress-container .stage-item.active .stage-dot { background: #00684a; } /* 进度条主题色 */ .upload-config-modal .ant-progress-bg { background-color: #00684a; } .upload-config-modal .ant-progress-status-active .ant-progress-bg::before { background: #fff; } /* Divider 样式 */ .upload-config-form .ant-divider { margin: 16px 0; border-color: #e5e5e5; } .upload-config-form .ant-divider-inner-text { font-size: 13px; font-weight: 500; color: #666; } /* Select 和 Input 主题色 */ .upload-config-modal .ant-select:hover .ant-select-selector { border-color: #00684a !important; } .upload-config-modal .ant-select-focused .ant-select-selector { border-color: #00684a !important; box-shadow: 0 0 0 2px rgba(0, 104, 74, 0.1) !important; } .upload-config-modal .ant-input:hover, .upload-config-modal .ant-input-number:hover { border-color: #00684a; } .upload-config-modal .ant-input:focus, .upload-config-modal .ant-input-focused, .upload-config-modal .ant-input-number:focus, .upload-config-modal .ant-input-number-focused { border-color: #00684a; box-shadow: 0 0 0 2px rgba(0, 104, 74, 0.1); } /* Spin 主题色 */ .upload-config-modal .ant-spin .ant-spin-dot-item { background-color: #00684a !important; } /* ============================================================================ * 文档上传页面样式 * ============================================================================ */ .document-upload-page { display: flex; flex-direction: column; height: 100%; background: #fff; overflow: hidden; } /* 上传页面头部 */ .upload-header { display: flex; align-items: center; justify-content: center; padding: 16px 24px; border-bottom: 1px solid #f0f0f0; flex-shrink: 0; position: relative; } .upload-header .back-btn { position: absolute; left: 24px; color: #666; font-size: 14px; padding: 4px 12px; height: auto; } .upload-header .back-btn:hover { color: #00684a; background: rgba(0, 104, 74, 0.08); } /* 步骤指示器 */ .upload-steps { display: inline-flex; align-items: center; gap: 0; } .step-item { display: inline-flex; align-items: center; gap: 8px; color: #999; font-size: 13px; white-space: nowrap; } /* 修复样式污染:移除其他页面可能定义的伪元素 */ .document-upload-page .step-item::after, .document-upload-page .step-item::before { content: none !important; display: none !important; } .step-item.active { color: #00684a; } .step-item.completed { color: #52c41a; } .step-number { width: 24px; height: 24px; border-radius: 50%; background: #f0f0f0; display: inline-flex; align-items: center; justify-content: center; font-size: 12px; font-weight: 600; transition: all 0.2s; flex-shrink: 0; } .step-item.active .step-number { background: #00684a; color: #fff; } .step-item.completed .step-number { background: #52c41a; color: #fff; } .step-title { font-weight: 500; } .step-divider { width: 64px; height: 1px; background: #d9d9d9; margin: 0 16px; flex-shrink: 0; } .step-divider.completed { background: #52c41a; } /* 上传内容区域 */ .upload-content { flex: 1; overflow-y: auto; padding: 24px; } /* 第一步:选择文件 */ .upload-step-content.step1 { max-width: 800px; margin: 0 auto; } .step-heading { font-size: 24px; font-weight: 600; color: #1a1a1a; margin: 0 0 8px 0; } .step-description { font-size: 14px; color: #666; margin: 0 0 24px 0; line-height: 1.6; } /* 文件拖拽区域 */ .file-drop-zone { margin-bottom: 24px; } .file-drop-zone .ant-upload-drag { border: 2px dashed #d9d9d9; border-radius: 12px; background: #fafafa; padding: 40px 20px; transition: all 0.2s; } .file-drop-zone .ant-upload-drag:hover { border-color: #00684a; background: rgba(0, 104, 74, 0.02); } .file-drop-zone .ant-upload-drag-icon { color: #999; font-size: 48px !important; } .file-drop-zone .ant-upload-text { font-size: 14px; color: #333; } .file-drop-zone .upload-link { color: #00684a; font-weight: 500; cursor: pointer; } .file-drop-zone .ant-upload-hint { font-size: 12px; color: #999; margin-top: 8px; } /* 已选文件区域 */ .selected-files-section { margin-bottom: 24px; } .section-subtitle { font-size: 14px; font-weight: 600; color: #1a1a1a; margin: 0 0 12px 0; } .selected-files-list { display: flex; flex-direction: column; gap: 8px; } .selected-file-item { display: flex; align-items: center; gap: 12px; padding: 12px 16px; background: #f5f7f9; border-radius: 8px; border: 1px solid #e5e5e5; } .selected-file-item .file-icon { font-size: 24px; color: #00684a; } .selected-file-item .file-info { flex: 1; min-width: 0; } .selected-file-item .file-name { font-size: 14px; font-weight: 500; color: #1a1a1a; display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .selected-file-item .file-size { font-size: 12px; color: #666; } .selected-file-item .remove-file-btn { color: #999; } .selected-file-item .remove-file-btn:hover { color: #ff4d4f; } /* 步骤操作按钮 */ .step-actions { display: flex; justify-content: flex-end; margin-top: 24px; } .step-actions .next-btn { min-width: 120px; height: 40px; font-size: 14px; background: #00684a; border-color: #00684a; } .step-actions .next-btn:hover { background: #005a3f; border-color: #005a3f; } .step-actions .next-btn:disabled { background: #d9d9d9; border-color: #d9d9d9; } /* 第二步:分段配置与预览 */ .upload-step-content.step2 { height: 100%; display: flex; flex-direction: column; } /* 处理进度区 */ .processing-status { background: #f5f7f9; border-radius: 12px; padding: 24px; margin-bottom: 24px; } .processing-status .processing-title { display: flex; align-items: center; justify-content: center; gap: 10px; font-size: 14px; font-weight: 500; color: #1a1a1a; margin-bottom: 16px; } .processing-file { display: flex; align-items: center; gap: 12px; margin-bottom: 16px; } .processing-file .file-icon { font-size: 24px; color: #00684a; } .processing-file .file-name { flex: 1; font-size: 14px; font-weight: 500; color: #1a1a1a; } .processing-file .status-icon { font-size: 18px; } .processing-file .status-icon.success { color: #52c41a; } .processing-file .status-icon.error { color: #ff4d4f; } .processing-file .status-icon.loading { color: #00684a; } .processing-status .status-text { text-align: center; font-size: 13px; color: #666; margin-top: 12px; } /* 索引阶段指示器(Step2) */ .processing-status .indexing-stages { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 16px; justify-content: center; } .processing-status .stage-item { display: flex; align-items: center; gap: 6px; font-size: 12px; color: #999; padding: 4px 10px; background: #fff; border-radius: 4px; border: 1px solid #e5e5e5; transition: all 0.2s; } .processing-status .stage-item.active { color: #00684a; border-color: #00684a; background: rgba(0, 104, 74, 0.05); } .processing-status .stage-dot { width: 6px; height: 6px; border-radius: 50%; background: #d9d9d9; transition: background 0.2s; } .processing-status .stage-item.active .stage-dot { background: #00684a; } /* 错误状态 */ .error-state { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 48px; text-align: center; } .error-state .error-icon { font-size: 48px; color: #ff4d4f; margin-bottom: 16px; } .error-state .error-text { font-size: 14px; color: #666; margin-bottom: 24px; } /* 索引方式选项 */ .index-options { display: flex; flex-direction: column; gap: 8px; } .index-option { display: flex; align-items: center; gap: 10px; padding: 12px 16px; background: #fff; border: 1px solid #e5e5e5; border-radius: 8px; cursor: pointer; transition: all 0.2s; } .index-option:hover { border-color: #00684a; } .index-option.active { border-color: #00684a; background: rgba(0, 104, 74, 0.05); } .index-option .option-radio { width: 16px; height: 16px; border-radius: 50%; border: 2px solid #d9d9d9; position: relative; transition: all 0.2s; } .index-option.active .option-radio { border-color: #00684a; } .index-option.active .option-radio::after { content: ''; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 8px; height: 8px; border-radius: 50%; background: #00684a; } .index-option .option-label { font-size: 14px; color: #333; } .index-option .option-badge { font-size: 11px; padding: 2px 6px; border-radius: 4px; margin-left: auto; } .index-option .option-badge.recommended { background: rgba(0, 104, 74, 0.1); color: #00684a; } /* 完成状态底部操作 */ .completion-actions { display: flex; justify-content: center; padding: 24px; border-top: 1px solid #f0f0f0; margin-top: auto; } .completion-actions .ant-btn-primary { min-width: 140px; height: 40px; font-size: 14px; background: #00684a; border-color: #00684a; } .completion-actions .ant-btn-primary:hover { background: #005a3f; border-color: #005a3f; } /* 上传页面的分段内容布局(复用 document-detail-content) */ .upload-step-content .document-detail-content { flex: 1; min-height: 0; } /* 上传页面的设置操作按钮 */ .upload-step-content .settings-actions { margin-top: 24px; display: flex; gap: 12px; } .upload-step-content .settings-actions .ant-btn-primary { background: #00684a; border-color: #00684a; } .upload-step-content .settings-actions .ant-btn-primary:hover { background: #005a3f; border-color: #005a3f; } /* 进度条主题色 */ .document-upload-page .ant-progress-bg { background-color: #00684a; } .document-upload-page .ant-progress-status-active .ant-progress-bg::before { background: #fff; } /* Spin 主题色 */ .document-upload-page .ant-spin .ant-spin-dot-item { background-color: #00684a !important; } /* 预览框内的进度显示 */ .preview-processing { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 40px 24px; min-height: 300px; } .preview-processing .processing-file { display: flex; align-items: center; gap: 12px; margin-bottom: 24px; width: 100%; max-width: 400px; } .preview-processing .file-icon { font-size: 24px; color: #00684a; } .preview-processing .file-name { flex: 1; font-size: 14px; font-weight: 500; color: #1a1a1a; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .preview-processing .status-icon { font-size: 18px; } .preview-processing .status-icon.loading { color: #00684a; } .preview-processing .ant-progress { width: 100%; max-width: 400px; } .preview-processing .status-text { text-align: center; font-size: 13px; color: #666; margin-top: 12px; } .preview-processing .indexing-stages { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 24px; justify-content: center; max-width: 500px; } .preview-processing .stage-item { display: flex; align-items: center; gap: 6px; font-size: 12px; color: #999; padding: 4px 10px; background: #f5f7f9; border-radius: 4px; border: 1px solid #e5e5e5; transition: all 0.2s; } .preview-processing .stage-item.active { color: #00684a; border-color: #00684a; background: rgba(0, 104, 74, 0.05); } .preview-processing .stage-dot { width: 6px; height: 6px; border-radius: 50%; background: #d9d9d9; transition: background 0.2s; } .preview-processing .stage-item.active .stage-dot { background: #00684a; } /* 索引选项禁用状态 */ .index-option.disabled { opacity: 0.6; cursor: not-allowed; } .index-option.disabled:hover { border-color: #e5e5e5; } /* 预览框内错误状态 */ .preview-error { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 60px 24px; min-height: 300px; } .preview-error .error-icon { font-size: 48px; color: #ff4d4f; margin-bottom: 16px; } .preview-error .error-text { color: #666; font-size: 14px; text-align: center; } /* 完成统计样式 */ .completion-stats { color: #666; font-size: 14px; margin-right: 16px; } /* 文件选择下拉选项 */ .file-select-option { display: flex; align-items: center; } /* ============================================================================ * 强制覆盖主题色 - 绿色 #00684a * ============================================================================ */ /* 强制覆盖所有 Primary 按钮颜色 */ .dataset-manager-wrapper .ant-btn-primary { background-color: #00684a !important; border-color: #00684a !important; box-shadow: 0 2px 0 rgba(0, 104, 74, 0.1); } .dataset-manager-wrapper .ant-btn-primary:hover, .dataset-manager-wrapper .ant-btn-primary:focus { background-color: #005a3f !important; border-color: #005a3f !important; } .dataset-manager-wrapper .ant-btn-primary:active { background-color: #004d36 !important; border-color: #004d36 !important; } .dataset-manager-wrapper .ant-btn-primary:disabled { background-color: rgba(0, 0, 0, 0.04) !important; border-color: #d9d9d9 !important; color: rgba(0, 0, 0, 0.25) !important; box-shadow: none; } /* 强制覆盖 Upload Dragger 样式 */ .dataset-manager-wrapper .ant-upload-wrapper .ant-upload-drag:hover { border-color: #00684a !important; } .dataset-manager-wrapper .ant-upload-wrapper .ant-upload-drag .ant-upload-drag-icon .anticon { color: #00684a !important; } .dataset-manager-wrapper .ant-upload-wrapper .ant-upload-drag p.ant-upload-text { color: #333; } .dataset-manager-wrapper .ant-upload-wrapper .ant-upload-drag p.ant-upload-hint { color: #666; } /* 覆盖 Steps 组件的主题色 */ .dataset-manager-wrapper .ant-steps .ant-steps-item-process .ant-steps-item-icon { background-color: #00684a !important; border-color: #00684a !important; } .dataset-manager-wrapper .ant-steps .ant-steps-item-finish .ant-steps-item-icon { border-color: #00684a !important; } .dataset-manager-wrapper .ant-steps .ant-steps-item-finish .ant-steps-item-icon > .ant-steps-icon { color: #00684a !important; } .dataset-manager-wrapper .ant-steps .ant-steps-item-finish > .ant-steps-item-container > .ant-steps-item-content > .ant-steps-item-title::after { background-color: #00684a !important; } /* 覆盖 Checkbox 选中颜色 */ .dataset-manager-wrapper .ant-checkbox-checked .ant-checkbox-inner { background-color: #00684a !important; border-color: #00684a !important; } .dataset-manager-wrapper .ant-checkbox-wrapper:hover .ant-checkbox-inner, .dataset-manager-wrapper .ant-checkbox:hover .ant-checkbox-inner, .dataset-manager-wrapper .ant-checkbox-input:focus + .ant-checkbox-inner { border-color: #00684a !important; } /* 覆盖 Radio 选中颜色 */ .dataset-manager-wrapper .ant-radio-checked .ant-radio-inner { border-color: #00684a !important; background-color: #00684a !important; } .dataset-manager-wrapper .ant-radio-wrapper:hover .ant-radio-inner, .dataset-manager-wrapper .ant-radio:hover .ant-radio-inner, .dataset-manager-wrapper .ant-radio-input:focus + .ant-radio-inner { border-color: #00684a !important; } /* 覆盖 Switch 选中颜色 */ .dataset-manager-wrapper .ant-switch-checked { background-color: #00684a !important; } /* 覆盖 Select 选中项颜色 */ .dataset-manager-wrapper .ant-select-item-option-selected:not(.ant-select-item-option-disabled) { background-color: rgba(0, 104, 74, 0.1) !important; } /* 覆盖 Input/Select focus 边框颜色 */ .dataset-manager-wrapper .ant-input:focus, .dataset-manager-wrapper .ant-input-focused, .dataset-manager-wrapper .ant-input-number:focus, .dataset-manager-wrapper .ant-input-number-focused, .dataset-manager-wrapper .ant-select-focused:not(.ant-select-disabled).ant-select:not(.ant-select-customize-input) .ant-select-selector { border-color: #00684a !important; box-shadow: 0 0 0 2px rgba(0, 104, 74, 0.1) !important; } .dataset-manager-wrapper .ant-input:hover, .dataset-manager-wrapper .ant-input-number:hover, .dataset-manager-wrapper .ant-select:not(.ant-select-disabled):hover .ant-select-selector { border-color: #00684a !important; }