mirror of
https://github.com/jxxghp/MoviePilot-Frontend.git
synced 2026-09-05 23:56:42 +08:00
添加关闭页面的功能,更新多个组件以支持新的事件通知机制,并调整文档以反映最新的功能变化,提升用户交互体验。
This commit is contained in:
@@ -101,6 +101,11 @@ function notifyRefresh() {
|
|||||||
function notifySwitch() {
|
function notifySwitch() {
|
||||||
emit('switch')
|
emit('switch')
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// 通知主应用关闭当前页面
|
||||||
|
function notifyClose() {
|
||||||
|
emit('close')
|
||||||
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
@@ -108,6 +113,7 @@ function notifySwitch() {
|
|||||||
<!-- 插件详情页面内容 -->
|
<!-- 插件详情页面内容 -->
|
||||||
<v-btn @click="notifyRefresh">刷新数据</v-btn>
|
<v-btn @click="notifyRefresh">刷新数据</v-btn>
|
||||||
<v-btn @click="notifySwitch">配置插件</v-btn>
|
<v-btn @click="notifySwitch">配置插件</v-btn>
|
||||||
|
<v-btn @click="notifyClose">关闭页面</v-btn>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
```
|
```
|
||||||
@@ -134,6 +140,16 @@ const emit = defineEmits(['save'])
|
|||||||
function saveConfig() {
|
function saveConfig() {
|
||||||
emit('save', config.value)
|
emit('save', config.value)
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// 通知主应用切换到详情页面
|
||||||
|
function notifySwitch() {
|
||||||
|
emit('switch')
|
||||||
|
}
|
||||||
|
|
||||||
|
// 通知主应用关闭当前页面
|
||||||
|
function notifyClose() {
|
||||||
|
emit('close')
|
||||||
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
@@ -143,6 +159,12 @@ function saveConfig() {
|
|||||||
|
|
||||||
<!-- 保存按钮 -->
|
<!-- 保存按钮 -->
|
||||||
<v-btn color="primary" @click="saveConfig">保存配置</v-btn>
|
<v-btn color="primary" @click="saveConfig">保存配置</v-btn>
|
||||||
|
|
||||||
|
<!-- 关闭按钮 -->
|
||||||
|
<v-btn color="primary" @click="notifyClose">关闭页面</v-btn>
|
||||||
|
|
||||||
|
<!-- 切换按钮 -->
|
||||||
|
<v-btn color="primary" @click="notifySwitch">切换到详情页面</v-btn>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
```
|
```
|
||||||
@@ -252,13 +274,10 @@ export default defineConfig({
|
|||||||
|
|
||||||
## 10. 示例代码
|
## 10. 示例代码
|
||||||
|
|
||||||
完整的示例插件代码可在以下仓库获取:
|
- [插件远程组件示例](../examples/plugin-component/) - 开发插件组件的完整示例项目
|
||||||
|
|
||||||
[https://github.com/example/moviepilot-plugin-example](https://github.com/example/moviepilot-plugin-example) (示例链接,实际链接需替换)
|
|
||||||
|
|
||||||
## 11. 参考资料
|
## 11. 参考资料
|
||||||
|
|
||||||
- [Module Federation官方文档](https://webpack.js.org/concepts/module-federation/)
|
|
||||||
- [Vite Plugin Federation](https://github.com/originjs/vite-plugin-federation)
|
- [Vite Plugin Federation](https://github.com/originjs/vite-plugin-federation)
|
||||||
- [Vue 3官方文档](https://vuejs.org/)
|
- [Vue 3官方文档](https://vuejs.org/)
|
||||||
|
|
||||||
|
|||||||
@@ -183,7 +183,13 @@ onBeforeMount(async () => {
|
|||||||
</VCard>
|
</VCard>
|
||||||
<!-- Vue 渲染模式 -->
|
<!-- Vue 渲染模式 -->
|
||||||
<div v-else-if="renderMode === 'vue'">
|
<div v-else-if="renderMode === 'vue'">
|
||||||
<component :is="dynamicComponent" :initial-config="pluginConfigForm" @save="handleVueComponentSave" @switch="emit('switch')"/>
|
<component
|
||||||
|
:is="dynamicComponent"
|
||||||
|
:initial-config="pluginConfigForm"
|
||||||
|
@save="handleVueComponentSave"
|
||||||
|
@switch="emit('switch')"
|
||||||
|
@close="emit('close')"
|
||||||
|
/>
|
||||||
</div>
|
</div>
|
||||||
<!-- 进度框 -->
|
<!-- 进度框 -->
|
||||||
<ProgressDialog v-if="progressDialog" v-model="progressDialog" :text="progressText" />
|
<ProgressDialog v-if="progressDialog" v-model="progressDialog" :text="progressText" />
|
||||||
|
|||||||
@@ -142,7 +142,7 @@ onMounted(() => {
|
|||||||
</VCard>
|
</VCard>
|
||||||
<!-- Vue 渲染模式 -->
|
<!-- Vue 渲染模式 -->
|
||||||
<div v-else-if="renderMode === 'vue'">
|
<div v-else-if="renderMode === 'vue'">
|
||||||
<component :is="dynamicComponent" @action="handleAction" @switch="emit('switch')" />
|
<component :is="dynamicComponent" @action="handleAction" @switch="emit('switch')" @close="emit('close')" />
|
||||||
</div>
|
</div>
|
||||||
</VDialog>
|
</VDialog>
|
||||||
</template>
|
</template>
|
||||||
|
|||||||
Reference in New Issue
Block a user