From 56e91a03643c416d83f14cbdf031cb9aa1b536ce Mon Sep 17 00:00:00 2001
From: 陈鑫涛 <10125295+chen-xintao97@user.noreply.gitee.com>
Date: Thu, 18 Sep 2025 17:43:06 +0800
Subject: [PATCH] Revert "Revert "Revert "修复packjson"""

---
 package.json                                                              |  8 ++++----
 src/assets/styles/screen.scss                                             | 12 ++++++------
 src/assets/styles/screenDesigner.scss                                     |  2 +-
 src/components/AnjiPlus/anji-crud/anji-crud.vue                           | 73 ++++++++++++++++++-------------------------------------------------------
 src/components/AnjiPlus/anji-crud/edit.vue                                |  4 ++--
 src/components/AnjiPlus/anji-dialog.vue                                   |  6 +++---
 src/components/AnjiPlus/anji-input.vue                                    |  4 ++--
 src/components/AnjiPlus/anji-upload.vue                                   |  2 +-
 src/components/eachForm.vue                                               |  6 +++---
 src/views/accessRole/components/RoleAuthority.vue                         |  2 +-
 src/views/bigscreenDesigner/designer/components/colorPicker.vue           |  4 ++--
 src/views/bigscreenDesigner/designer/components/customColorComponents.vue | 29 +++++++++++------------------
 src/views/bigscreenDesigner/designer/components/customUpload.vue          |  4 ++--
 src/views/bigscreenDesigner/designer/components/customUploadMulti.vue     | 12 ++++++------
 src/views/bigscreenDesigner/designer/components/customUploadNew.vue       | 18 +++++++-----------
 src/views/bigscreenDesigner/designer/components/dynamicAddPicAdress.vue   | 46 +++++++++++++++++-----------------------------
 src/views/bigscreenDesigner/designer/components/dynamicAddRadar.vue       | 46 +++++++++++++++++-----------------------------
 src/views/bigscreenDesigner/designer/components/dynamicAddSvg.vue         | 46 +++++++++++++++++-----------------------------
 src/views/bigscreenDesigner/designer/components/dynamicAddTable.vue       | 38 +++++++++++++++++---------------------
 src/views/bigscreenDesigner/designer/components/dynamicForm.vue           | 16 +++++-----------
 src/views/bigscreenDesigner/designer/components/dynamicHtmlSlider.vue     | 33 ++++++++++++++-------------------
 src/views/bigscreenDesigner/designer/widget/div/widgetSlider.vue          |  2 +-
 src/views/bigscreenDesigner/designer/widget/percent/widgetProgress.vue    | 14 +++++++-------
 src/views/excelreport/components/colorPicker.vue                          |  4 ++--
 src/views/resultset/components/EditDataSet.vue                            |  6 +++---
 src/views/resultset/components/MonacoEditor.vue                           |  2 +-
 src/views/resultset/index.vue                                             |  2 +-
 src/views/screenDesigner/components/colorPicker.vue                       |  4 ++--
 src/views/screenDesigner/components/customColorComponents.vue             | 28 +++++++++++-----------------
 src/views/screenDesigner/components/customUpload.vue                      |  4 ++--
 src/views/screenDesigner/components/dynamicAddTable.vue                   | 32 ++++++++++++++------------------
 src/views/screenDesigner/components/dynamicForm.vue                       | 16 +++++-----------
 src/views/screenDesigner/layout/leftMenu.vue                              | 18 ++++--------------
 33 files changed, 209 insertions(+), 334 deletions(-)

diff --git a/package.json b/package.json
index 988bfb8..f748e09 100644
--- a/package.json
+++ b/package.json
@@ -28,7 +28,7 @@
     "loading-view-vue": "^1.0.3",
     "miment": "^0.0.9",
     "moment": "^2.29.1",
-    "monaco-editor": "0.28.1",
+    "monaco-editor": "^0.20.0",
     "normalize.css": "7.0.0",
     "nprogress": "0.2.0",
     "qrcodejs2": "0.0.2",
@@ -66,12 +66,13 @@
     "eventsource-polyfill": "0.9.6",
     "file-loader": "1.1.11",
     "friendly-errors-webpack-plugin": "1.7.0",
-    "html-webpack-plugin": "3.2.0",
+    "html-webpack-plugin": "4.0.0-alpha",
     "iframe-resizer": "^4.3.6",
     "js-md5": "^0.7.3",
     "mini-css-extract-plugin": "0.4.1",
     "monaco-editor-webpack-plugin": "^4.1.1",
     "node-notifier": "5.2.1",
+    "node-sass": "^4.7.2",
     "optimize-css-assets-webpack-plugin": "5.0.0",
     "ora": "3.0.0",
     "path-to-regexp": "2.4.0",
@@ -80,8 +81,7 @@
     "postcss-loader": "2.1.6",
     "postcss-url": "7.3.2",
     "rimraf": "2.6.2",
-    "sass": "^1.77.0",
-    "sass-loader": "^7.3.0",
+    "sass-loader": "7.0.3",
     "script-ext-html-webpack-plugin": "2.0.1",
     "semver": "5.5.0",
     "shelljs": "0.8.2",
diff --git a/src/assets/styles/screen.scss b/src/assets/styles/screen.scss
index 96e13ab..b412dff 100644
--- a/src/assets/styles/screen.scss
+++ b/src/assets/styles/screen.scss
@@ -226,7 +226,7 @@
     height: 100%;
   }
 
