diff --git a/src/components/EditModal/EditModal.tsx b/src/components/EditModal/EditModal.tsx new file mode 100644 index 0000000..c3b1a0d --- /dev/null +++ b/src/components/EditModal/EditModal.tsx @@ -0,0 +1,265 @@ +import './proj-config-list-mod.css'; +import { + Alert, + Button, Col, Flex, Form, Input, + message, Modal, Row, Spin, +} from "antd"; +import { useNavigate, useParams } from "react-router-dom"; +import { useEffect, useState } from "react"; +import FaiconSelect from "../faicon/FaIconSelect.tsx"; +import ModField, { IModField } from "../modfield/ModField.tsx"; +import { get, put } 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 idType = { + isFree?: boolean; + id: string; + onConfirm: any + setUpdata:any +} + +export default function ProjConfigModEdit(props: idType) { + // const nav = useNavigate(); + const pathParams = useParams(); + const [messageApi, contextHolder] = message.useMessage(); + const [form] = Form.useForm(); + const [loading, setLoading] = useState(false); + const [isModIconModalOpen, setIsModIconModalOpen] = useState(false); + const [isEditModalOpen, setIsEditModalOpen] = useState(false); + const [selectedModIcon, setSelectedModIcon] = useState('fa fa-list'); + const [fields, setFields] = useState([]); + const minSize = props.isFree ? MIN_MOD_SIZE_FREE : MIN_MOD_SIZE; + const maxSize = props.isFree ? MAX_MOD_SIZE_FREE : MAX_MOD_SIZE; + const [projId, setprojId] = useState('') + const height = window.innerHeight - 205; + + useEffect(() => { + get({ + messageApi, + url: `api/proj-mod/get/${props.id}`, + onSuccess({ data }) { + console.log(data); + form.setFieldsValue({ + projId: data.projId, + modName: data.modName, + modDesc: data.modDesc, + modIcon: data.modIcon, + fields: data.fields, + }); + setprojId(data.projId) + setSelectedModIcon(data.modIcon); + setFields(data.fields) + } + }) + }, []) + + return ( + <> + {contextHolder} + {/* 首页}, + {title: 创建项目}, + { + title: { + if(props.isFree) { + nav(`/proj-efree/${pathParams.projId}`) + } else { + `/proj-edit/${pathParams.projId}` + } + }}>编辑项目 + }, + { + title: { + nav(-1); + }}>系统菜单管理 + }, + {title: '编辑菜单'}, + ]} + /> */} +
+ +
+
{ + setIsEditModalOpen(true); + }} + autoComplete="off" + > + + + + 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); + }} /> + + + + + + +
+ + + + +
+ +
+ +
+
+ { + setIsEditModalOpen(false); + + // const reg = /^[\u4e00-\u9fa5]+$/; // 中文字符的正则表达式 + console.log(((form.getFieldValue('fields'))[0].fieldDesc)); + const isChinese = + (form.getFieldValue('fields')).every((item: { fieldDesc: string; }) => { + return /[\u4e00-\u9fa5]/.test(item.fieldDesc); + }); + + console.log(isChinese); + + if (!isChinese) { + messageApi.error('描述必须含有中文') + } else { + console.log(projId); + + put({ + messageApi, + url: `/api/proj-mod/update/${props.id}`, + body: { + projId: 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(); + // // 返回上一页 + // }, 1000); + get({ + messageApi, + url: '/api/proj-mod/list', + config: { + params: { + projId: pathParams.projId + } + }, + onSuccess({ data }) { + console.log('更新',data); + props.setUpdata(data) + } + }) + + + props.onConfirm() + + }, + onFinally() { + setLoading(false); + } + }) + } + + }} + onCancel={() => { + setIsEditModalOpen(false); + }}> +
确定提交吗？
+ + { + setIsModIconModalOpen(false); + }}> +
+ { + form.setFieldValue('modIcon', icon); + setSelectedModIcon(icon); + }} + /> +
+ + + + ) + +} \ No newline at end of file diff --git a/src/components/EditModal/proj-config-list-mod.css b/src/components/EditModal/proj-config-list-mod.css new file mode 100644 index 0000000..afc2dc5 --- /dev/null +++ b/src/components/EditModal/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; +} \ No newline at end of file diff --git a/src/components/ai/mod/AiHelperMod.tsx b/src/components/ai/mod/AiHelperMod.tsx index 70599cc..8274f2a 100644 --- a/src/components/ai/mod/AiHelperMod.tsx +++ b/src/components/ai/mod/AiHelperMod.tsx @@ -1,8 +1,14 @@ -import {Button, Divider, Dropdown, Space, Table, TableProps} from "antd"; -import {CheckOutlined, LoadingOutlined, ReloadOutlined, RedoOutlined} from "@ant-design/icons"; -import {useEffect, useState} from "react"; -import {IProjMod} from "../../../interfaces/proj/IProj.ts"; +import { Button, Divider, Dropdown, Space, Table, TableProps, Modal } from "antd"; +import { CheckOutlined, LoadingOutlined, ReloadOutlined, RedoOutlined } from "@ant-design/icons"; +import { useEffect, useState } from "react"; +import { IProjMod } from "../../../interfaces/proj/IProj.ts"; +import EditModal from '../../EditModal/EditModal.tsx' +import { get } from "../../../util/AjaxUtils.ts"; +import { useParams } from "react-router-dom"; +import { + message +} from "antd"; type PropsType = { mods: IProjMod[]; newMods: ProjModType[], @@ -19,14 +25,40 @@ type ProjModType = { } export default function AiHelperMod(props: PropsType) { + // 菜单状态是否可以编辑 + const [messageApi, contextHolder] = message.useMessage(); const [modArray, setModArray] = useState([]); const [newModArray, setNewModArray] = useState([]); - + const [id, setId] = useState('') + const [editModal, setEditModal] = useState(false) + const [updata, setUpdata] = useState([]) + const [status, setStatus] = useState('') + // const [items, setItems] = useState([]) + const pathParams = useParams(); useEffect(() => { + console.log('mods', props.mods); + setModArray(props.mods); setNewModArray(props.newMods); }, [props.mods, props.newMods]); + useEffect(() => { + if (updata.length != 0) { + console.log('更新数据', updata); + setModArray(updata) + } + }, [updata]) + useEffect(() => { + get({ + messageApi, + url: `/api/proj/get/${pathParams.projId}`, + onSuccess({ data }) { + console.log('其他页面状态判断', data); + setStatus(data.generate.generateStatus) + } + }) + + }, []) const modColumnArray: TableProps['columns'] = [ { title: '序号', @@ -38,8 +70,8 @@ export default function AiHelperMod(props: PropsType) { return index + 1 } }, - {title: '模块名称', dataIndex: 'modName', key: 'name', width: 200, align: 'center'}, - {title: '模块描述', dataIndex: 'modDesc', key: 'desc', align: 'center'}, + { title: '模块名称', dataIndex: 'modName', key: 'name', width: 200, align: 'center' }, + { title: '模块描述', dataIndex: 'modDesc', key: 'desc', align: 'center' }, { title: 'AI状态', dataIndex: 'aiFieldStatus', @@ -47,13 +79,13 @@ export default function AiHelperMod(props: PropsType) { width: 100, align: 'center', render: (value) => { - if(value == 'GENERATING') { + if (value == 'GENERATING') { return '处理中' } - if(value == 'FAILED') { + if (value == 'FAILED') { return '失败' } - if(value == 'SUCCESS') { + if (value == 'SUCCESS') { return '成功' } } @@ -65,33 +97,115 @@ export default function AiHelperMod(props: PropsType) { width: 80, align: 'center', render: (_value, record, index) => { - if(record.aiFieldStatus == 'GENERATING') { - return + if(status == 'SUCCESS' ){ + return( + + ) + }else if(status == 'GENERATING'){ + return( + + ) } - if(record.aiFieldStatus == 'FAILED') { - return + + else{ + if (record.aiFieldStatus == 'GENERATING') { + return + } + if (record.aiFieldStatus == 'FAILED') { + return + } + return ( + { + // props.handleEdit(index, record.projModId, record); + setId(record.projModId) + setEditModal(true) + } + }, { + key: 'remove', + label: '删除', + onClick: () => { + props.handleRemove(index, record.projModId, record); + } + }, + ] + }} placement="bottom" arrow> + + + ) } - return ( - { - props.handleEdit(index, record.projModId, record); - } - },{ - key: 'remove', - label: '删除', - onClick: () => { - props.handleRemove(index, record.projModId, record); - } - }, - ] }} placement="bottom" arrow> - - - ) + // if (record.aiFieldStatus == 'GENERATING') { + // return + // } + // if (record.aiFieldStatus == 'FAILED') { + // return + // } + // return ( + // { + // // props.handleEdit(index, record.projModId, record); + // setId(record.projModId) + // setEditModal(true) + // } + // }, { + // key: 'remove', + // label: '删除', + // onClick: () => { + // props.handleRemove(index, record.projModId, record); + // } + // }, + // ] + // }} placement="bottom" arrow> + // + // + // ) + // if (record.aiFieldStatus == 'SUCCESS' || status == 'GENERATING') { + // return ( + // + // + // + // ) + // }else{ + // return( + // { + // // props.handleEdit(index, record.projModId, record); + // setId(record.projModId) + // setEditModal(true) + // } + // }, { + // key: 'remove', + // label: '删除', + // onClick: () => { + // props.handleRemove(index, record.projModId, record); + // } + // }, + // ] + // }} placement="bottom" arrow> + // + // + // ) + // } } }, ]; @@ -107,8 +221,8 @@ export default function AiHelperMod(props: PropsType) { return index + 1 } }, - {title: '模块名称', dataIndex: 'name', key: 'name', width: 200, align: 'center'}, - {title: '模块描述', dataIndex: 'desc', key: 'desc', align: 'center'}, + { title: '模块名称', dataIndex: 'name', key: 'name', width: 200, align: 'center' }, + { title: '模块描述', dataIndex: 'desc', key: 'desc', align: 'center' }, { title: '确认', dataIndex: 'option', @@ -129,36 +243,41 @@ export default function AiHelperMod(props: PropsType) { return ( <> -
模块管理
-
+
模块管理
+
{newModArray.length > 0 ? 原模块 : <>} - +
{ newModArray.length > 0 ? ( <> 新模块
+ scroll={{ y: 240 }} pagination={false} rowKey="id" /> ) : <> } -
+
{ newModArray.length > 0 ? ( - - - ) : + }}> 重新生成 + + ) : }
+ { setEditModal(false) }} width={1200} > + + < EditModal id={id} onConfirm={() => setEditModal(false)} setUpdata={setUpdata} /> + + ) } \ No newline at end of file diff --git a/src/components/ai/text/AiHelperText.tsx b/src/components/ai/text/AiHelperText.tsx index a0a8df2..0f7f1e0 100644 --- a/src/components/ai/text/AiHelperText.tsx +++ b/src/components/ai/text/AiHelperText.tsx @@ -2,7 +2,12 @@ import {Button, Divider, Empty, Space} from "antd"; import TextArea from "antd/es/input/TextArea"; import {useEffect, useState} from "react"; import {CheckOutlined, EditOutlined, ReloadOutlined} from "@ant-design/icons"; +import { get } from "../../../util/AjaxUtils.ts"; +import { useParams } from "react-router-dom"; +import { + message +} from "antd"; type PropsType = { title: string; maxLength: number; @@ -13,6 +18,22 @@ type PropsType = { } export default function AiHelperText(props: PropsType) { + const pathParams = useParams(); + const [status, setStatus] = useState('') + + useEffect(() => { + get({ + messageApi, + url: `/api/proj/get/${pathParams.projId}`, + onSuccess({ data }) { + console.log('其他页面状态判断', data); + setStatus(data.generate.generateStatus) + } + }) + + }, []) + + const [messageApi, contextHolder] = message.useMessage(); const [text, setText] = useState(''); const [newText, setNewText] = useState(''); @@ -29,12 +50,16 @@ export default function AiHelperText(props: PropsType) { if (!isTextEdit) { return ( - { text ? ( - ) : <> diff --git a/src/components/card/CardProj.tsx b/src/components/card/CardProj.tsx index 6d61ed0..b2fdb80 100644 --- a/src/components/card/CardProj.tsx +++ b/src/components/card/CardProj.tsx @@ -188,7 +188,7 @@ export default function CardProj(props: { item: IProj }) {
- +
金额(￥) : diff --git a/src/components/list/ListProj.tsx b/src/components/list/ListProj.tsx index 3989ab6..1f0aace 100644 --- a/src/components/list/ListProj.tsx +++ b/src/components/list/ListProj.tsx @@ -1,14 +1,17 @@ import './list-proj.css' import CardProj from "../card/CardProj.tsx"; import { useRef, MutableRefObject, useState, useEffect, useContext } from "react"; -import { Pagination, message, Spin, Image } from 'antd'; +import { Pagination, message, Spin, Image, Empty } from 'antd'; import { get } from "../../util/AjaxUtils.ts"; import { IndexListContext } from "../../context/IndexListContext.ts"; import { IListPage } from "../../interfaces/listpage/IListPage.ts"; import { IProj } from "../../interfaces/proj/IProj.ts"; import NoData from "../../assets/no-data.png"; import { useLocation } from 'react-router-dom'; - +import syminga from '../../static/homeimg/homeimga.png' +import symingb from '../../static/homeimg/homeimgb.png' +import symingc from '../../static/homeimg/homeimgc.png' +import symingd from '../../static/homeimg/homeimgd.png' // import gpsImg from '../../static/right/gps.png' // import { Link } from "react-router-dom"; // import { Breadcrumb } from 'antd'; @@ -25,7 +28,7 @@ export default function ListProj() { // } const keywords = state ? state.keyword : '' // console.log(keywords); - + const images = [syminga,symingb,symingc,symingd] const listProjRef: MutableRefObject = useRef(null); const listRef: MutableRefObject = useRef(null); @@ -57,7 +60,14 @@ export default function ListProj() { console.log('看看结果', data); setPage(data.page); setTotal(data.total); - setProjs(data.rows); + // setProjs(data.rows); + const updatedArr = (data.rows).map((item, index) => ({ + ...item, + img: images[index % images.length] // 利用取余来循环填充图片 + })); + console.log('循环数组',updatedArr); + setProjs(updatedArr); + }, onFinally() { setIsLoading(false); @@ -77,8 +87,7 @@ export default function ListProj() { justifyContent: 'center', alignItems: 'center' }}> - - 暂无数据 +
) } @@ -93,7 +102,7 @@ export default function ListProj() { const renderCategory = () => { } - + useEffect(() => { if (indexListContext.categorys) { reqData(page); diff --git a/src/components/list/ListProjAgent.tsx b/src/components/list/ListProjAgent.tsx index 9577575..4037382 100644 --- a/src/components/list/ListProjAgent.tsx +++ b/src/components/list/ListProjAgent.tsx @@ -9,7 +9,7 @@ import {IListPage} from "../../interfaces/listpage/IListPage.ts"; import {IndexListContext} from "../../context/IndexListContext.ts"; import {IAgent} from "../../interfaces/agent/IAgent.ts"; import NoData from "../../assets/no-data.png"; - +// import { Empty } from 'antd'; // const {Search} = Input; export default function ListProjAgent() { diff --git a/src/components/menu/menu-tree.css b/src/components/menu/menu-tree.css index d429b3a..e922c59 100644 --- a/src/components/menu/menu-tree.css +++ b/src/components/menu/menu-tree.css @@ -1,16 +1,18 @@ .menu-tree { margin-top: 10px; + padding-right: 10px; } .menu-tree ul { /* margin-left: 10px; */ + } .menu-tree ul li { font-size: 15px; margin-top: 10px; margin-bottom: 10px; - padding-right: 10px; + /* padding-right: 10px; */ padding-left: 10px; /* background-color: aquamarine; */ } diff --git a/src/interfaces/proj/IProj.ts b/src/interfaces/proj/IProj.ts index d9e86f0..9c01ed2 100644 --- a/src/interfaces/proj/IProj.ts +++ b/src/interfaces/proj/IProj.ts @@ -74,7 +74,7 @@ export interface IProjMod { } export interface IProj { - + img?:string projId: string, projName: string; projContext: string; diff --git a/src/layout/head/Head.tsx b/src/layout/head/Head.tsx index ec3f7cb..61979ba 100644 --- a/src/layout/head/Head.tsx +++ b/src/layout/head/Head.tsx @@ -11,6 +11,7 @@ import PasswordChange from "../../components/password/PasswordChange.tsx"; // import headRightBg from '../../assets/head-right-bg.png'; import InvoiceList from "../../components/invoice/InvoiceList.tsx"; import logoImg from '../../static/head/logo.png' +import userImg from '../../static/homeimg/userimg.png' export default function Head() { const globalContext = useContext(GlobalContext); const globalDispatchContext = useContext(GlobalDispatchContext); @@ -96,7 +97,9 @@ export default function Head() { {/**/}
-
+
+ +
diff --git a/src/route/proj/ProjEdit.tsx b/src/route/proj/ProjEdit.tsx index 21fbd20..9c85d8e 100644 --- a/src/route/proj/ProjEdit.tsx +++ b/src/route/proj/ProjEdit.tsx @@ -29,7 +29,7 @@ type ProjModType = { } export default function ProjEdit() { - + // 判断是否完成状态 成功未处理/失败/正在处理 // 模块数量 const [projModCount, setprojModCount] = useState(0) const height = window.innerHeight - 180; @@ -338,7 +338,7 @@ export default function ProjEdit() { status={EditStepEnum.UN_EDIT} canBtnClick={canGenerate} handleEdit={() => { - setIsGenerateModalOpen(true); + setIsGenerateModalOpen(true); // setTimeout(() => { // window.location.reload(); // }, 1000) diff --git a/src/route/proj/ProjNew.tsx b/src/route/proj/ProjNew.tsx index 3157a4f..2fc0b71 100644 --- a/src/route/proj/ProjNew.tsx +++ b/src/route/proj/ProjNew.tsx @@ -5,7 +5,7 @@ import { useContext, useEffect, useState } from "react"; import { get, post } from "../../util/AjaxUtils.ts"; import { IProjCharge, ProjAdditionalType, ProjChargeType } from "../../interfaces/proj/IProj.ts"; import { GlobalDispatchContext, reloadUser } from "../../context/GlobalContext.ts"; -const { TextArea } = Input; +// const { TextArea } = Input; type ProjInfo = { projName: string; projIntroduction: string; @@ -100,7 +100,7 @@ export default function ProjNew() { layout={'vertical'} labelCol={{ span: 24 }} wrapperCol={{ span: 24 }} - style={{ width: 500 }} + style={{ width: '100%' }} onFinish={(formData) => { setIsCreateModalOpen(true); setProjInfo({ @@ -116,20 +116,18 @@ export default function ProjNew() { name="projName" rules={[{ required: true, message: '请输入系统标题' }]} > - +
-
+ {/*
简单描述
name="projIntroduction" - // rules={[{required: true, message: '请输入系统标题'}]} >