diff --git a/src/components/dialog/PluginConfigDialog.vue b/src/components/dialog/PluginConfigDialog.vue index 3ee32243..57bb304a 100644 --- a/src/components/dialog/PluginConfigDialog.vue +++ b/src/components/dialog/PluginConfigDialog.vue @@ -48,14 +48,23 @@ const renderMode = ref('vuetify') //Vue 模式:组件 URL const vueComponentUrl = ref(null) -//Vue 模式:动态加载的组件 +// Vue 模式:动态加载的组件 const dynamicComponent = computed(() => { if (renderMode.value === 'vue' && vueComponentUrl.value) { const url = vueComponentUrl.value return defineAsyncComponent(() => - import(/* @vite-ignore */ url) + api + .get(url) + .then((response: any) => { + if (response) { + const blob = new Blob([response.data], { type: 'text/javascript' }) + const blobUrl = URL.createObjectURL(blob) + return import(/* @vite-ignore */ blobUrl) + } else { + return { render: () => h('div', '组件加载失败: 无默认导出') } + } + }) .then(module => { - // 假设 JS 文件默认导出组件 if (module.default) { return module.default } else { diff --git a/src/components/dialog/PluginDataDialog.vue b/src/components/dialog/PluginDataDialog.vue index 2be905ad..e620f9f7 100644 --- a/src/components/dialog/PluginDataDialog.vue +++ b/src/components/dialog/PluginDataDialog.vue @@ -40,7 +40,17 @@ const dynamicComponent = computed(() => { if (renderMode.value === 'vue' && vueComponentUrl.value) { const url = vueComponentUrl.value return defineAsyncComponent(() => - import(/* @vite-ignore */ url) + api + .get(url) + .then((response: any) => { + if (response) { + const blob = new Blob([response.data], { type: 'text/javascript' }) + const blobUrl = URL.createObjectURL(blob) + return import(/* @vite-ignore */ blobUrl) + } else { + return { render: () => h('div', '组件加载失败: 无默认导出') } + } + }) .then(module => { if (module.default) { return module.default diff --git a/src/components/misc/DashboardElement.vue b/src/components/misc/DashboardElement.vue index 11cab2af..4bf826d8 100644 --- a/src/components/misc/DashboardElement.vue +++ b/src/components/misc/DashboardElement.vue @@ -12,6 +12,7 @@ import MediaServerLibrary from '@/views/dashboard/MediaServerLibrary.vue' import MediaServerPlaying from '@/views/dashboard/MediaServerPlaying.vue' import DashboardRender from '@/components/render/DashboardRender.vue' import { isNullOrEmptyObject } from '@/@core/utils' +import api from '@/api' // 输入参数 const props = defineProps({ @@ -35,19 +36,27 @@ const pluginRenderMode = computed(() => props.config?.render_mode || 'vuetify') const dynamicPluginComponent = computed(() => { // 确保 config 存在并且 component_url 也存在 if (pluginRenderMode.value === 'vue' && props.config?.component_url) { - const url = props.config.component_url + const url = props.config?.component_url return defineAsyncComponent(() => - import(/* @vite-ignore */ url) + api + .get(url) + .then((response: any) => { + if (response) { + const blob = new Blob([response.data], { type: 'text/javascript' }) + const blobUrl = URL.createObjectURL(blob) + return import(/* @vite-ignore */ blobUrl) + } else { + return { render: () => h('div', '组件加载失败: 无默认导出') } + } + }) .then(module => { if (module.default) { return module.default } else { - console.error(`无法从 ${url} 加载默认导出的 Vue 组件`) return { render: () => h('div', '组件加载失败: 无默认导出') } } }) .catch(err => { - console.error(`无法加载插件仪表盘组件: ${url}`, err) return { render: () => h('div', '组件加载失败') } }), )