lyp
This commit is contained in:
parent
ea0b30554c
commit
e48922e931
158
src/components/ConfigModModal/ConfigModModal.tsx
Normal file
158
src/components/ConfigModModal/ConfigModModal.tsx
Normal file
@ -0,0 +1,158 @@
|
|||||||
|
import './proj-config-list-mod.css';
|
||||||
|
import {
|
||||||
|
Button, Col, Flex, Form, Input,
|
||||||
|
message, Row,
|
||||||
|
} from "antd";
|
||||||
|
import { useNavigate} from "react-router-dom";
|
||||||
|
import { useEffect, useState } from "react";
|
||||||
|
import ModField, { IModField } from "../modfield/ModField.tsx";
|
||||||
|
import { get } from "../../util/AjaxUtils.ts";
|
||||||
|
// import { MAX_MOD_SIZE, MAX_MOD_SIZE_FREE, MIN_MOD_SIZE, MIN_MOD_SIZE_FREE } from "../../route/proj/edit/ProjConfigModList.tsx";
|
||||||
|
|
||||||
|
type FormFieldType = {
|
||||||
|
projId: string;
|
||||||
|
modName: string;
|
||||||
|
modDesc: string;
|
||||||
|
modIcon: string;
|
||||||
|
fields: IModField[];
|
||||||
|
}
|
||||||
|
|
||||||
|
type PropsType = {
|
||||||
|
id: string;
|
||||||
|
isFree?: boolean;
|
||||||
|
onConfirm: any
|
||||||
|
}
|
||||||
|
|
||||||
|
export default function ProjConfigModShow(props: PropsType) {
|
||||||
|
// const nav = useNavigate();
|
||||||
|
// const pathParams = useParams();
|
||||||
|
const [messageApi, contextHolder] = message.useMessage();
|
||||||
|
const [form] = Form.useForm<FormFieldType>();
|
||||||
|
const [selectedModIcon, setSelectedModIcon] = useState<string>('fa fa-list');
|
||||||
|
const [fields, setFields] = useState<IModField[]>([]);
|
||||||
|
// const minSize = props.isFree ? MIN_MOD_SIZE_FREE : MIN_MOD_SIZE;
|
||||||
|
// const maxSize = props.isFree ? MAX_MOD_SIZE_FREE : MAX_MOD_SIZE;
|
||||||
|
|
||||||
|
const height = window.innerHeight - 210;
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
get<any>({
|
||||||
|
messageApi,
|
||||||
|
url: `api/proj-mod/get/${props.id}`,
|
||||||
|
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}
|
||||||
|
{/* <Breadcrumb
|
||||||
|
items={[
|
||||||
|
{title: <Link to={'/'}>首页</Link>},
|
||||||
|
{title: <Link to={'/proj-create'}>创建项目</Link>},
|
||||||
|
{
|
||||||
|
title: <a onClick={() => {
|
||||||
|
if(props.isFree) {
|
||||||
|
nav(`/proj-efree/${pathParams.projId}`)
|
||||||
|
} else {
|
||||||
|
`/proj-edit/${pathParams.projId}`
|
||||||
|
}
|
||||||
|
}}>编辑项目</a>
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: <a onClick={() => {
|
||||||
|
nav(-1);
|
||||||
|
}}>系统菜单管理</a>
|
||||||
|
},
|
||||||
|
{title: '查看菜单'},
|
||||||
|
]}
|
||||||
|
/> */}
|
||||||
|
<div className="mod-edit-container" style={{ height: `${height}px`, marginTop: '17px' }}>
|
||||||
|
<div style={{ height: `${height}px`, 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%' }}
|
||||||
|
autoComplete="off"
|
||||||
|
>
|
||||||
|
<Row gutter={15}>
|
||||||
|
<Col span={10}>
|
||||||
|
<Form.Item<FormFieldType>
|
||||||
|
label="菜单名称"
|
||||||
|
name="modName"
|
||||||
|
extra="此内容会作为菜单名生成菜单,最多8个字"
|
||||||
|
rules={[{ required: true, message: '请输入菜单名称' }]}
|
||||||
|
>
|
||||||
|
<Input placeholder="请输入菜单名称" maxLength={8} readOnly />
|
||||||
|
</Form.Item>
|
||||||
|
<Form.Item<FormFieldType>
|
||||||
|
label="菜单说明"
|
||||||
|
name="modDesc"
|
||||||
|
extra="此内容会作为功能描述生成到操作手册中,请详细描述,最多600字"
|
||||||
|
rules={[{ required: true, message: '请输入菜单说明' }]}
|
||||||
|
>
|
||||||
|
<Input.TextArea placeholder="请输入菜单说明" rows={6} maxLength={600} readOnly />
|
||||||
|
</Form.Item>
|
||||||
|
<Form.Item<FormFieldType>
|
||||||
|
label="菜单图标"
|
||||||
|
name="modIcon"
|
||||||
|
extra="菜单图标会显示在菜单栏中"
|
||||||
|
rules={[{ required: true, message: '请输入菜单图标' }]}
|
||||||
|
>
|
||||||
|
<Button size="large"><i className={selectedModIcon}></i></Button>
|
||||||
|
</Form.Item>
|
||||||
|
</Col>
|
||||||
|
<Col span={14}>
|
||||||
|
<Form.Item<FormFieldType>
|
||||||
|
name="fields"
|
||||||
|
rules={[{ required: true, message: '请添加菜单属性' }]}
|
||||||
|
>
|
||||||
|
<ModField modFiledArray={fields}
|
||||||
|
isEdit={false}
|
||||||
|
scrollHeight={height - 380}
|
||||||
|
handleChange={(dataArray) => {
|
||||||
|
if (!dataArray) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
form.setFieldValue('fields', dataArray);
|
||||||
|
}} />
|
||||||
|
</Form.Item>
|
||||||
|
</Col>
|
||||||
|
</Row>
|
||||||
|
|
||||||
|
<Form.Item wrapperCol={{ span: 24 }}>
|
||||||
|
<div style={{ paddingTop: '15px' }}>
|
||||||
|
<Flex align="center" justify="center" gap="large">
|
||||||
|
<Button type="default" size='large' htmlType="button" onClick={() => {
|
||||||
|
props.onConfirm()
|
||||||
|
|
||||||
|
}}>
|
||||||
|
返回
|
||||||
|
</Button>
|
||||||
|
</Flex>
|
||||||
|
</div>
|
||||||
|
</Form.Item>
|
||||||
|
</Form>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</>
|
||||||
|
)
|
||||||
|
|
||||||
|
}
|
22
src/components/ConfigModModal/proj-config-list-mod.css
Normal file
22
src/components/ConfigModModal/proj-config-list-mod.css
Normal file
@ -0,0 +1,22 @@
|
|||||||
|
.mod-list-container {
|
||||||
|
background-color: var(--color-light);
|
||||||
|
padding: 15px 15px 0 15px;
|
||||||
|
overflow: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mod-list-container .mod-list .table-btn-group {
|
||||||
|
margin: 15px 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mod-list-container .mod-list .table-btn-group .ant-btn {
|
||||||
|
margin-right: 5px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mod-edit-container {
|
||||||
|
background-color: var(--color-light);
|
||||||
|
padding: 15px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mod-edit-container .mod-content {
|
||||||
|
margin-top: 15px;
|
||||||
|
}
|
@ -4,7 +4,7 @@ import {
|
|||||||
Button, Col, Flex, Form, Input,
|
Button, Col, Flex, Form, Input,
|
||||||
message, Modal, Row, Spin,
|
message, Modal, Row, Spin,
|
||||||
} from "antd";
|
} from "antd";
|
||||||
import { useNavigate, useParams } from "react-router-dom";
|
import { useParams } from "react-router-dom";
|
||||||
import { useEffect, useState } from "react";
|
import { useEffect, useState } from "react";
|
||||||
import FaiconSelect from "../faicon/FaIconSelect.tsx";
|
import FaiconSelect from "../faicon/FaIconSelect.tsx";
|
||||||
import ModField, { IModField } from "../modfield/ModField.tsx";
|
import ModField, { IModField } from "../modfield/ModField.tsx";
|
||||||
@ -183,13 +183,13 @@ export default function ProjConfigModEdit(props: idType) {
|
|||||||
console.log(((form.getFieldValue('fields'))[0].fieldDesc));
|
console.log(((form.getFieldValue('fields'))[0].fieldDesc));
|
||||||
const isChinese =
|
const isChinese =
|
||||||
(form.getFieldValue('fields')).every((item: { fieldDesc: string; }) => {
|
(form.getFieldValue('fields')).every((item: { fieldDesc: string; }) => {
|
||||||
return /[\u4e00-\u9fa5]/.test(item.fieldDesc);
|
return /^([\u4e00-\u9fa5a-zA-Z]+)$/.test(item.fieldDesc);
|
||||||
});
|
});
|
||||||
|
|
||||||
console.log(isChinese);
|
console.log(isChinese);
|
||||||
|
|
||||||
if (!isChinese) {
|
if (!isChinese) {
|
||||||
messageApi.error('描述必须含有中文')
|
messageApi.error('描述由中文和字母组成')
|
||||||
} else {
|
} else {
|
||||||
console.log(projId);
|
console.log(projId);
|
||||||
|
|
||||||
|
@ -3,8 +3,10 @@ import { CheckOutlined, LoadingOutlined, ReloadOutlined, RedoOutlined } from "@a
|
|||||||
import { useEffect, useState } from "react";
|
import { useEffect, useState } from "react";
|
||||||
import { IProjMod } from "../../../interfaces/proj/IProj.ts";
|
import { IProjMod } from "../../../interfaces/proj/IProj.ts";
|
||||||
import EditModal from '../../EditModal/EditModal.tsx'
|
import EditModal from '../../EditModal/EditModal.tsx'
|
||||||
|
import ConfigModModal from '../../ConfigModModal/ConfigModModal.tsx'
|
||||||
import { get } from "../../../util/AjaxUtils.ts";
|
import { get } from "../../../util/AjaxUtils.ts";
|
||||||
import { useParams } from "react-router-dom";
|
import { useParams } from "react-router-dom";
|
||||||
|
import { SearchOutlined } from '@ant-design/icons';
|
||||||
import {
|
import {
|
||||||
|
|
||||||
message
|
message
|
||||||
@ -30,6 +32,8 @@ export default function AiHelperMod(props: PropsType) {
|
|||||||
const [modArray, setModArray] = useState<IProjMod[]>([]);
|
const [modArray, setModArray] = useState<IProjMod[]>([]);
|
||||||
const [newModArray, setNewModArray] = useState<ProjModType[]>([]);
|
const [newModArray, setNewModArray] = useState<ProjModType[]>([]);
|
||||||
const [id, setId] = useState('')
|
const [id, setId] = useState('')
|
||||||
|
|
||||||
|
const[configModal,setConfigModal] = useState(false)
|
||||||
const [editModal, setEditModal] = useState(false)
|
const [editModal, setEditModal] = useState(false)
|
||||||
const [updata, setUpdata] = useState<any[]>([])
|
const [updata, setUpdata] = useState<any[]>([])
|
||||||
const [status, setStatus] = useState('')
|
const [status, setStatus] = useState('')
|
||||||
@ -53,7 +57,7 @@ export default function AiHelperMod(props: PropsType) {
|
|||||||
messageApi,
|
messageApi,
|
||||||
url: `/api/proj/get/${pathParams.projId}`,
|
url: `/api/proj/get/${pathParams.projId}`,
|
||||||
onSuccess({ data }) {
|
onSuccess({ data }) {
|
||||||
console.log('其他页面状态判断', data);
|
// console.log('其他页面状态判断', data);
|
||||||
setStatus(data.generate.generateStatus)
|
setStatus(data.generate.generateStatus)
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
@ -99,7 +103,10 @@ export default function AiHelperMod(props: PropsType) {
|
|||||||
render: (_value, record, index) => {
|
render: (_value, record, index) => {
|
||||||
if (status == 'SUCCESS') {
|
if (status == 'SUCCESS') {
|
||||||
return (
|
return (
|
||||||
<Button disabled>已成功</Button>
|
<Button icon={<SearchOutlined />} onClick={() => {
|
||||||
|
setId(record.projModId)
|
||||||
|
setConfigModal(true)
|
||||||
|
}}></Button>
|
||||||
)
|
)
|
||||||
} else if (status == 'GENERATING') {
|
} else if (status == 'GENERATING') {
|
||||||
return (
|
return (
|
||||||
@ -274,9 +281,10 @@ export default function AiHelperMod(props: PropsType) {
|
|||||||
}
|
}
|
||||||
</div>
|
</div>
|
||||||
<Modal title="编辑" open={editModal} footer={null} onCancel={() => { setEditModal(false) }} width={1200} >
|
<Modal title="编辑" open={editModal} footer={null} onCancel={() => { setEditModal(false) }} width={1200} >
|
||||||
|
|
||||||
< EditModal id={id} onConfirm={() => setEditModal(false)} setUpdata={setUpdata} />
|
< EditModal id={id} onConfirm={() => setEditModal(false)} setUpdata={setUpdata} />
|
||||||
|
</Modal>
|
||||||
|
<Modal title="查看" open={configModal} footer={null} onCancel={() => { setConfigModal(false) }} width={1200} >
|
||||||
|
<ConfigModModal id={id} onConfirm={() => setConfigModal(false)} ></ConfigModModal>
|
||||||
</Modal>
|
</Modal>
|
||||||
</>
|
</>
|
||||||
)
|
)
|
||||||
|
@ -440,9 +440,9 @@ export default function ProjEdit() {
|
|||||||
width: '200px',
|
width: '200px',
|
||||||
height: '40px',
|
height: '40px',
|
||||||
fontSize: '16px',
|
fontSize: '16px',
|
||||||
backgroundColor: '#e9e7e7',
|
backgroundColor: 'white',
|
||||||
color: '#A0A0A0',
|
// color: '#A0A0A0',
|
||||||
border: 'none',
|
// border: 'none',
|
||||||
}} onClick={() => {
|
}} onClick={() => {
|
||||||
nav(-1);
|
nav(-1);
|
||||||
}}>返回</Button>
|
}}>返回</Button>
|
||||||
@ -501,6 +501,7 @@ export default function ProjEdit() {
|
|||||||
maskClosable={false}
|
maskClosable={false}
|
||||||
destroyOnClose
|
destroyOnClose
|
||||||
onCancel={() => {
|
onCancel={() => {
|
||||||
|
renderData()
|
||||||
setAiHelperModalOpen(false);
|
setAiHelperModalOpen(false);
|
||||||
// console.log(123);
|
// console.log(123);
|
||||||
|
|
||||||
|
@ -28,7 +28,8 @@ export default function ProjNew() {
|
|||||||
projIntroduction: '',
|
projIntroduction: '',
|
||||||
});
|
});
|
||||||
const [createProjId, setCreateProjId] = useState('');
|
const [createProjId, setCreateProjId] = useState('');
|
||||||
const listProjChargeAdditional: string[] = [];
|
const oldlistProjChargeAdditional: string[] = [];
|
||||||
|
const [listProjChargeAdditional,setlistProjChargeAdditional] = useState<string[]>([])
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
get({
|
get({
|
||||||
@ -66,13 +67,18 @@ export default function ProjNew() {
|
|||||||
const videoDemo = queryParams.get('videoDemo') == 'true' ? true : false
|
const videoDemo = queryParams.get('videoDemo') == 'true' ? true : false
|
||||||
if (pkg) {
|
if (pkg) {
|
||||||
price += charge.additional.pkg;
|
price += charge.additional.pkg;
|
||||||
listProjChargeAdditional.push(ProjAdditionalType.PKG);
|
oldlistProjChargeAdditional.push(ProjAdditionalType.PKG);
|
||||||
|
console.log(listProjChargeAdditional);
|
||||||
|
|
||||||
}
|
}
|
||||||
if (videoDemo) {
|
if (videoDemo) {
|
||||||
price += charge.additional.videoDemo;
|
price += charge.additional.videoDemo;
|
||||||
listProjChargeAdditional.push(ProjAdditionalType.VIDEO_DEMO);
|
oldlistProjChargeAdditional.push(ProjAdditionalType.VIDEO_DEMO);
|
||||||
|
console.log(listProjChargeAdditional);
|
||||||
|
|
||||||
}
|
}
|
||||||
setChargePrice(price);
|
setChargePrice(price);
|
||||||
|
setlistProjChargeAdditional(oldlistProjChargeAdditional)
|
||||||
// console.log('传递信息pkg:',pkg,'videoDemo:',videoDemo);
|
// console.log('传递信息pkg:',pkg,'videoDemo:',videoDemo);
|
||||||
|
|
||||||
// console.log('显示价格',price);
|
// console.log('显示价格',price);
|
||||||
@ -164,6 +170,8 @@ export default function ProjNew() {
|
|||||||
cancelText="取消"
|
cancelText="取消"
|
||||||
open={isCreateModalOpen}
|
open={isCreateModalOpen}
|
||||||
onOk={() => {
|
onOk={() => {
|
||||||
|
// console.log('最终',listProjChargeAdditional);
|
||||||
|
|
||||||
setIsCreateModalOpen(false);
|
setIsCreateModalOpen(false);
|
||||||
post<any>({
|
post<any>({
|
||||||
messageApi,
|
messageApi,
|
||||||
|
@ -180,13 +180,13 @@ export default function ProjConfigModEdit(props: PropsType) {
|
|||||||
|
|
||||||
const isChinese =
|
const isChinese =
|
||||||
( form.getFieldValue('fields')).every((item: { fieldDesc: string; }) => {
|
( form.getFieldValue('fields')).every((item: { fieldDesc: string; }) => {
|
||||||
return /[\u4e00-\u9fa5]/.test(item.fieldDesc);
|
return /^([\u4e00-\u9fa5a-zA-Z]+)$/.test(item.fieldDesc);
|
||||||
});
|
});
|
||||||
|
|
||||||
// console.log(isChinese);
|
// console.log(isChinese);
|
||||||
|
|
||||||
if (!isChinese) {
|
if (!isChinese) {
|
||||||
messageApi.error('描述必须含有中文')
|
messageApi.error('描述由中文和字母组成')
|
||||||
}else{
|
}else{
|
||||||
put({
|
put({
|
||||||
messageApi,
|
messageApi,
|
||||||
|
@ -187,11 +187,11 @@ export default function ProjConfigModSave(props: PropsType) {
|
|||||||
// console.log( ((form.getFieldValue('fields'))[0].fieldDesc ));
|
// console.log( ((form.getFieldValue('fields'))[0].fieldDesc ));
|
||||||
const isChinese =
|
const isChinese =
|
||||||
( form.getFieldValue('fields')).every((item: { fieldDesc: string; }) => {
|
( form.getFieldValue('fields')).every((item: { fieldDesc: string; }) => {
|
||||||
return /^[\u4e00-\u9fa5]+$/.test(item.fieldDesc);
|
return /^([\u4e00-\u9fa5a-zA-Z]+)$/.test(item.fieldDesc);
|
||||||
});
|
});
|
||||||
|
|
||||||
if (!isChinese) {
|
if (!isChinese) {
|
||||||
messageApi.error('描述必须为中文')
|
messageApi.error('描述由中文和字母组成')
|
||||||
}else{
|
}else{
|
||||||
post({
|
post({
|
||||||
messageApi,
|
messageApi,
|
||||||
|
@ -6,7 +6,7 @@ export const Axios = axios;
|
|||||||
// axios.defaults.baseURL = 'http://192.168.0.163:7025/copyright';
|
// axios.defaults.baseURL = 'http://192.168.0.163:7025/copyright';
|
||||||
axios.defaults.baseURL = 'http://192.168.0.15:7025/copyright';
|
axios.defaults.baseURL = 'http://192.168.0.15:7025/copyright';
|
||||||
// axios.defaults.baseURL = '/copyright';
|
// axios.defaults.baseURL = '/copyright';
|
||||||
export const WebSocketBaseUrl: string = 'ws://192.168.0.163:7025/copyright';
|
export const WebSocketBaseUrl: string = 'ws://192.168.0.15:7025/copyright';
|
||||||
// export const WebSocketBaseUrl: string = '/copyright';
|
// export const WebSocketBaseUrl: string = '/copyright';
|
||||||
export const DevUserId: string = '80d3365e-0597-4988-979e-18ef1c3ec671'; // 18634604067
|
export const DevUserId: string = '80d3365e-0597-4988-979e-18ef1c3ec671'; // 18634604067
|
||||||
// export const DevUserId: string = 'c2438eb8-2685-49a9-bf02-5111a5192d96'; // 18647109157
|
// export const DevUserId: string = 'c2438eb8-2685-49a9-bf02-5111a5192d96'; // 18647109157
|
||||||
|
Loading…
Reference in New Issue
Block a user