5.0

sop-admin/sop-admin-frontend/mock/asyncRoutes.ts

@@ -1,27 +1,62 @@
 // 模拟后端动态生成路由
 import { defineFakeRoute } from "vite-plugin-fake-server/client";
 
-/**
- * 服务管理
- */
-const apiRouter = {
-  path: "/serve",
-  meta: {
-    title: "服务管理",
-    icon: "ri:server-line",
-    rank: 10
-  },
-  children: [
-    {
-      path: "/serve/api/index",
-      name: "ApiManage",
-      meta: {
-        title: "接口管理",
-        roles: ["admin"]
+const apiRouters = [
+  {
+    path: "/serve",
+    meta: {
+      title: "服务管理",
+      icon: "ri:server-line",
+      rank: 10
+    },
+    children: [
+      {
+        path: "/serve/api/index",
+        name: "ApiManage",
+        meta: {
+          title: "接口管理",
+          roles: ["admin"]
+        }
       }
-    }
-  ]
-};
+    ]
+  },
+  {
+    path: "/isv",
+    meta: {
+      title: "ISV管理",
+      icon: "ri:shield-user-line",
+      rank: 10
+    },
+    children: [
+      {
+        path: "/isv/list/index",
+        name: "IsvManage",
+        meta: {
+          title: "ISV列表",
+          roles: ["admin"]
+        }
+      }
+    ]
+  },
+  {
+    path: "/sys",
+    meta: {
+      title: "系统管理",
+      icon: "ri:settings-2-line",
+      rank: 10
+    },
+    children: [
+      {
+        path: "/admin/user/index",
+        name: "AdminUser",
+        meta: {
+          title: "用户管理",
+          roles: ["admin"]
+        }
+      }
+    ]
+  }
+];
 
 export default defineFakeRoute([
   {
@@ -30,7 +65,7 @@ export default defineFakeRoute([
     response: () => {
       return {
         success: true,
-        data: [apiRouter]
+        data: apiRouters
       };
     }
   }

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

@@ -0,0 +1,52 @@
+import { createUrl, http } from "@/utils/http";
+import type { PageResult, Result } from "@/model";
+
+// 后端请求接口
+const apiUrl: any = createUrl({
+  page: "/isv/page",
+  add: "/isv/add",
+  update: "/isv/update",
+  del: "/isv/delete",
+  getKeys: "/isv/getKeys"
+});
+
+/**
+ * 接口管理
+ */
+export const api: any = {
+  /**
+   * 分页查询
+   * @param params 查询参数
+   */
+  page(params: object): Promise<PageResult> {
+    return http.get<PageResult, any>(apiUrl.page, { params });
+  },
+  /**
+   * 新增
+   * @param data 表单内容
+   */
+  add(data: object) {
+    return http.post<Result, any>(apiUrl.add, { data });
+  },
+  /**
+   * 修改
+   * @param data 表单内容
+   */
+  update(data: object) {
+    return http.post<Result, any>(apiUrl.update, { data });
+  },
+  /**
+   * 删除
+   * @param data 表单内容
+   */
+  del(data: object) {
+    return http.post<Result, any>(apiUrl.del, { data });
+  },
+  /**
+   * 查看秘钥
+   * @param params
+   */
+  viewKeys(params: object) {
+    return http.get<Result, any>(apiUrl.getKeys, { params });
+  }
+};

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

@@ -6,5 +6,5 @@ type Result = {
 };
 
 export const getAsyncRoutes = () => {
-  return http.request<Result>("get", "/mock/get-async-routes");
+  return http.request<Result>("get", "/get-async-routes");
 };

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

@@ -0,0 +1,52 @@
+import { createUrl, http } from "@/utils/http";
+import type { PageResult, Result } from "@/model";
+
+// 后端请求接口
+const apiUrl: any = createUrl({
+  page: "/serve/api/page",
+  add: "/serve/api/add",
+  update: "/serve/api/update",
+  del: "/serve/api/delete",
+  updateStatus: "/serve/api/updateStatus"
+});
+
+/**
+ * 接口管理
+ */
+export const api: any = {
+  /**
+   * 分页查询
+   * @param params 查询参数
+   */
+  page(params: object): Promise<PageResult> {
+    return http.get<PageResult, any>(apiUrl.page, { params });
+  },
+  /**
+   * 新增
+   * @param data 表单内容
+   */
+  add(data: object) {
+    return http.post<Result, any>(apiUrl.add, { data });
+  },
+  /**
+   * 修改
+   * @param data 表单内容
+   */
+  update(data: object) {
+    return http.post<Result, any>(apiUrl.update, { data });
+  },
+  /**
+   * 删除
+   * @param data 表单内容
+   */
+  del(data: object) {
+    return http.post<Result, any>(apiUrl.del, { data });
+  },
+  /**
+   * 修改状态
+   * @param data 表单内容
+   */
+  updateStatus(data: object) {
+    return http.post<Result, any>(apiUrl.updateStatus, { data });
+  }
+};

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

@@ -0,0 +1,44 @@
+import { createUrl, http } from "@/utils/http";
+import type { PageResult, Result } from "@/model";
+
+// 后端请求接口
+const apiUrl: any = createUrl({
+  page: "/sys/adminuser/page",
+  add: "/sys/adminuser/add",
+  update: "/sys/adminuser/update",
+  del: "/sys/adminuser/delete"
+});
+
+/**
+ * 接口管理
+ */
+export const api: any = {
+  /**
+   * 分页查询
+   * @param params 查询参数
+   */
+  page(params: object): Promise<PageResult> {
+    return http.get<PageResult, any>(apiUrl.page, { params });
+  },
+  /**
+   * 新增
+   * @param data 表单内容
+   */
+  add(data: object) {
+    return http.post<Result, any>(apiUrl.add, { data });
+  },
+  /**
+   * 修改
+   * @param data 表单内容
+   */
+  update(data: object) {
+    return http.post<Result, any>(apiUrl.update, { data });
+  },
+  /**
+   * 删除
+   * @param data 表单内容
+   */
+  del(data: object) {
+    return http.post<Result, any>(apiUrl.del, { data });
+  }
+};

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

@@ -1,4 +1,4 @@
-import { http } from "@/utils/http";
+import { baseUrl, http } from "@/utils/http";
 
 export type UserResult = {
   success: boolean;
@@ -34,12 +34,19 @@ export type RefreshTokenResult = {
   };
 };
 
+const apiUrl = {
+  login: baseUrl("/sys/login"),
+  refreshToken: baseUrl("/sys/refresh-token")
+};
+
 /** 登录 */
 export const getLogin = (data?: object) => {
-  return http.request<UserResult>("post", "/sys/login", { data });
+  return http.request<UserResult>("post", apiUrl.login, { data });
 };
 
 /** 刷新`token` */
 export const refreshTokenApi = (data?: object) => {
-  return http.request<RefreshTokenResult>("post", "/refresh-token", { data });
+  return http.request<RefreshTokenResult>("post", apiUrl.refreshToken, {
+    data
+  });
 };

sop-admin/sop-admin-frontend/src/model/enums/index.ts

@@ -0,0 +1,4 @@
+export enum StatusEnum {
+  ENABLE = 1,
+  DISABLE = 2
+}

sop-admin/sop-admin-frontend/src/model/index.ts

@@ -1,6 +1,8 @@
 export type Result = {
   success: boolean;
   data: object;
+  msg: "";
+  code: "";
 };
 
 export type PageResult = {

sop-admin/sop-admin-frontend/src/utils/http/index.ts

@@ -13,19 +13,23 @@ import { stringify } from "qs";
 import NProgress from "../progress";
 import { getToken, formatToken } from "@/utils/auth";
 import { useUserStoreHook } from "@/store/modules/user";
-
-const PREFIX_MOCK: string = "mock";
+import { ElMessage } from "element-plus";
 
 export const baseUrl = (url: string) => {
   if (url.startsWith("/")) {
     url = url.substring(1);
   }
-  if (url.startsWith(PREFIX_MOCK)) {
-    return url.substring(PREFIX_MOCK.length);
-  }
   return `/api/${url}`;
 };
 
+export const createUrl = (data: object) => {
+  const ret = {};
+  for (const dataKey in data) {
+    ret[dataKey] = baseUrl(data[dataKey]);
+  }
+  return ret;
+};
+
 // 相关配置请参考：www.axios-js.com/zh-cn/docs/#axios-request-config-1
 const defaultConfig: AxiosRequestConfig = {
   // 请求超时时间
@@ -45,6 +49,13 @@ class PureHttp {
   constructor() {
     this.httpInterceptorsRequest();
     this.httpInterceptorsResponse();
+    PureHttp.initConfig.beforeResponseCallback = response => {
+      const resp = response.data || {};
+      if (resp.code && resp.code !== "0") {
+        console.log(resp);
+        ElMessage.error(resp.msg || "后台出错,请查看日志");
+      }
+    };
   }
 
   /** `token`过期后，暂存待执行的请求 */
@@ -166,7 +177,7 @@ class PureHttp {
   ): Promise<T> {
     const config = {
       method,
-      url: baseUrl(url),
+      url: url,
       ...param,
       ...axiosConfig
     } as PureHttpRequestConfig;

sop-admin/sop-admin-frontend/src/views/admin/user/index.ts

@@ -0,0 +1,306 @@
+import { computed, ref } from "vue";
+import {
+  type ButtonsCallBackParams,
+  type FieldValues,
+  type PageInfo,
+  type PlusColumn,
+  useTable
+} from "plus-pro-components";
+import { ElMessage } from "element-plus";
+import { api } from "@/api/sysAdminUser";
+
+const isAdd = ref(false);
+
+// ========= search form =========
+
+// 查询表单对象
+export const searchFormData = ref({
+  id: "",
+  username: "",
+  password: "",
+  nickname: "",
+  email: "",
+  avatar: "",
+  status: "",
+  regType: "",
+  addTime: "",
+  updateTime: "",
+  pageIndex: 1,
+  pageSize: 10
+});
+
+// 查询表单字段定义
+export const searchFormColumns: PlusColumn[] = [
+  {
+    label: "用户名",
+    prop: "username"
+  },
+  {
+    label: "密码",
+    prop: "password"
+  },
+  {
+    label: "用户名",
+    prop: "nickname"
+  },
+  {
+    label: "邮箱",
+    prop: "email"
+  },
+  {
+    label: "头像",
+    prop: "avatar"
+  },
+  {
+    label: "状态，1：启用，2：禁用",
+    prop: "status"
+  },
+  {
+    label: "注册类型",
+    prop: "regType"
+  },
+  {
+    label: "addTime",
+    prop: "addTime"
+  },
+  {
+    label: "updateTime",
+    prop: "updateTime"
+  }
+];
+
+// ========= table =========
+
+// 表格对象
+export const {
+  tableData,
+  total,
+  pageInfo,
+  buttons: actionButtons
+} = useTable<any[]>();
+// 默认每页条数,默认10
+pageInfo.value.pageSize = 10;
+
+// 表格字段定义
+export const tableColumns: PlusColumn[] = [
+  {
+    label: "用户名",
+    prop: "username"
+  },
+  {
+    label: "密码",
+    prop: "password"
+  },
+  {
+    label: "用户名",
+    prop: "nickname"
+  },
+  {
+    label: "邮箱",
+    prop: "email"
+  },
+  {
+    label: "头像",
+    prop: "avatar"
+  },
+  {
+    label: "状态，1：启用，2：禁用",
+    prop: "status"
+  },
+  {
+    label: "注册类型",
+    prop: "regType"
+  },
+  {
+    label: "addTime",
+    prop: "addTime"
+  },
+  {
+    label: "updateTime",
+    prop: "updateTime"
+  }
+];
+// 表格按钮定义
+actionButtons.value = [
+  {
+    // 修改
+    text: "修改",
+    code: "edit",
+    props: {
+      type: "primary"
+    },
+    show: computed(() => true),
+    onClick(params: ButtonsCallBackParams) {
+      isAdd.value = false;
+      editFormData.value = Object.assign({}, params.row);
+      dlgTitle.value = "修改";
+      dlgShow.value = true;
+    }
+  },
+  {
+    // 删除
+    text: "删除",
+    code: "delete",
+    props: {
+      type: "danger"
+    },
+    confirm: {
+      options: { draggable: false }
+    },
+    onConfirm(params: ButtonsCallBackParams) {
+      api.del(params).then(() => {
+        ElMessage({
+          message: "删除成功",
+          type: "success"
+        });
+        dlgShow.value = false;
+        search();
+      });
+    }
+  }
+];
+
+// ========= dialog form =========
+
+// 弹窗显示
+export const dlgShow = ref(false);
+export const dlgTitle = ref("");
+// 表单值
+const editFormDataGen = () => {
+  return {
+    username: "",
+    password: "",
+    nickname: "",
+    email: "",
+    avatar: "",
+    status: "",
+    regType: "",
+    addTime: "",
+    updateTime: ""
+  };
+};
+export const editFormData = ref<FieldValues>(editFormDataGen());
+export const editFormRules = {
+  id: [{ required: true, message: "请输入id" }],
+  username: [{ required: true, message: "请输入用户名" }],
+  password: [{ required: true, message: "请输入密码" }],
+  nickname: [{ required: true, message: "请输入用户名" }],
+  email: [{ required: true, message: "请输入邮箱" }],
+  avatar: [{ required: true, message: "请输入头像" }],
+  status: [{ required: true, message: "请输入状态，1：启用，2：禁用" }],
+  regType: [{ required: true, message: "请输入注册类型" }],
+  addTime: [{ required: true, message: "请输入addTime" }],
+  updateTime: [{ required: true, message: "请输入updateTime" }]
+};
+
+// 表单内容
+export const editFormColumns: PlusColumn[] = [
+  {
+    label: "id",
+    prop: "id",
+    valueType: "copy"
+  },
+  {
+    label: "用户名",
+    prop: "username",
+    valueType: "copy"
+  },
+  {
+    label: "密码",
+    prop: "password",
+    valueType: "copy"
+  },
+  {
+    label: "用户名",
+    prop: "nickname",
+    valueType: "copy"
+  },
+  {
+    label: "邮箱",
+    prop: "email",
+    valueType: "copy"
+  },
+  {
+    label: "头像",
+    prop: "avatar",
+    valueType: "copy"
+  },
+  {
+    label: "状态，1：启用，2：禁用",
+    prop: "status",
+    valueType: "copy"
+  },
+  {
+    label: "注册类型",
+    prop: "regType",
+    valueType: "copy"
+  },
+  {
+    label: "addTime",
+    prop: "addTime",
+    valueType: "copy"
+  },
+  {
+    label: "updateTime",
+    prop: "updateTime",
+    valueType: "copy"
+  }
+];
+
+// ========= event =========
+
+// 添加按钮事件
+export const handleAdd = () => {
+  isAdd.value = true;
+  editFormData.value = editFormDataGen();
+  dlgTitle.value = "新增";
+  dlgShow.value = true;
+};
+
+// 保存按钮事件,校验成功后触发
+export const handleSave = () => {
+  const postData = editFormData.value;
+  const pms = isAdd.value ? api.add(postData) : api.update(postData);
+  pms.then(() => {
+    ElMessage({
+      message: "保存成功",
+      type: "success"
+    });
+    dlgShow.value = false;
+    search();
+  });
+};
+
+// 点击查询按钮
+export const handleSearch = () => {
+  pageInfo.value.page = 1;
+  search();
+};
+
+// 分页事件
+export const handlePaginationChange = (_pageInfo: PageInfo): void => {
+  pageInfo.value = _pageInfo;
+  search();
+};
+
+// 查询
+const search = async () => {
+  try {
+    const { data } = await doSearch();
+    tableData.value = data.list;
+    total.value = data.total;
+  } catch (error) {}
+};
+// 请求接口
+const doSearch = async () => {
+  // 查询参数
+  const data = searchFormData.value;
+  // 添加分页参数
+  data.pageIndex = pageInfo.value.page;
+  data.pageSize = pageInfo.value.pageSize;
+
+  return api.page(data);
+};
+
+// 页面加载
+search();

sop-admin/sop-admin-frontend/src/views/admin/user/index.vue

@@ -0,0 +1,62 @@
+<script setup lang="ts">
+import {
+  actionButtons,
+  dlgShow,
+  dlgTitle,
+  editFormColumns,
+  editFormData,
+  editFormRules,
+  handleAdd,
+  handlePaginationChange,
+  handleSave,
+  handleSearch,
+  pageInfo,
+  searchFormColumns,
+  searchFormData,
+  tableColumns,
+  tableData,
+  total
+} from "./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"
+      :action-bar="{ buttons: actionButtons, width: 120 }"
+      :pagination="{
+        total,
+        modelValue: pageInfo,
+        pageSizeList: [10, 20, 50, 100],
+        align: 'right'
+      }"
+      @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'
+      }"
+      @confirm="handleSave"
+    />
+  </el-card>
+</template>

sop-admin/sop-admin-frontend/src/views/isv/list/index.ts

@@ -0,0 +1,265 @@
+import { computed, ref } from "vue";
+import {
+  type ButtonsCallBackParams,
+  type FieldValues,
+  type PageInfo,
+  type PlusColumn,
+  useTable
+} from "plus-pro-components";
+import { ElMessage } from "element-plus";
+import { StatusEnum } from "@/model/enums";
+import { api } from "@/api/isvList";
+
+const isAdd = ref(false);
+
+// ========= search form =========
+
+// 查询表单对象
+export const searchFormData = ref({
+  id: "",
+  appId: "",
+  status: "",
+  remark: "",
+  pageIndex: 1,
+  pageSize: 10
+});
+
+// 查询表单字段定义
+export const searchFormColumns: PlusColumn[] = [
+  {
+    label: "AppID",
+    prop: "appId"
+  },
+  {
+    label: "状态",
+    prop: "status",
+    valueType: "select",
+    options: [
+      {
+        label: "启用",
+        value: StatusEnum.ENABLE,
+        color: "green"
+      },
+      {
+        label: "禁用",
+        value: StatusEnum.DISABLE,
+        color: "red"
+      }
+    ]
+  }
+];
+
+// ========= table =========
+
+// 表格对象
+export const {
+  tableData,
+  total,
+  pageInfo,
+  buttons: actionButtons
+} = useTable<any[]>();
+// 默认每页条数,默认10
+pageInfo.value.pageSize = 10;
+
+// 表格字段定义
+export const tableColumns: PlusColumn[] = [
+  {
+    label: "AppID",
+    prop: "appId",
+    width: 230
+  },
+  {
+    label: "秘钥",
+    prop: "keys",
+    width: 80
+  },
+  {
+    label: "角色",
+    prop: "roleNames",
+    width: 120
+  },
+  {
+    label: "状态",
+    prop: "status",
+    width: 80,
+    valueType: "select",
+    options: [
+      {
+        label: "启用",
+        value: StatusEnum.ENABLE,
+        color: "green"
+      },
+      {
+        label: "禁用",
+        value: StatusEnum.DISABLE,
+        color: "red"
+      }
+    ]
+  },
+  {
+    label: "备注",
+    prop: "remark"
+  },
+  {
+    label: "添加时间",
+    prop: "addTime"
+  },
+  {
+    label: "修改时间",
+    prop: "updateTime"
+  }
+];
+// 表格按钮定义
+actionButtons.value = [
+  {
+    // 修改
+    text: "修改",
+    code: "edit",
+    props: {
+      type: "primary"
+    },
+    show: computed(() => true),
+    onClick(params: ButtonsCallBackParams) {
+      isAdd.value = false;
+      editFormData.value = Object.assign({}, params.row);
+      dlgTitle.value = "修改";
+      dlgShow.value = true;
+    }
+  },
+  {
+    // 删除
+    text: "删除",
+    code: "delete",
+    props: {
+      type: "danger"
+    },
+    confirm: {
+      options: { draggable: false }
+    },
+    onConfirm(params: ButtonsCallBackParams) {
+      api.del(params).then(() => {
+        ElMessage({
+          message: "删除成功",
+          type: "success"
+        });
+        dlgShow.value = false;
+        search();
+      });
+    }
+  }
+];
+
+// ========= dialog form =========
+
+// 弹窗显示
+export const dlgShow = ref(false);
+export const dlgTitle = ref("");
+// 表单值
+const editFormDataGen = () => {
+  return {
+    id: "",
+    appId: "",
+    status: "",
+    remark: "",
+    addTime: "",
+    updateTime: ""
+  };
+};
+export const editFormData = ref<FieldValues>(editFormDataGen());
+export const editFormRules = {
+  id: [{ required: true, message: "请输入id" }],
+  appId: [{ required: true, message: "请输入appKey" }],
+  status: [{ required: true, message: "请输入1启用，2禁用" }]
+};
+
+// 表单内容
+export const editFormColumns: PlusColumn[] = [
+  {
+    label: "id",
+    prop: "id",
+    valueType: "copy"
+  },
+  {
+    label: "AppID",
+    prop: "appId",
+    valueType: "copy"
+  },
+  {
+    label: "1启用，2禁用",
+    prop: "status",
+    valueType: "copy"
+  },
+  {
+    label: "备注",
+    prop: "remark",
+    valueType: "copy"
+  },
+  {
+    label: "addTime",
+    prop: "addTime",
+    valueType: "copy"
+  },
+  {
+    label: "updateTime",
+    prop: "updateTime",
+    valueType: "copy"
+  }
+];
+
+// ========= event =========
+
+// 添加按钮事件
+export const handleAdd = () => {
+  isAdd.value = true;
+  editFormData.value = editFormDataGen();
+  dlgTitle.value = "新增";
+  dlgShow.value = true;
+};
+
+// 保存按钮事件,校验成功后触发
+export const handleSave = () => {
+  const postData = editFormData.value;
+  const pms = isAdd.value ? api.add(postData) : api.update(postData);
+  pms.then(() => {
+    ElMessage({
+      message: "保存成功",
+      type: "success"
+    });
+    dlgShow.value = false;
+    search();
+  });
+};
+
+// 点击查询按钮
+export const handleSearch = () => {
+  pageInfo.value.page = 1;
+  search();
+};
+
+// 分页事件
+export const handlePaginationChange = (_pageInfo: PageInfo): void => {
+  pageInfo.value = _pageInfo;
+  search();
+};
+
+// 查询
+const search = async () => {
+  try {
+    const { data } = await doSearch();
+    tableData.value = data.list;
+    total.value = data.total;
+  } catch (error) {}
+};
+// 请求接口
+const doSearch = async () => {
+  // 查询参数
+  const data = searchFormData.value;
+  // 添加分页参数
+  data.pageIndex = pageInfo.value.page;
+  data.pageSize = pageInfo.value.pageSize;
+
+  return api.page(data);
+};
+
+// 页面加载
+search();

sop-admin/sop-admin-frontend/src/views/isv/list/index.vue

@@ -0,0 +1,82 @@
+<script setup lang="ts">
+import {
+  actionButtons,
+  dlgShow,
+  dlgTitle,
+  editFormColumns,
+  editFormData,
+  editFormRules,
+  handleAdd,
+  handlePaginationChange,
+  handleSave,
+  handleSearch,
+  pageInfo,
+  searchFormColumns,
+  searchFormData,
+  tableColumns,
+  tableData,
+  total
+} from "./index";
+import {
+  dlgKeysShow,
+  showKeysFormColumns,
+  showKeysFormData,
+  viewKeys
+} from "./showKeys";
+</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: 120 }"
+      :pagination="{
+        total,
+        modelValue: pageInfo,
+        pageSizeList: [10, 20, 50, 100],
+        align: 'right'
+      }"
+      @paginationChange="handlePaginationChange"
+    >
+      <template #title>
+        <el-button type="primary" @click="handleAdd">新增</el-button>
+      </template>
+      <template #plus-cell-keys="scoped">
+        <el-link type="primary" @click="viewKeys(scoped.row)">查看</el-link>
+      </template>
+    </PlusTable>
+    <PlusDialogForm
+      v-model:visible="dlgShow"
+      v-model="editFormData"
+      label-width="200px"
+      :dialog="{ title: dlgTitle }"
+      :form="{
+        columns: editFormColumns,
+        rules: editFormRules,
+        labelWidth: '100px',
+        labelPosition: 'right'
+      }"
+      @confirm="handleSave"
+    />
+    <PlusDialogForm
+      v-model:visible="dlgKeysShow"
+      v-model="showKeysFormData"
+      :dialog="{ title: '秘钥' }"
+      :form="{ group: showKeysFormColumns, labelPosition: 'right' }"
+    >
+      <template #dialog-footer="{ handleCancel }">
+        <el-button type="primary" @click="handleCancel">关闭</el-button>
+      </template>
+    </PlusDialogForm>
+  </el-card>
+</template>

sop-admin/sop-admin-frontend/src/views/isv/list/showKeys.ts

@@ -0,0 +1,86 @@
+import { ref } from "vue";
+import type { PlusFormGroupRow } from "plus-pro-components";
+import { CreditCard } from "@element-plus/icons-vue";
+import { api } from "@/api/isvList";
+
+// 弹窗显示
+export const dlgKeysShow = ref(false);
+export const showKeysFormData = ref<object>({
+  publicKeyIsv: "",
+  privateKeyIsv: "",
+  publicKeyPlatform: "",
+  privateKeyPlatform: ""
+});
+// 表单内容
+export const showKeysFormColumns: PlusFormGroupRow[] = [
+  {
+    title: "ISV公私钥 - 标识☆分配给开发者",
+    icon: CreditCard,
+    columns: [
+      {
+        label: "ISV公钥",
+        prop: "publicKeyIsv",
+        valueType: "textarea",
+        labelWidth: 100,
+        fieldProps: {
+          showWordLimit: false,
+          placeholder: "",
+          readonly: true,
+          autosize: { minRows: 2, maxRows: 4 }
+        }
+      },
+      {
+        label: "☆ISV私钥",
+        prop: "privateKeyIsv",
+        valueType: "textarea",
+        labelWidth: 100,
+        fieldProps: {
+          showWordLimit: false,
+          placeholder: "",
+          readonly: true,
+          autosize: { minRows: 2, maxRows: 4 }
+        }
+      }
+    ]
+  },
+  {
+    title: "平台公私钥 - 标识☆分配给开发者",
+    icon: CreditCard,
+    columns: [
+      {
+        label: "☆平台公钥",
+        prop: "publicKeyPlatform",
+        valueType: "textarea",
+        labelWidth: 100,
+        fieldProps: {
+          showWordLimit: false,
+          placeholder: "",
+          readonly: true,
+          autosize: { minRows: 2, maxRows: 4 }
+        }
+      },
+      {
+        label: "平台私钥",
+        prop: "privateKeyPlatform",
+        valueType: "textarea",
+        labelWidth: 100,
+        fieldProps: {
+          showWordLimit: false,
+          placeholder: "",
+          readonly: true,
+          autosize: { minRows: 2, maxRows: 4 }
+        }
+      }
+    ]
+  }
+];
+
+export const viewKeys = (row: any) => {
+  const params = {
+    appId: row.appId
+  };
+  api.viewKeys(params).then(resp => {
+    showKeysFormData.value = resp.data;
+    dlgKeysShow.value = true;
+  });
+};

sop-admin/sop-admin-frontend/src/views/serve/api/index.ts

@@ -1,29 +1,55 @@
 import { computed, ref } from "vue";
 import {
-  type PlusColumn,
-  useTable,
-  type PageInfo,
+  type ButtonsCallBackParams,
   type FieldValues,
-  type ButtonsCallBackParams
+  type PageInfo,
+  type PlusColumn,
+  useTable
 } from "plus-pro-components";
-import { type PageResult } from "@/model";
-import { http } from "@/utils/http";
 import { ElMessage } from "element-plus";
+import { StatusEnum } from "@/model/enums";
+import { api } from "@/api/serveApi";
 
-// 后端请求接口
-const apiUrl = {
-  page: "/serve/api/page",
-  add: "/serve/api/add",
-  update: "/serve/api/update",
-  del: "/serve/api/delete"
-};
+const isAdd = ref(false);
+
+// ========= search form =========
 
 // 查询表单对象
 export const searchFormData = ref({
   apiName: "",
+  status: "",
   pageIndex: 1,
   pageSize: 10
 });
+
+// 查询表单字段定义
+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,
@@ -34,14 +60,6 @@ export const {
 // 默认每页条数,默认10
 pageInfo.value.pageSize = 10;
 
-// 查询表单字段定义
-export const searchFormColumns: PlusColumn[] = [
-  {
-    label: "接口名称",
-    prop: "apiName"
-  }
-];
-
 // 表格字段定义
 export const tableColumns: PlusColumn[] = [
   {
@@ -104,14 +122,14 @@ export const tableColumns: PlusColumn[] = [
     valueType: "select",
     options: [
       {
-        label: "禁用",
-        value: 0,
-        color: "red"
+        label: "启用",
+        value: StatusEnum.ENABLE,
+        color: "green"
       },
       {
-        label: "启用",
-        value: 1,
-        color: "green"
+        label: "禁用",
+        value: StatusEnum.DISABLE,
+        color: "red"
       }
     ]
   },
@@ -120,7 +138,7 @@ export const tableColumns: PlusColumn[] = [
     prop: "addTime"
   }
 ];
-
+// 表格按钮定义
 actionButtons.value = [
   {
     // 修改
@@ -131,73 +149,66 @@ actionButtons.value = [
     },
     show: computed(() => true),
     onClick(params: ButtonsCallBackParams) {
-      if (params?.formRefs) {
-        // isEdit v0.1.8 新增
-        const isEdit = params.formRefs[0].isEdit.value;
-        isEdit
-          ? params.formRefs[0]?.stopCellEdit()
-          : params.formRefs[0]?.startCellEdit();
-      }
+      isAdd.value = false;
+      editFormData.value = Object.assign({}, params.row);
+      dlgTitle.value = "修改接口";
+      dlgShow.value = true;
     }
   },
   {
     // 删除
-    text: "删除",
+    text: row => (row.status === StatusEnum.ENABLE ? "禁用" : "启用"),
     code: "delete",
-    props: {
-      type: "danger"
-    },
     confirm: {
-      options: { draggable: true }
-    },
-    onClick(params: ButtonsCallBackParams) {
-      console.log(params, "onClick");
+      message: data => {
+        const opt = data.row.status === StatusEnum.ENABLE ? "禁用" : "启用";
+        return `确定${opt}吗？`;
+      },
+      options: { draggable: false }
     },
     onConfirm(params: ButtonsCallBackParams) {
-      console.log(params, "onConfirm");
-    },
-    onCancel(params: ButtonsCallBackParams) {
-      console.log(params, "onCancel");
+      const data = {
+        id: params.row.id,
+        status:
+          params.row.status === StatusEnum.ENABLE
+            ? StatusEnum.DISABLE
+            : StatusEnum.ENABLE
+      };
+      api.updateStatus(data).then(() => {
+        ElMessage({
+          message: "修改成功",
+          type: "success"
+        });
+        dlgShow.value = false;
+        search();
+      });
     }
   }
 ];
 
-// 弹窗表单
+// ========= dialog form =========
+
+// 弹窗显示
 export const dlgShow = ref(false);
-export const editFormData = ref<FieldValues>({
-  application: "",
-  status: 1,
-  isPermission: 0,
-  isNeedToken: 0
-});
+export const dlgTitle = ref("");
+// 表单值
+const editFormDataGen = () => {
+  return {
+    application: "",
+    status: 1,
+    isPermission: 0,
+    isNeedToken: 0
+  };
+};
+export const editFormData = ref<FieldValues>(editFormDataGen());
 export const editFormRules = {
   application: [{ required: true, message: "请输入应用名称" }],
   apiName: [{ required: true, message: "请输入接口名称" }],
   apiVersion: [{ required: true, message: "请输入版本号" }],
   description: [{ required: true, message: "请输入接口描述" }]
 };
-export const handleDlgOpen = () => {
-  dlgShow.value = true;
-};
-
-export const handleSave = () => {
-  http
-    .post<PageResult, any>(apiUrl.add, { data: editFormData.value })
-    .then(resp => {
-      if (resp.success) {
-        ElMessage({
-          message: "保存成功",
-          type: "success"
-        });
-        dlgShow.value = false;
-        search();
-      } else {
-        console.log(resp);
-        ElMessage.error(`保存失败:${resp.msg}`);
-      }
-    });
-};
 
+// 表单内容
 export const editFormColumns: PlusColumn[] = [
   {
     label: "应用名称",
@@ -224,7 +235,7 @@ export const editFormColumns: PlusColumn[] = [
     prop: "remark",
     valueType: "textarea",
     fieldProps: {
-      maxlength: 10,
+      maxlength: 5000,
       showWordLimit: true,
       autosize: { minRows: 2, maxRows: 4 }
     }
@@ -282,12 +293,42 @@ export const editFormColumns: PlusColumn[] = [
   }
 ];
 
+// ========= event =========
+
+// 添加按钮事件
+export const handleAdd = () => {
+  isAdd.value = true;
+  editFormData.value = editFormDataGen();
+  dlgTitle.value = "新增接口";
+  dlgShow.value = true;
+};
+
+// 保存按钮事件,校验成功后触发
+export const handleSave = () => {
+  const postData = editFormData.value;
+  const pms = isAdd.value ? api.add(postData) : api.update(postData);
+  pms.then(() => {
+    ElMessage({
+      message: "保存成功",
+      type: "success"
+    });
+    dlgShow.value = false;
+    search();
+  });
+};
+
 // 点击查询按钮
 export const handleSearch = () => {
   pageInfo.value.page = 1;
   search();
 };
 
+// 分页事件
+export const handlePaginationChange = (_pageInfo: PageInfo): void => {
+  pageInfo.value = _pageInfo;
+  search();
+};
+
 // 查询
 const search = async () => {
   try {
@@ -304,12 +345,8 @@ const doSearch = async () => {
   data.pageIndex = pageInfo.value.page;
   data.pageSize = pageInfo.value.pageSize;
 
-  return http.get<PageResult, any>(apiUrl.page, { params: data });
-};
-// 分页事件
-export const handlePaginationChange = (_pageInfo: PageInfo): void => {
-  pageInfo.value = _pageInfo;
-  search();
+  return api.page(data);
 };
+
 // 页面加载
 search();

sop-admin/sop-admin-frontend/src/views/serve/api/index.vue

@@ -2,10 +2,11 @@
 import {
   actionButtons,
   dlgShow,
+  dlgTitle,
   editFormColumns,
   editFormData,
   editFormRules,
-  handleDlgOpen,
+  handleAdd,
   handlePaginationChange,
   handleSave,
   handleSearch,
@@ -42,13 +43,13 @@ import {
       @paginationChange="handlePaginationChange"
     >
       <template #title>
-        <el-button type="primary" @click="handleDlgOpen">新增接口</el-button>
+        <el-button type="primary" @click="handleAdd">新增接口</el-button>
       </template>
     </PlusTable>
     <PlusDialogForm
       v-model:visible="dlgShow"
       v-model="editFormData"
-      label-width="200px"
+      :dialog="{ title: dlgTitle }"
       :form="{
         columns: editFormColumns,
         rules: editFormRules,