From d355dcfbb73aa4c49e10bad7f48ee41913bfa56c Mon Sep 17 00:00:00 2001
From: "wu.jian2" <distantmtn@gmail.com>
Date: Mon, 10 Jul 2023 16:50:30 +0800
Subject: [PATCH] =?UTF-8?q?refactor:=20=E4=BF=AE=E6=94=B9=E6=A0=B7?=
 =?UTF-8?q?=E5=BC=8F=E7=A9=BF=E9=80=8F=EF=BC=8C=E5=B0=86/deep/=20=E6=9B=B4?=
 =?UTF-8?q?=E6=94=B9=E4=B8=BA=E5=AE=98=E6=96=B9=E6=8E=A8=E8=8D=90=E7=9A=84?=
 =?UTF-8?q?::v-deep?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../jsDataSet/index.vue                       | 10 +--
 .../BasicComponents/DigitalFlop/index.vue     |  4 +-
 .../BasicComponents/HorizontalLine/index.vue  |  4 +-
 .../BasicComponents/Picture/setting.vue       |  2 +-
 .../ScreenScrollBoard/index.vue               |  4 +-
 .../ScreenScrollRanking/index.vue             |  4 +-
 .../packages/BasicComponents/Tables/index.vue |  4 +-
 .../BasicComponents/VerticalLine/index.vue    |  4 +-
 .../packages/BasicComponents/Video/index.vue  |  6 +-
 .../BigScreenComponentMag/SideMenu.vue        |  4 +-
 .../BigScreenDesign/AssignDialog/index.vue    |  2 +-
 .../BigScreenDesign/ComponentDialog/index.vue | 12 ++--
 .../BigScreenDesign/HistoryList/index.vue     |  2 +-
 .../packages/BigScreenDesign/LeftPanel.vue    | 12 ++--
 .../BigScreenDesign/OverallSetting/index.vue  | 34 +++++-----
 .../BigScreenDesign/PageDesignTop.vue         |  2 +-
 .../RightSetting/ComponentBinding/index.vue   | 18 ++---
 .../RightSetting/ComponentRelation/index.vue  | 18 ++---
 .../BigScreenDesign/RulerTool/SketchRuler.vue | 10 +--
 .../packages/BigScreenDesign/SettingPanel.vue |  2 +-
 .../BigScreenDesign/SourceDialog/index.vue    | 10 +--
 .../packages/BigScreenDesign/index.vue        |  4 +-
 .../packages/BigScreenList/EditForm.vue       |  8 +--
 data-room-ui/packages/BigScreenList/index.vue |  8 +--
 .../packages/BigScreenMag/SideMenu.vue        |  4 +-
 .../BigScreenManagement/addDialog.vue         |  8 +--
 .../packages/BigScreenManagement/index.vue    | 22 +++----
 .../packages/Borders/Border1/index.vue        |  4 +-
 .../packages/Borders/Border10/index.vue       |  4 +-
 .../packages/Borders/Border11/index.vue       |  4 +-
 .../packages/Borders/Border12/index.vue       |  4 +-
 .../packages/Borders/Border13/index.vue       |  4 +-
 .../packages/Borders/Border14/index.vue       |  4 +-
 .../packages/Borders/Border15/index.vue       |  4 +-
 .../packages/Borders/Border2/index.vue        |  4 +-
 .../packages/Borders/Border3/index.vue        |  4 +-
 .../packages/Borders/Border4/index.vue        |  4 +-
 .../packages/Borders/Border5/index.vue        |  4 +-
 .../packages/Borders/Border6/index.vue        |  4 +-
 .../packages/Borders/Border7/index.vue        |  4 +-
 .../packages/Borders/Border8/index.vue        |  4 +-
 .../packages/Borders/Border9/index.vue        |  4 +-
 .../ComponentList/CatalogEditForm.vue         |  2 +-
 .../packages/ComponentList/EditForm.vue       |  8 +--
 data-room-ui/packages/ComponentList/index.vue | 10 +--
 .../packages/DataManagement/index.vue         |  6 +-
 .../DataSetLabelManagement/src/Tree/index.vue |  4 +-
 .../DataSetManagement/src/CustomEditForm.vue  | 10 +--
 .../src/DatasetTypeDialog.vue                 |  2 +-
 .../DataSetManagement/src/JsonEditForm.vue    | 16 ++---
 .../src/OriginalEditForm.vue                  |  6 +-
 .../DataSetManagement/src/ScriptEditForm.vue  | 10 +--
 .../src/StoredProcedureEditForm.vue           | 10 +--
 .../DataSetManagement/src/TypeTree.vue        |  4 +-
 .../packages/DataSetManagement/src/index.vue  |  6 +-
 .../DataSetSetting/dataSetSetting.vue         |  2 +-
 .../packages/DataSourceManagement/index.vue   |  6 +-
 .../DataSourceManagement/style/index.scss     |  4 +-
 .../Decorations/Decoration1/index.vue         |  4 +-
 .../Decorations/Decoration10/index.vue        |  4 +-
 .../Decorations/Decoration11/index.vue        |  4 +-
 .../Decorations/Decoration12/index.vue        |  4 +-
 .../Decorations/Decoration2/index.vue         |  4 +-
 .../Decorations/Decoration2Reverse/index.vue  |  4 +-
 .../Decorations/Decoration3/index.vue         |  4 +-
 .../Decorations/Decoration4/index.vue         |  4 +-
 .../Decorations/Decoration4Reverse/index.vue  |  4 +-
 .../Decorations/Decoration5/index.vue         |  4 +-
 .../Decorations/Decoration6/index.vue         |  4 +-
 .../Decorations/Decoration8/index.vue         |  4 +-
 .../Decorations/Decoration8Reverse/index.vue  |  4 +-
 .../Decorations/Decoration9/index.vue         |  4 +-
 .../Layout/ApplicationCreateTop/index.vue     | 18 ++---
 data-room-ui/packages/Render/index.vue        |  2 +-
 data-room-ui/packages/SourceList/EditForm.vue |  8 +--
 data-room-ui/packages/SourceList/index.vue    | 10 +--
 data-room-ui/packages/SourceMag/SideMenu.vue  |  4 +-
 .../packages/assets/style/bsTheme.scss        |  4 +-
 .../packages/assets/style/echartStyle.scss    |  4 +-
 .../packages/assets/style/settingWrap.scss    | 66 +++++++++----------
 80 files changed, 280 insertions(+), 280 deletions(-)

diff --git a/data-room-ui/example/customDatasetComponents/jsDataSet/index.vue b/data-room-ui/example/customDatasetComponents/jsDataSet/index.vue
index bbddb0b4..0f62b5e9 100644
--- a/data-room-ui/example/customDatasetComponents/jsDataSet/index.vue
+++ b/data-room-ui/example/customDatasetComponents/jsDataSet/index.vue
@@ -754,7 +754,7 @@ export default {
   }
 }
 
