子账号与角色管理

src/api/modules/accountRoleManagement.ts

@@ -156,3 +156,24 @@ export const uoperationLogPage = ({
     { loading: false }
   );
 };
+// 查询子账号详情
+export const getSubAccountDetail = (storeId: number, userId: number, roleIdNew: Number): Promise<ResultData<MenuItem[]>> => {
+  return http.get<MenuItem[]>(
+    PORT_NONE + `/platform/user-role/getSubAccountDetail`,
+    { storeId, userId, roleIdNew },
+    { loading: false }
+  );
+};
+
+// 删除子账号
+export const removeRole = (roleId: number, storeId: number, userId: number): Promise<ResultData<ApiResponse>> => {
+  return http.get<ApiResponse>(PORT_NONE + `/platform/user-role/removeRole`, { roleId, storeId, userId }, { loading: false });
+};
+// 批量删除子账号 userIds数组 storeId商家id
+export const batchDeleteSubAccounts = ({ storeId, userIds }): Promise<ResultData<ApiResponse>> => {
+  return http.post<ApiResponse>(
+    PORT_NONE + `/platform/user-role/batchDeleteSubAccounts`,
+    { storeId, userIds },
+    { loading: false }
+  );
+};

src/views/accountRoleManagement/roleManagement/create.vue

