Feat(Menu): Support multi-platform

Support add multi-platform tool to menu
This commit is contained in:
2024-05-01 18:18:17 +08:00
parent 6e2012cd7a
commit b51fdb11f2
5 changed files with 41 additions and 20 deletions

View File

@@ -12,6 +12,7 @@ interface RepositoryCardProps
toolName: string
toolId: string
ver: string
platform: Platform
options?: TiltOptions
onOpen?: () => void
onEdit?: () => void
@@ -29,6 +30,7 @@ const RepositoryCard = ({
toolName,
toolId,
ver,
platform,
options = {
reverse: true,
max: 8,
@@ -52,7 +54,10 @@ const RepositoryCard = ({
}, [options])
return (
<Draggable id={toolId} data={{ icon, toolName, toolId, authorUsername: '!', ver }}>
<Draggable
id={`!:${toolId}:${ver}:${platform}`}
data={{ icon, toolName, toolId, authorUsername: '!', ver, platform }}
>
<Card
data-component={'component-repository-card'}
style={{ overflow: 'visible', ...style }}

View File

@@ -179,19 +179,26 @@ const StoreCard = ({
)
return
}
navigateToView(navigate, author.username, toolId, platform)
navigateToView(navigate, author.username, toolId, 'DESKTOP')
}
const handleOnWebBtnClick = (e: MouseEvent<HTMLDivElement>) => {
e.stopPropagation()
navigateToView(navigate, author.username, toolId, platform)
navigateToView(navigate, author.username, toolId, 'WEB')
}
return (
<>
<Draggable
id={`${author.username}:${toolId}:${ver}`}
data={{ icon, toolName, toolId, authorUsername: author.username, ver: '' }}
id={`${author.username}:${toolId}:${ver}:${platform}`}
data={{
icon,
toolName,
toolId,
authorUsername: author.username,
ver: '',
platform: platform
}}
>
<Card
data-component={'component-store-card'}

View File

@@ -668,4 +668,5 @@ interface ToolMenuItem {
toolId: string
authorUsername: string
ver: string
platform: Platform
}

View File

@@ -170,6 +170,7 @@ const ToolCard = ({ tools, onDelete, onUpgrade, onSubmit, onCancel }: ToolCardPr
toolName={selectedTool.name}
toolId={selectedTool.toolId}
ver={selectedTool.ver}
platform={selectedTool.platform}
onOpen={handleOnOpenTool}
onEdit={handleOnEditTool()}
onSource={handleOnSourceTool()}

View File

@@ -3,7 +3,7 @@ import { arrayMove, SortableContext } from '@dnd-kit/sortable'
import type { DragEndEvent } from '@dnd-kit/core/dist/types'
import '@/assets/css/pages/tools-framework.scss'
import { tools } from '@/router/tools'
import { getToolMenuItem, saveToolMenuItem } from '@/util/common'
import { checkDesktop, getToolMenuItem, saveToolMenuItem } from '@/util/common'
import { getViewPath } from '@/util/navigation'
import FitFullscreen from '@/components/common/FitFullscreen'
import Sidebar from '@/components/common/Sidebar'
@@ -34,12 +34,12 @@ const ToolsFramework = () => {
const handleOnDragEnd = ({ active, over }: DragEndEvent) => {
if (over && active.id !== over?.id) {
const activeIndex = toolMenuItem.findIndex(
({ authorUsername, toolId, ver }) =>
`${authorUsername}:${toolId}:${ver}` === active.id
({ authorUsername, toolId, ver, platform }) =>
`${authorUsername}:${toolId}:${ver}:${platform}` === active.id
)
const overIndex = toolMenuItem.findIndex(
({ authorUsername, toolId, ver }) =>
`${authorUsername}:${toolId}:${ver}` === over.id
({ authorUsername, toolId, ver, platform }) =>
`${authorUsername}:${toolId}:${ver}:${platform}` === over.id
)
setToolMenuItem(arrayMove(toolMenuItem, activeIndex, overIndex))
}
@@ -47,8 +47,8 @@ const ToolsFramework = () => {
if (!over) {
setToolMenuItem(
toolMenuItem.filter(
({ authorUsername, toolId, ver }) =>
`${authorUsername}:${toolId}:${ver}` !== active?.id
({ authorUsername, toolId, ver, platform }) =>
`${authorUsername}:${toolId}:${ver}:${platform}` !== active?.id
)
)
}
@@ -63,7 +63,12 @@ const ToolsFramework = () => {
ver === newItem.ver
) === -1
) {
setToolMenuItem([...toolMenuItem, newItem])
if (!checkDesktop() && newItem.platform === 'DESKTOP') {
void message.warning('暂不支持添加桌面端应用')
setToolMenuItem(toolMenuItem)
} else {
setToolMenuItem([...toolMenuItem, newItem])
}
}
}
@@ -110,8 +115,8 @@ const ToolsFramework = () => {
<Sidebar.ItemList>
<SortableContext
items={toolMenuItem.map(
({ authorUsername, toolId, ver }) =>
`${authorUsername}:${toolId}:${ver}`
({ authorUsername, toolId, ver, platform }) =>
`${authorUsername}:${toolId}:${ver}:${platform}`
)}
>
{toolMenuItem.map(
@@ -120,16 +125,18 @@ const ToolsFramework = () => {
toolName,
toolId,
authorUsername,
ver
ver,
platform
}) => (
<Sortable
id={`${authorUsername}:${toolId}:${ver}`}
id={`${authorUsername}:${toolId}:${ver}:${platform}`}
data={{
icon,
toolName,
toolId,
authorUsername,
ver
ver,
platform
}}
isDelete={isDelete}
>
@@ -137,12 +144,12 @@ const ToolsFramework = () => {
path={getViewPath(
authorUsername,
toolId,
import.meta.env.VITE_PLATFORM,
platform,
ver
)}
icon={icon}
text={toolName}
key={`${authorUsername}:${toolId}`}
key={`${authorUsername}:${toolId}:${ver}:${platform}`}
extend={<DragHandle padding={10} />}
/>
</Sortable>