-/deep/ .el-input__inner {
+::v-deep .el-input__inner {
   width: 100% !important;
 }
 
@@ -773,7 +773,7 @@ export default {
 }
 
 .operation {
-  /deep/ .el-select {
+  ::v-deep .el-select {
     width: 200px !important;
     margin-right: 16px;
   }
@@ -781,7 +781,7 @@ export default {
   display: flex;
 }
 
-/deep/ .CodeMirror {
+::v-deep .CodeMirror {
   height: 180px !important;
   font-family: Helvetica, Tahoma;
 }
@@ -790,7 +790,7 @@ export default {
   border: 0;
 }
 
-/deep/ .fieldDescCheck {
+::v-deep .fieldDescCheck {
   .el-dialog__body {
     height: fit-content !important;
     min-height: unset !important;
@@ -872,7 +872,7 @@ export default {
   }
 }
 
-/deep/ .bs-table-box.is-Edit .el-table {
+::v-deep .bs-table-box.is-Edit .el-table {
   max-height: unset !important;
 
   .el-table__body-wrapper {
diff --git a/data-room-ui/packages/BasicComponents/DigitalFlop/index.vue b/data-room-ui/packages/BasicComponents/DigitalFlop/index.vue
index de08a48f..9f5cf4f7 100644
--- a/data-room-ui/packages/BasicComponents/DigitalFlop/index.vue
+++ b/data-room-ui/packages/BasicComponents/DigitalFlop/index.vue
@@ -185,12 +185,12 @@ export default {
   }
 }
 /*滚动条样式*/
-/deep/::-webkit-scrollbar {
+::v-deep ::-webkit-scrollbar {
   width: 4px;
   border-radius: 4px;
   height: 4px;
 }
-/deep/::-webkit-scrollbar-thumb {
+::v-deep ::-webkit-scrollbar-thumb {
   background: #dddddd !important;
   border-radius: 10px;
 }
diff --git a/data-room-ui/packages/BasicComponents/HorizontalLine/index.vue b/data-room-ui/packages/BasicComponents/HorizontalLine/index.vue
index ebc9c7e1..9abf8691 100644
--- a/data-room-ui/packages/BasicComponents/HorizontalLine/index.vue
+++ b/data-room-ui/packages/BasicComponents/HorizontalLine/index.vue
@@ -80,13 +80,13 @@ export default {
 }
 
 /*滚动条样式*/
-/deep/::-webkit-scrollbar {
+::v-deep ::-webkit-scrollbar {
   width: 4px;
   border-radius: 4px;
   height: 4px;
 }
 
-/deep/::-webkit-scrollbar-thumb {
+::v-deep ::-webkit-scrollbar-thumb {
   background: #dddddd !important;
   border-radius: 10px;
 }
diff --git a/data-room-ui/packages/BasicComponents/Picture/setting.vue b/data-room-ui/packages/BasicComponents/Picture/setting.vue
index cb1bec53..a91957c8 100644
--- a/data-room-ui/packages/BasicComponents/Picture/setting.vue
+++ b/data-room-ui/packages/BasicComponents/Picture/setting.vue
@@ -239,7 +239,7 @@ export default {
     display: none !important;
   }
 
-  ::v-deep.el-upload-list__item {
+  ::v-deep .el-upload-list__item {
     transition: none !important;
   }
 
diff --git a/data-room-ui/packages/BasicComponents/ScreenScrollBoard/index.vue b/data-room-ui/packages/BasicComponents/ScreenScrollBoard/index.vue
index df045293..de49b295 100644
--- a/data-room-ui/packages/BasicComponents/ScreenScrollBoard/index.vue
+++ b/data-room-ui/packages/BasicComponents/ScreenScrollBoard/index.vue
@@ -167,12 +167,12 @@ export default {
     }
   }
   /*滚动条样式*/
-  /deep/::-webkit-scrollbar {
+  ::v-deep ::-webkit-scrollbar {
     width: 4px;
     border-radius: 4px;
     height: 4px;
   }
-  /deep/::-webkit-scrollbar-thumb {
+  ::v-deep ::-webkit-scrollbar-thumb {
     background: #dddddd !important;
     border-radius: 10px;
   }
diff --git a/data-room-ui/packages/BasicComponents/ScreenScrollRanking/index.vue b/data-room-ui/packages/BasicComponents/ScreenScrollRanking/index.vue
index a73093e2..9072ca1c 100644
--- a/data-room-ui/packages/BasicComponents/ScreenScrollRanking/index.vue
+++ b/data-room-ui/packages/BasicComponents/ScreenScrollRanking/index.vue
@@ -124,12 +124,12 @@ export default {
     padding: 10px;
   }
   /*滚动条样式*/
-  /deep/::-webkit-scrollbar {
+  ::v-deep ::-webkit-scrollbar {
     width: 4px;
     border-radius: 4px;
     height: 4px;
   }
-  /deep/::-webkit-scrollbar-thumb {
+  ::v-deep ::-webkit-scrollbar-thumb {
     background: #dddddd !important;
     border-radius: 10px;
   }
diff --git a/data-room-ui/packages/BasicComponents/Tables/index.vue b/data-room-ui/packages/BasicComponents/Tables/index.vue
index 9d4f8f43..316e47fb 100644
--- a/data-room-ui/packages/BasicComponents/Tables/index.vue
+++ b/data-room-ui/packages/BasicComponents/Tables/index.vue
@@ -341,14 +341,14 @@ export default {
   display: table-cell !important;
 }
 
-/deep/ .el-table__body-wrapper::-webkit-scrollbar {
+::v-deep .el-table__body-wrapper::-webkit-scrollbar {
   width: 10px; // 横向滚动条
   height: 10px; // 纵向滚动条 必写
   background-color: transparent;
 }
 
 // 滚动条的滑块
-/deep/ .el-table__body-wrapper::-webkit-scrollbar-thumb {
+::v-deep .el-table__body-wrapper::-webkit-scrollbar-thumb {
   background-color: #9093994D;
   border-radius: 5px;
 
diff --git a/data-room-ui/packages/BasicComponents/VerticalLine/index.vue b/data-room-ui/packages/BasicComponents/VerticalLine/index.vue
index c8fc666d..1bcf0c82 100644
--- a/data-room-ui/packages/BasicComponents/VerticalLine/index.vue
+++ b/data-room-ui/packages/BasicComponents/VerticalLine/index.vue
@@ -82,13 +82,13 @@ export default {
 }
 
 /*滚动条样式*/
-/deep/::-webkit-scrollbar {
+::v-deep ::-webkit-scrollbar {
   width: 4px;
   border-radius: 4px;
   height: 4px;
 }
 
-/deep/::-webkit-scrollbar-thumb {
+::v-deep ::-webkit-scrollbar-thumb {
   background: #dddddd !important;
   border-radius: 10px;
 }
diff --git a/data-room-ui/packages/BasicComponents/Video/index.vue b/data-room-ui/packages/BasicComponents/Video/index.vue
index 73b12f25..ff2ec6b5 100644
--- a/data-room-ui/packages/BasicComponents/Video/index.vue
+++ b/data-room-ui/packages/BasicComponents/Video/index.vue
@@ -107,17 +107,17 @@ export default {
 }
 
 /*滚动条样式*/
-/deep/::-webkit-scrollbar {
+::v-deep ::-webkit-scrollbar {
   width: 4px;
   border-radius: 4px;
   height: 4px;
 }
 
-/deep/::-webkit-scrollbar-thumb {
+::v-deep ::-webkit-scrollbar-thumb {
   background: #dddddd !important;
   border-radius: 10px;
 }
-/deep/ .video-js .vjs-big-play-button {
+::v-deep .video-js .vjs-big-play-button {
   z-index: 100;
   left: 50%;
   top: 50%;
diff --git a/data-room-ui/packages/BigScreenComponentMag/SideMenu.vue b/data-room-ui/packages/BigScreenComponentMag/SideMenu.vue
index 60d70390..5b8c24bd 100644
--- a/data-room-ui/packages/BigScreenComponentMag/SideMenu.vue
+++ b/data-room-ui/packages/BigScreenComponentMag/SideMenu.vue
@@ -150,11 +150,11 @@ export default {
     left: 50%;
     transform: translateX(-40%);
     width: 100px!important;
-    /deep/.el-dropdown-menu__item{
+    ::v-deep.el-dropdown-menu__item{
       text-align: center;
       padding: 5px;
     }
-    /deep/.popper__arrow{
+    ::v-deep.popper__arrow{
       left: 50% !important;
       transform: translateX(-50%) !important;
     }
diff --git a/data-room-ui/packages/BigScreenDesign/AssignDialog/index.vue b/data-room-ui/packages/BigScreenDesign/AssignDialog/index.vue
index 3923c109..dcf705ea 100644
--- a/data-room-ui/packages/BigScreenDesign/AssignDialog/index.vue
+++ b/data-room-ui/packages/BigScreenDesign/AssignDialog/index.vue
@@ -140,7 +140,7 @@ export default {
   background-color: #3f3f3f;
 }
 
-/deep/ .el-dialog__body {
+::v-deep .el-dialog__body {
   padding: 0 !important;
   max-height: 100vh !important;
 }
diff --git a/data-room-ui/packages/BigScreenDesign/ComponentDialog/index.vue b/data-room-ui/packages/BigScreenDesign/ComponentDialog/index.vue
index 747914fa..813a8f71 100644
--- a/data-room-ui/packages/BigScreenDesign/ComponentDialog/index.vue
+++ b/data-room-ui/packages/BigScreenDesign/ComponentDialog/index.vue
@@ -483,14 +483,14 @@ export default {
       .el-input {
         width: 200px;
         margin-right: 20px;
-        /deep/.el-input__inner {
+        ::v-deep.el-input__inner {
           background-color: var(--bs-background-1) !important;
         }
       }
 
       .el-select {
         margin-right: 20px;
-        /deep/.el-input__inner {
+        ::v-deep.el-input__inner {
           background-color: var(--bs-background-1) !important;
         }
       }
@@ -506,7 +506,7 @@ export default {
       grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
       grid-gap: 15px;
 
-      // /deep/ .el-loading-mask {
+      // ::v-deep .el-loading-mask {
       //   display: flex;
       //   align-items: center;
       //   justify-content: center;
@@ -575,14 +575,14 @@ export default {
               object-fit: cover;
             }
 
-            /deep/.image-slot {
+            ::v-deep.image-slot {
               height: 100%;
               background-color: var(--bs-background-2);
               display: flex;
               align-items: center;
               justify-content: center;
             }
-            /deep/.el-image__error {
+            ::v-deep.el-image__error {
               background-color: #1d1d1d;
             }
           }
@@ -658,7 +658,7 @@ export default {
     justify-content: center;
     align-items: center;
   }
-  /deep/ .el-tabs__item {
+  ::v-deep .el-tabs__item {
     color: var(--bs-el-text);
   }
   .error-img-text{
diff --git a/data-room-ui/packages/BigScreenDesign/HistoryList/index.vue b/data-room-ui/packages/BigScreenDesign/HistoryList/index.vue
index ba53dabb..f297dc00 100644
--- a/data-room-ui/packages/BigScreenDesign/HistoryList/index.vue
+++ b/data-room-ui/packages/BigScreenDesign/HistoryList/index.vue
@@ -111,7 +111,7 @@ export default {
 @import '../../BigScreenDesign/fonts/iconfont.css';
 @import '../../assets/style/bsTheme.scss';
 .layer-list-wrap {
-  /deep/ .choosed-row {
+  ::v-deep .choosed-row {
     .bs-el-table-column {
       border-color: var(--bs-el-border) !important;
       background: var(--bs-background-2) !important;
diff --git a/data-room-ui/packages/BigScreenDesign/LeftPanel.vue b/data-room-ui/packages/BigScreenDesign/LeftPanel.vue
index 2a5c01eb..c7e7e4a8 100644
--- a/data-room-ui/packages/BigScreenDesign/LeftPanel.vue
+++ b/data-room-ui/packages/BigScreenDesign/LeftPanel.vue
@@ -391,7 +391,7 @@ export default {
         height: 100%;
       }
 
-      /deep/.el-tabs__content {
+      ::v-deep.el-tabs__content {
         height: 100%;
         width: 160px;
 
@@ -488,13 +488,13 @@ export default {
       }
     }
 
-    /deep/.el-tabs__header {
+    ::v-deep.el-tabs__header {
       width: 45px;
       height: 100%;
       margin-right: 0 !important;
     }
 
-    /deep/.el-tabs--left .el-tabs__nav-wrap.is-left::after {
+    ::v-deep.el-tabs--left .el-tabs__nav-wrap.is-left::after {
       width: 0 !important;
     }
 
@@ -512,7 +512,7 @@ export default {
       /* border-right: 1px solid #ccc; */
     }
 
-    /deep/ .el-tabs__nav-scroll {
+    ::v-deep .el-tabs__nav-scroll {
       background-color: var(--bs-background-2);
     }
   }
@@ -527,7 +527,7 @@ export default {
     }
   }
   .left-tabs-box {
-    /deep/.el-tabs__item {
+    ::v-deep.el-tabs__item {
       height: 70px !important;
       .menu-slot {
         height: 100%;
@@ -565,7 +565,7 @@ export default {
   opacity: 0;
 }
 
-/deep/ .el-tabs__item.is-left {
+::v-deep .el-tabs__item.is-left {
   text-align: center;
   padding: 0;
 }
diff --git a/data-room-ui/packages/BigScreenDesign/OverallSetting/index.vue b/data-room-ui/packages/BigScreenDesign/OverallSetting/index.vue
index 106ba99d..7ed85977 100644
--- a/data-room-ui/packages/BigScreenDesign/OverallSetting/index.vue
+++ b/data-room-ui/packages/BigScreenDesign/OverallSetting/index.vue
@@ -498,39 +498,39 @@ export default {
     }
   }
 
-  /deep/ .el-input__inner,
-  /deep/ .el-color-picker__color-inner,
-  /deep/ .el-radio__inner,
-  /deep/ .el-input-number--mini,
-  /deep/ .el-textarea__inner,
-  /deep/ .el-input-group__append,
-  /deep/ .el-radio__label {
+  ::v-deep .el-input__inner,
+  ::v-deep .el-color-picker__color-inner,
+  ::v-deep .el-radio__inner,
+  ::v-deep .el-input-number--mini,
+  ::v-deep .el-textarea__inner,
+  ::v-deep .el-input-group__append,
+  ::v-deep .el-radio__label {
     background: var(--bs-el-background-1);
     color: var(--bs-el-text);
     border: 0 !important;
   }
 
-  /deep/ .el-form-item__label {
+  ::v-deep .el-form-item__label {
     color: var(--bs-el-title);
     font-size: 12px;
   }
 
-  /deep/ .el-radio {
+  ::v-deep .el-radio {
     margin-right: 10px
   }
 
-  /deep/ .el-table {
+  ::v-deep .el-table {
     background: var(--bs-el-background-1);
     border-bottom: 1px solid var(--bs-el-title);
   }
 
-  /deep/ .el-table__cell {
+  ::v-deep .el-table__cell {
     background: var(--bs-el-background-1) !important;
     color: var(--bs-el-title) !important;
     border-color: var(--bs-el-text) !important;
   }
 
-  /deep/ .el-input__inner {
+  ::v-deep .el-input__inner {
     &:placeholder {
       color: var(--bs-el-text);
     }
@@ -580,7 +580,7 @@ export default {
   }
 }
 
-/deep/ .el-drawer__wrapper {
+::v-deep .el-drawer__wrapper {
   z-index: 2000 !important;
 
   .setting-body {
@@ -588,13 +588,13 @@ export default {
   }
 }
 
-/deep/ .el-drawer__body {
+::v-deep .el-drawer__body {
   padding: 0;
   margin-bottom: 0;
   overflow: hidden;
 }
 
-/deep/ .el-drawer__container {
+::v-deep .el-drawer__container {
   height: calc(100% - 40px) !important;
   top: 40px !important;
   position: relative;
@@ -619,7 +619,7 @@ export default {
     margin-right: 2px;
     color: #36474f;
 
-    /deep/.el-form-item {
+    ::v-deep.el-form-item {
       margin-bottom: 0 !important;
     }
 
@@ -652,7 +652,7 @@ export default {
   }
 }
 
-/deep/ .el-color-picker--mini .el-color-picker__trigger {
+::v-deep .el-color-picker--mini .el-color-picker__trigger {
   height: 32px;
   width: 32px;
   border: 1px solid var(--bs-el-background-1);
diff --git a/data-room-ui/packages/BigScreenDesign/PageDesignTop.vue b/data-room-ui/packages/BigScreenDesign/PageDesignTop.vue
index a8f21f73..90a69b5b 100644
--- a/data-room-ui/packages/BigScreenDesign/PageDesignTop.vue
+++ b/data-room-ui/packages/BigScreenDesign/PageDesignTop.vue
@@ -502,7 +502,7 @@ export default {
     cursor: pointer;
   }
 
-  /deep/.el-radio__label {
+  ::v-deep .el-radio__label {
     display: none;
   }
 }
diff --git a/data-room-ui/packages/BigScreenDesign/RightSetting/ComponentBinding/index.vue b/data-room-ui/packages/BigScreenDesign/RightSetting/ComponentBinding/index.vue
index 7ff561a3..0aec8568 100644
--- a/data-room-ui/packages/BigScreenDesign/RightSetting/ComponentBinding/index.vue
+++ b/data-room-ui/packages/BigScreenDesign/RightSetting/ComponentBinding/index.vue
@@ -163,22 +163,22 @@ export default {
 </script>
 
 <style scoped lang="scss">
-/deep/ .el-tabs__nav-scroll {
+::v-deep .el-tabs__nav-scroll {
   display: flex;
   justify-content: center;
 }
 
-/deep/ .el-tabs__nav-wrap::after {
+::v-deep .el-tabs__nav-wrap::after {
   height: 0;
 }
 
-/deep/ .el-collapse-item__header {
+::v-deep .el-collapse-item__header {
   background: #f2f3f5;
   height: 32px;
   padding: 0 12px;
 }
 
-/deep/ .el-collapse-item__content {
+::v-deep .el-collapse-item__content {
   padding-bottom: 0;
 }
 
@@ -186,22 +186,22 @@ export default {
   padding: 12px;
 }
 
-/deep/ .el-tabs__nav-scroll {
+::v-deep .el-tabs__nav-scroll {
   display: flex;
   justify-content: center;
 }
 
-/deep/ .el-tabs__nav-wrap::after {
+::v-deep .el-tabs__nav-wrap::after {
   height: 0;
 }
 
 .design-tab-warp {
   padding: 10px;
 }
-/deep/.el-tabs--top {
+::v-deep.el-tabs--top {
   height: 100%;
 }
-/deep/ .el-tabs__content {
+::v-deep .el-tabs__content {
   height: calc(100% - 40px);
   overflow-y: auto;
 }
@@ -234,7 +234,7 @@ export default {
     justify-content: center;
     margin-right: 2px;
 
-    /deep/.el-form-item {
+    ::v-deep.el-form-item {
       margin-bottom: 0 !important;
     }
 
diff --git a/data-room-ui/packages/BigScreenDesign/RightSetting/ComponentRelation/index.vue b/data-room-ui/packages/BigScreenDesign/RightSetting/ComponentRelation/index.vue
index f3c10343..28fbd4a8 100644
--- a/data-room-ui/packages/BigScreenDesign/RightSetting/ComponentRelation/index.vue
+++ b/data-room-ui/packages/BigScreenDesign/RightSetting/ComponentRelation/index.vue
@@ -238,22 +238,22 @@ export default {
 </script>
 
 <style scoped lang="scss">
-/deep/ .el-tabs__nav-scroll {
+::v-deep .el-tabs__nav-scroll {
   display: flex;
   justify-content: center;
 }
 
-/deep/ .el-tabs__nav-wrap::after {
+::v-deep .el-tabs__nav-wrap::after {
   height: 0;
 }
 
-/deep/ .el-collapse-item__header {
+::v-deep .el-collapse-item__header {
   background: #f2f3f5;
   height: 32px;
   padding: 0 12px;
 }
 
-/deep/ .el-collapse-item__content {
+::v-deep .el-collapse-item__content {
   padding-bottom: 0;
 }
 
@@ -261,22 +261,22 @@ export default {
   padding: 12px;
 }
 
-/deep/ .el-tabs__nav-scroll {
+::v-deep .el-tabs__nav-scroll {
   display: flex;
   justify-content: center;
 }
 
-/deep/ .el-tabs__nav-wrap::after {
+::v-deep .el-tabs__nav-wrap::after {
   height: 0;
 }
 
 .design-tab-warp {
   padding: 10px;
 }
-/deep/.el-tabs--top {
+::v-deep.el-tabs--top {
   height: 100%;
 }
-/deep/ .el-tabs__content {
+::v-deep .el-tabs__content {
   height: calc(100% - 40px);
   overflow-y: auto;
 }
@@ -309,7 +309,7 @@ export default {
     justify-content: center;
     margin-right: 2px;
 
-    /deep/.el-form-item {
+    ::v-deep.el-form-item {
       margin-bottom: 0 !important;
     }
 
diff --git a/data-room-ui/packages/BigScreenDesign/RulerTool/SketchRuler.vue b/data-room-ui/packages/BigScreenDesign/RulerTool/SketchRuler.vue
index 1be2a68e..7944fa2c 100644
--- a/data-room-ui/packages/BigScreenDesign/RulerTool/SketchRuler.vue
+++ b/data-room-ui/packages/BigScreenDesign/RulerTool/SketchRuler.vue
@@ -326,11 +326,11 @@ export default {
   top: 50px;
   left: 50px;
 }
-/deep/ .line {
+::v-deep .line {
   border-left: 1px dashed #0089d0 !important;
   border-top: 1px dashed #0089d0 !important;
 }
-/deep/.action {
+::v-deep.action {
   .value {
     background: var(--bs-el-color-primary);
     padding: 4px;
@@ -341,15 +341,15 @@ export default {
     color: var(--bs-el-color-primary);
   }
 }
-/deep/ .ruler, /deep/ .corner {
+::v-deep .ruler, ::v-deep .corner {
   background: var(--bs-background-1);
 }
-/deep/ .corner {
+::v-deep .corner {
   z-index: 999;
   background: var(--bs-background-1) !important;
 }
 
-/deep/ .mb-ruler {
+::v-deep .mb-ruler {
   z-index: 998
 }
 .grid-bg {
diff --git a/data-room-ui/packages/BigScreenDesign/SettingPanel.vue b/data-room-ui/packages/BigScreenDesign/SettingPanel.vue
index ebef0327..a18d78f5 100644
--- a/data-room-ui/packages/BigScreenDesign/SettingPanel.vue
+++ b/data-room-ui/packages/BigScreenDesign/SettingPanel.vue
@@ -209,7 +209,7 @@ export default {
   transform: translateX(10px);
   opacity: 0;
 }
-/deep/ .el-scrollbar__view{
+::v-deep .el-scrollbar__view{
   height: calc(100vh - 80px);
   overflow-x: unset;
 }
diff --git a/data-room-ui/packages/BigScreenDesign/SourceDialog/index.vue b/data-room-ui/packages/BigScreenDesign/SourceDialog/index.vue
index 2daa8e86..bd937a4d 100644
--- a/data-room-ui/packages/BigScreenDesign/SourceDialog/index.vue
+++ b/data-room-ui/packages/BigScreenDesign/SourceDialog/index.vue
@@ -232,14 +232,14 @@ export default {
     .el-input {
       width: 200px;
       margin-right: 20px;
-      /deep/.el-input__inner {
+      ::v-deep.el-input__inner {
         background-color: var(--bs-background-1) !important;
       }
     }
 
     .el-select {
       margin-right: 20px;
-      /deep/.el-input__inner {
+      ::v-deep.el-input__inner {
         background: var(--bs-background-1) !important;
         background-color: var(--bs-background-1) !important;
       }
@@ -256,7 +256,7 @@ export default {
     grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
     grid-gap: 15px;
 
-    // /deep/ .el-loading-mask {
+    // ::v-deep .el-loading-mask {
     //   display: flex;
     //   align-items: center;
     //   justify-content: center;
@@ -326,14 +326,14 @@ export default {
             object-fit: cover;
           }
 
-          /deep/.image-slot {
+          ::v-deep.image-slot {
             height: 100%;
             background-color: var(--bs-background-2);
             display: flex;
             align-items: center;
             justify-content: center;
           }
-          /deep/.el-image__error {
+          ::v-deep.el-image__error {
             background-color: #1d1d1d;
           }
         }
diff --git a/data-room-ui/packages/BigScreenDesign/index.vue b/data-room-ui/packages/BigScreenDesign/index.vue
index 54e9e129..6708bbd3 100644
--- a/data-room-ui/packages/BigScreenDesign/index.vue
+++ b/data-room-ui/packages/BigScreenDesign/index.vue
@@ -482,13 +482,13 @@ export default {
           margin-right: 16px;
         }
 
-        /deep/ .el-select {
+        ::v-deep .el-select {
           width: 150px !important;
         }
       }
     }
 
-    /deep/ .el-loading-mask {
+    ::v-deep .el-loading-mask {
       background-color: transparent !important;
     }
   }
diff --git a/data-room-ui/packages/BigScreenList/EditForm.vue b/data-room-ui/packages/BigScreenList/EditForm.vue
index 65472f94..64298ef3 100644
--- a/data-room-ui/packages/BigScreenList/EditForm.vue
+++ b/data-room-ui/packages/BigScreenList/EditForm.vue
@@ -353,7 +353,7 @@ export default {
   height: 300px;
   overflow-x: hidden;
 
-  /deep/ .el-scrollbar__view {
+  ::v-deep .el-scrollbar__view {
     overflow-x: hidden;
   }
 }
@@ -481,19 +481,19 @@ export default {
     cursor: pointer;
   }
 
-  /deep/.el-radio__label {
+  ::v-deep .el-radio__label {
     display: none;
   }
 }
 
 /*滚动条样式*/
-/deep/::-webkit-scrollbar {
+::v-deep ::-webkit-scrollbar {
   width: 6px;
   border-radius: 4px;
   height: 4px;
 }
 
-/deep/::-webkit-scrollbar-thumb {
+::v-deep ::-webkit-scrollbar-thumb {
   background: #dddddd !important;
   border-radius: 10px;
 }
diff --git a/data-room-ui/packages/BigScreenList/index.vue b/data-room-ui/packages/BigScreenList/index.vue
index ca7b3345..ccf96024 100644
--- a/data-room-ui/packages/BigScreenList/index.vue
+++ b/data-room-ui/packages/BigScreenList/index.vue
@@ -336,7 +336,7 @@ export default {
     .el-input {
       width: 200px;
       margin-right: 20px;
-      /deep/.el-input__inner {
+      ::v-deep.el-input__inner {
         background-color: var(--bs-background-1) !important;
       }
     }
@@ -354,7 +354,7 @@ export default {
     grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
     grid-gap: 15px;
     padding-bottom: 10px;
-    // /deep/ .el-loading-mask {
+    // ::v-deep .el-loading-mask {
     //   display: flex;
     //   align-items: center;
     //   justify-content: center;
@@ -457,14 +457,14 @@ export default {
             object-fit: cover;
           }
 
-          /deep/.image-slot {
+          ::v-deep.image-slot {
             height: 100%;
             background-color: var(--bs-background-2);
             display: flex;
             align-items: center;
             justify-content: center;
           }
-          /deep/.el-image__error {
+          ::v-deep.el-image__error {
             background-color: #1d1d1d;
           }
         }
diff --git a/data-room-ui/packages/BigScreenMag/SideMenu.vue b/data-room-ui/packages/BigScreenMag/SideMenu.vue
index 9889e749..f6e23043 100644
--- a/data-room-ui/packages/BigScreenMag/SideMenu.vue
+++ b/data-room-ui/packages/BigScreenMag/SideMenu.vue
@@ -336,11 +336,11 @@ export default {
     left: 50%;
     transform: translateX(-40%);
     width: 100px!important;
-    /deep/.el-dropdown-menu__item{
+    ::v-deep.el-dropdown-menu__item{
       text-align: center;
       padding: 5px;
     }
-    /deep/.popper__arrow{
+    ::v-deep.popper__arrow{
       left: 50% !important;
       transform: translateX(-50%) !important;
     }
diff --git a/data-room-ui/packages/BigScreenManagement/addDialog.vue b/data-room-ui/packages/BigScreenManagement/addDialog.vue
index d454b962..ccfc93cc 100644
--- a/data-room-ui/packages/BigScreenManagement/addDialog.vue
+++ b/data-room-ui/packages/BigScreenManagement/addDialog.vue
@@ -436,7 +436,7 @@ export default {
   height: 300px;
   overflow-x: hidden;
 
-  /deep/ .el-scrollbar__view {
+  ::v-deep .el-scrollbar__view {
     overflow-x: hidden;
   }
 }
@@ -569,19 +569,19 @@ export default {
     cursor: pointer;
   }
 
-  /deep/.el-radio__label {
+  ::v-deep .el-radio__label {
     display: none;
   }
 }
 
 /*滚动条样式*/
-/deep/::-webkit-scrollbar {
+::v-deep ::-webkit-scrollbar {
   width: 6px;
   border-radius: 4px;
   height: 4px;
 }
 
-/deep/::-webkit-scrollbar-thumb {
+::v-deep ::-webkit-scrollbar-thumb {
   background: #dddddd !important;
   border-radius: 10px;
 }
diff --git a/data-room-ui/packages/BigScreenManagement/index.vue b/data-room-ui/packages/BigScreenManagement/index.vue
index a54ea1b6..1f07bdc3 100644
--- a/data-room-ui/packages/BigScreenManagement/index.vue
+++ b/data-room-ui/packages/BigScreenManagement/index.vue
@@ -819,7 +819,7 @@ export default {
           position: relative;
           overflow: auto;
           overflow-x: hidden;
-          /deep/.el-input__suffix-inner{
+          ::v-deep.el-input__suffix-inner{
             /*pointer-events: none!important;*/
           }
           .preview-wrap{
@@ -847,7 +847,7 @@ export default {
     cursor: pointer;
   }
   .catalog-dialog{
-    /deep/ .el-dialog__body{
+    ::v-deep .el-dialog__body{
       min-height: 80px;
     }
   }
@@ -857,7 +857,7 @@ export default {
   .el-dropdown-menu--mini .el-dropdown-menu__item i{
     padding-top: 6px;
   }
-  .el-dropdown-menu--mini /deep/ .el-dropdown-menu__item{
+  .el-dropdown-menu--mini ::v-deep .el-dropdown-menu__item{
       display: flex;
       min-width: 100px!important;
       line-height: 36px;
@@ -910,19 +910,19 @@ export default {
     }
   }
  /* 去除tree前面的小三角形*/
-  .page-list-tree /deep/ .el-tree-node__content > .el-tree-node__expand-icon{
+  .page-list-tree ::v-deep .el-tree-node__content > .el-tree-node__expand-icon{
     width: 20px;
     opacity: 0 !important;
   }
   /*选中树节点后*/
-  .page-list-tree  /deep/ .ztree li a.curSelectedNode span{
+  .page-list-tree  ::v-deep .ztree li a.curSelectedNode span{
     color: var(--bs-el-color-primary)!important;
   }
   #settingDropdown{
     display: inline-block;
     float: right;
   }
-  /deep/ .el-tree-node{
+  ::v-deep .el-tree-node{
     line-height: 40px;
     .el-tree-node__content{
       line-height: 40px;
@@ -930,11 +930,11 @@ export default {
     }
   }
   /*当前tree节点激活样式*/
- .page-list-tree /deep/.is-current>.el-tree-node__content{
+ .page-list-tree ::v-deep.is-current>.el-tree-node__content{
     background: #007aff10;
     color: var(--bs-el-color-primary);
   }
-  .page-list-tree /deep/.is-current>.el-tree-node__content::before{
+  .page-list-tree ::v-deep.is-current>.el-tree-node__content::before{
     position: absolute;
     left: 0;
     border-left: 4px solid var(--bs-el-color-primary);
@@ -942,18 +942,18 @@ export default {
     height: 40px;
     width: 4px;
   }
-  /deep/ .el-icon-more{
+  ::v-deep .el-icon-more{
     transform: rotate(90deg);
     color: #999999;
     font-size: 10px;
   }
   /*滚动条样式*/
-  /deep/::-webkit-scrollbar {
+  ::v-deep ::-webkit-scrollbar {
     width: 6px;
     border-radius: 4px;
     /*height: 4px;*/
   }
-  /deep/::-webkit-scrollbar-thumb {
+  ::v-deep ::-webkit-scrollbar-thumb {
     background: #dddddd !important;
     border-radius: 10px;
   }
diff --git a/data-room-ui/packages/Borders/Border1/index.vue b/data-room-ui/packages/Borders/Border1/index.vue
index 80b095af..2cebc851 100644
--- a/data-room-ui/packages/Borders/Border1/index.vue
+++ b/data-room-ui/packages/Borders/Border1/index.vue
@@ -75,13 +75,13 @@ export default {
 }
 
 /*滚动条样式*/
-/deep/::-webkit-scrollbar {
+::v-deep ::-webkit-scrollbar {
   width: 4px;
   border-radius: 4px;
   height: 4px;
 }
 
-/deep/::-webkit-scrollbar-thumb {
+::v-deep ::-webkit-scrollbar-thumb {
   background: #dddddd !important;
   border-radius: 10px;
 }
diff --git a/data-room-ui/packages/Borders/Border10/index.vue b/data-room-ui/packages/Borders/Border10/index.vue
index 8ff05f75..efb82be7 100644
--- a/data-room-ui/packages/Borders/Border10/index.vue
+++ b/data-room-ui/packages/Borders/Border10/index.vue
@@ -77,13 +77,13 @@ export default {
 }
 
 /*滚动条样式*/
-/deep/::-webkit-scrollbar {
+::v-deep ::-webkit-scrollbar {
   width: 4px;
   border-radius: 4px;
   height: 4px;
 }
 
-/deep/::-webkit-scrollbar-thumb {
+::v-deep ::-webkit-scrollbar-thumb {
   background: #dddddd !important;
   border-radius: 10px;
 }
diff --git a/data-room-ui/packages/Borders/Border11/index.vue b/data-room-ui/packages/Borders/Border11/index.vue
index 78470bc3..8c98ac3d 100644
--- a/data-room-ui/packages/Borders/Border11/index.vue
+++ b/data-room-ui/packages/Borders/Border11/index.vue
@@ -85,13 +85,13 @@ export default {
 }
 
 /*滚动条样式*/
-/deep/::-webkit-scrollbar {
+::v-deep ::-webkit-scrollbar {
   width: 4px;
   border-radius: 4px;
   height: 4px;
 }
 
-/deep/::-webkit-scrollbar-thumb {
+::v-deep ::-webkit-scrollbar-thumb {
   background: #dddddd !important;
   border-radius: 10px;
 }
diff --git a/data-room-ui/packages/Borders/Border12/index.vue b/data-room-ui/packages/Borders/Border12/index.vue
index b9de24de..7634a379 100644
--- a/data-room-ui/packages/Borders/Border12/index.vue
+++ b/data-room-ui/packages/Borders/Border12/index.vue
@@ -91,13 +91,13 @@ export default {
 }
 
 /*滚动条样式*/
-/deep/::-webkit-scrollbar {
+::v-deep ::-webkit-scrollbar {
   width: 4px;
   border-radius: 4px;
   height: 4px;
 }
 
-/deep/::-webkit-scrollbar-thumb {
+::v-deep ::-webkit-scrollbar-thumb {
   background: #dddddd !important;
   border-radius: 10px;
 }
diff --git a/data-room-ui/packages/Borders/Border13/index.vue b/data-room-ui/packages/Borders/Border13/index.vue
index 3c28590d..4c9929d6 100644
--- a/data-room-ui/packages/Borders/Border13/index.vue
+++ b/data-room-ui/packages/Borders/Border13/index.vue
@@ -77,13 +77,13 @@ export default {
 }
 
 /*滚动条样式*/
-/deep/::-webkit-scrollbar {
+::v-deep ::-webkit-scrollbar {
   width: 4px;
   border-radius: 4px;
   height: 4px;
 }
 
-/deep/::-webkit-scrollbar-thumb {
+::v-deep ::-webkit-scrollbar-thumb {
   background: #dddddd !important;
   border-radius: 10px;
 }
diff --git a/data-room-ui/packages/Borders/Border14/index.vue b/data-room-ui/packages/Borders/Border14/index.vue
index 72bb7c3c..9930086d 100644
--- a/data-room-ui/packages/Borders/Border14/index.vue
+++ b/data-room-ui/packages/Borders/Border14/index.vue
@@ -92,13 +92,13 @@ export default {
 }
 
 /*滚动条样式*/
-/deep/::-webkit-scrollbar {
+::v-deep ::-webkit-scrollbar {
   width: 4px;
   border-radius: 4px;
   height: 4px;
 }
 
-/deep/::-webkit-scrollbar-thumb {
+::v-deep ::-webkit-scrollbar-thumb {
   background: #dddddd !important;
   border-radius: 10px;
 }
diff --git a/data-room-ui/packages/Borders/Border15/index.vue b/data-room-ui/packages/Borders/Border15/index.vue
index d9fcdf7b..de06e37e 100644
--- a/data-room-ui/packages/Borders/Border15/index.vue
+++ b/data-room-ui/packages/Borders/Border15/index.vue
@@ -98,13 +98,13 @@ export default {
 }
 
 /*滚动条样式*/
-/deep/::-webkit-scrollbar {
+::v-deep ::-webkit-scrollbar {
   width: 4px;
   border-radius: 4px;
   height: 4px;
 }
 
-/deep/::-webkit-scrollbar-thumb {
+::v-deep ::-webkit-scrollbar-thumb {
   background: #dddddd !important;
   border-radius: 10px;
 }
diff --git a/data-room-ui/packages/Borders/Border2/index.vue b/data-room-ui/packages/Borders/Border2/index.vue
index 9872a074..bdd8421d 100644
--- a/data-room-ui/packages/Borders/Border2/index.vue
+++ b/data-room-ui/packages/Borders/Border2/index.vue
@@ -77,13 +77,13 @@ export default {
 }
 
 /*滚动条样式*/
-/deep/::-webkit-scrollbar {
+::v-deep ::-webkit-scrollbar {
   width: 4px;
   border-radius: 4px;
   height: 4px;
 }
 
-/deep/::-webkit-scrollbar-thumb {
+::v-deep ::-webkit-scrollbar-thumb {
   background: #dddddd !important;
   border-radius: 10px;
 }
diff --git a/data-room-ui/packages/Borders/Border3/index.vue b/data-room-ui/packages/Borders/Border3/index.vue
index 525617f9..82260952 100644
--- a/data-room-ui/packages/Borders/Border3/index.vue
+++ b/data-room-ui/packages/Borders/Border3/index.vue
@@ -76,13 +76,13 @@ export default {
 }
 
 /*滚动条样式*/
-/deep/::-webkit-scrollbar {
+::v-deep ::-webkit-scrollbar {
   width: 4px;
   border-radius: 4px;
   height: 4px;
 }
 
-/deep/::-webkit-scrollbar-thumb {
+::v-deep ::-webkit-scrollbar-thumb {
   background: #dddddd !important;
   border-radius: 10px;
 }</style>
diff --git a/data-room-ui/packages/Borders/Border4/index.vue b/data-room-ui/packages/Borders/Border4/index.vue
index 3a6198f9..566d31af 100644
--- a/data-room-ui/packages/Borders/Border4/index.vue
+++ b/data-room-ui/packages/Borders/Border4/index.vue
@@ -81,13 +81,13 @@ export default {
 }
 
 /*滚动条样式*/
-/deep/::-webkit-scrollbar {
+::v-deep ::-webkit-scrollbar {
   width: 4px;
   border-radius: 4px;
   height: 4px;
 }
 
-/deep/::-webkit-scrollbar-thumb {
+::v-deep ::-webkit-scrollbar-thumb {
   background: #dddddd !important;
   border-radius: 10px;
 }
diff --git a/data-room-ui/packages/Borders/Border5/index.vue b/data-room-ui/packages/Borders/Border5/index.vue
index 7eaef356..38b83d0c 100644
--- a/data-room-ui/packages/Borders/Border5/index.vue
+++ b/data-room-ui/packages/Borders/Border5/index.vue
@@ -81,13 +81,13 @@ export default {
 }
 
 /*滚动条样式*/
-/deep/::-webkit-scrollbar {
+::v-deep ::-webkit-scrollbar {
   width: 4px;
   border-radius: 4px;
   height: 4px;
 }
 
-/deep/::-webkit-scrollbar-thumb {
+::v-deep ::-webkit-scrollbar-thumb {
   background: #dddddd !important;
   border-radius: 10px;
 }
diff --git a/data-room-ui/packages/Borders/Border6/index.vue b/data-room-ui/packages/Borders/Border6/index.vue
index de3217b2..d32dee24 100644
--- a/data-room-ui/packages/Borders/Border6/index.vue
+++ b/data-room-ui/packages/Borders/Border6/index.vue
@@ -91,13 +91,13 @@ export default {
 }
 
 /*滚动条样式*/
-/deep/::-webkit-scrollbar {
+::v-deep ::-webkit-scrollbar {
   width: 4px;
   border-radius: 4px;
   height: 4px;
 }
 
-/deep/::-webkit-scrollbar-thumb {
+::v-deep ::-webkit-scrollbar-thumb {
   background: #dddddd !important;
   border-radius: 10px;
 }
diff --git a/data-room-ui/packages/Borders/Border7/index.vue b/data-room-ui/packages/Borders/Border7/index.vue
index dbfdf35b..2816837e 100644
--- a/data-room-ui/packages/Borders/Border7/index.vue
+++ b/data-room-ui/packages/Borders/Border7/index.vue
@@ -76,13 +76,13 @@ export default {
 }
 
 /*滚动条样式*/
-/deep/::-webkit-scrollbar {
+::v-deep ::-webkit-scrollbar {
   width: 4px;
   border-radius: 4px;
   height: 4px;
 }
 
-/deep/::-webkit-scrollbar-thumb {
+::v-deep ::-webkit-scrollbar-thumb {
   background: #dddddd !important;
   border-radius: 10px;
 }
diff --git a/data-room-ui/packages/Borders/Border8/index.vue b/data-room-ui/packages/Borders/Border8/index.vue
index edecf89c..cd3e6a3a 100644
--- a/data-room-ui/packages/Borders/Border8/index.vue
+++ b/data-room-ui/packages/Borders/Border8/index.vue
@@ -83,13 +83,13 @@ export default {
 }
 
 /*滚动条样式*/
-/deep/::-webkit-scrollbar {
+::v-deep ::-webkit-scrollbar {
   width: 4px;
   border-radius: 4px;
   height: 4px;
 }
 
-/deep/::-webkit-scrollbar-thumb {
+::v-deep ::-webkit-scrollbar-thumb {
   background: #dddddd !important;
   border-radius: 10px;
 }
diff --git a/data-room-ui/packages/Borders/Border9/index.vue b/data-room-ui/packages/Borders/Border9/index.vue
index af2aa197..044bb1f2 100644
--- a/data-room-ui/packages/Borders/Border9/index.vue
+++ b/data-room-ui/packages/Borders/Border9/index.vue
@@ -77,13 +77,13 @@ export default {
 }
 
 /*滚动条样式*/
-/deep/::-webkit-scrollbar {
+::v-deep ::-webkit-scrollbar {
   width: 4px;
   border-radius: 4px;
   height: 4px;
 }
 
-/deep/::-webkit-scrollbar-thumb {
+::v-deep ::-webkit-scrollbar-thumb {
   background: #dddddd !important;
   border-radius: 10px;
 }
diff --git a/data-room-ui/packages/ComponentList/CatalogEditForm.vue b/data-room-ui/packages/ComponentList/CatalogEditForm.vue
index 404e2589..a74a4a1a 100644
--- a/data-room-ui/packages/ComponentList/CatalogEditForm.vue
+++ b/data-room-ui/packages/ComponentList/CatalogEditForm.vue
@@ -272,7 +272,7 @@ export default {
     .el-input {
       width: 200px;
       margin-right: 20px;
-      /deep/.el-input__inner {
+      ::v-deep.el-input__inner {
         background-color: #151A26 !important;
       }
     }
diff --git a/data-room-ui/packages/ComponentList/EditForm.vue b/data-room-ui/packages/ComponentList/EditForm.vue
index 86d85dcc..5b31b30a 100644
--- a/data-room-ui/packages/ComponentList/EditForm.vue
+++ b/data-room-ui/packages/ComponentList/EditForm.vue
@@ -439,7 +439,7 @@ export default {
   height: 300px;
   overflow-x: hidden;
 
-  /deep/ .el-scrollbar__view {
+  ::v-deep .el-scrollbar__view {
     overflow-x: hidden;
   }
 }
@@ -567,19 +567,19 @@ export default {
     cursor: pointer;
   }
 
-  /deep/.el-radio__label {
+  ::v-deep .el-radio__label {
     display: none;
   }
 }
 
 /*滚动条样式*/
-/deep/::-webkit-scrollbar {
+::v-deep ::-webkit-scrollbar {
   width: 6px;
   border-radius: 4px;
   height: 4px;
 }
 
-/deep/::-webkit-scrollbar-thumb {
+::v-deep ::-webkit-scrollbar-thumb {
   background: #dddddd !important;
   border-radius: 10px;
 }
diff --git a/data-room-ui/packages/ComponentList/index.vue b/data-room-ui/packages/ComponentList/index.vue
index 35413b21..5cb21a7e 100644
--- a/data-room-ui/packages/ComponentList/index.vue
+++ b/data-room-ui/packages/ComponentList/index.vue
@@ -445,14 +445,14 @@ export default {
     .el-input {
       width: 200px;
       margin-right: 20px;
-      /deep/.el-input__inner {
+      ::v-deep.el-input__inner {
         background-color: var(--bs-background-1) !important;
       }
     }
 
     .el-select {
       margin-right: 20px;
-      /deep/.el-input__inner {
+      ::v-deep.el-input__inner {
         background-color: var(--bs-background-1) !important;
       }
     }
@@ -470,7 +470,7 @@ export default {
     grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
     grid-gap: 15px;
     padding-bottom: 10px;
-    // /deep/ .el-loading-mask {
+    // ::v-deep .el-loading-mask {
     //   display: flex;
     //   align-items: center;
     //   justify-content: center;
@@ -573,14 +573,14 @@ export default {
             object-fit: cover;
           }
 
-          /deep/.image-slot {
+          ::v-deep.image-slot {
             height: 100%;
             background-color: var(--bs-background-2);
             display: flex;
             align-items: center;
             justify-content: center;
           }
-          /deep/.el-image__error {
+          ::v-deep.el-image__error {
             background-color: #1d1d1d;
           }
         }
diff --git a/data-room-ui/packages/DataManagement/index.vue b/data-room-ui/packages/DataManagement/index.vue
index 1445dbd3..3ae6af10 100644
--- a/data-room-ui/packages/DataManagement/index.vue
+++ b/data-room-ui/packages/DataManagement/index.vue
@@ -150,12 +150,12 @@ export default {
         }
       }
 
-      /deep/ .el-tabs__item {
+      ::v-deep .el-tabs__item {
         text-align: left;
         width: 290px;
       }
 
-      /deep/ .el-tabs__nav-wrap::after {
+      ::v-deep .el-tabs__nav-wrap::after {
         background-color: #fff !important;
       }
     }
@@ -172,7 +172,7 @@ export default {
       height: 100%;
       box-sizing: border-box;
     }
-    /deep/.el-scrollbar__view{
+    ::v-deep.el-scrollbar__view{
       height: 100%;
       .inner-router-view-wrap{
         height: 100%;
diff --git a/data-room-ui/packages/DataSetLabelManagement/src/Tree/index.vue b/data-room-ui/packages/DataSetLabelManagement/src/Tree/index.vue
index d96e8946..9eeb321e 100644
--- a/data-room-ui/packages/DataSetLabelManagement/src/Tree/index.vue
+++ b/data-room-ui/packages/DataSetLabelManagement/src/Tree/index.vue
@@ -117,7 +117,7 @@ export default {
 </script>
 
 <style lang="scss" scoped>
-/deep/ .el-tree-node {
+::v-deep .el-tree-node {
   display: block;
   min-width: 270px;
 
@@ -161,7 +161,7 @@ export default {
   }
 }
 
-// /deep/ .is-current .options{
+// ::v-deep .is-current .options{
 //   background: #fff;
 // }
 </style>
diff --git a/data-room-ui/packages/DataSetManagement/src/CustomEditForm.vue b/data-room-ui/packages/DataSetManagement/src/CustomEditForm.vue
index f5ddb0e5..cbb8529a 100644
--- a/data-room-ui/packages/DataSetManagement/src/CustomEditForm.vue
+++ b/data-room-ui/packages/DataSetManagement/src/CustomEditForm.vue
@@ -1219,7 +1219,7 @@ export default {
 //   max-height: 270px;
 // }
 
-/deep/ .el-input__inner {
+::v-deep .el-input__inner {
   width: 100% !important;
 }
 
@@ -1238,7 +1238,7 @@ export default {
 }
 
 .operation {
-  /deep/ .el-select {
+  ::v-deep .el-select {
     width: 200px !important;
     margin-right: 16px;
   }
@@ -1246,7 +1246,7 @@ export default {
   display: flex;
 }
 
-/deep/ .CodeMirror {
+::v-deep .CodeMirror {
   height: 180px !important;
   font-family: Helvetica, Tahoma;
   // .CodeMirror-scroll {
@@ -1261,7 +1261,7 @@ export default {
   border: 0;
 }
 
-/deep/ .fieldDescCheck {
+::v-deep .fieldDescCheck {
   .el-dialog__body {
     height: fit-content !important;
     min-height: unset !important;
@@ -1347,7 +1347,7 @@ export default {
   margin-bottom: 0 !important;
 }
 
-/deep/ .bs-table-box.is-Edit .el-table {
+::v-deep .bs-table-box.is-Edit .el-table {
   max-height: unset !important;
 
   .el-table__body-wrapper {
diff --git a/data-room-ui/packages/DataSetManagement/src/DatasetTypeDialog.vue b/data-room-ui/packages/DataSetManagement/src/DatasetTypeDialog.vue
index ddcec59e..de4592d5 100644
--- a/data-room-ui/packages/DataSetManagement/src/DatasetTypeDialog.vue
+++ b/data-room-ui/packages/DataSetManagement/src/DatasetTypeDialog.vue
@@ -167,7 +167,7 @@ export default {
       color: var(--bs-el-color-primary);
     }
 }
-/deep/ .el-dialog__body {
+::v-deep .el-dialog__body {
   min-height: 130px !important;
 }
 .el-col {
diff --git a/data-room-ui/packages/DataSetManagement/src/JsonEditForm.vue b/data-room-ui/packages/DataSetManagement/src/JsonEditForm.vue
index 610e1c81..fd898ac9 100644
--- a/data-room-ui/packages/DataSetManagement/src/JsonEditForm.vue
+++ b/data-room-ui/packages/DataSetManagement/src/JsonEditForm.vue
@@ -726,12 +726,12 @@ export default {
   overflow: auto;
 }
 
-/deep/ .jsoneditor-poweredBy,
-/deep/ .jsoneditor-modes {
+::v-deep .jsoneditor-poweredBy,
+::v-deep .jsoneditor-modes {
   display: none;
 }
 
-/deep/ .ace_editor.ace-jsoneditor {
+::v-deep .ace_editor.ace-jsoneditor {
   min-height: 250px;
 }
 
@@ -772,7 +772,7 @@ export default {
   }
 }
 
-/deep/ .fieldDescCheck {
+::v-deep .fieldDescCheck {
   .el-dialog__body {
     height: fit-content !important;
     min-height: unset !important;
@@ -799,16 +799,16 @@ export default {
   }
 }
 
-/deep/ .ace_layer.ace_gutter-layer.ace_folding-enabled {
+::v-deep .ace_layer.ace_gutter-layer.ace_folding-enabled {
   background: #f6f7fb;
 }
 
-/deep/ .jsoneditor-menu {
+::v-deep .jsoneditor-menu {
   background: var(--bs-el-color-primary);
   border-color: var(--bs-el-color-primary);
 }
 
-/deep/ .jsoneditor-mode-code {
+::v-deep .jsoneditor-mode-code {
   border-color: var(--bs-el-color-primary);
 }
 
@@ -816,7 +816,7 @@ export default {
   margin-bottom: 0;
 }
 
-/deep/ .bs-table-box.is-Edit .el-table {
+::v-deep .bs-table-box.is-Edit .el-table {
   max-height: unset !important;
 
   .el-table__body-wrapper {
diff --git a/data-room-ui/packages/DataSetManagement/src/OriginalEditForm.vue b/data-room-ui/packages/DataSetManagement/src/OriginalEditForm.vue
index e2af7c28..5f3109b5 100644
--- a/data-room-ui/packages/DataSetManagement/src/OriginalEditForm.vue
+++ b/data-room-ui/packages/DataSetManagement/src/OriginalEditForm.vue
@@ -928,7 +928,7 @@ export default {
 //   max-height: 270px;
 // }
 
-/deep/ .el-input__inner {
+::v-deep .el-input__inner {
   width: 100% !important;
 }
 
@@ -942,7 +942,7 @@ export default {
   }
 }
 
-/deep/ .fieldDescCheck {
+::v-deep .fieldDescCheck {
   .el-dialog__body {
     height: fit-content !important;
     min-height: unset !important;
@@ -980,7 +980,7 @@ export default {
   }
 }
 
-/deep/ .bs-table-box.is-Edit .el-table {
+::v-deep .bs-table-box.is-Edit .el-table {
   .el-table__body-wrapper {
     max-height: unset !important;
   }
diff --git a/data-room-ui/packages/DataSetManagement/src/ScriptEditForm.vue b/data-room-ui/packages/DataSetManagement/src/ScriptEditForm.vue
index 0a665387..f3bf197d 100644
--- a/data-room-ui/packages/DataSetManagement/src/ScriptEditForm.vue
+++ b/data-room-ui/packages/DataSetManagement/src/ScriptEditForm.vue
@@ -867,7 +867,7 @@ export default {
 //   max-height: 270px;
 // }
 
-/deep/ .el-input__inner {
+::v-deep .el-input__inner {
   width: 100% !important;
 }
 
@@ -886,7 +886,7 @@ export default {
 }
 
 .operation {
-  /deep/ .el-select {
+  ::v-deep .el-select {
     width: 200px !important;
     margin-right: 16px;
   }
@@ -897,7 +897,7 @@ export default {
 // .codeStyle {
 //   border: 1px solid #EBEEF5;
 // }
-/deep/ .CodeMirror {
+::v-deep .CodeMirror {
   height: 180px !important;
   font-family: Helvetica, Tahoma;
   // .CodeMirror-scroll {
@@ -912,7 +912,7 @@ export default {
   border: 0;
 }
 
-/deep/ .fieldDescCheck {
+::v-deep .fieldDescCheck {
   .el-dialog__body {
     height: fit-content !important;
     min-height: unset !important;
@@ -994,7 +994,7 @@ export default {
   }
 }
 
-/deep/ .bs-table-box.is-Edit .el-table {
+::v-deep .bs-table-box.is-Edit .el-table {
   max-height: unset !important;
 
   .el-table__body-wrapper {
diff --git a/data-room-ui/packages/DataSetManagement/src/StoredProcedureEditForm.vue b/data-room-ui/packages/DataSetManagement/src/StoredProcedureEditForm.vue
index 3aaffdf4..c2eb8dd4 100644
--- a/data-room-ui/packages/DataSetManagement/src/StoredProcedureEditForm.vue
+++ b/data-room-ui/packages/DataSetManagement/src/StoredProcedureEditForm.vue
@@ -1013,7 +1013,7 @@ export default {
 //   max-height: 270px;
 // }
 
-/deep/ .el-input__inner {
+::v-deep .el-input__inner {
   width: 100% !important;
 }
 
@@ -1032,7 +1032,7 @@ export default {
 }
 
 .operation {
-  /deep/ .el-select {
+  ::v-deep .el-select {
     width: 200px !important;
     margin-right: 16px;
   }
@@ -1043,7 +1043,7 @@ export default {
 // .codeStyle {
 //   border: 1px solid #EBEEF5;
 // }
-/deep/ .CodeMirror {
+::v-deep .CodeMirror {
   height: 180px !important;
   font-family: Helvetica, Tahoma;
   // .CodeMirror-scroll {
@@ -1058,7 +1058,7 @@ export default {
   border: 0;
 }
 
-/deep/ .fieldDescCheck {
+::v-deep .fieldDescCheck {
   .el-dialog__body {
     height: fit-content !important;
     min-height: unset !important;
@@ -1139,7 +1139,7 @@ export default {
   }
 }
 
-/deep/ .bs-table-box.is-Edit .el-table {
+::v-deep .bs-table-box.is-Edit .el-table {
   max-height: unset !important;
 
   .el-table__body-wrapper {
diff --git a/data-room-ui/packages/DataSetManagement/src/TypeTree.vue b/data-room-ui/packages/DataSetManagement/src/TypeTree.vue
index a702665a..279cf53c 100644
--- a/data-room-ui/packages/DataSetManagement/src/TypeTree.vue
+++ b/data-room-ui/packages/DataSetManagement/src/TypeTree.vue
@@ -482,7 +482,7 @@ export default {
 <style lang="scss" scoped>
 @import '../../assets/style/bsTheme.scss';
 
-/deep/ .el-tabs {
+::v-deep .el-tabs {
   .el-tabs__header {
     margin: 0;
 
@@ -526,7 +526,7 @@ export default {
       background-color: var(--bs-el-background-3) !important;
     }
   }
-/deep/ .el-tabs__nav-wrap::after {
+::v-deep .el-tabs__nav-wrap::after {
   display: none !important;
 }
 
diff --git a/data-room-ui/packages/DataSetManagement/src/index.vue b/data-room-ui/packages/DataSetManagement/src/index.vue
index b339156d..362b348e 100644
--- a/data-room-ui/packages/DataSetManagement/src/index.vue
+++ b/data-room-ui/packages/DataSetManagement/src/index.vue
@@ -667,7 +667,7 @@ export default {
 }
 
 .bs-container .inner-container .el-form .filter-item {
-  /deep/ .el-input__inner {
+  ::v-deep .el-input__inner {
     width: 200px;
   }
 }
@@ -694,11 +694,11 @@ export default {
       height: calc(90vh - 340px);
     }
 
-    /deep/ .ztree {
+    ::v-deep .ztree {
       max-height: calc(90vh - 325px) !important;
     }
 
-    /deep/ .el-tabs__item.is-active {
+    ::v-deep .el-tabs__item.is-active {
       border-bottom: none !important;
     }
 
diff --git a/data-room-ui/packages/DataSetSetting/dataSetSetting.vue b/data-room-ui/packages/DataSetSetting/dataSetSetting.vue
index dc099dfb..9af7684b 100644
--- a/data-room-ui/packages/DataSetSetting/dataSetSetting.vue
+++ b/data-room-ui/packages/DataSetSetting/dataSetSetting.vue
@@ -100,7 +100,7 @@ export default {
   padding-left: 16px !important;
 }
 .data-set-wrap {
-  /deep/ .el-dialog__body {
+  ::v-deep .el-dialog__body {
     position: relative;
     padding: 0 !important;
     min-height: 535px;
diff --git a/data-room-ui/packages/DataSourceManagement/index.vue b/data-room-ui/packages/DataSourceManagement/index.vue
index 14aa3418..a2b692ce 100644
--- a/data-room-ui/packages/DataSourceManagement/index.vue
+++ b/data-room-ui/packages/DataSourceManagement/index.vue
@@ -150,12 +150,12 @@ export default {
       }
     }
 
-    /deep/ .el-tabs__item {
+    ::v-deep .el-tabs__item {
       text-align: left;
       width: 290px;
     }
 
-    /deep/ .el-tabs__nav-wrap::after {
+    ::v-deep .el-tabs__nav-wrap::after {
       background-color: #fff !important;
     }
   }
@@ -172,7 +172,7 @@ export default {
     height: 100%;
     box-sizing: border-box;
   }
-  /deep/.el-scrollbar__view{
+  ::v-deep.el-scrollbar__view{
     height: 100%;
     .inner-router-view-wrap{
       height: 100%;
diff --git a/data-room-ui/packages/DataSourceManagement/style/index.scss b/data-room-ui/packages/DataSourceManagement/style/index.scss
index 70b9565a..f3ab6c88 100644
--- a/data-room-ui/packages/DataSourceManagement/style/index.scss
+++ b/data-room-ui/packages/DataSourceManagement/style/index.scss
@@ -133,7 +133,7 @@
     font-weight: bold;
     color: #fff;
   }
-  /deep/ .el-button.item  {
+  ::v-deep .el-button.item  {
     border-width: 0;
     &:hover, &:focus {
       outline: none;
@@ -152,7 +152,7 @@
     .el-table {
       max-height: calc(90vh - 340px);
     }
-    /deep/ .ztree {
+    ::v-deep .ztree {
       max-height: calc(90vh - 325px) !important;
     }
   }
diff --git a/data-room-ui/packages/Decorations/Decoration1/index.vue b/data-room-ui/packages/Decorations/Decoration1/index.vue
index 0f117c42..f6f05dda 100644
--- a/data-room-ui/packages/Decorations/Decoration1/index.vue
+++ b/data-room-ui/packages/Decorations/Decoration1/index.vue
@@ -86,12 +86,12 @@ export default {
   }
 }
 /*滚动条样式*/
-/deep/::-webkit-scrollbar {
+::v-deep ::-webkit-scrollbar {
   width: 4px;
   border-radius: 4px;
   height: 4px;
 }
-/deep/::-webkit-scrollbar-thumb {
+::v-deep ::-webkit-scrollbar-thumb {
   background: #dddddd !important;
   border-radius: 10px;
 }
diff --git a/data-room-ui/packages/Decorations/Decoration10/index.vue b/data-room-ui/packages/Decorations/Decoration10/index.vue
index d0341f7b..c51f0d93 100644
--- a/data-room-ui/packages/Decorations/Decoration10/index.vue
+++ b/data-room-ui/packages/Decorations/Decoration10/index.vue
@@ -86,12 +86,12 @@ export default {
   }
 }
 /*滚动条样式*/
-/deep/::-webkit-scrollbar {
+::v-deep ::-webkit-scrollbar {
   width: 4px;
   border-radius: 4px;
   height: 4px;
 }
-/deep/::-webkit-scrollbar-thumb {
+::v-deep ::-webkit-scrollbar-thumb {
   background: #dddddd !important;
   border-radius: 10px;
 }
diff --git a/data-room-ui/packages/Decorations/Decoration11/index.vue b/data-room-ui/packages/Decorations/Decoration11/index.vue
index 26cf64de..ab55cc7c 100644
--- a/data-room-ui/packages/Decorations/Decoration11/index.vue
+++ b/data-room-ui/packages/Decorations/Decoration11/index.vue
@@ -95,12 +95,12 @@ export default {
   }
 }
 /*滚动条样式*/
-/deep/::-webkit-scrollbar {
+::v-deep ::-webkit-scrollbar {
   width: 4px;
   border-radius: 4px;
   height: 4px;
 }
-/deep/::-webkit-scrollbar-thumb {
+::v-deep ::-webkit-scrollbar-thumb {
   background: #dddddd !important;
   border-radius: 10px;
 }
diff --git a/data-room-ui/packages/Decorations/Decoration12/index.vue b/data-room-ui/packages/Decorations/Decoration12/index.vue
index 161699f1..9d7b723a 100644
--- a/data-room-ui/packages/Decorations/Decoration12/index.vue
+++ b/data-room-ui/packages/Decorations/Decoration12/index.vue
@@ -88,12 +88,12 @@ export default {
   }
 }
 /*滚动条样式*/
-/deep/::-webkit-scrollbar {
+::v-deep ::-webkit-scrollbar {
   width: 4px;
   border-radius: 4px;
   height: 4px;
 }
-/deep/::-webkit-scrollbar-thumb {
+::v-deep ::-webkit-scrollbar-thumb {
   background: #dddddd !important;
   border-radius: 10px;
 }
diff --git a/data-room-ui/packages/Decorations/Decoration2/index.vue b/data-room-ui/packages/Decorations/Decoration2/index.vue
index c5923d4f..a82bce5a 100644
--- a/data-room-ui/packages/Decorations/Decoration2/index.vue
+++ b/data-room-ui/packages/Decorations/Decoration2/index.vue
@@ -88,12 +88,12 @@ export default {
   }
 }
 /*滚动条样式*/
-/deep/::-webkit-scrollbar {
+::v-deep ::-webkit-scrollbar {
   width: 4px;
   border-radius: 4px;
   height: 4px;
 }
-/deep/::-webkit-scrollbar-thumb {
+::v-deep ::-webkit-scrollbar-thumb {
   background: #dddddd !important;
   border-radius: 10px;
 }
diff --git a/data-room-ui/packages/Decorations/Decoration2Reverse/index.vue b/data-room-ui/packages/Decorations/Decoration2Reverse/index.vue
index d6f355d1..1b2bfcb0 100644
--- a/data-room-ui/packages/Decorations/Decoration2Reverse/index.vue
+++ b/data-room-ui/packages/Decorations/Decoration2Reverse/index.vue
@@ -88,12 +88,12 @@ export default {
   }
 }
 /*滚动条样式*/
-/deep/::-webkit-scrollbar {
+::v-deep ::-webkit-scrollbar {
   width: 4px;
   border-radius: 4px;
   height: 4px;
 }
-/deep/::-webkit-scrollbar-thumb {
+::v-deep ::-webkit-scrollbar-thumb {
   background: #dddddd !important;
   border-radius: 10px;
 }
diff --git a/data-room-ui/packages/Decorations/Decoration3/index.vue b/data-room-ui/packages/Decorations/Decoration3/index.vue
index 07d4281d..94e934c1 100644
--- a/data-room-ui/packages/Decorations/Decoration3/index.vue
+++ b/data-room-ui/packages/Decorations/Decoration3/index.vue
@@ -86,12 +86,12 @@ export default {
   }
 }
 /*滚动条样式*/
-/deep/::-webkit-scrollbar {
+::v-deep ::-webkit-scrollbar {
   width: 4px;
   border-radius: 4px;
   height: 4px;
 }
-/deep/::-webkit-scrollbar-thumb {
+::v-deep ::-webkit-scrollbar-thumb {
   background: #dddddd !important;
   border-radius: 10px;
 }
diff --git a/data-room-ui/packages/Decorations/Decoration4/index.vue b/data-room-ui/packages/Decorations/Decoration4/index.vue
index 60d63389..72749386 100644
--- a/data-room-ui/packages/Decorations/Decoration4/index.vue
+++ b/data-room-ui/packages/Decorations/Decoration4/index.vue
@@ -88,12 +88,12 @@ export default {
   }
 }
 /*滚动条样式*/
-/deep/::-webkit-scrollbar {
+::v-deep ::-webkit-scrollbar {
   width: 4px;
   border-radius: 4px;
   height: 4px;
 }
-/deep/::-webkit-scrollbar-thumb {
+::v-deep ::-webkit-scrollbar-thumb {
   background: #dddddd !important;
   border-radius: 10px;
 }
diff --git a/data-room-ui/packages/Decorations/Decoration4Reverse/index.vue b/data-room-ui/packages/Decorations/Decoration4Reverse/index.vue
index 91fc8090..4a32f9c9 100644
--- a/data-room-ui/packages/Decorations/Decoration4Reverse/index.vue
+++ b/data-room-ui/packages/Decorations/Decoration4Reverse/index.vue
@@ -88,12 +88,12 @@ export default {
   }
 }
 /*滚动条样式*/
-/deep/::-webkit-scrollbar {
+::v-deep ::-webkit-scrollbar {
   width: 4px;
   border-radius: 4px;
   height: 4px;
 }
-/deep/::-webkit-scrollbar-thumb {
+::v-deep ::-webkit-scrollbar-thumb {
   background: #dddddd !important;
   border-radius: 10px;
 }
diff --git a/data-room-ui/packages/Decorations/Decoration5/index.vue b/data-room-ui/packages/Decorations/Decoration5/index.vue
index 28641647..51fff37c 100644
--- a/data-room-ui/packages/Decorations/Decoration5/index.vue
+++ b/data-room-ui/packages/Decorations/Decoration5/index.vue
@@ -87,12 +87,12 @@ export default {
   }
 }
 /*滚动条样式*/
-/deep/::-webkit-scrollbar {
+::v-deep ::-webkit-scrollbar {
   width: 4px;
   border-radius: 4px;
   height: 4px;
 }
-/deep/::-webkit-scrollbar-thumb {
+::v-deep ::-webkit-scrollbar-thumb {
   background: #dddddd !important;
   border-radius: 10px;
 }
diff --git a/data-room-ui/packages/Decorations/Decoration6/index.vue b/data-room-ui/packages/Decorations/Decoration6/index.vue
index 669712e8..3e41d9b4 100644
--- a/data-room-ui/packages/Decorations/Decoration6/index.vue
+++ b/data-room-ui/packages/Decorations/Decoration6/index.vue
@@ -86,12 +86,12 @@ export default {
   }
 }
 /*滚动条样式*/
-/deep/::-webkit-scrollbar {
+::v-deep ::-webkit-scrollbar {
   width: 4px;
   border-radius: 4px;
   height: 4px;
 }
-/deep/::-webkit-scrollbar-thumb {
+::v-deep ::-webkit-scrollbar-thumb {
   background: #dddddd !important;
   border-radius: 10px;
 }
diff --git a/data-room-ui/packages/Decorations/Decoration8/index.vue b/data-room-ui/packages/Decorations/Decoration8/index.vue
index b5fc8f77..be9bda23 100644
--- a/data-room-ui/packages/Decorations/Decoration8/index.vue
+++ b/data-room-ui/packages/Decorations/Decoration8/index.vue
@@ -86,12 +86,12 @@ export default {
   }
 }
 /*滚动条样式*/
-/deep/::-webkit-scrollbar {
+::v-deep ::-webkit-scrollbar {
   width: 4px;
   border-radius: 4px;
   height: 4px;
 }
-/deep/::-webkit-scrollbar-thumb {
+::v-deep ::-webkit-scrollbar-thumb {
   background: #dddddd !important;
   border-radius: 10px;
 }
diff --git a/data-room-ui/packages/Decorations/Decoration8Reverse/index.vue b/data-room-ui/packages/Decorations/Decoration8Reverse/index.vue
index 8e204796..fdcf88cf 100644
--- a/data-room-ui/packages/Decorations/Decoration8Reverse/index.vue
+++ b/data-room-ui/packages/Decorations/Decoration8Reverse/index.vue
@@ -87,12 +87,12 @@ export default {
   }
 }
 /*滚动条样式*/
-/deep/::-webkit-scrollbar {
+::v-deep ::-webkit-scrollbar {
   width: 4px;
   border-radius: 4px;
   height: 4px;
 }
-/deep/::-webkit-scrollbar-thumb {
+::v-deep ::-webkit-scrollbar-thumb {
   background: #dddddd !important;
   border-radius: 10px;
 }
diff --git a/data-room-ui/packages/Decorations/Decoration9/index.vue b/data-room-ui/packages/Decorations/Decoration9/index.vue
index b555dd34..1fa7b6e8 100644
--- a/data-room-ui/packages/Decorations/Decoration9/index.vue
+++ b/data-room-ui/packages/Decorations/Decoration9/index.vue
@@ -96,12 +96,12 @@ export default {
   }
 }
 /*滚动条样式*/
-/deep/::-webkit-scrollbar {
+::v-deep ::-webkit-scrollbar {
   width: 4px;
   border-radius: 4px;
   height: 4px;
 }
-/deep/::-webkit-scrollbar-thumb {
+::v-deep ::-webkit-scrollbar-thumb {
   background: #dddddd !important;
   border-radius: 10px;
 }
diff --git a/data-room-ui/packages/Layout/ApplicationCreateTop/index.vue b/data-room-ui/packages/Layout/ApplicationCreateTop/index.vue
index d9fab621..28ffe7c8 100644
--- a/data-room-ui/packages/Layout/ApplicationCreateTop/index.vue
+++ b/data-room-ui/packages/Layout/ApplicationCreateTop/index.vue
@@ -114,10 +114,10 @@ export default {
       align-items: center;
       justify-content: center;
 
-      /deep/.el-tabs__header {
+      ::v-deep.el-tabs__header {
         margin: 0;
 
-        /deep/.el-tabs__item {
+        ::v-deep.el-tabs__item {
           height: 51px;
           line-height: 51px;
           color: #ffffff;
@@ -127,33 +127,33 @@ export default {
         }
       }
 
-      /deep/.el-tabs__header {
+      ::v-deep.el-tabs__header {
         margin: 0 !important;
       }
 
-      /deep/.el-tabs__item {
+      ::v-deep.el-tabs__item {
         height: 40px !important;
         line-height: 40px !important;
         padding:0 10px!important;
         box-sizing: border-box;
       }
 
-      /deep/.el-tabs__active-bar {
+      ::v-deep.el-tabs__active-bar {
         width: 0 !important;
       }
 
-      /deep/.el-tabs__item.is-active {
+      ::v-deep.el-tabs__item.is-active {
         color: #ffffff !important;
         background-color: hsla(0, 0%, 100%, 0.1) !important;
       }
 
-      /deep/.el-tabs__item:hover {
+      ::v-deep.el-tabs__item:hover {
         color: #fff !important;
         cursor: pointer;
         background-color: hsla(0, 0%, 100%, 0.1) !important;
       }
 
-      /deep/.el-tabs__item {
+      ::v-deep.el-tabs__item {
         color: #fff !important;
       }
     }
@@ -200,7 +200,7 @@ export default {
     padding: 16px;
   }
 
-  /deep/ .el-tabs__nav-wrap::after {
+  ::v-deep .el-tabs__nav-wrap::after {
     width: 0 !important;
   }
 }
diff --git a/data-room-ui/packages/Render/index.vue b/data-room-ui/packages/Render/index.vue
index 6ea0f310..453dd606 100644
--- a/data-room-ui/packages/Render/index.vue
+++ b/data-room-ui/packages/Render/index.vue
@@ -414,7 +414,7 @@ export default {
     cursor: move;
   }
 
-  /deep/ .vdr {
+  ::v-deep .vdr {
     border: none;
   }
   .h-line {
diff --git a/data-room-ui/packages/SourceList/EditForm.vue b/data-room-ui/packages/SourceList/EditForm.vue
index 9ee73cc0..5dbd4c58 100644
--- a/data-room-ui/packages/SourceList/EditForm.vue
+++ b/data-room-ui/packages/SourceList/EditForm.vue
@@ -338,7 +338,7 @@ export default {
   height: 300px;
   overflow-x: hidden;
 
-  /deep/ .el-scrollbar__view {
+  ::v-deep .el-scrollbar__view {
     overflow-x: hidden;
   }
 }
@@ -466,19 +466,19 @@ export default {
     cursor: pointer;
   }
 
-  /deep/.el-radio__label {
+  ::v-deep .el-radio__label {
     display: none;
   }
 }
 
 /*滚动条样式*/
-/deep/::-webkit-scrollbar {
+::v-deep ::-webkit-scrollbar {
   width: 6px;
   border-radius: 4px;
   height: 4px;
 }
 
-/deep/::-webkit-scrollbar-thumb {
+::v-deep ::-webkit-scrollbar-thumb {
   background: #dddddd !important;
   border-radius: 10px;
 }
diff --git a/data-room-ui/packages/SourceList/index.vue b/data-room-ui/packages/SourceList/index.vue
index 7cdd9c2f..29070621 100644
--- a/data-room-ui/packages/SourceList/index.vue
+++ b/data-room-ui/packages/SourceList/index.vue
@@ -350,14 +350,14 @@ export default {
     .el-input {
       width: 200px;
       margin-right: 20px;
-      /deep/.el-input__inner {
+      ::v-deep.el-input__inner {
         background-color: var(--bs-background-1) !important;
       }
     }
 
     .el-select {
       margin-right: 20px;
-      /deep/.el-input__inner {
+      ::v-deep.el-input__inner {
         background-color: var(--bs-background-1) !important;
       }
     }
@@ -375,7 +375,7 @@ export default {
     grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
     grid-gap: 15px;
     padding-bottom: 10px;
-    // /deep/ .el-loading-mask {
+    // ::v-deep .el-loading-mask {
     //   display: flex;
     //   align-items: center;
     //   justify-content: center;
@@ -478,14 +478,14 @@ export default {
             object-fit: cover;
           }
 
-          /deep/.image-slot {
+          ::v-deep.image-slot {
             height: 100%;
             background-color: var(--bs-background-2);
             display: flex;
             align-items: center;
             justify-content: center;
           }
-          /deep/.el-image__error {
+          ::v-deep.el-image__error {
             background-color: #1d1d1d;
           }
         }
diff --git a/data-room-ui/packages/SourceMag/SideMenu.vue b/data-room-ui/packages/SourceMag/SideMenu.vue
index c73ec641..ecb05d6a 100644
--- a/data-room-ui/packages/SourceMag/SideMenu.vue
+++ b/data-room-ui/packages/SourceMag/SideMenu.vue
@@ -368,11 +368,11 @@ export default {
   left: 50%;
   transform: translateX(-40%);
   width: 100px !important;
-  /deep/.el-dropdown-menu__item {
+  ::v-deep.el-dropdown-menu__item {
     text-align: center;
     padding: 5px;
   }
-  /deep/.popper__arrow {
+  ::v-deep.popper__arrow {
     left: 50% !important;
     transform: translateX(-50%) !important;
   }
diff --git a/data-room-ui/packages/assets/style/bsTheme.scss b/data-room-ui/packages/assets/style/bsTheme.scss
index 5c63592d..209221af 100644
--- a/data-room-ui/packages/assets/style/bsTheme.scss
+++ b/data-room-ui/packages/assets/style/bsTheme.scss
@@ -574,11 +574,11 @@
 
 //img
 .bs-el-img {
-  /deep/.el-image__error {
+  ::v-deep .el-image__error {
     background-color: var(--bs-background-1) !important;
   }
 
-  /deep/.close-icon {
+  ::v-deep .close-icon {
     color: var(--bs-el-title);
   }
 }
diff --git a/data-room-ui/packages/assets/style/echartStyle.scss b/data-room-ui/packages/assets/style/echartStyle.scss
index feed4315..54e90225 100644
--- a/data-room-ui/packages/assets/style/echartStyle.scss
+++ b/data-room-ui/packages/assets/style/echartStyle.scss
@@ -38,12 +38,12 @@
   }
 }
 /*滚动条样式*/
-/deep/::-webkit-scrollbar {
+::v-deep ::-webkit-scrollbar {
   width: 4px;
   border-radius: 4px;
   height: 4px;
 }
-/deep/::-webkit-scrollbar-thumb {
+::v-deep ::-webkit-scrollbar-thumb {
   background: #dddddd !important;
   border-radius: 10px;
 }
diff --git a/data-room-ui/packages/assets/style/settingWrap.scss b/data-room-ui/packages/assets/style/settingWrap.scss
index b459db4a..671e61fc 100644
--- a/data-room-ui/packages/assets/style/settingWrap.scss
+++ b/data-room-ui/packages/assets/style/settingWrap.scss
@@ -30,10 +30,10 @@
   position: relative;
   height: 100%;
 
-  /deep/ .el-collapse {
+  ::v-deep .el-collapse {
     border: none !important;
   }
-  /deep/ .el-collapse-item__wrap {
+  ::v-deep .el-collapse-item__wrap {
     border: none !important;
   }
 
@@ -41,7 +41,7 @@
 .table-header{
   border-bottom: 2px solid var(--bs-el-color-primary);
 }
-  /deep/ .el-form-item {
+  ::v-deep .el-form-item {
     margin-bottom: 6px;
   }
   .toolbar{
@@ -60,34 +60,34 @@
       margin-right: 10px;
     }
   }
-  /deep/.CodeMirror{
+  ::v-deep .CodeMirror{
     height: 150px!important;
   }
- /deep/.CodeMirror-scroll{
+ ::v-deep .CodeMirror-scroll{
     height: 150px!important;
   }
 }
-/deep/ .el-tabs__nav-scroll {
+::v-deep .el-tabs__nav-scroll {
   display: flex;
   justify-content: center;
 }
 
-/deep/ .el-tabs__nav-wrap::after {
+::v-deep .el-tabs__nav-wrap::after {
   height: 0;
 }
 
-/deep/ .el-collapse-item__header {
+::v-deep .el-collapse-item__header {
   background: var(--bs-background-2);
   height: 32px;
   padding: 0 12px;
   border:none
 }
 
-/deep/ .el-collapse-item__content {
+::v-deep .el-collapse-item__content {
   padding-bottom: 0
 }
 
-/deep/ .lc-field-title {
+::v-deep .lc-field-title {
   color: var(--bs-el-title);
 }
 
@@ -106,27 +106,27 @@
   padding: 12px;
 }
 
-/deep/ .select-item {
+::v-deep .select-item {
   border: none;
   color: var(--bs-el-title);
 }
 
-/deep/ .el-tabs__nav-scroll {
+::v-deep .el-tabs__nav-scroll {
   display: flex;
   justify-content: center;
 }
 
-/deep/ .el-tabs__nav-wrap::after {
+::v-deep .el-tabs__nav-wrap::after {
   height: 0;
 }
 
   .design-tab-warp{
     padding: 10px;
   }
-/deep/.el-tabs--top{
+::v-deep.el-tabs--top{
   height: 100%;
 }
-/deep/ .el-tabs__content {
+::v-deep .el-tabs__content {
   height: calc(100% - 40px);
   overflow-y: auto;
 
@@ -147,11 +147,11 @@
     }
   }
 }
-/deep/ .el-tabs__header {
+::v-deep .el-tabs__header {
   margin: 0;
 }
 
-/deep/ .el-form-item__label {
+::v-deep .el-form-item__label {
   font-size: 12px;
 }
 
@@ -191,12 +191,12 @@
   }
 }
 /*滚动条样式*/
-/deep/::-webkit-scrollbar {
+::v-deep ::-webkit-scrollbar {
   width: 6px;
   border-radius: 3px;
   height: 6px;
 }
-/deep/::-webkit-scrollbar-thumb {
+::v-deep ::-webkit-scrollbar-thumb {
   background: #dddddd !important;
   border-radius: 10px;
 }
@@ -212,31 +212,31 @@
     margin-left: 4px;
   }
 }
-/deep/ .el-form-item__label,
-/deep/ .el-tabs__item,
-/deep/ .el-collapse-item__arrow
+::v-deep .el-form-item__label,
+::v-deep .el-tabs__item,
+::v-deep .el-collapse-item__arrow
 {
   color: var(--bs-el-title) !important
 }
-/deep/ .el-collapse-item__wrap {
+::v-deep .el-collapse-item__wrap {
   background: var(--bs-background-1);
   color: var(--bs-el-title);
 }
 
 
-/deep/ .el-input__inner,
-/deep/ .el-color-picker__color-inner,
-/deep/ .el-radio__inner,
-/deep/ .el-input-number--mini,
-/deep/ .el-textarea__inner,
-/deep/ .el-input-group__append
+::v-deep .el-input__inner,
+::v-deep .el-color-picker__color-inner,
+::v-deep .el-radio__inner,
+::v-deep .el-input-number--mini,
+::v-deep .el-textarea__inner,
+::v-deep .el-input-group__append
 {
   background: var(--bs-el-background-1);
   color: var(--bs-el-text);
   border: 0 !important;
 }
 
-/deep/ .el-radio__label
+::v-deep .el-radio__label
 {
   font-size: 12px;
   background: var(--bs-el-background-1-1);
@@ -246,16 +246,16 @@
 
 
 
-/deep/ .el-radio {
+::v-deep .el-radio {
   margin-right: 10px
 }
 
-/deep/ .el-table {
+::v-deep .el-table {
   background: var(--bs-el-background-1);
   border-bottom: 1px solid var(--bs-el-title);
 }
 
-/deep/ .el-table__cell {
+::v-deep .el-table__cell {
   background: var(--bs-el-background-1) !important;
   color: var(--bs-el-title) !important;
   border-color: var(--bs-el-text) !important;