lyp

src/components/ConfigModModal/ConfigModModal.tsx

@@ -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>
+        </>
+    )
+
+}

src/components/ConfigModModal/proj-config-list-mod.css

@@ -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;
+}

src/components/EditModal/EditModal.tsx

@@ -4,7 +4,7 @@ import {
     Button, Col, Flex, Form, Input,
     message, Modal, Row, Spin,
 } from "antd";
-import { useNavigate, useParams } from "react-router-dom";
+import { useParams } from "react-router-dom";
 import { useEffect, useState } from "react";
 import FaiconSelect from "../faicon/FaIconSelect.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));
                     const isChinese =
                         (form.getFieldValue('fields')).every((item: { fieldDesc: string; }) => {
-                            return /[\u4e00-\u9fa5]/.test(item.fieldDesc);
+                            return /^([\u4e00-\u9fa5a-zA-Z]+)$/.test(item.fieldDesc);
                         });
 
                     console.log(isChinese);
 
                     if (!isChinese) {
-                        messageApi.error('描述必须含有中文')
+                        messageApi.error('描述由中文和字母组成')
                     } else {
                         console.log(projId);
 

src/components/ai/mod/AiHelperMod.tsx

@@ -3,8 +3,10 @@ import { CheckOutlined, LoadingOutlined, ReloadOutlined, RedoOutlined } from "@a
 import { useEffect, useState } from "react";
 import { IProjMod } from "../../../interfaces/proj/IProj.ts";
 import EditModal from '../../EditModal/EditModal.tsx'
+import ConfigModModal from '../../ConfigModModal/ConfigModModal.tsx'
 import { get } from "../../../util/AjaxUtils.ts";
 import { useParams } from "react-router-dom";
+import { SearchOutlined } from '@ant-design/icons';
 import {
 
     message
@@ -30,6 +32,8 @@ export default function AiHelperMod(props: PropsType) {
     const [modArray, setModArray] = useState<IProjMod[]>([]);
     const [newModArray, setNewModArray] = useState<ProjModType[]>([]);
     const [id, setId] = useState('')
+
+    const[configModal,setConfigModal] = useState(false)
     const [editModal, setEditModal] = useState(false)
     const [updata, setUpdata] = useState<any[]>([])
     const [status, setStatus] = useState('')
@@ -53,7 +57,7 @@ export default function AiHelperMod(props: PropsType) {
             messageApi,
             url: `/api/proj/get/${pathParams.projId}`,
             onSuccess({ data }) {
-                console.log('其他页面状态判断', data);
+                // console.log('其他页面状态判断', data);
                 setStatus(data.generate.generateStatus)
             }
         })
@@ -97,17 +101,20 @@ export default function AiHelperMod(props: PropsType) {
             width: 80,
             align: 'center',
             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 (
                         <LoadingOutlined />
                     )
                 }
 
-                else{
+                else {
                     if (record.aiFieldStatus == 'GENERATING') {
                         return <LoadingOutlined />
                     }
@@ -267,16 +274,17 @@ export default function AiHelperMod(props: PropsType) {
                                     props.handleGenerate();
                                 }}><ReloadOutlined /> 重新生成</Button>
                         </Space>
-                    ) : <Button type="link" disabled={status=='SUCCESS' || status=='GENERATING' ? true : false} style={{ cursor: 'pointer' }}
+                    ) : <Button type="link" disabled={status == 'SUCCESS' || status == 'GENERATING' ? true : false} style={{ cursor: 'pointer' }}
                         onClick={() => {
                             props.handleGenerate();
                         }}>AI生成</Button>
                 }
             </div>
             <Modal title="编辑" open={editModal} footer={null} onCancel={() => { setEditModal(false) }} width={1200} >
-
                 < 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>
         </>
     )

src/route/proj/ProjEdit.tsx

