renkang/xj-screen
7
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

update 调整样式·

Browse Source
This commit is contained in:
zk
2024-06-15 13:52:49 +08:00
parent f6129b7aa4
commit e16b9e054e
3 changed files with 48 additions and 28 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/assets/less/themeType.less
+14
View File
@@ -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;
}
src/components/chinaMap/chinaMap.vue
+3 -3
View File
@@ -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;
src/components/xianMap/xianMap.vue
+31 -25
View File
@@ -6,7 +6,7 @@
{{ item.name }}
</div>
</div>
<div v-show="currentIndex == list.length - 1" class="route-navigation">
<div v-show="currentIndex == list.length - 1" class="route-navigation" :class="[themeType]">
<a-form :model="formState" layout="inline">
<a-form-item class="form-item-self" label="起点">
<a-input v-model:value="formState.start" placeholder="请输入起点"></a-input>
@@ -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;
}
}