Browse Source

v-deep调整

qianming 10 months ago
parent
commit
7a429bef55
32 changed files with 152 additions and 146 deletions
  1. 7 1
      report-ui/build/vue-loader.conf.js
  2. 6 6
      report-ui/src/assets/styles/screen.scss
  3. 1 1
      report-ui/src/assets/styles/screenDesigner.scss
  4. 15 15
      report-ui/src/components/AnjiPlus/anji-crud/anji-crud.vue
  5. 2 2
      report-ui/src/components/AnjiPlus/anji-crud/edit.vue
  6. 3 3
      report-ui/src/components/AnjiPlus/anji-dialog.vue
  7. 2 2
      report-ui/src/components/AnjiPlus/anji-input.vue
  8. 1 1
      report-ui/src/components/AnjiPlus/anji-upload.vue
  9. 1 1
      report-ui/src/components/MonacoEditor/index.vue
  10. 3 3
      report-ui/src/components/eachForm.vue
  11. 1 1
      report-ui/src/views/accessRole/components/RoleAuthority.vue
  12. 2 2
      report-ui/src/views/bigscreenDesigner/designer/components/colorPicker.vue
  13. 9 9
      report-ui/src/views/bigscreenDesigner/designer/components/componentLinkage.vue
  14. 11 11
      report-ui/src/views/bigscreenDesigner/designer/components/customColorComponents.vue
  15. 11 11
      report-ui/src/views/bigscreenDesigner/designer/components/customNameComponents.vue
  16. 2 2
      report-ui/src/views/bigscreenDesigner/designer/components/customUpload.vue
  17. 12 12
      report-ui/src/views/bigscreenDesigner/designer/components/dynamicAddRadar.vue
  18. 12 12
      report-ui/src/views/bigscreenDesigner/designer/components/dynamicAddTable.vue
  19. 5 5
      report-ui/src/views/bigscreenDesigner/designer/components/dynamicForm.vue
  20. 1 1
      report-ui/src/views/bigscreenDesigner/designer/widget/form/widgetFormTime.vue
  21. 1 1
      report-ui/src/views/bigscreenDesigner/designer/widget/form/widgetInput.vue
  22. 1 1
      report-ui/src/views/bigscreenDesigner/designer/widget/form/widgetSelect.vue
  23. 2 2
      report-ui/src/views/excelreport/components/colorPicker.vue
  24. 3 3
      report-ui/src/views/resultset/components/EditDataSet.vue
  25. 1 1
      report-ui/src/views/resultset/components/MonacoEditor.vue
  26. 1 1
      report-ui/src/views/resultset/index.vue
  27. 2 2
      report-ui/src/views/screenDesigner/components/colorPicker.vue
  28. 11 11
      report-ui/src/views/screenDesigner/components/customColorComponents.vue
  29. 2 2
      report-ui/src/views/screenDesigner/components/customUpload.vue
  30. 12 12
      report-ui/src/views/screenDesigner/components/dynamicAddTable.vue
  31. 5 5
      report-ui/src/views/screenDesigner/components/dynamicForm.vue
  32. 4 4
      report-ui/src/views/screenDesigner/layout/leftMenu.vue

+ 7 - 1
report-ui/build/vue-loader.conf.js

@@ -1,5 +1,11 @@
 'use strict'
 
 module.exports = {
-  //You can set the vue-loader configuration by yourself.
+  css: {
+    loaderOptions: {
+      sass: {
+        implementation: require('sass'), // This line must in sass option
+      },
+    },
+  }
 }

+ 6 - 6
report-ui/src/assets/styles/screen.scss

@@ -226,7 +226,7 @@
     height: 100%;
   }
 
