From 6744d93efec4eb313a497f868d3cb101744274c0 Mon Sep 17 00:00:00 2001 From: Noah Hsu Date: Mon, 11 Jul 2022 21:01:16 +0800 Subject: [PATCH] feat: common settings save --- src/hooks/useLoading.ts | 11 +++++--- src/pages/login/index.tsx | 2 +- src/pages/manage/SideMenu.tsx | 8 +++--- src/pages/manage/settings/Common.tsx | 33 ++++++++++++++++++----- src/pages/manage/settings/SettingItem.tsx | 4 +-- src/utils/log.ts | 7 +++++ src/utils/proxy.ts | 5 ++++ src/utils/request.ts | 2 ++ 8 files changed, 55 insertions(+), 17 deletions(-) create mode 100644 src/utils/log.ts create mode 100644 src/utils/proxy.ts diff --git a/src/hooks/useLoading.ts b/src/hooks/useLoading.ts index 68b629c24..e57a8795c 100644 --- a/src/hooks/useLoading.ts +++ b/src/hooks/useLoading.ts @@ -1,16 +1,19 @@ +import { Accessor } from "solid-js"; import { createSignal } from "solid-js"; -const useLoading = (p: () => Promise) => { +const useLoading = ( + p: () => Promise +): [Accessor, () => Promise] => { const [loading, setLoading] = createSignal(false); - return { + return [ loading, - data: async () => { + async () => { setLoading(true); const data = await p(); setLoading(false); return data; }, - }; + ]; }; export { useLoading }; diff --git a/src/pages/login/index.tsx b/src/pages/login/index.tsx index 247a7f049..3f0e05222 100644 --- a/src/pages/login/index.tsx +++ b/src/pages/login/index.tsx @@ -36,7 +36,7 @@ const Login = () => { localStorage.getItem("password") || "" ); const [remember, setRemember] = createStorageSignal("remember-pwd", false); - const { loading, data } = useLoading(() => + const [ loading, data ] = useLoading(() => r.post("/auth/login", { username: username(), password: password(), diff --git a/src/pages/manage/SideMenu.tsx b/src/pages/manage/SideMenu.tsx index dfc8896eb..e40944418 100644 --- a/src/pages/manage/SideMenu.tsx +++ b/src/pages/manage/SideMenu.tsx @@ -34,13 +34,13 @@ const SideMenuItemWithTo = (props: SideMenuItemProps) => { w="$full" alignItems="center" _hover={{ - bgColor: isActive() ? "$info9" : "#9CA3AF40", + bgColor: isActive() ? "$info4" : "$neutral4", }} p="$2" rounded="$md" cursor="pointer" - bgColor={isActive() ? "$info9" : ""} - color={isActive() ? "#fff" : ""} + bgColor={isActive() ? "$info4" : ""} + color={isActive() ? "$info11" : ""} > {} {t(props.title)} @@ -62,7 +62,7 @@ const SideMenuItemWithChildren = (props: SideMenuItemProps) => { w="$full" alignItems="center" _hover={{ - bgColor: "rgba(156,163,175,0.2)", + bgColor: "$neutral4", }} p="$2" rounded="$md" diff --git a/src/pages/manage/settings/Common.tsx b/src/pages/manage/settings/Common.tsx index d92675a08..db3772aca 100644 --- a/src/pages/manage/settings/Common.tsx +++ b/src/pages/manage/settings/Common.tsx @@ -5,29 +5,35 @@ import { r } from "~/utils/request"; import { createStore } from "solid-js/store"; import { Resp } from "~/types/resp"; import { notify } from "~/utils/notify"; -import { Grid } from "@hope-ui/solid"; +import { Button, SimpleGrid } from "@hope-ui/solid"; import { Index } from "solid-js"; import { Item } from "./SettingItem"; +import { useT } from "~/hooks/useT"; +import { getTarget } from "~/utils/proxy"; export interface CommonSettingsProps { group: Group; } const CommonSettings = (props: CommonSettingsProps) => { - const { loading, data } = useLoading(() => + const t = useT(); + const [settings_loading, settings_data] = useLoading(() => r.get(`/admin/setting/list?group=${props.group}`) ); const [settings, setSettings] = createStore([]); (async () => { - const res: Resp = await data(); + const res: Resp = await settings_data(); if (res.code === 200) { setSettings(res.data); } else { notify.error(res.message); } })(); + const [save_loading, save_data] = useLoading(() => + r.post("/admin/setting/save", getTarget(settings)) + ); return ( - - + + {(item, i) => ( { /> )} - + + ); }; diff --git a/src/pages/manage/settings/SettingItem.tsx b/src/pages/manage/settings/SettingItem.tsx index 8c7fa617f..f85962722 100644 --- a/src/pages/manage/settings/SettingItem.tsx +++ b/src/pages/manage/settings/SettingItem.tsx @@ -30,7 +30,7 @@ export type ItemProps = SettingItem & { const Item = (props: ItemProps) => { const t = useT(); return ( - + {t(`manage.settings.${props.key}`)} {t("manage.settings.unknown_type")}}> @@ -49,7 +49,7 @@ const Item = (props: ItemProps) => { // checked={props.value() === "true"} onChange={(e: any) => // props.onChange?.(props.value() === "true" ? "false" : "true") - props.onChange?.(e.currentTarget.checked) + props.onChange?.(e.currentTarget.checked ? "true" : "false") } /> diff --git a/src/utils/log.ts b/src/utils/log.ts new file mode 100644 index 000000000..49553b927 --- /dev/null +++ b/src/utils/log.ts @@ -0,0 +1,7 @@ +const log = (message?: any, ...optionalParams: any[]) => { + if (import.meta.env.DEV) { + console.log(message, ...optionalParams); + } +}; + +export { log }; diff --git a/src/utils/proxy.ts b/src/utils/proxy.ts new file mode 100644 index 000000000..1ae1d4ee4 --- /dev/null +++ b/src/utils/proxy.ts @@ -0,0 +1,5 @@ +const getTarget = (proxy: any) => { + return JSON.parse(JSON.stringify(proxy)); +}; + +export { getTarget }; diff --git a/src/utils/request.ts b/src/utils/request.ts index ef6bcb9cc..96e46f7d0 100644 --- a/src/utils/request.ts +++ b/src/utils/request.ts @@ -1,6 +1,7 @@ import axios from "axios"; import { api } from "./base_url"; import { bus } from "./bus"; +import { log } from "./log"; const instance = axios.create({ baseURL: api + "/api", @@ -28,6 +29,7 @@ instance.interceptors.request.use( instance.interceptors.response.use( (response) => { const resp = response.data; + log(resp); if (resp.code === 401) { bus.emit( "to",