From 65174bca5f5c7a3d647fef2fa6dae8b77a5012f1 Mon Sep 17 00:00:00 2001
From: jessica <3344538341@qq.com>
Date: Wed, 22 May 2024 10:30:41 +0800
Subject: [PATCH 1/2] =?UTF-8?q?feat:=E6=96=B0=E5=A2=9E=E6=8E=A5=E5=8F=A3?=
=?UTF-8?q?=E6=A8=A1=E5=9D=97?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
src/views/system/api/index.tsx | 283 ++++++++++++++++++++++++++++++++-
1 file changed, 279 insertions(+), 4 deletions(-)
diff --git a/src/views/system/api/index.tsx b/src/views/system/api/index.tsx
index 6aa2653..eaf8a61 100644
--- a/src/views/system/api/index.tsx
+++ b/src/views/system/api/index.tsx
@@ -1,7 +1,282 @@
+import {
+ addApi,
+ batchDeleteApi,
+ deleteApi,
+ getApiPageList,
+ updateApi,
+} from "@/api/system/api";
+import { AppDispatch, RootState } from "@/store";
+import { getPermissionBtns } from "@/store/modules/user";
+import { IApi, ISearchApi, IApiPermissionButton } from "@/types";
+import { validatePermission } from "@/utils";
+import {
+ Crud,
+ IActionbar,
+ IColumn,
+ IDialogTitle,
+ IFormItem,
+ IPage,
+ IToolbar,
+} from "@ainiteam/quick-react-ui";
+import { ExclamationCircleFilled } from "@ant-design/icons";
+import { Modal, message } from "antd";
+import { useEffect, useState } from "react";
+import { useDispatch, useSelector } from "react-redux";
+
const Api: React.FC = () => {
- return (
- Api
- );
+ /**
+ * 属性
+ */
+ const { confirm } = Modal;
+ const [dataList, setDataList] = useState();
+ const [loading, setLoading] = useState(false);
+ const dispatch: AppDispatch = useDispatch();
+ const { activeTab } = useSelector((state: RootState) => state.tab);
+ const { permissionBtn }: { permissionBtn: IApiPermissionButton } =
+ useSelector((state: RootState) => state.user);
+
+ /**
+ * 分页
+ */
+ const [page] = useState({
+ current: 1,
+ size: 10,
+ sizes: [10, 20, 30, 40, 50],
+ total: 0,
+ });
+ /**
+ * 搜索
+ */
+ const searchForm: ISearchApi = {
+ keyword: "",
+ };
+ const searchFormItems: IFormItem[] = [
+ {
+ label: "",
+ vModel: "keyword",
+ placeholder: "接口名称|菜单名称",
+ },
+ ];
+ /**
+ * 工具栏
+ */
+ const handleBatchDelete = (data: any, done: any) => {
+ const { ids } = data;
+ confirm({
+ title: "警告",
+ icon: ,
+ content: `你真的删除选择的接口吗？`,
+ onOk() {
+ batchDeleteApi(ids).then(() => {
+ message.success("接口删除成功");
+ done();
+ });
+ },
+ });
+ };
+ const handlePrint = () => {
+ window.print();
+ };
+ const tableToolbar: IToolbar = {
+ hiddenBatchDeleteButton: true,
+ hiddenImportButton: true,
+ hiddenExportButton: true,
+ hiddenPrintButton: true,
+ hiddenAddButton: !validatePermission(permissionBtn?.add),
+ };
+ /**
+ * 操作栏
+ */
+ const handleDelete = (item: IApi, done: any) => {
+ confirm({
+ title: "警告",
+ icon: ,
+ content: `你真的删除【${item.apiName}】的接口吗？`,
+ onOk() {
+ if (!item.id) {
+ return;
+ }
+ deleteApi(item.id).then(() => {
+ message.success("接口删除成功");
+ done();
+ });
+ },
+ });
+ };
+ const tableActionbar: IActionbar = {
+ width: 150,
+ hiddenEditButton: !validatePermission(permissionBtn?.edit),
+ hiddenDeleteButton: !validatePermission(permissionBtn?.delete),
+ hiddenDetailButton: !validatePermission(permissionBtn?.detail),
+ };
+ /**
+ * 表格
+ */
+ const tableColumns: IColumn[] = [
+ {
+ width: "50",
+ type: "selection",
+ },
+ // {
+ // width: "60",
+ // type: "index",
+ // label: "序号",
+ // },
+ {
+ label: "接口编号",
+ prop: "apiId",
+ width: "200",
+ },
+ {
+ label: "接口名称",
+ prop: "apiName",
+ width: "200",
+ },
+ {
+ label: "接口地址",
+ prop: "apiPath",
+ width: "300",
+ },
+ {
+ label: "创建时间",
+ prop: "createTime",
+ width: "200",
+ },
+ {
+ label: "备注",
+ prop: "remark",
+ },
+ ];
+
+ /**
+ * 加载数据
+ */
+ const loadData = (parmas: object) => {
+ setLoading(true);
+ getApiPageList(parmas)
+ .then((res) => {
+ setLoading(false);
+ const { data: apiList, total } = res;
+ console.log("apiList", apiList);
+ if (apiList) {
+ setDataList([...apiList]);
+ }
+ page.total = total;
+ })
+ .catch(() => {
+ setLoading(false);
+ });
+ };
+ /**
+ * 表单
+ */
+ const dialogTitle: IDialogTitle = {
+ add: "添加接口",
+ edit: "编辑接口",
+ detail: "接口详情",
+ };
+ const formModel: IApi = {
+ id: undefined,
+ apiId: "",
+ apiName: "",
+ apiPath: "",
+ remark: "",
+ };
+ const formItems: IFormItem[] = [
+ {
+ label: "接口编号",
+ labelWidth: "80px",
+ vModel: "apiId",
+ editReadonly: true,
+ placeholder: "请输入接口编号",
+ prop: "apiId",
+ rules: [
+ {
+ required: true,
+ message: "请输入接口编号",
+ trigger: "blur",
+ },
+ ],
+ },
+ {
+ label: "接口名称",
+ labelWidth: "80px",
+ vModel: "apiName",
+ placeholder: "请输入接口名称",
+ prop: "apiName",
+ rules: [
+ {
+ required: true,
+ message: "请输入接口名称",
+ trigger: "blur",
+ },
+ ],
+ },
+ {
+ label: "接口地址",
+ labelWidth: "80px",
+ vModel: "apiPath",
+ placeholder: "请输入接口地址",
+ prop: "apiPath",
+ rules: [
+ {
+ required: true,
+ message: "请输入接口地址",
+ trigger: "blur",
+ },
+ ],
+ },
+ {
+ label: "备注",
+ labelWidth: "80px",
+ vModel: "remark",
+ placeholder: "备注",
+ type: "textarea",
+ prop: "remark",
+ },
+ ];
+ const handleFormSubmit = (form: IApi, done: any) => {
+ const row = { ...form };
+ if (row.id) {
+ console.log("updateApi", row);
+ updateApi(row).then(() => {
+ message.success("接口修改成功");
+ done();
+ });
+ } else {
+ row.id = undefined;
+ console.log("addApi", row);
+ addApi(row).then(() => {
+ message.success("接口创建成功");
+ done();
+ });
+ }
+ };
+ useEffect(() => {
+ dispatch(getPermissionBtns(activeTab));
+ }, []);
+ return (
+
+
+
+ );
};
-export default Api;
\ No newline at end of file
+export default Api;
--
Gitee
From d33d0ec6f210e55a47c2dfb77b83e63626741040 Mon Sep 17 00:00:00 2001
From: jessica <3344538341@qq.com>
Date: Wed, 22 May 2024 11:02:23 +0800
Subject: [PATCH 2/2] =?UTF-8?q?fix:=E6=9B=B4=E6=94=B9=E7=94=A8=E6=88=B7?=
=?UTF-8?q?=E3=80=81=E8=8F=9C=E5=8D=95=E6=A8=A1=E5=9D=97=E5=88=86=E9=A1=B5?=
=?UTF-8?q?bug?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
src/views/system/menu/index.tsx | 30 +++++++++++++++---------------
src/views/system/user/index.tsx | 8 ++++----
2 files changed, 19 insertions(+), 19 deletions(-)
diff --git a/src/views/system/menu/index.tsx b/src/views/system/menu/index.tsx
index e0fe2e9..641a862 100644
--- a/src/views/system/menu/index.tsx
+++ b/src/views/system/menu/index.tsx
@@ -49,12 +49,12 @@ const Menu: React.FC = () => {
/**
* 分页
*/
- const page: IPage = {
+ const [page] = useState({
current: 1,
size: 10,
sizes: [10, 20, 30, 40, 50],
total: 0,
- };
+ });
/**
* 搜索
@@ -350,14 +350,14 @@ const Menu: React.FC = () => {
label: "菜单类型",
prop: "menuType",
width: "200",
- render: (row: IMenu) => {
- if (row.menuType === 0) {
+ render: (value: number) => {
+ if (value === 0) {
return "目录";
}
- if (row.menuType === 1) {
+ if (value === 1) {
return "菜单";
}
- if (row.menuType === 2) {
+ if (value === 2) {
return "按钮";
}
return "";
@@ -377,32 +377,32 @@ const Menu: React.FC = () => {
label: "缓存",
prop: "cache",
width: "200",
- render: (row: IMenu) => {
- return row.cache ? "缓存" : "不缓存";
+ render: (value: boolean) => {
+ return value ? "缓存" : "不缓存";
},
},
{
label: "显示",
prop: "status",
width: "200",
- render: (row: IMenu) => {
- return row.status ? "显示" : "不显示";
+ render: (value: boolean) => {
+ return value ? "显示" : "不显示";
},
},
{
label: "启用",
prop: "enabled",
width: "200",
- render: (row: IMenu) => {
- return !row.enabled ? "启用" : "禁用";
+ render: (value: boolean) => {
+ return !value ? "启用" : "禁用";
},
},
{
label: "是否外链",
prop: "link",
width: "200",
- render: (row: IMenu) => {
- return row.link === 1 ? "外链" : "非外链";
+ render: (value: number) => {
+ return value === 1 ? "外链" : "非外链";
},
},
];
@@ -453,7 +453,7 @@ const Menu: React.FC = () => {
pagebar={page}
loading={loading}
displayNumber={false}
- formInline={true}
+ // formLayout="inline"
onLoad={loadData}
onFormSubmit={handleFormSubmit}
onDelete={handleDelete}
diff --git a/src/views/system/user/index.tsx b/src/views/system/user/index.tsx
index 7422406..cd37364 100644
--- a/src/views/system/user/index.tsx
+++ b/src/views/system/user/index.tsx
@@ -49,12 +49,12 @@ const User: React.FC = () => {
/**
* 分页
*/
- const page: IPage = {
+ const [page] = useState({
current: 1,
size: 10,
sizes: [10, 20, 30, 40, 50],
total: 0,
- };
+ });
/**
* 搜索
@@ -456,8 +456,8 @@ const User: React.FC = () => {
width: "60",
label: "启用",
prop: "enabled",
- render: (row: IUser) => {
- return row.enabled === 1 ? "启用" : "禁用";
+ render: (value: number) => {
+ return value === 1 ? "启用" : "禁用";
},
},
{
--
Gitee