@@ -355,8 +355,6 @@ const handleSave = async () => {
         ElMessage.success(isEdit.value ? "编辑成功" : "创建成功");
         // 返回列表页
         router.push("/accountRoleManagement/roleManagement");
-      } else {
-        ElMessage.error(res.msg || (isEdit.value ? "编辑失败" : "创建失败"));
       }
     } catch (error) {
       ElMessage.error(isEdit.value ? "编辑失败，请重试" : "创建失败，请重试");

src/views/accountRoleManagement/subAccountManagement/create.vue

@@ -12,10 +12,10 @@
         <div class="form-section">
           <h3 class="section-title">基本信息</h3>
           <el-form-item label="账号名称" prop="accountName">
-            <el-input v-model="subAccountForm.accountName" placeholder="请输入" maxlength="50" clearable />
+            <el-input v-model="subAccountForm.accountName" placeholder="请输入" maxlength="50" clearable :disabled="isView" />
           </el-form-item>
           <el-form-item label="手机号" prop="phone">
-            <el-input v-model="subAccountForm.phone" placeholder="请输入" maxlength="11" clearable />
+            <el-input v-model="subAccountForm.phone" placeholder="请输入" maxlength="11" clearable :disabled="isView" />
           </el-form-item>
         </div>
 
@@ -28,6 +28,7 @@
               placeholder="请选择角色"
               clearable
               style="width: 100%"
+              :disabled="isView"
               @change="handleRoleChange"
             >
               <el-option
@@ -56,8 +57,10 @@
 
     <!-- 底部按钮 -->
     <div class="form-footer">
-      <el-button @click="handleCancel"> 取消 </el-button>
-      <el-button type="primary" @click="handleSave" :loading="saveLoading"> 确定 </el-button>
+      <el-button @click="handleCancel">
+        {{ isView ? "返回" : "取消" }}
+      </el-button>
+      <el-button v-if="!isView" type="primary" @click="handleSave" :loading="saveLoading"> 确定 </el-button>
     </div>
   </div>
 </template>
@@ -72,7 +75,8 @@ import {
   getRolePermissionTable,
   type RolePermissionItem,
   type RoleItem,
-  createAccountAndAssignRole
+  createAccountAndAssignRole,
+  getSubAccountDetail
 } from "@/api/modules/accountRoleManagement";
 import { localGet } from "@/utils";
 import PermissionItem from "./PermissionItem.vue";
@@ -80,9 +84,10 @@ import PermissionItem from "./PermissionItem.vue";
 const router = useRouter();
 const route = useRoute();
 
-// 判断是编辑还是创建
-const accountId = computed(() => route.params.id as string | undefined);
-const isEdit = computed(() => !!accountId.value);
+// 判断是编辑、查看还是创建
+const accountId = computed(() => (route.params.id as string) || (route.query.id as string) || undefined);
+const isEdit = computed(() => !!accountId.value && route.query.type !== "view");
+const isView = computed(() => !!accountId.value && route.query.type === "view");
 
 // 表单引用
 const subAccountFormRef = ref<FormInstance>();
@@ -295,32 +300,51 @@ const resetPermissions = () => {
 onMounted(() => {
   loadRoleList();
   // 不在这里加载权限列表，等用户选择角色后再加载
-
-  if (isEdit.value) {
-    // 编辑模式：加载子账号数据
+  if (isEdit.value || isView.value) {
+    // 编辑或查看模式：加载子账号数据
     loadSubAccountData();
   }
 });
 
-// 加载子账号数据（编辑时）
-const loadSubAccountData = () => {
-  // TODO: 调用接口获取子账号详情
-  // 模拟数据
-  const mockAccountData = {
-    id: Number(accountId.value),
-    accountName: "测试账号",
-    phone: "13800138000",
-    roleId: 1,
-    permissions: [1, 11, 111, 2]
-  };
+// （编辑或查看时调用详情接口获取子账号数据）
+const loadSubAccountData = async () => {
+  if (!accountId.value) return;
 
-  subAccountForm.accountName = mockAccountData.accountName;
-  subAccountForm.phone = mockAccountData.phone;
-  subAccountForm.roleId = mockAccountData.roleId;
-  subAccountForm.permissions = mockAccountData.permissions;
+  try {
+    const storeId = localGet("createdId") || localGet("geeker-user")?.userInfo?.storeId || "";
+    const userId = Number(accountId.value);
+    const roleIdNew = Number(route.query.roleId);
+    const res = await getSubAccountDetail(Number(storeId), userId, roleIdNew);
+    const code = typeof res.code === "string" ? parseInt(res.code) : res.code;
 
-  // 设置权限列表的选中状态
-  setPermissionsChecked(mockAccountData.permissions);
+    if (code === 200 && res.data) {
+      // 处理返回数据：可能是数组或对象
+      let accountData: any;
+      accountData = res.data;
+
+      // 填充表单数据
+      subAccountForm.accountName = accountData.accountName || "";
+      subAccountForm.phone = accountData.phone || "";
+      subAccountForm.roleId = accountData.roleId;
+
+      // 如果有权限数据，先加载角色权限列表，然后设置选中状态
+      if (subAccountForm.roleId) {
+        await loadPermissionList();
+
+        // 如果接口返回了权限ID列表，设置选中状态
+        if (accountData.permissions && Array.isArray(accountData.permissions)) {
+          const permissionIds = accountData.permissions.map((p: any) => (typeof p === "object" ? p.id || p.permissionId : p));
+          subAccountForm.permissions = permissionIds;
+          setPermissionsChecked(permissionIds);
+        }
+      }
+    } else {
+      ElMessage.error(res.msg || "获取子账号详情失败");
+    }
+  } catch (error) {
+    console.error("获取子账号详情失败:", error);
+    ElMessage.error("获取子账号详情失败，请重试");
+  }
 };
 
 // 设置权限选中状态

src/views/accountRoleManagement/subAccountManagement/index.vue

@@ -207,8 +207,15 @@ const handleCreateSubAccount = () => {
 
 // 查看
 const handleView = (row: SubAccountItem) => {
-  // TODO: 实现查看功能
-  ElMessage.info("查看功能待实现");
+  router.push({
+    path: "/accountRoleManagement/subAccountManagement/create",
+    query: {
+      id: row.userId.toString(),
+      accountName: row.accountName,
+      roleId: row.roleId,
+      type: "view"
+    }
+  });
 };
 
 // 编辑
@@ -217,7 +224,9 @@ const handleEdit = (row: SubAccountItem) => {
     path: "/accountRoleManagement/subAccountManagement/create",
     query: {
       id: row.userId.toString(),
-      accountName: row.accountName
+      roleId: row.roleId,
+      accountName: row.accountName,
+      type: "edit"
     }
   });
 };