From 307b17ef15c73a071912a262834f2a5f68e1fa87 Mon Sep 17 00:00:00 2001
From: riku <risaku@163.com>
Date: 星期四, 11 九月 2025 15:20:35 +0800
Subject: [PATCH] 完成走航季度报告自动生成
---
src/components/monitor/FactorRadio.vue | 106 +++++++++++++++++++++++++++++++++++++++++++++++++---
1 files changed, 99 insertions(+), 7 deletions(-)
diff --git a/src/components/monitor/FactorRadio.vue b/src/components/monitor/FactorRadio.vue
index 3245049..e133e8e 100644
--- a/src/components/monitor/FactorRadio.vue
+++ b/src/components/monitor/FactorRadio.vue
@@ -1,16 +1,108 @@
<template>
- <BaseCard>
+ <transition
+ name="el-zoom-in-left"
+ @before-enter="onBeforeEnter"
+ @after-leave="onAfterLeave"
+ >
+ <BaseCard v-show="show" direction="left">
+ <template #content>
+ <!-- <el-collapse-transition> -->
+ <el-radio-group v-model="radio" size="default" @change="handleChange">
+ <el-radio v-for="(item, i) in options" :key="i" :value="item.value">{{
+ item.label
+ }}</el-radio>
+ </el-radio-group>
+ <!-- </el-collapse-transition> -->
+ <span @click="show = !show" class="btn-show">
+ <el-icon v-if="show"><ArrowLeftBold /></el-icon>
+ <el-icon v-else><ArrowRightBold /></el-icon>
+ </span>
+ </template>
+ </BaseCard>
+ </transition>
+ <BaseCard v-show="btnShow">
<template #content>
- <el-radio-group v-model="radio">
- <el-radio :value="3">Option A</el-radio>
- <el-radio :value="6">Option B</el-radio>
- <el-radio :value="9">Option C</el-radio>
- </el-radio-group>
+ <el-row @click="show = !show" class="btn-show">
+ <font-awesome-icon icon="fa-check-circle" />
+ <el-icon v-if="show"><ArrowLeftBold /></el-icon>
+ <el-icon v-else><ArrowRightBold /></el-icon>
+ </el-row>
</template>
</BaseCard>
</template>
<script>
// 鐩戞祴鍥犲瓙鍗曢�夋
-export default {};
+import { radioOptions, defaultOptions } from '@/constant/radio-options';
+import { TYPE0 } from '@/constant/device-type';
+
+export default {
+ props: {
+ modelValue: {
+ type: String,
+ default: defaultOptions(TYPE0).value
+ },
+ deviceType: {
+ type: String,
+ // type0: 杞﹁浇鎴栨棤浜烘満; type1:鏃犱汉鑸�
+ default: TYPE0
+ }
+ },
+ emits: ['change', 'update:modelValue'],
+ data() {
+ return {
+ radio: defaultOptions(TYPE0).value,
+ show: true,
+ btnShow: false
+ };
+ },
+ computed: {
+ options() {
+ return radioOptions(this.deviceType);
+ }
+ },
+ watch: {
+ deviceType(nV, oV) {
+ if (nV != oV) {
+ this.radio = this.options[0].value;
+ this.$emit('update:modelValue', this.radio);
+ }
+ },
+ modelValue(nV, oV) {
+ if (nV != oV) {
+ this.radio = nV;
+ }
+ }
+ },
+ methods: {
+ handleChange(value) {
+ const item = this.options.find((v) => v.value == value);
+ this.$emit('change', item.value, item);
+ this.$emit('update:modelValue', item.value);
+ // todo 鍦板浘3d鍥惧儚鍒囨崲灞曠ず鐩戞祴鍥犲瓙
+ },
+ onBeforeEnter() {
+ this.btnShow = false;
+ },
+ onAfterLeave() {
+ this.btnShow = true;
+ }
+ }
+};
</script>
+<style scoped>
+:deep(.el-radio) {
+ --el-radio-text-color: white;
+ --el-color-primary: #23dad1;
+ margin-right: 10px;
+ height: initial;
+}
+
+.btn-show {
+ cursor: pointer;
+ padding: 4px 0;
+}
+.btn-show:hover {
+ color: #23dad1;
+}
+</style>
--
Gitblit v1.9.3