diff --git a/src/assets/less/themeType.less b/src/assets/less/themeType.less index e6048a6..606877b 100644 --- a/src/assets/less/themeType.less +++ b/src/assets/less/themeType.less @@ -23,3 +23,17 @@ .body-d-right.light { padding: 0 16px; } + +//路线导航-light +.center-map .route-navigation.light { + background: #E4E8F9 !important; + --cardFontColor: #607ddb; + --cardFontFFF: #fff; + --cardBgColor: #e4e8f9; + --circelBg: #1478f5; +} + +//路线导航-dark +.center-map .route-navigation.dark { + background: #002e64; +} diff --git a/src/components/chinaMap/chinaMap.vue b/src/components/chinaMap/chinaMap.vue index a4bd900..2c5b54b 100644 --- a/src/components/chinaMap/chinaMap.vue +++ b/src/components/chinaMap/chinaMap.vue @@ -228,8 +228,6 @@ * @param callback */ function searchRoute(callback: ((this: MediaQueryList, ev: MediaQueryListEvent) => any) | null) { - searchFlag.value = true; - showRoutePanel.value = false; panelTitle.value = ''; if (!formState.value.start) { @@ -238,6 +236,7 @@ if (!formState.value.end) { return message.warn('请输入终点'); } + searchFlag.value = true; //基本地图加载 let map = new AMap.Map('container', { resizeEnable: true, @@ -283,6 +282,7 @@ function removeInput() { formState.value.start = ''; formState.value.end = ''; + searchFlag.value = false; } // 驾车路线 @@ -395,7 +395,7 @@ .search-btn { margin-left: 10px; - width: 88px; + width: 120px; height: 32px; color: #efefef; background: #45a2ff; diff --git a/src/components/xianMap/xianMap.vue b/src/components/xianMap/xianMap.vue index 017243a..e10c5fe 100644 --- a/src/components/xianMap/xianMap.vue +++ b/src/components/xianMap/xianMap.vue @@ -6,7 +6,7 @@ {{ item.name }} -
+
@@ -87,6 +87,7 @@ import { useDetailStore } from '/@/store/modules/detailData.ts'; import RoutePanel from '/@/components/xianMap/components/routePanel.vue'; import { innerLineLight, outerLineOption } from '/@/assets/mapUtils/mapConstant.ts'; + import { useTheme } from '/@/hooks/theme/useTheme.ts'; const props = defineProps({ //是否展示底部统计 @@ -124,6 +125,7 @@ }, }, }); + const { themeType } = useTheme(); const emits = defineEmits(['clearHospitalList']); const useDetail = useDetailStore(); const formState = ref({ @@ -131,7 +133,7 @@ end: '', }); const list = ref(tabList); - const currentIndex = ref(0); + const currentIndex = ref(6); function changeTab(item, i: number) { currentIndex.value = i; // 地方医院 @@ -234,7 +236,6 @@ * @param callback */ function searchRoute(callback: ((this: MediaQueryList, ev: MediaQueryListEvent) => any) | null) { - console.log('search.....'); showRoutePanel.value = false; panelTitle.value = ''; if (!formState.value.start) { @@ -288,6 +289,7 @@ function removeInput() { formState.value.start = ''; formState.value.end = ''; + searchFlag.value = false; } // 驾车路线 @@ -362,13 +364,13 @@ } .route-navigation { + --fontColor: #607ddb; margin: 12px 0; width: 100%; height: 46px; display: flex; align-items: center; justify-content: center; - background: #002e64; border-radius: 6px; position: absolute; top: 36px; @@ -377,15 +379,19 @@ :deep(.form-item-self) { label { - color: #29f1fa; + color: var(--fontColor) !important; } .ant-input { width: 280px; - color: #d6d9e0; - background: #2a4164; border-radius: 2px 2px 2px 2px; - border: 1px solid #1b7ef2; + color: var(--fontColor); + background: #d7ddf6; + border: 1px solid #a8bcff; + + &::placeholder { + color: var(--fontColor); + } } } @@ -393,19 +399,18 @@ width: 64px; height: 32px; border-radius: 5px; - color: #45a2ff; - background: #002e64; - border: 1px solid #45a2ff; + color: var(--fontColor); + background: #c7d4ff; + border: 1px solid #7092ff; } .search-btn { margin-left: 10px; - width: 100px; + width: 120px; height: 32px; - color: #efefef; - background: #45a2ff; + color: #fff; + background: #6d8bf1; border-radius: 5px; - border-color: #45a2ff; } .line-container { @@ -417,19 +422,20 @@ min-height: 200px; max-height: 473px; overflow: auto; - background: #2a4164; + background: var(--cardBgColor); border-radius: 2px; - border: 1px solid #1b7ef2; + //border: 1px solid #1b7ef2; .line-title { margin-bottom: 9px; font-size: 14px; font-weight: 700; - color: rgba(255, 255, 255, 0.8); + color: var(--cardFontColor); } .line-content { font-size: 12px; + color: var(--cardFontColor); .start { display: flex; @@ -437,7 +443,7 @@ &::before { content: '起'; - color: #fff; + color: var(--cardFontFFF); width: 20px; height: 20px; margin-right: 7px; @@ -445,7 +451,7 @@ align-items: center; justify-content: center; border-radius: 50%; - background: #1478f5; + background: var(--circelBg); } } @@ -455,7 +461,7 @@ &::before { content: '终'; - color: #fff; + color: var(--cardFontFFF); width: 20px; height: 20px; margin-right: 7px; @@ -463,23 +469,23 @@ align-items: center; justify-content: center; border-radius: 50%; - background: #1478f5; + background: var(--circelBg); } } .line-body { display: flex; - //max-height: 370px; + color: var(--cardFontColor); } .line { width: 1px; //max-height: 370px; - background-color: #1478f5; + background-color: var(--circelBg); margin: 5px 19px 5px 8px; } - .line-sesc { + .line-desc { flex: 1; } }