fix：修改chart比较的动画

nezha-fronted/src/components/common/multipleTime.vue

@@ -60,7 +60,13 @@
   }
   .compare-box{
     line-height: 50px;
-    margin-right: 20px;
+  }
+  .compare-box .nz-icon-compare{
+   border-right: none;
+  }
+  .calendar{
+    width: 125px;
+    overflow: hidden;
   }
   .nz-icon-compare{
     background: #FFFFFF;
@@ -69,19 +75,17 @@
     padding: 6px 8px;
   }
   .multiple-time-datepicker-enter-active {
-    transform-origin: 100% 50%;
     animation: bounce-in .6s;
   }
   .multiple-time-datepicker-leave-active {
-    transform-origin: 100% 50%;
     animation: bounce-in .6s reverse;
   }
   @keyframes bounce-in {
     0% {
-      transform: scaleX(0);
+      width: 0;
     }
     100% {
-      transform: scale(1);
+      width: 125px;
     }
   }
 </style>
@@ -109,7 +113,7 @@
   <div class="multiple-time-box">
     <div :class="showDropdown?'compare-box':''"><i class="nz-icon nz-icon-compare" @click="changeShowDropdown" /></div>
     <transition name="multiple-time-datepicker">
-      <div class="calendar top-tools" id="panel-calender" v-show="showDropdown">
+      <div ref="calendar" class="calendar top-tools" id="panel-calender" v-show="showDropdown">
         <el-date-picker prefix-icon=" " size="mini" ref="calendar"
                         format="yyyy/MM/dd HH:mm:ss" class="panel-time-picker-hidden" @change="dateChange" v-model="startTime" type="datetime"
                         popper-class="panel-time-picker-popper"
@@ -428,10 +432,12 @@ export default {
       this.showDropdown = !this.showDropdown
       if (!this.showDropdown) {
         this.searchTime = []
+        setTimeout(() => {
           this.showTime = this.nowTimeType = {
             id: 12,
             text: this.$t('dashboard.panel.noDate')
           }
+        }, 600)
         this.$emit('change', this.searchTime)
       } else {
         this.searchTime = []