@@ -440,9 +440,9 @@ export default function ProjEdit() {
                     width: '200px',
                     height: '40px',
                     fontSize: '16px',
-                    backgroundColor: '#e9e7e7',
+                    backgroundColor: 'white',
-                    color: '#A0A0A0',
+                    // color: '#A0A0A0',
-                    border: 'none',
+                    // border: 'none',
                 }} onClick={() => {
                     nav(-1);
                 }}>返回</Button>
@@ -501,6 +501,7 @@ export default function ProjEdit() {
                 maskClosable={false}
                 destroyOnClose
                 onCancel={() => {
+                    renderData()
                     setAiHelperModalOpen(false);
                     // console.log(123);
 

src/route/proj/ProjNew.tsx

@@ -28,7 +28,8 @@ export default function ProjNew() {
         projIntroduction: '',
     });
     const [createProjId, setCreateProjId] = useState('');
-    const listProjChargeAdditional: string[] = [];
+    const oldlistProjChargeAdditional: string[] = [];
+    const [listProjChargeAdditional,setlistProjChargeAdditional] = useState<string[]>([])
 
     useEffect(() => {
         get({
@@ -66,13 +67,18 @@ export default function ProjNew() {
                 const videoDemo = queryParams.get('videoDemo') == 'true' ? true : false
                 if (pkg) {
                     price += charge.additional.pkg;
-                    listProjChargeAdditional.push(ProjAdditionalType.PKG);
+                    oldlistProjChargeAdditional.push(ProjAdditionalType.PKG);
+                    console.log(listProjChargeAdditional);
+                    
                 }
                 if (videoDemo) {
                     price += charge.additional.videoDemo;
-                    listProjChargeAdditional.push(ProjAdditionalType.VIDEO_DEMO);
+                    oldlistProjChargeAdditional.push(ProjAdditionalType.VIDEO_DEMO);
+                    console.log(listProjChargeAdditional);
+
                 }
                 setChargePrice(price);
+                setlistProjChargeAdditional(oldlistProjChargeAdditional)
                 // console.log('传递信息pkg:',pkg,'videoDemo:',videoDemo);
 
                 // console.log('显示价格',price);
@@ -164,6 +170,8 @@ export default function ProjNew() {
                 cancelText="取消"
                 open={isCreateModalOpen}
                 onOk={() => {
+                    // console.log('最终',listProjChargeAdditional);
+                    
                     setIsCreateModalOpen(false);
                     post<any>({
                         messageApi,

src/route/proj/edit/ProjConfigModEdit.tsx

@@ -180,13 +180,13 @@ export default function ProjConfigModEdit(props: PropsType) {
                     
                     const isChinese = 
                        ( form.getFieldValue('fields')).every((item: { fieldDesc: string; }) => {
-                            return /[\u4e00-\u9fa5]/.test(item.fieldDesc);
+                            return /^([\u4e00-\u9fa5a-zA-Z]+)$/.test(item.fieldDesc);
                         });
                    
                     // console.log(isChinese);
                     
                     if (!isChinese) {
-                        messageApi.error('描述必须含有中文')
+                        messageApi.error('描述由中文和字母组成')
                     }else{
                        put({
                            messageApi,

src/route/proj/edit/ProjConfigModSave.tsx

@@ -187,11 +187,11 @@ export default function ProjConfigModSave(props: PropsType) {
                     // console.log( ((form.getFieldValue('fields'))[0].fieldDesc ));
                     const isChinese = 
                        ( form.getFieldValue('fields')).every((item: { fieldDesc: string; }) => {
-                            return /^[\u4e00-\u9fa5]+$/.test(item.fieldDesc);
+                            return /^([\u4e00-\u9fa5a-zA-Z]+)$/.test(item.fieldDesc);
                         });
                    
                     if (!isChinese) {
-                        messageApi.error('描述必须为中文')
+                        messageApi.error('描述由中文和字母组成')
                     }else{
                         post({
                             messageApi,

src/util/AjaxUtils.ts

@@ -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.15:7025/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 DevUserId: string = '80d3365e-0597-4988-979e-18ef1c3ec671'; // 18634604067
 // export const DevUserId: string = 'c2438eb8-2685-49a9-bf02-5111a5192d96'; // 18647109157