7x31/SOP
1
0
Fork 0
mirror of https://gitee.com/durcframework/SOP.git synced 2025-08-11 21:57:56 +08:00
Code Issues Packages Projects Releases Wiki Activity

5.0

Browse Source
This commit is contained in:
六如
2024-10-23 10:39:08 +08:00
parent d06a13df4a
commit 054c86a450
21 changed files with 646 additions and 130 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
sop-admin/sop-admin-frontend/README.md
View File

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

38
sop-admin/sop-admin-frontend/src/api/permGroupPermission.ts Normal file
View File

@@ -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 });
}
};

8
sop-admin/sop-admin-frontend/src/api/serveApi.ts
View File

@@ -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 表单内容

99
sop-admin/sop-admin-frontend/src/components/ApiSelect/index.ts
View File

@@ -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 };

21
sop-admin/sop-admin-frontend/src/components/ApiSelect/index.vue
View File

@@ -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>

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

@@ -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);
};
// 页面加载

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

@@ -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>

140
sop-admin/sop-admin-frontend/src/views/isv/perm/permGroupApi.ts Normal file
View File

@@ -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 };

27
sop-admin/sop-admin-frontend/src/views/isv/perm/permGroupApi.vue Normal file
View File

@@ -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>