diff --git a/src/renderer/src/assets/svg/star.svg b/src/renderer/src/assets/svg/star.svg new file mode 100644 index 0000000..9cda14b --- /dev/null +++ b/src/renderer/src/assets/svg/star.svg @@ -0,0 +1 @@ + diff --git a/src/renderer/src/assets/svg/starFilled.svg b/src/renderer/src/assets/svg/starFilled.svg new file mode 100644 index 0000000..849b839 --- /dev/null +++ b/src/renderer/src/assets/svg/starFilled.svg @@ -0,0 +1 @@ + diff --git a/src/renderer/src/constants/common.constants.ts b/src/renderer/src/constants/common.constants.ts index 6a4a6fe..ead8e99 100644 --- a/src/renderer/src/constants/common.constants.ts +++ b/src/renderer/src/constants/common.constants.ts @@ -1,6 +1,7 @@ export const PRODUCTION_NAME = 'Oxygen Toolbox' export const STORAGE_TOKEN_KEY = 'JWT_TOKEN' export const STORAGE_USER_INFO_KEY = 'USER_INFO' +export const STORAGE_FAVORITE_KEY = 'FAVORITE' export const COLOR_ORIGIN = 'white' export const COLOR_PRODUCTION = '#4E47BB' export const COLOR_MAIN = COLOR_PRODUCTION diff --git a/src/renderer/src/constants/urls.constants.ts b/src/renderer/src/constants/urls.constants.ts index c3b20f7..18cec2a 100644 --- a/src/renderer/src/constants/urls.constants.ts +++ b/src/renderer/src/constants/urls.constants.ts @@ -38,6 +38,7 @@ export const URL_TOOL_STORE = `${URL_TOOL}/store` export const URL_TOOL_TEMPLATE = `${URL_TOOL}/template` export const URL_TOOL_CATEGORY = `${URL_TOOL}/category` export const URL_TOOL_DETAIL = `${URL_TOOL}/detail` +export const URL_TOOL_FAVORITE = `${URL_TOOL}/favorite` export const URL_API_V1 = '/api/v1' export const URL_API_V1_AVATAR_RANDOM_BASE64 = `${URL_API_V1}/avatar/base64` diff --git a/src/renderer/src/global.d.ts b/src/renderer/src/global.d.ts index 1296c5e..b83ec6f 100644 --- a/src/renderer/src/global.d.ts +++ b/src/renderer/src/global.d.ts @@ -611,6 +611,7 @@ interface ToolVo { review: 'NONE' | 'PROCESSING' | 'PASS' | 'REJECT' createTime: string updateTime: string + favorite: boolean } interface ToolCreateParam { @@ -654,3 +655,9 @@ interface ToolManagementPassParam { interface ToolStoreGetParam extends PageParam { searchValue?: string } + +interface ToolFavoriteAddRemoveParam { + username: string + toolId: string + platform: Platform +} diff --git a/src/renderer/src/pages/Tools/Store.tsx b/src/renderer/src/pages/Tools/Store.tsx index 43651e9..1539c73 100644 --- a/src/renderer/src/pages/Tools/Store.tsx +++ b/src/renderer/src/pages/Tools/Store.tsx @@ -3,10 +3,15 @@ import VanillaTilt, { TiltOptions } from 'vanilla-tilt' import protocolCheck from 'custom-protocol-check' import Icon from '@ant-design/icons' import '@/assets/css/pages/tools/store.scss' -import { COLOR_BACKGROUND, COLOR_MAIN, DATABASE_SELECT_SUCCESS } from '@/constants/common.constants' +import { + COLOR_BACKGROUND, + COLOR_MAIN, + COLOR_PRODUCTION, + DATABASE_SELECT_SUCCESS +} from '@/constants/common.constants' import { checkDesktop } from '@/util/common' import { navigateToSource, navigateToStore, navigateToView } from '@/util/navigation' -import { r_tool_store_get } from '@/services/tool' +import { r_tool_add_favorite, r_tool_remove_favorite, r_tool_store_get } from '@/services/tool' import Card from '@/components/common/Card' import FlexBox from '@/components/common/FlexBox' import FitFullscreen from '@/components/common/FitFullscreen' @@ -25,6 +30,7 @@ interface CommonCardProps ver: string platform: Platform supportPlatform: Platform[] + favorite: boolean } const CommonCard = ({ @@ -48,11 +54,13 @@ const CommonCard = ({ ver, platform, supportPlatform, + favorite, ...props }: CommonCardProps) => { const navigate = useNavigate() const [modal, contextHolder] = AntdModal.useModal() const cardRef = useRef(null) + const [favorite_, setFavorite_] = useState(favorite) useEffect(() => { cardRef.current && VanillaTilt.init(cardRef.current, options) @@ -94,6 +102,37 @@ const CommonCard = ({ navigateToSource(navigate, authorUsername, toolId, platform) } + const handleOnStarBtnClick = (e: MouseEvent) => { + e.stopPropagation() + if (favorite_) { + void r_tool_remove_favorite({ + username: authorUsername, + toolId: toolId, + platform: platform + }).then((res) => { + const response = res.data + if (response.success) { + setFavorite_(false) + } else { + void message.error('取消收藏失败，请稍后重试') + } + }) + } else { + void r_tool_add_favorite({ + username: authorUsername, + toolId: toolId, + platform: platform + }).then((res) => { + const response = res.data + if (response.success) { + setFavorite_(true) + } else { + void message.error('收藏失败，请稍后重试') + } + }) + } + } + const handleOnAndroidBtnClick = (e: MouseEvent) => { e.stopPropagation() void modal.info({ @@ -204,6 +243,13 @@ const CommonCard = ({ + + + @@ -382,6 +428,7 @@ const Store = () => { ver={firstTool!.ver} platform={firstTool!.platform} supportPlatform={tools.map((value) => value.platform)} + favorite={firstTool!.favorite} /> ) })} diff --git a/src/renderer/src/services/tool.tsx b/src/renderer/src/services/tool.tsx index 995bb79..3464627 100644 --- a/src/renderer/src/services/tool.tsx +++ b/src/renderer/src/services/tool.tsx @@ -3,6 +3,7 @@ import { URL_TOOL, URL_TOOL_CATEGORY, URL_TOOL_DETAIL, + URL_TOOL_FAVORITE, URL_TOOL_STORE, URL_TOOL_TEMPLATE } from '@/constants/urls.constants' @@ -37,3 +38,9 @@ export const r_tool_store_get = (param: ToolStoreGetParam) => export const r_tool_store_get_by_username = (username: string, param: ToolStoreGetParam) => request.get>(`${URL_TOOL_STORE}/${username}`, param) + +export const r_tool_add_favorite = (param: ToolFavoriteAddRemoveParam) => + request.post(`${URL_TOOL_FAVORITE}`, param) + +export const r_tool_remove_favorite = (param: ToolFavoriteAddRemoveParam) => + request.delete(`${URL_TOOL_FAVORITE}`, param)