From f6ffb140b850241aebe81006d6fa1af27ba189d3 Mon Sep 17 00:00:00 2001
From: xiongjj <xiongjiaojiao@supermap.com>
Date: Tue, 6 Aug 2024 17:44:11 +0800
Subject: [PATCH] =?UTF-8?q?=E3=80=90feature=E3=80=91vue=20=E5=8D=87?=
 =?UTF-8?q?=E7=BA=A7=E5=88=B0=202.7;=20fix=20sass=201.77.x=20warning?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 package.json                                      |  4 +---
 src/common/_mixin/Card.ts                         |  2 +-
 src/common/collapse-card/style/collapse-card.scss |  4 ++--
 src/common/video-player/style/video-player.scss   |  2 +-
 src/mapboxgl/_mixin/control.ts                    |  2 +-
 .../style/animate-marker-layer.scss               | 15 ++++++---------
 6 files changed, 12 insertions(+), 17 deletions(-)

diff --git a/package.json b/package.json
index 263bb028..29d48bc5 100644
--- a/package.json
+++ b/package.json
@@ -216,14 +216,12 @@
     "uglifyjs-webpack-plugin": "^2.1.1",
     "uppercamelcase": "^3.0.0",
     "url-loader": "^1.1.2",
-    "vue": "2.6.14",
+    "vue": "^2.7.16",
     "vue-class-component": "^7.2.6",
     "vue-eslint-parser": "^7.6.0",
     "vue-jest": "^3.0.2",
     "vue-loader": "^15.5.1",
-    "vue-server-renderer": "2.6.14",
     "vue-style-loader": "^4.1.2",
-    "vue-template-compiler": "2.6.14",
     "vuepress": "^1.0.3",
     "webpack": "^4.35.3",
     "webpack-bundle-analyzer": "^3.0.3",
diff --git a/src/common/_mixin/Card.ts b/src/common/_mixin/Card.ts
index f9224afa..388ec56b 100644
--- a/src/common/_mixin/Card.ts
+++ b/src/common/_mixin/Card.ts
@@ -8,7 +8,7 @@ import SmCollapseCard from 'vue-iclient/src/common/collapse-card/CollapseCard.vu
 export default class CardMixin extends Vue {
   @Prop({
     default: 'top-left',
-    validator(value) {
+    validator(value: string) {
       return ['top-left', 'top-right', 'bottom-left', 'bottom-right'].includes(value);
     }
   })
diff --git a/src/common/collapse-card/style/collapse-card.scss b/src/common/collapse-card/style/collapse-card.scss
index e0e194fb..2ab9fd04 100644
--- a/src/common/collapse-card/style/collapse-card.scss
+++ b/src/common/collapse-card/style/collapse-card.scss
@@ -139,20 +139,20 @@
       }
     }
     @include when(top-left) {
+      transform-origin: top left;
       @include when(icon) {
         & > .sm-component-collapse-card__header {
           padding-left: 38px;
         }
       }
-      transform-origin: top left;
     }
     @include when(bottom-left) {
+      transform-origin: top left;
       @include when(icon) {
         & > .sm-component-collapse-card__header {
           padding-left: 38px;
         }
       }
-      transform-origin: top left;
     }
     @include when(not-header) {
       @include when(bottom-right) {
diff --git a/src/common/video-player/style/video-player.scss b/src/common/video-player/style/video-player.scss
index 74eff952..7075a9a8 100644
--- a/src/common/video-player/style/video-player.scss
+++ b/src/common/video-player/style/video-player.scss
@@ -226,6 +226,7 @@
   }
 }
 .sm-component-video-player-modal {
+  background: rgba(0, 0, 0, 0.7);
   .sm-component-modal-close {
     color: #a2a3a5;
     right: -5%;
@@ -257,7 +258,6 @@
       }
     }
   }
-  background: rgba(0, 0, 0, 0.7);
 }
 .sm-component-video-full-fill{
   video{
diff --git a/src/mapboxgl/_mixin/control.ts b/src/mapboxgl/_mixin/control.ts
index 0d989167..20d3ba9d 100644
--- a/src/mapboxgl/_mixin/control.ts
+++ b/src/mapboxgl/_mixin/control.ts
@@ -14,7 +14,7 @@ export default class Control extends Vue {
 
   @Prop({
     default: 'top-left',
-    validator(value) {
+    validator(value: string) {
       return ['top-left', 'top-right', 'bottom-left', 'bottom-right'].includes(value);
     }
   })
diff --git a/src/mapboxgl/web-map/layer/animate-marker/style/animate-marker-layer.scss b/src/mapboxgl/web-map/layer/animate-marker/style/animate-marker-layer.scss
index 8368dbaa..3e4ec667 100644
--- a/src/mapboxgl/web-map/layer/animate-marker/style/animate-marker-layer.scss
+++ b/src/mapboxgl/web-map/layer/animate-marker/style/animate-marker-layer.scss
@@ -176,15 +176,6 @@
     left: 0;
     animation-fill-mode: forwards;
     margin: auto;
-    &:before,
-    :after {
-      content: '';
-      position: absolute;
-      display: block;
-      height: inherit;
-      width: inherit;
-      border-radius: inherit;
-    }
     width: var(--dots-width);
     height: var(--dots-height);
     box-shadow: var(--dots-box-shadow-x-negative) 0 0 var(--dots-box-shadow-radius1-negative) var(--light-color),
@@ -198,6 +189,12 @@
       0 0 4px 8px var(--line-color);
     &:before,
     &:after {
+      content: '';
+      position: absolute;
+      display: block;
+      height: inherit;
+      width: inherit;
+      border-radius: inherit;
       box-shadow: var(--dots-box-shadow-x-negative) 0 0 var(--dots-box-shadow-radius1-negative) var(--light-color),
         var(--dots-box-shadow-x-negative) 0 4px var(--dots-box-shadow-radius2-negative) var(--color),
         var(--dots-box-shadow-x) 0 0 var(--dots-box-shadow-radius1-negative) var(--light-color),