-  ::v-deep .el-tabs--border-card {
+  :deep() .el-tabs--border-card {
     border: 0;
 
     .el-tabs__header {
@@ -416,11 +416,11 @@ li {
   padding: 5px;
 }
 
-::v-deep .vue-ruler-h {
+:deep() .vue-ruler-h {
   opacity: 0.3;
 }
 
-::v-deep .vue-ruler-v {
+:deep() .vue-ruler-v {
   opacity: 0.3;
 }
 
@@ -440,7 +440,7 @@ li {
       height: calc(100vh - 80px);
       text-align: center;
 
-      ::v-deep.el-tabs__header {
+      :deep().el-tabs__header {
         width: 30%;
         margin-right: 0;
 
@@ -459,7 +459,7 @@ li {
         }
       }
 
-      ::v-deep.el-tabs__content {
+      :deep().el-tabs__content {
         width: 70%;
       }
     }
@@ -495,7 +495,7 @@ li {
     }
   }
 
-  ::v-deep.el-tabs__content {
+  :deep().el-tabs__content {
     padding: 0;
   }
 }

+ 1 - 1
report-ui/src/assets/styles/screenDesigner.scss

@@ -28,7 +28,7 @@
       width: 300px;
     }
 
-    ::v-deep .el-tabs--border-card {
+    :deep() .el-tabs--border-card {
       border: 0;
       .el-tabs__header {
         background: transparent;

+ 15 - 15
report-ui/src/components/AnjiPlus/anji-crud/anji-crud.vue

@@ -942,32 +942,32 @@ export default {
     position: relative;
   }
 }
-::v-deep.button {
+:deep().button {
   box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.08);
   border-radius: 6px;
 }
-::v-deep.el-table th > .cell {
+:deep().el-table th > .cell {
   text-align: center;
 }
-::v-deep.el-table .cell {
+:deep().el-table .cell {
   text-align: center;
 }
-::v-deep.elTable {
+:deep().elTable {
   margin: 10px 0 50px;
 }
 .el-table {
   // 看这里!!!
   // 深度选择器,去除默认的padding
-  ::v-deep th {
+  :deep() th {
     padding: 0;
     height: 36px;
   }
-  ::v-deep td {
+  :deep() td {
     padding: 0;
     height: 36px;
   }
 }
-::v-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 {
@@ -1029,7 +1029,7 @@ export default {
   &:hover {
     background: none !important;
   }
-  ::v-deep.el-button--text:hover,
+  :deep().el-button--text:hover,
   .el-button--text:focus {
     color: #799ffc !important;
     background-color: #ecf5ff !important;
@@ -1048,7 +1048,7 @@ export default {
     float: right;
   }
 }
-::v-deep.el-pagination.is-background .btn-prev,
+:deep().el-pagination.is-background .btn-prev,
 .el-pagination.is-background .btn-next,
 .el-pagination.is-background .el-pager li {
   margin: 0 5px;
@@ -1058,7 +1058,7 @@ export default {
   min-width: 30px;
   border-radius: 2px;
 }
-::v-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;
@@ -1075,26 +1075,26 @@ export default {
   margin-bottom: 14px;
   margin-right: 20px;
 }
-.el-table ::v-deep .warning-row {
+.el-table :deep() .warning-row {
   color: red !important;
 }
-.el-table ::v-deep .bgColor {
+.el-table :deep() .bgColor {
   background: #d9ecff;
 }
-::v-deep.edit_button {
+:deep().edit_button {
   width: 22px;
   height: 22px;
   padding: 0;
   margin: 0;
   margin-right: 5px;
-  ::v-deep i {
+  :deep() i {
     font-size: 30px;
   }
 }
 .el-form-item--mini.el-form-item {
   margin-bottom: 12px;
 }
-.el-table ::v-deep .success-row {
+.el-table :deep() .success-row {
   background: #f9fbfd !important;
 }
 

+ 2 - 2
report-ui/src/components/AnjiPlus/anji-crud/edit.vue

@@ -393,7 +393,7 @@ export default {
 
 <style scoped lang="scss">
 .notfull-screen {
-  ::v-deep.el-dialog__body {
+  :deep().el-dialog__body {
     background-color: rgb(240, 242, 245);
     padding: 5px;
     max-height: 60vh;
@@ -401,7 +401,7 @@ export default {
   }
 }
 .full-screen {
-  ::v-deep.el-dialog__body {
+  :deep().el-dialog__body {
     background-color: rgb(240, 242, 245);
     padding: 5px;
     height: calc(100vh - 110px);

+ 3 - 3
report-ui/src/components/AnjiPlus/anji-dialog.vue

@@ -158,7 +158,7 @@ export default {
 
 <style scoped lang="scss">
 .notfull-screen {
-  ::v-deep.el-dialog__body {
+  :deep().el-dialog__body {
     background-color: rgb(240, 242, 245);
     padding: 5px;
     max-height: 60vh;
@@ -166,7 +166,7 @@ export default {
   }
 }
 .full-screen {
-  ::v-deep.el-dialog__body {
+  :deep().el-dialog__body {
     background-color: rgb(240, 242, 245);
     padding: 5px;
     height: calc(100vh - 110px);
@@ -210,7 +210,7 @@ export default {
 .addForm {
   text-align: center;
 }
-.activeColor ::v-deep.el-form-item__label {
+.activeColor :deep().el-form-item__label {
   color: #5887fb;
 }
 </style>

+ 2 - 2
report-ui/src/components/AnjiPlus/anji-input.vue

@@ -175,10 +175,10 @@ export default {
 }
 </script>
 <style lang="less" scoped>
-::v-deep.el-input__suffix {
+:deep().el-input__suffix {
   padding: 0 6px;
 }
-.anji-input ::v-deep .el-input__inner {
+.anji-input :deep() .el-input__inner {
   padding-right: 0 !important;
 }
 </style>

+ 1 - 1
report-ui/src/components/AnjiPlus/anji-upload.vue

@@ -177,7 +177,7 @@ export default {
   width: 60px;
   height: 60px;
 }
-.hide_box ::v-deep.el-upload--picture-card {
+.hide_box :deep().el-upload--picture-card {
   display: none;
 }
 .el-upload-list__item {

+ 1 - 1
report-ui/src/components/MonacoEditor/index.vue

@@ -126,7 +126,7 @@ export default {
 </script>
 
 <style scoped>
-.main ::v-deep .view-lines * {
+.main :deep() .view-lines * {
   font-family: Consolas, "Courier New", monospace !important;
 }
 </style>

+ 3 - 3
report-ui/src/components/eachForm.vue

@@ -186,16 +186,16 @@ export default {
 }
 </script>
 <style lang="scss" scoped>
-.elForm ::v-deep .el-upload--picture-card{
+.elForm :deep() .el-upload--picture-card{
   width: 80px;
   height: 80px;
   line-height: 83px;
 }
-.elForm ::v-deep .el-upload-list__item {
+.elForm :deep() .el-upload-list__item {
   width: 80px;
   height: 80px;
 }
-.hide_box ::v-deep .el-upload--picture-card{
+.hide_box :deep() .el-upload--picture-card{
   display: none;
 }
 </style>

+ 1 - 1
report-ui/src/views/accessRole/components/RoleAuthority.vue

@@ -93,7 +93,7 @@ export default {
 };
 </script>
 <style lang="scss" scoped>
-::v-deep.el-dialog__body {
+:deep().el-dialog__body {
   height: 400px;
   overflow-y: scroll;
 }

+ 2 - 2
report-ui/src/views/bigscreenDesigner/designer/components/colorPicker.vue

@@ -70,8 +70,8 @@ export default {
 };
 </script>
 <style lang="scss" scoped>
-::v-deep.el-color-picker--mini,
-::v-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;
 }

+ 9 - 9
report-ui/src/views/bigscreenDesigner/designer/components/componentLinkage.vue

@@ -250,25 +250,25 @@ export default {
     margin-left: 10px;
   }
 
-  ::v-deep.el-table,
-  ::v-deep.el-table__expanded-cell,
-  ::v-deep.el-table th,
-  ::v-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;
   }
-  ::v-deep.el-table td,
-  ::v-deep.el-table th.is-leaf {
+  :deep().el-table td,
+  :deep().el-table th.is-leaf {
     border-bottom: none;
     line-height: 26px;
   }
-  ::v-deep.el-table tbody tr:hover > td {
+  :deep().el-table tbody tr:hover > td {
     background-color: #263445 !important;
   }
-  ::v-deep.el-table::before {
+  :deep().el-table::before {
     height: 0;
   }
-  ::v-deep.el-dialog {
+  :deep().el-dialog {
     background: #1b1e25;
     .el-dialog__title {
       color: #fff;

+ 11 - 11
report-ui/src/views/bigscreenDesigner/designer/components/customColorComponents.vue

@@ -156,30 +156,30 @@ export default {
     flex-direction: row;
   }
 }
-::v-deep.el-table,
-::v-deep.el-table__expanded-cell,
-::v-deep.el-table th,
-::v-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;
 }
-::v-deep.el-table td,
-::v-deep.el-table th.is-leaf {
+:deep().el-table td,
+:deep().el-table th.is-leaf {
   border-bottom: none;
   line-height: 26px;
 }
-::v-deep.el-table tbody tr:hover > td {
+:deep().el-table tbody tr:hover > td {
   background-color: #263445 !important;
 }
-::v-deep.el-table::before {
+:deep().el-table::before {
   height: 0;
 }
-::v-deep.el-color-picker--mini,
-::v-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;
 }
-::v-deep.el-dialog {
+:deep().el-dialog {
   background: #1b1e25;
   .el-dialog__title {
     color: #fff;

+ 11 - 11
report-ui/src/views/bigscreenDesigner/designer/components/customNameComponents.vue

@@ -155,30 +155,30 @@ export default {
     flex-direction: row;
   }
 }
-::v-deep.el-table,
-::v-deep.el-table__expanded-cell,
-::v-deep.el-table th,
-::v-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;
 }
-::v-deep.el-table td,
-::v-deep.el-table th.is-leaf {
+:deep().el-table td,
+:deep().el-table th.is-leaf {
   border-bottom: none;
   line-height: 26px;
 }
-::v-deep.el-table tbody tr:hover > td {
+:deep().el-table tbody tr:hover > td {
   background-color: #263445 !important;
 }
-::v-deep.el-table::before {
+:deep().el-table::before {
   height: 0;
 }
-::v-deep.el-color-picker--mini,
-::v-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;
 }
-::v-deep.el-dialog {
+:deep().el-dialog {
   background: #1b1e25;
   .el-dialog__title {
     color: #fff;

+ 2 - 2
report-ui/src/views/bigscreenDesigner/designer/components/customUpload.vue

@@ -90,8 +90,8 @@ export default {
   top: 0;
   opacity: 0;
 }
-::v-deep.el-input-group__append,
-::v-deep.el-input-group__prepend {
+:deep().el-input-group__append,
+:deep().el-input-group__prepend {
   padding: 0 10px !important;
   overflow: hidden;
 }

+ 12 - 12
report-ui/src/views/bigscreenDesigner/designer/components/dynamicAddRadar.vue

@@ -138,38 +138,38 @@ export default {
 };
 </script>
 <style lang="scss" scoped>
-::v-deep::-webkit-scrollbar-track-piece {
+:deep()::-webkit-scrollbar-track-piece {
   background-color: transparent;
 }
-::v-deep .el-table__body-wrapper::-webkit-scrollbar {
+:deep() .el-table__body-wrapper::-webkit-scrollbar {
   width: 0; // 横向滚动条
   height: 8px; // 纵向滚动条 必写
 }
 // 滚动条的滑块
-::v-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);
 }
-::v-deep.el-table,
-::v-deep.el-table__expanded-cell,
-::v-deep.el-table th,
-::v-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;
 }
-::v-deep.el-table td,
-::v-deep.el-table th.is-leaf {
+:deep().el-table td,
+:deep().el-table th.is-leaf {
   border-bottom: none;
   line-height: 26px;
 }
-::v-deep.el-table tbody tr:hover {
+:deep().el-table tbody tr:hover {
   background-color: #263445 !important;
 }
-::v-deep.el-table tbody tr:hover > td {
+:deep().el-table tbody tr:hover > td {
   background-color: #263445 !important;
 }
-::v-deep.el-table::before {
+:deep().el-table::before {
   height: 0;
 }
 .button-group .el-button {

+ 12 - 12
report-ui/src/views/bigscreenDesigner/designer/components/dynamicAddTable.vue

@@ -138,38 +138,38 @@ export default {
 };
 </script>
 <style lang="scss" scoped>
-::v-deep::-webkit-scrollbar-track-piece {
+:deep()::-webkit-scrollbar-track-piece {
   background-color: transparent;
 }
-::v-deep .el-table__body-wrapper::-webkit-scrollbar {
+:deep() .el-table__body-wrapper::-webkit-scrollbar {
   width: 0; // 横向滚动条
   height: 8px; // 纵向滚动条 必写
 }
 // 滚动条的滑块
-::v-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);
 }
-::v-deep.el-table,
-::v-deep.el-table__expanded-cell,
-::v-deep.el-table th,
-::v-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;
 }
-::v-deep.el-table td,
-::v-deep.el-table th.is-leaf {
+:deep().el-table td,
+:deep().el-table th.is-leaf {
   border-bottom: none;
   line-height: 26px;
 }
-::v-deep.el-table tbody tr:hover {
+:deep().el-table tbody tr:hover {
   background-color: #263445 !important;
 }
-::v-deep.el-table tbody tr:hover > td {
+:deep().el-table tbody tr:hover > td {
   background-color: #263445 !important;
 }
-::v-deep.el-table::before {
+:deep().el-table::before {
   height: 0;
 }
 .button-group .el-button {

+ 5 - 5
report-ui/src/views/bigscreenDesigner/designer/components/dynamicForm.vue

@@ -501,10 +501,10 @@ export default {
 </script>
 
 <style scoped lang="scss">
-::v-deep .el-form-item {
+:deep() .el-form-item {
   margin-bottom: 5px;
 }
-::v-deep .el-form-item__label {
+:deep() .el-form-item__label {
   font-size: 12px;
   color: #fff;
 }
@@ -516,7 +516,7 @@ export default {
   border-top: none;
   border-bottom: none;
 }
-::v-deep.el-collapse-item__header {
+:deep().el-collapse-item__header {
   height: 40px;
   line-height: 40px;
   background: transparent;
@@ -525,11 +525,11 @@ export default {
   font-size: 12px;
   border-color: #282e3a;
 }
-::v-deep.el-collapse-item__wrap {
+:deep().el-collapse-item__wrap {
   background: transparent;
   border: none;
 }
-::v-deep.el-collapse-item__content {
+:deep().el-collapse-item__content {
   padding-bottom: 0;
 }
 </style>

+ 1 - 1
report-ui/src/views/bigscreenDesigner/designer/widget/form/widgetFormTime.vue

@@ -153,7 +153,7 @@ export default {
 };
 </script>
 <style lang="scss" scoped>
-::v-deep .el-select {
+:deep() .el-select {
   height: 100%;
 
   .el-input {

+ 1 - 1
report-ui/src/views/bigscreenDesigner/designer/widget/form/widgetInput.vue

@@ -67,7 +67,7 @@ export default {
 };
 </script>
 <style lang="scss" scoped>
-::v-deep .el-select {
+:deep() .el-select {
   height: 100%;
 
   .el-input {

+ 1 - 1
report-ui/src/views/bigscreenDesigner/designer/widget/form/widgetSelect.vue

@@ -115,7 +115,7 @@ export default {
 };
 </script>
 <style lang="scss" scoped>
-::v-deep .el-select {
+:deep() .el-select {
   height: 100%;
 
   .el-input {

+ 2 - 2
report-ui/src/views/excelreport/components/colorPicker.vue

@@ -70,8 +70,8 @@ export default {
 };
 </script>
 <style lang="scss" scoped>
-::v-deep.el-color-picker--mini,
-::v-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;
 }

+ 3 - 3
report-ui/src/views/resultset/components/EditDataSet.vue

@@ -957,7 +957,7 @@ public class DemoGroovyHandler implements IGroovyHandler {
 </script>
 <style lang="scss" scoped>
 .code-mirror-form {
-  ::v-deep .el-form-item__content {
+  :deep() .el-form-item__content {
     height: 200px;
     overflow: hidden;
   }
@@ -1085,7 +1085,7 @@ public class DemoGroovyHandler implements IGroovyHandler {
   top: 15px;
 }
 
-.filterTextarea ::v-deep .el-textarea__inner {
+.filterTextarea :deep() .el-textarea__inner {
   min-height: 300px !important;
 }
 
@@ -1094,7 +1094,7 @@ public class DemoGroovyHandler implements IGroovyHandler {
   margin-top: 4px;
 }
 
-.filterBox ::v-deep .el-input--suffix .el-input__inner {
+.filterBox :deep() .el-input--suffix .el-input__inner {
   background: #f4f7ff;
   border-radius: 3px;
   border: 1px solid #b8caff;

+ 1 - 1
report-ui/src/views/resultset/components/MonacoEditor.vue

@@ -134,7 +134,7 @@ export default {
 </script>
 
 <style scoped>
-.main ::v-deep .view-lines * {
+.main :deep() .view-lines * {
   font-family: Consolas, "Courier New", monospace !important;
 }
 </style>

+ 1 - 1
report-ui/src/views/resultset/index.vue

@@ -335,7 +335,7 @@ export default {
 };
 </script>
 <style lang="scss" scoped>
-::v-deep.el-dropdown {
+:deep().el-dropdown {
   margin-right: 20px;
 }
 </style>

+ 2 - 2
report-ui/src/views/screenDesigner/components/colorPicker.vue

@@ -63,8 +63,8 @@ export default {
 };
 </script>
 <style lang="scss" scoped>
-::v-deep.el-color-picker--mini,
-::v-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;
 }

+ 11 - 11
report-ui/src/views/screenDesigner/components/customColorComponents.vue

@@ -149,30 +149,30 @@ export default {
     flex-direction: row;
   }
 }
-::v-deep.el-table,
-::v-deep.el-table__expanded-cell,
-::v-deep.el-table th,
-::v-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;
 }
-::v-deep.el-table td,
-::v-deep.el-table th.is-leaf {
+:deep().el-table td,
+:deep().el-table th.is-leaf {
   border-bottom: none;
   line-height: 26px;
 }
-::v-deep.el-table tbody tr:hover > td {
+:deep().el-table tbody tr:hover > td {
   background-color: #263445 !important;
 }
-::v-deep.el-table::before {
+:deep().el-table::before {
   height: 0;
 }
-::v-deep.el-color-picker--mini,
-::v-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;
 }
-::v-deep.el-dialog {
+:deep().el-dialog {
   background: #1b1e25;
   .el-dialog__title {
     color: #fff;

+ 2 - 2
report-ui/src/views/screenDesigner/components/customUpload.vue

@@ -90,8 +90,8 @@ export default {
   top: 0;
   opacity: 0;
 }
-::v-deep.el-input-group__append,
-::v-deep.el-input-group__prepend {
+:deep().el-input-group__append,
+:deep().el-input-group__prepend {
   padding: 0 10px !important;
   overflow: hidden;
 }

+ 12 - 12
report-ui/src/views/screenDesigner/components/dynamicAddTable.vue

@@ -138,38 +138,38 @@ export default {
 };
 </script>
 <style lang="scss" scoped>
-::v-deep::-webkit-scrollbar-track-piece {
+:deep()::-webkit-scrollbar-track-piece {
   background-color: transparent;
 }
-::v-deep .el-table__body-wrapper::-webkit-scrollbar {
+:deep() .el-table__body-wrapper::-webkit-scrollbar {
   width: 0; // 横向滚动条
   height: 8px; // 纵向滚动条 必写
 }
 // 滚动条的滑块
-::v-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);
 }
-::v-deep.el-table,
-::v-deep.el-table__expanded-cell,
-::v-deep.el-table th,
-::v-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;
 }
-::v-deep.el-table td,
-::v-deep.el-table th.is-leaf {
+:deep().el-table td,
+:deep().el-table th.is-leaf {
   border-bottom: none;
   line-height: 26px;
 }
-::v-deep.el-table tbody tr:hover {
+:deep().el-table tbody tr:hover {
   background-color: #263445 !important;
 }
-::v-deep.el-table tbody tr:hover > td {
+:deep().el-table tbody tr:hover > td {
   background-color: #263445 !important;
 }
-::v-deep.el-table::before {
+:deep().el-table::before {
   height: 0;
 }
 .button-group .el-button {

+ 5 - 5
report-ui/src/views/screenDesigner/components/dynamicForm.vue

@@ -408,10 +408,10 @@ export default {
 </script>
 
 <style scoped lang="scss">
-::v-deep .el-form-item {
+:deep() .el-form-item {
   margin-bottom: 5px;
 }
-::v-deep .el-form-item__label {
+:deep() .el-form-item__label {
   font-size: 12px;
   color: #fff;
 }
@@ -423,7 +423,7 @@ export default {
   border-top: none;
   border-bottom: none;
 }
-::v-deep.el-collapse-item__header {
+:deep().el-collapse-item__header {
   height: 40px;
   line-height: 40px;
   background: transparent;
@@ -432,11 +432,11 @@ export default {
   font-size: 12px;
   border-color: #282e3a;
 }
-::v-deep.el-collapse-item__wrap {
+:deep().el-collapse-item__wrap {
   background: transparent;
   border: none;
 }
-::v-deep.el-collapse-item__content {
+:deep().el-collapse-item__content {
   padding-bottom: 0;
 }
 </style>

+ 4 - 4
report-ui/src/views/screenDesigner/layout/leftMenu.vue

@@ -74,7 +74,7 @@ export default {
 };
 </script>
 <style lang="scss" scoped>
-::v-deep.el-dropdown-menu__item {
+:deep().el-dropdown-menu__item {
   max-width: none;
 }
 .layout-left {
@@ -90,7 +90,7 @@ export default {
       width: 100%;
       height: calc(100vh - 80px);
       text-align: center;
-      ::v-deep.el-tabs__header {
+      :deep().el-tabs__header {
         width: 30%;
         margin-right: 0;
         .el-tabs__nav-wrap {
@@ -105,7 +105,7 @@ export default {
           }
         }
       }
-      ::v-deep.el-tabs__content {
+      :deep().el-tabs__content {
         width: 70%;
       }
     }
@@ -137,7 +137,7 @@ export default {
     .tools-item-text {
     }
   }
-  ::v-deep.el-tabs__content {
+  :deep().el-tabs__content {
     padding: 0;
   }
 }