From 74d6a0543ee971f7986d617552900013f93d6046 Mon Sep 17 00:00:00 2001 From: xixi <123@qq.com> Date: Mon, 22 Jul 2024 17:22:35 +0800 Subject: [PATCH] =?UTF-8?q?ai=E5=BC=B9=E7=AA=97=E6=B7=BB=E5=8A=A0=E6=A0=B7?= =?UTF-8?q?=E5=BC=8F=E9=80=89=E6=8B=A9?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/ai/AiHelper.tsx | 240 +++++++++++++++++++- src/components/ai/ai-helper.css | 6 + src/route/index/Index.tsx | 6 +- src/route/proj/ProjEdit.tsx | 2 +- src/route/proj/ProjEditFree.tsx | 2 +- src/route/proj/edit/ProjConfigLoginpage.tsx | 126 +++++----- src/route/proj/edit/ProjEditStep1.tsx | 4 +- 7 files changed, 304 insertions(+), 82 deletions(-) diff --git a/src/components/ai/AiHelper.tsx b/src/components/ai/AiHelper.tsx index 5820590..4107d5b 100644 --- a/src/components/ai/AiHelper.tsx +++ b/src/components/ai/AiHelper.tsx @@ -1,11 +1,12 @@ import './ai-helper.css' import { useContext, useEffect, useRef, useState } from "react"; import { GlobalContext } from "../../context/GlobalContext.ts"; -import { del, get, post, put, websocketUrl } from "../../util/AjaxUtils.ts"; +import { del, get, post, put, websocketUrl, Axios } from "../../util/AjaxUtils.ts"; import { // Col, Divider, Row, - Spin + Spin, Image, Pagination } from "antd"; +import { AxiosResponse } from "axios"; import useMessage from "antd/es/message/useMessage"; import AiHelperText from "./text/AiHelperText.tsx"; import AiHelperMod from "./mod/AiHelperMod.tsx"; @@ -32,8 +33,46 @@ type ProjModType = { } export default function AiHelper(props: PropsType) { - - // const pathParams = useParams(); + // 页面样式相关 + const [pageImgArray, setpageImgArray] = useState([]) + const [pageTotal, setPageTotal] = useState(0) + const [codeTypePageId, setcodeTypePageId] = useState('') + // 获取页面样式数据 + const getData = () => { + get({ + messageApi, + url: `/api/proj/get/edit-step1/${props.projId}`, + onSuccess({ data }: AxiosResponse) { + // console.log('嘻嘻', data); + + + setcodeTypePageId(data.codeTypePage.codeTypePageId) + + } + }) + } + // const [selectedImg,setSelectedImg] = useState('') + // 获取页面样式图片等信息 + const getPageImgData = (page: number) => { + get({ + messageApi, + url: `/api/code/type/page/listpage`, + config: { + params: { + page: page, + rows: 10 + } + }, + onSuccess(data: any) { + console.log(data); + setPageTotal(data.data.total) + setpageImgArray(data.data.rows) + } + }) + } + const height = window.innerHeight - 265; + + // const pathParams = useParams(); // const [openModal ,setOpenModal] = useState(false) //是提示替换弹框 // const height = window.innerHeight - 280; const globalContext = useContext(GlobalContext); @@ -71,6 +110,50 @@ export default function AiHelper(props: PropsType) { // } + + + + + // 选择页面id和img(初始化用) + // const [modalId, setModalId] = useState('') + // const [modalImg, setModalImg] = useState('') + // 登录页面 + const [total, setTotal] = useState(0) + const [loginpageId, setloginpageId] = useState(''); + // 获取登录页面信息 + const getLoginPageInfo = () => { + get({ + messageApi, + url: `/api/proj/get/config-loginpage/${props.projId}`, + onSuccess({ data }) { + // console.log('北京信息',data); + setloginpageId(data.loginpageId) + } + }) + } + + // 登陆页面数组 + const [loginpageArray, setloginpageArray] = useState([]) + // 获取登录页面数组 + const getlistLoginpage = (page: number) => { + get({ + messageApi, + url: '/api/loginpage/listpage', + config: { + params: { + page: page, + rows: 10 + } + }, + onSuccess({ data }) { + console.log('登录页图片列表', data); + setloginpageArray(data.rows) + + setTotal(data.total) + + } + }) + } const ping = () => { clearTimeout(pingTimeout.current); pingTimeout.current = setTimeout(() => { @@ -102,7 +185,7 @@ export default function AiHelper(props: PropsType) { // if (!projIntroduction) { // setProjIntroduction(data.content) // updateProjIntroduction(data.content); - + // } } else if (data.type == 'REFRESH_PROJ_DESC') { setIsProjDescLoading(false); @@ -110,7 +193,7 @@ export default function AiHelper(props: PropsType) { // if (!projDesc) { // setProjDesc(data.content) // updateProjDesc(data.content) - + // } } else if (data.type == 'REFRESH_PROJ_MODS') { setIsProjModArrayLoading(false); @@ -192,8 +275,8 @@ export default function AiHelper(props: PropsType) { messageApi.success('保存成功,点击编辑按钮可继续修改项目简介'); setProjIntroduction(content); setNewProjIntroduction(''); - console.log('更新成功',data); - + console.log('更新成功', data); + }, onFinally() { setIsProjIntroductionLoading(false) @@ -234,11 +317,14 @@ export default function AiHelper(props: PropsType) { listMods(); websocket(); + }, [globalContext.user.userId, props.projId]); - useEffect(()=>{ - - - },[]) + useEffect(() => { + // getLoginPageInfo() + getlistLoginpage(1) + // getData() + getPageImgData(1) + }, []) return (
{messageApiHolder} @@ -384,6 +470,23 @@ export default function AiHelper(props: PropsType) { > 功能列表
+
{ + setActiveTab('登录') + getLoginPageInfo() + }} + > + 登录页面 +
+
{ + setActiveTab('页面') + getData() + + }} + > + 页面样式 +
@@ -509,7 +612,119 @@ export default function AiHelper(props: PropsType) {
+
+
+ { + loginpageArray.map((item) => { + const imgSrc = `${Axios.defaults?.baseURL}/route/file/v2/download/true/${item.previewImgs}`; + return ( +
{ + setloginpageId(item.loginpageId) + put({ + messageApi, + url: `/api/proj/update-loginpage-id/proj-id/${props.projId}/loginpage-id/${item.loginpageId}`, + + onSuccess() { + messageApi.open({ + type: 'success', + content: '已更改' + }) + getLoginPageInfo() + // props.closeModal() + // props.closeModal() + + + }, + + }) + }} + > +
+ +
+
+
+ {/*
{props.title ? props.title : '标题'}
*/} +
+
+ ) + }) + } + +
+
+ {/* defaultCurrent: 默认当前页数 total:数据总数 defaultPageSize:'页面显示几条' */} + { + console.log(page); + // setPage(page) + setloginpageArray([]) + getlistLoginpage(page) + }} /> +
+ +
+ +
+
+ { + pageImgArray.map((item) => { + const imgSrc = `${Axios.defaults?.baseURL}/route/file/v2/download/true/${item.previewImgs}`; + return ( +
{ + // setSelectedId(item.codeTypePageId) + // setSelectedImg(item.previewImgs) + setcodeTypePageId(item.codeTypePageId) + put({ + messageApi, + // url: `/api/proj/update/edit-step1/${props.projId}`, + url: `/api/proj/update-code-type-page-id/proj-id/${props.projId}/code-page-type-id/${item.codeTypePageId}`, + + + onSuccess() { + messageApi.open({ + type: 'success', + content: '已更改' + }) + getData() + + }, + + }) + }} + > +
+ +
+
+
+ {/*
{props.title ? props.title : '标题'}
*/} +
+
+ ) + }) + } + +
+
+ {/* defaultCurrent: 默认当前页数 total:数据总数 defaultPageSize:'页面显示几条' */} + { + console.log(page); + // setPage(page) + setpageImgArray([]) + getPageImgData(page) + }} /> +
+ +
{/*
项目简介
@@ -517,6 +732,7 @@ export default function AiHelper(props: PropsType) { 项目详情 */} + ) } \ No newline at end of file diff --git a/src/components/ai/ai-helper.css b/src/components/ai/ai-helper.css index 32c4099..ed1b3d6 100644 --- a/src/components/ai/ai-helper.css +++ b/src/components/ai/ai-helper.css @@ -39,4 +39,10 @@ width: 100%; /* background-color: pink; */ +} + +.loginPageBox{ + display: flex; + margin-top: 20px; + box-sizing: border-box; } \ No newline at end of file diff --git a/src/route/index/Index.tsx b/src/route/index/Index.tsx index fe3e4a9..4ec9b5b 100644 --- a/src/route/index/Index.tsx +++ b/src/route/index/Index.tsx @@ -4,7 +4,7 @@ import { MouseEvent, Reducer, useEffect, useReducer, useState } from "react"; import { useNavigate, useSearchParams, Outlet } from "react-router-dom"; import { IMenuListItem, IMenuWithTopButton } from "../../interfaces/menu/IMenuWithTopButton.ts"; import MenuWithTopButton from "../../components/menu/MenuWithTopButton.tsx"; -import MenuWithBottomButtom from '../../components/menu/MenuWithBottomButton.tsx' +// import MenuWithBottomButtom from '../../components/menu/MenuWithBottomButton.tsx' import MenuTreeWithTopButton from "../../components/menu/MenuTreeWithTopButton.tsx"; // import ListProj from "../../components/list/ListProj.tsx"; // import ListProjAgent from "../../components/list/ListProjAgent.tsx"; @@ -388,7 +388,7 @@ export default function Index() { list={agentMenu.list} handleListItem={agentMenu.handleListItem} /> */} - + /> */}
diff --git a/src/route/proj/ProjEdit.tsx b/src/route/proj/ProjEdit.tsx index 11ce19b..6ff00c0 100644 --- a/src/route/proj/ProjEdit.tsx +++ b/src/route/proj/ProjEdit.tsx @@ -354,7 +354,7 @@ export default function ProjEdit() { if(aiHelper.projIntroduction && aiHelper.projDesc && data.length > 0){ setAiHelperModalOpen(false); }else{ - messageApi.error('必须完成三项ai生成才可关闭弹窗'); + messageApi.error('须完成系统简介,系统详情,功能列表的生成才可关闭弹窗'); } }, diff --git a/src/route/proj/ProjEditFree.tsx b/src/route/proj/ProjEditFree.tsx index 0623bc1..c582c78 100644 --- a/src/route/proj/ProjEditFree.tsx +++ b/src/route/proj/ProjEditFree.tsx @@ -96,7 +96,7 @@ export default function ProjEdit() { if(aiHelper.projIntroduction && aiHelper.projDesc && data.length > 0){ setAiHelperModalOpen(false); }else{ - messageApi.error('必须完成三项ai生成才可关闭弹窗'); + messageApi.error('须完成系统简介,系统详情,功能列表的生成才可关闭弹窗'); } }, diff --git a/src/route/proj/edit/ProjConfigLoginpage.tsx b/src/route/proj/edit/ProjConfigLoginpage.tsx index 7a1a7e7..6c9a0cf 100644 --- a/src/route/proj/edit/ProjConfigLoginpage.tsx +++ b/src/route/proj/edit/ProjConfigLoginpage.tsx @@ -48,15 +48,15 @@ export default function ProjConfigLoginpage(props: any) { const height = window.innerHeight - 200; const [loginpageArray, setloginpageArray] = useState([]) // const [page,setPage] = useState(1) - const [total ,setTotal] = useState(0) + const [total, setTotal] = useState(0) const [selectedLoginpageId, setSelectedLoginpageId] = useState(''); // 选择页面id和img(初始化用) - const [modalId,setModalId] = useState('') - const [modalImg,setModalImg] = useState('') + const [modalId, setModalId] = useState('') + const [modalImg, setModalImg] = useState('') const [selectImgs, setSelectImgs] = useState('') const [projId] = useState(pathParams.projId ? pathParams.projId : props.projId) // 选择登陆页面弹窗 - const [selectImgModal,setSelectImgModal] = useState(false) + const [selectImgModal, setSelectImgModal] = useState(false) const beforeUpload = (file: FileType) => { const isJpgOrPng = file.type === 'image/jpeg' || file.type === 'image/png'; if (!isJpgOrPng) { @@ -83,7 +83,7 @@ export default function ProjConfigLoginpage(props: any) { } }) } - const getlistLoginpage = (page:number) => { + const getlistLoginpage = (page: number) => { get({ messageApi, url: '/api/loginpage/listpage', @@ -108,11 +108,11 @@ export default function ProjConfigLoginpage(props: any) { // url: `/api/proj/get/config-loginpage/${projId}`, // onSuccess({ data }) { // if (data.loginpageId) { - + // const imgs = newData.filter((item: { loginpageId: any; }) => item.loginpageId === data.loginpageId) - + // setSelectImgs(imgs[0].previewImgs) - + // } @@ -166,23 +166,23 @@ export default function ProjConfigLoginpage(props: any) { onSuccess({ data }) { console.log('数据', data); // if(data.adminPassword adminUsername) - form.setFieldValue('adminUsername', data.adminUsername?data.adminUsername:'admin'); - form.setFieldValue('adminPassword', data.adminPassword?data.adminPassword:'admin'); + form.setFieldValue('adminUsername', data.adminUsername ? data.adminUsername : 'admin'); + form.setFieldValue('adminPassword', data.adminPassword ? data.adminPassword : 'admin'); // if (data.loginpageId) { - form.setFieldValue('loginpageId', data.loginpageId); - setSelectedLoginpageId(data.loginpageId); - // lyp - // const imgs = loginpageArray.filter(item => item.loginpageId === data.loginpageId) - // ?.previewImgs; - setSelectImgs(data.loginpagePreviewImgs) + form.setFieldValue('loginpageId', data.loginpageId); + setSelectedLoginpageId(data.loginpageId); + // lyp + // const imgs = loginpageArray.filter(item => item.loginpageId === data.loginpageId) + // ?.previewImgs; + setSelectImgs(data.loginpagePreviewImgs) - setModalId(data.loginpageId) - form.setFieldValue('subTitle', data.subTitle); - form.setFieldValue('copyrightOwner', data.copyrightOwner); - form.setFieldValue('copyrightDate', data.copyrightDate); - // form.setFieldValue('adminUsername', data.adminUsername?data.adminUsername:'admin'); - // form.setFieldValue('adminPassword', data.adminPassword?data.adminPassword:'admin'); - preview() + setModalId(data.loginpageId) + form.setFieldValue('subTitle', data.subTitle); + form.setFieldValue('copyrightOwner', data.copyrightOwner); + form.setFieldValue('copyrightDate', data.copyrightDate); + // form.setFieldValue('adminUsername', data.adminUsername?data.adminUsername:'admin'); + // form.setFieldValue('adminPassword', data.adminPassword?data.adminPassword:'admin'); + preview() // } else { // getDefaultID() // } @@ -266,7 +266,7 @@ export default function ProjConfigLoginpage(props: any) { -
+
登陆页面设置
{/*
*/} -
-
用户名:
+
+
用户名:
- - + - -
-
-
密码:
+ }} /> + +
+
+
密码:
- - + - + }} /> + {/*
*/}
@@ -559,8 +559,8 @@ export default function ProjConfigLoginpage(props: any) { }) }
*/} -
选择登陆页面: -
(点击图片选择背景)
+
选择登录页面: +
(点击图片选择背景)
{ // console.log(selectImgs); @@ -572,9 +572,9 @@ export default function ProjConfigLoginpage(props: any) {
- +
- +
@@ -639,21 +639,21 @@ export default function ProjConfigLoginpage(props: any) { width={1070} style={{ position: 'relative' }} onOk={() => { - + form.setFieldValue('loginpageId', modalId) preview() - if(modalImg){ + if (modalImg) { setSelectImgs(modalImg) setSelectedLoginpageId(modalId); } setSelectImgModal(false) - + }} onCancel={() => { setModalId(selectedLoginpageId) setSelectImgModal(false) - + }} > @@ -664,7 +664,7 @@ export default function ProjConfigLoginpage(props: any) { const imgSrc = `${Axios.defaults?.baseURL}/route/file/v2/download/true/${item.previewImgs}`; return (
{ setModalId(item.loginpageId) setModalImg(item.previewImgs) @@ -673,7 +673,7 @@ export default function ProjConfigLoginpage(props: any) {
+ preview={false} width={500} height={270} />
diff --git a/src/route/proj/edit/ProjEditStep1.tsx b/src/route/proj/edit/ProjEditStep1.tsx index e838d87..9d44b64 100644 --- a/src/route/proj/edit/ProjEditStep1.tsx +++ b/src/route/proj/edit/ProjEditStep1.tsx @@ -326,7 +326,7 @@ export default function ProjEditStep1(props: any) { const imgSrc = `${Axios.defaults?.baseURL}/route/file/v2/download/true/${item.previewImgs}`; return (
{ setSelectedId(item.codeTypePageId) setSelectedImg(item.previewImgs) @@ -336,7 +336,7 @@ export default function ProjEditStep1(props: any) { + preview={false} width={500} height={250} />