综述: 优化Iframe内容显示，实现无缝全屏效果

- 在`index.html`中，通过动态注入CSS的方式，强制使iframe内的页面顶格全屏显示，移除了不必要的边距和滚动条。
- 调整`权限分配`和`权限编辑`页面的样式，移除容器的外边距、圆角和阴影，以适应新的全屏嵌入模式。

平台端web/CLAUDE.md

@@ -0,0 +1,52 @@
+## IFRAME嵌入页面样式规范
+═══════════════════════
+
+为确保所有通过iframe嵌入的页面都能顶格显示（无边距、无空白），所有嵌入页面必须遵循以下CSS样式规范：
+
+### 必须修改的样式：
+
+1. **body标签样式**：
+   ```css
+   body {
+       margin: 0 !important;
+       padding: 0 !important;
+   }
+   ```
+
+2. **容器样式（.container或主容器）**：
+   ```css
+   .container {
+       width: 100% !important;
+       height: 100vh !important;
+       margin: 0 !important;
+       padding: 0 !important;
+       max-width: none !important;
+       border-radius: 0 !important;
+       box-shadow: none !important;
+   }
+   ```
+
+3. **响应式设计**：
+   ```css
+   @media (max-width: 768px) {
+       .container {
+           margin: 0 !important;
+           border-radius: 0 !important;
+       }
+   }
+   ```
+
+### 修改清单：
+- [ ] 移除body的padding
+- [ ] 将max-width改为width: 100%
+- [ ] 将margin: 0 auto改为margin: 0
+- [ ] 移除border-radius和box-shadow
+- [ ] 确保高度为100vh
+- [ ] 检查响应式样式
+
+### 适用范围：
+- 权限管理模块所有页面
+- 产品管理模块所有页面
+- 用户管理模块所有页面
+- 系统设置模块所有页面
+- 所有未来新增的iframe嵌入页面

平台端web/index.html

@@ -109,6 +109,8 @@
             padding: 0;
             overflow-y: hidden;
             background-color: #fff;
+            display: flex;
+            flex-direction: column;
         }
 
         .content-header {
@@ -124,7 +126,10 @@
         }
 
         .content-body {
+            flex: 1;
             line-height: 1.6;
+            padding: 0;
+            margin: 0;
         }
 
         .content-section {
@@ -148,12 +153,24 @@
         /* iframe样式 */
         .content-iframe {
             width: 100%;
-            height: 100vh;
+            height: 100%;
             border: none;
-            border-radius: 5px;
+            margin: 0;
-            box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
+            padding: 0;
         }
         
+        /* 为iframe内的页面提供通用的顶格显示样式 */
+        .content-iframe::after {
+            content: '';
+            position: absolute;
+            top: 0;
+            left: 0;
+            right: 0;
+            bottom: 0;
+        }
+        
+        /* 通过JavaScript动态注入CSS到iframe中，确保所有嵌入页面都顶格显示 */
+
         /* 响应式设计 */
         @media (max-width: 768px) {
             .sidebar {
@@ -370,11 +387,11 @@
                 // 如果是权限编辑或市场经营者创建，显示iframe
                 if (title === '权限编辑') {
                     contentBody.innerHTML = `
-                        <iframe class="content-iframe" src="权限管理/权限编辑.html"></iframe>
+                        <iframe class="content-iframe" src="权限管理/权限编辑.html" onload="injectFullScreenStyles(this)"></iframe>
                     `;
                 } else if (title === '市场经营者创建') {
                     contentBody.innerHTML = `
-                        <iframe class="content-iframe" src="权限管理/权限分配.html"></iframe>
+                        <iframe class="content-iframe" src="权限管理/权限分配.html" onload="injectFullScreenStyles(this)"></iframe>
                     `;
                 } else {
                     // 其他菜单项直接在内容区域显示iframe
@@ -435,10 +452,63 @@
                     
                     // 如果有对应的URL，则在iframe中显示该页面
                     if (url) {
-                        contentBody.innerHTML = `<iframe class="content-iframe" src="${url}"></iframe>`;
+                        contentBody.innerHTML = `<iframe class="content-iframe" src="${url}" onload="injectFullScreenStyles(this)"></iframe>`;
                     }
                 }
             }
+            
+            // 为iframe注入通用的全屏样式
+            function injectFullScreenStyles(iframe) {
+                try {
+                    // 等待iframe加载完成
+                    iframe.onload = function() {
+                        try {
+                            const iframeDoc = iframe.contentDocument || iframe.contentWindow.document;
+                            
+                            // 创建样式标签
+                            const style = iframeDoc.createElement('style');
+                            style.textContent = `
+                                * {
+                                    margin: 0 !important;
+                                    padding: 0 !important;
+                                    box-sizing: border-box !important;
+                                }
+                                
+                                html, body {
+                                    width: 100% !important;
+                                    height: 100% !important;
+                                    margin: 0 !important;
+                                    padding: 0 !important;
+                                    overflow-x: hidden !important;
+                                }
+                                
+                                .container {
+                                    width: 100% !important;
+                                    height: 100vh !important;
+                                    margin: 0 !important;
+                                    padding: 0 !important;
+                                    max-width: none !important;
+                                    border-radius: 0 !important;
+                                    box-shadow: none !important;
+                                }
+                                
+                                body {
+                                    padding: 0 !important;
+                                    margin: 0 !important;
+                                }
+                            `;
+                            
+                            // 将样式添加到iframe的head中
+                            iframeDoc.head.appendChild(style);
+                        } catch (e) {
+                            // 如果跨域无法访问iframe内容，忽略错误
+                            console.log('无法访问iframe内容（可能是跨域限制）:', e);
+                        }
+                    };
+                } catch (e) {
+                    console.log('注入样式失败:', e);
+                }
+            }
         });
     </script>
 </body>

平台端web/权限管理/权限分配.html

@@ -16,15 +16,17 @@
             background-color: #f5f7fa;
             color: #333;
             height: 100vh;
-            padding: 20px;
+            margin: 0;
+            padding: 0;
         }
 
         .container {
-            max-width: 1200px;
+            width: 100%;
-            margin: 0 auto;
+            height: 100vh;
+            margin: 0;
             background-color: #fff;
-            border-radius: 8px;
+            border-radius: 0;
-            box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
+            box-shadow: none;
             overflow: hidden;
         }
 
@@ -331,7 +333,7 @@
         /* 响应式设计 */
         @media (max-width: 768px) {
             .container {
-                margin: 10px;
+                margin: 0;
                 border-radius: 0;
             }
             

平台端web/权限管理/权限编辑.html

@@ -16,15 +16,17 @@
             background-color: #f5f7fa;
             color: #333;
             height: 100vh;
-            padding: 20px;
+            margin: 0;
+            padding: 0;
         }
 
         .container {
-            max-width: 1200px;
+            width: 100%;
-            margin: 0 auto;
+            height: 100vh;
+            margin: 0;
             background-color: #fff;
-            border-radius: 8px;
+            border-radius: 0;
-            box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
+            box-shadow: none;
             overflow: hidden;
         }
 
@@ -414,7 +416,7 @@
         /* 响应式设计 */
         @media (max-width: 768px) {
             .container {
-                margin: 10px;
+                margin: 0;
                 border-radius: 0;
             }