Преглед изворни кода

feat: 实现部分暗黑模式

zhouyuhao пре 11 месеци
родитељ
комит
30c60a131a

+ 7 - 2
src/styles/theme.scss

@@ -179,6 +179,9 @@
 
   --color-table-header-bg: #f8f9fd;
   --color-table-click-row-bg: #ffe3cc;
+
+  --color-download-file-filter-tag-bg: #eceef0;
+  --color-download-file-selected-column-tag-bg: #eceef0;
 }
 
 :root.dark {
@@ -193,8 +196,8 @@
 
   --border-hover-color: #654f3f;
 
-  --color-dialog-header-bg: #3e454f;
-  --color-dialog-body-bg: #30353c;
+  --color-download-file-filter-tag-bg: #3f4249;
+  --color-download-file-selected-column-tag-bg: #474e57;
 
   // 滚动条
   --color-scrollbar-thumb: #656f7d;
@@ -225,6 +228,8 @@
   }
   --color-table-header-bg: #34383f;
   --el-input-focus: #2b2f36;
+  --color-dialog-header-bg: #3e454f;
+  --color-dialog-body-bg: #30353c;
 
   // vxe-table
   --vxe-ui-layout-background-color: #2b2f36;

+ 7 - 4
src/views/Booking/src/components/BookingTable/src/components/DownloadDialog.vue

@@ -34,7 +34,7 @@ defineExpose({
 
 <template>
   <div>
-    <el-dialog @close="clearData" v-model="dialogVisible" title="Download File" width="480">
+    <el-dialog @close="clearData" v-model="dialogVisible" title="Download File" width="540">
       <div class="download-dialog">
         <div class="select-data">
           <div style="display: inline-block">
@@ -95,12 +95,14 @@ defineExpose({
   display: flex;
   flex-wrap: wrap;
   gap: 8px;
+  max-height: 120px;
   margin-top: 8px;
+  overflow: auto;
 
   .filter-item {
     height: 22px;
     padding: 0px 8px;
-    background-color: #eceef0;
+    background-color: var(--color-download-file-filter-tag-bg);
     border-radius: 12px;
     line-height: 22px;
     font-size: 12px;
@@ -144,11 +146,12 @@ defineExpose({
     }
 
     .select-columns {
+      max-height: 350px;
       padding: 8px;
       margin-top: 8px;
       background-color: var(--color-header-bg);
       border-radius: 6px;
-      overflow: hidden;
+      overflow: auto;
 
       &.show {
         max-height: 500px;
@@ -168,7 +171,7 @@ defineExpose({
         .column-item {
           height: 22px;
           padding: 0px 8px;
-          background-color: #eceef0;
+          background-color: var(--color-download-file-selected-column-tag-bg);
           line-height: 22px;
           border-radius: 12px;
           font-size: 12px;

+ 6 - 3
src/views/OperationLog/src/components/BookingTable/src/components/DownloadDialog.vue

@@ -32,7 +32,7 @@ defineExpose({
 
 <template>
   <div>
-    <el-dialog @close="clearData" v-model="dialogVisible" title="Download File" width="480">
+    <el-dialog @close="clearData" v-model="dialogVisible" title="Download File" width="540">
       <div class="download-dialog">
         <div class="select-data">
           <div style="display: inline-block">
@@ -90,12 +90,14 @@ defineExpose({
   display: flex;
   flex-wrap: wrap;
   gap: 8px;
+  max-height: 120px;
   margin-top: 8px;
+  overflow: auto;
 
   .filter-item {
     height: 22px;
     padding: 0px 8px;
-    background-color: #eceef0;
+    background-color: var(--color-download-file-filter-tag-bg);
     border-radius: 12px;
     line-height: 22px;
     font-size: 12px;
@@ -139,6 +141,7 @@ defineExpose({
     }
 
     .select-columns {
+      max-height: 350px;
       padding: 8px;
       margin-top: 8px;
       background-color: var(--color-header-bg);
@@ -163,7 +166,7 @@ defineExpose({
         .column-item {
           height: 22px;
           padding: 0px 8px;
-          background-color: #eceef0;
+          background-color: var(--color-download-file-selected-column-tag-bg);
           line-height: 22px;
           border-radius: 12px;
           font-size: 12px;

+ 7 - 4
src/views/Tracking/src/components/TrackingTable/src/components/DownloadDialog.vue

@@ -34,7 +34,7 @@ defineExpose({
 
 <template>
   <div>
-    <el-dialog @close="clearData" v-model="dialogVisible" title="Download File" width="480">
+    <el-dialog @close="clearData" v-model="dialogVisible" title="Download File" width="540">
       <div class="download-dialog">
         <div class="select-data">
           <div style="display: inline-block">
@@ -95,12 +95,14 @@ defineExpose({
   display: flex;
   flex-wrap: wrap;
   gap: 8px;
+  max-height: 120px;
   margin-top: 8px;
+  overflow: auto;
 
   .filter-item {
     height: 22px;
     padding: 0px 8px;
-    background-color: #eceef0;
+    background-color: var(--color-download-file-filter-tag-bg);
     border-radius: 12px;
     line-height: 22px;
     font-size: 12px;
@@ -144,11 +146,12 @@ defineExpose({
     }
 
     .select-columns {
+      max-height: 350px;
       padding: 8px;
       margin-top: 8px;
       background-color: var(--color-header-bg);
       border-radius: 6px;
-      overflow: hidden;
+      overflow: auto;
 
       &.show {
         max-height: 500px;
@@ -168,7 +171,7 @@ defineExpose({
         .column-item {
           height: 22px;
           padding: 0px 8px;
-          background-color: #eceef0;
+          background-color: var(--color-download-file-selected-column-tag-bg);
           line-height: 22px;
           border-radius: 12px;
           font-size: 12px;