From c1d2051abc8ca88cd07f0d7c56c0dbf8165d5c33 Mon Sep 17 00:00:00 2001
From: riku <risaku@163.com>
Date: 星期四, 18 九月 2025 17:02:22 +0800
Subject: [PATCH] 2025.9.18 数据产品（待完成）
---
src/views/fysp/data-product/base-data-product/ProdManage.vue | 95 ++++++++++++++++++-----------------------------
1 files changed, 36 insertions(+), 59 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..e04d292 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,21 @@
<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"
+ >
+ <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 + 'px' }">
<keep-alive>
<component
v-if="route.meta.keepAlive"
@@ -29,11 +27,16 @@
</router-view>
</template>
<script setup>
-import { ref, onMounted } from 'vue';
+import { ref, onMounted, provide, inject, computed } from 'vue';
import { useRouter, useRoute } from 'vue-router';
+
+const contentMaxHeight = inject('contentMaxHeight');
const router = useRouter();
const route = useRoute();
+
+const menuRef = ref(null);
+const height = ref(contentMaxHeight.value);
const menu = ref([
{
@@ -46,7 +49,7 @@
path: 'evaluate'
},
{
- name: '宸℃煡淇℃伅',
+ name: '鏁存敼娓呭崟',
path: 'inspection'
},
{
@@ -54,55 +57,29 @@
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 contentMaxHeight.value - h;
+ // 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',
+ computed(() => height.value)
+);
</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