5.0

2025-08-11 21:57:56 +08:00 · 2024-10-22 14:13:12 +08:00
parent 89304e8004
commit 483e3969be
18 changed files with 204 additions and 52 deletions
--- a/sop-admin/sop-admin-frontend/README.md
+++ b/sop-admin/sop-admin-frontend/README.md
@@ -1,5 +1,7 @@
 # SOP Admin 前端实现

+> 采用 ECMAScript 模块（ESM）规范来编写和组织代码，使用了最新的 Vue3、Vite、Element-Plus、TypeScript、Pinia、Tailwindcss 等主流技术
+
 ## 参考文档

 - 模板:https://pure-admin.github.io/pure-admin-doc/
--- a/sop-admin/sop-admin-frontend/src/components/ApiSelect/index.ts
+++ b/sop-admin/sop-admin-frontend/src/components/ApiSelect/index.ts
@@ -0,0 +1,84 @@
+import { ref } from "vue";
+import { type PlusColumn } from "plus-pro-components";
+import { withInstall } from "@pureadmin/utils";
+import apiSelect from "./index.vue";
+import { StatusEnum } from "@/model/enums";
+
+export const dlgApiSelectShow = ref(false);
+export const dlgWidth = ref(1100);
+
+// ========= table =========
+
+// 表格字段定义
+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 handleConfirm = () => {
+  console.log(1);
+};
+
+const ApiSelect = withInstall(apiSelect);
+
+export { ApiSelect };
--- a/sop-admin/sop-admin-frontend/src/components/ApiSelect/index.vue
+++ b/sop-admin/sop-admin-frontend/src/components/ApiSelect/index.vue
@@ -0,0 +1,53 @@
+<script setup lang="ts">
+import {
+  handleConfirm,
+  dlgApiSelectShow,
+  tableColumns,
+  dlgWidth
+} from "@/components/ApiSelect/index";
+import {
+  handlePaginationChange,
+  handleSearch,
+  pageInfo,
+  searchFormColumns,
+  searchFormData,
+  total,
+  tableData
+} from "@/views/serve/api/index";
+</script>
+
+<template>
+  <PlusDialog
+    v-model="dlgApiSelectShow"
+    header="选择接口"
+    :width="dlgWidth"
+    cancel-text="取消"
+    confirm-text="确定"
+    @confirm="handleConfirm"
+  >
+    <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"
+        :pagination="{
+          total,
+          modelValue: pageInfo,
+          pageSizeList: [10, 20, 50, 100],
+          align: 'right'
+        }"
+        adaptive
+        @paginationChange="handlePaginationChange"
+      />
+    </el-card>
+  </PlusDialog>
+</template>
--- a/sop-admin/sop-admin-frontend/src/utils/http/index.ts
+++ b/sop-admin/sop-admin-frontend/src/utils/http/index.ts
@@ -52,13 +52,6 @@ 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`过期后，暂存待执行的请求 */
@@ -189,8 +182,13 @@ class PureHttp {
    return new Promise((resolve, reject) => {
      PureHttp.axiosInstance
        .request(config)
-        .then((response: undefined) => {
-          resolve(response);
+        .then((response: any) => {
+          if (response.code && response.code !== "0") {
+            const msg = response.msg || "后台出错,请查看日志";
+            ElMessage.error(msg);
+          } else {
+            resolve(response);
+          }
        })
        .catch(error => {
          reject(error);
--- a/sop-admin/sop-admin-frontend/src/views/isv/list/index.ts
+++ b/sop-admin/sop-admin-frontend/src/views/isv/list/index.ts
@@ -172,10 +172,7 @@ actionButtons.value = [
            : StatusEnum.ENABLE
      };
      api.updateStatus(data).then(() => {
-        ElMessage({
-          message: "修改成功",
-          type: "success"
-        });
+        ElMessage.success("修改成功");
        dlgShow.value = false;
        search();
      });
@@ -253,10 +250,7 @@ export const handleSave = () => {
  const postData = editFormData.value;
  const pms = isAdd.value ? api.add(postData) : api.update(postData);
  pms.then(() => {
-    ElMessage({
-      message: "保存成功",
-      type: "success"
-    });
+    ElMessage.success("保存成功");
    dlgShow.value = false;
    search();
  });
--- a/sop-admin/sop-admin-frontend/src/views/isv/list/isvGroup.ts
+++ b/sop-admin/sop-admin-frontend/src/views/isv/list/isvGroup.ts
@@ -61,10 +61,7 @@ export const handleUpdateGroup = () => {
  const data = settingGroupFormData.value;

  api.updateGroup(data.isvId, data.groupIds).then(() => {
-    ElMessage({
-      message: "保存成功",
-      type: "success"
-    });
+    ElMessage.success("保存成功");
    dlgGroupSetting.value = false;
    search();
  });
--- a/sop-admin/sop-admin-frontend/src/views/isv/list/isvKeys.ts
+++ b/sop-admin/sop-admin-frontend/src/views/isv/list/isvKeys.ts
@@ -149,10 +149,7 @@ export const resetPlatformKeys = () => {

 export const handleUpdateKeys = () => {
  api.updateKeys(settingKeysFormData.value).then(() => {
-    ElMessage({
-      message: "保存成功",
-      type: "success"
-    });
+    ElMessage.success("保存成功");
    dlgKeysSetting.value = false;
    search();
  });
--- a/sop-admin/sop-admin-frontend/src/views/isv/perm/permGroup.ts
+++ b/sop-admin/sop-admin-frontend/src/views/isv/perm/permGroup.ts
@@ -1,4 +1,4 @@
-import { computed, ref } from "vue";
+import { ref } from "vue";
 import {
  type ButtonsCallBackParams,
  type PageInfo,
@@ -7,6 +7,8 @@ import {
 } 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";

 const isAdd = ref(false);

@@ -58,6 +60,17 @@ export const tableColumns: PlusColumn[] = [
 ];
 // 表格按钮定义
 actionButtons.value = [
+  {
+    text: "接口授权",
+    code: "edit",
+    props: {
+      type: "warning"
+    },
+    onClick() {
+      dlgApiSelectShow.value = true;
+      searchApi();
+    }
+  },
  {
    // 修改
    text: "修改",
@@ -65,7 +78,6 @@ actionButtons.value = [
    props: {
      type: "primary"
    },
-    show: computed(() => true),
    onClick(params: ButtonsCallBackParams) {
      isAdd.value = false;
      editFormData.value = Object.assign({}, params.row);
@@ -109,7 +121,7 @@ const editFormDataGen = () => {
 };
 export const editFormData = ref<any>(editFormDataGen());
 export const editFormRules = {
-  groupName: [{ required: true, message: "请输入分组描述" }]
+  groupName: [{ required: true, message: "请输入分组名称" }]
 };

 // 表单内容
@@ -136,10 +148,7 @@ export const handleSave = () => {
  const postData = editFormData.value;
  const pms = isAdd.value ? api.add(postData) : api.update(postData);
  pms.then(() => {
-    ElMessage({
-      message: "保存成功",
-      type: "success"
-    });
+    ElMessage.success("保存成功");
    dlgShow.value = false;
    search();
  });
--- a/sop-admin/sop-admin-frontend/src/views/isv/perm/permGroup.vue
+++ b/sop-admin/sop-admin-frontend/src/views/isv/perm/permGroup.vue
@@ -17,6 +17,7 @@ import {
  tableData,
  total
 } from "./permGroup";
+import { ApiSelect } from "@/components/ApiSelect/index";
 </script>
 <template>
  <el-card shadow="never">
@@ -33,7 +34,7 @@ import {
    <PlusTable
      :columns="tableColumns"
      :table-data="tableData"
-      :action-bar="{ buttons: actionButtons, width: 120 }"
+      :action-bar="{ buttons: actionButtons, width: 200 }"
      :pagination="{
        total,
        modelValue: pageInfo,
@@ -60,5 +61,6 @@ import {
      :hasErrorTip="false"
      @confirm="handleSave"
    />
+    <ApiSelect />
  </el-card>
 </template>
--- a/sop-admin/sop-admin-frontend/src/views/serve/api/index.ts
+++ b/sop-admin/sop-admin-frontend/src/views/serve/api/index.ts
@@ -62,7 +62,7 @@ pageInfo.value.pageSize = 10;
 // 表格字段定义
 export const tableColumns: PlusColumn[] = [
  {
-    label: "应用名称",
+    label: "所属应用",
    prop: "application",
    tableColumnProps: {
      showOverflowTooltip: true
@@ -212,10 +212,7 @@ actionButtons.value = [
            : StatusEnum.ENABLE
      };
      api.updateStatus(data).then(() => {
-        ElMessage({
-          message: "修改成功",
-          type: "success"
-        });
+        ElMessage.success("修改成功");
        dlgShow.value = false;
        search();
      });
@@ -256,7 +253,7 @@ export const isCustomRegSource = computed(() => {
 // 表单内容
 export const editFormColumns: PlusColumn[] = [
  {
-    label: "应用名称",
+    label: "所属应用",
    prop: "application",
    valueType: "text"
  },
@@ -353,10 +350,7 @@ export const handleSave = () => {
  const postData = editFormData.value;
  const pms = isAdd.value ? api.add(postData) : api.update(postData);
  pms.then(() => {
-    ElMessage({
-      message: "保存成功",
-      type: "success"
-    });
+    ElMessage.success("保存成功");
    dlgShow.value = false;
    search();
  });
@@ -375,7 +369,7 @@ export const handlePaginationChange = (_pageInfo: PageInfo): void => {
 };

 // 查询
-const search = async () => {
+export const search = async () => {
  try {
    const { data } = await doSearch();
    tableData.value = data.list;