From 6438d63ded487dc2f5bc1eae840f497941863cad Mon Sep 17 00:00:00 2001
From: linbin <495561397@qq.com>
Date: Sun, 7 Sep 2025 15:35:21 +0800
Subject: [PATCH] =?UTF-8?q?=E7=BB=BC=E8=BF=B0:=20=E4=BC=98=E5=8C=96?=
 =?UTF-8?q?=E8=B4=A6=E5=8F=B7=E6=9D=83=E9=99=90=E5=88=86=E9=85=8D=E9=A1=B5?=
 =?UTF-8?q?=E9=9D=A2=E7=9A=84=E8=B4=A6=E5=8F=B7=E7=B1=BB=E5=9E=8B=E5=92=8C?=
 =?UTF-8?q?=E6=93=8D=E4=BD=9C=E7=B1=BB=E5=9E=8B=E5=8A=9F=E8=83=BD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 商家端web/1 权限管理/账号权限分配.html | 202 ++++++++++++++++++-------
 1 file changed, 149 insertions(+), 53 deletions(-)

diff --git a/商家端web/1 权限管理/账号权限分配.html b/商家端web/1 权限管理/账号权限分配.html
index 25bf3f5..18c6e36 100644
--- a/商家端web/1 权限管理/账号权限分配.html	
+++ b/商家端web/1 权限管理/账号权限分配.html	
@@ -72,6 +72,20 @@
             background-color: #40a9ff;
             transform: translateY(-2px);
         }
+        
+        .tab-btn {
+            margin-right: 10px;
+        }
+        
+        .tab-btn:not(.active) {
+            background-color: #f0f0f0;
+            color: #666;
+        }
+        
+        .tab-btn:not(.active):hover {
+            background-color: #e0e0e0;
+            color: #333;
+        }
 
         .btn-success {
             background-color: #52c41a;
@@ -310,9 +324,6 @@
         <div class="header">
             <h1>账号权限分配</h1>
             <div class="header-actions">
-                <button class="btn btn-warning" onclick="resetForm()">
-                    <i class="fas fa-sync-alt"></i> 重置
-                </button>
             </div>
         </div>
 
@@ -322,18 +333,45 @@
             <div class="section">
                 <h2 class="section-title">账号信息</h2>
                 <div class="account-form">
+                    <!-- Tab导航 -->
                     <div class="form-row">
                         <div class="form-group">
-                            <label for="identitySelect">创建账号身份 *</label>
-                            <select id="identitySelect" onchange="handleIdentityChange()">
-                                <option value="">请选择账号身份</option>
-                                <option value="sub_merchant">子经营者</option>
-                                <option value="merchant">商户</option>
+                            <label>账号类型</label>
+                            <div class="tab-container">
+                                <button class="btn btn-primary tab-btn active" onclick="switchTab('sub_merchant')">子经营者</button>
+                                <button class="btn btn-primary tab-btn" onclick="switchTab('merchant')">商户</button>
+                            </div>
+                        </div>
+                    </div>
+                    
+                    <div class="form-row">
+                        <div class="form-group">
+                            <label for="typeSelect">操作类型 *</label>
+                            <select id="typeSelect" onchange="handleTypeChange()">
+                                <option value="">请选择操作类型</option>
+                                <option value="create">创建新账号</option>
+                                <option value="update">更新账号权限</option>
                             </select>
                         </div>
                         <div class="form-group">
-                            <label for="phoneNumber">账号手机号 *</label>
-                            <input type="tel" id="phoneNumber" placeholder="请输入手机号" maxlength="11">
+                            <label for="account">账号 *</label>
+                            <input type="text" id="account" placeholder="请输入账号">
+                        </div>
+                    </div>
+                    
+                    <!-- 初始密码字段 -->
+                    <div class="form-row" id="passwordRow" style="display: none;">
+                        <div class="form-group">
+                            <label for="password">初始密码</label>
+                            <span id="password" style="display: block; padding: 12px 15px; border: 1px solid #d9d9d9; border-radius: 4px; background-color: #fafafa;">123456</span>
+                        </div>
+                    </div>
+                    
+                    <!-- 重置密码按钮 -->
+                    <div class="form-row" id="resetPasswordBtnGroup" style="display: none;">
+                        <div class="form-group">
+                            <label>&nbsp;</label>
+                            <button class="btn btn-warning" onclick="resetPassword()">重置为初始密码</button>
                         </div>
                     </div>
                 </div>
@@ -362,11 +400,17 @@
     </div>
 
     <script>
-        // 身份类型数据
-        const identityTypes = [
+        // 账号类型数据
+        const accountTypes = [
             { id: 1, name: '子经营者', code: 'sub_merchant' },
             { id: 2, name: '商户', code: 'merchant' }
         ];
+        
+        // 操作类型数据
+        const operationTypes = [
+            { value: 'create', name: '创建新账号' },
+            { value: 'update', name: '更新账号权限' }
+        ];
 
         // 权限数据（从权限编辑页面获取的示例数据）
         const permissions = [
@@ -420,7 +464,8 @@
             }
         ];
 
-        let selectedIdentity = null;
+        let selectedAccountType = null;
+        let selectedOperationType = null;
         let selectedPermissions = new Set();
 
         // 初始化页面
@@ -428,30 +473,64 @@
             initPermissionTree();
             bindEvents();
         });
