diff --git a/src/assets/logo.png b/src/assets/logo.png new file mode 100644 index 00000000..411f5cd8 Binary files /dev/null and b/src/assets/logo.png differ diff --git a/src/components/dropdown-selector/EditorProviderSelector.vue b/src/components/dropdown-selector/EditorProviderSelector.vue new file mode 100644 index 00000000..5f1ac759 --- /dev/null +++ b/src/components/dropdown-selector/EditorProviderSelector.vue @@ -0,0 +1,62 @@ + + + + + + + + {{ provider?.displayName }} + + + + + + + + + + {{ editorProvider.displayName }} + + + + + + + diff --git a/src/composables/use-editor-extension-points.ts b/src/composables/use-editor-extension-points.ts index 5edfe927..47968bed 100644 --- a/src/composables/use-editor-extension-points.ts +++ b/src/composables/use-editor-extension-points.ts @@ -1,7 +1,13 @@ import { usePluginModuleStore } from "@/stores/plugin"; -import type { EditorProvider, PluginModule } from "@halo-dev/console-shared"; +import type { EditorProvider as EditorProviderRaw } from "@halo-dev/console-shared"; +import type { PluginModule } from "@/stores/plugin"; import { onMounted, ref, type Ref, defineAsyncComponent } from "vue"; import { VLoading } from "@halo-dev/components"; +import Logo from "@/assets/logo.png"; + +export interface EditorProvider extends EditorProviderRaw { + logo?: string; +} interface useEditorExtensionPointsReturn { editorProviders: Ref; @@ -21,6 +27,7 @@ export function useEditorExtensionPoints(): useEditorExtensionPointsReturn { delay: 200, }), rawType: "HTML", + logo: Logo, }, ]); @@ -35,7 +42,10 @@ export function useEditorExtensionPoints(): useEditorExtensionPointsReturn { if (providers) { providers.forEach((provider) => { - editorProviders.value.push(provider); + editorProviders.value.push({ + ...provider, + logo: pluginModule.extension.status?.logo, + }); }); } }); diff --git a/src/main.ts b/src/main.ts index 8d4555b2..1eefc680 100644 --- a/src/main.ts +++ b/src/main.ts @@ -145,7 +145,10 @@ async function loadPluginModules() { if (pluginModule) { registerModule(pluginModule, false); - pluginModuleStore.registerPluginModule(pluginModule); + pluginModuleStore.registerPluginModule({ + ...pluginModule, + extension: plugin, + }); } } catch (e) { const message = `${plugin.metadata.name}: 加载插件入口文件失败`; diff --git a/src/modules/contents/pages/SinglePageEditor.vue b/src/modules/contents/pages/SinglePageEditor.vue index 9d45205f..b46d5cd1 100644 --- a/src/modules/contents/pages/SinglePageEditor.vue +++ b/src/modules/contents/pages/SinglePageEditor.vue @@ -28,14 +28,29 @@ import cloneDeep from "lodash.clonedeep"; import { useRouter } from "vue-router"; import { randomUUID } from "@/utils/id"; import { useContentCache } from "@/composables/use-content-cache"; -import { useEditorExtensionPoints } from "@/composables/use-editor-extension-points"; -import type { EditorProvider } from "@halo-dev/console-shared"; +import { + useEditorExtensionPoints, + type EditorProvider, +} from "@/composables/use-editor-extension-points"; +import { useLocalStorage } from "@vueuse/core"; +import EditorProviderSelector from "@/components/dropdown-selector/EditorProviderSelector.vue"; const router = useRouter(); +// Editor providers const { editorProviders } = useEditorExtensionPoints(); const currentEditorProvider = ref(); +const storedEditorProviderName = useLocalStorage("editor-provider-name", ""); +const handleChangeEditorProvider = (provider: EditorProvider) => { + currentEditorProvider.value = provider; + storedEditorProviderName.value = provider.name; + formState.value.page.metadata.annotations = { + "content.halo.run/preferred-editor": provider.name, + }; +}; + +// SinglePage form const initialFormState: SinglePageRequest = { page: { spec: { @@ -238,6 +253,7 @@ const handleFetchContent = async () => { formState.value.content = Object.assign(formState.value.content, data); }; +// SinglePage settings const handleOpenSettingModal = async () => { const { data: latestSinglePage } = await apiClient.extension.singlePage.getcontentHaloRunV1alpha1SinglePage({ @@ -267,7 +283,6 @@ const onSettingPublished = (singlePage: SinglePage) => { handlePublish(); }; -const editor = useRouteQuery("editor"); onMounted(async () => { if (routeQueryName.value) { const { data: singlePage } = @@ -282,7 +297,7 @@ onMounted(async () => { // Set default editor const provider = editorProviders.value.find( - (provider) => provider.name === editor.value + (provider) => provider.name === storedEditorProviderName.value ) || editorProviders.value[0]; if (provider) { currentEditorProvider.value = provider; @@ -296,6 +311,7 @@ onMounted(async () => { handleResetCache(); }); +// SinglePage content cache const { handleSetContentCache, handleResetCache, handleClearCache } = useContentCache( "singlePage-content-cache", @@ -320,6 +336,12 @@ const { handleSetContentCache, handleResetCache, handleClearCache } = + + { 回收站 - - - - - - 新建 - - - - - - {{ editorProvider.displayName }} - - - - - (); +const storedEditorProviderName = useLocalStorage("editor-provider-name", ""); +const handleChangeEditorProvider = (provider: EditorProvider) => { + currentEditorProvider.value = provider; + storedEditorProviderName.value = provider.name; + formState.value.post.metadata.annotations = { + "content.halo.run/preferred-editor": provider.name, + }; +}; + +// Post form const initialFormState: PostRequest = { post: { spec: { @@ -254,6 +269,7 @@ const handleOpenSettingModal = async () => { settingModal.value = true; }; +// Post settings const onSettingSaved = (post: Post) => { // Set route query parameter if (!isUpdateMode.value) { @@ -276,7 +292,6 @@ const onSettingPublished = (post: Post) => { // Get post data when the route contains the name parameter const name = useRouteQuery("name"); -const editor = useRouteQuery("editor"); onMounted(async () => { if (name.value) { // fetch post @@ -292,7 +307,7 @@ onMounted(async () => { // Set default editor const provider = editorProviders.value.find( - (provider) => provider.name === editor.value + (provider) => provider.name === storedEditorProviderName.value ) || editorProviders.value[0]; if (provider) { @@ -307,6 +322,7 @@ onMounted(async () => { handleResetCache(); }); +// Post content cache const { handleSetContentCache, handleResetCache, handleClearCache } = useContentCache( "post-content-cache", @@ -331,6 +347,12 @@ const { handleSetContentCache, handleResetCache, handleClearCache } = + + ({ page: 1, size: 20, @@ -480,39 +477,7 @@ const hasFilters = computed(() => { 标签 回收站 - - - - - - 新建 - - - - - - {{ editorProvider.displayName }} - - - - - -