feat: 修改按钮和地图部分暗黑模式样式

src/styles/elementui.scss

@@ -47,7 +47,7 @@ button.el-button.el-button--text {
   }
 }
 
-.el-button.el-button--main.is-plain {
+.el-button--main.is-plain {
   background-color: var(--color-white);
   border: 1px solid var(--color-border);
   span {
@@ -62,7 +62,7 @@ button.el-button.el-button--text {
   }
 }
 
-.el-button.el-button--main {
+button.el-button--main {
   border: none;
   background-color: var(--color-theme);
   span {
@@ -76,6 +76,23 @@ button.el-button.el-button--text {
   }
 }
 
+button.el-button.el-button--pain-theme {
+  border: 1px solid var(--color-el-btn-pain-theme-border);
+  background-color: var(--color-el-btn-pain-theme-bg);
+
+  fill: var(--color-el-btn-pain-theme-text);
+  color: var(--color-el-btn-pain-theme-text);
+  span {
+    color: var(--color-el-btn-pain-theme-text);
+  }
+  &:hover {
+    border-color: var(--color-el-btn-pain-theme-border);
+    background-color: var(--color-el-btn-pain-theme-bg-hover);
+    color: var(--color-white);
+    fill: var(--color-white);
+  }
+}
+
 .el-button.el-button--success {
   border: none;
   background-color: var(--color-success);
@@ -152,9 +169,9 @@ button.el-button.el-button--icon {
   height: auto;
   padding: 4px;
   border: none;
-  background-color: #f6f6fe;
+  background-color: var(--color-btn-icon-bg);
   &:hover {
-    background-color: #f6f6fe;
+    background-color: var(--color-btn-icon-bg);
   }
 }
 // 初始为黑色
@@ -167,8 +184,8 @@ button.el-button.el-button--icon {
   }
   fill: var(--color-white);
   &:hover {
-    background-color: var(--color-btn-default-dark-bg);
-    fill: var(--color-btn-default-dark-hover);
+    background-color: var(--color-btn-default-dark-hover-bg);
+    fill: var(--color-btn-default-dark-hover-bg);
     span {
       color: var(--color-btn-default-dark-hover) !important;
     }

src/styles/theme.scss

@@ -220,7 +220,11 @@
 
   --el-disabled-bg-color: #f4f4f4;
 
+  --color-btn-icon-bg: #f6f6fe;
+
   --color-btn-blue-bg: #f6f6fe;
+
+  --color-btn-default-dark-hover-bg: #2b2f36;
 }
 
 :root.dark {
@@ -264,6 +268,15 @@
   --color-user-config-title-bottom-border: #3f434a;
 
   --color-btn-blue-bg: rgba(255, 255, 255, 0);
+
+  --color-el-btn-pain-theme-border: #ed6d00;
+  --color-el-btn-pain-theme-text: #ed6d00;
+  --color-el-btn-pain-theme-bg: rgba(237, 109, 0, 0.1);
+  --color-el-btn-pain-theme-bg-hover: rgba(237, 109, 0, 0.3);
+
+  --color-btn-default-dark-hover-bg: #d56200;
+
+  --color-btn-icon-bg: #3f434a;
   // 滚动条
   --color-scrollbar-thumb: #656f7d;
 

src/views/Booking/src/components/BookingTable/src/BookingTable.vue

@@ -7,7 +7,9 @@ import dayjs from 'dayjs'
 import { ref, onMounted } from 'vue'
 import { useRouter } from 'vue-router'
 import { transportationMode } from '@/components/TransportationMode'
+import { useThemeStore } from '@/stores/modules/theme'
 
+const themeStore = useThemeStore()
 const router = useRouter()
 const props = defineProps({
   height: {
@@ -430,7 +432,11 @@ defineExpose({
     <div class="table-tools">
       <div class="left-total-records">{{ selectedNumber }} Selected</div>
       <div class="right-tools-btn">
-        <el-button class="el-button--main" @click="handleDownload">
+        <el-button
+          :class="{ 'el-button--pain-theme': themeStore.theme === 'dark' }"
+          class="el-button--main"
+          @click="handleDownload"
+        >
           <span style="margin-right: 8px" class="font_family icon-icon_download_b"></span>
           Download
         </el-button>

src/views/Layout/src/components/Header/HeaderView.vue

@@ -252,9 +252,10 @@ const handleLogin = () => {
         </template>
       </el-popover>
       <el-button
+        :class="{ 'el-button--pain-theme': themeStore.theme === 'dark' }"
         v-if="!userStore.username || (userStore.username && userStore.isFirstLogin === true)"
         class="el-button--main"
-        style="padding: 8px 10px"
+        style="padding: 8px 10px; margin-right: 10px; margin-left: 0"
         plain
         @click="handleDownload"
       >

src/views/Tracking/src/components/TrackingDetail/src/components/AttachmentView.vue

@@ -59,9 +59,6 @@ watch(
         }
       ]
       tableData.value.data = attachment.document_data
-      // nextTick(() => {
-      //   tableRef.value && autoWidth(tableData.value, tableRef.value)
-      // })
     }
   },
   {

src/views/Tracking/src/components/TrackingDetail/src/components/MapView.vue

@@ -417,8 +417,8 @@ onMounted(() => {
   }
 }
 /* 示例：将所有地图元素的颜色反转 */
-.leaflet-container img {
-  filter: invert(1) hue-rotate(10deg);
+.leaflet-container {
+  filter: invert(1) hue-rotate(200deg);
 }
 /* 自定义重置缩放按钮控件样式 */
 .reset-zoom-control {

src/views/Tracking/src/components/TrackingTable/src/TrackingTable.vue

@@ -7,6 +7,9 @@ import { useRouter } from 'vue-router'
 import { ref, onMounted } from 'vue'
 import { transportationMode } from '@/components/TransportationMode'
 import { useLoadingState } from '@/stores/modules/loadingState'
+import { useThemeStore } from '@/stores/modules/theme'
+
+const themeStore = useThemeStore()
 
 const router = useRouter()
 const props = defineProps({
@@ -520,7 +523,11 @@ defineExpose({
     <div class="table-tools">
       <div class="left-total-records">{{ selectedNumber }} Selected</div>
       <div class="right-tools-btn">
-        <el-button class="el-button--main" @click="handleDownload">
+        <el-button
+          class="el-button--main"
+          :class="{ 'el-button--pain-theme': themeStore.theme === 'dark' }"
+          @click="handleDownload"
+        >
           <span style="margin-right: 8px" class="font_family icon-icon_download_b"></span>
           Download
         </el-button>