组件修改
This commit is contained in:
@@ -58,29 +58,12 @@
|
||||
<!-- 主内容区 -->
|
||||
<main class="main-content">
|
||||
<!-- iframe 模式 -->
|
||||
<div v-if="currentIframeUrl" class="iframe-container">
|
||||
<div class="iframe-header">
|
||||
<span class="iframe-title">{{ currentMenuItem?.label }}</span>
|
||||
<el-button
|
||||
text
|
||||
@click="handleRefreshIframe"
|
||||
:icon="Refresh"
|
||||
>
|
||||
刷新
|
||||
</el-button>
|
||||
</div>
|
||||
<iframe
|
||||
ref="iframeRef"
|
||||
:src="currentIframeUrl"
|
||||
class="content-iframe"
|
||||
frameborder="0"
|
||||
@load="handleIframeLoad"
|
||||
/>
|
||||
<div v-if="iframeLoading" class="iframe-loading">
|
||||
<Loader :size="20" class="is-loading" />
|
||||
<span>加载中...</span>
|
||||
</div>
|
||||
</div>
|
||||
<IframeView
|
||||
v-if="currentIframeUrl"
|
||||
:url="currentIframeUrl"
|
||||
:title="currentMenuItem?.label"
|
||||
:show-header="true"
|
||||
/>
|
||||
|
||||
<!-- 路由模式 -->
|
||||
<router-view v-else />
|
||||
@@ -101,13 +84,9 @@ import {
|
||||
ChevronRight,
|
||||
User,
|
||||
Settings,
|
||||
LogOut,
|
||||
RefreshCw,
|
||||
Loader
|
||||
LogOut
|
||||
} from 'lucide-vue-next'
|
||||
|
||||
// el-button 图标需要传入组件
|
||||
const Refresh = RefreshCw
|
||||
import { IframeView } from 'shared/components'
|
||||
import { ElMessage } from 'element-plus'
|
||||
import type { MenuItem } from 'shared/types'
|
||||
|
||||
@@ -117,8 +96,6 @@ const route = useRoute()
|
||||
// 状态管理
|
||||
const collapsed = ref(false)
|
||||
const activeMenu = ref('home')
|
||||
const iframeLoading = ref(false)
|
||||
const iframeRef = ref<HTMLIFrameElement>()
|
||||
|
||||
// 从 LocalStorage 获取用户名
|
||||
function getUserName(): string {
|
||||
@@ -200,7 +177,7 @@ const menuItems = ref<MenuItem[]>(loadMenuFromStorage())
|
||||
|
||||
// 当前菜单项
|
||||
const currentMenuItem = computed(() => {
|
||||
return menuItems.value.find(item => item.key === activeMenu.value)
|
||||
return menuItems.value.find((item: MenuItem) => item.key === activeMenu.value)
|
||||
})
|
||||
|
||||
// 当前 iframe URL(从路由 meta 读取)
|
||||
@@ -221,24 +198,9 @@ const handleMenuClick = (item: MenuItem) => {
|
||||
// 所有菜单都通过路由跳转
|
||||
if (item.url) {
|
||||
router.push(item.url)
|
||||
if (item.viewType === 'iframe') {
|
||||
iframeLoading.value = true
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// iframe 加载完成
|
||||
const handleIframeLoad = () => {
|
||||
iframeLoading.value = false
|
||||
}
|
||||
|
||||
// 刷新 iframe
|
||||
const handleRefreshIframe = () => {
|
||||
if (iframeRef.value) {
|
||||
iframeLoading.value = true
|
||||
iframeRef.value.src = iframeRef.value.src
|
||||
}
|
||||
}
|
||||
|
||||
// 用户头像加载错误
|
||||
const handleAvatarError = () => {
|
||||
|
||||
Reference in New Issue
Block a user