From 6f53a867c3371eb5397cc9b1e3321ce444019cae Mon Sep 17 00:00:00 2001 From: FatttSnake Date: Mon, 18 Mar 2024 17:23:45 +0800 Subject: [PATCH] Feat: all - support multiple platforms --- .env.development | 5 +- .env.production | 3 +- .env.testing | 3 +- .../assets/css/pages/system/tools/base.scss | 2 +- .../src/assets/css/pages/tools/create.scss | 12 ++ .../src/assets/css/pages/tools/index.scss | 2 +- src/renderer/src/constants/urls.constants.ts | 1 + src/renderer/src/global.d.ts | 10 ++ src/renderer/src/pages/System/Tools/Base.tsx | 98 ++++++++++- src/renderer/src/pages/System/Tools/Code.tsx | 11 +- .../src/pages/System/Tools/Execute.tsx | 2 +- .../src/pages/System/Tools/Template.tsx | 158 +++++++++++++++--- src/renderer/src/pages/System/Tools/index.tsx | 12 +- src/renderer/src/pages/Tools/Create.tsx | 69 ++++++-- src/renderer/src/pages/Tools/Edit.tsx | 23 ++- src/renderer/src/pages/Tools/Source.tsx | 18 +- src/renderer/src/pages/Tools/User.tsx | 2 +- src/renderer/src/pages/Tools/View.tsx | 18 +- src/renderer/src/pages/Tools/index.tsx | 104 ++++++++++-- src/renderer/src/services/system.tsx | 11 +- src/renderer/src/services/tool.tsx | 7 +- src/renderer/src/util/common.tsx | 4 +- 22 files changed, 485 insertions(+), 90 deletions(-) diff --git a/.env.development b/.env.development index 2d4393a..944601c 100644 --- a/.env.development +++ b/.env.development @@ -1,3 +1,4 @@ -VITE_API_URL=http://localhost:8080 +VITE_PLATFORM=DESKTOP +VITE_API_URL=${DEV_API_URL} VITE_API_TOKEN_URL=${VITE_API_URL}/token -VITE_TURNSTILE_SITE_KEY=${TURNSTILE_SITE_KEY} \ No newline at end of file +VITE_TURNSTILE_SITE_KEY=${TURNSTILE_SITE_KEY} diff --git a/.env.production b/.env.production index 5062b96..707322a 100644 --- a/.env.production +++ b/.env.production @@ -1,3 +1,4 @@ +VITE_PLATFORM=DESKTOP VITE_API_URL=${PRODUCT_API_URL} VITE_API_TOKEN_URL=${VITE_API_URL}/token -VITE_TURNSTILE_SITE_KEY=${TURNSTILE_SITE_KEY} \ No newline at end of file +VITE_TURNSTILE_SITE_KEY=${TURNSTILE_SITE_KEY} diff --git a/.env.testing b/.env.testing index 7475bc2..e48a6b6 100644 --- a/.env.testing +++ b/.env.testing @@ -1,4 +1,5 @@ NODE_ENV=development +VITE_PLATFORM=DESKTOP VITE_API_URL=${TEST_API_URL} VITE_API_TOKEN_URL=${VITE_API_URL}/token -VITE_TURNSTILE_SITE_KEY=${TURNSTILE_SITE_KEY} \ No newline at end of file +VITE_TURNSTILE_SITE_KEY=${TURNSTILE_SITE_KEY} diff --git a/src/renderer/src/assets/css/pages/system/tools/base.scss b/src/renderer/src/assets/css/pages/system/tools/base.scss index d8dc5ca..bab7210 100644 --- a/src/renderer/src/assets/css/pages/system/tools/base.scss +++ b/src/renderer/src/assets/css/pages/system/tools/base.scss @@ -19,7 +19,7 @@ > *:nth-child(2) { position: sticky; top: 20px; - height: calc(100vh - 60px); + height: calc(100vh - 40px); } .close-editor-btn { diff --git a/src/renderer/src/assets/css/pages/tools/create.scss b/src/renderer/src/assets/css/pages/tools/create.scss index a01a5ae..0306a9b 100644 --- a/src/renderer/src/assets/css/pages/tools/create.scss +++ b/src/renderer/src/assets/css/pages/tools/create.scss @@ -43,6 +43,18 @@ } } } + + .preview { + display: flex; + justify-content: center; + align-items: center; + + .no-preview { + font-weight: bolder; + color: constants.$font-secondary-color; + font-size: 1.4em; + } + } } } } diff --git a/src/renderer/src/assets/css/pages/tools/index.scss b/src/renderer/src/assets/css/pages/tools/index.scss index 6bba3c3..4b59fe2 100644 --- a/src/renderer/src/assets/css/pages/tools/index.scss +++ b/src/renderer/src/assets/css/pages/tools/index.scss @@ -28,7 +28,7 @@ position: absolute; top: 10px; left: 10px; - width: 8em; + width: 9em; } .upgrade-bt { diff --git a/src/renderer/src/constants/urls.constants.ts b/src/renderer/src/constants/urls.constants.ts index 615dab8..c3b20f7 100644 --- a/src/renderer/src/constants/urls.constants.ts +++ b/src/renderer/src/constants/urls.constants.ts @@ -30,6 +30,7 @@ export const URL_SYS_STATISTICS_ACTIVE = `${URL_SYS_STATISTICS}/active` export const URL_SYS_TOOL = '/system/tool' export const URL_SYS_TOOL_CATEGORY = `${URL_SYS_TOOL}/category` export const URL_SYS_TOOL_BASE = `${URL_SYS_TOOL}/base` +export const URL_SYS_TOOL_BASE_LIST = `${URL_SYS_TOOL_BASE}/list` export const URL_SYS_TOOL_TEMPLATE = `${URL_SYS_TOOL}/template` export const URL_TOOL = '/tool' diff --git a/src/renderer/src/global.d.ts b/src/renderer/src/global.d.ts index be92e36..e67e298 100644 --- a/src/renderer/src/global.d.ts +++ b/src/renderer/src/global.d.ts @@ -1,7 +1,10 @@ /// /// +type Platform = 'WEB' | 'DESKTOP' | 'ANDROID' + interface ImportMetaEnv { + readonly VITE_PLATFORM: Platform readonly VITE_API_URL: string readonly VITE_API_TOKEN_URL: string readonly VITE_TURNSTILE_SITE_KEY: string @@ -545,6 +548,7 @@ interface ToolBaseVo { name: string source: ToolDataVo dist: ToolDataVo + platform: Platform compiled: boolean createTime: string updateTime: string @@ -555,6 +559,7 @@ interface ToolBaseAddEditParam { name?: string source?: string dist?: string + platform?: Platform } interface ToolTemplateVo { @@ -562,6 +567,7 @@ interface ToolTemplateVo { name: string baseId: string source: ToolDataVo + platform: Platform entryPoint: string enable: boolean createTime: string @@ -574,6 +580,7 @@ interface ToolTemplateAddEditParam { name?: string baseId?: string source?: string + platform?: Platform entryPoint?: string enable?: boolean } @@ -583,6 +590,7 @@ interface ToolVo { name: string toolId: string icon: string + platform: Platform description: string base: ToolBaseVo author: UserWithInfoVo @@ -602,6 +610,7 @@ interface ToolCreateParam { name: string toolId: string icon: string + platform: Platform description: string ver: string templateId: string @@ -612,6 +621,7 @@ interface ToolCreateParam { interface ToolUpgradeParam { toolId: string ver: string + platform: Platform } interface ToolUpdateParam { diff --git a/src/renderer/src/pages/System/Tools/Base.tsx b/src/renderer/src/pages/System/Tools/Base.tsx index ac97229..ccf9dda 100644 --- a/src/renderer/src/pages/System/Tools/Base.tsx +++ b/src/renderer/src/pages/System/Tools/Base.tsx @@ -41,6 +41,17 @@ const Base = () => { currentLocation.pathname !== nextLocation.pathname && Object.keys(hasEdited).length > 0 ) const [modal, contextHolder] = AntdModal.useModal() + const [tableParams, setTableParams] = useState({ + pagination: { + current: 1, + pageSize: 20, + position: ['bottomCenter'], + showTotal: (total, range) => + `第 ${ + range[0] === range[1] ? `${range[0]}` : `${range[0]}~${range[1]}` + } 项 共 ${total} 项` + } + }) const [form] = AntdForm.useForm() const formValues = AntdForm.useWatch([], form) const [addFileForm] = AntdForm.useForm<{ fileName: string }>() @@ -62,6 +73,32 @@ const Base = () => { const [compiling, setCompiling] = useState(false) const [compileForm] = AntdForm.useForm<{ entryFileName: string }>() + const handleOnTableChange = ( + pagination: _TablePaginationConfig, + filters: Record, + sorter: _SorterResult | _SorterResult[] + ) => { + pagination = { ...tableParams.pagination, ...pagination } + if (Array.isArray(sorter)) { + setTableParams({ + pagination, + filters, + sortField: sorter.map((value) => value.field).join(',') + }) + } else { + setTableParams({ + pagination, + filters, + sortField: sorter.field, + sortOrder: sorter.order + }) + } + + if (pagination.pageSize !== tableParams.pagination?.pageSize) { + setBaseData([]) + } + } + useBeforeUnload( useCallback( (event) => { @@ -78,8 +115,9 @@ const Base = () => { const handleOnAddBtnClick = () => { setIsDrawerEdit(false) setIsDrawerOpen(true) - form.setFieldValue('id', undefined) + form.setFieldValue('id', null) form.setFieldValue('name', newFormValues?.name) + form.setFieldValue('platform', newFormValues?.platform) } const baseColumns: _ColumnsType = [ @@ -91,6 +129,16 @@ const Base = () => { ) }, + { + title: '平台', + dataIndex: 'platform', + render: (value: string) => `${value.slice(0, 1)}${value.slice(1).toLowerCase()}`, + filters: [ + { text: 'Web', value: 'WEB' }, + { text: 'Desktop', value: 'DESKTOP' }, + { text: 'Android', value: 'ANDROID' } + ] + }, { title: '创建时间', dataIndex: 'createTime', @@ -371,6 +419,7 @@ const Base = () => { setIsDrawerOpen(true) form.setFieldValue('id', value.id) form.setFieldValue('name', value.name) + form.setFieldValue('platform', value.platform) void form.validateFields() } } @@ -478,11 +527,28 @@ const Base = () => { } setIsLoading(true) - void r_sys_tool_base_get() + void r_sys_tool_base_get({ + currentPage: tableParams.pagination?.current, + pageSize: tableParams.pagination?.pageSize, + sortField: + tableParams.sortField && tableParams.sortOrder + ? (tableParams.sortField as string) + : undefined, + sortOrder: + tableParams.sortField && tableParams.sortOrder ? tableParams.sortOrder : undefined, + ...tableParams.filters + }) .then((res) => { const response = res.data if (response.code === DATABASE_SELECT_SUCCESS) { - setBaseData(response.data!) + setBaseData(response.data!.records) + setTableParams({ + ...tableParams, + pagination: { + ...tableParams.pagination, + total: response.data!.total + } + }) } else { void message.error('获取失败,请稍后重试') } @@ -940,14 +1006,21 @@ const Base = () => { if (!isDrawerEdit && formValues) { setNewFormValues({ - name: formValues.name + name: formValues.name, + platform: formValues.platform }) } }, [formValues]) useEffect(() => { getBase() - }, []) + }, [ + JSON.stringify(tableParams.filters), + JSON.stringify(tableParams.sortField), + JSON.stringify(tableParams.sortOrder), + JSON.stringify(tableParams.pagination?.pageSize), + JSON.stringify(tableParams.pagination?.current) + ]) const drawerToolbar = ( @@ -977,6 +1050,18 @@ const Base = () => { > + ) @@ -990,12 +1075,13 @@ const Base = () => { dataSource={baseData} columns={baseColumns} rowKey={(record) => record.id} + pagination={tableParams.pagination} loading={isLoading} - pagination={false} expandable={{ expandedRowRender, onExpand: handleOnExpand }} + onChange={handleOnTableChange} /> {editingFileName && ( diff --git a/src/renderer/src/pages/System/Tools/Code.tsx b/src/renderer/src/pages/System/Tools/Code.tsx index 56fac42..3a2a286 100644 --- a/src/renderer/src/pages/System/Tools/Code.tsx +++ b/src/renderer/src/pages/System/Tools/Code.tsx @@ -2,6 +2,7 @@ import Draggable from 'react-draggable' import Icon from '@ant-design/icons' import '@/assets/css/pages/system/tools/code.scss' import { DATABASE_NO_RECORD_FOUND, DATABASE_SELECT_SUCCESS } from '@/constants/common.constants' +import { checkDesktop } from '@/util/common' import { r_sys_tool_get_one } from '@/services/system' import { IFiles } from '@/components/Playground/shared' import { base64ToFiles } from '@/components/Playground/files' @@ -15,15 +16,21 @@ const Code = () => { const [loading, setLoading] = useState(false) const [files, setFiles] = useState({}) const [selectedFileName, setSelectedFileName] = useState('') + const [platform, setPlatform] = useState('WEB') const handleOnRunTool = () => { - navigate(`/system/tools/execute/${id}`) + if (checkDesktop() || platform !== 'DESKTOP') { + navigate(`/system/tools/execute/${id}`) + } else { + void message.warning('此应用需要桌面端环境,请在桌面端运行') + } } const render = (toolVo: ToolVo) => { try { setFiles(base64ToFiles(toolVo.source.data!)) setSelectedFileName(toolVo.entryPoint) + setPlatform(toolVo.platform) } catch (e) { void message.error('载入工具失败') } @@ -46,7 +53,7 @@ const Code = () => { case DATABASE_NO_RECORD_FOUND: void message.error('未找到指定工具') setTimeout(() => { - navigate(-1) + navigate('/') }, 3000) break default: diff --git a/src/renderer/src/pages/System/Tools/Execute.tsx b/src/renderer/src/pages/System/Tools/Execute.tsx index 8099d32..fe5dbb2 100644 --- a/src/renderer/src/pages/System/Tools/Execute.tsx +++ b/src/renderer/src/pages/System/Tools/Execute.tsx @@ -51,7 +51,7 @@ const Execute = () => { case DATABASE_NO_RECORD_FOUND: void message.error('未找到指定工具') setTimeout(() => { - navigate(-1) + navigate('/') }, 3000) break default: diff --git a/src/renderer/src/pages/System/Tools/Template.tsx b/src/renderer/src/pages/System/Tools/Template.tsx index c7c5e55..6c663d4 100644 --- a/src/renderer/src/pages/System/Tools/Template.tsx +++ b/src/renderer/src/pages/System/Tools/Template.tsx @@ -16,7 +16,7 @@ import { r_sys_tool_template_add, r_sys_tool_template_get, r_sys_tool_template_get_one, - r_sys_tool_base_get + r_sys_tool_base_get_list } from '@/services/system' import { IFile, IFiles, ITsconfig } from '@/components/Playground/shared' import { @@ -39,6 +39,17 @@ const Template = () => { currentLocation.pathname !== nextLocation.pathname && Object.keys(hasEdited).length > 0 ) const [modal, contextHolder] = AntdModal.useModal() + const [tableParams, setTableParams] = useState({ + pagination: { + current: 1, + pageSize: 20, + position: ['bottomCenter'], + showTotal: (total, range) => + `第 ${ + range[0] === range[1] ? `${range[0]}` : `${range[0]}~${range[1]}` + } 项 共 ${total} 项` + } + }) const [form] = AntdForm.useForm() const formValues = AntdForm.useWatch([], form) const [addFileForm] = AntdForm.useForm<{ fileName: string }>() @@ -60,6 +71,32 @@ const Template = () => { const [templateDetailLoading, setTemplateDetailLoading] = useState>({}) const [tsconfig, setTsconfig] = useState() + const handleOnTableChange = ( + pagination: _TablePaginationConfig, + filters: Record, + sorter: _SorterResult | _SorterResult[] + ) => { + pagination = { ...tableParams.pagination, ...pagination } + if (Array.isArray(sorter)) { + setTableParams({ + pagination, + filters, + sortField: sorter.map((value) => value.field).join(',') + }) + } else { + setTableParams({ + pagination, + filters, + sortField: sorter.field, + sortOrder: sorter.order + }) + } + + if (pagination.pageSize !== tableParams.pagination?.pageSize) { + setBaseData([]) + } + } + useBeforeUnload( useCallback( (event) => { @@ -95,6 +132,16 @@ const Template = () => { ) }, + { + title: '平台', + dataIndex: 'platform', + render: (value: string) => `${value.slice(0, 1)}${value.slice(1).toLowerCase()}`, + filters: [ + { text: 'Web', value: 'WEB' }, + { text: 'Desktop', value: 'DESKTOP' }, + { text: 'Android', value: 'ANDROID' } + ] + }, { title: '基板', dataIndex: ['base', 'name'] @@ -264,9 +311,6 @@ const Template = () => { } } - const filterOption = (input: string, option?: { label: string; value: string }) => - (option?.label ?? '').toLowerCase().includes(input.toLowerCase()) - const handleOnSubmit = () => { if (isSubmitting) { return @@ -294,7 +338,12 @@ const Template = () => { setIsSubmitting(false) }) } else { - void r_sys_tool_template_add(formValues) + void r_sys_tool_template_add({ + ...formValues, + baseId: formValues.baseId + ? (formValues.baseId as unknown as string[])[1] + : undefined + }) .then((res) => { const response = res.data switch (response.code) { @@ -331,11 +380,28 @@ const Template = () => { } setIsLoading(true) - void r_sys_tool_template_get() + void r_sys_tool_template_get({ + currentPage: tableParams.pagination?.current, + pageSize: tableParams.pagination?.pageSize, + sortField: + tableParams.sortField && tableParams.sortOrder + ? (tableParams.sortField as string) + : undefined, + sortOrder: + tableParams.sortField && tableParams.sortOrder ? tableParams.sortOrder : undefined, + ...tableParams.filters + }) .then((res) => { const response = res.data if (response.code === DATABASE_SELECT_SUCCESS) { - setTemplateData(response.data!) + setTemplateData(response.data!.records) + setTableParams({ + ...tableParams, + pagination: { + ...tableParams.pagination, + total: response.data!.total + } + }) } else { void message.error('获取失败,请稍后重试') } @@ -786,7 +852,7 @@ const Template = () => { } setIsLoadingBaseData(true) - void r_sys_tool_base_get() + void r_sys_tool_base_get_list() .then((res) => { const response = res.data switch (response.code) { @@ -831,9 +897,64 @@ const Template = () => { } }, [formValues]) + const baseDataGroupByPlatform = () => { + interface Node { + label: string + value: string + children?: Node[] + } + const temp: Node[] = [] + baseData.forEach((value) => { + if (!temp.length) { + temp.push({ + label: `${value.platform.slice(0, 1)}${value.platform.slice(1).toLowerCase()}`, + value: value.platform, + children: [ + { + label: value.name, + value: value.id + } + ] + }) + } else { + if ( + !temp.some((platform, platformIndex) => { + if (platform.value === value.platform) { + temp[platformIndex].children!.push({ + label: value.name, + value: value.id + }) + return true + } + return false + }) + ) { + temp.push({ + label: `${value.platform.slice(0, 1)}${value.platform.slice(1).toLowerCase()}`, + value: value.platform, + children: [ + { + label: value.name, + value: value.id + } + ] + }) + } + } + }) + + return temp + } + useEffect(() => { getTemplate() - }, []) + }, [ + JSON.stringify(tableParams.filters), + JSON.stringify(tableParams.sortField), + JSON.stringify(tableParams.sortOrder), + JSON.stringify(tableParams.pagination?.pageSize), + JSON.stringify(tableParams.pagination?.current) + ]) const drawerToolbar = ( @@ -868,15 +989,13 @@ const Template = () => { > - - ({ - value: value.id, - label: value.name - }))} - /> + @@ -897,13 +1016,14 @@ const Template = () => { dataSource={templateData} columns={templateColumns} rowKey={(record) => record.id} + pagination={tableParams.pagination} loading={isLoading} - pagination={false} scroll={{ x: true }} expandable={{ expandedRowRender, onExpand: handleOnExpand }} + onChange={handleOnTableChange} /> {editingFileName && ( diff --git a/src/renderer/src/pages/System/Tools/index.tsx b/src/renderer/src/pages/System/Tools/index.tsx index 34b431d..72b1b82 100644 --- a/src/renderer/src/pages/System/Tools/index.tsx +++ b/src/renderer/src/pages/System/Tools/index.tsx @@ -75,6 +75,16 @@ const Tools = () => { }, { dataIndex: 'toolId', title: '工具 ID' }, { dataIndex: 'ver', title: '版本' }, + { + title: '平台', + dataIndex: 'platform', + render: (value: string) => `${value.slice(0, 1)}${value.slice(1).toLowerCase()}`, + filters: [ + { text: 'Web', value: 'WEB' }, + { text: 'Desktop', value: 'DESKTOP' }, + { text: 'Android', value: 'ANDROID' } + ] + }, { title: '作者', render: (_, record) => `${record.author.userInfo.nickname}(${record.author.username})` @@ -381,7 +391,7 @@ const Tools = () => { .confirm({ title: '确定删除', maskClosable: true, - content: `确定删除工具 ${value.author.username}:${value.toolId}:${value.ver} 吗?` + content: `确定删除工具 ${value.author.username}:${value.toolId}:${value.platform.slice(0, 1)}${value.platform.slice(1).toLowerCase()}:${value.ver} 吗?` }) .then( (confirmed) => { diff --git a/src/renderer/src/pages/Tools/Create.tsx b/src/renderer/src/pages/Tools/Create.tsx index 6270329..b8cf71a 100644 --- a/src/renderer/src/pages/Tools/Create.tsx +++ b/src/renderer/src/pages/Tools/Create.tsx @@ -42,9 +42,11 @@ const Create = () => { switch (response.code) { case DATABASE_INSERT_SUCCESS: void message.success( - `创建工具 ${response.data!.name}<${response.data!.toolId}>:${response.data!.ver} 成功` + `创建工具 ${response.data!.name}<${response.data!.toolId}:${response.data!.platform.slice(0, 1)}${response.data!.platform.slice(1).toLowerCase()}:${response.data!.ver}> 成功` + ) + navigate( + `/edit/${response.data!.toolId}${response.data!.platform !== import.meta.env.VITE_PLATFORM ? `?platform=${response.data!.platform}` : ''}` ) - navigate(`/edit/${response.data!.toolId}`) break case DATABASE_DUPLICATE_KEY: void message.warning('已存在相同 ID 的应用') @@ -82,6 +84,30 @@ const Create = () => { return false } + const handleOnPlatformChange = (value: string) => { + setLoadingTemplate(true) + void r_tool_template_get({ + platform: value + }) + .then((res) => { + const response = res.data + switch (response.code) { + case DATABASE_SELECT_SUCCESS: + setTemplateData(response.data!) + response.data?.length + ? form.setFieldValue('templateId', response.data?.[0].id) + : form.setFieldValue('templateId', null) + response.data?.length && handleOnTemplateChange(response.data?.[0].id) + break + default: + void message.error('获取模板列表失败,请稍后重试') + } + }) + .finally(() => { + setLoadingTemplate(false) + }) + } + const handleOnTemplateChange = (value: string) => { setPreviewTemplate(value) if (templateDetailData[value]) { @@ -110,6 +136,7 @@ const Create = () => { if (!template) { return } + setCompiledCode('') try { const baseDist = base64ToStr(template.base.dist.data!) const files = base64ToFiles(template.source.data!) @@ -123,6 +150,7 @@ const Create = () => { }) .catch((reason) => { void message.error(`编译失败:${reason}`) + setCompiledCode(baseDist) }) } catch (e) { void message.error(`载入模板 ${templateDetailData[previewTemplate].name} 失败`) @@ -140,22 +168,7 @@ const Create = () => { }, [form, formValues?.keywords]) useEffect(() => { - setLoadingTemplate(true) setLoadingCategory(true) - void r_tool_template_get() - .then((res) => { - const response = res.data - switch (response.code) { - case DATABASE_SELECT_SUCCESS: - setTemplateData(response.data!) - break - default: - void message.error('获取模板列表失败,请稍后重试') - } - }) - .finally(() => { - setLoadingTemplate(false) - }) void r_tool_category_get() .then((res) => { const response = res.data @@ -254,6 +267,24 @@ const Create = () => { placeholder={'请输入工具 ID'} /> + + + Web + + Desktop + + + Android + + + { 预览 - {compiledCode && ( + {compiledCode ? ( + ) : ( + 暂无预览 )} diff --git a/src/renderer/src/pages/Tools/Edit.tsx b/src/renderer/src/pages/Tools/Edit.tsx index 6a56e0e..907c117 100644 --- a/src/renderer/src/pages/Tools/Edit.tsx +++ b/src/renderer/src/pages/Tools/Edit.tsx @@ -26,6 +26,9 @@ import Card from '@/components/common/Card' const Edit = () => { const navigate = useNavigate() const { toolId } = useParams() + const [searchParams] = useSearchParams({ + platform: import.meta.env.VITE_PLATFORM + }) const [form] = AntdForm.useForm() const formValues = AntdForm.useWatch([], form) const [loading, setLoading] = useState(false) @@ -98,13 +101,13 @@ const Edit = () => { case TOOL_UNDER_REVIEW: void message.error('保存失败:工具审核中') setTimeout(() => { - navigate(-1) + navigate('/') }, 3000) break case TOOL_HAS_BEEN_PUBLISHED: void message.error('保存失败:工具已发布') setTimeout(() => { - navigate(-1) + navigate('/') }, 3000) break default: @@ -164,13 +167,13 @@ const Edit = () => { case TOOL_UNDER_REVIEW: void message.error('保存失败:工具审核中') setTimeout(() => { - navigate(-1) + navigate('/') }, 3000) break case TOOL_HAS_BEEN_PUBLISHED: void message.error('保存失败:工具已发布') setTimeout(() => { - navigate(-1) + navigate('/') }, 3000) break default: @@ -211,7 +214,7 @@ const Edit = () => { setLoading(true) void message.loading({ content: '加载中……', key: 'LOADING', duration: 0 }) - void r_tool_detail('!', toolId!, 'latest') + void r_tool_detail('!', toolId!, 'latest', searchParams.get('platform') as Platform) .then((res) => { const response = res.data switch (response.code) { @@ -225,20 +228,20 @@ const Edit = () => { case 'PROCESSING': void message.warning('工具审核中,请勿修改') setTimeout(() => { - navigate(-1) + navigate('/') }, 3000) break default: void message.warning('请先创建新版本后编辑工具') setTimeout(() => { - navigate(-1) + navigate('/') }, 3000) } break case DATABASE_NO_RECORD_FOUND: void message.error('未找到指定工具') setTimeout(() => { - navigate(-1) + navigate('/') }, 3000) break default: @@ -301,6 +304,10 @@ const Edit = () => { }, [formValues]) useEffect(() => { + if (!['WEB', 'DESKTOP', 'ANDROID'].includes(searchParams.get('platform')!)) { + navigate('/') + return + } getTool() }, []) diff --git a/src/renderer/src/pages/Tools/Source.tsx b/src/renderer/src/pages/Tools/Source.tsx index 0c79b7b..e5da384 100644 --- a/src/renderer/src/pages/Tools/Source.tsx +++ b/src/renderer/src/pages/Tools/Source.tsx @@ -11,6 +11,9 @@ import { getLoginStatus } from '@/util/auth' const Source = () => { const navigate = useNavigate() const { username, toolId, ver } = useParams() + const [searchParams] = useSearchParams({ + platform: import.meta.env.VITE_PLATFORM + }) const [loading, setLoading] = useState(false) const [files, setFiles] = useState({}) const [selectedFileName, setSelectedFileName] = useState('') @@ -31,7 +34,12 @@ const Source = () => { setLoading(true) void message.loading({ content: '加载中……', key: 'LOADING', duration: 0 }) - void r_tool_detail(username!, toolId!, ver || 'latest') + void r_tool_detail( + username!, + toolId!, + ver || 'latest', + searchParams.get('platform') as Platform + ) .then((res) => { const response = res.data switch (response.code) { @@ -41,7 +49,7 @@ const Source = () => { case DATABASE_NO_RECORD_FOUND: void message.error('未找到指定工具') setTimeout(() => { - navigate(-1) + navigate('/') }, 3000) break default: @@ -57,7 +65,7 @@ const Source = () => { useEffect(() => { if (username === '!' && !getLoginStatus()) { setTimeout(() => { - navigate(-1) + navigate('/') }, 3000) return } @@ -69,6 +77,10 @@ const Source = () => { navigate(`/source/!/${toolId}/latest`) return } + if (!['WEB', 'DESKTOP', 'ANDROID'].includes(searchParams.get('platform')!)) { + navigate('/') + return + } getTool() }, []) diff --git a/src/renderer/src/pages/Tools/User.tsx b/src/renderer/src/pages/Tools/User.tsx index d12569e..67d2508 100644 --- a/src/renderer/src/pages/Tools/User.tsx +++ b/src/renderer/src/pages/Tools/User.tsx @@ -159,7 +159,7 @@ const User = () => { case DATABASE_NO_RECORD_FOUND: void message.warning('用户不存在') setTimeout(() => { - navigate(-1) + navigate('/') }, 3000) break default: diff --git a/src/renderer/src/pages/Tools/View.tsx b/src/renderer/src/pages/Tools/View.tsx index 2e1c0f6..92bbbc8 100644 --- a/src/renderer/src/pages/Tools/View.tsx +++ b/src/renderer/src/pages/Tools/View.tsx @@ -12,6 +12,9 @@ import Card from '@/components/common/Card' const View = () => { const navigate = useNavigate() const { username, toolId, ver } = useParams() + const [searchParams] = useSearchParams({ + platform: import.meta.env.VITE_PLATFORM + }) const [loading, setLoading] = useState(false) const [compiledCode, setCompiledCode] = useState('') @@ -52,7 +55,12 @@ const View = () => { setLoading(true) void message.loading({ content: '加载中……', key: 'LOADING', duration: 0 }) - void r_tool_detail(username!, toolId!, ver || 'latest') + void r_tool_detail( + username!, + toolId!, + ver || 'latest', + searchParams.get('platform') as Platform + ) .then((res) => { const response = res.data switch (response.code) { @@ -62,7 +70,7 @@ const View = () => { case DATABASE_NO_RECORD_FOUND: void message.error('未找到指定工具') setTimeout(() => { - navigate(-1) + navigate('/') }, 3000) break default: @@ -78,7 +86,7 @@ const View = () => { useEffect(() => { if (username === '!' && !getLoginStatus()) { setTimeout(() => { - navigate(-1) + navigate('/') }, 3000) return } @@ -90,6 +98,10 @@ const View = () => { navigate(`/view/!/${toolId}/latest`) return } + if (!['WEB', 'DESKTOP', 'ANDROID'].includes(searchParams.get('platform')!)) { + navigate('/') + return + } getTool() }, []) diff --git a/src/renderer/src/pages/Tools/index.tsx b/src/renderer/src/pages/Tools/index.tsx index 2cc3bbe..edac408 100644 --- a/src/renderer/src/pages/Tools/index.tsx +++ b/src/renderer/src/pages/Tools/index.tsx @@ -14,6 +14,7 @@ import { TOOL_SUBMIT_SUCCESS, TOOL_UNDER_REVIEW } from '@/constants/common.constants' +import { checkDesktop } from '@/util/common' import { getLoginStatus } from '@/util/auth' import { r_tool_cancel, @@ -138,18 +139,30 @@ const ToolCard = ({ tools, onDelete, onUpgrade, onSubmit, onCancel }: ToolCardPr const navigate = useNavigate() const [selectedTool, setSelectedTool] = useState(tools[0]) - const handleOnVersionChange = (value: string) => { - setSelectedTool(tools.find((item) => item.id === value)!) + const handleOnVersionChange = (value: (string | number)[]) => { + setSelectedTool(tools.find((item) => item.id === value[1])!) } const handleOnOpenTool = () => { - navigate(`/view/!/${selectedTool.toolId}/${selectedTool.ver}`) + if (checkDesktop() || selectedTool.platform !== 'DESKTOP') { + navigate( + `/view/!/${selectedTool.toolId}/${selectedTool.ver}${selectedTool.platform !== import.meta.env.VITE_PLATFORM ? `?platform=${selectedTool.platform}` : ''}` + ) + } else { + void message.warning('此应用需要桌面端环境,请在桌面端打开') + } } const handleOnEditTool = () => { if (['NONE', 'REJECT'].includes(selectedTool.review)) { return () => { - navigate(`/edit/${tools[0].toolId}`) + if (checkDesktop() || selectedTool.platform !== 'DESKTOP') { + navigate( + `/edit/${selectedTool.toolId}${selectedTool.platform !== import.meta.env.VITE_PLATFORM ? `?platform=${selectedTool.platform}` : ''}` + ) + } else { + void message.warning('此应用需要桌面端环境,请在桌面端编辑') + } } } return undefined @@ -158,7 +171,9 @@ const ToolCard = ({ tools, onDelete, onUpgrade, onSubmit, onCancel }: ToolCardPr const handleOnSourceTool = () => { if (selectedTool.review === 'PASS') { return () => { - navigate(`/source/!/${selectedTool.toolId}/${selectedTool.ver}`) + navigate( + `/source/!/${selectedTool.toolId}/${selectedTool.ver}${selectedTool.platform !== import.meta.env.VITE_PLATFORM ? `?platform=${selectedTool.platform}` : ''}` + ) } } return undefined @@ -190,6 +205,55 @@ const ToolCard = ({ tools, onDelete, onUpgrade, onSubmit, onCancel }: ToolCardPr onUpgrade?.(selectedTool) } + const toolsGroupByPlatform = (tools: ToolVo[]) => { + interface Node { + label: string + value: string + children?: Node[] + } + const temp: Node[] = [] + tools.forEach((value) => { + if (!temp.length) { + temp.push({ + label: `${value.platform.slice(0, 1)}${value.platform.slice(1).toLowerCase()}`, + value: value.platform, + children: [ + { + label: `${value.ver}${value.review !== 'PASS' ? '*' : ''}`, + value: value.id + } + ] + }) + } else { + if ( + !temp.some((platform, platformIndex) => { + if (platform.value === value.platform) { + temp[platformIndex].children!.push({ + label: `${value.ver}${value.review !== 'PASS' ? '*' : ''}`, + value: value.id + }) + return true + } + return false + }) + ) { + temp.push({ + label: `${value.platform.slice(0, 1)}${value.platform.slice(1).toLowerCase()}`, + value: value.platform, + children: [ + { + label: `${value.ver}${value.review !== 'PASS' ? '*' : ''}`, + value: value.id + } + ] + }) + } + } + }) + + return temp + } + return ( } @@ -202,15 +266,17 @@ const ToolCard = ({ tools, onDelete, onUpgrade, onSubmit, onCancel }: ToolCardPr onCancelReview={handleOnCancelReview()} onDelete={handleOnDeleteTool} > - value.id === selectedTool.id)!.platform, + selectedTool.id + ]} + displayRender={(label: string[]) => `${label[0].slice(0, 1)}-${label[1]}`} onChange={handleOnVersionChange} - options={tools.map((value) => ({ - value: value.id, - label: `${value.ver}${value.review !== 'PASS' ? '*' : ''}` - }))} + options={toolsGroupByPlatform(tools)} /> {tools.every((value) => value.review === 'PASS') && ( @@ -237,7 +303,7 @@ const Tools = () => { .confirm({ title: '删除', maskClosable: true, - content: `确定删除工具 ${tool.name}:${tool.ver} 吗?` + content: `确定删除工具 ${tool.toolId}:${tool.platform.slice(0, 1)}${tool.platform.slice(1).toLowerCase()}:${tool.ver} 吗?` }) .then( (confirmed) => { @@ -313,14 +379,22 @@ const Tools = () => { () => { return new Promise((resolve, reject) => { void r_tool_upgrade({ - toolId: upgradeForm.getFieldValue('toolId') as string, - ver: upgradeForm.getFieldValue('ver') as string + toolId: tool.toolId, + ver: upgradeForm.getFieldValue('ver') as string, + platform: tool.platform }).then((res) => { const response = res.data switch (response.code) { case DATABASE_UPDATE_SUCCESS: void message.success('创建新版本成功') - navigate(`/edit/${response.data!.toolId}`) + if ( + checkDesktop() || + response.data!.platform !== 'DESKTOP' + ) { + navigate( + `/edit/${response.data!.toolId}${response.data!.platform !== import.meta.env.VITE_PLATFORM ? `?platform=${response.data!.platform}` : ''}` + ) + } resolve() break case TOOL_ILLEGAL_VERSION: diff --git a/src/renderer/src/services/system.tsx b/src/renderer/src/services/system.tsx index c64bef0..047b0be 100644 --- a/src/renderer/src/services/system.tsx +++ b/src/renderer/src/services/system.tsx @@ -21,7 +21,8 @@ import { URL_SYS_TOOL_BASE, URL_SYS_TOOL_TEMPLATE, URL_SYS_TOOL, - URL_SYS_SETTINGS_TWO_FACTOR + URL_SYS_SETTINGS_TWO_FACTOR, + URL_SYS_TOOL_BASE_LIST } from '@/constants/urls.constants' import request from '@/services/index' @@ -145,7 +146,10 @@ export const r_sys_tool_category_update = (param: ToolCategoryAddEditParam) => export const r_sys_tool_category_delete = (id: string) => request.delete(`${URL_SYS_TOOL_CATEGORY}/${id}`) -export const r_sys_tool_base_get = () => request.get(URL_SYS_TOOL_BASE) +export const r_sys_tool_base_get = (param: PageParam) => + request.get>(URL_SYS_TOOL_BASE, param) + +export const r_sys_tool_base_get_list = () => request.get(URL_SYS_TOOL_BASE_LIST) export const r_sys_tool_base_get_one = (id: string) => request.get(`${URL_SYS_TOOL_BASE}/${id}`) @@ -158,7 +162,8 @@ export const r_sys_tool_base_update = (param: ToolBaseAddEditParam) => export const r_sys_tool_base_delete = (id: string) => request.delete(`${URL_SYS_TOOL_BASE}/${id}`) -export const r_sys_tool_template_get = () => request.get(URL_SYS_TOOL_TEMPLATE) +export const r_sys_tool_template_get = (param: PageParam) => + request.get>(URL_SYS_TOOL_TEMPLATE, param) export const r_sys_tool_template_get_one = (id: string) => request.get(`${URL_SYS_TOOL_TEMPLATE}/${id}`) diff --git a/src/renderer/src/services/tool.tsx b/src/renderer/src/services/tool.tsx index 1bb8f18..995bb79 100644 --- a/src/renderer/src/services/tool.tsx +++ b/src/renderer/src/services/tool.tsx @@ -7,7 +7,8 @@ import { URL_TOOL_TEMPLATE } from '@/constants/urls.constants' -export const r_tool_template_get = () => request.get(URL_TOOL_TEMPLATE) +export const r_tool_template_get = (param: { platform: string }) => + request.get(URL_TOOL_TEMPLATE, param) export const r_tool_template_get_one = (id: string) => request.get(`${URL_TOOL_TEMPLATE}/${id}`) @@ -20,8 +21,8 @@ export const r_tool_upgrade = (param: ToolUpgradeParam) => request.patch export const r_tool_get = () => request.get(URL_TOOL) -export const r_tool_detail = (username: string, toolId: string, ver: string) => - request.get(`${URL_TOOL_DETAIL}/${username}/${toolId}/${ver}`) +export const r_tool_detail = (username: string, toolId: string, ver: string, platform: Platform) => + request.get(`${URL_TOOL_DETAIL}/${username}/${toolId}/${ver}`, { platform }) export const r_tool_update = (param: ToolUpdateParam) => request.put(URL_TOOL, param) diff --git a/src/renderer/src/util/common.tsx b/src/renderer/src/util/common.tsx index 043b554..f32740e 100644 --- a/src/renderer/src/util/common.tsx +++ b/src/renderer/src/util/common.tsx @@ -118,7 +118,7 @@ export const formatByteSize = (byteSize: number): string => { } const formatByte = (size: number, unit: ByteUnit): string => { - let precision + let precision: number if ((size * 1000) % 10 > 0) { precision = 3 } else if ((size * 100) % 10 > 0) { @@ -131,3 +131,5 @@ const formatByte = (size: number, unit: ByteUnit): string => { return `${size.toFixed(precision)}${unit}` } + +export const checkDesktop = () => import.meta.env.VITE_PLATFORM === 'DESKTOP'