Tenlion/system-copyright-react
5
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

lyp

Browse Source
This commit is contained in:
xixi 2024-05-22 16:18:38 +08:00
parent d5d4e1bae5
commit 8a9c5c7fba
4 changed files with 144 additions and 126 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
src/components/list/ListProj.tsx
View File

@ -44,7 +44,7 @@ export default function ListProj() {
config: { config: {
params: { params: {
page: currentPage, page: currentPage,
rows: 20, rows: 10,
keywords: keywords, keywords: keywords,
projCategoryId: indexListContext.category, projCategoryId: indexListContext.category,
status: indexListContext.status ? indexListContext.status : '' status: indexListContext.status ? indexListContext.status : ''
@ -128,7 +128,7 @@ export default function ListProj() {
{renderList()} {renderList()}
</div> </div>
<div className="page" > <div className="page" >
<Pagination defaultCurrent={page} total={total} defaultPageSize={20} onChange={(page) => { <Pagination defaultCurrent={page} total={total} defaultPageSize={10} onChange={(page) => {
reqData(page); reqData(page);
// setPage(page); // setPage(page);
}} /> }} />

8
src/route/index/Index.tsx
View File

@ -204,8 +204,8 @@ export default function Index() {
} else if (location.pathname.includes('/proj-create')) { } else if (location.pathname.includes('/proj-create')) {
setNow('创建项目') setNow('创建项目')
setPathArray([{ title: <Link to={'/home'}>首页</Link> }, { title: '创建项目' }]) setPathArray([{ title: <Link to={'/home'}>首页</Link> }, { title: '创建项目' }])
// /config-mod-list /config-menu-list // /config-mod-list /config-menu-list /config-mod-show
} else if (location.pathname.includes('/proj-edit')&& !location.pathname.includes('/config-mod-edit') && !location.pathname.includes('/step') && !location.pathname.includes('/config-loginpage')&& !location.pathname.includes('/config-mod-save')&& !location.pathname.includes('/config-mod-list')&& !location.pathname.includes('/config-menu-list')) { } else if (location.pathname.includes('/proj-edit')&& !location.pathname.includes('/config-mod-show')&& !location.pathname.includes('/config-mod-edit') && !location.pathname.includes('/step') && !location.pathname.includes('/config-loginpage')&& !location.pathname.includes('/config-mod-save')&& !location.pathname.includes('/config-mod-list')&& !location.pathname.includes('/config-menu-list')) {
setNow('编辑项目') setNow('编辑项目')
// setEditname(location.pathname) // setEditname(location.pathname)
setPathArray([{ title: <Link to={'/home'}>首页</Link> }, { title: <Link to={'/proj-create'}>创建项目</Link> }, { title: '编辑项目' }]) setPathArray([{ title: <Link to={'/home'}>首页</Link> }, { title: <Link to={'/proj-create'}>创建项目</Link> }, { title: '编辑项目' }])
@ -251,6 +251,10 @@ export default function Index() {
}else if (location.pathname.includes('/proj-edit/config-mod-edit')) { }else if (location.pathname.includes('/proj-edit/config-mod-edit')) {
setNow('编辑菜单') setNow('编辑菜单')
setPathArray([{ title: <Link to={'/home'}>首页</Link> }, { title: <Link to={'/proj-create'}>创建项目</Link> }, { title: <a onClick={() => { nav(-2) }}>编辑项目</a> },{ title: <a onClick={() => { nav(-1) }}>系统菜单管理</a> }, { title: '编辑菜单' }]) setPathArray([{ title: <Link to={'/home'}>首页</Link> }, { title: <Link to={'/proj-create'}>创建项目</Link> }, { title: <a onClick={() => { nav(-2) }}>编辑项目</a> },{ title: <a onClick={() => { nav(-1) }}>系统菜单管理</a> }, { title: '编辑菜单' }])
// /config-mod-edit /config-mod-show
}else if (location.pathname.includes('/proj-edit/config-mod-show')) {
setNow('查看菜单')
setPathArray([{ title: <Link to={'/home'}>首页</Link> }, { title: <Link to={'/proj-create'}>创建项目</Link> }, { title: <a onClick={() => { nav(-2) }}>编辑项目</a> },{ title: <a onClick={() => { nav(-1) }}>系统菜单管理</a> }, { title: '查看菜单' }])
// /config-mod-edit // /config-mod-edit
} }
}, [location.pathname]) }, [location.pathname])

97
src/route/proj/edit/ProjConfigModList.tsx
View File

@ -1,14 +1,14 @@
import './proj-config-list-mod.css'; import './proj-config-list-mod.css';
import { import {
Alert, Alert,
Breadcrumb, Button, Button,
message, message,
Table, TableProps, Table, TableProps,
} from "antd"; } from "antd";
import {Link, useNavigate, useParams} from "react-router-dom"; import { useNavigate, useParams } from "react-router-dom";
import {useEffect, useState} from "react"; import { useEffect, useState } from "react";
import {EditOutlined, PlusOutlined, DeleteOutlined, SearchOutlined} from "@ant-design/icons"; import { EditOutlined, PlusOutlined, DeleteOutlined } from "@ant-design/icons";
import {del, get} from "../../../util/AjaxUtils.ts"; import { del, get } from "../../../util/AjaxUtils.ts";
export const MAX_MOD_SIZE = 15; export const MAX_MOD_SIZE = 15;
export const MIN_MOD_SIZE = 10 export const MIN_MOD_SIZE = 10
@ -49,7 +49,7 @@ export default function ProjConfigModList(props: PropType) {
projId: pathParams.projId projId: pathParams.projId
} }
}, },
onSuccess({data}) { onSuccess({ data }) {
setDataArray([...data]); setDataArray([...data]);
setModSize(data.length); setModSize(data.length);
} }
@ -96,46 +96,57 @@ export default function ProjConfigModList(props: PropType) {
render: (_text, record) => { render: (_text, record) => {
return ( return (
<> <>
{ <Button type="primary" size="small"
style={{ marginRight: '5px' }}
onClick={() => {
if (props.isFree) {
nav(`/proj-edit/config-mod-fedit/${pathParams.projId}/${record.projModId}`)
} else {
nav(`/proj-edit/config-mod-edit/${pathParams.projId}/${record.projModId}`)
}
}}>
<EditOutlined />
</Button>
{/* {
modSize < maxSize ? ( modSize < maxSize ? (
<Button type="primary" size="small" <Button type="primary" size="small"
style={{marginRight: '5px'}} style={{ marginRight: '5px' }}
onClick={() => { onClick={() => {
if(props.isFree) { if (props.isFree) {
nav(`/proj-edit/config-mod-fedit/${pathParams.projId}/${record.projModId}`) nav(`/proj-edit/config-mod-fedit/${pathParams.projId}/${record.projModId}`)
} else { } else {
nav(`/proj-edit/config-mod-edit/${pathParams.projId}/${record.projModId}`) nav(`/proj-edit/config-mod-edit/${pathParams.projId}/${record.projModId}`)
} }
}}> }}>
<EditOutlined/> <EditOutlined />
</Button> </Button>
) : ( ) : (
<Button type="default" size="small" <Button type="default" size="small"
style={{marginRight: '5px'}} style={{ marginRight: '5px' }}
onClick={() => { onClick={() => {
if(props.isFree) { if (props.isFree) {
nav(`/proj-edit/config-mod-fshow/${pathParams.projId}/${record.projModId}`) nav(`/proj-edit/config-mod-fshow/${pathParams.projId}/${record.projModId}`)
} else { } else {
nav(`/proj-edit/config-mod-show/${pathParams.projId}/${record.projModId}`) nav(`/proj-edit/config-mod-show/${pathParams.projId}/${record.projModId}`)
} }
}}> }}>
<SearchOutlined/> <EditOutlined />
</Button> </Button>
) )
} } */}
<Button value="large" type="primary" size="small" danger <Button value="large" type="primary" size="small" danger
onClick={() => { onClick={() => {
del({ del({
messageApi, messageApi,
url: `/api/proj-mod/remove/proj-id/${pathParams.projId}/${record.projModId}`, url: `/api/proj-mod/remove/proj-id/${pathParams.projId}/${record.projModId}`,
onSuccess() { onSuccess() {
messageApi.success('删除成功'); messageApi.success('删除成功');
renderData(); renderData();
} }
}) })
}} }}
><DeleteOutlined/></Button> ><DeleteOutlined /></Button>
</> </>
) )
} }
@ -161,25 +172,25 @@ export default function ProjConfigModList(props: PropType) {
{title: '系统菜单管理'}, {title: '系统菜单管理'},
]} ]}
/> */} /> */}
<div className="mod-list-container" style={{height: `${height}px`, marginTop:'17px'}}> <div className="mod-list-container" style={{ height: `${height}px`, marginTop: '17px' }}>
<Alert message={`菜单指的是系统的功能，最少${minSize}个菜单，最多${maxSize}个菜单`} type="info"/> <Alert message={`菜单指的是系统的功能，最少${minSize}个菜单，最多${maxSize}个菜单`} type="info" />
<div className="mod-list"> <div className="mod-list">
<div className="table-btn-group"> <div className="table-btn-group">
{ {
modSize < maxSize ? ( modSize < maxSize ? (
<Button value="small" onClick={() => { <Button value="small" onClick={() => {
if(props.isFree) { if (props.isFree) {
nav(`/proj-edit/config-mod-fsave/${pathParams.projId}`) nav(`/proj-edit/config-mod-fsave/${pathParams.projId}`)
} else { } else {
nav(`/proj-edit/config-mod-save/${pathParams.projId}`) nav(`/proj-edit/config-mod-save/${pathParams.projId}`)
} }
}}><PlusOutlined/> 新增</Button> }}><PlusOutlined /> 新增</Button>
) : <></> ) : <></>
} }
</div> </div>
<Table columns={columns} dataSource={dataArray} pagination={{pageSize: 20}} <Table columns={columns} dataSource={dataArray} pagination={{ pageSize: 20 }}
scroll={{y: height - 210}} size="middle" bordered key="dataTable" rowKey="projModId"/> scroll={{ y: height - 210 }} size="middle" bordered key="dataTable" rowKey="projModId" />
</div> </div>
</div> </div>
</> </>

