From 1c39c7435087d66cbfe4498962ae36ffecb8031d Mon Sep 17 00:00:00 2001 From: xion Date: Tue, 8 Oct 2024 10:56:19 +0800 Subject: [PATCH] fix: delete confirm add --- src/admin-page/user-manage/edit/List.tsx | 207 +++++++++++++++++++ src/admin-page/user-manage/index.tsx | 15 ++ src/admin-page/user-manage/layouts/index.tsx | 4 + src/admin-page/user-manage/login/Login.tsx | 58 ++++++ src/admin-page/user-manage/store/index.ts | 69 +++++++ src/admin-page/user-manage/store/login.ts | 59 ++++++ src/pages/ai-agent/edit/List.tsx | 7 + src/pages/ai-chat/AiModule.tsx | 18 +- src/pages/app/edit/AppVersionList.tsx | 11 +- src/pages/app/edit/List.tsx | 13 +- src/pages/chat-manager/chat-prompt/List.tsx | 8 +- src/pages/chat-manager/history/List.tsx | 15 +- src/pages/chat-manager/session/List.tsx | 13 +- src/pages/container/edit/List.tsx | 16 +- src/pages/container/layouts/index.tsx | 35 +--- src/pages/file/edit/List.tsx | 8 +- src/pages/org/edit/List.tsx | 8 +- src/pages/panel/edit/List.tsx | 11 +- src/pages/prompt/edit/List.tsx | 9 +- src/pages/user/edit/List.tsx | 8 +- 20 files changed, 537 insertions(+), 55 deletions(-) create mode 100644 src/admin-page/user-manage/edit/List.tsx create mode 100644 src/admin-page/user-manage/index.tsx create mode 100644 src/admin-page/user-manage/layouts/index.tsx create mode 100644 src/admin-page/user-manage/login/Login.tsx create mode 100644 src/admin-page/user-manage/store/index.ts create mode 100644 src/admin-page/user-manage/store/login.ts diff --git a/src/admin-page/user-manage/edit/List.tsx b/src/admin-page/user-manage/edit/List.tsx new file mode 100644 index 0000000..b295fba --- /dev/null +++ b/src/admin-page/user-manage/edit/List.tsx @@ -0,0 +1,207 @@ +import { Button, Input, message, Modal, Table } from 'antd'; +import { Fragment, useEffect, useMemo, useState } from 'react'; +import { useUserStore } from '../store'; +import { useShallow } from 'zustand/react/shallow'; +import { Form } from 'antd'; +import { useNavigate } from 'react-router'; +import { EditOutlined, SettingOutlined, LinkOutlined, SaveOutlined, DeleteOutlined, LeftOutlined, PlusOutlined } from '@ant-design/icons'; +import clsx from 'clsx'; +import { isObjectNull } from '@/utils/is-null'; +import { CardBlank } from '@/components/card/CardBlank'; + +const FormModal = () => { + const [form] = Form.useForm(); + const userStore = useUserStore( + useShallow((state) => { + return { + showEdit: state.showEdit, + setShowEdit: state.setShowEdit, + formData: state.formData, + updateData: state.updateData, + setFormData: state.setFormData, + }; + }), + ); + useEffect(() => { + const open = userStore.showEdit; + if (open) { + const isNull = isObjectNull(userStore.formData); + if (isNull) { + form.setFieldsValue({}); + } else form.setFieldsValue(userStore.formData); + } + }, [userStore.showEdit]); + const onFinish = async (values: any) => { + userStore.updateData(values); + }; + const onClose = () => { + userStore.setShowEdit(false); + form.setFieldsValue({}); + userStore.setFormData({}); + }; + const isEdit = userStore.formData.id; + return ( + userStore.setShowEdit(false)} + destroyOnClose + footer={false} + width={800} + onCancel={onClose}> +
+ + + + + + + + + + + +
+ + ); +}; +export const List = () => { + const navicate = useNavigate(); + const userStore = useUserStore( + useShallow((state) => { + return { + setFormData: state.setFormData, + setShowEdit: state.setShowEdit, + list: state.list, + deleteData: state.deleteData, + getList: state.getList, + loading: state.loading, + updateData: state.updateData, + formData: state.formData, + }; + }), + ); + const [codeEdit, setCodeEdit] = useState(false); + const [code, setCode] = useState(''); + useEffect(() => { + userStore.getList(); + }, []); + + const onAdd = () => { + userStore.setFormData({}); + userStore.setShowEdit(true); + }; + return ( +
+
+ +
+
+
+
+ {userStore.list.length > 0 && + userStore.list.map((item) => { + return ( + +
{ + setCode(item.code); + userStore.setFormData(item); + setCodeEdit(true); + }}> +
+
{ + e.stopPropagation(); + // message.success('copy code success'); + }}> + {item.username || '-'} +
+
{item.description ? item.description : '-'}
+
+
+ + + + +
+
+ + ); + })} + + {userStore.list.length == 0 && ( +
+ No Data +
+ )} +
+
+
+
+
+ + +
+
+
+ { + // setCode(value); + }} + className='h-full max-h-full scrollbar' + style={{ overflow: 'auto' }} + /> +
+
+
+ +
+ ); +}; diff --git a/src/admin-page/user-manage/index.tsx b/src/admin-page/user-manage/index.tsx new file mode 100644 index 0000000..5d09c8e --- /dev/null +++ b/src/admin-page/user-manage/index.tsx @@ -0,0 +1,15 @@ +import { Navigate, Route, Routes } from 'react-router-dom'; +import { List } from './edit/List'; +import { Main } from './layouts'; +import { Login } from './login/Login'; +export const App = () => { + return ( + + }> + }> + } /> + + } /> + + ); +}; diff --git a/src/admin-page/user-manage/layouts/index.tsx b/src/admin-page/user-manage/layouts/index.tsx new file mode 100644 index 0000000..be7811e --- /dev/null +++ b/src/admin-page/user-manage/layouts/index.tsx @@ -0,0 +1,4 @@ +import { LayoutMain } from '@/modules/layout'; +export const Main = () => { + return ; +}; diff --git a/src/admin-page/user-manage/login/Login.tsx b/src/admin-page/user-manage/login/Login.tsx new file mode 100644 index 0000000..7a1a99c --- /dev/null +++ b/src/admin-page/user-manage/login/Login.tsx @@ -0,0 +1,58 @@ +import { Button, Form, Input } from 'antd'; +import { useLoginStore } from '../store/login'; +import { useShallow } from 'zustand/react/shallow'; +import { useEffect } from 'react'; +import { isObjectNull } from '@/utils/is-null'; +export const Login = () => { + const [form] = Form.useForm(); + const loginStore = useLoginStore( + useShallow((state) => { + return { + login: state.login, + formData: state.formData, + setFormData: state.setFormData, + }; + }), + ); + useEffect(() => { + const isNull = isObjectNull(loginStore.formData); + if (isNull) { + form.setFieldsValue({}); + } else { + form.setFieldsValue(loginStore.formData); + } + }, [loginStore.formData]); + const onFinish = (values: any) => { + loginStore.setFormData(values); + loginStore.login(); + }; + return ( +
+
+

Login

+
+
+ + + + + + + +
+ +
+ +
+
+
+
+ ); +}; diff --git a/src/admin-page/user-manage/store/index.ts b/src/admin-page/user-manage/store/index.ts new file mode 100644 index 0000000..cede8cf --- /dev/null +++ b/src/admin-page/user-manage/store/index.ts @@ -0,0 +1,69 @@ +import { create } from 'zustand'; +import { query } from '@/modules'; +import { message } from 'antd'; +type UserStore = { + showEdit: boolean; + setShowEdit: (showEdit: boolean) => void; + formData: any; + setFormData: (formData: any) => void; + loading: boolean; + setLoading: (loading: boolean) => void; + list: any[]; + getList: () => Promise; + updateData: (data: any) => Promise; + deleteData: (id: string) => Promise; +}; +export const useUserStore = create((set, get) => { + return { + showEdit: false, + setShowEdit: (showEdit) => set({ showEdit }), + formData: {}, + setFormData: (formData) => set({ formData }), + loading: false, + setLoading: (loading) => set({ loading }), + list: [], + getList: async () => { + set({ loading: true }); + + const res = await query.post({ + path: 'user', + key: 'list', + }); + set({ loading: false }); + if (res.code === 200) { + set({ list: res.data }); + } else { + message.error(res.message || 'Request failed'); + } + }, + updateData: async (data) => { + const { getList } = get(); + const res = await query.post({ + path: 'user', + key: 'update', + data, + }); + if (res.code === 200) { + message.success('Success'); + set({ showEdit: false, formData: [] }); + getList(); + } else { + message.error(res.message || 'Request failed'); + } + }, + deleteData: async (id) => { + const { getList } = get(); + const res = await query.post({ + path: 'user', + key: 'delete', + id, + }); + if (res.code === 200) { + getList(); + message.success('Success'); + } else { + message.error(res.message || 'Request failed'); + } + }, + }; +}); diff --git a/src/admin-page/user-manage/store/login.ts b/src/admin-page/user-manage/store/login.ts new file mode 100644 index 0000000..047dc1a --- /dev/null +++ b/src/admin-page/user-manage/store/login.ts @@ -0,0 +1,59 @@ +import { query } from '@/modules'; +import { message } from 'antd'; +import { create } from 'zustand'; +import { history } from '@/utils/history'; +type LoginStore = { + loading: boolean; + setLoading: (loading: boolean) => void; + formData: any; + setFormData: (formData: any) => void; + login: () => Promise; + register: () => Promise; + isLogin: boolean; + setIsLogin: (isLogin: boolean) => void; +}; +export const useLoginStore = create((set, get) => { + return { + loading: false, + setLoading: (loading) => set({ loading }), + formData: {}, + setFormData: (formData) => set({ formData }), + login: async () => { + const { formData } = get(); + const { username, password } = formData; + if (!username || !password) { + message.error('Please input username and password'); + return; + } + set({ loading: true }); + const loaded = message.loading('loading...', 0); + const res = await query.post({ path: 'user', key: 'login', username, password }); + loaded(); + if (res.code === 200) { + const { token } = res.data; + message.success('Success'); + set({ isLogin: true }); + localStorage.setItem('token', token); + // 跳到某一个页面，更新localStorage + history.push('/map'); + } else { + message.error(res.message || 'Request failed'); + } + }, + register: async () => { + set({ loading: true }); + const loaded = message.loading('loading...', 0); + const res = await query.post({ path: 'user', key: 'register' }); + loaded(); + if (res.code === 200) { + message.success('Success'); + // 跳到某一个页面 + // history.push('/map', {}, true); + } else { + message.error(res.message || 'Request failed'); + } + }, + isLogin: false, + setIsLogin: (isLogin) => set({ isLogin }), + }; +}); diff --git a/src/pages/ai-agent/edit/List.tsx b/src/pages/ai-agent/edit/List.tsx index cc88d39..6da90e3 100644 --- a/src/pages/ai-agent/edit/List.tsx +++ b/src/pages/ai-agent/edit/List.tsx @@ -135,6 +135,13 @@ export const List = () => { onClick={(e) => { // agentStore.deleteData(item.id); message.error('Not implemented'); + // Modal.confirm({ + // title: 'Delete', + // content: 'Are you sure delete this data?', + // onOk: () => { + // agentStore.deleteData(item.id); + // }, + // }); e.stopPropagation(); }} icon={}> diff --git a/src/pages/ai-chat/AiModule.tsx b/src/pages/ai-chat/AiModule.tsx index a4462e5..5d27f9c 100644 --- a/src/pages/ai-chat/AiModule.tsx +++ b/src/pages/ai-chat/AiModule.tsx @@ -2,14 +2,14 @@ import { useShallow } from 'zustand/react/shallow'; import { useAiStore } from './store/ai-store'; import { CloseOutlined, HistoryOutlined, PlusOutlined } from '@ant-design/icons'; import { Button, Dropdown, Form, Input, message, Modal, Tooltip } from 'antd'; -import { useEffect, useMemo, useState } from 'react'; +import { useEffect, useLayoutEffect, useMemo, useState } from 'react'; import { TextArea } from '../container/components/TextArea'; import clsx from 'clsx'; import { query } from '@/modules'; import { nanoid } from 'nanoid'; import { ChatMessage } from './module/ChatMessage'; import { isObjectNull } from '@/utils/is-null'; -import { useNavigate } from 'react-router'; +import { useLocation, useNavigate } from 'react-router'; const testId = '60aca66b-4be9-4266-9568-6001032c7e13'; const NormalMessage = ({ onSend }: { onSend: any }) => { const [message, setMessage] = useState(''); @@ -194,6 +194,8 @@ export const AiMoudle = () => { }), ); const [noPrompt, setNoPrompt] = useState(false); + const [currentPage, setCurrentPage] = useState(''); + const location = useLocation(); useEffect(() => { if (!aiStore.open) { return; @@ -204,7 +206,6 @@ export const AiMoudle = () => { } else { form.setFieldsValue({ inputs: [] }); } - console.log('formData', aiStore.formData); }, [aiStore.open, aiStore.formData]); useEffect(() => { if (!aiStore.open) { @@ -214,6 +215,12 @@ export const AiMoudle = () => { } }, [aiStore.open]); const { send } = useListenQuery(); + useLayoutEffect(() => { + if (aiStore.open) { + aiStore.setOpen(false); + } + }, [location.pathname]); + const onSend = () => { const data = form.getFieldsValue(); send({ type: 'messages', data: { ...data, root: true } }); @@ -221,11 +228,12 @@ export const AiMoudle = () => { const onSendNoPrompt = (value) => { send({ type: 'messages', data: { message: value, root: true } }); }; + const inputs = useMemo(() => { if (!aiStore.open) return []; - const inputs = form.getFieldValue('inputs'); + const inputs = aiStore.formData?.inputs || []; return inputs; - }, [aiStore.open]); + }, [aiStore.open, aiStore.formData]); const isNotShow = inputs?.length === 0 || !inputs; const OnlyNormalMessage = ( diff --git a/src/pages/app/edit/AppVersionList.tsx b/src/pages/app/edit/AppVersionList.tsx index d0f79fc..5250c52 100644 --- a/src/pages/app/edit/AppVersionList.tsx +++ b/src/pages/app/edit/AppVersionList.tsx @@ -160,8 +160,15 @@ export const AppVersionList = () => { /> */} - + diff --git a/src/pages/chat-manager/chat-prompt/List.tsx b/src/pages/chat-manager/chat-prompt/List.tsx index d27679a..7775335 100644 --- a/src/pages/chat-manager/chat-prompt/List.tsx +++ b/src/pages/chat-manager/chat-prompt/List.tsx @@ -141,7 +141,13 @@ export const List = () => { diff --git a/src/pages/chat-manager/history/List.tsx b/src/pages/chat-manager/history/List.tsx index 452ef5a..2cc5a44 100644 --- a/src/pages/chat-manager/history/List.tsx +++ b/src/pages/chat-manager/history/List.tsx @@ -2,7 +2,7 @@ import { useShallow } from 'zustand/react/shallow'; import { useHistoryStore } from '../store/history'; import { useEffect } from 'react'; import { CardBlank } from '@/components/card/CardBlank'; -import { Button, Tooltip } from 'antd'; +import { Button, Modal, Tooltip } from 'antd'; import { DeleteOutlined } from '@ant-design/icons'; export const List = () => { @@ -33,7 +33,18 @@ export const List = () => {
- +
diff --git a/src/pages/chat-manager/session/List.tsx b/src/pages/chat-manager/session/List.tsx index 87d7d57..22d84af 100644 --- a/src/pages/chat-manager/session/List.tsx +++ b/src/pages/chat-manager/session/List.tsx @@ -121,7 +121,18 @@ export const List = () => { icon={}> - + diff --git a/src/pages/container/edit/List.tsx b/src/pages/container/edit/List.tsx index 40e6fd2..7e0627a 100644 --- a/src/pages/container/edit/List.tsx +++ b/src/pages/container/edit/List.tsx @@ -6,7 +6,7 @@ import { useShallow } from 'zustand/react/shallow'; import { Form } from 'antd'; import copy from 'copy-to-clipboard'; import { useNavigate } from 'react-router'; -import { EditOutlined, SettingOutlined, LinkOutlined, SaveOutlined, DeleteOutlined, LeftOutlined, MessageOutlined } from '@ant-design/icons'; +import { EditOutlined, SettingOutlined, LinkOutlined, SaveOutlined, DeleteOutlined, LeftOutlined, MessageOutlined, PlusOutlined } from '@ant-design/icons'; import clsx from 'clsx'; import { isObjectNull } from '@/utils/is-null'; import { CardBlank } from '@/components/card/CardBlank'; @@ -124,7 +124,10 @@ export const ContainerList = () => { containerStore.setShowEdit(true); }; return ( -
+
+
+ +
@@ -180,7 +183,14 @@ export const ContainerList = () => { icon={}> diff --git a/src/pages/container/layouts/index.tsx b/src/pages/container/layouts/index.tsx index 2886afb..5e49fcd 100644 --- a/src/pages/container/layouts/index.tsx +++ b/src/pages/container/layouts/index.tsx @@ -1,38 +1,5 @@ -import { PlusOutlined } from '@ant-design/icons'; -import { Button } from 'antd'; -import { Outlet, useLocation } from 'react-router'; -import { useContainerStore } from '../store'; -import { useEffect } from 'react'; -import { useShallow } from 'zustand/react/shallow'; -import { AiMoudle } from '@/pages/ai-chat'; import { LayoutMain } from '@/modules/layout'; export const Main = () => { - const containerStore = useContainerStore( - useShallow((state) => { - return { - setFormData: state.setFormData, - setShowEdit: state.setShowEdit, - }; - }), - ); - const location = useLocation(); - const isEdit = location.pathname.includes('edit/list'); - return ( - - Container -
); @@ -106,6 +109,9 @@ export const List = () => { onClick={() => { userAppStore.getFile(item.name); }}> +
+ +
{name}
size: {size}
diff --git a/src/pages/org/edit/List.tsx b/src/pages/org/edit/List.tsx index 2ab5df9..e0989b1 100644 --- a/src/pages/org/edit/List.tsx +++ b/src/pages/org/edit/List.tsx @@ -156,7 +156,13 @@ export const List = () => { icon={}> diff --git a/src/pages/panel/edit/List.tsx b/src/pages/panel/edit/List.tsx index 77cf6b8..e61c835 100644 --- a/src/pages/panel/edit/List.tsx +++ b/src/pages/panel/edit/List.tsx @@ -174,8 +174,15 @@ export const List = () => { diff --git a/src/pages/user/edit/List.tsx b/src/pages/user/edit/List.tsx index fde1356..b295fba 100644 --- a/src/pages/user/edit/List.tsx +++ b/src/pages/user/edit/List.tsx @@ -148,7 +148,13 @@ export const List = () => { icon={}>