From 17cd46e9c3685880c356cc86b512e7e379f2cc98 Mon Sep 17 00:00:00 2001
From: root <295172551@qq.com>
Date: Sat, 2 Aug 2025 16:30:00 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E5=A4=8D=E4=B8=BB=E9=A2=98=E9=80=82?=
 =?UTF-8?q?=E9=85=8D=E9=97=AE=E9=A2=98=EF=BC=9A1.=20=E4=BF=AE=E5=A4=8D?=
 =?UTF-8?q?=E6=B6=88=E6=81=AF=E8=AF=A6=E6=83=85=E6=8A=BD=E5=B1=89=E6=BB=9A?=
 =?UTF-8?q?=E5=8A=A8=E6=9D=A1=E4=BD=8D=E7=BD=AE=E9=97=AE=E9=A2=98=202.=20?=
 =?UTF-8?q?=E7=A7=BB=E9=99=A4=E6=B6=88=E6=81=AF=E8=AF=A6=E6=83=85=E6=8A=BD?=
 =?UTF-8?q?=E5=B1=89=E7=9A=84=E4=BF=9D=E5=AD=98=E5=92=8C=E4=B8=8B=E8=BD=BD?=
 =?UTF-8?q?=E5=8A=9F=E8=83=BD=203.=20=E4=BF=AE=E5=A4=8DConfigContentViewer?=
 =?UTF-8?q?=E4=B8=BB=E9=A2=98=E9=80=82=E9=85=8D=E9=97=AE=E9=A2=98=204.=20?=
 =?UTF-8?q?=E4=BF=AE=E5=A4=8DRANConfigurationViewDialog=E4=B8=BB=E9=A2=98?=
 =?UTF-8?q?=E9=80=82=E9=85=8D=E9=97=AE=E9=A2=98=205.=20=E4=BF=AE=E5=A4=8DI?=
 =?UTF-8?q?MSConfigurationViewDialog=E4=B8=BB=E9=A2=98=E9=80=82=E9=85=8D?=
 =?UTF-8?q?=E9=97=AE=E9=A2=98=206.=20=E4=BF=AE=E5=A4=8DCoreNetworkConfigVi?=
 =?UTF-8?q?ewDialog=E4=B8=BB=E9=A2=98=E9=80=82=E9=85=8D=E9=97=AE=E9=A2=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../protocol-logs/ProtocolLogsTable.tsx       |  56 +-
 .../src/components/ui/ConfigContentViewer.tsx |   7 +-
 src/X1.WebUI/src/components/ui/drawer.tsx     |   2 +-
 .../CoreNetworkConfigViewDialog.tsx           |  20 +-
 .../IMSConfigurationViewDialog.tsx            |  20 +-
 .../RANConfigurationViewDialog.tsx            |  20 +-
 src/modify.md                                 | 487 +++++++++++++++++-
 7 files changed, 547 insertions(+), 65 deletions(-)

diff --git a/src/X1.WebUI/src/components/protocol-logs/ProtocolLogsTable.tsx b/src/X1.WebUI/src/components/protocol-logs/ProtocolLogsTable.tsx
index ab19215..8db7e08 100644
--- a/src/X1.WebUI/src/components/protocol-logs/ProtocolLogsTable.tsx
+++ b/src/X1.WebUI/src/components/protocol-logs/ProtocolLogsTable.tsx
@@ -261,35 +261,33 @@ export default function ProtocolLogsTable({
         </div>
       </div>
 
-             {/* 消息详情抽屉 */}
-       <Drawer open={isDrawerOpen} onOpenChange={setIsDrawerOpen}>
-         <div className="flex flex-col h-full">
-           <DrawerHeader className="flex-shrink-0">
-             <div className="flex items-center justify-between w-full">
-               <h2 className="text-lg font-semibold">Message Detail</h2>
-               <Button
-                 variant="ghost"
-                 size="sm"
-                 onClick={() => setIsDrawerOpen(false)}
-                 className="h-8 w-8 p-0"
-               >
-                 <X className="h-4 w-4" />
-               </Button>
-             </div>
-           </DrawerHeader>
-           
-                       <DrawerContent className="flex flex-col flex-1 min-h-0">
-              <div className="flex-1 p-4">
-                <ConfigContentViewer
-                  content={selectedMessageDetail || 'No message detail available'}
-                  onCopy={handleCopyMessageDetail}
-                  onDownload={handleDownloadMessageDetail}
-                  className="h-full"
-                />
-              </div>
-            </DrawerContent>
-         </div>
-       </Drawer>
+      {/* 消息详情抽屉 */}
+      <Drawer open={isDrawerOpen} onOpenChange={setIsDrawerOpen}>
+        <div className="flex flex-col h-full">
+          <DrawerHeader className="flex-shrink-0">
+            <div className="flex items-center justify-between w-full">
+              <h2 className="text-lg font-semibold">Message Detail</h2>
+              <Button
+                variant="ghost"
+                size="sm"
+                onClick={() => setIsDrawerOpen(false)}
+                className="h-8 w-8 p-0"
+              >
+                <X className="h-4 w-4" />
+              </Button>
+            </div>
+          </DrawerHeader>
+          
+          <DrawerContent className="flex flex-col flex-1 overflow-y-auto">
+            <div className="flex flex-col flex-1 min-h-0 p-4">
+              <ConfigContentViewer
+                content={selectedMessageDetail || 'No message detail available'}
+                className="flex-1"
+              />
+            </div>
+          </DrawerContent>
+        </div>
+      </Drawer>
     </>
   );
 } 