-
-        // 初始化身份选项（已改为静态select，无需动态初始化）
-        function handleIdentityChange() {
-            const select = document.getElementById('identitySelect');
-            const selectedValue = select.value;
+        
+        // Tab切换功能
+        function switchTab(tabCode) {
+            // 更新选中的账号类型
+            selectedAccountType = accountTypes.find(type => type.code === tabCode);
             
-            if (selectedValue) {
-                selectedIdentity = identityTypes.find(type => type.code === selectedValue);
-                console.log('已选择身份:', selectedIdentity);
-                // 这里可以根据身份类型推荐相应的权限
-                recommendPermissionsForIdentity(selectedIdentity);
-            } else {
-                selectedIdentity = null;
+            // 更新tab按钮样式
+            document.querySelectorAll('.tab-btn').forEach(btn => {
+                btn.classList.remove('active');
+            });
+            event.target.classList.add('active');
+            
+            console.log('已切换到账号类型:', selectedAccountType);
+            
+            // 根据操作类型推荐权限
+            if (selectedOperationType) {
+                recommendPermissionsForAccountType(selectedAccountType, selectedOperationType);
             }
         }
 
-        // 根据身份类型推荐权限
-        function recommendPermissionsForIdentity(identity) {
-            // 根据不同身份推荐默认权限
+        // 处理操作类型变化
+        function handleTypeChange() {
+            const select = document.getElementById('typeSelect');
+            const selectedValue = select.value;
+            
+            if (selectedValue) {
+                selectedOperationType = operationTypes.find(type => type.value === selectedValue);
+                console.log('已选择操作类型:', selectedOperationType);
+                
+                // 显示/隐藏密码字段
+                const passwordRow = document.getElementById('passwordRow');
+                const resetPasswordBtnGroup = document.getElementById('resetPasswordBtnGroup');
+                
+                if (selectedValue === 'create') {
+                    passwordRow.style.display = 'flex';
+                    resetPasswordBtnGroup.style.display = 'none';
+                } else if (selectedValue === 'update') {
+                    passwordRow.style.display = 'none';
+                    resetPasswordBtnGroup.style.display = 'block';
+                }
+                
+                // 根据账号类型和操作类型推荐权限
+                if (selectedAccountType) {
+                    recommendPermissionsForAccountType(selectedAccountType, selectedOperationType);
+                }
+            } else {
+                selectedOperationType = null;
+            }
+        }
+
+        // 根据账号类型和操作类型推荐权限
+        function recommendPermissionsForAccountType(accountType, operationType) {
+            // 根据不同账号类型和操作类型推荐默认权限
             const recommendedPermissions = [];
-            if (identity.code === 'sub_merchant') {
+            if (accountType.code === 'sub_merchant') {
                 // 子经营者推荐基础权限
                 recommendedPermissions.push('CONTENT');
-            } else if (identity.code === 'merchant') {
+            } else if (accountType.code === 'merchant') {
                 // 商户推荐更多权限
                 recommendedPermissions.push('SYSTEM', 'CONTENT');
             }
@@ -467,6 +546,13 @@
             });
         }
 
+        // 重置密码功能
+        function resetPassword() {
+            if (confirm('确定要将密码重置为初始密码123456吗？')) {
+                alert('密码已重置为初始密码123456！');
+            }
+        }
+
         // 初始化权限树
         function initPermissionTree() {
             const tree = buildPermissionTree(permissions);
@@ -676,25 +762,33 @@
 
         // 绑定事件
         function bindEvents() {
-            // 手机号输入验证
-            document.getElementById('phoneNumber').addEventListener('input', function(e) {
-                let value = e.target.value.replace(/\D/g, '');
-                if (value.length > 11) {
-                    value = value.slice(0, 11);
-                }
-                e.target.value = value;
+            // 账号输入验证
+            document.getElementById('account').addEventListener('input', function(e) {
+                // 可以根据需要添加账号输入验证逻辑
+                // 目前保持账号输入不限制格式
             });
         }
 
         // 重置表单
         function resetForm() {
             if (confirm('确定要重置所有信息吗？')) {
-                // 重置身份选择
-                selectedIdentity = null;
-                document.getElementById('identitySelect').value = '';
+                // 重置账号类型选择（默认选择第一个tab）
+                selectedAccountType = accountTypes[0];
+                document.querySelectorAll('.tab-btn').forEach(btn => {
+                    btn.classList.remove('active');
+                });
+                document.querySelector('.tab-btn').classList.add('active');
                 
-                // 重置手机号
-                document.getElementById('phoneNumber').value = '';
+                // 重置操作类型选择
+                selectedOperationType = null;
+                document.getElementById('typeSelect').value = '';
+                
+                // 重置账号
+                document.getElementById('account').value = '';
+                
+                // 隐藏密码字段和重置密码按钮
+                document.getElementById('passwordRow').style.display = 'none';
+                document.getElementById('resetPasswordBtnGroup').style.display = 'none';
                 
                 // 重置权限选择
                 selectedPermissions.clear();
@@ -719,21 +813,22 @@
 
         // 保存权限分配
         function saveAssignment() {
-            // 验证身份选择
-            if (!selectedIdentity) {
-                alert('请选择账号身份！');
+            // 验证账号类型选择
+            if (!selectedAccountType) {
+                alert('请选择账号类型！');
                 return;
             }
             
-            // 验证手机号
-            const phoneNumber = document.getElementById('phoneNumber').value.trim();
-            if (!phoneNumber) {
-                alert('请输入手机号！');
+            // 验证操作类型选择
+            if (!selectedOperationType) {
+                alert('请选择操作类型！');
                 return;
             }
             
-            if (!/^1[3-9]\d{9}$/.test(phoneNumber)) {
-                alert('请输入正确的手机号格式！');
+            // 验证账号
+            const account = document.getElementById('account').value.trim();
+            if (!account) {
+                alert('请输入账号！');
                 return;
             }
             
@@ -745,8 +840,9 @@
             
             // 构建保存数据
             const assignmentData = {
-                identity: selectedIdentity,
-                phoneNumber: phoneNumber,
+                accountType: selectedAccountType,
+                operationType: selectedOperationType,
+                account: account,
                 permissions: Array.from(selectedPermissions)
             };