cornerstone版本升级

2026-03-19 15:12:54 +08:00 · 2026-03-19 15:12:54 +08:00 · 75d296405b
parent 07c92c48a4
commit 75d296405b
52 changed files with 5258 additions and 6421 deletions
--- a/package-lock.json
+++ b/package-lock.json
--- a/package.json
+++ b/package.json
@ -15,18 +15,16 @@
  },
  "dependencies": {
    "@aws-sdk/client-s3": "^3.701.0",
-    "@cornerstonejs/adapters": "^2.19.7",
    "@cornerstonejs/calculate-suv": "^1.1.0",
-    "@cornerstonejs/core": "^2.19.7",
-    "@cornerstonejs/dicom-image-loader": "^2.19.7",
-    "@cornerstonejs/tools": "^2.19.7",
+    "@cornerstonejs/core": "^4.19.2",
+    "@cornerstonejs/dicom-image-loader": "^4.19.2",
+    "@cornerstonejs/tools": "^4.19.2",
    "@fingerprintjs/fingerprintjs": "^4.6.2",
    "@icr/polyseg-wasm": "^0.4.0",
    "@microsoft/signalr": "^8.0.7",
    "@riophae/vue-treeselect": "^0.4.0",
    "@vue-office/docx": "^1.6.2",
    "@vue-office/excel": "^1.7.11",
-    "@vue/composition-api": "^1.7.2",
    "ali-oss": "^6.17.1",
    "axios": "^0.18.1",
    "core-js": "^3.8.3",
@ -60,11 +58,10 @@
    "screenfull": "^6.0.2",
    "sortablejs": "^1.15.5",
    "streamsaver": "^2.0.6",
-    "svg-sprite-loader": "^4.1.3",
    "svgo": "^1.2.2",
    "v-viewer": "^1.7.4",
    "vcrontab": "^0.3.5",
-    "vue": "^2.6.14",
+    "vue": "2.7.16",
    "vue-clipboard2": "^0.3.3",
    "vue-contextmenujs": "^1.4.11",
    "vue-count-to": "^1.0.13",
@ -98,9 +95,10 @@
    "path-browserify": "^1.0.1",
    "process": "^0.11.10",
    "sass": "^1.63.2",
-    "sass-loader": "^10.4.1",
+    "sass-loader": "^16.0.7",
+    "svg-sprite-loader": "^6.0.11",
    "terser-webpack-plugin": "^5.3.10",
-    "vue-template-compiler": "^2.6.14",
+    "vue-template-compiler": "2.7.16",
    "webpack": "^5.96.1",
    "webpack-bundle-analyzer": "^4.10.2"
  },
--- a/src/components/TrialsTab/index.vue
+++ b/src/components/TrialsTab/index.vue
@ -74,10 +74,11 @@ export default {
      zzSessionStorage.setItem('lastWorkbench', `${v.path}${query ? '?' : ''}${query}`)
      var firstGoIn = this.trialsRouter.children.find(v => { return v.name === 'TrialsPanel' }).children[0]
      if (this.trialsTab === '/trials/trials-panel') {
-        this.$router.replace({ path: `${firstGoIn.path}${query ? '?' : ''}${query}` })
+        var targetPath = firstGoIn.path
        if (firstGoIn.children && firstGoIn.children.length > 0) {
-          this.$router.replace({ path: `${firstGoIn.children[0].path}${query ? '?' : ''}${query}` })
+          targetPath = firstGoIn.children[0].path
        }
+        this.$router.replace({ path: `${targetPath}${query ? '?' : ''}${query}` })
      }
      // document.cookie = 'TrialId=' + this.$route.query.trialId + ';path=/'
    },
