5.0

sop-admin/sop-admin-backend/src/main/java/com/gitee/sop/adminbackend/controller/isv/PermGroupController.java

@@ -4,6 +4,7 @@ import com.gitee.fastmybatis.core.PageInfo;
 import com.gitee.fastmybatis.core.query.LambdaQuery;
 import com.gitee.sop.adminbackend.common.req.IdParam;
 import com.gitee.sop.adminbackend.common.resp.Result;
+import com.gitee.sop.adminbackend.controller.isv.req.PermGroupPageParam;
 import com.gitee.sop.adminbackend.controller.isv.req.PermGroupParam;
 import com.gitee.sop.adminbackend.dao.entity.PermGroup;
 import com.gitee.sop.adminbackend.service.isv.PermGroupService;
@@ -35,8 +36,8 @@ public class PermGroupController {
      * @return 返回分页结果
      */
     @GetMapping("/listAll")
-    public Result<List<PermGroup>> listAll() {
-        List<PermGroup> list = permGroupService.listAll();
+    public Result<List<PermGroup>> listAll(PermGroupParam param) {
+        List<PermGroup> list = permGroupService.list(param.toQuery());
         return Result.ok(list);
     }
 
@@ -47,7 +48,7 @@ public class PermGroupController {
      * @return 返回分页结果
      */
     @GetMapping("/page")
-    public Result<PageInfo<PermGroup>> page(PermGroupParam param) {
+    public Result<PageInfo<PermGroup>> page(PermGroupPageParam param) {
         LambdaQuery<PermGroup> query = param.toLambdaQuery(PermGroup.class);
         PageInfo<PermGroup> pageInfo = permGroupService.doPage(query);
         return Result.ok(pageInfo);

sop-admin/sop-admin-backend/src/main/java/com/gitee/sop/adminbackend/controller/isv/PermGroupPermissionController.java

@@ -0,0 +1,56 @@
+package com.gitee.sop.adminbackend.controller.isv;
+
+import com.gitee.fastmybatis.core.PageInfo;
+import com.gitee.fastmybatis.core.query.LambdaQuery;
+import com.gitee.fastmybatis.core.query.param.PageParam;
+import com.gitee.sop.adminbackend.common.resp.Result;
+import com.gitee.sop.adminbackend.controller.isv.req.PermGroupApiInfoParam;
+import com.gitee.sop.adminbackend.controller.isv.req.PermGroupPermissionParam;
+import com.gitee.sop.adminbackend.dao.entity.ApiInfo;
+import com.gitee.sop.adminbackend.dao.entity.PermGroupPermission;
+import com.gitee.sop.adminbackend.service.isv.PermGroupPermissionService;
+import com.gitee.sop.adminbackend.service.isv.dto.PermGroupPermissionDTO;
+import com.gitee.sop.adminbackend.util.CopyUtil;
+import org.springframework.validation.annotation.Validated;
+import org.springframework.web.bind.annotation.GetMapping;
+import org.springframework.web.bind.annotation.PostMapping;
+import org.springframework.web.bind.annotation.RequestBody;
+import org.springframework.web.bind.annotation.RequestMapping;
+import org.springframework.web.bind.annotation.RestController;
+
+import javax.annotation.Resource;
+import java.util.List;
+
+/**
+ * @author 六如
+ */
+@RestController
+@RequestMapping("perm/group/permission")
+public class PermGroupPermissionController {
+
+    @Resource
+    private PermGroupPermissionService permGroupPermissionService;
+
+    /**
+     * 查询分组接口
+     *
+     * @param param param
+     * @return 返回分页结果
+     */
+    @GetMapping("/list")
+    public Result<List<ApiInfo>> page(@Validated PermGroupApiInfoParam param) {
+        LambdaQuery<ApiInfo> query = param.toLambdaQuery(ApiInfo.class);
+        List<ApiInfo> apiInfoList = permGroupPermissionService.listGroupApiId(param.getGroupId(), query);
+        return Result.ok(apiInfoList);
+    }
+
+    @PostMapping("setting")
+    public Result<Integer> setting(@RequestBody @Validated PermGroupPermissionParam param) {
+        PermGroupPermissionDTO permGroupPermissionDTO = CopyUtil.copyBean(param, PermGroupPermissionDTO::new);
+        int cnt = permGroupPermissionService.setting(permGroupPermissionDTO);
+        return Result.ok(cnt);
+    }
+
+
+
+}

sop-admin/sop-admin-backend/src/main/java/com/gitee/sop/adminbackend/controller/isv/req/PermGroupApiInfoParam.java

@@ -0,0 +1,25 @@
+package com.gitee.sop.adminbackend.controller.isv.req;
+
+import com.gitee.fastmybatis.core.query.Operator;
+import com.gitee.fastmybatis.core.query.annotation.Condition;
+import com.gitee.fastmybatis.core.query.param.IParam;
+import lombok.Data;
+
+import javax.validation.constraints.NotNull;
+
+/**
+ * @author 六如
+ */
+@Data
+public class PermGroupApiInfoParam implements IParam {
+
+    @NotNull
+    private Long groupId;
+
+    @Condition(operator = Operator.like)
+    private String apiName;
+
+    @Condition
+    private Integer status;
+
+}

sop-admin/sop-admin-backend/src/main/java/com/gitee/sop/adminbackend/controller/isv/req/PermGroupPageParam.java

@@ -0,0 +1,24 @@
+package com.gitee.sop.adminbackend.controller.isv.req;
+
+import com.gitee.fastmybatis.core.query.Operator;
+import com.gitee.fastmybatis.core.query.annotation.Condition;
+import com.gitee.fastmybatis.core.query.param.PageParam;
+import lombok.Data;
+import lombok.EqualsAndHashCode;
+
+/**
+ * 备注：分组表
+ *
+ * @author 六如
+ */
+@EqualsAndHashCode(callSuper = true)
+@Data
+public class PermGroupPageParam extends PageParam {
+
+    /**
+     * 分组描述
+     */
+    @Condition(operator = Operator.like)
+    private String groupName;
+
+}

sop-admin/sop-admin-backend/src/main/java/com/gitee/sop/adminbackend/controller/isv/req/PermGroupParam.java

@@ -2,18 +2,14 @@ package com.gitee.sop.adminbackend.controller.isv.req;
 
 import com.gitee.fastmybatis.core.query.Operator;
 import com.gitee.fastmybatis.core.query.annotation.Condition;
-import com.gitee.fastmybatis.core.query.param.PageParam;
+import com.gitee.fastmybatis.core.query.param.IParam;
 import lombok.Data;
-import lombok.EqualsAndHashCode;
 
 /**
- * 备注：分组表
- *
  * @author 六如
  */
-@EqualsAndHashCode(callSuper = true)
 @Data
-public class PermGroupParam extends PageParam {
+public class PermGroupParam implements IParam {
 
     /**
      * 分组描述

sop-admin/sop-admin-backend/src/main/java/com/gitee/sop/adminbackend/controller/isv/req/PermGroupPermissionParam.java

@@ -0,0 +1,19 @@
+package com.gitee.sop.adminbackend.controller.isv.req;
+
+import lombok.Data;
+
+import javax.validation.constraints.NotNull;
+import java.util.List;
+
+/**
+ * @author 六如
+ */
+@Data
+public class PermGroupPermissionParam {
+
+    @NotNull
+    private Long groupId;
+
+    private List<Long> apiIdList;
+
+}

sop-admin/sop-admin-backend/src/main/java/com/gitee/sop/adminbackend/controller/serve/ApiInfoController.java

@@ -5,7 +5,7 @@ import com.gitee.fastmybatis.core.query.Query;
 import com.gitee.sop.adminbackend.common.dto.StatusUpdateDTO;
 import com.gitee.sop.adminbackend.common.req.StatusUpdateParam;
 import com.gitee.sop.adminbackend.common.resp.Result;
-import com.gitee.sop.adminbackend.controller.serve.req.ApiInfoParam;
+import com.gitee.sop.adminbackend.controller.serve.req.ApiInfoPageParam;
 import com.gitee.sop.adminbackend.dao.entity.ApiInfo;
 import com.gitee.sop.adminbackend.service.serve.ApiInfoService;
 import com.gitee.sop.adminbackend.util.CopyUtil;
@@ -17,6 +17,8 @@ import org.springframework.web.bind.annotation.RequestBody;
 import org.springframework.web.bind.annotation.RequestMapping;
 import org.springframework.web.bind.annotation.RestController;
 
+import java.util.List;
+
 
 /**
  * 接口管理
@@ -37,13 +39,27 @@ public class ApiInfoController {
      * @return
      */
     @GetMapping("/page")
-    public Result<PageInfo<ApiInfo>> page(ApiInfoParam param) {
+    public Result<PageInfo<ApiInfo>> page(ApiInfoPageParam param) {
         Query query = param.toQuery();
         query.orderByDesc("id");
         PageInfo<ApiInfo> pageInfo = apiInfoService.page(query);
         return Result.ok(pageInfo);
     }
 
+    /**
+     * 查询全部
+     *
+     * @param param
+     * @return
+     */
+    @GetMapping("/listAll")
+    public Result<List<ApiInfo>> listAll(ApiInfoPageParam param) {
+        Query query = param.toQuery();
+        query.orderByDesc("id");
+        List<ApiInfo> list = apiInfoService.list(query);
+        return Result.ok(list);
+    }
+
     /**
      * 新增记录
      *

sop-admin/sop-admin-backend/src/main/java/com/gitee/sop/adminbackend/controller/serve/req/ApiInfoPageParam.java

@@ -0,0 +1,22 @@
+package com.gitee.sop.adminbackend.controller.serve.req;
+
+import com.gitee.fastmybatis.core.query.Operator;
+import com.gitee.fastmybatis.core.query.annotation.Condition;
+import com.gitee.fastmybatis.core.query.param.PageParam;
+import lombok.Data;
+import lombok.EqualsAndHashCode;
+
+/**
+ * @author 六如
+ */
+@EqualsAndHashCode(callSuper = true)
+@Data
+public class ApiInfoPageParam extends PageParam {
+
+    @Condition(operator = Operator.like)
+    private String apiName;
+
+    @Condition
+    private Integer status;
+
+}

sop-admin/sop-admin-backend/src/main/java/com/gitee/sop/adminbackend/controller/serve/req/ApiInfoParam.java

@@ -2,16 +2,13 @@ package com.gitee.sop.adminbackend.controller.serve.req;
 
 import com.gitee.fastmybatis.core.query.Operator;
 import com.gitee.fastmybatis.core.query.annotation.Condition;
-import com.gitee.fastmybatis.core.query.param.PageParam;
 import lombok.Data;
-import lombok.EqualsAndHashCode;
 
 /**
  * @author 六如
  */
-@EqualsAndHashCode(callSuper = true)
 @Data
-public class ApiInfoParam extends PageParam {
+public class ApiInfoParam {
 
     @Condition(operator = Operator.like)
     private String apiName;

sop-admin/sop-admin-backend/src/main/java/com/gitee/sop/adminbackend/dao/entity/PermGroupPermission.java

@@ -32,7 +32,7 @@ public class PermGroupPermission {
     /**
      * api_info.id
      */
-    private String apiId;
+    private Long apiId;
 
     /**
      * 添加时间

sop-admin/sop-admin-backend/src/main/java/com/gitee/sop/adminbackend/service/isv/PermGroupPermissionService.java

@@ -3,9 +3,21 @@ package com.gitee.sop.adminbackend.service.isv;
 import com.gitee.fastmybatis.core.PageInfo;
 import com.gitee.fastmybatis.core.query.LambdaQuery;
 import com.gitee.fastmybatis.core.support.LambdaService;
+import com.gitee.sop.adminbackend.dao.entity.ApiInfo;
 import com.gitee.sop.adminbackend.dao.entity.PermGroupPermission;
+import com.gitee.sop.adminbackend.dao.mapper.ApiInfoMapper;
 import com.gitee.sop.adminbackend.dao.mapper.PermGroupPermissionMapper;
+import com.gitee.sop.adminbackend.service.isv.dto.PermGroupPermissionDTO;
+import java.time.LocalDateTime;
+import java.util.ArrayList;
+import java.util.Collection;
+import java.util.List;
+import java.util.stream.Collectors;
+
 import org.springframework.stereotype.Service;
+import org.springframework.util.CollectionUtils;
+
+import javax.annotation.Resource;
 
 
 /**
@@ -14,8 +26,11 @@ import org.springframework.stereotype.Service;
 @Service
 public class PermGroupPermissionService implements LambdaService<PermGroupPermission, PermGroupPermissionMapper> {
 
-	public PageInfo<PermGroupPermission> doPage(LambdaQuery<PermGroupPermission> query) {
-     	query.orderByDesc(PermGroupPermission::getId);
+    @Resource
+    private ApiInfoMapper apiInfoMapper;
+
+    public PageInfo<PermGroupPermission> doPage(LambdaQuery<PermGroupPermission> query) {
+        query.orderByDesc(PermGroupPermission::getId);
         PageInfo<PermGroupPermission> page = this.page(query);
 
         // 格式转换
@@ -25,5 +40,36 @@ public class PermGroupPermissionService implements LambdaService<PermGroupPermis
         });
     }
 
+    public List<ApiInfo> listGroupApiId(Long groupId, LambdaQuery<ApiInfo> query) {
+        List<Long> apiIds = this.query()
+                .eq(PermGroupPermission::getGroupId, groupId)
+                .listUniqueValue(PermGroupPermission::getApiId);
 
+        if (apiIds.isEmpty()) {
+            return new ArrayList<>(0);
+        }
+
+        query.in(ApiInfo::getId, apiIds);
+
+        return apiInfoMapper.list(query);
+    }
+
+    public int setting(PermGroupPermissionDTO param) {
+        Long groupId = param.getGroupId();
+        this.deleteByColumn(PermGroupPermission::getGroupId, groupId);
+
+        List<Long> apiIdList = param.getApiIdList();
+        if (CollectionUtils.isEmpty(apiIdList)) {
+            return 0;
+        }
+        List<PermGroupPermission> saveList = apiIdList.stream()
+                .map(apiId -> {
+                    PermGroupPermission permGroupPermission = new PermGroupPermission();
+                    permGroupPermission.setGroupId(groupId);
+                    permGroupPermission.setApiId(apiId);
+                    return permGroupPermission;
+                })
+                .collect(Collectors.toList());
+        return this.saveBatch(saveList);
+    }
 }

sop-admin/sop-admin-backend/src/main/java/com/gitee/sop/adminbackend/service/isv/dto/PermGroupPermissionDTO.java

@@ -0,0 +1,19 @@
+package com.gitee.sop.adminbackend.service.isv.dto;
+
+import lombok.Data;
+
+import javax.validation.constraints.NotNull;
+import java.util.List;
+
+/**
+ * @author 六如
+ */
+@Data
+public class PermGroupPermissionDTO {
+
+    @NotNull
+    private Long groupId;
+
+    private List<Long> apiIdList;
+
+}

sop-admin/sop-admin-frontend/README.md

@@ -9,7 +9,9 @@
 
 ## 开发部署
 
-> 规定 node 版本应不小于 18.18.0
+安装nodejs
+
+> node版本 >= 18.18.0
 
 - macOS用户在命令前面添加`sudo`
 

sop-admin/sop-admin-frontend/src/api/permGroupPermission.ts

@@ -0,0 +1,38 @@
+import { createUrl, http } from "@/utils/http";
+import type { Result } from "@/model";
+
+// 后端请求接口
+const apiUrl: any = createUrl({
+  listGroupApiId: "perm/group/permission/list",
+  setting: "perm/group/permission/setting"
+});
+
+/**
+ * 接口管理
+ */
+export const api: any = {
+  /**
+   * 查询分组权限
+   *
+   * @param groupId groupId
+   */
+  listGroupApiId(groupId: number): Promise<Result<any>> {
+    const params = {
+      groupId: groupId
+    };
+    return http.get<Result<any>, any>(apiUrl.listGroupApiId, { params });
+  },
+  /**
+   * 设置接口权限
+   *
+   * @param groupId groupId
+   * @param apiIdList apiIdList
+   */
+  setting(groupId, apiIdList) {
+    const data = {
+      groupId: groupId,
+      apiIdList: apiIdList
+    };
+    return http.post<Result<any>, any>(apiUrl.setting, { data });
+  }
+};

sop-admin/sop-admin-frontend/src/api/serveApi.ts

@@ -4,6 +4,7 @@ import type { PageResult, Result } from "@/model";
 // 后端请求接口
 const apiUrl: any = createUrl({
   page: "/serve/api/page",
+  listAll: "/serve/api/listAll",
   add: "/serve/api/add",
   update: "/serve/api/update",
   del: "/serve/api/delete",
@@ -21,6 +22,13 @@ export const api: any = {
   page(params: object): Promise<PageResult> {
     return http.get<PageResult, any>(apiUrl.page, { params });
   },
+  /**
+   * 查询全部
+   * @param params
+   */
+  listAll(params: object): Promise<PageResult> {
+    return http.get<Result<any>, any>(apiUrl.listAll, { params });
+  },
   /**
    * 新增
    * @param data 表单内容

sop-admin/sop-admin-frontend/src/components/ApiSelect/index.ts

@@ -1,14 +1,61 @@
 import { ref } from "vue";
-import { type PlusColumn } from "plus-pro-components";
+import { type PlusColumn, useTable } from "plus-pro-components";
 import { withInstall } from "@pureadmin/utils";
 import apiSelect from "./index.vue";
 import { StatusEnum } from "@/model/enums";
+import { api as serveApi } from "@/api/serveApi";
 
 export const dlgApiSelectShow = ref(false);
 export const dlgWidth = ref(1100);
+export const handleSaveApi = ref((_: Array<number>) => {});
+
+// ========= search form =========
+
+// 查询表单对象
+export const searchFormData = ref({
+  apiName: "",
+  status: "",
+  pageIndex: 1,
+  pageSize: 999999
+});
+
+// 查询表单字段定义
+export const searchFormColumns: PlusColumn[] = [
+  {
+    label: "接口名称",
+    prop: "apiName"
+  },
+  {
+    label: "状态",
+    prop: "status",
+    width: 80,
+    valueType: "select",
+    options: [
+      {
+        label: "启用",
+        value: StatusEnum.ENABLE,
+        color: "green"
+      },
+      {
+        label: "禁用",
+        value: StatusEnum.DISABLE,
+        color: "red"
+      }
+    ]
+  }
+];
 
 // ========= table =========
 
+// 表格对象
+export const { tableData } = useTable<any[]>();
+
+interface TableRow {
+  id: number;
+}
+
+const multipleSelection = ref<TableRow[]>([]);
+export const selectable = (row: any) => row.status === StatusEnum.ENABLE;
 // 表格字段定义
 export const tableColumns: PlusColumn[] = [
   {
@@ -75,10 +122,56 @@ export const tableColumns: PlusColumn[] = [
   }
 ];
 
-export const handleConfirm = () => {
-  console.log(1);
+export const handleAuthApi = apiList => {
+  dlgApiSelectShow.value = true;
+  const arr = [];
+  for (let apiId of apiList) {
+    for (let row of tableData.value) {
+      if (apiId === row.id) {
+        arr.push(row);
+      }
+    }
+  }
+  multipleSelection.value = arr;
+  console.log(arr);
 };
 
+export const handleConfirm = () => {
+  const idList = multipleSelection.value.map(row => row.id);
+  handleSaveApi.value(idList);
+};
+
+export const handleClose = () => {
+  dlgApiSelectShow.value = false;
+};
+
+export const handleSelectionChange = (rows: TableRow[]) => {
+  console.log(rows);
+  multipleSelection.value = rows;
+};
+
+// 点击查询按钮
+export const handleSearch = () => {
+  search();
+};
+
+// 查询
+export const search = async () => {
+  try {
+    const { data } = await doSearch();
+    tableData.value = data;
+  } catch (error) {}
+};
+// 请求接口
+const doSearch = async () => {
+  // 查询参数
+  const data = searchFormData.value;
+  return serveApi.listAll(data);
+};
+
+// 页面加载
+search();
+
 const ApiSelect = withInstall(apiSelect);
 
 export { ApiSelect };

sop-admin/sop-admin-frontend/src/components/ApiSelect/index.vue

@@ -3,17 +3,14 @@ import {
   handleConfirm,
   dlgApiSelectShow,
   tableColumns,
-  dlgWidth
-} from "@/components/ApiSelect/index";
-import {
-  handlePaginationChange,
+  dlgWidth,
+  selectable,
+  handleSelectionChange,
   handleSearch,
-  pageInfo,
   searchFormColumns,
   searchFormData,
-  total,
   tableData
-} from "@/views/serve/api/index";
+} from "@/components/ApiSelect/index";
 </script>
 
 <template>
@@ -39,14 +36,12 @@ import {
       <PlusTable
         :columns="tableColumns"
         :table-data="tableData"
-        :pagination="{
-          total,
-          modelValue: pageInfo,
-          pageSizeList: [10, 20, 50, 100],
-          align: 'right'
+        :is-selection="true"
+        :selectionTableColumnProps="{
+          selectable: selectable
         }"
         adaptive
-        @paginationChange="handlePaginationChange"
+        @selection-change="handleSelectionChange"
       />
     </el-card>
   </PlusDialog>

sop-admin/sop-admin-frontend/src/views/isv/perm/permGroup.ts

@@ -1,14 +1,14 @@
 import { ref } from "vue";
 import {
   type ButtonsCallBackParams,
-  type PageInfo,
   type PlusColumn,
   useTable
 } from "plus-pro-components";
 import { ElMessage } from "element-plus";
 import { api } from "@/api/permGroup";
-import { dlgApiSelectShow } from "@/components/ApiSelect";
-import { search as searchApi } from "@/views/serve/api";
+import { api as permApi } from "@/api/permGroupPermission";
+import { handleSaveApi, handleClose } from "@/components/ApiSelect";
+import { searchTable } from "@/views/isv/perm/permGroupApi";
 
 const isAdd = ref(false);
 
@@ -16,9 +16,7 @@ const isAdd = ref(false);
 
 // 查询表单对象
 export const searchFormData = ref({
-  groupName: "",
-  pageIndex: 1,
-  pageSize: 10
+  groupName: ""
 });
 
 // 查询表单字段定义
@@ -31,46 +29,31 @@ export const searchFormColumns: PlusColumn[] = [
 
 // ========= table =========
 
+handleSaveApi.value = apiIdList => {
+  const groupId = selectedGroupId.value;
+  if (groupId > 0) {
+    permApi.setting(groupId, apiIdList).then(() => {
+      ElMessage.success("保存成功");
+      handleClose();
+      search();
+    });
+  }
+};
+
 // 表格对象
-export const {
-  tableData,
-  total,
-  pageInfo,
-  buttons: actionButtons
-} = useTable<any[]>();
-// 默认每页条数,默认10
-pageInfo.value.pageSize = 10;
+export const { tableData, buttons: actionButtons } = useTable<any[]>();
+
+export const selectedGroupId = ref(0);
 
 // 表格字段定义
 export const tableColumns: PlusColumn[] = [
   {
     label: "分组名称",
     prop: "groupName"
-  },
-  {
-    width: 160,
-    label: "添加时间",
-    prop: "addTime"
-  },
-  {
-    width: 160,
-    label: "修改时间",
-    prop: "updateTime"
   }
 ];
 // 表格按钮定义
 actionButtons.value = [
-  {
-    text: "接口授权",
-    code: "edit",
-    props: {
-      type: "warning"
-    },
-    onClick() {
-      dlgApiSelectShow.value = true;
-      searchApi();
-    }
-  },
   {
     // 修改
     text: "修改",
@@ -78,7 +61,14 @@ actionButtons.value = [
     props: {
       type: "primary"
     },
+    // onClick: withModifiers((params: ButtonsCallBackParams) => {
+    //   isAdd.value = false;
+    //   editFormData.value = Object.assign({}, params.row);
+    //   dlgTitle.value = "修改";
+    //   dlgShow.value = true;
+    // }, ['stop', 'self']),
     onClick(params: ButtonsCallBackParams) {
+      params.e.stopPropagation();
       isAdd.value = false;
       editFormData.value = Object.assign({}, params.row);
       dlgTitle.value = "修改";
@@ -96,6 +86,7 @@ actionButtons.value = [
       options: { draggable: false }
     },
     onConfirm(params: ButtonsCallBackParams) {
+      params.e.stopPropagation();
       api.del(params.row).then(() => {
         ElMessage({
           message: "删除成功",
@@ -135,6 +126,13 @@ export const editFormColumns: PlusColumn[] = [
 
 // ========= event =========
 
+// 点击行
+export const handleRowClick = row => {
+  const groupId = row.id;
+  selectedGroupId.value = groupId;
+  searchTable(groupId);
+};
+
 // 添加按钮事件
 export const handleAdd = () => {
   isAdd.value = true;
@@ -156,13 +154,6 @@ export const handleSave = () => {
 
 // 点击查询按钮
 export const handleSearch = () => {
-  pageInfo.value.page = 1;
-  search();
-};
-
-// 分页事件
-export const handlePaginationChange = (_pageInfo: PageInfo): void => {
-  pageInfo.value = _pageInfo;
   search();
 };
 
@@ -170,19 +161,14 @@ export const handlePaginationChange = (_pageInfo: PageInfo): void => {
 const search = async () => {
   try {
     const { data } = await doSearch();
-    tableData.value = data.list;
-    total.value = data.total;
+    tableData.value = data;
   } catch (error) {}
 };
 // 请求接口
 const doSearch = async () => {
   // 查询参数
   const data = searchFormData.value;
-  // 添加分页参数
-  data.pageIndex = pageInfo.value.page;
-  data.pageSize = pageInfo.value.pageSize;
-
-  return api.page(data);
+  return api.listAll(data);
 };
 
 // 页面加载

sop-admin/sop-admin-frontend/src/views/isv/perm/permGroup.vue

@@ -7,60 +7,66 @@ import {
   editFormData,
   editFormRules,
   handleAdd,
-  handlePaginationChange,
+  handleRowClick,
   handleSave,
   handleSearch,
-  pageInfo,
   searchFormColumns,
   searchFormData,
+  selectedGroupId,
   tableColumns,
-  tableData,
-  total
+  tableData
 } from "./permGroup";
-import { ApiSelect } from "@/components/ApiSelect/index";
+import PermGroupApi from "./permGroupApi.vue";
 </script>
 <template>
   <el-card shadow="never">
-    <template #header>
-      <PlusSearch
-        v-model="searchFormData"
-        :columns="searchFormColumns"
-        :show-number="2"
-        label-position="right"
-        :has-reset="false"
-        @search="handleSearch"
-      />
-    </template>
-    <PlusTable
-      :columns="tableColumns"
-      :table-data="tableData"
-      :action-bar="{ buttons: actionButtons, width: 200 }"
-      :pagination="{
-        total,
-        modelValue: pageInfo,
-        pageSizeList: [10, 20, 50, 100],
-        align: 'right'
-      }"
-      adaptive
-      @paginationChange="handlePaginationChange"
-    >
-      <template #title>
-        <el-button type="primary" @click="handleAdd">新增</el-button>
-      </template>
-    </PlusTable>
-    <PlusDialogForm
-      v-model:visible="dlgShow"
-      v-model="editFormData"
-      :dialog="{ title: dlgTitle }"
-      :form="{
-        columns: editFormColumns,
-        rules: editFormRules,
-        labelWidth: '100px',
-        labelPosition: 'right'
-      }"
-      :hasErrorTip="false"
-      @confirm="handleSave"
-    />
-    <ApiSelect />
+    <el-container>
+      <el-aside width="300px">
+        <template #header>
+          <PlusSearch
+            v-model="searchFormData"
+            :columns="searchFormColumns"
+            :show-number="2"
+            label-position="right"
+            :has-reset="false"
+            @search="handleSearch"
+          />
+        </template>
+        <PlusTable
+          :columns="tableColumns"
+          :table-data="tableData"
+          :action-bar="{ buttons: actionButtons, width: 100 }"
+          adaptive
+          @row-click="handleRowClick"
+        >
+          <template #title>
+            <el-button type="primary" @click="handleAdd">新增</el-button>
+          </template>
+        </PlusTable>
+        <PlusDialogForm
+          v-model:visible="dlgShow"
+          v-model="editFormData"
+          :dialog="{ title: dlgTitle }"
+          :form="{
+            columns: editFormColumns,
+            rules: editFormRules,
+            labelWidth: '100px',
+            labelPosition: 'right'
+          }"
+          :hasErrorTip="false"
+          @confirm="handleSave"
+        />
+      </el-aside>
+      <el-main>
+        <el-card v-show="selectedGroupId > 0" shadow="never">
+          <template #header>
+            <div class="card-header">
+              <span>组权限</span>
+            </div>
+          </template>
+          <PermGroupApi />
+        </el-card>
+      </el-main>
+    </el-container>
   </el-card>
 </template>

sop-admin/sop-admin-frontend/src/views/isv/perm/permGroupApi.ts

@@ -0,0 +1,140 @@
+import { ref } from "vue";
+import { type PlusColumn, useTable } from "plus-pro-components";
+import { withInstall } from "@pureadmin/utils";
+import permGroupApi from "./permGroupApi.vue";
+import { StatusEnum } from "@/model/enums";
+import { api as serveApi } from "@/api/serveApi";
+
+// ========= search form =========
+
+// 查询表单对象
+export const searchFormData = ref({
+  groupId: 0,
+  apiName: "",
+  status: ""
+});
+
+// 查询表单字段定义
+export const searchFormColumns: PlusColumn[] = [
+  {
+    label: "接口名称",
+    prop: "apiName"
+  },
+  {
+    label: "状态",
+    prop: "status",
+    width: 80,
+    valueType: "select",
+    options: [
+      {
+        label: "启用",
+        value: StatusEnum.ENABLE,
+        color: "green"
+      },
+      {
+        label: "禁用",
+        value: StatusEnum.DISABLE,
+        color: "red"
+      }
+    ]
+  }
+];
+
+// ========= table =========
+
+// 表格对象
+export const { tableData } = useTable<any[]>();
+
+// 表格字段定义
+export const tableColumns: PlusColumn[] = [
+  {
+    label: "所属应用",
+    prop: "application",
+    tableColumnProps: {
+      showOverflowTooltip: true
+    }
+  },
+  {
+    label: "接口名称",
+    prop: "apiName",
+    tableColumnProps: {
+      showOverflowTooltip: true
+    }
+  },
+  {
+    label: "版本号",
+    prop: "apiVersion",
+    width: 80
+  },
+  {
+    label: "接口描述",
+    prop: "description",
+    tableColumnProps: {
+      showOverflowTooltip: true
+    }
+  },
+  {
+    label: "注册来源",
+    prop: "regSource",
+    width: 100,
+    valueType: "select",
+    options: [
+      {
+        label: "系统",
+        value: 1,
+        color: "blue"
+      },
+      {
+        label: "手动",
+        value: 2,
+        color: "green"
+      }
+    ]
+  },
+  {
+    label: "状态",
+    prop: "status",
+    width: 80,
+    valueType: "select",
+    options: [
+      {
+        label: "启用",
+        value: StatusEnum.ENABLE,
+        color: "green"
+      },
+      {
+        label: "禁用",
+        value: StatusEnum.DISABLE,
+        color: "red"
+      }
+    ]
+  }
+];
+
+export const searchTable = groupId => {
+  searchFormData.value.groupId = groupId;
+  search();
+};
+
+// 点击查询按钮
+export const handleSearch = () => {
+  search();
+};
+
+// 查询
+export const search = async () => {
+  try {
+    const { data } = await doSearch();
+    tableData.value = data;
+  } catch (error) {}
+};
+// 请求接口
+const doSearch = async () => {
+  // 查询参数
+  const data = searchFormData.value;
+  return serveApi.listAll(data);
+};
+
+const PermGroupApi = withInstall(permGroupApi);
+
+export { PermGroupApi };

sop-admin/sop-admin-frontend/src/views/isv/perm/permGroupApi.vue

@@ -0,0 +1,27 @@
+<script setup lang="ts">
+import {
+  tableColumns,
+  handleSearch,
+  searchFormColumns,
+  searchFormData,
+  tableData
+} from "./permGroupApi";
+import { ApiSelect } from "@/components/ApiSelect/index";
+</script>
+
+<template>
+  <el-card shadow="never">
+    <template #header>
+      <PlusSearch
+        v-model="searchFormData"
+        :columns="searchFormColumns"
+        :show-number="2"
+        label-position="right"
+        :has-reset="false"
+        @search="handleSearch"
+      />
+    </template>
+    <PlusTable :columns="tableColumns" :table-data="tableData" adaptive />
+    <ApiSelect />
+  </el-card>
+</template>