From d7200aba1266889a93bf463ac60d6cb113a72965 Mon Sep 17 00:00:00 2001
From: LiuJiaNan <liujianan@zcloudchina.com>
Date: Tue, 27 Feb 2024 17:02:30 +0800
Subject: [PATCH] =?UTF-8?q?=E5=A2=9E=E5=8A=A0=E5=8A=A8=E7=94=BB?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/BI/components/bottom_options.vue | 40 +++++++++++++---------
 1 file changed, 24 insertions(+), 16 deletions(-)

diff --git a/src/views/BI/components/bottom_options.vue b/src/views/BI/components/bottom_options.vue
index 9e1e12d..8cbcf50 100644
--- a/src/views/BI/components/bottom_options.vue
+++ b/src/views/BI/components/bottom_options.vue
@@ -10,25 +10,30 @@
         <img :src="item.check ? item.imgSelect : item.img" alt="" />
         <div class="title">{{ item.title }}</div>
         <div class="child_container">
-          <!--          <transition-->
-          <!--            enter-active-class="animate__animated animate__bounceIn"-->
-          <!--            leave-active-class="animate__animated animate__bounceOut"-->
-          <!--            mode="out-in"-->
-          <!--          >-->
-          <div v-show="item.check" :class="['child_options', item.type]">
+          <transition
+            enter-active-class="animate__animated animate__bounceIn"
+            leave-active-class="animate__animated animate__bounceOut"
+            mode="out-in"
+          >
             <div
-              v-for="(item1, index1) in item.list"
-              :key="item1.title"
-              class="child_option"
-              @click.stop="fnBottomChildOptionsListChange(index, item1, index1)"
+              v-show="item.check"
+              :class="['child_options', item.type, { active: item.check }]"
             >
-              <img :src="item1.check ? item1.imgSelect : item1.img" alt="" />
-              <div class="tit" :class="item1.check ? 'active' : ''">
-                {{ item1.title }}
+              <div
+                v-for="(item1, index1) in item.list"
+                :key="item1.title"
+                class="child_option"
+                @click.stop="
+                  fnBottomChildOptionsListChange(index, item1, index1)
+                "
+              >
+                <img :src="item1.check ? item1.imgSelect : item1.img" alt="" />
+                <div class="tit" :class="item1.check ? 'active' : ''">
+                  {{ item1.title }}
+                </div>
               </div>
             </div>
-          </div>
-          <!--          </transition>-->
+          </transition>
         </div>
       </div>
     </div>
@@ -469,7 +474,10 @@ const fnBottomChildOptionsListChange = (index, item1, index1) => {
           1;
         border-left: none;
         border-right: none;
-        display: flex;
+        display: none;
+        &.active {
+          display: flex;
+        }
 
         .child_option {
           text-align: center;