feat: add support for resetting configmap of plugin and theme (#777)

#### What type of PR is this?

/kind feature

#### What this PR does / why we need it:

支持重置主题和插件的设置选项。适配 https://github.com/halo-dev/halo/pull/2964

#### Which issue(s) this PR fixes:

Fixes https://github.com/halo-dev/halo/issues/2789

#### Screenshots:

<img width="366" alt="image" src="https://user-images.githubusercontent.com/21301288/208022668-288fb8c5-ddd1-456c-9633-ec8865f3b1ba.png">

#### Special notes for your reviewer:

测试方式:

1. 安装若干带有设置选项主题和插件。
2. 进入主题和插件设置,改变部分设置并保存。
3. 重置主题和插件的设置,然后进入设置表单,检查是否已经恢复为了默认。

#### Does this PR introduce a user-facing change?

```release-note
支持重置主题和插件的设置选项。
```
pull/782/head
Ryan Wang 2022-12-19 16:25:47 +08:00 committed by GitHub
parent 57f4f2226f
commit 0a7cbd3018
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
7 changed files with 90 additions and 12 deletions

View File

@ -40,7 +40,7 @@
"@formkit/themes": "^1.0.0-beta.12", "@formkit/themes": "^1.0.0-beta.12",
"@formkit/utils": "^1.0.0-beta.12", "@formkit/utils": "^1.0.0-beta.12",
"@formkit/vue": "^1.0.0-beta.12", "@formkit/vue": "^1.0.0-beta.12",
"@halo-dev/api-client": "^0.0.60", "@halo-dev/api-client": "^0.0.62",
"@halo-dev/components": "workspace:*", "@halo-dev/components": "workspace:*",
"@halo-dev/console-shared": "workspace:*", "@halo-dev/console-shared": "workspace:*",
"@halo-dev/richtext-editor": "^0.0.0-alpha.17", "@halo-dev/richtext-editor": "^0.0.0-alpha.17",

View File

@ -12,7 +12,7 @@ importers:
'@formkit/themes': ^1.0.0-beta.12 '@formkit/themes': ^1.0.0-beta.12
'@formkit/utils': ^1.0.0-beta.12 '@formkit/utils': ^1.0.0-beta.12
'@formkit/vue': ^1.0.0-beta.12 '@formkit/vue': ^1.0.0-beta.12
'@halo-dev/api-client': ^0.0.60 '@halo-dev/api-client': ^0.0.62
'@halo-dev/components': workspace:* '@halo-dev/components': workspace:*
'@halo-dev/console-shared': workspace:* '@halo-dev/console-shared': workspace:*
'@halo-dev/richtext-editor': ^0.0.0-alpha.17 '@halo-dev/richtext-editor': ^0.0.0-alpha.17
@ -107,7 +107,7 @@ importers:
'@formkit/themes': 1.0.0-beta.12-e579559_tailwindcss@3.2.4 '@formkit/themes': 1.0.0-beta.12-e579559_tailwindcss@3.2.4
'@formkit/utils': 1.0.0-beta.12-e579559 '@formkit/utils': 1.0.0-beta.12-e579559
'@formkit/vue': 1.0.0-beta.12-e579559_ior6jr3fpijijuwpr34w2i25va '@formkit/vue': 1.0.0-beta.12-e579559_ior6jr3fpijijuwpr34w2i25va
'@halo-dev/api-client': 0.0.60 '@halo-dev/api-client': 0.0.62
'@halo-dev/components': link:packages/components '@halo-dev/components': link:packages/components
'@halo-dev/console-shared': link:packages/shared '@halo-dev/console-shared': link:packages/shared
'@halo-dev/richtext-editor': 0.0.0-alpha.17_vue@3.2.45 '@halo-dev/richtext-editor': 0.0.0-alpha.17_vue@3.2.45
@ -1968,8 +1968,8 @@ packages:
- windicss - windicss
dev: false dev: false
/@halo-dev/api-client/0.0.60: /@halo-dev/api-client/0.0.62:
resolution: {integrity: sha512-HAmJ1BDZxHj2Xp41oNOqZG/1vaR6r4EbBAUQ7ayvUY8SGJMHtJD9dyhCn7k23q6G7FmzFKFNGxajovsjBEM+yg==} resolution: {integrity: sha512-LVoAH4/+8iHxqHf7X6Ax3wy+IRSB2Tm9IC3zhfGdnbrdgyn/NnnpRIhTCKo6cK0Sr2j/3W4Pvmc0xCWNVzNAyw==}
dev: false dev: false
/@halo-dev/richtext-editor/0.0.0-alpha.17_vue@3.2.45: /@halo-dev/richtext-editor/0.0.0-alpha.17_vue@3.2.45:

View File

@ -2,6 +2,7 @@
// core libs // core libs
import { inject, ref } from "vue"; import { inject, ref } from "vue";
import { RouterLink } from "vue-router"; import { RouterLink } from "vue-router";
import { useThemeLifeCycle } from "./composables/use-theme";
// components // components
import { import {
@ -16,15 +17,17 @@ import {
import ThemeUploadModal from "./components/ThemeUploadModal.vue"; import ThemeUploadModal from "./components/ThemeUploadModal.vue";
// types // types
import type { ComputedRef, Ref } from "vue"; import type { Ref } from "vue";
import type { Theme } from "@halo-dev/api-client"; import type { Theme } from "@halo-dev/api-client";
import { apiClient } from "@/utils/api-client"; import { apiClient } from "@/utils/api-client";
const selectedTheme = inject<Ref<Theme | undefined>>("selectedTheme"); const selectedTheme = inject<Ref<Theme | undefined>>("selectedTheme", ref());
const isActivated = inject<ComputedRef<boolean>>("isActivated");
const upgradeModal = ref(false); const upgradeModal = ref(false);
const { isActivated, handleResetSettingConfig } =
useThemeLifeCycle(selectedTheme);
const handleReloadTheme = async () => { const handleReloadTheme = async () => {
Dialog.warning({ Dialog.warning({
title: "确定要重载主题的所有配置吗?", title: "确定要重载主题的所有配置吗?",
@ -105,6 +108,14 @@ const onUpgradeModalClose = () => {
> >
重载主题配置 重载主题配置
</VButton> </VButton>
<VButton
v-close-popper
block
type="danger"
@click="handleResetSettingConfig"
>
重置
</VButton>
</VSpace> </VSpace>
</div> </div>
</template> </template>

View File

@ -36,7 +36,8 @@ const emit = defineEmits<{
const { theme } = toRefs(props); const { theme } = toRefs(props);
const { isActivated, handleActiveTheme } = useThemeLifeCycle(theme); const { isActivated, handleActiveTheme, handleResetSettingConfig } =
useThemeLifeCycle(theme);
const handleUninstall = async (theme: Theme, deleteExtensions?: boolean) => { const handleUninstall = async (theme: Theme, deleteExtensions?: boolean) => {
Dialog.warning({ Dialog.warning({
@ -201,6 +202,14 @@ const handleUninstall = async (theme: Theme, deleteExtensions?: boolean) => {
</div> </div>
</template> </template>
</FloatingDropdown> </FloatingDropdown>
<VButton
v-close-popper
block
type="danger"
@click="handleResetSettingConfig"
>
重置
</VButton>
</template> </template>
</VEntity> </VEntity>
</template> </template>

View File

@ -2,7 +2,7 @@ import type { ComputedRef, Ref } from "vue";
import { computed, ref } from "vue"; import { computed, ref } from "vue";
import type { Theme } from "@halo-dev/api-client"; import type { Theme } from "@halo-dev/api-client";
import { apiClient } from "@/utils/api-client"; import { apiClient } from "@/utils/api-client";
import { Dialog } from "@halo-dev/components"; import { Dialog, Toast } from "@halo-dev/components";
import { useThemeStore } from "@/stores/theme"; import { useThemeStore } from "@/stores/theme";
import { storeToRefs } from "pinia"; import { storeToRefs } from "pinia";
@ -10,6 +10,7 @@ interface useThemeLifeCycleReturn {
loading: Ref<boolean>; loading: Ref<boolean>;
isActivated: ComputedRef<boolean>; isActivated: ComputedRef<boolean>;
handleActiveTheme: () => void; handleActiveTheme: () => void;
handleResetSettingConfig: () => void;
} }
export function useThemeLifeCycle( export function useThemeLifeCycle(
@ -57,10 +58,34 @@ export function useThemeLifeCycle(
}); });
}; };
const handleResetSettingConfig = async () => {
Dialog.warning({
title: "确定要重置主题的所有配置吗?",
description: "该操作会删除已保存的配置,重置为默认配置。",
confirmType: "danger",
onConfirm: async () => {
try {
if (!theme?.value) {
return;
}
await apiClient.theme.resetThemeConfig({
name: theme.value.metadata.name as string,
});
Toast.success("重置配置成功");
} catch (e) {
console.error("Failed to reset theme setting config", e);
}
},
});
};
return { return {
loading, loading,
isActivated, isActivated,
handleActiveTheme, handleActiveTheme,
handleResetSettingConfig,
}; };
} }

View File

@ -1,6 +1,6 @@
<script lang="ts" setup> <script lang="ts" setup>
// core libs // core libs
import { nextTick, onMounted, type ComputedRef, type Ref } from "vue"; import { nextTick, onMounted, type Ref } from "vue";
import { computed, provide, ref, watch } from "vue"; import { computed, provide, ref, watch } from "vue";
import { useRoute, useRouter } from "vue-router"; import { useRoute, useRouter } from "vue-router";
@ -72,7 +72,6 @@ const { setting, handleFetchSettings } = useSettingForm(
); );
provide<Ref<Theme | undefined>>("selectedTheme", selectedTheme); provide<Ref<Theme | undefined>>("selectedTheme", selectedTheme);
provide<ComputedRef<boolean>>("isActivated", isActivated);
const route = useRoute(); const route = useRoute();
const router = useRouter(); const router = useRouter();

View File

@ -8,6 +8,8 @@ import {
VEntity, VEntity,
VEntityField, VEntityField,
VAvatar, VAvatar,
Dialog,
Toast,
} from "@halo-dev/components"; } from "@halo-dev/components";
import PluginUploadModal from "./PluginUploadModal.vue"; import PluginUploadModal from "./PluginUploadModal.vue";
import { ref, toRefs } from "vue"; import { ref, toRefs } from "vue";
@ -15,6 +17,7 @@ import { usePluginLifeCycle } from "../composables/use-plugin";
import type { Plugin } from "@halo-dev/api-client"; import type { Plugin } from "@halo-dev/api-client";
import { formatDatetime } from "@/utils/date"; import { formatDatetime } from "@/utils/date";
import { usePermission } from "@/utils/permission"; import { usePermission } from "@/utils/permission";
import { apiClient } from "@/utils/api-client";
const { currentUserHasPermission } = usePermission(); const { currentUserHasPermission } = usePermission();
@ -40,6 +43,29 @@ const { isStarted, changeStatus, uninstall } = usePluginLifeCycle(plugin);
const onUpgradeModalClose = () => { const onUpgradeModalClose = () => {
emit("reload"); emit("reload");
}; };
const handleResetSettingConfig = async () => {
Dialog.warning({
title: "确定要重置插件的所有配置吗?",
description: "该操作会删除已保存的配置,重置为默认配置。",
confirmType: "danger",
onConfirm: async () => {
try {
if (!plugin?.value) {
return;
}
await apiClient.plugin.resetPluginConfig({
name: plugin.value.metadata.name as string,
});
Toast.success("重置配置成功");
} catch (e) {
console.error("Failed to reset plugin setting config", e);
}
},
});
};
</script> </script>
<template> <template>
<PluginUploadModal <PluginUploadModal
@ -157,6 +183,14 @@ const onUpgradeModalClose = () => {
</div> </div>
</template> </template>
</FloatingDropdown> </FloatingDropdown>
<VButton
v-close-popper
block
type="danger"
@click="handleResetSettingConfig"
>
重置
</VButton>
</template> </template>
</VEntity> </VEntity>
</template> </template>