diff --git a/src/components/modfield/ModField.tsx b/src/components/modfield/ModField.tsx index 4b62aeb..e91e059 100644 --- a/src/components/modfield/ModField.tsx +++ b/src/components/modfield/ModField.tsx @@ -82,7 +82,10 @@ export default function ModField(props: PropsType) { align: 'center', width: 150, }, - { + ]; + + if(props.isEdit) { + columns.push({ title: '操作', dataIndex: 'option', align: 'center', @@ -100,8 +103,8 @@ export default function ModField(props: PropsType) { return '' } } - }, - ]; + }) + } return ( <> diff --git a/src/layout/body/Body.tsx b/src/layout/body/Body.tsx index d454e45..5ed7722 100644 --- a/src/layout/body/Body.tsx +++ b/src/layout/body/Body.tsx @@ -15,6 +15,8 @@ import ProjConfigLoginpage from "../../route/proj/edit/ProjConfigLoginpage.tsx"; import ProjConfigModList from "../../route/proj/edit/ProjConfigModList.tsx"; import ProjConfigModSave from "../../route/proj/edit/ProjConfigModSave.tsx"; import ProjConfigModEdit from "../../route/proj/edit/ProjConfigModEdit.tsx"; +import ProjConfigModShow from "../../route/proj/edit/ProjConfigModShow.tsx"; +import ProjConfigMenuList from "../../route/proj/edit/ProjConfigMenuList.tsx"; const router = createBrowserRouter([ { @@ -73,6 +75,14 @@ const router = createBrowserRouter([ path: '/proj-edit/config-mod-edit/:projId/:projModId', element: }, + { + path: '/proj-edit/config-mod-show/:projId/:projModId', + element: + }, + { + path: '/proj-edit/config-menu-list/:projId', + element: + }, { path: '/agent-select/:projId', element: diff --git a/src/route/proj/ProjEdit.tsx b/src/route/proj/ProjEdit.tsx index 8f1217e..02e3347 100644 --- a/src/route/proj/ProjEdit.tsx +++ b/src/route/proj/ProjEdit.tsx @@ -11,6 +11,7 @@ import CardProjJump from "../../components/card/CardProjJump.tsx"; import {useEffect, useState} from "react"; import {get} from "../../util/AjaxUtils.ts"; import {EditStepEnum, IProjEdit} from "../../interfaces/card/ICardProj.ts"; +import {MAX_MOD_SIZE} from "./edit/ProjConfigModList.tsx"; export default function ProjEdit() { @@ -113,7 +114,7 @@ export default function ProjEdit() { desc: '请对系统菜单进行设置', step: 2, btnName: '设置', - status: data.projModCount > 0 ? EditStepEnum.EDITED : EditStepEnum.UN_EDIT, + status: data.projModCount > MAX_MOD_SIZE ? EditStepEnum.EDITED : EditStepEnum.UN_EDIT, handleEdit() { nav(`/proj-edit/config-mod-list/${pathParams.projId}`) } @@ -123,12 +124,14 @@ export default function ProjEdit() { desc: '调整菜单顺序', step: 3, btnName: '设置', - status: data.projModCount > 0 ? EditStepEnum.EDITED : EditStepEnum.UN_EDIT, + status: data.projModCount > MAX_MOD_SIZE ? EditStepEnum.EDITED : EditStepEnum.UN_EDIT, handleEdit() { + nav(`/proj-edit/config-menu-list/${pathParams.projId}`) } } ) setConfigArray(configArray); + setIsConfigEdited(data.loginpage.loginpageId && MAX_MOD_SIZE); } useEffect(() => { diff --git a/src/route/proj/edit/ProjConfigMenuList.tsx b/src/route/proj/edit/ProjConfigMenuList.tsx new file mode 100644 index 0000000..622cdb3 --- /dev/null +++ b/src/route/proj/edit/ProjConfigMenuList.tsx @@ -0,0 +1,95 @@ +import './proj-config-list-mod.css'; +import { + Alert, + Breadcrumb, Input, + message, + Table, TableProps, +} from "antd"; +import {Link, useNavigate, useParams} from "react-router-dom"; +import {useEffect, useState} from "react"; +import {get, put} from "../../../util/AjaxUtils.ts"; + +export const MAX_MOD_SIZE = 2; + +interface DataType { + projModId: string; + projId: string; + modContext: string; + modName: string; + modUrl: string; + modDesc: string; + modIcon: string; +} + +export default function ProjConfigMenuList() { + const nav = useNavigate(); + const pathParams = useParams(); + const [messageApi, contextHolder] = message.useMessage(); + const [dataArray, setDataArray] = useState(); + + const height = window.innerHeight - 165; + + const renderData = () => { + get({ + messageApi, + url: '/api/proj-menu/list', + config: { + params: { + projId: pathParams.projId + } + }, + onSuccess({data}) { + setDataArray([...data]); + } + }) + } + + const columns: TableProps['columns'] = [ + { + title: '菜单标题', + dataIndex: 'modName', + align: 'center', + width: 180 + }, + { + title: '菜单连接', + dataIndex: 'modDesc', + align: 'center', + }, + { + title: '顺序', + dataIndex: 'modIcon', + align: 'center', + width: 80, + render: (text, record) => { + return + } + }, + ]; + + useEffect(() => { + renderData(); + }, []) + + return ( + <> + {contextHolder} + 首页}, + {title: 创建项目}, + {title: 编辑项目}, + {title: '系统菜单顺序'}, + ]} + /> +
+ +
+ + + + + ) + +} \ No newline at end of file diff --git a/src/route/proj/edit/ProjConfigModList.tsx b/src/route/proj/edit/ProjConfigModList.tsx index 9e0b22b..4c55f3b 100644 --- a/src/route/proj/edit/ProjConfigModList.tsx +++ b/src/route/proj/edit/ProjConfigModList.tsx @@ -7,8 +7,10 @@ import { } from "antd"; import {Link, useNavigate, useParams} from "react-router-dom"; import {useEffect, useState} from "react"; -import {EditOutlined, PlusOutlined, DeleteOutlined} from "@ant-design/icons"; -import {get} from "../../../util/AjaxUtils.ts"; +import {EditOutlined, PlusOutlined, DeleteOutlined, SearchOutlined} from "@ant-design/icons"; +import {del, get} from "../../../util/AjaxUtils.ts"; + +export const MAX_MOD_SIZE = 2; interface DataType { projModId: string; @@ -25,6 +27,8 @@ export default function ProjConfigModList() { const pathParams = useParams(); const [messageApi, contextHolder] = message.useMessage(); const [dataArray, setDataArray] = useState(); + const [modSize, setModSize] = useState(0); + const height = window.innerHeight - 165; const renderData = () => { @@ -37,7 +41,8 @@ export default function ProjConfigModList() { } }, onSuccess({data}) { - setDataArray([...data]) + setDataArray([...data]); + setModSize(data.length); } }) } @@ -79,18 +84,39 @@ export default function ProjConfigModList() { dataIndex: 'option', align: 'center', width: 100, - render: (_text, record, index) => { + render: (_text, record) => { return ( <> - + { + modSize < MAX_MOD_SIZE ? ( + + ) : ( + + ) + } + @@ -118,9 +144,14 @@ export default function ProjConfigModList() {
- + { + modSize < MAX_MOD_SIZE ? ( + + ) : <> + } +
diff --git a/src/route/proj/edit/ProjConfigModShow.tsx b/src/route/proj/edit/ProjConfigModShow.tsx new file mode 100644 index 0000000..606db56 --- /dev/null +++ b/src/route/proj/edit/ProjConfigModShow.tsx @@ -0,0 +1,135 @@ +import './proj-config-list-mod.css'; +import { + Alert, + Breadcrumb, Button, Col, Flex, Form, Input, + message, Row, +} from "antd"; +import {Link, useNavigate, useParams} from "react-router-dom"; +import {useEffect, useState} from "react"; +import ModField, {IModField} from "../../../components/modfield/ModField.tsx"; +import {get} from "../../../util/AjaxUtils.ts"; + +type FormFieldType = { + projId: string; + modName: string; + modDesc: string; + modIcon: string; + fields: IModField[]; +} + +export default function ProjConfigModShow() { + const nav = useNavigate(); + const pathParams = useParams(); + const [messageApi, contextHolder] = message.useMessage(); + const [form] = Form.useForm(); + const [selectedModIcon, setSelectedModIcon] = useState('fa fa-list'); + const [fields, setFields] = useState([]); + + const height = window.innerHeight - 180; + + useEffect(() => { + get({ + messageApi, + url: `api/proj-mod/get/${pathParams.projModId}`, + onSuccess({data}) { + form.setFieldsValue({ + projId: data.projId, + modName: data.modName, + modDesc: data.modDesc, + modIcon: data.modIcon, + fields: data.fields, + }); + setSelectedModIcon(data.modIcon); + setFields(data.fields) + } + }) + }, []) + + return ( + <> + {contextHolder} + 首页}, + {title: 创建项目}, + {title: 编辑项目}, + {title: 系统菜单管理}, + {title: '查看菜单'}, + ]} + /> +
+ +
+
+ +
+ + label="菜单名称" + name="modName" + extra="此内容会作为菜单名生成菜单,最多8个字" + rules={[{required: true, message: '请输入菜单名称'}]} + > + + + + label="菜单说明" + name="modDesc" + extra="此内容会作为功能描述生成到操作手册中,请详细描述,最多600字" + rules={[{required: true, message: '请输入菜单说明'}]} + > + + + + label="菜单图标" + name="modIcon" + extra="菜单图标会显示在菜单栏中" + rules={[{required: true, message: '请输入菜单图标'}]} + > + + + + + + name="fields" + rules={[{required: true, message: '请添加菜单属性'}]} + > + { + if (!dataArray) { + return; + } + form.setFieldValue('fields', dataArray); + }}/> + + + + + +
+ + + +
+
+ + + + + + ) + +} \ No newline at end of file