\ No newline at end of file
diff --git a/src/X1.WebUI/src/components/ui/ConfigContentViewer.tsx b/src/X1.WebUI/src/components/ui/ConfigContentViewer.tsx
index 9aa4c88..0a5f37c 100644
--- a/src/X1.WebUI/src/components/ui/ConfigContentViewer.tsx
+++ b/src/X1.WebUI/src/components/ui/ConfigContentViewer.tsx
@@ -152,7 +152,7 @@ export default function ConfigContentViewer({
           {isSearchVisible && (
             <div className="flex items-center gap-2 flex-1">
               <div className="relative flex-1">
-                <MagnifyingGlassIcon className="absolute left-3 top-1/2 transform -translate-y-1/2 h-4 w-4 text-gray-400" />
+                <MagnifyingGlassIcon className="absolute left-3 top-1/2 transform -translate-y-1/2 h-4 w-4 text-muted-foreground" />
                 <Input
                   placeholder="搜索内容... (Enter: 下一个, Shift+Enter: 上一个)"
                   value={searchTerm}
@@ -163,7 +163,7 @@ export default function ConfigContentViewer({
                 />
               </div>
               {searchTerm && (
-                <span className="text-sm text-gray-500 whitespace-nowrap">
+                <span className="text-sm text-muted-foreground whitespace-nowrap">
                   {totalMatches > 0 ? (
                     <span className="flex items-center gap-1">
                       <span>{currentMatchIndex + 1} / {totalMatches}</span>
@@ -236,11 +236,10 @@ export default function ConfigContentViewer({
       </div>
 
       {/* 配置内容显示区域 */}
-      <div className="flex-1 border rounded-md bg-gray-50 overflow-hidden">
+      <div className="flex-1 border rounded-md bg-muted/50 overflow-hidden min-h-0">
         <div 
           className="font-mono text-sm h-full overflow-auto p-3"
           style={{ 
-            height: '100%',
             whiteSpace: 'pre',
             wordWrap: 'normal',
             overflowWrap: 'normal'
diff --git a/src/X1.WebUI/src/components/ui/drawer.tsx b/src/X1.WebUI/src/components/ui/drawer.tsx
index b2ecf5d..bbc4252 100644
--- a/src/X1.WebUI/src/components/ui/drawer.tsx
+++ b/src/X1.WebUI/src/components/ui/drawer.tsx
@@ -58,7 +58,7 @@ interface DrawerContentProps {
 
 export function DrawerContent({ children, className }: DrawerContentProps) {
   return (
-    <div className={cn("flex-1 p-6 overflow-y-auto", className)}>
+    <div className={cn("flex-1 flex flex-col min-h-0", className)}>
       {children}
     </div>
   )
diff --git a/src/X1.WebUI/src/pages/core-network-configs/CoreNetworkConfigViewDialog.tsx b/src/X1.WebUI/src/pages/core-network-configs/CoreNetworkConfigViewDialog.tsx
index 5d156d0..6c812aa 100644
--- a/src/X1.WebUI/src/pages/core-network-configs/CoreNetworkConfigViewDialog.tsx
+++ b/src/X1.WebUI/src/pages/core-network-configs/CoreNetworkConfigViewDialog.tsx
@@ -64,9 +64,9 @@ export default function CoreNetworkConfigViewDialog({
 
   return (
     <Dialog open={open} onOpenChange={onOpenChange}>
-      <DialogContent className="max-w-4xl h-[80vh] flex flex-col">
+      <DialogContent className="max-w-4xl h-[80vh] flex flex-col bg-background text-foreground">
         <div className="flex items-center justify-between w-full mb-4 flex-shrink-0">
-          <DialogTitle className="text-lg font-semibold">
+          <DialogTitle className="text-lg font-semibold text-foreground">
             查看配置内容 - {config.name}
           </DialogTitle>
           <Button
@@ -83,16 +83,16 @@ export default function CoreNetworkConfigViewDialog({
           {/* 配置信息 */}
           <div className="grid grid-cols-2 gap-4 text-sm flex-shrink-0">
             <div>
-              <Label className="text-sm font-medium text-gray-600">配置名称</Label>
-              <div className="mt-1 text-gray-900">{config.name}</div>
+              <Label className="text-sm font-medium text-muted-foreground">配置名称</Label>
+              <div className="mt-1 text-foreground">{config.name}</div>
             </div>
             <div>
-              <Label className="text-sm font-medium text-gray-600">状态</Label>
+              <Label className="text-sm font-medium text-muted-foreground">状态</Label>
               <div className="mt-1">
                 <span className={`inline-flex items-center px-2 py-1 rounded-full text-xs font-medium ${
                   config.isDisabled 
-                    ? 'bg-red-100 text-red-800' 
-                    : 'bg-green-100 text-green-800'
+                    ? 'bg-destructive/10 text-destructive' 
+                    : 'bg-green-500/10 text-green-600 dark:text-green-400'
                 }`}>
                   {config.isDisabled ? '禁用' : '启用'}
                 </span>
@@ -100,15 +100,15 @@ export default function CoreNetworkConfigViewDialog({
             </div>
             {config.description && (
               <div className="col-span-2">
-                <Label className="text-sm font-medium text-gray-600">描述</Label>
-                <div className="mt-1 text-gray-900">{config.description}</div>
+                <Label className="text-sm font-medium text-muted-foreground">描述</Label>
+                <div className="mt-1 text-foreground">{config.description}</div>
               </div>
             )}
           </div>
 
           {/* 配置内容查看器 */}
           <div className="flex flex-col flex-1 min-h-0">
-            <Label className="text-sm font-medium text-gray-600 mb-2 flex-shrink-0">
+            <Label className="text-sm font-medium text-muted-foreground mb-2 flex-shrink-0">
               配置内容
             </Label>
             <ConfigContentViewer 
diff --git a/src/X1.WebUI/src/pages/ims-configurations/IMSConfigurationViewDialog.tsx b/src/X1.WebUI/src/pages/ims-configurations/IMSConfigurationViewDialog.tsx
index f6e2077..3f46842 100644
--- a/src/X1.WebUI/src/pages/ims-configurations/IMSConfigurationViewDialog.tsx
+++ b/src/X1.WebUI/src/pages/ims-configurations/IMSConfigurationViewDialog.tsx
@@ -64,9 +64,9 @@ export default function IMSConfigurationViewDialog({
 
   return (
     <Dialog open={open} onOpenChange={onOpenChange}>
-      <DialogContent className="max-w-4xl h-[80vh] flex flex-col">
+      <DialogContent className="max-w-4xl h-[80vh] flex flex-col bg-background text-foreground">
         <div className="flex items-center justify-between w-full mb-4 flex-shrink-0">
-          <DialogTitle className="text-lg font-semibold">
+          <DialogTitle className="text-lg font-semibold text-foreground">
             查看配置内容 - {configuration.name}
           </DialogTitle>
           <Button
@@ -83,16 +83,16 @@ export default function IMSConfigurationViewDialog({
           {/* 配置信息 */}
           <div className="grid grid-cols-2 gap-4 text-sm flex-shrink-0">
             <div>
-              <Label className="text-sm font-medium text-gray-600">配置名称</Label>
-              <div className="mt-1 text-gray-900">{configuration.name}</div>
+              <Label className="text-sm font-medium text-muted-foreground">配置名称</Label>
+              <div className="mt-1 text-foreground">{configuration.name}</div>
             </div>
             <div>
-              <Label className="text-sm font-medium text-gray-600">状态</Label>
+              <Label className="text-sm font-medium text-muted-foreground">状态</Label>
               <div className="mt-1">
                 <span className={`inline-flex items-center px-2 py-1 rounded-full text-xs font-medium ${
                   configuration.isDisabled 
-                    ? 'bg-red-100 text-red-800' 
-                    : 'bg-green-100 text-green-800'
+                    ? 'bg-destructive/10 text-destructive' 
+                    : 'bg-green-500/10 text-green-600 dark:text-green-400'
                 }`}>
                   {configuration.isDisabled ? '禁用' : '启用'}
                 </span>
@@ -100,15 +100,15 @@ export default function IMSConfigurationViewDialog({
             </div>
             {configuration.description && (
               <div className="col-span-2">
-                <Label className="text-sm font-medium text-gray-600">描述</Label>
-                <div className="mt-1 text-gray-900">{configuration.description}</div>
+                <Label className="text-sm font-medium text-muted-foreground">描述</Label>
+                <div className="mt-1 text-foreground">{configuration.description}</div>
               </div>
             )}
           </div>
 
           {/* 配置内容查看器 */}
           <div className="flex flex-col flex-1 min-h-0">
-            <Label className="text-sm font-medium text-gray-600 mb-2 flex-shrink-0">
+            <Label className="text-sm font-medium text-muted-foreground mb-2 flex-shrink-0">
               配置内容
             </Label>
             <ConfigContentViewer 
diff --git a/src/X1.WebUI/src/pages/ran-configurations/RANConfigurationViewDialog.tsx b/src/X1.WebUI/src/pages/ran-configurations/RANConfigurationViewDialog.tsx
index 2420a25..b213ca4 100644
--- a/src/X1.WebUI/src/pages/ran-configurations/RANConfigurationViewDialog.tsx
+++ b/src/X1.WebUI/src/pages/ran-configurations/RANConfigurationViewDialog.tsx
@@ -64,9 +64,9 @@ export default function RANConfigurationViewDialog({
 
   return (
     <Dialog open={open} onOpenChange={onOpenChange}>
-      <DialogContent className="max-w-4xl h-[80vh] flex flex-col">
+      <DialogContent className="max-w-4xl h-[80vh] flex flex-col bg-background text-foreground">
         <div className="flex items-center justify-between w-full mb-4 flex-shrink-0">
-          <DialogTitle className="text-lg font-semibold">
+          <DialogTitle className="text-lg font-semibold text-foreground">
             查看配置内容 - {configuration.name}
           </DialogTitle>
           <Button
@@ -83,16 +83,16 @@ export default function RANConfigurationViewDialog({
           {/* 配置信息 */}
           <div className="grid grid-cols-2 gap-4 text-sm flex-shrink-0">
             <div>
-              <Label className="text-sm font-medium text-gray-600">配置名称</Label>
-              <div className="mt-1 text-gray-900">{configuration.name}</div>
+              <Label className="text-sm font-medium text-muted-foreground">配置名称</Label>
+              <div className="mt-1 text-foreground">{configuration.name}</div>
             </div>
             <div>
-              <Label className="text-sm font-medium text-gray-600">状态</Label>
+              <Label className="text-sm font-medium text-muted-foreground">状态</Label>
               <div className="mt-1">
                 <span className={`inline-flex items-center px-2 py-1 rounded-full text-xs font-medium ${
                   configuration.isDisabled 
-                    ? 'bg-red-100 text-red-800' 
-                    : 'bg-green-100 text-green-800'
+                    ? 'bg-destructive/10 text-destructive' 
+                    : 'bg-green-500/10 text-green-600 dark:text-green-400'
                 }`}>
                   {configuration.isDisabled ? '禁用' : '启用'}
                 </span>
@@ -100,15 +100,15 @@ export default function RANConfigurationViewDialog({
             </div>
             {configuration.description && (
               <div className="col-span-2">
-                <Label className="text-sm font-medium text-gray-600">描述</Label>
-                <div className="mt-1 text-gray-900">{configuration.description}</div>
+                <Label className="text-sm font-medium text-muted-foreground">描述</Label>
+                <div className="mt-1 text-foreground">{configuration.description}</div>
               </div>
             )}
           </div>
 
           {/* 配置内容查看器 */}
           <div className="flex flex-col flex-1 min-h-0">
-            <Label className="text-sm font-medium text-gray-600 mb-2 flex-shrink-0">
+            <Label className="text-sm font-medium text-muted-foreground mb-2 flex-shrink-0">
               配置内容
             </Label>
             <ConfigContentViewer 
diff --git a/src/modify.md b/src/modify.md
index 70b7a11..3650f0d 100644
--- a/src/modify.md
+++ b/src/modify.md
@@ -3860,7 +3860,492 @@ const createResult = await coreNetworkConfigService.createCoreNetworkConfig({
 ### 修复内容
 - 将 `ims_ConfigurationId` 改为 `imS_ConfigurationId` 以匹配后端API返回的数据格式
 - 修改 `X1.WebUI/src/services/imsConfigurationService.ts` 中的所有接口定义
-- 修改 `X1.WebUI/src/pages/ims-configurations/IMSConfigurationsTable.tsx` 中的字段引用
+- 修改 `X1.WebUI/src/pages/ims-configurations/IMSConfigurationsTable.tsx`
+
+---
+
+## 2025-01-29 修复消息详情抽屉滚动条问题
+
+### 修改概述
+根据用户反馈，修复了消息详情抽屉中滚动条位置不正确的问题。通过对比 `RANConfigurationDrawer.tsx` 的实现，发现 `ProtocolLogsTable.tsx` 中的抽屉结构存在问题。
+
+### 修改文件
+- `X1.WebUI/src/components/protocol-logs/ProtocolLogsTable.tsx` - 修复抽屉布局结构
+
+### 修改内容
+
+#### 1. 抽屉结构重构
+- **原结构问题**：`DrawerContent` 没有正确的 className，内容区域使用了错误的布局
+- **新结构**：参考 `RANConfigurationDrawer.tsx` 的实现，使用正确的 flex 布局结构
+
+#### 2. 具体修改
+```tsx
+// 修改前
+<Drawer open={isDrawerOpen} onOpenChange={setIsDrawerOpen}>
+  <DrawerContent>
+    <DrawerHeader className="flex-shrink-0">
+      {/* 头部内容 */}
+    </DrawerHeader>
+    
+    <div className="flex-1 overflow-auto p-4 min-h-0">
+      <ConfigContentViewer
+        content={selectedMessageDetail || 'No message detail available'}
+        onCopy={handleCopyMessageDetail}
+        onDownload={handleDownloadMessageDetail}
+        className="h-full"
+      />
+    </div>
+  </DrawerContent>
+</Drawer>
+
+// 修改后
+<Drawer open={isDrawerOpen} onOpenChange={setIsDrawerOpen}>
+  <div className="flex flex-col h-full">
+    <DrawerHeader className="flex-shrink-0">
+      {/* 头部内容 */}
+    </DrawerHeader>
+    
+    <DrawerContent className="flex flex-col flex-1 overflow-y-auto">
+      <div className="flex flex-col flex-1 min-h-0 p-4">
+        <ConfigContentViewer
+          content={selectedMessageDetail || 'No message detail available'}
+          onCopy={handleCopyMessageDetail}
+          onDownload={handleDownloadMessageDetail}
+          className="flex-1"
+        />
+      </div>
+    </DrawerContent>
+  </div>
+</Drawer>
+```
+
+#### 3. 布局优化
+- **外层容器**：添加 `div` 包装器，使用 `flex flex-col h-full` 布局
+- **DrawerContent**：添加 `flex flex-col flex-1 overflow-y-auto` className
+- **内容区域**：使用 `flex flex-col flex-1 min-h-0 p-4` 布局
+- **ConfigContentViewer**：使用 `flex-1` className 占满剩余空间
+
+### 技术特性
+- **正确的 flex 布局**：确保抽屉内容能够正确滚动
+- **高度管理**：使用 `min-h-0` 确保 flex 子元素能够正确收缩
+- **滚动控制**：滚动条出现在内容区域内部，而不是外层容器
+- **空间分配**：正确分配垂直空间，确保所有元素都能正确显示
+
+### 用户体验改进
+- **滚动条位置**：滚动条现在出现在内容区域内部，符合用户期望
+- **内容可见性**：底部内容现在能够正确显示和滚动
+- **布局稳定性**：抽屉布局更加稳定和可预测
+- **操作便利性**：用户可以在内容区域内部滚动查看完整内容
+
+### 影响范围
+- **消息详情抽屉**：修复了滚动条位置和内容显示问题
+- **用户体验**：提供了更好的内容查看体验
+- **布局一致性**：与 `RANConfigurationDrawer.tsx` 保持一致的布局结构
+
+---
+
+## 2025-01-29 移除消息详情抽屉的保存和下载功能
+
+### 修改概述
+根据用户需求，移除了消息详情抽屉中的保存和下载功能，使 `ConfigContentViewer` 变为只读模式。
+
+### 修改文件
+- `X1.WebUI/src/components/protocol-logs/ProtocolLogsTable.tsx` - 移除保存和下载功能
+
+### 修改内容
+
+#### 1. 移除功能按钮
+- **移除复制功能**：不再传递 `onCopy` 属性给 `ConfigContentViewer`
+- **移除下载功能**：不再传递 `onDownload` 属性给 `ConfigContentViewer`
+- **保留搜索功能**：搜索功能仍然可用，便于用户查找特定内容
+
+#### 2. 具体修改
+```tsx
+// 修改前
+<ConfigContentViewer
+  content={selectedMessageDetail || 'No message detail available'}
+  onCopy={handleCopyMessageDetail}
+  onDownload={handleDownloadMessageDetail}
+  className="flex-1"
+/>
+
+// 修改后
+<ConfigContentViewer
+  content={selectedMessageDetail || 'No message detail available'}
+  className="flex-1"
+/>
+```
+
+### 技术特性
+- **只读模式**：消息详情现在为只读，用户无法修改内容
+- **简化界面**：移除了不必要的操作按钮，界面更加简洁
+- **保留搜索**：搜索功能仍然可用，便于用户查找特定内容
+- **功能隔离**：通过不传递回调函数来控制按钮的显示
+
+### 用户体验改进
+- **界面简化**：移除了复制和下载按钮，界面更加简洁
+- **功能明确**：明确表示这是一个只读的查看界面
+- **操作专注**：用户可以专注于查看和搜索内容，不会被其他操作干扰
+
+---
+
+## 2025-01-29 修复ConfigContentViewer主题适配问题
+
+### 修改概述
+根据用户反馈，修复了 `ConfigContentViewer` 组件不会随着主题改变的问题，参考 `ConfigContentEditor` 的实现，使用 Tailwind 主题变量替换硬编码的颜色类名。
+
+### 修改文件
+- `X1.WebUI/src/components/ui/ConfigContentViewer.tsx` - 修复主题适配问题
+
+### 修改内容
+
+#### 1. 颜色类名替换
+- **搜索图标颜色**：将 `text-gray-400` 替换为 `text-muted-foreground`
+- **搜索状态文本**：将 `text-gray-500` 替换为 `text-muted-foreground`
+- **内容区域背景**：将 `bg-gray-50` 替换为 `bg-muted/50`
+
+#### 2. 具体修改
+```tsx
+// 修改前
+<MagnifyingGlassIcon className="absolute left-3 top-1/2 transform -translate-y-1/2 h-4 w-4 text-gray-400" />
+<span className="text-sm text-gray-500 whitespace-nowrap">
+<div className="flex-1 border rounded-md bg-gray-50 overflow-hidden min-h-0">
+
+// 修改后
+<MagnifyingGlassIcon className="absolute left-3 top-1/2 transform -translate-y-1/2 h-4 w-4 text-muted-foreground" />
+<span className="text-sm text-muted-foreground whitespace-nowrap">
+<div className="flex-1 border rounded-md bg-muted/50 overflow-hidden min-h-0">
+```
+
+### 技术特性
+- **主题适配**：使用 Tailwind 主题变量，支持明暗主题切换
+- **颜色一致性**：与 `ConfigContentEditor` 保持一致的色彩方案
+- **响应式设计**：颜色会根据当前主题自动调整
+- **可维护性**：使用语义化的颜色类名，便于维护和扩展
+
+### 用户体验改进
+- **主题一致性**：组件现在会随着主题切换而改变颜色
+- **视觉统一**：与 `ConfigContentEditor` 保持一致的视觉效果
+- **更好的可读性**：在不同主题下都有良好的对比度和可读性
+
+---
+
+## 2025-01-29 修复RANConfigurationViewDialog主题适配问题
+
+### 修改概述
+根据用户需求，修复了 `RANConfigurationViewDialog.tsx` 组件不会随着主题改变的问题，将硬编码的颜色类名替换为 Tailwind 主题变量，但保留 `ConfigContentViewer` 的修改。
+
+### 修改文件
+- `X1.WebUI/src/pages/ran-configurations/RANConfigurationViewDialog.tsx` - 修复主题适配问题
+
+### 修改内容
+
+#### 1. 标签文本颜色
+- **配置名称标签**：将 `text-gray-600` 替换为 `text-muted-foreground`
+- **状态标签**：将 `text-gray-600` 替换为 `text-muted-foreground`
+- **描述标签**：将 `text-gray-600` 替换为 `text-muted-foreground`
+- **配置内容标签**：将 `text-gray-600` 替换为 `text-muted-foreground`
+
+#### 2. 内容文本颜色
+- **配置名称内容**：将 `text-gray-900` 替换为 `text-foreground`
+- **描述内容**：将 `text-gray-900` 替换为 `text-foreground`
+
+#### 3. 状态标签颜色
+- **禁用状态**：将 `bg-red-100 text-red-800` 替换为 `bg-destructive/10 text-destructive`
+- **启用状态**：将 `bg-green-100 text-green-800` 替换为 `bg-green-500/10 text-green-600 dark:text-green-400`
+
+#### 4. 标题颜色
+- **对话框标题**：为 `DialogTitle` 添加 `text-foreground` 类名以确保正确的主题适配
+
+#### 5. 对话框容器
+- **DialogContent**：为 `DialogContent` 添加 `bg-background text-foreground` 类名以确保整个对话框的主题适配
+
+#### 6. 具体修改
+```tsx
+// 修改前
+<Dialog open={open} onOpenChange={onOpenChange}>
+  <DialogContent className="max-w-4xl h-[80vh] flex flex-col">
+    <DialogTitle className="text-lg font-semibold">
+      查看配置内容 - {configuration.name}
+    </DialogTitle>
+    <Label className="text-sm font-medium text-gray-600">配置名称</Label>
+    <div className="mt-1 text-gray-900">{configuration.name}</div>
+    <span className={`inline-flex items-center px-2 py-1 rounded-full text-xs font-medium ${
+      configuration.isDisabled 
+        ? 'bg-red-100 text-red-800' 
+        : 'bg-green-100 text-green-800'
+    }`}>
+
+// 修改后
+<Dialog open={open} onOpenChange={onOpenChange}>
+  <DialogContent className="max-w-4xl h-[80vh] flex flex-col bg-background text-foreground">
+    <DialogTitle className="text-lg font-semibold text-foreground">
+      查看配置内容 - {configuration.name}
+    </DialogTitle>
+    <Label className="text-sm font-medium text-muted-foreground">配置名称</Label>
+    <div className="mt-1 text-foreground">{configuration.name}</div>
+    <span className={`inline-flex items-center px-2 py-1 rounded-full text-xs font-medium ${
+      configuration.isDisabled 
+        ? 'bg-destructive/10 text-destructive' 
+        : 'bg-green-500/10 text-green-600 dark:text-green-400'
+    }`}>
+```
+
+### 技术特性
+- **主题适配**：使用 Tailwind 主题变量，支持明暗主题切换
+- **语义化颜色**：使用 `text-foreground`、`text-muted-foreground` 等语义化颜色类名
+- **状态颜色优化**：使用 `destructive` 主题色表示禁用状态，绿色表示启用状态
+- **暗色主题支持**：为启用状态添加了 `dark:text-green-400` 以在暗色主题下保持良好的可读性
+
+### 用户体验改进
+- **主题一致性**：对话框现在会随着主题切换而改变颜色
+- **视觉统一**：与整个应用保持一致的色彩方案
+- **更好的可读性**：在不同主题下都有良好的对比度和可读性
+- **状态清晰**：禁用和启用状态的颜色更加语义化和直观
+
+---
+
+## 2025-01-29 修复IMSConfigurationViewDialog主题适配问题
+
+### 修改概述
+根据用户需求，修复了 `IMSConfigurationViewDialog.tsx` 组件不会随着主题改变的问题，应用与 `RANConfigurationViewDialog.tsx` 相同的主题适配修复。
+
+### 修改文件
+- `X1.WebUI/src/pages/ims-configurations/IMSConfigurationViewDialog.tsx` - 修复主题适配问题
+
+### 修改内容
+
+#### 1. 对话框容器
+- **DialogContent**：添加 `bg-background text-foreground` 类名以确保整个对话框的主题适配
+
+#### 2. 标题颜色
+- **对话框标题**：为 `DialogTitle` 添加 `text-foreground` 类名以确保正确的主题适配
+
+#### 3. 标签文本颜色
+- **配置名称标签**：将 `text-gray-600` 替换为 `text-muted-foreground`
+- **状态标签**：将 `text-gray-600` 替换为 `text-muted-foreground`
+- **描述标签**：将 `text-gray-600` 替换为 `text-muted-foreground`
+- **配置内容标签**：将 `text-gray-600` 替换为 `text-muted-foreground`
+
+#### 4. 内容文本颜色
+- **配置名称内容**：将 `text-gray-900` 替换为 `text-foreground`
+- **描述内容**：将 `text-gray-900` 替换为 `text-foreground`
+
+#### 5. 状态标签颜色
+- **禁用状态**：将 `bg-red-100 text-red-800` 替换为 `bg-destructive/10 text-destructive`
+- **启用状态**：将 `bg-green-100 text-green-800` 替换为 `bg-green-500/10 text-green-600 dark:text-green-400`
+
+#### 6. 具体修改
+```tsx
+// 修改前
+<DialogContent className="max-w-4xl h-[80vh] flex flex-col">
+<DialogTitle className="text-lg font-semibold">
+<Label className="text-sm font-medium text-gray-600">配置名称</Label>
+<div className="mt-1 text-gray-900">{configuration.name}</div>
+<span className={`inline-flex items-center px-2 py-1 rounded-full text-xs font-medium ${
+  configuration.isDisabled 
+    ? 'bg-red-100 text-red-800' 
+    : 'bg-green-100 text-green-800'
+}`}>
+
+// 修改后
+<DialogContent className="max-w-4xl h-[80vh] flex flex-col bg-background text-foreground">
+<DialogTitle className="text-lg font-semibold text-foreground">
+<Label className="text-sm font-medium text-muted-foreground">配置名称</Label>
+<div className="mt-1 text-foreground">{configuration.name}</div>
+<span className={`inline-flex items-center px-2 py-1 rounded-full text-xs font-medium ${
+  configuration.isDisabled 
+    ? 'bg-destructive/10 text-destructive' 
+    : 'bg-green-500/10 text-green-600 dark:text-green-400'
+}`}>
+```
+
+### 技术特性
+- **主题适配**：使用 Tailwind 主题变量，支持明暗主题切换
+- **语义化颜色**：使用 `text-foreground`、`text-muted-foreground` 等语义化颜色类名
+- **状态颜色优化**：使用 `destructive` 主题色表示禁用状态，绿色表示启用状态
+- **暗色主题支持**：为启用状态添加了 `dark:text-green-400` 以在暗色主题下保持良好的可读性
+
+### 用户体验改进
+- **主题一致性**：对话框现在会随着主题切换而改变颜色
+- **视觉统一**：与整个应用保持一致的色彩方案
+- **更好的可读性**：在不同主题下都有良好的对比度和可读性
+- **状态清晰**：禁用和启用状态的颜色更加语义化和直观
+
+---
+
+## 2025-01-29 修复CoreNetworkConfigViewDialog主题适配问题
+
+### 修改概述
+根据用户需求，修复了 `CoreNetworkConfigViewDialog.tsx` 组件不会随着主题改变的问题，应用与其他配置查看对话框相同的主题适配修复。
+
+### 修改文件
+- `X1.WebUI/src/pages/core-network-configs/CoreNetworkConfigViewDialog.tsx` - 修复主题适配问题
+
+### 修改内容
+
+#### 1. 对话框容器
+- **DialogContent**：添加 `bg-background text-foreground` 类名以确保整个对话框的主题适配
+
+#### 2. 标题颜色
+- **对话框标题**：为 `DialogTitle` 添加 `text-foreground` 类名以确保正确的主题适配
+
+#### 3. 标签文本颜色
+- **配置名称标签**：将 `text-gray-600` 替换为 `text-muted-foreground`
+- **状态标签**：将 `text-gray-600` 替换为 `text-muted-foreground`
+- **描述标签**：将 `text-gray-600` 替换为 `text-muted-foreground`
+- **配置内容标签**：将 `text-gray-600` 替换为 `text-muted-foreground`
+
+#### 4. 内容文本颜色
+- **配置名称内容**：将 `text-gray-900` 替换为 `text-foreground`
+- **描述内容**：将 `text-gray-900` 替换为 `text-foreground`
+
+#### 5. 状态标签颜色
+- **禁用状态**：将 `bg-red-100 text-red-800` 替换为 `bg-destructive/10 text-destructive`
+- **启用状态**：将 `bg-green-100 text-green-800` 替换为 `bg-green-500/10 text-green-600 dark:text-green-400`
+
+#### 6. 具体修改
+```tsx
+// 修改前
+<DialogContent className="max-w-4xl h-[80vh] flex flex-col">
+<DialogTitle className="text-lg font-semibold">
+<Label className="text-sm font-medium text-gray-600">配置名称</Label>
+<div className="mt-1 text-gray-900">{config.name}</div>
+<span className={`inline-flex items-center px-2 py-1 rounded-full text-xs font-medium ${
+  config.isDisabled 
+    ? 'bg-red-100 text-red-800' 
+    : 'bg-green-100 text-green-800'
+}`}>
+
+// 修改后
+<DialogContent className="max-w-4xl h-[80vh] flex flex-col bg-background text-foreground">
+<DialogTitle className="text-lg font-semibold text-foreground">
+<Label className="text-sm font-medium text-muted-foreground">配置名称</Label>
+<div className="mt-1 text-foreground">{config.name}</div>
+<span className={`inline-flex items-center px-2 py-1 rounded-full text-xs font-medium ${
+  config.isDisabled 
+    ? 'bg-destructive/10 text-destructive' 
+    : 'bg-green-500/10 text-green-600 dark:text-green-400'
+}`}>
+```
+
+### 技术特性
+- **主题适配**：使用 Tailwind 主题变量，支持明暗主题切换
+- **语义化颜色**：使用 `text-foreground`、`text-muted-foreground` 等语义化颜色类名
+- **状态颜色优化**：使用 `destructive` 主题色表示禁用状态，绿色表示启用状态
+- **暗色主题支持**：为启用状态添加了 `dark:text-green-400` 以在暗色主题下保持良好的可读性
+
+### 用户体验改进
+- **主题一致性**：对话框现在会随着主题切换而改变颜色
+- **视觉统一**：与整个应用保持一致的色彩方案
+- **更好的可读性**：在不同主题下都有良好的对比度和可读性
+- **状态清晰**：禁用和启用状态的颜色更加语义化和直观
+
+---
+
+## 2025-01-29 修复消息详情抽屉滚动条问题
+
+### 修改概述
+根据用户需求，修复消息详情抽屉的滚动条问题，将滚动条从最外层移到内容区域内部，提供更好的用户体验。
+
+### 修改文件
+- `X1.WebUI/src/components/protocol-logs/ProtocolLogsTable.tsx` - 修复消息详情抽屉布局
+
+### 修改内容
+
+#### 1. 抽屉结构重构
+- **原结构问题**：`DrawerContent` 被错误地嵌套在 `DrawerHeader` 内部，导致布局混乱
+- **新结构**：将 `DrawerContent` 移到正确的位置，作为 `Drawer` 的直接子元素
+
+#### 2. 滚动条位置修复
+- **原实现**：滚动条在最外层，影响整体布局
+- **新实现**：滚动条在内容区域内部，只对消息详情内容进行滚动
+- **布局优化**：使用 `overflow-auto` 类在内容区域实现滚动
+
+#### 3. Flex布局高度修复
+- **问题**：flex容器中的子元素没有正确的高度约束
+- **解决方案**：添加 `min-h-0` 类确保flex子元素能够正确收缩
+- **影响**：修复了内容区域无法正确滚动的问题
+
+#### 4. 具体修改
+```tsx
+// 修改前
+<Drawer open={isDrawerOpen} onOpenChange={setIsDrawerOpen}>
+  <div className="flex flex-col h-full">
+    <DrawerHeader className="flex-shrink-0">
+      {/* 标题和关闭按钮 */}
+    </DrawerHeader>
+    
+    <DrawerContent className="flex flex-col flex-1 min-h-0">
+      <div className="flex-1 p-4">
+        <ConfigContentViewer />
+      </div>
+    </DrawerContent>
+  </div>
+</Drawer>
+
+// 修改后
+<Drawer open={isDrawerOpen} onOpenChange={setIsDrawerOpen}>
+  <DrawerContent>
+    <DrawerHeader className="flex-shrink-0">
+      {/* 标题和关闭按钮 */}
+    </DrawerHeader>
+    
+    <div className="flex-1 overflow-auto p-4 min-h-0">
+      <ConfigContentViewer className="h-full" />
+    </div>
+  </DrawerContent>
+</Drawer>
+```
+
+#### 5. ConfigContentViewer组件修复
+- **问题**：组件内部的高度约束不正确
+- **解决方案**：
+  - 为内容容器添加 `min-h-0` 类
+  - 移除内联样式中的 `height: '100%'`，避免冲突
+  - 确保flex布局正确工作
+
+#### 6. DrawerContent组件修复
+- **问题**：`DrawerContent` 组件本身有 `overflow-y-auto` 类，导致双重滚动
+- **解决方案**：
+  - 移除 `DrawerContent` 中的 `overflow-y-auto` 和 `p-6` 类
+  - 改为使用 `flex flex-col` 布局
+  - 让具体的滚动控制由子组件决定
+
+#### 7. DrawerContent高度约束修复
+- **问题**：`DrawerContent` 缺少 `min-h-0` 类，导致无法正确收缩
+- **解决方案**：
+  - 为 `DrawerContent` 添加 `min-h-0` 类
+  - 确保flex子元素能够正确收缩到比内容更小的高度
+  - 这是解决滚动问题的关键修复
+
+### 技术特性
+
+#### 1. 布局结构优化
+- **正确的HTML层次**：`Drawer` → `DrawerContent` → `DrawerHeader` + 内容区域
+- **Flex布局**：使用flex布局确保内容区域占满剩余空间
+- **滚动区域**：只在内容区域实现滚动，不影响标题栏
+
+#### 2. 用户体验改进
+- **固定标题**：标题栏始终可见，不会随内容滚动
+- **内容滚动**：只有消息详情内容可以滚动
+- **布局稳定**：抽屉整体布局更加稳定和可预测
+
+#### 3. 响应式设计
+- **自适应高度**：内容区域自动适应抽屉高度
+- **滚动支持**：当内容超出可视区域时自动显示滚动条
+- **空间利用**：充分利用抽屉的可用空间
+
+### 影响范围
+- **用户界面**：消息详情抽屉的滚动行为更加合理
+- **布局稳定性**：抽屉布局更加稳定，不会出现布局混乱
+- **用户体验**：提供更好的内容浏览体验
+
+### 注意事项
+- 保持了原有的功能不变
+- 滚动条现在只在内容区域显示
+- 标题栏始终固定在顶部
+- 内容区域可以独立滚动 中的字段引用
 - 修改 `X1.WebUI/src/pages/ims-configurations/IMSConfigurationsView.tsx` 中的字段引用
 
 ### 技术说明