110 lines
3.3 KiB
Vue
110 lines
3.3 KiB
Vue
<!-- src/views/fileManagement/sheep_pedigree/index.vue -->
|
||
<template>
|
||
<div class="app-container">
|
||
<!-- 诊断信息 -->
|
||
<div style="background:#f0f9ff; padding:20px; margin-bottom:20px; border:1px solid #bae0ff;">
|
||
<h3>页面加载诊断</h3>
|
||
<p><strong>路由路径：</strong> {{ $route.path }}</p>
|
||
<p><strong>路由参数：</strong> {{ $route.params }}</p>
|
||
<p><strong>查询参数：</strong> {{ $route.query }}</p>
|
||
<p><strong>组件路径：</strong> {{ $route.meta?.component }}</p>
|
||
<p><strong>菜单配置：</strong> {{ menuConfig }}</p>
|
||
<el-button @click="reloadPage" type="primary">重新加载</el-button>
|
||
<el-button @click="goBack" type="info">返回</el-button>
|
||
</div>
|
||
|
||
<!-- 测试内容 -->
|
||
<div style="text-align:center; padding:50px;">
|
||
<h1 style="color:#1890ff;">羊只系谱管理页面</h1>
|
||
<p v-if="isFrameIssue" style="color:red; font-weight:bold;">
|
||
⚠️ 检测到 isFrame=1 问题！请修改菜单配置为"是否外链=否"
|
||
</p>
|
||
<p>这是一个测试页面，如果看到此内容，说明组件加载成功</p>
|
||
<el-button type="success" @click="testClick">测试按钮</el-button>
|
||
</div>
|
||
</div>
|
||
</template>
|
||
|
||
<script>
|
||
export default {
|
||
name: "SheepPedigree",
|
||
data() {
|
||
return {
|
||
menuConfig: {},
|
||
isFrameIssue: false
|
||
};
|
||
},
|
||
created() {
|
||
console.log("=== 羊只系谱页面创建 ===");
|
||
console.log("1. 路由信息：", this.$route);
|
||
console.log("2. 路由匹配：", this.$router.currentRoute);
|
||
console.log("3. 权限信息：", this.$store.state.user.permissions);
|
||
|
||
// 检测是否是isFrame问题
|
||
const route = this.$route;
|
||
if (route.meta && route.meta.isFrame === '1') {
|
||
this.isFrameIssue = true;
|
||
console.error("检测到isFrame=1，会导致页面显示问题！");
|
||
}
|
||
|
||
// 获取当前路由对应的菜单配置
|
||
this.getMenuConfig();
|
||
|
||
// 测试API
|
||
this.testApiConnection();
|
||
},
|
||
mounted() {
|
||
console.log("页面已挂载到DOM");
|
||
console.log("当前URL：", window.location.href);
|
||
},
|
||
methods: {
|
||
getMenuConfig() {
|
||
// 从Vuex中查找当前路由对应的菜单
|
||
const routes = this.$store.state.permission.routes || [];
|
||
this.findMenuConfig(routes, this.$route.path);
|
||
},
|
||
|
||
findMenuConfig(menus, path) {
|
||
for (const menu of menus) {
|
||
if (menu.path === path) {
|
||
this.menuConfig = menu;
|
||
console.log("找到菜单配置：", menu);
|
||
return;
|
||
}
|
||
if (menu.children) {
|
||
this.findMenuConfig(menu.children, path);
|
||
}
|
||
}
|
||
},
|
||
|
||
async testApiConnection() {
|
||
try {
|
||
// 测试调用API（使用已有的API）
|
||
const response = await this.$axios.get('/system/dict/data/type/sheep_type');
|
||
console.log("API测试成功：", response.data);
|
||
} catch (error) {
|
||
console.warn("API测试失败：", error.response || error.message);
|
||
}
|
||
},
|
||
|
||
testClick() {
|
||
this.$message.success("按钮点击成功！页面功能正常");
|
||
},
|
||
|
||
reloadPage() {
|
||
window.location.reload();
|
||
},
|
||
|
||
goBack() {
|
||
this.$router.back();
|
||
}
|
||
}
|
||
};
|
||
</script>
|
||
|
||
<style scoped>
|
||
.app-container {
|
||
min-height: 500px;
|
||
padding: 20px;
|
||
}
|
||
</style> |