117 lines
3.5 KiB
Vue
117 lines
3.5 KiB
Vue
|
<template>
|
|||
|
|
<div class="bg-[#ffffff] pb-5">
|
|||
|
|
<div class="box_6 flex-col px-4 py-3">
|
|||
|
|
<div class="group_1">
|
|||
|
|
<div class="flex section_4 justify-start items-center mb-2">
|
|||
|
|
<div>
|
|||
|
|
<img class="thumbnail_1 w-6 h-6" referrerpolicy="no-referrer" src="public/images/home.png" />
|
|||
|
|
</div>
|
|||
|
|
<div class="text_13 text-sm mt-1 sm:mt-0">您的位置：首页>联系我们</div>
|
|||
|
|
</div>
|
|||
|
|
<div class="text_14 text-center text-xl font-bold my-3">联系我们</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
<div class="z-10 px-4 mt-4">
|
|||
|
|
<img class="w-full mb-4" referrerpolicy="no-referrer" :src="hospitalInfo.image" />
|
|||
|
|
<div>
|
|||
|
|
<div class="flex flex-row items-center mb-2">
|
|||
|
|
<div>
|
|||
|
|
<img class="" referrerpolicy="no-referrer" src="public/images/k7.png" />
|
|||
|
|
</div>
|
|||
|
|
<div class="text-lg font-bold ml-3">医院介绍</div>
|
|||
|
|
</div>
|
|||
|
|
<div>
|
|||
|
|
{{ hospitalInfo.description }}
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
<div class="z-10 px-4 mt-4">
|
|||
|
|
<div class="text-lg font-bold text-center">医院位置</div>
|
|||
|
|
<div>
|
|||
|
|
<baidu-map @ready="onBaiduMapReady" class="map" ak="OCHRqb6XXcOh9LH7H6c67c6xAoGxznQF" v="3.0" type="API"
|
|||
|
|
:zoom="18" :center="centerVal">
|
|||
|
|
<bm-marker @click="isShowInfoWindow = true" :position="{ lng: 114.221199, lat: 32.137085 }">
|
|||
|
|
</bm-marker>
|
|||
|
|
<bm-info-window @close="isShowInfoWindow = false" :show="isShowInfoWindow"
|
|||
|
|
:position="{ lng: 114.221199, lat: 32.137085 }" :width="100" :max-width="300">
|
|||
|
|
<div>
|
|||
|
|
信阳第五人民医院
|
|||
|
|
</div>
|
|||
|
|
</bm-info-window>
|
|||
|
|
</baidu-map>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</template>
|
|||
|
|
|
|||
|
|
<script setup lang="ts">
|
|||
|
|
import { onMounted } from 'vue';
|
|||
|
|
import { BaiduMap, BmGeolocation, BmControl, BmInfoWindow, BmMarker } from 'vue-baidu-map-3x'
|
|||
|
|
import $api from '@/service/webRequest'
|
|||
|
|
const router = useRouter()
|
|||
|
|
const isShowInfoWindow = ref(true);
|
|||
|
|
// 百度地图默认定位
|
|||
|
|
const centerVal = ref({ lng: 114.221199, lat: 32.137085 });
|
|||
|
|
const onBaiduMapReady = (map: any) => {
|
|||
|
|
console.log(map);
|
|||
|
|
}
|
|||
|
|
onMounted(() => {
|
|||
|
|
const coMobile = /Mobi|Android|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent);
|
|||
|
|
if (coMobile) {
|
|||
|
|
router.push('/phone_about')
|
|||
|
|
} else {
|
|||
|
|
router.push('/about')
|
|||
|
|
}
|
|||
|
|
getHospitalInfo();
|
|||
|
|
});
|
|||
|
|
//医院简介
|
|||
|
|
const hospitalInfo = ref({});
|
|||
|
|
const getHospitalInfo = () => {
|
|||
|
|
$api.post("/api/Broadcast/hospital_overview")
|
|||
|
|
.then((res: any) => {
|
|||
|
|
console.log(res)
|
|||
|
|
hospitalInfo.value = res.data.data;
|
|||
|
|
})
|
|||
|
|
.catch((err) => {
|
|||
|
|
console.dir(err)
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
</script>
|
|||
|
|
<style lang="scss" scoped>
|
|||
|
|
@import "@/assets/animate/animate.min.css";
|
|||
|
|
@import "@/assets/css/list.css";
|
|||
|
|
|
|||
|
|
.map {
|
|||
|
|
width: 100%;
|
|||
|
|
height: 300px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.box_6,
|
|||
|
|
.box_7 {
|
|||
|
|
padding: 0px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.text_14 {
|
|||
|
|
font-size: 1.25rem;
|
|||
|
|
margin-top: 30px;
|
|||
|
|
text-align: left;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.text_15 {
|
|||
|
|
font-size: 1rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.text_16 {
|
|||
|
|
font-size: 0.875rem;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.group_1 {
|
|||
|
|
padding-left: 30px;
|
|||
|
|
}
|
|||
|
|
</style>
|
|||
|
|
<style>
|
|||
|
|
img {
|
|||
|
|
max-width: none !important;
|
|||
|
|
}
|
|||
|
|
</style>
|