浏览代码

fix:bug修复

cmy 3 周之前
父节点
当前提交
07425a1f70

+ 4 - 0
src/theme/app.scss

@@ -389,4 +389,8 @@ body,
 		background-color: var(--menu-bar-active-color) !important;
 		color: var(--menu-bar-active-font-color) !important;
 	}
+}
+
+.el-menu--popup {
+	padding: 0;
 }

+ 23 - 1
src/views/home/echarts/custom-panel.vue

@@ -2,7 +2,7 @@
   <el-card shadow="hover">
     <div class="panel-top">
       <div class="panel-name">{{prop.title}}</div>
-      <div class="cursor-pointer"  @click="handleRefresh">
+      <div :class="['panel-refresh', { 'panel-refresh-rotate': roading }]"  @click="handleRefresh">
         <svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
           <path d="M16.7167 6.66667C15.4895 4.19712 12.9411 2.5 9.99637 2.5C7.05158 2.5 4.56062 4.19712 3.33337 6.66667" stroke="#ADBFD7" stroke-linecap="round"/>
           <path d="M3.33337 3.33334V6.66667" stroke="#ADBFD7" stroke-linecap="round"/>
@@ -26,8 +26,14 @@ const prop = defineProps({
 })
 
 const emit = defineEmits(['refresh']);
+const roading = ref(false);
 
 const handleRefresh = () => {
+  if (roading.value) return;
+  roading.value = true;
+  setTimeout(() => {
+    roading.value = false;
+  }, 1000);
   emit('refresh');
 };
 </script>
@@ -57,4 +63,20 @@ const handleRefresh = () => {
     background-color: rgb(22, 122, 240, 1);
   }
 }
+
+.panel-refresh-rotate svg {
+  animation: rotate 1s linear infinite;
+  transform-origin: center center;
+}
+
+@keyframes rotate {
+  0% {
+    transform: rotate(0deg);
+    transform-origin: center center;
+  }
+  100% {
+    transform: rotate(-360deg);
+    transform-origin: center center;
+  }
+}
 </style>

+ 2 - 0
src/views/home/echarts/visitor-overview.vue

@@ -77,6 +77,8 @@ const options = [
   position: relative;
   padding-top: 70px;
   .overview-list {
+    height: 270px;
+    overflow: auto;
     span {
       line-height: 20px;
       font-size: 14px;

+ 2 - 2
src/views/home/index.vue

@@ -17,12 +17,12 @@
       <custom-panel :title="'访客地图'">
       </custom-panel>
     </el-col>
-    <el-col :xs="24" :sm="24" :md="10" :lg="6" :xl="6">
+    <el-col :xs="24" :sm="10" :md="10" :lg="6" :xl="6">
       <custom-panel :title="'访客概览'">
         <visitor-overview />
       </custom-panel>
     </el-col>
-    <el-col :xs="24" :sm="24" :md="14" :lg="8" :xl="8">
+    <el-col :xs="24" :sm="14" :md="14" :lg="8" :xl="8">
       <custom-panel :title="'关键词频率'">
         <keyword-frequency />
       </custom-panel>