From 4aa86b1ec441c4e358e1cc488d8f021fb80f1355 Mon Sep 17 00:00:00 2001
From: riku <risaku@163.com>
Date: 星期三, 17 九月 2025 17:34:35 +0800
Subject: [PATCH] 2025.9.17 数据产品（待完成）
---
src/views/fysp/data-product/base-data-product/ProdManage.vue | 88 +++++++++++++++-----------------------------
1 files changed, 30 insertions(+), 58 deletions(-)
diff --git a/src/views/fysp/data-product/base-data-product/ProdManage.vue b/src/views/fysp/data-product/base-data-product/ProdManage.vue
index 8d04a34..0f1ff6b 100644
--- a/src/views/fysp/data-product/base-data-product/ProdManage.vue
+++ b/src/views/fysp/data-product/base-data-product/ProdManage.vue
@@ -1,23 +1,22 @@
<template>
- <!-- <el-menu default-active="scene" ellipsis mode="horizontal" style="max-width: 600px">
- <el-menu-item index="scene" @click="navPage">鍦烘櫙娓呭崟</el-menu-item>
- <el-menu-item index="evaluate" @click="navPage">璇勪及娓呭崟</el-menu-item>
- <el-menu-item index="inspection" @click="navPage">宸℃煡淇℃伅</el-menu-item>
- <el-menu-item index="monitorData" @click="navPage">鐩戞祴鏁版嵁</el-menu-item>
- </el-menu> -->
- <!-- <a @click="navPage({ index: 'scene' })"><div>鍦烘櫙娓呭崟</div></a>
- <a @click="navPage({ index: 'evaluate' })"><div>璇勪及娓呭崟</div></a>
- <a @click="navPage({ index: 'inspection' })"><div>宸℃煡淇℃伅</div></a>
- <a @click="navPage({ index: 'monitorData' })"><div>鐩戞祴鏁版嵁</div></a> -->
- <el-space>
- <template v-for="(item, index) in menu" :key="item.path">
- <a :class="btnClz(item.selected)" @click="navTo(index)">
- <div>{{ item.name }}</div>
- </a>
- </template>
- </el-space>
- <div>sssss</div>
- <router-view v-slot="{ Component, route }">
+ <el-affix>
+ <el-menu
+ ref="menuRef"
+ default-active="scene"
+ ellipsis
+ mode="horizontal"
+ style="max-width: 600px; background-color: aliceblue"
+ >
+ <el-menu-item
+ v-for="item in menu"
+ :key="item.path"
+ :index="item.path"
+ @click="navPage"
+ >{{ item.name }}</el-menu-item
+ >
+ </el-menu>
+ </el-affix>
+ <router-view v-slot="{ Component, route }" :style="'height: ' + height">
<keep-alive>
<component
v-if="route.meta.keepAlive"
@@ -29,11 +28,14 @@
</router-view>
</template>
<script setup>
-import { ref, onMounted } from 'vue';
+import { ref, onMounted, provide } from 'vue';
import { useRouter, useRoute } from 'vue-router';
const router = useRouter();
const route = useRoute();
+
+const menuRef = ref(null);
+const height = ref('calc(100vh - 64px)');
const menu = ref([
{
@@ -54,55 +56,25 @@
path: 'monitorData'
}
]);
-// console.log(router);
-// console.log(route.path);
const navPage = (item) => {
- console.log(item);
if (item.index) {
router.push({
path: item.index
});
}
};
-function btnClz(selected) {
- return (
- 'mode-btn ' + (selected ? 'btn-selected ' : 'btn-unselected ') + 'm-r-8'
- );
-}
-function navTo(index) {
- const m = this.menu;
- m.forEach((e) => {
- e.selected = false;
- });
- m[index].selected = true;
- router.replace(m[index].path);
+function calcTableHeight() {
+ const h = menuRef.value.$el.offsetHeight;
+ return `calc(100vh - ${h}px - 60px - var(--el-main-padding) * 2)`;
}
onMounted(() => {
- console.log(route.path);
- // router.push('/fysp/data-product/base/home/scene');
+ height.value = calcTableHeight();
});
+
+// 鎻愪緵缁欏唴閮ㄧ粍浠惰鍥炬渶澶ч珮搴�
+provide('viewHeight', height);
</script>
-<style scoped>
-.mode-btn {
- padding: 8px 16px;
- border-radius: 4px;
- font-size: 14px;
- color: #303133;
- background-color: #f5f7fa;
- border: 1px solid #dcdfe6;
- cursor: pointer;
-}
-.btn-selected {
- color: #fff;
- background-color: #409eff;
- border-color: #409eff;
-}
-.btn-unselected {
- color: #303133;
- background-color: #f5f7fa;
- border-color: #dcdfe6;
-}
-</style>
+<style scoped></style>
--
Gitblit v1.9.3