From e895212fa4215c50ce79ce4b448e064caf394776 Mon Sep 17 00:00:00 2001
From: riku <risaku@163.com>
Date: 星期四, 03 七月 2025 17:35:46 +0800
Subject: [PATCH] 2025.7.3 动态溯源（待完成）
---
src/views/historymode/component/TrendAnalysis.vue | 73 ++++++++++++++++++++++++++++++------
1 files changed, 61 insertions(+), 12 deletions(-)
diff --git a/src/views/historymode/component/TrendAnalysis.vue b/src/views/historymode/component/TrendAnalysis.vue
index d5de2d0..665305f 100644
--- a/src/views/historymode/component/TrendAnalysis.vue
+++ b/src/views/historymode/component/TrendAnalysis.vue
@@ -1,14 +1,24 @@
<template>
<el-row class="wrap">
- <el-col span="10">
- <FactorCheckbox
- :device-type="deviceType"
- @change="(e) => (selectFactorType = e)"
- ></FactorCheckbox>
- <LineChart
- :factor-datas="factorDatas"
- :select-factor-type="selectFactorType"
- ></LineChart>
+ <Transition name="">
+ <el-col v-show="show" span="10" class="wrap-left">
+ <FactorCheckbox
+ v-model="selectFactorType"
+ :device-type="deviceType"
+ ></FactorCheckbox>
+ <ProgressLineChart
+ :locate-index="locateIndex"
+ @chart-click="handleChartClick"
+ :factor-datas="factorDatas"
+ :select-factor-type="selectFactorType"
+ ></ProgressLineChart>
+ </el-col>
+ </Transition>
+ <el-col span="2">
+ <CardButton
+ name="鐩戞祴瑕佺礌瓒嬪娍鍒嗘瀽"
+ @click="() => (show = !show)"
+ ></CardButton>
</el-col>
</el-row>
</template>
@@ -18,18 +28,37 @@
* 鐩戞祴瑕佺礌瓒嬪娍鍒嗘瀽
*/
import { FactorDatas } from '@/model/FactorDatas';
+import { defaultFactorTypes } from '@/constant/checkbox-options';
+import { TYPE0 } from '@/constant/device-type';
export default {
props: {
deviceType: {
- type: String
+ type: String,
+ default: TYPE0
},
- factorDatas: FactorDatas
+ factorDatas: FactorDatas,
+ // 褰撳墠閫変腑楂樹寒鐨勬暟鎹偣绱㈠紩
+ locateIndex: Number
},
data() {
return {
- selectFactorType: ['1']
+ selectFactorType: defaultFactorTypes(this.deviceType, 1),
+ show: true
};
+ },
+ emits: ['chartClick'],
+ watch: {
+ deviceType(nV, oV) {
+ if (nV != oV) {
+ this.selectFactorType = defaultFactorTypes(nV, 1);
+ }
+ }
+ },
+ methods: {
+ handleChartClick(index) {
+ this.$emit('chartClick', index);
+ }
}
};
</script>
@@ -37,5 +66,25 @@
.wrap {
/* display: flex;
flex-direction: column; */
+ /* background-color: aliceblue; */
+}
+
+.wrap-left {
+ /* background-color: aliceblue; */
+ min-width: 600px;
+}
+
+.slide-fade-enter-active {
+ transition: all 0.3s ease-out;
+}
+
+.slide-fade-leave-active {
+ transition: all 0.8s cubic-bezier(1, 0.5, 0.8, 1);
+}
+
+.slide-fade-enter-from,
+.slide-fade-leave-to {
+ transform: translateX(-100%);
+ opacity: 0;
}
</style>
--
Gitblit v1.9.3