-  :deep(el-tabs--border-card) {
+  /deep/ .el-tabs--border-card {
     border: 0;
 
     .el-tabs__header {
@@ -416,11 +416,11 @@ li {
   padding: 5px;
 }
 
-:deep(vue-ruler-h) {
+/deep/ .vue-ruler-h {
   opacity: 0.3;
 }
 
-:deep(vue-ruler-v) {
+/deep/ .vue-ruler-v {
   opacity: 0.3;
 }
 
@@ -440,7 +440,7 @@ li {
       height: calc(100vh - 80px);
       text-align: center;
 
-      :deep(el-tabs__header) {
+      /deep/.el-tabs__header {
         width: 30%;
         margin-right: 0;
 
@@ -459,7 +459,7 @@ li {
         }
       }
 
-      :deep(el-tabs__content) {
+      /deep/.el-tabs__content {
         width: 70%;
       }
     }
@@ -495,7 +495,7 @@ li {
     }
   }
 
-  :deep(el-tabs__content) {
+  /deep/.el-tabs__content {
     padding: 0;
   }
 }
diff --git a/src/assets/styles/screenDesigner.scss b/src/assets/styles/screenDesigner.scss
index 348aef8..75dbd57 100644
--- a/src/assets/styles/screenDesigner.scss
+++ b/src/assets/styles/screenDesigner.scss
@@ -28,7 +28,7 @@
       width: 300px;
     }
 
-    :deep(el-tabs--border-card) {
+    /deep/ .el-tabs--border-card {
       border: 0;
       .el-tabs__header {
         background: transparent;
diff --git a/src/components/AnjiPlus/anji-crud/anji-crud.vue b/src/components/AnjiPlus/anji-crud/anji-crud.vue
index 13ab18e..938372d 100644
--- a/src/components/AnjiPlus/anji-crud/anji-crud.vue
+++ b/src/components/AnjiPlus/anji-crud/anji-crud.vue
@@ -923,7 +923,6 @@ export default {
   display: flex;
   flex: 1;
   flex-direction: column;
-
   .main_part {
     display: flex;
     flex-direction: column;
@@ -936,63 +935,49 @@ export default {
     position: relative;
   }
 }
-
-// 使用 :deep() 替代 /deep/
-:deep(.button) {
+/deep/.button {
   box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.08);
   border-radius: 6px;
 }
-
-:deep(.el-table th > .cell) {
+/deep/.el-table th > .cell {
   text-align: center;
 }
-
-:deep(.el-table .cell) {
+/deep/.el-table .cell {
   text-align: center;
 }
-
-:deep(.elTable) {
+/deep/.elTable {
   margin: 10px 0 50px;
 }
-
 .el-table {
   // 看这里！！！
   // 深度选择器，去除默认的padding
-  :deep(th) {
+  /deep/ th {
     padding: 0;
     height: 36px;
   }
-
-  :deep(td) {
+  /deep/ td {
     padding: 0;
     height: 36px;
   }
 }
-
-:deep(.el-table--striped .el-table__body tr.el-table__row--striped td) {
+/deep/.el-table--striped .el-table__body tr.el-table__row--striped td {
   background: #f9fbfd;
 }
-
 .screenFlex {
   display: flex;
 }
-
 .searchFormFlex {
   flex: 1;
 }
-
 .screenButtons {
   padding-left: 20px;
 }
-
 .style-btn {
   pointer-events: none;
 }
-
 .page-container {
   height: 100%;
   position: relative;
-
   .left-container {
     width: 20%;
     position: absolute;
@@ -1005,7 +990,6 @@ export default {
     overflow-y: auto;
     height: 100%;
   }
-
   .right-container {
     width: calc(80% - 5px);
     position: absolute;
@@ -1017,59 +1001,49 @@ export default {
     height: 100%;
   }
 }
-
 .el-table .cell,
 .el-table td div {
   overflow: hidden;
   text-overflow: ellipsis;
 }
-
 .el-dropdown {
   font-size: 12px;
   display: inline;
   color: #5887fb;
   cursor: pointer;
 }
-
 .el-dropdown-menu--mini .el-dropdown-menu__item {
   min-width: 80px;
   max-width: 110px;
   float: right;
-
   .el-button--text {
     float: right;
   }
-
   &:hover {
     background: none !important;
   }
-
-  :deep(.el-button--text:hover),
-  :deep(.el-button--text:focus) {
+  /deep/.el-button--text:hover,
+  .el-button--text:focus {
     color: #799ffc !important;
     background-color: #ecf5ff !important;
     border-color: transparent;
   }
-
   .el-button--mini {
     float: right;
   }
-
   .el-button--text:hover,
   .el-button--text:focus {
     color: #799ffc;
     border-color: transparent;
   }
-
   .el-button + .el-button {
     margin-left: 0 !important;
     float: right;
   }
 }
-
-:deep(.el-pagination.is-background .btn-prev),
-:deep(.el-pagination.is-background .btn-next),
-:deep(.el-pagination.is-background .el-pager li) {
+/deep/.el-pagination.is-background .btn-prev,
+.el-pagination.is-background .btn-next,
+.el-pagination.is-background .el-pager li {
   margin: 0 5px;
   border-radius: 2px;
   background-color: #f4f4f5;
@@ -1077,19 +1051,16 @@ export default {
   min-width: 30px;
   border-radius: 2px;
 }
-
-:deep(.el-pagination.is-background .el-pager li:not(.disabled).active) {
+/deep/.el-pagination.is-background .el-pager li:not(.disabled).active {
   background-color: #5887fb;
   color: #ffffff;
   border-radius: 4px;
 }
-
 .page_bottom {
   width: 100%;
   position: absolute;
   bottom: 0;
 }
-
 .pagination {
   display: flex;
   flex-direction: row;
@@ -1097,45 +1068,37 @@ export default {
   margin-bottom: 14px;
   margin-right: 20px;
 }
-
-:deep(.el-table .warning-row) {
+.el-table /deep/ .warning-row {
   color: red !important;
 }
-
-:deep(.el-table .bgColor) {
+.el-table /deep/ .bgColor {
   background: #d9ecff;
 }
-
-.edit_button {
+/deep/.edit_button {
   width: 22px;
   height: 22px;
   padding: 0;
   margin: 0;
   margin-right: 5px;
-
-  :deep(i) {
+  /deep/ i {
     font-size: 30px;
   }
 }
-
 .el-form-item--mini.el-form-item {
   margin-bottom: 12px;
 }
-
-:deep(.el-table .success-row) {
+.el-table /deep/ .success-row {
   background: #f9fbfd !important;
 }
 
 .contextMenu {
   width: 100px;
-
   .contextMenuItem {
     width: 100%;
     font-size: 12px;
     line-height: 20px;
     padding: 5px;
   }
-
   &:hover {
     background: #f9fbfd;
   }
diff --git a/src/components/AnjiPlus/anji-crud/edit.vue b/src/components/AnjiPlus/anji-crud/edit.vue
index c4028ec..b334654 100644
--- a/src/components/AnjiPlus/anji-crud/edit.vue
+++ b/src/components/AnjiPlus/anji-crud/edit.vue
@@ -386,7 +386,7 @@ export default {
 
 <style scoped lang="scss">
 .notfull-screen {
-  :deep(el-dialog__body) {
+  /deep/.el-dialog__body {
     background-color: rgb(240, 242, 245);
     padding: 5px;
     max-height: 60vh;
@@ -394,7 +394,7 @@ export default {
   }
 }
 .full-screen {
-  :deep(el-dialog__body) {
+  /deep/.el-dialog__body {
     background-color: rgb(240, 242, 245);
     padding: 5px;
     height: calc(100vh - 110px);
diff --git a/src/components/AnjiPlus/anji-dialog.vue b/src/components/AnjiPlus/anji-dialog.vue
index a4eff3d..bf1fe63 100644
--- a/src/components/AnjiPlus/anji-dialog.vue
+++ b/src/components/AnjiPlus/anji-dialog.vue
@@ -151,7 +151,7 @@ export default {
 
 <style scoped lang="scss">
 .notfull-screen {
-  :deep(el-dialog__body) {
+  /deep/.el-dialog__body {
     background-color: rgb(240, 242, 245);
     padding: 5px;
     max-height: 60vh;
@@ -159,7 +159,7 @@ export default {
   }
 }
 .full-screen {
-  :deep(el-dialog__body) {
+  /deep/.el-dialog__body {
     background-color: rgb(240, 242, 245);
     padding: 5px;
     height: calc(100vh - 110px);
@@ -203,7 +203,7 @@ export default {
 .addForm {
   text-align: center;
 }
-.activeColor :deep(el-form-item__label) {
+.activeColor /deep/.el-form-item__label {
   color: #5887fb;
 }
 </style>
diff --git a/src/components/AnjiPlus/anji-input.vue b/src/components/AnjiPlus/anji-input.vue
index f41fa61..036d86c 100644
--- a/src/components/AnjiPlus/anji-input.vue
+++ b/src/components/AnjiPlus/anji-input.vue
@@ -168,10 +168,10 @@ export default {
 }
 </script>
 <style lang="less" scoped>
-:deep(el-input__suffix) {
+/deep/.el-input__suffix {
   padding: 0 6px;
 }
-.anji-input :deep(el-input__inner ){
+.anji-input /deep/ .el-input__inner {
   padding-right: 0 !important;
 }
 </style>
diff --git a/src/components/AnjiPlus/anji-upload.vue b/src/components/AnjiPlus/anji-upload.vue
index 8b2144a..f07e9a4 100644
--- a/src/components/AnjiPlus/anji-upload.vue
+++ b/src/components/AnjiPlus/anji-upload.vue
@@ -170,7 +170,7 @@ export default {
   width: 60px;
   height: 60px;
 }
-.hide_box :deep(el-upload--picture-card) {
+.hide_box /deep/.el-upload--picture-card {
   display: none;
 }
 .el-upload-list__item {
diff --git a/src/components/eachForm.vue b/src/components/eachForm.vue
index 58177aa..8c915b8 100644
--- a/src/components/eachForm.vue
+++ b/src/components/eachForm.vue
@@ -179,16 +179,16 @@ export default {
 }
 </script>
 <style lang="scss" scoped>
-.elForm :deep(el-upload--picture-card){
+.elForm /deep/ .el-upload--picture-card{
   width: 80px;
   height: 80px;
   line-height: 83px;
 }
-.elForm :deep(el-upload-list__item) {
+.elForm /deep/ .el-upload-list__item {
   width: 80px;
   height: 80px;
 }
-.hide_box :deep(el-upload--picture-card){
+.hide_box /deep/ .el-upload--picture-card{
   display: none;
 }
 </style>
\ No newline at end of file
diff --git a/src/views/accessRole/components/RoleAuthority.vue b/src/views/accessRole/components/RoleAuthority.vue
index ffed9af..8886713 100644
--- a/src/views/accessRole/components/RoleAuthority.vue
+++ b/src/views/accessRole/components/RoleAuthority.vue
@@ -85,7 +85,7 @@ export default {
 };
 </script>
 <style lang="scss" scoped>
-:deep(el-dialog__body) {
+/deep/.el-dialog__body {
   height: 400px;
   overflow-y: scroll;
 }
diff --git a/src/views/bigscreenDesigner/designer/components/colorPicker.vue b/src/views/bigscreenDesigner/designer/components/colorPicker.vue
index 9101c1b..1d2877d 100644
--- a/src/views/bigscreenDesigner/designer/components/colorPicker.vue
+++ b/src/views/bigscreenDesigner/designer/components/colorPicker.vue
@@ -63,8 +63,8 @@ export default {
 };
 </script>
 <style lang="scss" scoped>
-:deep(el-color-picker--mini),
-:deep(el-color-picker--mini) .el-color-picker__trigger {
+/deep/.el-color-picker--mini,
+/deep/.el-color-picker--mini .el-color-picker__trigger {
   width: 23px;
   height: 23px;
 }
diff --git a/src/views/bigscreenDesigner/designer/components/customColorComponents.vue b/src/views/bigscreenDesigner/designer/components/customColorComponents.vue
index 0603d16..4647d2e 100644
--- a/src/views/bigscreenDesigner/designer/components/customColorComponents.vue
+++ b/src/views/bigscreenDesigner/designer/components/customColorComponents.vue
@@ -172,38 +172,31 @@ export default {
     flex-direction: row;
   }
 }
-// 使用 :deep() 替代 /deep/
-:deep(.el-table),
-:deep(.el-table__expanded-cell),
-:deep(.el-table th),
-:deep(.el-table tr) {
+/deep/.el-table,
+/deep/.el-table__expanded-cell,
+/deep/.el-table th,
+/deep/.el-table tr {
   background-color: transparent !important;
   color: #859094 !important;
 }
-
-:deep(.el-table td),
-:deep(.el-table th.is-leaf) {
+/deep/.el-table td,
+/deep/.el-table th.is-leaf {
   border-bottom: none;
   line-height: 26px;
 }
-
-:deep(.el-table tbody tr:hover > td) {
+/deep/.el-table tbody tr:hover > td {
   background-color: #263445 !important;
 }
-
-:deep(.el-table::before) {
+/deep/.el-table::before {
   height: 0;
 }
-
-:deep(.el-color-picker--mini),
-:deep(.el-color-picker--mini .el-color-picker__trigger) {
+/deep/.el-color-picker--mini,
+/deep/.el-color-picker--mini .el-color-picker__trigger {
   width: 23px;
   height: 23px;
 }
-
-:deep(.el-dialog) {
+/deep/.el-dialog {
   background: #1b1e25;
-
   .el-dialog__title {
     color: #fff;
   }
diff --git a/src/views/bigscreenDesigner/designer/components/customUpload.vue b/src/views/bigscreenDesigner/designer/components/customUpload.vue
index 13b5d1b..43c1b76 100644
--- a/src/views/bigscreenDesigner/designer/components/customUpload.vue
+++ b/src/views/bigscreenDesigner/designer/components/customUpload.vue
@@ -90,8 +90,8 @@ export default {
   top: 0;
   opacity: 0;
 }
-:deep(el-input-group__append),
-:deep(el-input-group__prepend) {
+/deep/.el-input-group__append,
+/deep/.el-input-group__prepend {
   padding: 0 10px !important;
   overflow: hidden;
 }
diff --git a/src/views/bigscreenDesigner/designer/components/customUploadMulti.vue b/src/views/bigscreenDesigner/designer/components/customUploadMulti.vue
index 9622bc1..014e565 100644
--- a/src/views/bigscreenDesigner/designer/components/customUploadMulti.vue
+++ b/src/views/bigscreenDesigner/designer/components/customUploadMulti.vue
@@ -142,8 +142,8 @@ export default {
   display: none;
 }
 
-:deep(el-input-group__append),
-:deep(el-input-group__prepend) {
+/deep/.el-input-group__append,
+/deep/.el-input-group__prepend {
   padding: 0 10px !important;
   overflow: hidden;
 }
@@ -154,9 +154,9 @@ export default {
 }
 
 
-:deep(.el-dialog .el-dialog__header),
-:deep(.el-dialog__body),
-:deep(.el-dialog__footer) {
+/deep/ .el-dialog .el-dialog__header,
+/deep/ .el-dialog__body,
+/deep/.el-dialog__footer {
   background: #1b1e25;
 }
 
@@ -189,7 +189,7 @@ export default {
     padding: 0 0.5px 0 0.5px;
     min-height: 90px;
 
-    :deep(el-image__error) {
+    /deep/ .el-image__error {
       width: 100%;
       height: 100%;
       min-height: 90px;
diff --git a/src/views/bigscreenDesigner/designer/components/customUploadNew.vue b/src/views/bigscreenDesigner/designer/components/customUploadNew.vue
index cc4c8e7..ceb6c37 100644
--- a/src/views/bigscreenDesigner/designer/components/customUploadNew.vue
+++ b/src/views/bigscreenDesigner/designer/components/customUploadNew.vue
@@ -115,9 +115,8 @@ export default {
   display: none;
 }
 
-// 修复输入框前后缀样式
-:deep(.el-input-group__append),
-:deep(.el-input-group__prepend) {
+/deep/.el-input-group__append,
+/deep/.el-input-group__prepend {
   padding: 0 10px !important;
   overflow: hidden;
 }
@@ -127,13 +126,10 @@ export default {
   font-size: 12px;
 }
 
-// 修复 el-dialog 的背景色
-:deep(.el-dialog) {
-  .el-dialog__header,
-  .el-dialog__body {
-    background: #1b1e25;
-    color: #fff; // 可选：确保文字可见
-  }
+
+/deep/ .el-dialog .el-dialog__header,
+/deep/ .el-dialog__body {
+  background: #1b1e25;
 }
 
 .image-list {
@@ -165,7 +161,7 @@ export default {
     padding: 0 0.5px 0 0.5px;
     min-height: 90px;
 
-    :deep(el-image__error) {
+    /deep/ .el-image__error {
       width: 100%;
       height: 100%;
       min-height: 90px;
diff --git a/src/views/bigscreenDesigner/designer/components/dynamicAddPicAdress.vue b/src/views/bigscreenDesigner/designer/components/dynamicAddPicAdress.vue
index 1c937a0..73243a7 100644
--- a/src/views/bigscreenDesigner/designer/components/dynamicAddPicAdress.vue
+++ b/src/views/bigscreenDesigner/designer/components/dynamicAddPicAdress.vue
@@ -137,52 +137,40 @@ export default {
 };
 </script>
 <style lang="scss" scoped>
-// 滚动条样式 - 轨道（透明背景）
-:deep(::-webkit-scrollbar-track-piece) {
+/deep/::-webkit-scrollbar-track-piece {
   background-color: transparent;
 }
-
-// 滚动条整体（宽度/高度）
-:deep(.el-table__body-wrapper::-webkit-scrollbar) {
-  width: 0;  // 横向滚动条宽度
-  height: 8px; // 纵向滚动条高度（必须设置）
+/deep/ .el-table__body-wrapper::-webkit-scrollbar {
+  width: 0; // 横向滚动条
+  height: 8px; // 纵向滚动条 必写
 }
-
-// 滚动条滑块
-:deep(.el-table__body-wrapper::-webkit-scrollbar-thumb) {
+// 滚动条的滑块
+/deep/ .el-table__body-wrapper::-webkit-scrollbar-thumb {
   border-radius: 5px;
   background-color: rgba(144, 146, 152, 0.3);
 }
-
-// 表格整体样式：背景、文字颜色、字体大小
-:deep(.el-table),
-:deep(.el-table__expanded-cell),
-:deep(.el-table th),
-:deep(.el-table tr) {
+/deep/.el-table,
+/deep/.el-table__expanded-cell,
+/deep/.el-table th,
+/deep/.el-table tr {
   background-color: transparent !important;
   color: #859094 !important;
   font-size: 12px !important;
 }
-
-// 表格单元格：去除下边框，调整行高
-:deep(.el-table td),
-:deep(.el-table th.is-leaf) {
+/deep/.el-table td,
+/deep/.el-table th.is-leaf {
   border-bottom: none;
   line-height: 26px;
 }
-
-// 表格行 hover 效果
-:deep(.el-table tbody tr:hover),
-:deep(.el-table tbody tr:hover > td) {
+/deep/.el-table tbody tr:hover {
   background-color: #263445 !important;
 }
-
-// 去除 el-table 底部默认的横线（伪元素）
-:deep(.el-table::before) {
+/deep/.el-table tbody tr:hover > td {
+  background-color: #263445 !important;
+}
+/deep/.el-table::before {
   height: 0;
 }
-
-// 按钮组内按钮内边距
 .button-group .el-button {
   padding: 0;
 }
diff --git a/src/views/bigscreenDesigner/designer/components/dynamicAddRadar.vue b/src/views/bigscreenDesigner/designer/components/dynamicAddRadar.vue
index 1d9b09d..168dca4 100644
--- a/src/views/bigscreenDesigner/designer/components/dynamicAddRadar.vue
+++ b/src/views/bigscreenDesigner/designer/components/dynamicAddRadar.vue
@@ -138,52 +138,40 @@ export default {
 };
 </script>
 <style lang="scss" scoped>
-// 滚动条轨道背景（透明）
-:deep(::-webkit-scrollbar-track-piece) {
+/deep/::-webkit-scrollbar-track-piece {
   background-color: transparent;
 }
-
-// 表格滚动条：隐藏横向，设置纵向高度
-:deep(.el-table__body-wrapper::-webkit-scrollbar) {
-  width: 0;    // 隐藏横向滚动条
-  height: 8px; // 纵向滚动条高度（必须设置才显示）
+/deep/ .el-table__body-wrapper::-webkit-scrollbar {
+  width: 0; // 横向滚动条
+  height: 8px; // 纵向滚动条 必写
 }
-
-// 滚动条滑块样式
-:deep(.el-table__body-wrapper::-webkit-scrollbar-thumb) {
+// 滚动条的滑块
+/deep/ .el-table__body-wrapper::-webkit-scrollbar-thumb {
   border-radius: 5px;
   background-color: rgba(144, 146, 152, 0.3);
 }
-
-// 表格整体样式：背景、文字颜色、字体大小
-:deep(.el-table),
-:deep(.el-table__expanded-cell),
-:deep(.el-table th),
-:deep(.el-table tr) {
+/deep/.el-table,
+/deep/.el-table__expanded-cell,
+/deep/.el-table th,
+/deep/.el-table tr {
   background-color: transparent !important;
   color: #859094 !important;
   font-size: 12px !important;
 }
-
-// 表格单元格：去除下边框，调整行高
-:deep(.el-table td),
-:deep(.el-table th.is-leaf) {
+/deep/.el-table td,
+/deep/.el-table th.is-leaf {
   border-bottom: none;
   line-height: 26px;
 }
-
-// 表格行 hover 背景色
-:deep(.el-table tbody tr:hover),
-:deep(.el-table tbody tr:hover > td) {
+/deep/.el-table tbody tr:hover {
   background-color: #263445 !important;
 }
-
-// 去除 el-table 底部默认的横线（伪元素）
-:deep(.el-table::before) {
+/deep/.el-table tbody tr:hover > td {
+  background-color: #263445 !important;
+}
+/deep/.el-table::before {
   height: 0;
 }
-
-// 按钮组内按钮内边距
 .button-group .el-button {
   padding: 0;
 }
diff --git a/src/views/bigscreenDesigner/designer/components/dynamicAddSvg.vue b/src/views/bigscreenDesigner/designer/components/dynamicAddSvg.vue
index 7742127..77b0964 100644
--- a/src/views/bigscreenDesigner/designer/components/dynamicAddSvg.vue
+++ b/src/views/bigscreenDesigner/designer/components/dynamicAddSvg.vue
@@ -137,52 +137,40 @@ export default {
 };
 </script>
 <style lang="scss" scoped>
-// 滚动条轨道背景（透明）
-:deep(::-webkit-scrollbar-track-piece) {
+/deep/::-webkit-scrollbar-track-piece {
   background-color: transparent;
 }
-
-// 表格滚动条：隐藏横向，设置纵向高度
-:deep(.el-table__body-wrapper::-webkit-scrollbar) {
-  width: 0;    // 隐藏横向滚动条
-  height: 8px; // 纵向滚动条高度（必须设置才显示）
+/deep/ .el-table__body-wrapper::-webkit-scrollbar {
+  width: 0; // 横向滚动条
+  height: 8px; // 纵向滚动条 必写
 }
-
-// 滚动条滑块样式
-:deep(.el-table__body-wrapper::-webkit-scrollbar-thumb) {
+// 滚动条的滑块
+/deep/ .el-table__body-wrapper::-webkit-scrollbar-thumb {
   border-radius: 5px;
   background-color: rgba(144, 146, 152, 0.3);
 }
-
-// 表格整体样式：背景、文字颜色、字体大小
-:deep(.el-table),
-:deep(.el-table__expanded-cell),
-:deep(.el-table th),
-:deep(.el-table tr) {
+/deep/.el-table,
+/deep/.el-table__expanded-cell,
+/deep/.el-table th,
+/deep/.el-table tr {
   background-color: transparent !important;
   color: #859094 !important;
   font-size: 12px !important;
 }
-
-// 表格单元格：去除下边框，调整行高
-:deep(.el-table td),
-:deep(.el-table th.is-leaf) {
+/deep/.el-table td,
+/deep/.el-table th.is-leaf {
   border-bottom: none;
   line-height: 26px;
 }
-
-// 表格行 hover 背景色（合并两条规则）
-:deep(.el-table tbody tr:hover),
-:deep(.el-table tbody tr:hover > td) {
+/deep/.el-table tbody tr:hover {
   background-color: #263445 !important;
 }
-
-// 去除 el-table 底部默认的横线（伪元素）
-:deep(.el-table::before) {
+/deep/.el-table tbody tr:hover > td {
+  background-color: #263445 !important;
+}
+/deep/.el-table::before {
   height: 0;
 }
-
-// 按钮组内按钮内边距
 .button-group .el-button {
   padding: 0;
 }
diff --git a/src/views/bigscreenDesigner/designer/components/dynamicAddTable.vue b/src/views/bigscreenDesigner/designer/components/dynamicAddTable.vue
index 5c03675..94b4a95 100644
--- a/src/views/bigscreenDesigner/designer/components/dynamicAddTable.vue
+++ b/src/views/bigscreenDesigner/designer/components/dynamicAddTable.vue
@@ -181,44 +181,40 @@ export default {
 };
 </script>
 <style lang="scss" scoped>
-:deep(::-webkit-scrollbar-track-piece) {
+/deep/::-webkit-scrollbar-track-piece {
   background-color: transparent;
 }
-
-:deep(.el-table__body-wrapper::-webkit-scrollbar) {
-  width: 0;
-  height: 8px;
+/deep/ .el-table__body-wrapper::-webkit-scrollbar {
+  width: 0; // 横向滚动条
+  height: 8px; // 纵向滚动条 必写
 }
-
-:deep(.el-table__body-wrapper::-webkit-scrollbar-thumb) {
+// 滚动条的滑块
+/deep/ .el-table__body-wrapper::-webkit-scrollbar-thumb {
   border-radius: 5px;
   background-color: rgba(144, 146, 152, 0.3);
 }
-
-:deep(.el-table),
-:deep(.el-table__expanded-cell),
-:deep(.el-table th),
-:deep(.el-table tr) {
+/deep/.el-table,
+/deep/.el-table__expanded-cell,
+/deep/.el-table th,
+/deep/.el-table tr {
   background-color: transparent !important;
   color: #859094 !important;
   font-size: 12px !important;
 }
-
-:deep(.el-table td),
-:deep(.el-table th.is-leaf) {
+/deep/.el-table td,
+/deep/.el-table th.is-leaf {
   border-bottom: none;
   line-height: 26px;
 }
-
-:deep(.el-table tbody tr:hover),
-:deep(.el-table tbody tr:hover > td) {
+/deep/.el-table tbody tr:hover {
   background-color: #263445 !important;
 }
-
-:deep(.el-table::before) {
+/deep/.el-table tbody tr:hover > td {
+  background-color: #263445 !important;
+}
+/deep/.el-table::before {
   height: 0;
 }
-
 .button-group .el-button {
   padding: 0;
 }
diff --git a/src/views/bigscreenDesigner/designer/components/dynamicForm.vue b/src/views/bigscreenDesigner/designer/components/dynamicForm.vue
index 4589e29..f53515e 100644
--- a/src/views/bigscreenDesigner/designer/components/dynamicForm.vue
+++ b/src/views/bigscreenDesigner/designer/components/dynamicForm.vue
@@ -525,26 +525,22 @@ export default {
 </script>
 
 <style scoped lang="scss">
-:deep(.el-form-item) {
+/deep/ .el-form-item {
   margin-bottom: 5px;
 }
-
-:deep(.el-form-item__label) {
+/deep/ .el-form-item__label {
   font-size: 12px;
   color: #fff;
 }
-
 .code-mirror {
   width: 100%;
   height: 100% !important;
 }
-
 .el-collapse {
   border-top: none;
   border-bottom: none;
 }
-
-:deep(.el-collapse-item__header) {
+/deep/.el-collapse-item__header {
   height: 40px;
   line-height: 40px;
   background: transparent;
@@ -553,13 +549,11 @@ export default {
   font-size: 12px;
   border-color: #282e3a;
 }
-
-:deep(.el-collapse-item__wrap) {
+/deep/.el-collapse-item__wrap {
   background: transparent;
   border: none;
 }
-
-:deep(.el-collapse-item__content) {
+/deep/.el-collapse-item__content {
   padding-bottom: 0;
 }
 </style>
diff --git a/src/views/bigscreenDesigner/designer/components/dynamicHtmlSlider.vue b/src/views/bigscreenDesigner/designer/components/dynamicHtmlSlider.vue
index 43f9f05..285f412 100644
--- a/src/views/bigscreenDesigner/designer/components/dynamicHtmlSlider.vue
+++ b/src/views/bigscreenDesigner/designer/components/dynamicHtmlSlider.vue
@@ -150,45 +150,40 @@ export default {
 };
 </script>
 <style lang="scss" scoped>
-:deep(::-webkit-scrollbar-track-piece) {
+/deep/::-webkit-scrollbar-track-piece {
   background-color: transparent;
 }
-
-:deep(.el-table__body-wrapper::-webkit-scrollbar) {
+/deep/ .el-table__body-wrapper::-webkit-scrollbar {
   width: 0; // 横向滚动条
   height: 8px; // 纵向滚动条 必写
 }
-
 // 滚动条的滑块
-:deep(.el-table__body-wrapper::-webkit-scrollbar-thumb) {
+/deep/ .el-table__body-wrapper::-webkit-scrollbar-thumb {
   border-radius: 5px;
   background-color: rgba(144, 146, 152, 0.3);
 }
-
-:deep(.el-table),
-:deep(.el-table__expanded-cell),
-:deep(.el-table th),
-:deep(.el-table tr) {
+/deep/.el-table,
+/deep/.el-table__expanded-cell,
+/deep/.el-table th,
+/deep/.el-table tr {
   background-color: transparent !important;
   color: #859094 !important;
   font-size: 12px !important;
 }
-
-:deep(.el-table td),
-:deep(.el-table th.is-leaf) {
+/deep/.el-table td,
+/deep/.el-table th.is-leaf {
   border-bottom: none;
   line-height: 26px;
 }
-
-:deep(.el-table tbody tr:hover),
-:deep(.el-table tbody tr:hover > td) {
+/deep/.el-table tbody tr:hover {
   background-color: #263445 !important;
 }
-
-:deep(.el-table::before) {
+/deep/.el-table tbody tr:hover > td {
+  background-color: #263445 !important;
+}
+/deep/.el-table::before {
   height: 0;
 }
-
 .button-group .el-button {
   padding: 0;
 }
diff --git a/src/views/bigscreenDesigner/designer/widget/div/widgetSlider.vue b/src/views/bigscreenDesigner/designer/widget/div/widgetSlider.vue
index 3fff4a9..9ac3356 100644
--- a/src/views/bigscreenDesigner/designer/widget/div/widgetSlider.vue
+++ b/src/views/bigscreenDesigner/designer/widget/div/widgetSlider.vue
@@ -86,7 +86,7 @@ export default {
   object-fit: contain;
 }
 
-:deep(el-carousel__mask) {
+/deep/ .el-carousel__mask {
   background: transparent;
 }
 </style>
diff --git a/src/views/bigscreenDesigner/designer/widget/percent/widgetProgress.vue b/src/views/bigscreenDesigner/designer/widget/percent/widgetProgress.vue
index 0b8cdb8..66f2180 100644
--- a/src/views/bigscreenDesigner/designer/widget/percent/widgetProgress.vue
+++ b/src/views/bigscreenDesigner/designer/widget/percent/widgetProgress.vue
@@ -160,18 +160,18 @@ export default {
     align-items: center;
     width: 100%;
 
-    :deep(.el-progress-bar__outer) {
+    /deep/ .el-progress-bar__outer {
       background-color: var(--under-color, #EBEEF5);
     }
 
-    :deep(.el-progress-bar__inner) {
-      background: var(--line-gradient, linear-gradient(90deg, #409EFF, #66b1ff));
+    /deep/ .el-progress-bar__inner {
+      background: var(--line-gradient, initial);
     }
 
-    :deep(.el-progress-bar__innerText),
-    :deep(.el-progress__text) {
-      font-size: var(--percent-font-size, 14px) !important;
-      color: var(--percent-color, #333);
+    /deep/ .el-progress-bar__innerText,
+    /deep/ .el-progress__text {
+      font-size: var(--percent-font-size, initial) !important;
+      color: var(--percent-color, initial);
     }
   }
 }
diff --git a/src/views/excelreport/components/colorPicker.vue b/src/views/excelreport/components/colorPicker.vue
index d7878c8..1d2877d 100644
--- a/src/views/excelreport/components/colorPicker.vue
+++ b/src/views/excelreport/components/colorPicker.vue
@@ -63,8 +63,8 @@ export default {
 };
 </script>
 <style lang="scss" scoped>
-:deep(.el-color-picker--mini),
-:deep(.el-color-picker--mini .el-color-picker__trigger) {
+/deep/.el-color-picker--mini,
+/deep/.el-color-picker--mini .el-color-picker__trigger {
   width: 23px;
   height: 23px;
 }
diff --git a/src/views/resultset/components/EditDataSet.vue b/src/views/resultset/components/EditDataSet.vue
index 4da129f..25887cb 100644
--- a/src/views/resultset/components/EditDataSet.vue
+++ b/src/views/resultset/components/EditDataSet.vue
@@ -966,7 +966,7 @@ public class DemoGroovyHandler implements IGroovyHandler {
 </script>
 <style lang="scss" scoped>
 .code-mirror-form {
-  :deep(.el-form-item__content) {
+  /deep/ .el-form-item__content {
     height: 200px;
     overflow: hidden;
   }
@@ -1094,7 +1094,7 @@ public class DemoGroovyHandler implements IGroovyHandler {
   top: 15px;
 }
 
-.filterTextarea :deep(.el-textarea__inner) {
+.filterTextarea /deep/ .el-textarea__inner {
   min-height: 300px !important;
 }
 
@@ -1103,7 +1103,7 @@ public class DemoGroovyHandler implements IGroovyHandler {
   margin-top: 4px;
 }
 
-.filterBox :deep(.el-input--suffix .el-input__inner) {
+.filterBox /deep/ .el-input--suffix .el-input__inner {
   background: #f4f7ff;
   border-radius: 3px;
   border: 1px solid #b8caff;
diff --git a/src/views/resultset/components/MonacoEditor.vue b/src/views/resultset/components/MonacoEditor.vue
index df44d27..8f5325b 100644
--- a/src/views/resultset/components/MonacoEditor.vue
+++ b/src/views/resultset/components/MonacoEditor.vue
@@ -126,7 +126,7 @@ export default {
 </script>
 
 <style scoped>
-.main :deep(.view-lines *) {
+.main /deep/ .view-lines * {
   font-family: Consolas, "Courier New", monospace !important;
 }
 </style>
diff --git a/src/views/resultset/index.vue b/src/views/resultset/index.vue
index 08df2c0..c9b7f0a 100644
--- a/src/views/resultset/index.vue
+++ b/src/views/resultset/index.vue
@@ -308,7 +308,7 @@ export default {
 };
 </script>
 <style lang="scss" scoped>
-:deep(.el-dropdown) {
+/deep/.el-dropdown {
   margin-right: 20px;
 }
 </style>
diff --git a/src/views/screenDesigner/components/colorPicker.vue b/src/views/screenDesigner/components/colorPicker.vue
index d7878c8..1d2877d 100644
--- a/src/views/screenDesigner/components/colorPicker.vue
+++ b/src/views/screenDesigner/components/colorPicker.vue
@@ -63,8 +63,8 @@ export default {
 };
 </script>
 <style lang="scss" scoped>
-:deep(.el-color-picker--mini),
-:deep(.el-color-picker--mini .el-color-picker__trigger) {
+/deep/.el-color-picker--mini,
+/deep/.el-color-picker--mini .el-color-picker__trigger {
   width: 23px;
   height: 23px;
 }
diff --git a/src/views/screenDesigner/components/customColorComponents.vue b/src/views/screenDesigner/components/customColorComponents.vue
index 7f4daa2..da1ad74 100644
--- a/src/views/screenDesigner/components/customColorComponents.vue
+++ b/src/views/screenDesigner/components/customColorComponents.vue
@@ -149,37 +149,31 @@ export default {
     flex-direction: row;
   }
 }
-:deep(.el-table),
-:deep(.el-table__expanded-cell),
-:deep(.el-table th),
-:deep(.el-table tr) {
+/deep/.el-table,
+/deep/.el-table__expanded-cell,
+/deep/.el-table th,
+/deep/.el-table tr {
   background-color: transparent !important;
   color: #859094 !important;
 }
-
-:deep(.el-table td),
-:deep(.el-table th.is-leaf) {
+/deep/.el-table td,
+/deep/.el-table th.is-leaf {
   border-bottom: none;
   line-height: 26px;
 }
-
-:deep(.el-table tbody tr:hover > td) {
+/deep/.el-table tbody tr:hover > td {
   background-color: #263445 !important;
 }
-
-:deep(.el-table::before) {
+/deep/.el-table::before {
   height: 0;
 }
-
-:deep(.el-color-picker--mini),
-:deep(.el-color-picker--mini .el-color-picker__trigger) {
+/deep/.el-color-picker--mini,
+/deep/.el-color-picker--mini .el-color-picker__trigger {
   width: 23px;
   height: 23px;
 }
-
-:deep(.el-dialog) {
+/deep/.el-dialog {
   background: #1b1e25;
-
   .el-dialog__title {
     color: #fff;
   }
diff --git a/src/views/screenDesigner/components/customUpload.vue b/src/views/screenDesigner/components/customUpload.vue
index 84de82c..43c1b76 100644
--- a/src/views/screenDesigner/components/customUpload.vue
+++ b/src/views/screenDesigner/components/customUpload.vue
@@ -90,8 +90,8 @@ export default {
   top: 0;
   opacity: 0;
 }
-:deep(.el-input-group__append),
-:deep(.el-input-group__prepend) {
+/deep/.el-input-group__append,
+/deep/.el-input-group__prepend {
   padding: 0 10px !important;
   overflow: hidden;
 }
diff --git a/src/views/screenDesigner/components/dynamicAddTable.vue b/src/views/screenDesigner/components/dynamicAddTable.vue
index e85de88..56e79a0 100644
--- a/src/views/screenDesigner/components/dynamicAddTable.vue
+++ b/src/views/screenDesigner/components/dynamicAddTable.vue
@@ -152,42 +152,38 @@ export default {
 };
 </script>
 <style lang="scss" scoped>
-:deep(::-webkit-scrollbar-track-piece) {
+/deep/::-webkit-scrollbar-track-piece {
   background-color: transparent;
 }
-
-:deep(.el-table__body-wrapper::-webkit-scrollbar) {
+/deep/ .el-table__body-wrapper::-webkit-scrollbar {
   width: 0; // 横向滚动条
   height: 8px; // 纵向滚动条 必写
 }
-
 // 滚动条的滑块
-:deep(.el-table__body-wrapper::-webkit-scrollbar-thumb) {
+/deep/ .el-table__body-wrapper::-webkit-scrollbar-thumb {
   border-radius: 5px;
   background-color: rgba(144, 146, 152, 0.3);
 }
-
-:deep(.el-table),
-:deep(.el-table__expanded-cell),
-:deep(.el-table th),
-:deep(.el-table tr) {
+/deep/.el-table,
+/deep/.el-table__expanded-cell,
+/deep/.el-table th,
+/deep/.el-table tr {
   background-color: transparent !important;
   color: #859094 !important;
   font-size: 12px !important;
 }
-
-:deep(.el-table td),
-:deep(.el-table th.is-leaf) {
+/deep/.el-table td,
+/deep/.el-table th.is-leaf {
   border-bottom: none;
   line-height: 26px;
 }
-
-:deep(.el-table tbody tr:hover),
-:deep(.el-table tbody tr:hover > td) {
+/deep/.el-table tbody tr:hover {
   background-color: #263445 !important;
 }
-
-:deep(.el-table::before) {
+/deep/.el-table tbody tr:hover > td {
+  background-color: #263445 !important;
+}
+/deep/.el-table::before {
   height: 0;
 }
 .button-group .el-button {
diff --git a/src/views/screenDesigner/components/dynamicForm.vue b/src/views/screenDesigner/components/dynamicForm.vue
index f2aee96..b93963f 100644
--- a/src/views/screenDesigner/components/dynamicForm.vue
+++ b/src/views/screenDesigner/components/dynamicForm.vue
@@ -408,26 +408,22 @@ export default {
 </script>
 
 <style scoped lang="scss">
-:deep(.el-form-item) {
+/deep/ .el-form-item {
   margin-bottom: 5px;
 }
-
-:deep(.el-form-item__label) {
+/deep/ .el-form-item__label {
   font-size: 12px;
   color: #fff;
 }
-
 .code-mirror {
   width: 100%;
   height: 100% !important;
 }
-
 .el-collapse {
   border-top: none;
   border-bottom: none;
 }
-
-:deep(.el-collapse-item__header) {
+/deep/.el-collapse-item__header {
   height: 40px;
   line-height: 40px;
   background: transparent;
@@ -436,13 +432,11 @@ export default {
   font-size: 12px;
   border-color: #282e3a;
 }
-
-:deep(.el-collapse-item__wrap) {
+/deep/.el-collapse-item__wrap {
   background: transparent;
   border: none;
 }
-
-:deep(.el-collapse-item__content) {
+/deep/.el-collapse-item__content {
   padding-bottom: 0;
 }
 </style>
diff --git a/src/views/screenDesigner/layout/leftMenu.vue b/src/views/screenDesigner/layout/leftMenu.vue
index 27a77f5..3f1fbe4 100644
--- a/src/views/screenDesigner/layout/leftMenu.vue
+++ b/src/views/screenDesigner/layout/leftMenu.vue
@@ -74,35 +74,29 @@ export default {
 };
 </script>
 <style lang="scss" scoped>
-:deep(.el-dropdown-menu__item) {
+/deep/.el-dropdown-menu__item {
   max-width: none;
 }
-
 .layout-left {
   width: 200px;
   background: #242a30;
   overflow-x: hidden;
   overflow-y: auto;
-
   .chart-type {
     display: flex;
     flex-direction: row;
     overflow: hidden;
-
     .type-left {
       width: 100%;
       height: calc(100vh - 80px);
       text-align: center;
-
-      :deep(.el-tabs__header) {
+      /deep/.el-tabs__header {
         width: 30%;
         margin-right: 0;
-
         .el-tabs__nav-wrap {
           &::after {
             background: transparent;
           }
-
           .el-tabs__item {
             text-align: center;
             width: 100% !important;
@@ -111,13 +105,11 @@ export default {
           }
         }
       }
-
-      :deep(.el-tabs__content) {
+      /deep/.el-tabs__content {
         width: 70%;
       }
     }
   }
-
   //工具栏一个元素
   .tools-item {
     display: flex;
@@ -142,12 +134,10 @@ export default {
       border: 1px solid #3a4659;
       background: #282a30;
     }
-
     .tools-item-text {
     }
   }
-
-  :deep(.el-tabs__content) {
+  /deep/.el-tabs__content {
     padding: 0;
   }
 }
--
libgit2 0.22.2