159
src/route/proj/edit/ProjConfigModShow.tsx
View File

@ -1,14 +1,14 @@
import './proj-config-list-mod.css'; import './proj-config-list-mod.css';
import { import {
Alert, Alert,
Breadcrumb, Button, Col, Flex, Form, Input, Button, Col, Flex, Form, Input,
message, Row, message, Row,
} from "antd"; } from "antd";
import {Link, useNavigate, useParams} from "react-router-dom"; import { useNavigate, useParams } from "react-router-dom";
import {useEffect, useState} from "react"; import { useEffect, useState } from "react";
import ModField, {IModField} from "../../../components/modfield/ModField.tsx"; import ModField, { IModField } from "../../../components/modfield/ModField.tsx";
import {get} from "../../../util/AjaxUtils.ts"; import { get } from "../../../util/AjaxUtils.ts";
import {MAX_MOD_SIZE, MAX_MOD_SIZE_FREE, MIN_MOD_SIZE, MIN_MOD_SIZE_FREE} from "./ProjConfigModList.tsx"; import { MAX_MOD_SIZE, MAX_MOD_SIZE_FREE, MIN_MOD_SIZE, MIN_MOD_SIZE_FREE } from "./ProjConfigModList.tsx";
type FormFieldType = { type FormFieldType = {
projId: string; projId: string;
@ -32,13 +32,13 @@ export default function ProjConfigModShow(props: PropsType) {
const minSize = props.isFree ? MIN_MOD_SIZE_FREE : MIN_MOD_SIZE; const minSize = props.isFree ? MIN_MOD_SIZE_FREE : MIN_MOD_SIZE;
const maxSize = props.isFree ? MAX_MOD_SIZE_FREE : MAX_MOD_SIZE; const maxSize = props.isFree ? MAX_MOD_SIZE_FREE : MAX_MOD_SIZE;
const height = window.innerHeight - 180; const height = window.innerHeight - 210;
useEffect(() => { useEffect(() => {
get<any>({ get<any>({
messageApi, messageApi,
url: `api/proj-mod/get/${pathParams.projModId}`, url: `api/proj-mod/get/${pathParams.projModId}`,
onSuccess({data}) { onSuccess({ data }) {
form.setFieldsValue({ form.setFieldsValue({
projId: data.projId, projId: data.projId,
modName: data.modName, modName: data.modName,
@ -55,7 +55,7 @@ export default function ProjConfigModShow(props: PropsType) {
return ( return (
<> <>
{contextHolder} {contextHolder}
<Breadcrumb {/* <Breadcrumb
items={[ items={[
{title: <Link to={'/'}>首页</Link>}, {title: <Link to={'/'}>首页</Link>},
{title: <Link to={'/proj-create'}>创建项目</Link>}, {title: <Link to={'/proj-create'}>创建项目</Link>},
@ -75,77 +75,80 @@ export default function ProjConfigModShow(props: PropsType) {
}, },
{title: '查看菜单'}, {title: '查看菜单'},
]} ]}
/> /> */}
<div className="mod-edit-container" style={{height: `${height}px`}}> <div className="mod-edit-container" style={{ height: `${height}px`, marginTop: '17px' }}>
<Alert message={`菜单指的是系统的功能，最少${minSize}个菜单，最多${maxSize}个菜单`} type="info"/> <div style={{ height: `${height}px`, overflow: 'auto' }}>
<div className="mod-content"> <Alert message={`菜单指的是系统的功能，最少${minSize}个菜单，最多${maxSize}个菜单`} type="info" />
<Form <div className="mod-content" >
name="basic" <Form
form={form} name="basic"
layout="vertical" form={form}
labelCol={{span: 8}} layout="vertical"
wrapperCol={{span: 24}} labelCol={{ span: 8 }}
style={{width: '100%'}} wrapperCol={{ span: 24 }}
autoComplete="off" style={{ width: '100%' }}
> autoComplete="off"
<Row gutter={15}> >
<Col span={10}> <Row gutter={15}>
<Form.Item<FormFieldType> <Col span={10}>
label="菜单名称" <Form.Item<FormFieldType>
name="modName" label="菜单名称"
extra="此内容会作为菜单名生成菜单，最多8个字" name="modName"
rules={[{required: true, message: '请输入菜单名称'}]} extra="此内容会作为菜单名生成菜单，最多8个字"
> rules={[{ required: true, message: '请输入菜单名称' }]}
<Input placeholder="请输入菜单名称" maxLength={8} readOnly/> >
</Form.Item> <Input placeholder="请输入菜单名称" maxLength={8} readOnly />
<Form.Item<FormFieldType> </Form.Item>
label="菜单说明" <Form.Item<FormFieldType>
name="modDesc" label="菜单说明"
extra="此内容会作为功能描述生成到操作手册中，请详细描述，最多600字" name="modDesc"
rules={[{required: true, message: '请输入菜单说明'}]} extra="此内容会作为功能描述生成到操作手册中，请详细描述，最多600字"
> rules={[{ required: true, message: '请输入菜单说明' }]}
<Input.TextArea placeholder="请输入菜单说明" rows={6} maxLength={600} readOnly/> >
</Form.Item> <Input.TextArea placeholder="请输入菜单说明" rows={6} maxLength={600} readOnly />
<Form.Item<FormFieldType> </Form.Item>
label="菜单图标" <Form.Item<FormFieldType>
name="modIcon" label="菜单图标"
extra="菜单图标会显示在菜单栏中" name="modIcon"
rules={[{required: true, message: '请输入菜单图标'}]} extra="菜单图标会显示在菜单栏中"
> rules={[{ required: true, message: '请输入菜单图标' }]}
<Button size="large"><i className={selectedModIcon}></i></Button> >
</Form.Item> <Button size="large"><i className={selectedModIcon}></i></Button>
</Col> </Form.Item>
<Col span={14}> </Col>
<Form.Item<FormFieldType> <Col span={14}>
name="fields" <Form.Item<FormFieldType>
rules={[{required: true, message: '请添加菜单属性'}]} name="fields"
> rules={[{ required: true, message: '请添加菜单属性' }]}
<ModField modFiledArray={fields} >
isEdit={false} <ModField modFiledArray={fields}
scrollHeight={height - 380} isEdit={false}
handleChange={(dataArray) => { scrollHeight={height - 380}
if (!dataArray) { handleChange={(dataArray) => {
return; if (!dataArray) {
} return;
form.setFieldValue('fields', dataArray); }
}}/> form.setFieldValue('fields', dataArray);
</Form.Item> }} />
</Col> </Form.Item>
</Row> </Col>
</Row>
<Form.Item wrapperCol={{span: 24}}> <Form.Item wrapperCol={{ span: 24 }}>
<div style={{paddingTop: '15px'}}> <div style={{ paddingTop: '15px' }}>
<Flex align="center" justify="center" gap="large"> <Flex align="center" justify="center" gap="large">
<Button type="default" htmlType="button" onClick={() => { <Button type="default" size='large' htmlType="button" onClick={() => {
nav(-1); nav(-1);
}}>
返回
</Button>
</Flex>
</div>
</Form.Item>
</Form>
}}>
返回
</Button>
</Flex>
</div>
</Form.Item>
</Form>
</div>
</div> </div>
</div> </div>
</> </>