快速缩放样式

src/assets/styles/index.scss

@@ -346,11 +346,10 @@ aside {
 }
 
 .common-table {
-  margin-left: 28px;
   .table-header {
     width: 100%;
     min-height: 88px;
-    background: url('@/assets/images/map/rightMenu/rainMonitor/header.png') no-repeat;
+    background: url('@/assets/images/common/header.png') no-repeat;
     background-size: 100% 100%;
     display: flex;
     align-items: center;
@@ -362,7 +361,7 @@ aside {
   .tr {
     width: 100%;
     min-height: 88px;
-    background: url('@/assets/images/map/rightMenu/rainMonitor/tr.png') no-repeat;
+    background: url('@/assets/images/common/tr.png') no-repeat;
     background-size: 100% 100%;
     display: flex;
     align-items: center;
@@ -377,10 +376,9 @@ aside {
   .td {
     font-size: 38px;
     color: #edfaff;
-    display: flex;
-    justify-content: center;
-    align-items: center;
     flex: 1;
+    padding: 0 8px;
+    text-align: center;
   }
   .down-icon {
     display: inline-block;
@@ -508,3 +506,15 @@ aside {
 .processing-bg {
   background-color: #ffb000;
 }
+
+.common-title-box {
+  width: 100%;
+  height: 65px;
+  background-image: url(@/assets/images/common/titleBox.png);
+  background-repeat: no-repeat;
+  background-size: 369px 34px;
+  background-position: bottom left;
+  padding-left: 55px;
+  color: #ffffff;
+  font-size: 44px;
+}

src/components/DictTag/index.vue

@@ -9,24 +9,6 @@
         >
           {{ item.label + ' ' }}
         </span>
-<!--        <el-tag-->
-<!--          v-else-->
-<!--          :key="item.value + ''"-->
-<!--          :disable-transitions="true"-->
-<!--          :index="index"-->
-<!--          :type="-->
-<!--            item.elTagType === 'primary' ||-->
-<!--            item.elTagType === 'success' ||-->
-<!--            item.elTagType === 'info' ||-->
-<!--            item.elTagType === 'warning' ||-->
-<!--            item.elTagType === 'danger'-->
-<!--              ? item.elTagType-->
-<!--              : 'primary'-->
-<!--          "-->
-<!--          :class="item.elTagClass"-->
-<!--        >-->
-<!--          {{ item.label + ' ' }}-->
-<!--        </el-tag>-->
       </template>
     </template>
     <template v-if="unmatch && showValue">

src/components/HeaderSection/index.vue

@@ -131,6 +131,7 @@ const clickMenu = (item) => {
     height: 444px;
     display: flex;
     justify-content: center;
+    pointer-events: none;
     .title {
       margin-top: 60px;
       width: 1314px;

src/components/Map/quickZoom.vue

@@ -2,11 +2,11 @@
   <div class="flex">
     <div class="plusIcon" @click="addStep"></div>
     <div style="margin: 10px 0; position: relative">
-      <el-slider class="slider" v-model="step" :min="1" :max="4" vertical :show-tooltip="false" height="183px" @input="changeStep" />
+      <el-slider v-model="step" class="slider" :min="1" :max="4" vertical :show-tooltip="false" height="183px" @input="changeStep" />
       <div v-show="step === 1" class="tooltip">市</div>
-      <div v-show="step === 2" class="tooltip" style="bottom: 30px">区/县</div>
-      <div v-show="step === 3" class="tooltip" style="bottom: 77px">镇/街道</div>
-      <div v-show="step === 4" class="tooltip" style="bottom: 123px">村/社区</div>
+      <div v-show="step === 2" class="tooltip" style="bottom: 36px">区/县</div>
+      <div v-show="step === 3" class="tooltip" style="bottom: 93px; left: -162px">镇/街道</div>
+      <div v-show="step === 4" class="tooltip" style="bottom: 160px; left: -162px">村/社区</div>
     </div>
     <div class="minusIcon" @click="reduceStep"></div>
   </div>
@@ -22,16 +22,14 @@ const step = ref(1);
 watch(
   () => props.zoom,
   (zoom) => {
-    if (zoom <= 8) {
+    if (zoom <= 7.9) {
       step.value = 1;
-    } else if (zoom >= 8 && zoom < 12) {
+    } else if (zoom > 7.9 && zoom <= 9.21) {
       step.value = 2;
-    } else if (zoom >= 12 && zoom <= 14) {
+    } else if (zoom > 9.21 && zoom <= 11.38) {
       step.value = 3;
-    } else if (zoom >= 14 && zoom < 16) {
+    } else if (zoom > 11.38) {
       step.value = 4;
-    } else if (zoom >= 16) {
-      step.value = 5;
     }
   },
   {
@@ -41,7 +39,6 @@ watch(
 
 // 发生变化时
 const changeStep = (value) => {
-  console.log(122, value);
   emits('changeStep', value);
 };
 // 增加
@@ -79,18 +76,28 @@ const reduceStep = () => {
 }
 .tooltip {
   position: absolute;
-  //left: -55px;
-  left: -80px;
-  bottom: -12px;
+  left: -126px;
+  bottom: -23px;
   color: #fff;
   padding-left: 14px;
   padding-top: 4px;
   font-size: 32px;
-  width: 63px;
-  height: 33px;
-  background: url('@/assets/images/map/marker.png') no-repeat;
-  background-size: 100% 100%;
-  font-family: 'SourceHanSansCN';
+  min-width: 80px;
+  height: 63px;
+  line-height: 63px;
+  background-color: #3b71eb;
+  text-align: center;
+  &::before {
+    content: '';
+    width: 0;
+    height: 0;
+    border-bottom: 45px solid #3b71eb;
+    border-left: 45px solid transparent;
+    position: absolute;
+    top: 10px;
+    right: -20px;
+    transform: rotate(-45deg);
+  }
 }
 .slider {
   :deep(.el-slider__bar) {

src/views/globalMap/RightMenu/DrawTools.vue

@@ -345,7 +345,7 @@ const analysisSpatial = (data) => {
 <style lang="scss" scoped>
 .draw-tools-container {
   position: absolute;
-  right: 340px;
+  right: 250px;
   bottom: 460px;
   background-color: #304468;
   border-radius: 5px;

src/views/globalMap/RightMenu/RainMonitor/RainRank.vue

@@ -219,7 +219,7 @@ const handleClick = (item) => {
   .table-header {
     width: 1864px;
     height: 96px;
-    background: url('@/assets/images/map/rightMenu/rainMonitor/header.png') no-repeat;
+    background: url('@/assets/images/common/header.png') no-repeat;
     background-size: 100% 100%;
     display: flex;
     align-items: center;
@@ -230,7 +230,7 @@ const handleClick = (item) => {
   .tr {
     width: 1864px;
     height: 96px;
-    background: url('@/assets/images/map/rightMenu/rainMonitor/tr.png') no-repeat;
+    background: url('@/assets/images/common/tr.png') no-repeat;
     background-size: 100% 100%;
     display: flex;
     align-items: center;

src/views/globalMap/RightMenu/RainMonitor/index.vue

@@ -573,7 +573,7 @@ initData();
   .table-header {
     width: 1490px;
     height: 88px;
-    background: url('@/assets/images/map/rightMenu/rainMonitor/header.png') no-repeat;
+    background: url('@/assets/images/common/header.png') no-repeat;
     display: flex;
     align-items: center;
     .td-cursor {
@@ -583,7 +583,7 @@ initData();
   .tr {
     width: 1487px;
     height: 88px;
-    background: url('@/assets/images/map/rightMenu/rainMonitor/tr.png') no-repeat;
+    background: url('@/assets/images/common/tr.png') no-repeat;
     display: flex;
     align-items: center;
     margin-top: 10px;

src/views/globalMap/RightMenu/TowerStatus.vue

@@ -291,7 +291,7 @@ onMounted(() => {
   .table-header {
     width: 1490px;
     height: 88px;
-    background: url('@/assets/images/map/rightMenu/rainMonitor/header.png') no-repeat;
+    background: url('@/assets/images/common/header.png') no-repeat;
     display: flex;
     align-items: center;
     .td {
@@ -308,7 +308,7 @@ onMounted(() => {
   .tr {
     width: 1487px;
     height: 88px;
-    background: url('@/assets/images/map/rightMenu/rainMonitor/tr.png') no-repeat;
+    background: url('@/assets/images/common/tr.png') no-repeat;
     display: flex;
     align-items: center;
     margin-top: 10px;

src/views/globalMap/index.vue

@@ -204,7 +204,7 @@ provide('getMarkers', getMarkers);
   //overflow: hidden;
   .tool-box {
     position: absolute;
-    right: 340px;
+    right: 430px;
     bottom: 180px;
     z-index: 10;
     color: #fff;

src/views/globalMapPage/index.vue

@@ -54,7 +54,6 @@ onUnmounted(() => {
     position: relative;
   }
   .dashboard-content {
-    padding: 0 81px;
     display: flex;
     height: calc(2560px - 228px);
     overflow: hidden;