@ -112,10 +113,11 @@ export default {
    this.getTrialList()
    var firstGoIn = this.trialsRouter.children.find(v => { return v.name === 'TrialsPanel' }).children[0]
    if (this.trialsTab === '/trials/trials-panel') {
-      this.$router.replace({ path: `${firstGoIn.path}${query ? '?' : ''}${query}` })
+      var targetPath = firstGoIn.path
      if (firstGoIn.children && firstGoIn.children.length > 0) {
-        this.$router.replace({ path: `${firstGoIn.children[0].path}${query ? '?' : ''}${query}` })
+        targetPath = firstGoIn.children[0].path
      }
+      this.$router.replace({ path: `${targetPath}${query ? '?' : ''}${query}` })
    }
  },
  methods: {
@ -201,15 +203,19 @@ export default {
        if (~url.indexOf('?')) {
          query = url.split('?')[1]
        }
-        this.$router.push({ path: `${v.name}${query ? '?' : ''}${query}` })
-        var trialsPanelList = this.trialsRouter.children.find(v => { return v.name === 'TrialsPanel' }).children
-        var isHasChild = trialsPanelList.find(c => { return c.path === v.name }) && trialsPanelList.find(c => { return c.path === v.name }).children
-        if (trialsPanelList.find(c => { return c.path === v.name }) && trialsPanelList.find(c => { return c.path === v.name }).tabHiddn) {
+        var trialsPanelList = this.trialsRouter.children.find(item => { return item.name === 'TrialsPanel' }).children
+        var currentRoute = trialsPanelList.find(c => { return c.path === v.name })
+
+        if (currentRoute && currentRoute.tabHiddn) {
+          this.$router.push({ path: `${v.name}${query ? '?' : ''}${query}` })
          return
        }
+        var isHasChild = currentRoute && currentRoute.children
        if (isHasChild && isHasChild.length > 0) {
          this.trialsTabChild = isHasChild[0].path
          this.$router.push({ path: `${this.trialsTabChild}${query ? '?' : ''}${query}` })
+        } else {
+          this.$router.push({ path: `${v.name}${query ? '?' : ''}${query}` })
        }
      } catch (e) {
        console.log(e)
--- a/src/components/toggleRole/index.vue
+++ b/src/components/toggleRole/index.vue
@ -116,7 +116,7 @@ export default {
  display: none !important; /* 隐藏原生 radio 输入，但仍然允许交互 */
 }

-::v-deep.el-radio:focus:not(.is-focus):not(:active):not(.is-disabled)
+::v-deep .el-radio:focus:not(.is-focus):not(:active):not(.is-disabled)
  .el-radio__inner {
  box-shadow: none !important;
 }
--- a/src/components/uploadDicomAndNonedicom/index.vue
+++ b/src/components/uploadDicomAndNonedicom/index.vue
@ -86,16 +86,16 @@ export default {
 }
 </script>
 <style lang="scss" scoped>
-::v-deep.el-tabs--left .el-tabs__header.is-left {
+::v-deep .el-tabs--left .el-tabs__header.is-left {
  margin-right: 0;
 }

 .uploadDicomAndNonedicom {
-  ::v-deep.el-tabs--border-card>.el-tabs__header .el-tabs__item {
+  ::v-deep .el-tabs--border-card>.el-tabs__header .el-tabs__item {
    color: #909399;
  }

-  ::v-deep.el-tabs--border-card>.el-tabs__header .el-tabs__item.is-active {
+  ::v-deep .el-tabs--border-card>.el-tabs__header .el-tabs__item.is-active {
    color: #428bca;
    background-color: #fff;
    border-right-color: #dcdfe6;
--- a/src/layout/index.vue
+++ b/src/layout/index.vue
@ -56,8 +56,10 @@ export default {
 </script>

 <style lang="scss" scoped>
-@import "~@/styles/mixin.scss";
-@import "~@/styles/variables.module.scss";
+@use "@/styles/mixin.scss" as *;
+@use "@/styles/variables.module.scss" as *;
+// @import "~@/styles/mixin.scss";
+// @import "~@/styles/variables.module.scss";

 .app-wrapper {
  @include clearfix;
--- a/src/styles/index.scss
+++ b/src/styles/index.scss
@ -1,15 +1,16 @@
-@import "./variables.module.scss";
-@import "./mixin.scss";
-@import "./transition.scss";
-@import "./element-ui.scss";
-@import "./sidebar.scss";
+@use "./variables.module.scss";
+@use "./mixin.scss";
+@use "./transition.scss";
+@use "./element-ui.scss";
+@use "./sidebar.scss";

 body {
  height: 100%;
  -moz-osx-font-smoothing: grayscale;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
-  font-family: "Helvetica Neue", Helvetica, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "微软雅黑", Arial, sans-serif;
+  font-family: "Helvetica Neue", Helvetica, "PingFang SC", "Hiragino Sans GB",
+    "Microsoft YaHei", "微软雅黑", Arial, sans-serif;
  // font-family:"Helvetica Neue", Helvetica, Arial, sans-serif;
  // font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC",
  //   "Hiragino Sans GB", "Microsoft YaHei", "Helvetica Neue", Helvetica, Arial,
@ -205,133 +206,139 @@ body .el-table th.gutter {
 .el-descriptions {
  box-sizing: border-box;
  font-size: 14px;
-  color: #303133
+  color: #303133;
 }

 .el-descriptions__header {
  display: flex;
  justify-content: space-between;
  align-items: center;
-  margin-bottom: 20px
+  margin-bottom: 20px;
 }

 .el-descriptions__title {
  font-size: 16px;
-  font-weight: 700
+  font-weight: 700;
 }

 .el-descriptions__body {
  color: #606266;
-  background-color: #fff
+  background-color: #fff;
 }

 .el-descriptions__body .el-descriptions__table {
  border-collapse: collapse;
  width: 100%;
-  table-layout: fixed
+  table-layout: fixed;
 }

 .el-descriptions__body .el-descriptions__table .el-descriptions-item__cell {
  box-sizing: border-box;
  text-align: left;
  font-weight: 400;
-  line-height: 1.5
+  line-height: 1.5;
 }

-.el-descriptions__body .el-descriptions__table .el-descriptions-item__cell.is-left {
-  text-align: left
+.el-descriptions__body
+  .el-descriptions__table
+  .el-descriptions-item__cell.is-left {
+  text-align: left;
 }

-.el-descriptions__body .el-descriptions__table .el-descriptions-item__cell.is-center {
-  text-align: center
+.el-descriptions__body
+  .el-descriptions__table
+  .el-descriptions-item__cell.is-center {
+  text-align: center;
 }

-.el-descriptions__body .el-descriptions__table .el-descriptions-item__cell.is-right {
-  text-align: right
+.el-descriptions__body
+  .el-descriptions__table
+  .el-descriptions-item__cell.is-right {
+  text-align: right;
 }

 .el-descriptions .is-bordered {
-  table-layout: auto
+  table-layout: auto;
 }

 .el-descriptions .is-bordered .el-descriptions-item__cell {
  border: 1px solid #ebeef5;
-  padding: 12px 10px
+  padding: 12px 10px;
 }

 .el-descriptions :not(.is-bordered) .el-descriptions-item__cell {
-  padding-bottom: 12px
+  padding-bottom: 12px;
 }

 .el-descriptions--medium.is-bordered .el-descriptions-item__cell {
-  padding: 10px
+  padding: 10px;
 }

 .el-descriptions--medium:not(.is-bordered) .el-descriptions-item__cell {
-  padding-bottom: 10px
+  padding-bottom: 10px;
 }

 .el-descriptions--small {
-  font-size: 12px
+  font-size: 12px;
 }

 .el-descriptions--small.is-bordered .el-descriptions-item__cell {
-  padding: 8px 10px
+  padding: 8px 10px;
 }

 .el-descriptions--small:not(.is-bordered) .el-descriptions-item__cell {
-  padding-bottom: 8px
+  padding-bottom: 8px;
 }

 .el-descriptions--mini {
-  font-size: 12px
+  font-size: 12px;
 }

 .el-descriptions--mini.is-bordered .el-descriptions-item__cell {
-  padding: 6px 10px
+  padding: 6px 10px;
 }

 .el-descriptions--mini:not(.is-bordered) .el-descriptions-item__cell {
-  padding-bottom: 6px
+  padding-bottom: 6px;
 }

 .el-descriptions-item {
-  vertical-align: top
+  vertical-align: top;
 }

 .el-descriptions-item__container {
-  display: flex
+  display: flex;
 }

 .el-descriptions-item__container .el-descriptions-item__content,
 .el-descriptions-item__container .el-descriptions-item__label {
  display: inline-flex;
-  align-items: baseline
+  align-items: baseline;
 }

 .el-descriptions-item__container .el-descriptions-item__content {
-  flex: 1
+  flex: 1;
 }

 .el-descriptions-item__label.has-colon:after {
  content: ":";
  position: relative;
-  top: -.5px
+  top: -0.5px;
 }

 .el-descriptions-item__label.is-bordered-label {
  font-weight: 700;
  color: #909399;
-  background: #fafafa
+  background: #fafafa;
 }

 .el-descriptions-item__label:not(.is-bordered-label) {
-  margin-right: 10px
+  margin-right: 10px;
 }

 .el-descriptions-item__content {
  word-break: break-word;
-  overflow-wrap: break-word
+  overflow-wrap: break-word;
 }

 .feedBack-box {
@ -350,7 +357,7 @@ body .el-table th.gutter {
  top: 0;
  width: 100%;
  height: 100%;
-  opacity: .5;
+  opacity: 0.5;
  background: #000;
  z-index: 3999;
 }
--- a/src/views/dicom-show/dicom-study.vue
+++ b/src/views/dicom-show/dicom-study.vue
@ -965,8 +965,8 @@ export default {
 }
 </script>

-<style lang="scss" scoped>
-.imageBox {
+<style lang="scss">
+.viewerContainer .imageBox {
  position: relative;

  i {
--- a/src/views/dicom-show/dicom-visit.vue
+++ b/src/views/dicom-show/dicom-visit.vue
@ -158,108 +158,105 @@
                <div class="viewerSidethumbinner">

                  <el-collapse v-model="relationActiveName" @change="handelRelationActiveChange">
-                    <template v-for="item in relationStudyListByVisitName">
-                      <div :key="`${item.VisitName}`">
-                        <div v-show="item.VisitName" class="text-desc" style="background-color: #1f1f1f;">
-                          {{ item.VisitName }}
-                        </div>
-                        <template v-for="(study, studyIndex) in relationStudyList">
-                          <el-collapse-item :key="`${study.StudyId}`" :name="`${study.StudyId}`"
-                            v-if="study.VisitName === item.VisitName">
-                            <template slot="title">
+                    <div v-for="item in relationStudyListByVisitName" :key="`${item.VisitName}`">
+                      <div v-show="item.VisitName" class="text-desc" style="background-color: #1f1f1f;">
+                        {{ item.VisitName }}
+                      </div>
+                      <template v-for="(study, studyIndex) in relationStudyList">
+                        <el-collapse-item :key="`${study.StudyId}`" :name="`${study.StudyId}`"
+                          v-if="study.VisitName === item.VisitName">
+                          <template slot="title">

-                              <div class="text-desc">
-                                {{ study.StudyCode }}
-                              </div>
-                              <!-- <div v-show="study.Description" class="text-desc">
-                          {{ study.Description }}
-                        </div> -->
-
-                              <div v-show="study.SeriesCount" class="text-desc">
-                                {{ study.Modalities }} : {{ study.SeriesCount }} Series
-                              </div>
-                            </template>
-                            <div v-show="study.Description" class="text-desc" style="background-color: #1f1f1f;">
-                              {{ study.Description }}
+                            <div class="text-desc">
+                              {{ study.StudyCode }}
                            </div>
-                            <div class="viewerSidethumbs ps" style="position: relative;">
-                              <div class="viewerSidethumbinner">
-                                <div v-for="(seriesItem, index) in study.seriesList" :key="seriesItem.seriesId">
-                                  <div class="viewernavigatorwrapper"
-                                    style="position: relative;border:1px solid #434343;" series-type="relation"
-                                    @click="showRelationSeriesImage($event, seriesItem, studyIndex, index)">
-                                    <div class="imageBox" style="width: 72px;height:72px;">
-                                      <img class="image-preview" :src="seriesItem.previewImageUrl"
-                                        crossorigin="anonymous" alt="" style="width: 72px;height:72px;" fit="fill" />
-                                      <i class="el-icon-refresh" :title="$t('tip:refreshImage')"
-                                        @click.stop="refreshImage(item)"></i>
-                                    </div>
+                            <!-- <div v-show="study.Description" class="text-desc">
+                        {{ study.Description }}
+                      </div> -->

-                                    <div class="viewernavitextwrapper">
-                                      <div
-                                        style="padding: 1px 5px 1px 1px;display: flex;justify-content: space-between;">
-                                        <div v-if="seriesItem.keySeries" style="color:red">
-                                          Key Images
-                                        </div>
-                                        <div v-else>#{{ seriesItem.seriesNumber }}</div>
-                                        <div v-if="seriesItem.isExistMutiFrames && seriesItem.instanceCount > 1">
-                                          <el-popover placement="right-start" trigger="click"
-                                            popper-class="instance_frame_wrapper">
-                                            <div class="frame_list">
-                                              <div v-for="(instance, idx) in seriesItem.instanceInfoList"
-                                                :key="instance.Id" class="frame_content"
-                                                :style="{ 'margin-bottom': idx < seriesItem.instanceInfoList.length - 1 ? '5px' : '0px' }"
-                                                @click="showMultiFrames(studyIndex, seriesItem, index, instance)">
-                                                <div>
-                                                  <div>{{ instance.InstanceNumber }}</div>
-                                                  <div>{{ `${instance.NumberOfFrames > 0 ? instance.NumberOfFrames : 1}
-                                                    frame`
-                                                  }}</div>
-                                                </div>
+                            <div v-show="study.SeriesCount" class="text-desc">
+                              {{ study.Modalities }} : {{ study.SeriesCount }} Series
+                            </div>
+                          </template>
+                          <div v-show="study.Description" class="text-desc" style="background-color: #1f1f1f;">
+                            {{ study.Description }}
+                          </div>
+                          <div class="viewerSidethumbs ps" style="position: relative;">
+                            <div class="viewerSidethumbinner">
+                              <div v-for="(seriesItem, index) in study.seriesList" :key="seriesItem.seriesId">
+                                <div class="viewernavigatorwrapper"
+                                  style="position: relative;border:1px solid #434343;" series-type="relation"
+                                  @click="showRelationSeriesImage($event, seriesItem, studyIndex, index)">
+                                  <div class="imageBox" style="width: 72px;height:72px;">
+                                    <img class="image-preview" :src="seriesItem.previewImageUrl"
+                                      crossorigin="anonymous" alt="" style="width: 72px;height:72px;" fit="fill" />
+                                    <i class="el-icon-refresh" :title="$t('tip:refreshImage')"
+                                      @click.stop="refreshImage(item)"></i>
+                                  </div>

+                                  <div class="viewernavitextwrapper">
+                                    <div
+                                      style="padding: 1px 5px 1px 1px;display: flex;justify-content: space-between;">
+                                      <div v-if="seriesItem.keySeries" style="color:red">
+                                        Key Images
+                                      </div>
+                                      <div v-else>#{{ seriesItem.seriesNumber }}</div>
+                                      <div v-if="seriesItem.isExistMutiFrames && seriesItem.instanceCount > 1">
+                                        <el-popover placement="right-start" trigger="click"
+                                          popper-class="instance_frame_wrapper">
+                                          <div class="frame_list">
+                                            <div v-for="(instance, idx) in seriesItem.instanceInfoList"
+                                              :key="instance.Id" class="frame_content"
+                                              :style="{ 'margin-bottom': idx < seriesItem.instanceInfoList.length - 1 ? '5px' : '0px' }"
+                                              @click="showMultiFrames(studyIndex, seriesItem, index, instance)">
+                                              <div>
+                                                <div>{{ instance.InstanceNumber }}</div>
+                                                <div>{{ `${instance.NumberOfFrames > 0 ? instance.NumberOfFrames : 1}
+                                                  frame`
+                                                }}</div>
                                              </div>
-                                            </div>
-                                            <i slot="reference" class="el-icon-connection"
-                                              style="font-size: 15px;cursor: pointer;" />
-                                          </el-popover>
-                                        </div>

+                                            </div>
+                                          </div>
+                                          <i slot="reference" class="el-icon-connection"
+                                            style="font-size: 15px;cursor: pointer;" />
+                                        </el-popover>
                                      </div>
-                                      <div v-show="seriesItem.instanceCount" style="padding: 1px;">
-                                        {{ seriesItem.modality }}: {{ seriesItem.instanceCount }} image
-                                      </div>
-                                      <div v-show="seriesItem.sliceThickness" style="padding: 1px;">
-                                        T: {{ seriesItem.sliceThickness }}
-                                      </div>
-                                      <el-tooltip v-show="seriesItem.description" class="item" effect="dark"
-                                        :content="seriesItem.description" placement="bottom">
-                                        <div v-show="seriesItem.description"
-                                          style="width: 120px;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;padding: 1x;">
-                                          {{ seriesItem.description }}
-                                        </div>
-                                      </el-tooltip>
+
                                    </div>
+                                    <div v-show="seriesItem.instanceCount" style="padding: 1px;">
+                                      {{ seriesItem.modality }}: {{ seriesItem.instanceCount }} image
+                                    </div>
+                                    <div v-show="seriesItem.sliceThickness" style="padding: 1px;">
+                                      T: {{ seriesItem.sliceThickness }}
+                                    </div>
+                                    <el-tooltip v-show="seriesItem.description" class="item" effect="dark"
+                                      :content="seriesItem.description" placement="bottom">
+                                      <div v-show="seriesItem.description"
+                                        style="width: 120px;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;padding: 1x;">
+                                        {{ seriesItem.description }}
+                                      </div>
+                                    </el-tooltip>
                                  </div>
-                                  <!-- <el-image
-                            class="image-preview"
-                            style="height:72px;width:72px;"
-                            :src="seriesItem.previewImageUrl"
-                            fit="fill"
-                          /> -->
-                                  <div
-                                    v-if="seriesItem.prefetchInstanceCount > 0 && seriesItem.prefetchInstanceCount < seriesItem.instanceCount * 100">
-                                    <el-progress
-                                      :percentage="parseInt((seriesItem.prefetchInstanceCount / seriesItem.instanceCount).toFixed(2))" />
-                                  </div>
+                                </div>
+                                <!-- <el-image
+                          class="image-preview"
+                          style="height:72px;width:72px;"
+                          :src="seriesItem.previewImageUrl"
+                          fit="fill"
+                        /> -->
+                                <div
+                                  v-if="seriesItem.prefetchInstanceCount > 0 && seriesItem.prefetchInstanceCount < seriesItem.instanceCount * 100">
+                                  <el-progress
+                                    :percentage="parseInt((seriesItem.prefetchInstanceCount / seriesItem.instanceCount).toFixed(2))" />
                                </div>
                              </div>
                            </div>
-                          </el-collapse-item>
-                        </template>
-
-                      </div>
-                    </template>
+                          </div>
+                        </el-collapse-item>
+                      </template>

+                    </div>
                  </el-collapse>

                </div>
@ -1012,7 +1009,7 @@ export default {
 </script>

 <style lang="scss">
-.imageBox {
+.viewerContainer .imageBox {
  position: relative;

  i {
--- a/src/views/research-mobile/components/BasicInfo.vue
+++ b/src/views/research-mobile/components/BasicInfo.vue
@ -278,7 +278,7 @@ export default {
    padding: 5px 20px;
    margin-top: 5px;
    background: #fff;
-    ::v-deep.el-form-item {
+    ::v-deep .el-form-item {
      padding-bottom: 20px;
      
    }
@ -292,10 +292,10 @@ export default {
    }
  }
  .form-label-width{
-    ::v-deep.el-form-item__label{
+    ::v-deep .el-form-item__label{
      width: 140px;
    }
-    ::v-deep.el-form-item__content{
+    ::v-deep .el-form-item__content{
      margin-left: 140px;
    }
  }
@ -304,7 +304,7 @@ export default {
    text-align: center;
  }

-  ::v-deep.el-form-item {
+  ::v-deep .el-form-item {
    margin-bottom: 0px;
    padding-top: 5px;
    border-bottom: 1px solid #f5f7fa;
--- a/src/views/research-mobile/components/EquipmentForm.vue
+++ b/src/views/research-mobile/components/EquipmentForm.vue
@ -156,7 +156,7 @@ export default {
 <style lang="scss" scoped>
 .equipment_form_content{
  padding: 0 10px;
-  ::v-deep.el-form-item {
+  ::v-deep .el-form-item {
    margin-bottom: 0px;
    padding: 5px 0 20px 0;
    border-bottom: 1px solid #f5f7fa;
--- a/src/views/research-mobile/components/HistoricalParticipantForm.vue
+++ b/src/views/research-mobile/components/HistoricalParticipantForm.vue
@ -295,7 +295,7 @@ export default {
 <style lang="scss" scoped>
 .participants_form_content{
  padding: 0 10px;
-  ::v-deep.el-form-item {
+  ::v-deep .el-form-item {
     margin-bottom: 0px;
    padding: 5px 0 20px 0;
    border-bottom: 1px solid #f5f7fa;
--- a/src/views/research-mobile/components/ParticipantForm.vue
+++ b/src/views/research-mobile/components/ParticipantForm.vue
@ -309,7 +309,7 @@ export default {
 <style lang="scss" scoped>
 .participants_form_content{
  padding: 0 10px;
-  ::v-deep.el-form-item {
+  ::v-deep .el-form-item {
    margin-bottom: 0px;
    padding: 5px 0 20px 0;
    border-bottom: 1px solid #f5f7fa;
--- a/src/views/research-mobile/login.vue
+++ b/src/views/research-mobile/login.vue
@ -381,7 +381,7 @@ export default {
    padding: 5px 20px;
    margin-top: 5px;
    background: #fff;
-    ::v-deep.el-form-item {
+    ::v-deep .el-form-item {
      padding-bottom: 20px;
    }
  }
@ -398,7 +398,7 @@ export default {
    text-align: center;
  }

-  ::v-deep.el-form-item {
+  ::v-deep .el-form-item {
    margin-bottom: 0px;
    padding-top: 5px;
    border-bottom: 1px solid #f5f7fa;
--- a/src/views/research/form.vue
+++ b/src/views/research/form.vue
@ -357,7 +357,7 @@ export default {
    overflow-y: auto;
  }

-  ::v-deep.el-card__body {
+  ::v-deep .el-card__body {
    padding: 10px;
  }

@ -365,13 +365,13 @@ export default {
  //   padding: 10px 20px 20px 20px;
  // }

-  ::v-deep.full-dialog-container {
+  ::v-deep .full-dialog-container {
    .el-dialog__body {
      height: calc(100% - 80px);
    }
  }

-  ::v-deep.dialog-container {
+  ::v-deep .dialog-container {
    // margin-top: 50px !important;
    width: 75%;
    height: 80%;
--- a/src/views/trials/trials-layout/components/trialsMain.vue
+++ b/src/views/trials/trials-layout/components/trialsMain.vue
@ -44,7 +44,7 @@ export default {
  overflow: hidden;
  display: flex;
  flex-direction: column;
-  ::v-deep.el-card__body {
+  ::v-deep .el-card__body {
    padding: 0px;
  }
  .trials-tab{
--- a/src/views/trials/trials-layout/index.vue
+++ b/src/views/trials/trials-layout/index.vue
@ -28,8 +28,10 @@ export default {
 </script>

 <style lang="scss" scoped>
-@import "~@/styles/mixin.scss";
-@import "~@/styles/variables.module.scss";
+// @import "~@/styles/mixin.scss";
+// @import "~@/styles/variables.module.scss";
+@use "@/styles/mixin.scss" as *;
+@use "@/styles/variables.module.scss" as *;

 .trials-wrapper {
  @include clearfix;
--- a/src/views/trials/trials-panel/reading/dicoms/components/DicomViewer.vue
+++ b/src/views/trials/trials-panel/reading/dicoms/components/DicomViewer.vue
@ -2928,12 +2928,12 @@ export default {
  }

  .series-table {
-    ::v-deep.el-table {
+    ::v-deep .el-table {
      background-color: #1e1e1e !important;
      color: #dfdfdf;
    }

-    ::v-deep.el-table td.el-table__cell,
+    ::v-deep .el-table td.el-table__cell,
    .el-table th.el-table__cell.is-leaf {
      border-bottom: 1px solid #dfdfdf;
    }
@ -2944,14 +2944,14 @@ export default {
      background-color: #1e1e1e;
    }

-    ::v-deep.el-table__header-wrapper {
+    ::v-deep .el-table__header-wrapper {
      th {
        background-color: #1e1e1e !important;
        color: #dfdfdf;
      }
    }

-    ::v-deep.el-table__body-wrapper {
+    ::v-deep .el-table__body-wrapper {
      tr {
        background-color: #1e1e1e !important;
        color: #dfdfdf;
@ -2962,7 +2962,7 @@ export default {
      }
    }

-    ::v-deep.el-table__empty-block {
+    ::v-deep .el-table__empty-block {
      background-color: #1e1e1e !important;
    }
  }
--- a/src/views/trials/trials-panel/reading/dicoms/components/Fusion/FusionForm.vue
+++ b/src/views/trials/trials-panel/reading/dicoms/components/Fusion/FusionForm.vue
@ -319,23 +319,23 @@ export default {
 </script>
 <style lang="scss" scoped>
 .series-table{
-  ::v-deep.el-table{
+  ::v-deep .el-table{
    background-color:  #1e1e1e !important;
    color: #dfdfdf;
  }
-  ::v-deep.el-table td.el-table__cell, .el-table th.el-table__cell.is-leaf{
+  ::v-deep .el-table td.el-table__cell, .el-table th.el-table__cell.is-leaf{
    border-bottom: 1px solid #dfdfdf;
  }
  .el-table--border::after, .el-table--group::after, .el-table::before{
    background-color: #1e1e1e;
  }
-  ::v-deep.el-table__header-wrapper{
+  ::v-deep .el-table__header-wrapper{
    th{
      background-color:  #1e1e1e !important;
      color: #dfdfdf;
    }
  }
-  ::v-deep.el-table__body-wrapper{
+  ::v-deep .el-table__body-wrapper{
    tr{
      background-color:  #1e1e1e !important;
      color: #dfdfdf;
@ -344,7 +344,7 @@ export default {
      background-color:  #1e1e1e !important;
    }
  }
-  ::v-deep.el-table__empty-block{
+  ::v-deep .el-table__empty-block{
    background-color:  #1e1e1e !important;
  }
 }
--- a/src/views/trials/trials-panel/reading/dicoms/components/Fusion/PetCt.vue
+++ b/src/views/trials/trials-panel/reading/dicoms/components/Fusion/PetCt.vue
@ -2262,7 +2262,7 @@ export default {
  background-color: #000;
  padding: 5px 2px;

-  ::v-deep.el-dialog {
+  ::v-deep .el-dialog {
    background: #1e1e1e;
    border: 1px solid #ddd;
    color: #ddd;
--- a/src/views/trials/trials-panel/reading/dicoms/components/Fusion/demo/index.vue
+++ b/src/views/trials/trials-panel/reading/dicoms/components/Fusion/demo/index.vue
@ -1903,7 +1903,7 @@ export default {
    height: 100%;
    background-color: #000;
    padding: 5px 2px;
-    ::v-deep.el-dialog {
+    ::v-deep .el-dialog {
      background: #1e1e1e;
      border: 1px solid #ddd;
      color: #ddd;
--- a/src/views/trials/trials-panel/reading/dicoms/components/IRecist/QuestionList.vue
+++ b/src/views/trials/trials-panel/reading/dicoms/components/IRecist/QuestionList.vue
@ -1319,12 +1319,12 @@ export default {
 .merge-table {
  padding: 0 10px;

-  ::v-deep.el-table {
+  ::v-deep .el-table {
    background-color: #1e1e1e !important;
    color: #383838;
  }

-  ::v-deep.el-table td.el-table__cell,
+  ::v-deep .el-table td.el-table__cell,
  .el-table th.el-table__cell.is-leaf {
    border-bottom: 1px solid #383838;
  }
@ -1335,7 +1335,7 @@ export default {
    background-color: #1e1e1e;
  }

-  ::v-deep.el-table__header-wrapper {
+  ::v-deep .el-table__header-wrapper {
    th {
      background-color: #1e1e1e !important;
      color: #dfdfdf;
@ -1343,7 +1343,7 @@ export default {
    }
  }

-  ::v-deep.el-table__body-wrapper {
+  ::v-deep .el-table__body-wrapper {
    tr {
      background-color: #1e1e1e !important;
      color: #dfdfdf;
@ -1354,7 +1354,7 @@ export default {
    }
  }

-  ::v-deep.el-table__empty-block {
+  ::v-deep .el-table__empty-block {
    background-color: #1e1e1e !important;
  }

--- a/src/views/trials/trials-panel/reading/dicoms/components/IVUS/QuestionList.vue
+++ b/src/views/trials/trials-panel/reading/dicoms/components/IVUS/QuestionList.vue
@ -989,21 +989,21 @@ export default {
      padding: 5px 0;
    }

-    ::v-deep.el-table__fixed-right-patch {
+    ::v-deep .el-table__fixed-right-patch {
      background-color: #000 !important;
      border-color: #444444;
    }

-    ::v-deep.el-table__fixed-body-wrapper tr:hover>td {
+    ::v-deep .el-table__fixed-body-wrapper tr:hover>td {
      background-color: #000 !important;
    }

-    ::v-deep.el-table--scrollable-x .el-table__body-wrapper {
+    ::v-deep .el-table--scrollable-x .el-table__body-wrapper {
      z-index: 2;
    }
    
  }
-  ::v-deep.el-tag.el-tag--info {
+  ::v-deep .el-tag.el-tag--info {
    color: #000;
  }
 }
--- a/src/views/trials/trials-panel/reading/dicoms/components/Lugano/QuestionList.vue
+++ b/src/views/trials/trials-panel/reading/dicoms/components/Lugano/QuestionList.vue
@ -1436,12 +1436,12 @@ export default {
  .merge-table {
    padding: 0 10px;

-    ::v-deep.el-table {
+    ::v-deep .el-table {
      background-color: #1e1e1e !important;
      color: #383838;
    }

-    ::v-deep.el-table td.el-table__cell,
+    ::v-deep .el-table td.el-table__cell,
    .el-table th.el-table__cell.is-leaf {
      border-bottom: 1px solid #383838;
    }
@ -1452,7 +1452,7 @@ export default {
      background-color: #1e1e1e;
    }

-    ::v-deep.el-table__header-wrapper {
+    ::v-deep .el-table__header-wrapper {
      th {
        background-color: #1e1e1e !important;
        color: #dfdfdf;
@ -1460,7 +1460,7 @@ export default {
      }
    }

-    ::v-deep.el-table__body-wrapper {
+    ::v-deep .el-table__body-wrapper {
      tr {
        background-color: #1e1e1e !important;
        color: #dfdfdf;
@ -1471,7 +1471,7 @@ export default {
      }
    }

-    ::v-deep.el-table__empty-block {
+    ::v-deep .el-table__empty-block {
      background-color: #1e1e1e !important;
    }

--- a/src/views/trials/trials-panel/reading/dicoms/components/LuganoWithoutPET/QuestionList.vue
+++ b/src/views/trials/trials-panel/reading/dicoms/components/LuganoWithoutPET/QuestionList.vue
@ -1436,12 +1436,12 @@ export default {
  .merge-table {
    padding: 0 10px;

-    ::v-deep.el-table {
+    ::v-deep .el-table {
      background-color: #1e1e1e !important;
      color: #383838;
    }

-    ::v-deep.el-table td.el-table__cell,
+    ::v-deep .el-table td.el-table__cell,
    .el-table th.el-table__cell.is-leaf {
      border-bottom: 1px solid #383838;
    }
@ -1452,7 +1452,7 @@ export default {
      background-color: #1e1e1e;
    }

-    ::v-deep.el-table__header-wrapper {
+    ::v-deep .el-table__header-wrapper {
      th {
        background-color: #1e1e1e !important;
        color: #dfdfdf;
@ -1460,7 +1460,7 @@ export default {
      }
    }

-    ::v-deep.el-table__body-wrapper {
+    ::v-deep .el-table__body-wrapper {
      tr {
        background-color: #1e1e1e !important;
        color: #dfdfdf;
@ -1471,7 +1471,7 @@ export default {
      }
    }

-    ::v-deep.el-table__empty-block {
+    ::v-deep .el-table__empty-block {
      background-color: #1e1e1e !important;
    }

--- a/src/views/trials/trials-panel/reading/dicoms/components/OCT/QuestionList.vue
+++ b/src/views/trials/trials-panel/reading/dicoms/components/OCT/QuestionList.vue
@ -999,20 +999,20 @@ export default {
      padding: 5px 0;
    }

-    ::v-deep.el-table__fixed-right-patch {
+    ::v-deep .el-table__fixed-right-patch {
      background-color: #000 !important;
      border-color: #444444;
    }

-    ::v-deep.el-table__fixed-body-wrapper tr:hover>td {
+    ::v-deep .el-table__fixed-body-wrapper tr:hover>td {
      background-color: #000 !important;
    }

-    ::v-deep.el-table--scrollable-x .el-table__body-wrapper {
+    ::v-deep .el-table--scrollable-x .el-table__body-wrapper {
      z-index: 2;
    }
  }
-  ::v-deep.el-tag.el-tag--info {
+  ::v-deep .el-tag.el-tag--info {
    color: #000;
  }
 }
--- a/src/views/trials/trials-panel/reading/dicoms/components/ReadPage.vue
+++ b/src/views/trials/trials-panel/reading/dicoms/components/ReadPage.vue
@ -614,7 +614,7 @@ export default {

    }

-    ::v-deep.el-tabs {
+    ::v-deep .el-tabs {
      box-sizing: border-box;
      padding: 0 5px;
      height: 100%;
@ -665,7 +665,7 @@ export default {
      border: 1px solid #607d8b !important;
    }

-    ::v-deep.el-progress__text {
+    ::v-deep .el-progress__text {
      color: #ccc;
      font-size: 12px;
    }
--- a/src/views/trials/trials-panel/reading/dicoms/components/Recist/QuestionList.vue
+++ b/src/views/trials/trials-panel/reading/dicoms/components/Recist/QuestionList.vue
@ -1203,12 +1203,12 @@ export default {
 .merge-table {
  padding: 0 10px;

-  ::v-deep.el-table {
+  ::v-deep .el-table {
    background-color: #1e1e1e !important;
    color: #383838;
  }

-  ::v-deep.el-table td.el-table__cell,
+  ::v-deep .el-table td.el-table__cell,
  .el-table th.el-table__cell.is-leaf {
    border-bottom: 1px solid #383838;
  }
@ -1219,7 +1219,7 @@ export default {
    background-color: #1e1e1e;
  }

-  ::v-deep.el-table__header-wrapper {
+  ::v-deep .el-table__header-wrapper {
    th {
      background-color: #1e1e1e !important;
      color: #dfdfdf;
@ -1227,7 +1227,7 @@ export default {
    }
  }

-  ::v-deep.el-table__body-wrapper {
+  ::v-deep .el-table__body-wrapper {
    tr {
      background-color: #1e1e1e !important;
      color: #dfdfdf;
@ -1238,7 +1238,7 @@ export default {
    }
  }

-  ::v-deep.el-table__empty-block {
+  ::v-deep .el-table__empty-block {
    background-color: #1e1e1e !important;
  }

--- a/src/views/trials/trials-panel/reading/dicoms/components/RecistBM/QuestionList.vue
+++ b/src/views/trials/trials-panel/reading/dicoms/components/RecistBM/QuestionList.vue
@ -1130,12 +1130,12 @@ export default {
 .merge-table {
  padding: 0 10px;

-  ::v-deep.el-table {
+  ::v-deep .el-table {
    background-color: #1e1e1e !important;
    color: #383838;
  }

-  ::v-deep.el-table td.el-table__cell,
+  ::v-deep .el-table td.el-table__cell,
  .el-table th.el-table__cell.is-leaf {
    border-bottom: 1px solid #383838;
  }
@ -1146,7 +1146,7 @@ export default {
    background-color: #1e1e1e;
  }

-  ::v-deep.el-table__header-wrapper {
+  ::v-deep .el-table__header-wrapper {
    th {
      background-color: #1e1e1e !important;
      color: #dfdfdf;
@ -1154,7 +1154,7 @@ export default {
    }
  }

-  ::v-deep.el-table__body-wrapper {
+  ::v-deep .el-table__body-wrapper {
    tr {
      background-color: #1e1e1e !important;
      color: #dfdfdf;
@ -1165,7 +1165,7 @@ export default {
    }
  }

-  ::v-deep.el-table__empty-block {
+  ::v-deep .el-table__empty-block {
    background-color: #1e1e1e !important;
  }

--- a/src/views/trials/trials-panel/reading/dicoms/components/StudyList.vue
+++ b/src/views/trials/trials-panel/reading/dicoms/components/StudyList.vue
@ -952,7 +952,7 @@ export default {
    background-color: #607d8b!important;
    border: 1px solid #607d8b!important;
  }
-  ::v-deep.el-progress__text{
+  ::v-deep .el-progress__text{
    color: #ccc;
    font-size: 12px;
  }
@ -1022,7 +1022,7 @@ export default {

    }
  }
-  ::v-deep.el-collapse{
+  ::v-deep .el-collapse{
    border: none;
    .el-collapse-item{
      background-color: #000!important;
@ -1043,7 +1043,7 @@ export default {
    }
  }
  .sr-wrapper{
-    ::v-deep.el-dialog{
+    ::v-deep .el-dialog{
      background: #fff !important;
      border: 1px solid #ddd;
      // color: #ddd;
@ -1051,12 +1051,12 @@ export default {
        color:#fff;
      }
    }
-    ::v-deep.sr-dialog-container{
+    ::v-deep .sr-dialog-container{
      margin-top: 50px !important;
      width:75%;
      height:80%;
    }
-    ::v-deep.el-dialog__body{
+    ::v-deep .el-dialog__body{
        padding: 10px;
        height: calc(100% - 50px);
    }
@ -1064,7 +1064,7 @@ export default {
      position: relative;
    }
    .sr-full-dialog-container{
-      ::v-deep.is-fullscreen .el-dialog__body{
+      ::v-deep .is-fullscreen .el-dialog__body{
        height: calc(100% - 50px);
      }
    }
--- a/src/views/trials/trials-panel/reading/dicoms/customize/CustomizeStudyList.vue
+++ b/src/views/trials/trials-panel/reading/dicoms/customize/CustomizeStudyList.vue
@ -887,7 +887,7 @@ export default {
    background-color: #607d8b!important;
    border: 1px solid #607d8b!important;
  }
-  ::v-deep.el-progress__text{
+  ::v-deep .el-progress__text{
    color: #ccc;
    font-size: 12px;
  }
@ -956,7 +956,7 @@ export default {
      }
    }
  }
-  ::v-deep.el-collapse{
+  ::v-deep .el-collapse{
    border: none;
    .el-collapse-item{
      background-color: #000!important;
@ -977,7 +977,7 @@ export default {
    }
  }
  .sr-wrapper{
-    ::v-deep.el-dialog{
+    ::v-deep .el-dialog{
      background: #fff !important;
      border: 1px solid #ddd;
      // color: #ddd;
@ -985,12 +985,12 @@ export default {
        color:#fff;
      }
    }
-    ::v-deep.sr-dialog-container{
+    ::v-deep .sr-dialog-container{
      margin-top: 50px !important;
      width:75%;
      height:80%;
    }
-    ::v-deep.el-dialog__body{
+    ::v-deep .el-dialog__body{
        padding: 10px;
        height: calc(100% - 50px);
    }
@ -998,7 +998,7 @@ export default {
      position: relative;
    }
    .sr-full-dialog-container{
-      ::v-deep.is-fullscreen .el-dialog__body{
+      ::v-deep .is-fullscreen .el-dialog__body{
        height: calc(100% - 50px);
      }
    }
--- a/src/views/trials/trials-panel/reading/dicoms/index.vue
+++ b/src/views/trials/trials-panel/reading/dicoms/index.vue
@ -529,7 +529,7 @@ export default {
 }
 </script>
 <style lang="scss" scoped>
-::v-deep.el-message-box__headerbtn {
+::v-deep .el-message-box__headerbtn {
  display: none;
 }

@ -541,7 +541,7 @@ export default {
    box-sizing: border-box;
    background-color: #000;

-    ::v-deep.el-tabs {
+    ::v-deep .el-tabs {
      box-sizing: border-box;
      height: 100%;
      display: flex;
@ -573,11 +573,11 @@ export default {

    }

-    ::v-deep.hot-keys-label {
+    ::v-deep .hot-keys-label {
      color: #dfdfdf !important;
    }

-    ::v-deep.shortcut-key-input span {
+    ::v-deep .shortcut-key-input span {
      color: #dfdfdf !important;
    }

@ -588,7 +588,7 @@ export default {
    //   }

    // }
-    ::v-deep.el-dialog {
+    ::v-deep .el-dialog {
      background: #1e1e1e;
      border: 1px solid #ddd;
      color: #ddd;
@ -614,13 +614,13 @@ export default {

  }

-  ::v-deep.dialog-container {
+  ::v-deep .dialog-container {
    margin-top: 50px !important;
    width: 75%;
    height: 80%;
  }

-  ::v-deep.el-dialog__body {
+  ::v-deep .el-dialog__body {
    padding: 20px;
    height: calc(100% - 70px);
  }
@ -636,7 +636,7 @@ export default {
 }

 .full-dialog-container {
-  ::v-deep.is-fullscreen .el-dialog__body {
+  ::v-deep .is-fullscreen .el-dialog__body {
    height: calc(100% - 70px);
  }
 }
--- a/src/views/trials/trials-panel/reading/dicoms3D/components/FusionForm.vue
+++ b/src/views/trials/trials-panel/reading/dicoms3D/components/FusionForm.vue
@ -235,12 +235,12 @@ export default {
 </script>
 <style lang="scss" scoped>
 .series-table {
-  ::v-deep.el-table {
+  ::v-deep .el-table {
    background-color: #1e1e1e !important;
    color: #dfdfdf;
  }

-  ::v-deep.el-table td.el-table__cell,
+  ::v-deep .el-table td.el-table__cell,
  .el-table th.el-table__cell.is-leaf {
    border-bottom: 1px solid #dfdfdf;
  }
@ -251,14 +251,14 @@ export default {
    background-color: #1e1e1e;
  }

-  ::v-deep.el-table__header-wrapper {
+  ::v-deep .el-table__header-wrapper {
    th {
      background-color: #1e1e1e !important;
      color: #dfdfdf;
    }
  }

-  ::v-deep.el-table__body-wrapper {
+  ::v-deep .el-table__body-wrapper {
    tr {
      background-color: #1e1e1e !important;
      color: #dfdfdf;
@ -269,7 +269,7 @@ export default {
    }
  }

-  ::v-deep.el-table__empty-block {
+  ::v-deep .el-table__empty-block {
    background-color: #1e1e1e !important;
  }
 }
--- a/src/views/trials/trials-panel/reading/dicoms3D/components/ReadPage.vue
+++ b/src/views/trials/trials-panel/reading/dicoms3D/components/ReadPage.vue
@ -3942,61 +3942,6 @@ export default {
    }
  }

-  ::v-deep .manuals-dialog-container {
-    margin-top: 50px !important;
-    width: 75%;
-    height: 80%;
-
-    .el-dialog__body {
-      padding: 10px;
-      height: calc(100% - 50px) !important;
-    }
-
-    .el-dialog__header {
-      position: relative;
-    }
-  }
-
-  ::v-deep .manuals-full-dialog-container {
-    .el-dialog__body {
-      padding: 10px;
-      height: calc(100% - 50px) !important;
-    }
-
-    .el-dialog__header {
-      position: relative;
-    }
-  }
-
-  ::v-deep .cd-dialog-container {
-    background: #fff !important;
-    margin-top: 50px !important;
-    width: 75%;
-    height: 80%;
-
-    .el-dialog__body {
-      padding: 20px 20px 0 20px;
-      height: calc(100% - 70px);
-    }
-
-    .el-dialog__header {
-      position: relative;
-    }
-  }
-
-  ::v-deep .cd-full-dialog-container {
-    background: #fff !important;
-
-    .el-dialog__body {
-      padding: 10px;
-      height: calc(100% - 50px) !important;
-    }
-
-    .el-dialog__header {
-      position: relative;
-    }
-  }
-
  ::v-deep .el-dropdown-menu {
    .el-dropdown-menu__item {
      padding: 0 5px;
@ -4039,3 +3984,60 @@ export default {
  }
 }
 </style>
+
+<style lang="scss">
+.manuals-dialog-container {
+  margin-top: 50px !important;
+  width: 75%;
+  height: 80%;
+
+  .el-dialog__body {
+    padding: 10px;
+    height: calc(100% - 50px) !important;
+  }
+
+  .el-dialog__header {
+    position: relative;
+  }
+}
+
+.manuals-full-dialog-container {
+  .el-dialog__body {
+    padding: 10px;
+    height: calc(100% - 50px) !important;
+  }
+
+  .el-dialog__header {
+    position: relative;
+  }
+}
+
+.cd-dialog-container {
+  background: #fff !important;
+  margin-top: 50px !important;
+  width: 75%;
+  height: 80%;
+
+  .el-dialog__body {
+    padding: 20px 20px 0 20px;
+    height: calc(100% - 70px);
+  }
+
+  .el-dialog__header {
+    position: relative;
+  }
+}
+
+.cd-full-dialog-container {
+  background: #fff !important;
+
+  .el-dialog__body {
+    padding: 10px;
+    height: calc(100% - 50px) !important;
+  }
+
+  .el-dialog__header {
+    position: relative;
+  }
+}
+</style>
--- a/src/views/trials/trials-panel/reading/dicoms3D/components/Recist/QuestionList.vue
+++ b/src/views/trials/trials-panel/reading/dicoms3D/components/Recist/QuestionList.vue
@ -1986,12 +1986,12 @@ export default {
 .merge-table {
  padding: 0 10px;

-  ::v-deep.el-table {
+  ::v-deep .el-table {
    background-color: #1e1e1e !important;
    color: #383838;
  }

-  ::v-deep.el-table td.el-table__cell,
+  ::v-deep .el-table td.el-table__cell,
  .el-table th.el-table__cell.is-leaf {
    border-bottom: 1px solid #383838;
  }
@ -2002,7 +2002,7 @@ export default {
    background-color: #1e1e1e;
  }

-  ::v-deep.el-table__header-wrapper {
+  ::v-deep .el-table__header-wrapper {
    th {
      background-color: #1e1e1e !important;
      color: #dfdfdf;
@ -2010,7 +2010,7 @@ export default {
    }
  }

-  ::v-deep.el-table__body-wrapper {
+  ::v-deep .el-table__body-wrapper {
    tr {
      background-color: #1e1e1e !important;
      color: #dfdfdf;
@ -2021,7 +2021,7 @@ export default {
    }
  }

-  ::v-deep.el-table__empty-block {
+  ::v-deep .el-table__empty-block {
    background-color: #1e1e1e !important;
  }

--- a/src/views/trials/trials-panel/reading/dicoms3D/components/StudyList.vue
+++ b/src/views/trials/trials-panel/reading/dicoms3D/components/StudyList.vue
@ -262,7 +262,7 @@ export default {
    background-color: #607d8b!important;
    border: 1px solid #607d8b!important;
  }
-  ::v-deep.el-progress__text{
+  ::v-deep .el-progress__text{
    color: #ccc;
    font-size: 12px;
  }
@ -306,7 +306,7 @@ export default {

    }
  }
-  ::v-deep.el-collapse{
+  ::v-deep .el-collapse{
    border: none;
    .el-collapse-item{
      background-color: #000!important;
--- a/src/views/trials/trials-panel/reading/dicoms3D/components/mRecist/QuestionList.vue
+++ b/src/views/trials/trials-panel/reading/dicoms3D/components/mRecist/QuestionList.vue
@ -2070,12 +2070,12 @@ export default {
 .merge-table {
  padding: 0 10px;

-  ::v-deep.el-table {
+  ::v-deep .el-table {
    background-color: #1e1e1e !important;
    color: #383838;
  }

-  ::v-deep.el-table td.el-table__cell,
+  ::v-deep .el-table td.el-table__cell,
  .el-table th.el-table__cell.is-leaf {
    border-bottom: 1px solid #383838;
  }
@ -2086,7 +2086,7 @@ export default {
    background-color: #1e1e1e;
  }

-  ::v-deep.el-table__header-wrapper {
+  ::v-deep .el-table__header-wrapper {
    th {
      background-color: #1e1e1e !important;
      color: #dfdfdf;
@ -2094,7 +2094,7 @@ export default {
    }
  }

-  ::v-deep.el-table__body-wrapper {
+  ::v-deep .el-table__body-wrapper {
    tr {
      background-color: #1e1e1e !important;
      color: #dfdfdf;
@ -2105,7 +2105,7 @@ export default {
    }
  }

-  ::v-deep.el-table__empty-block {
+  ::v-deep .el-table__empty-block {
    background-color: #1e1e1e !important;
  }

--- a/src/views/trials/trials-panel/reading/medical-feedback/components/ChatForm.vue
+++ b/src/views/trials/trials-panel/reading/medical-feedback/components/ChatForm.vue
@ -317,7 +317,7 @@ export default {
          color: yellow;
        }
      }
-      ::v-deep.el-button--text{
+      ::v-deep .el-button--text{
        color: #d0d0d0;
      }
    }
--- a/src/views/trials/trials-panel/reading/medical-feedback/index.vue
+++ b/src/views/trials/trials-panel/reading/medical-feedback/index.vue
@ -494,7 +494,7 @@ export default {

 <style lang="scss" scoped>
  .medical-feedback-ir{
-    ::v-deep.search {
+    ::v-deep .search {
      padding: 0px !important;
    }
  }
--- a/src/views/trials/trials-panel/reading/mim-medical-audit/components/ChatForm.vue
+++ b/src/views/trials/trials-panel/reading/mim-medical-audit/components/ChatForm.vue
@ -366,7 +366,7 @@ export default {
          color: yellow;
        }
      }
-      ::v-deep.el-button--text{
+      ::v-deep .el-button--text{
        color: #d0d0d0;
      }
    }
--- a/src/views/trials/trials-panel/reading/mim-medical-audit/components/Issues.vue
+++ b/src/views/trials/trials-panel/reading/mim-medical-audit/components/Issues.vue
@ -161,16 +161,16 @@ export default {
 </script>
 <style lang="scss" scoped>
 .issues-form{
-  ::v-deep.el-radio-group{
+  ::v-deep .el-radio-group{
    width:300px;
  }
-  ::v-deep.el-textarea{
+  ::v-deep .el-textarea{
    width:300px;
  }
-  ::v-deep.el-input{
+  ::v-deep .el-input{
    width:300px;
  }
-  ::v-deep.el-select{
+  ::v-deep .el-select{
    width:300px;
  }

--- a/src/views/trials/trials-panel/reading/none-dicoms/index--.vue
+++ b/src/views/trials/trials-panel/reading/none-dicoms/index--.vue
@ -297,7 +297,7 @@ export default {
    height: 100%;
    padding: 0 10px;
    box-sizing: border-box;
-    ::v-deep.el-tabs{
+    ::v-deep .el-tabs{
      box-sizing: border-box;
      height: 100%;
      display: flex;
@ -324,12 +324,12 @@ export default {

    }
  }
-  ::v-deep.dialog-container{
+  ::v-deep .dialog-container{
    margin-top: 50px !important;
    width:75%;
    height:80%;
  }
-  ::v-deep.el-dialog__body{
+  ::v-deep .el-dialog__body{
      padding: 20px 20px 0 20px;
      height: calc(100% - 70px);
    }
@ -339,7 +339,7 @@ export default {
 }

 .full-dialog-container{
-  ::v-deep.is-fullscreen .el-dialog__body{
+  ::v-deep .is-fullscreen .el-dialog__body{
    height: calc(100% - 70px);
  }
 }
--- a/src/views/trials/trials-panel/reading/read-task-allocation/index.vue
+++ b/src/views/trials/trials-panel/reading/read-task-allocation/index.vue
@ -884,7 +884,7 @@ export default {
 </script>
 <style lang="scss" scoped>
 .read-task-allocation {
-  ::v-deep.search {
+  ::v-deep .search {
    padding: 0px !important;
  }
 }
--- a/src/views/trials/trials-panel/reading/read-task/index.vue
+++ b/src/views/trials/trials-panel/reading/read-task/index.vue
@ -548,7 +548,7 @@ export default {
  height: 100%;
  background-color: #fff;

-  ::v-deep.search {
+  ::v-deep .search {
    padding: 0px !important;
  }
 }
--- a/src/views/trials/trials-panel/reading/reading-task/index.vue
+++ b/src/views/trials/trials-panel/reading/reading-task/index.vue
@ -408,7 +408,7 @@ export default {
  height: 100%;
  background-color: #fff;

-  ::v-deep.search {
+  ::v-deep .search {
    padding: 0px !important;
  }
 }
--- a/src/views/trials/trials-panel/reading/reread-task/index.vue
+++ b/src/views/trials/trials-panel/reading/reread-task/index.vue
@ -466,7 +466,7 @@ export default {
 </script>
 <style lang="scss" scoped>
  .reread-task{
-    ::v-deep.search {
+    ::v-deep .search {
      padding: 0px !important;
    }
  }
--- a/src/views/trials/trials-panel/reading/visit-review/components/StudyList.vue
+++ b/src/views/trials/trials-panel/reading/visit-review/components/StudyList.vue
@ -246,7 +246,7 @@ export default {
    border: 1px solid #607d8b !important;
  }

-  ::v-deep.el-progress__text {
+  ::v-deep .el-progress__text {
    color: #ccc;
    font-size: 12px;
  }
@ -295,7 +295,7 @@ export default {
    }
  }

-  ::v-deep.el-collapse {
+  ::v-deep .el-collapse {
    border: none;

    .el-collapse-item {
--- a/src/views/trials/trials-panel/setting/email-manage/config.vue
+++ b/src/views/trials/trials-panel/setting/email-manage/config.vue
@ -221,12 +221,12 @@ export default {
        overflow-y: auto;
    }

-    ::v-deep.el-collapse-item__header {
+    ::v-deep .el-collapse-item__header {
        background: #e5ecef;
        padding-left: 10px;
    }

-    ::v-deep.el-collapse-item__content {
+    ::v-deep .el-collapse-item__content {
        padding: 10px;
    }

--- a/src/views/trials/trials-panel/setting/medical-audit/index.vue
+++ b/src/views/trials/trials-panel/setting/medical-audit/index.vue
@ -562,7 +562,7 @@ export default {
  background: #fff;
  padding: 0px 10px;
  box-sizing: border-box;
-  ::v-deep.search {
+  ::v-deep .search {
    padding: 0px !important;
  }
  ::v-deep .el-tabs--border-card>.el-tabs__content {
--- a/src/views/trials/trials-panel/subject/reading-period/index.vue
+++ b/src/views/trials/trials-panel/subject/reading-period/index.vue
@ -689,7 +689,7 @@ export default {
 </script>
 <style lang="scss" scoped>
 .reading-period {
-  ::v-deep.search {
+  ::v-deep .search {
    padding: 0px !important;
  }
 }
--- a/src/views/trials/trials-panel/trial-summary/trial-document/components/menu.vue
+++ b/src/views/trials/trials-panel/trial-summary/trial-document/components/menu.vue
@ -435,7 +435,7 @@ export default {
    }
  }
  .menuSwitch {
-    ::v-deep.el-switch__core {
+    ::v-deep .el-switch__core {
      height: 14px;
      width: 28px !important;
      &::after {
@ -446,7 +446,7 @@ export default {
    }
  }
  .el-switch.is-checked {
-    ::v-deep.el-switch__core {
+    ::v-deep .el-switch__core {
      height: 14px;
      width: 28px !important;
      &::after {
--- a/vue.config.js
+++ b/vue.config.js
@ -99,7 +99,7 @@ module.exports = defineConfig({
        ]
      }),
      // new BundleAnalyzerPlugin(),
-      process.env.NODE_ENV === 'development' || process.env.NODE_ENV === 'production' || process.env.VUE_APP_OSS_CONFIG_BUCKET === 'zyypacs-usa' ? function () { }
+      process.env.NODE_ENV === 'development' || process.env.NODE_ENV === 'production' || process.env.VUE_APP_OSS_CONFIG_BUCKET === 'zyypacs-usa' ? function() { }
        : new WebpackAliyunOss({
          from: ['./dist/**'],
          dist: process.env.VUE_APP_OSS_PATH + distDate,
@ -186,7 +186,7 @@ module.exports = defineConfig({
      // 生成文件的最大体积
      maxAssetSize: 3000000000,
      // 只给出js的性能提示
-      assetFilter: function (assetFileName) {
+      assetFilter: function(assetFileName) {
        return assetFileName.endsWith('.js')
      }
    }