lyp
This commit is contained in:
xixi
parent
2e50dbe6d2
commit
e56864c02e
@ -1,4 +1,4 @@
|
||||
import './proj-edit.css';
|
||||
import './proj-edit.css';1
|
||||
// import {Link, useNavigate, useParams} from "react-router-dom";
|
||||
import { useNavigate, useParams } from "react-router-dom";
|
||||
import { Button, FloatButton, message, Modal } from "antd";
|
||||
|
||||
@ -1,6 +1,6 @@
|
||||
import './proj-config-list-mod.css';
|
||||
import {Alert, Breadcrumb, message, Table, TableProps,} from "antd";
|
||||
import {Link, useNavigate, useParams} from "react-router-dom";
|
||||
import {Alert, message, Table, TableProps,} from "antd";
|
||||
import {useParams} from "react-router-dom";
|
||||
import {useEffect, useState} from "react";
|
||||
import {get} from "../../../util/AjaxUtils.ts";
|
||||
|
||||
@ -17,12 +17,12 @@ interface DataType {
|
||||
}
|
||||
|
||||
export default function ProjConfigMenuListShow() {
|
||||
const nav = useNavigate();
|
||||
// const nav = useNavigate();
|
||||
const pathParams = useParams();
|
||||
const [messageApi, contextHolder] = message.useMessage();
|
||||
const [dataArray, setDataArray] = useState<DataType[]>();
|
||||
|
||||
const height = window.innerHeight - 165;
|
||||
const height = window.innerHeight - 200;
|
||||
|
||||
const renderData = () => {
|
||||
get<DataType[]>({
|
||||
@ -66,15 +66,15 @@ export default function ProjConfigMenuListShow() {
|
||||
return (
|
||||
<>
|
||||
{contextHolder}
|
||||
<Breadcrumb
|
||||
{/* <Breadcrumb
|
||||
items={[
|
||||
{title: <Link to={'/'}>首页</Link>},
|
||||
{title: <Link to={'/proj-create'}>创建项目</Link>},
|
||||
{title: <a onClick={() => {nav(-1)}}>编辑项目</a>},
|
||||
{title: '系统菜单顺序'},
|
||||
]}
|
||||
/>
|
||||
<div className="mod-list-container" style={{height: `${height}px`}}>
|
||||
/> */}
|
||||
<div className="mod-list-container" style={{height: `${height}px`,marginTop:'17px',overflow:'auto'}}>
|
||||
<Alert message="此数据在添加模块候自动生成，编辑顺序列可修改" type="info"/>
|
||||
<div className="mod-list" style={{marginTop: '15px'}}>
|
||||
<Table columns={columns} dataSource={dataArray} pagination={{pageSize: 20}}
|
||||
|
||||
@ -148,10 +148,14 @@ export default function ProjConfigModEdit(props: PropsType) {
|
||||
<Flex align="center" justify="center" gap="large">
|
||||
<Button type="primary"
|
||||
htmlType="submit"
|
||||
style={{backgroundColor: 'var(--color-primary)'}}>
|
||||
size='large'
|
||||
// style={{backgroundColor: 'var(--color-primary)'}}
|
||||
>
|
||||
保存
|
||||
</Button>
|
||||
<Button type="default" htmlType="button" onClick={() => {
|
||||
<Button type="default" htmlType="button"
|
||||
size='large'
|
||||
onClick={() => {
|
||||
nav(-1);
|
||||
}}>
|
||||
返回
|
||||
@ -169,6 +173,14 @@ export default function ProjConfigModEdit(props: PropsType) {
|
||||
open={isEditModalOpen}
|
||||
onOk={() => {
|
||||
setIsEditModalOpen(false);
|
||||
|
||||
const reg = /^[\u4e00-\u9fa5]+$/; // 中文字符的正则表达式
|
||||
console.log( ((form.getFieldValue('fields'))[0].fieldDesc ));
|
||||
|
||||
|
||||
if (!reg.test((form.getFieldValue('fields'))[0].fieldDesc)) {
|
||||
messageApi.error('描述必须为中文')
|
||||
}else{
|
||||
put({
|
||||
messageApi,
|
||||
url: `/api/proj-mod/update/${pathParams.projModId}`,
|
||||
@ -189,6 +201,7 @@ export default function ProjConfigModEdit(props: PropsType) {
|
||||
setLoading(false);
|
||||
}
|
||||
})
|
||||
}
|
||||
}}
|
||||
onCancel={() => {
|
||||
setIsEditModalOpen(false);
|
||||
|
||||
@ -1,11 +1,11 @@
|
||||
import './proj-config-list-mod.css';
|
||||
import {
|
||||
Alert,
|
||||
Breadcrumb, Button,
|
||||
Button,
|
||||
message,
|
||||
Table, TableProps,
|
||||
} from "antd";
|
||||
import {Link, useNavigate, useParams} from "react-router-dom";
|
||||
import { useNavigate, useParams} from "react-router-dom";
|
||||
import {useEffect, useState} from "react";
|
||||
import {SearchOutlined} from "@ant-design/icons";
|
||||
import {get} from "../../../util/AjaxUtils.ts";
|
||||
@ -26,7 +26,7 @@ export default function ProjConfigModListShow() {
|
||||
const [messageApi, contextHolder] = message.useMessage();
|
||||
const [dataArray, setDataArray] = useState<DataType[]>();
|
||||
|
||||
const height = window.innerHeight - 165;
|
||||
const height = window.innerHeight - 200;
|
||||
|
||||
const renderData = () => {
|
||||
get<DataType[]>({
|
||||
@ -103,15 +103,15 @@ export default function ProjConfigModListShow() {
|
||||
return (
|
||||
<>
|
||||
{contextHolder}
|
||||
<Breadcrumb
|
||||
{/* <Breadcrumb
|
||||
items={[
|
||||
{title: <Link to={'/'}>首页</Link>},
|
||||
{title: <Link to={'/proj-create'}>创建项目</Link>},
|
||||
{title: <a onClick={() => {nav(-1)}}>编辑项目</a>},
|
||||
{title: '系统菜单查看'},
|
||||
]}
|
||||
/>
|
||||
<div className="mod-list-container" style={{height: `${height}px`}}>
|
||||
/> */}
|
||||
<div className="mod-list-container" style={{height: `${height}px`,marginTop:'17px',overflow:'auto'}}>
|
||||
<Alert message="菜单指的是系统的功能，最少10个菜单，最多15个菜单" type="info"/>
|
||||
<div className="mod-list" style={{marginTop: '15px'}}>
|
||||
<Table columns={columns} dataSource={dataArray} pagination={{pageSize: 20}}
|
||||
|
||||
@ -1,15 +1,15 @@
|
||||
import './proj-config-list-mod.css';
|
||||
import {
|
||||
Alert,
|
||||
Button, Col, Flex, Form, Input,
|
||||
Button, Col, Flex, Form, Input,
|
||||
message, Modal, Row, Spin,
|
||||
} from "antd";
|
||||
import { useNavigate, useParams} from "react-router-dom";
|
||||
import {useEffect, useState} from "react";
|
||||
import { useNavigate, useParams } from "react-router-dom";
|
||||
import { useEffect, useState } from "react";
|
||||
import FaiconSelect from "../../../components/faicon/FaIconSelect.tsx";
|
||||
import ModField, {IModField} from "../../../components/modfield/ModField.tsx";
|
||||
import {post} from "../../../util/AjaxUtils.ts";
|
||||
import {MAX_MOD_SIZE, MAX_MOD_SIZE_FREE, MIN_MOD_SIZE, MIN_MOD_SIZE_FREE} from "./ProjConfigModList.tsx";
|
||||
import ModField, { IModField } from "../../../components/modfield/ModField.tsx";
|
||||
import { post } from "../../../util/AjaxUtils.ts";
|
||||
import { MAX_MOD_SIZE, MAX_MOD_SIZE_FREE, MIN_MOD_SIZE, MIN_MOD_SIZE_FREE } from "./ProjConfigModList.tsx";
|
||||
|
||||
type FormFieldType = {
|
||||
modName: string;
|
||||
@ -66,16 +66,16 @@ export default function ProjConfigModSave(props: PropsType) {
|
||||
{title: '添加菜单'},
|
||||
]}
|
||||
/> */}
|
||||
<div className="mod-edit-container" style={{height: `${height}px`,marginTop:'18px',overflow:'auto'}}>
|
||||
<Alert message={`菜单指的是系统的功能，最少${minSize}个菜单，最多${maxSize}个菜单`} type="info"/>
|
||||
<div className="mod-edit-container" style={{ height: `${height}px`, marginTop: '18px', overflow: 'auto' }}>
|
||||
<Alert message={`菜单指的是系统的功能，最少${minSize}个菜单，最多${maxSize}个菜单`} type="info" />
|
||||
<div className="mod-content">
|
||||
<Form
|
||||
name="basic"
|
||||
form={form}
|
||||
layout="vertical"
|
||||
labelCol={{span: 8}}
|
||||
wrapperCol={{span: 24}}
|
||||
style={{width: '100%'}}
|
||||
labelCol={{ span: 8 }}
|
||||
wrapperCol={{ span: 24 }}
|
||||
style={{ width: '100%' }}
|
||||
onFinish={() => {
|
||||
setIsEditModalOpen(true);
|
||||
}}
|
||||
@ -87,23 +87,43 @@ export default function ProjConfigModSave(props: PropsType) {
|
||||
label="菜单名称"
|
||||
name="modName"
|
||||
extra="此内容会作为菜单名生成菜单，最多8个字"
|
||||
rules={[{required: true, message: '请输入菜单名称'}]}
|
||||
rules={[{ required: true, message: '请输入菜单名称' },
|
||||
// {
|
||||
// validator: (_, value) => {
|
||||
// const reg = /^[\u4e00-\u9fa5]+$/; // 中文字符的正则表达式
|
||||
// if (!reg.test(value)) {
|
||||
// return Promise.reject('请输入中文字符');
|
||||
// }
|
||||
// return Promise.resolve();
|
||||
// }
|
||||
// },
|
||||
]}
|
||||
>
|
||||
<Input placeholder="请输入菜单名称" maxLength={8}/>
|
||||
<Input placeholder="请输入菜单名称" maxLength={8} />
|
||||
</Form.Item>
|
||||
<Form.Item<FormFieldType>
|
||||
label="菜单说明"
|
||||
name="modDesc"
|
||||
extra="此内容会作为功能描述生成到操作手册中，请详细描述，最多600字"
|
||||
rules={[{required: true, message: '请输入菜单说明'}]}
|
||||
rules={[{ required: true, message: '请输入菜单说明' },
|
||||
// {
|
||||
// validator: (_, value) => {
|
||||
// const reg = /^[\u4e00-\u9fa5]+$/; // 中文字符的正则表达式
|
||||
// if (!reg.test(value)) {
|
||||
// return Promise.reject('请输入中文字符');
|
||||
// }
|
||||
// return Promise.resolve();
|
||||
// }
|
||||
// }
|
||||
]}
|
||||
>
|
||||
<Input.TextArea placeholder="请输入菜单说明" rows={6} maxLength={600}/>
|
||||
<Input.TextArea placeholder="请输入菜单说明" rows={6} maxLength={600} />
|
||||
</Form.Item>
|
||||
<Form.Item<FormFieldType>
|
||||
label="菜单图标"
|
||||
name="modIcon"
|
||||
extra="菜单图标会显示在菜单栏中"
|
||||
rules={[{required: true, message: '请输入菜单图标'}]}
|
||||
rules={[{ required: true, message: '请输入菜单图标' }]}
|
||||
>
|
||||
<Button size="large" onClick={() => {
|
||||
setIsModIconModalOpen(true);
|
||||
@ -113,7 +133,8 @@ export default function ProjConfigModSave(props: PropsType) {
|
||||
<Col span={14}>
|
||||
<Form.Item<FormFieldType>
|
||||
name="fields"
|
||||
rules={[{required: true, message: '请添加菜单属性'}]}
|
||||
rules={[{ required: true, message: '请添加菜单属性' }
|
||||
]}
|
||||
>
|
||||
<ModField
|
||||
isEdit={true}
|
||||
@ -124,27 +145,27 @@ export default function ProjConfigModSave(props: PropsType) {
|
||||
return;
|
||||
}
|
||||
form.setFieldValue('fields', dataArray);
|
||||
}}/>
|
||||
}} />
|
||||
</Form.Item>
|
||||
|
||||
</Col>
|
||||
</Row>
|
||||
|
||||
<Form.Item wrapperCol={{span: 24}}>
|
||||
<div style={{paddingTop: '15px'}}>
|
||||
<Form.Item wrapperCol={{ span: 24 }}>
|
||||
<div style={{ paddingTop: '15px' }}>
|
||||
<Flex align="center" justify="center" gap="large">
|
||||
<Button type="primary"
|
||||
htmlType="submit"
|
||||
// style={{backgroundColor: 'var(--color-primary)'}}
|
||||
size='large'
|
||||
>
|
||||
htmlType="submit"
|
||||
// style={{backgroundColor: 'var(--color-primary)'}}
|
||||
size='large'
|
||||
>
|
||||
保存
|
||||
</Button>
|
||||
<Button type="default" htmlType="button"
|
||||
size='large'
|
||||
onClick={() => {
|
||||
nav(-1);
|
||||
}}>
|
||||
<Button type="default" htmlType="button"
|
||||
size='large'
|
||||
onClick={() => {
|
||||
nav(-1);
|
||||
}}>
|
||||
返回
|
||||
</Button>
|
||||
</Flex>
|
||||
@ -155,54 +176,71 @@ export default function ProjConfigModSave(props: PropsType) {
|
||||
</div>
|
||||
</div>
|
||||
<Modal title="提示"
|
||||
okText="确定"
|
||||
cancelText="取消"
|
||||
open={isEditModalOpen}
|
||||
onOk={() => {
|
||||
setIsEditModalOpen(false);
|
||||
post({
|
||||
messageApi,
|
||||
url: `/api/proj-mod/save`,
|
||||
body: {
|
||||
projId: pathParams.projId,
|
||||
modName: form.getFieldValue('modName'),
|
||||
modDesc: form.getFieldValue('modDesc'),
|
||||
modIcon: form.getFieldValue('modIcon'),
|
||||
fields: form.getFieldValue('fields'),
|
||||
},
|
||||
onBefore() {
|
||||
setLoading(true);
|
||||
},
|
||||
onSuccess() {
|
||||
messageApi.success('添加成功');
|
||||
nav(0);
|
||||
},
|
||||
onFinally() {
|
||||
setLoading(false);
|
||||
}
|
||||
})
|
||||
}}
|
||||
onCancel={() => {
|
||||
setIsEditModalOpen(false);
|
||||
}}>
|
||||
okText="确定"
|
||||
cancelText="取消"
|
||||
open={isEditModalOpen}
|
||||
onOk={() => {
|
||||
|
||||
setIsEditModalOpen(false);
|
||||
|
||||
const reg = /^[\u4e00-\u9fa5]+$/; // 中文字符的正则表达式
|
||||
console.log( ((form.getFieldValue('fields'))[0].fieldDesc ));
|
||||
|
||||
|
||||
if (!reg.test((form.getFieldValue('fields'))[0].fieldDesc)) {
|
||||
messageApi.error('描述必须为中文')
|
||||
}else{
|
||||
post({
|
||||
messageApi,
|
||||
url: `/api/proj-mod/save`,
|
||||
body: {
|
||||
projId: pathParams.projId,
|
||||
modName: form.getFieldValue('modName'),
|
||||
modDesc: form.getFieldValue('modDesc'),
|
||||
modIcon: form.getFieldValue('modIcon'),
|
||||
fields: form.getFieldValue('fields'),
|
||||
},
|
||||
onBefore() {
|
||||
setLoading(true);
|
||||
},
|
||||
onSuccess() {
|
||||
messageApi.success('添加成功');
|
||||
setTimeout(function () {
|
||||
// 刷新当前页面
|
||||
// location.reload();
|
||||
// 返回上一页
|
||||
nav(-1);
|
||||
}, 1000);
|
||||
},
|
||||
onFinally() {
|
||||
setLoading(false);
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
}}
|
||||
onCancel={() => {
|
||||
setIsEditModalOpen(false);
|
||||
}}>
|
||||
<div>确定提交吗？</div>
|
||||
</Modal>
|
||||
<Modal title="选择图标"
|
||||
footer={false}
|
||||
open={isModIconModalOpen}
|
||||
onCancel={() => {
|
||||
setIsModIconModalOpen(false);
|
||||
}}>
|
||||
<div style={{maxHeight: '400px', overflow: 'auto'}}>
|
||||
footer={false}
|
||||
open={isModIconModalOpen}
|
||||
onCancel={() => {
|
||||
setIsModIconModalOpen(false);
|
||||
}}>
|
||||
<div style={{ maxHeight: '400px', overflow: 'auto' }}>
|
||||
<FaiconSelect selectedIcon={selectedModIcon}
|
||||
handleClick={(icon) => {
|
||||
form.setFieldValue('modIcon', icon);
|
||||
setSelectedModIcon(icon);
|
||||
}}
|
||||
handleClick={(icon) => {
|
||||
form.setFieldValue('modIcon', icon);
|
||||
setSelectedModIcon(icon);
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
</Modal>
|
||||
<Spin tip="正在提交..." spinning={loading} fullscreen/>
|
||||
<Spin tip="正在提交..." spinning={loading} fullscreen />
|
||||
</>
|
||||
)
|
||||
|
||||
|
||||
Loading…
Reference in New Issue
Block a user