From b0a91d566068be73cd62db93b14b6438dd32cb9d Mon Sep 17 00:00:00 2001
From: linbin <495561397@qq.com>
Date: Fri, 5 Sep 2025 23:08:16 +0800
Subject: [PATCH] =?UTF-8?q?=E7=BB=BC=E8=BF=B0:=20=E4=BC=98=E5=8C=96?=
 =?UTF-8?q?=E6=9D=83=E9=99=90=E5=88=86=E9=85=8D=E9=A1=B5=E9=9D=A2UI?=
 =?UTF-8?q?=E5=92=8C=E5=8A=9F=E8=83=BD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 修改平台web/index.html，将"用户统计"菜单项改为"市场经营者创建"
- 为权限分配页面添加市场经营者创建功能的iframe支持
- 优化权限分配页面的UI样式，包括节点样式、悬停效果和选中状态
- 增强权限节点的展开按钮样式和动画效果
- 添加权限选中时的视觉反馈样式
---
 平台web/index.html             |  8 ++-
 平台web/权限管理/权限分配.html | 91 ++++++++++++++++++++++++++--------
 2 files changed, 75 insertions(+), 24 deletions(-)

diff --git a/平台web/index.html b/平台web/index.html
index b5e8666..f8df52f 100644
--- a/平台web/index.html
+++ b/平台web/index.html
@@ -208,7 +208,7 @@
                     <li class="submenu-item">
                         <a>
                             <i>👥</i>
-                            <span>用户统计</span>
+                            <span>市场经营者创建</span>
                         </a>
                     </li>
                     <li class="submenu-item">
@@ -363,11 +363,15 @@
             function updateContent(title) {
                 const contentBody = document.querySelector('.content-body');
                 
-                // 如果是权限编辑，显示iframe
+                // 如果是权限编辑或市场经营者创建，显示iframe
                 if (title === '权限编辑') {
                     contentBody.innerHTML = `
                         <iframe class="content-iframe" src="权限管理/权限编辑.html"></iframe>
                     `;
+                } else if (title === '市场经营者创建') {
+                    contentBody.innerHTML = `
+                        <iframe class="content-iframe" src="权限管理/权限分配.html"></iframe>
+                    `;
                 } else {
                     // 其他菜单项显示默认内容
                     contentBody.innerHTML = `
diff --git a/平台web/权限管理/权限分配.html b/平台web/权限管理/权限分配.html
index d8f87e3..45413a2 100644
--- a/平台web/权限管理/权限分配.html
+++ b/平台web/权限管理/权限分配.html
@@ -222,32 +222,48 @@
         .permission-node {
             display: flex;
             align-items: center;
-            padding: 8px 12px;
-            border-radius: 4px;
-            transition: background-color 0.2s ease;
+            padding: 12px 15px;
+            border-radius: 6px;
+            transition: all 0.3s ease;
             cursor: pointer;
+            background-color: #fff;
+            border: 1px solid #e9ecef;
+            margin-bottom: 5px;
         }
 
         .permission-node:hover {
-            background-color: #e9ecef;
+            background-color: #f8f9fa;
+            border-color: #3498db;
+            box-shadow: 0 2px 8px rgba(52, 152, 219, 0.15);
+        }
+        
+        .permission-node.selected {
+            background-color: #e3f2fd;
+            border-color: #3498db;
         }
 
         .permission-checkbox {
-            margin-right: 10px;
-            transform: scale(1.1);
+            margin-right: 12px;
+            width: 18px;
+            height: 18px;
             cursor: pointer;
+            accent-color: #3498db;
         }
 
         .expand-btn {
-            background: none;
+            background: #3498db;
             border: none;
             cursor: pointer;
-            padding: 2px 5px;
-            margin-right: 5px;
-            color: #3498db;
-            font-size: 12px;
-            transition: transform 0.3s ease;
-            min-width: 20px;
+            padding: 2px 8px;
+            margin-right: 12px;
+            color: #fff;
+            font-size: 14px;
+            transition: all 0.3s ease;
+            min-width: 28px;
+            border-radius: 4px;
+            display: flex;
+            align-items: center;
+            justify-content: center;
         }
 
         .expand-btn.collapsed {
@@ -259,26 +275,47 @@
             color: #2c3e50;
             user-select: none;
             flex: 1;
+            font-weight: 500;
         }
 
         .permission-children {
-            margin-left: 30px;
-            margin-top: 5px;
-            border-left: 2px solid #ecf0f1;
-            padding-left: 15px;
+            margin-left: 35px;
+            margin-top: 8px;
+            border-left: 2px solid #3498db;
+            padding-left: 20px;
             display: none;
+            position: relative;
+        }
+        
+        .permission-children::before {
+            content: '';
+            position: absolute;
+            left: 0;
+            top: -8px;
+            height: calc(100% + 16px);
+            width: 2px;
+            background-color: #3498db;
         }
 
         .permission-children.expanded {
             display: block;
+            animation: fadeIn 0.3s ease-in-out;
+        }
+        
+        @keyframes fadeIn {
+            from { opacity: 0; transform: translateY(-5px); }
+            to { opacity: 1; transform: translateY(0); }
         }
 
-        .permission-item.parent {
-            font-weight: 500;
+        .permission-item.parent > .permission-node {
+            background-color: #edf7ff;
+            border-color: #bbdefb;
+            font-weight: 600;
         }
 
-        .permission-item.child {
-            font-weight: normal;
+        .permission-item.child .permission-node {
+            margin-left: 15px;
+            background-color: #f8f9fa;
         }
 
         /* 操作区域 */
@@ -550,7 +587,7 @@
             } else {
                 // 占位符保持对齐
                 const placeholder = document.createElement('span');
-                placeholder.style.width = '20px';
+                placeholder.style.width = '28px';
                 placeholder.style.display = 'inline-block';
                 nodeDiv.appendChild(placeholder);
             }
@@ -603,6 +640,16 @@
             const checkbox = event.target;
             const isChecked = checkbox.checked;
             const permissionCode = permission.code;
+            const node = checkbox.closest('.permission-node');
+            
+            // 更新节点选中样式
+            if (node) {
+                if (isChecked) {
+                    node.classList.add('selected');
+                } else {
+                    node.classList.remove('selected');
+                }
+            }
             
             if (isChecked) {
                 selectedPermissions.add(permissionCode);