继续制作

This commit is contained in:
王创世 2025-04-08 18:04:28 +08:00
parent a075a79f88
commit 3735567b36
22 changed files with 2860 additions and 425 deletions

1
.npmrc
View File

@ -1 +1,2 @@
shamefully-hoist=true shamefully-hoist=true
engine-strict=false

11
app.vue
View File

@ -1,10 +1,15 @@
<template> <template>
<n-config-provider :locale="zhCN" :date-locale="dateZhCN">
<AppHeader /> <AppHeader />
<NuxtPage /> <NuxtPage />
<AppFooter /> <AppFooter />
</n-config-provider>
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>
import { defineComponent } from 'vue'
import { NConfigProvider } from 'naive-ui'
import { zhCN, dateZhCN } from 'naive-ui'
import $api from '@/service/webRequest' import $api from '@/service/webRequest'
import { useStore } from '~/store' import { useStore } from '~/store'
import { useI18n } from 'vue-i18n' import { useI18n } from 'vue-i18n'
@ -28,14 +33,10 @@ const checkIfMobile = () => {
// //
const coMobile = /Mobi|Android|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent); const coMobile = /Mobi|Android|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent);
if (coMobile) { if (coMobile) {
console.log('访问自手机端或平板');
isMobile.value = true; isMobile.value = true;
//sessionStorage.setItem('isMobile', '1');
router.push('/phone_index') router.push('/phone_index')
} else { } else {
console.log('访问自PC端');
isMobile.value = false; isMobile.value = false;
//sessionStorage.setItem('isMobile', '0');
router.push('/') router.push('/')
} }
}; };
@ -46,6 +47,7 @@ const checkIfMobile = () => {
height: 100%; height: 100%;
width: 100%; width: 100%;
} }
html, html,
body { body {
position: relative; position: relative;
@ -60,5 +62,4 @@ const checkIfMobile = () => {
margin: 0; margin: 0;
padding: 0; padding: 0;
} }
</style> </style>

1289
assets/css/about.css Normal file

File diff suppressed because it is too large Load Diff

View File

@ -392,13 +392,11 @@
} }
.text-group_13 { .text-group_13 {
width: 136px;
height: 18px; height: 18px;
margin: 12px 0 0 9px; margin: 12px 5px 0 9px;
} }
.text_14 { .text_14 {
width: 54px;
height: 18px; height: 18px;
overflow-wrap: break-word; overflow-wrap: break-word;
color: rgba(50, 50, 50, 1); color: rgba(50, 50, 50, 1);
@ -406,13 +404,10 @@
font-family: Source Han Serif CN-Heavy; font-family: Source Han Serif CN-Heavy;
font-weight: 900; font-weight: 900;
text-align: center; text-align: center;
white-space: nowrap;
line-height: 18px; line-height: 18px;
} }
.text_15 { .text_15 {
width: 70px;
height: 14px;
overflow-wrap: break-word; overflow-wrap: break-word;
color: rgba(87, 209, 200, 1); color: rgba(87, 209, 200, 1);
font-size: 14px; font-size: 14px;
@ -422,6 +417,8 @@
white-space: nowrap; white-space: nowrap;
line-height: 14px; line-height: 14px;
margin-top: 4px; margin-top: 4px;
margin-left: 10px;
} }
.text_16 { .text_16 {
@ -1816,8 +1813,9 @@
font-family: Source Han Serif CN-Regular; font-family: Source Han Serif CN-Regular;
font-weight: NaN; font-weight: NaN;
text-align: left; text-align: left;
line-height: 20px; line-height: 22px;
margin: 16px 0 34px 30px; margin: 16px;
text-indent: 2em;
} }
.box_27 { .box_27 {
@ -1962,7 +1960,7 @@
} }
.block_9 { .block_9 {
width: 1183px; width: 70%;
height: 111px; height: 111px;
margin: 23px 0 0 358px; margin: 23px 0 0 358px;
} }
@ -2476,6 +2474,10 @@
margin: 20px 0 53px 658px; margin: 20px 0 53px 658px;
} }
.text-wrapper_63 span {
cursor: pointer;
}
@media screen and (max-width: 1440px) { @media screen and (max-width: 1440px) {
.text-wrapper_63 { .text-wrapper_63 {
margin: 20px 0 0 349px; margin: 20px 0 0 349px;
@ -2736,6 +2738,7 @@ button:active {
display: flex; display: flex;
align-items: flex-end; align-items: flex-end;
} }
.group_6 .swiper-slide img { .group_6 .swiper-slide img {
width: 100%; width: 100%;
height: 500px; height: 500px;
@ -2743,7 +2746,21 @@ button:active {
transition: 1s linear 2s; transition: 1s linear 2s;
transform: scale(1.1, 1.1); transform: scale(1.1, 1.1);
} }
.group_6 .swiper-slide-active img,.swiper-slide-duplicate-active img{
.group_6 .swiper-slide-active img,
.swiper-slide-duplicate-active img {
transition: 6s linear; transition: 6s linear;
transform: scale(1, 1); transform: scale(1, 1);
} }
.left-my-news {
height: 800px;
}
.my_text_3{
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 3; /* 限制为两行 */
overflow: hidden;
text-overflow: ellipsis; /* 超出部分显示省略号 */
}

View File

@ -370,7 +370,7 @@
} }
.image-text_7 { .image-text_7 {
width: 948px; width: 72%;
height: 135px; height: 135px;
margin: 38px 152px 0 41px; margin: 38px 152px 0 41px;
} }
@ -397,20 +397,17 @@
.text_15 { .text_15 {
width: 537px; width: 537px;
height: 18px;
overflow-wrap: break-word; overflow-wrap: break-word;
color: rgba(50, 50, 50, 1); color: rgba(50, 50, 50, 1);
font-size: 20px; font-size: 20px;
font-family: Microsoft YaHei-Regular; font-family: Microsoft YaHei-Regular;
font-weight: NaN; font-weight: NaN;
text-align: left; text-align: left;
white-space: nowrap;
line-height: 18px; line-height: 18px;
} }
.text_16 { .text_16 {
width: 708px; width: 708px;
height: 38px;
overflow-wrap: break-word; overflow-wrap: break-word;
color: rgba(153, 153, 153, 1); color: rgba(153, 153, 153, 1);
font-size: 14px; font-size: 14px;
@ -439,7 +436,7 @@
} }
.text-wrapper_11 { .text-wrapper_11 {
width: 100%; width: 126px;
height: 210px; height: 210px;
justify-content: flex-center; justify-content: flex-center;
} }

View File

@ -52,22 +52,24 @@
<span class="text_103">中医科门诊</span> <span class="text_103">中医科门诊</span>
<span class="text_104">妇产科门诊</span> <span class="text_104">妇产科门诊</span>
</div> </div>
<div class="section_5 flex-col"></div> <div class="flex flex-row" style="gap: 30px;margin-left: 50px;">
<div class="section_6 flex-col"></div> <div v-for="item in broadcast" class="text-center">
<a :href="item.live_address" target="_blank">
<img src="public/images/y1.png" width="150px" height="150px" alt="服务号">
</a>
<div style="color: #ffffff;font-size: 15px;margin-top: 10px;">{{ item.title }}</div>
</div>
</div>
</div> </div>
<div class="text-wrapper_63 flex-row"> <div class="text-wrapper_63 flex-row">
<span class="text_105">来院路线</span> <span class="text_105">来院路线</span>
<span class="text_106">内科病区</span> <span class="text_106">内科病区</span>
<span class="text_107">妇产科门诊</span> <span class="text_107">妇产科门诊</span>
<span class="text_108">妇产科门诊</span> <span class="text_108">妇产科门诊</span>
<span class="text_109">服务号</span>
<span class="text_110">订阅号</span>
<span class="text_111">来院路线</span> <span class="text_111">来院路线</span>
<span class="text_112">内科病区</span> <span class="text_112">内科病区</span>
<span class="text_113">妇产科门诊</span> <span class="text_113">妇产科门诊</span>
<span class="text_114">妇产科门诊</span> <span class="text_114">妇产科门诊</span>
<span class="text_115">服务号</span>
<span class="text_116">订阅号</span>
</div> </div>
<div style="background-color: rgba(26, 172, 162, 1);padding-bottom: 20px;text-align: center;color: #ffffff;"> <div style="background-color: rgba(26, 172, 162, 1);padding-bottom: 20px;text-align: center;color: #ffffff;">
<a href="https://beian.miit.gov.cn/" target="_blank">ICP备2025118630号</a> <a href="https://beian.miit.gov.cn/" target="_blank">ICP备2025118630号</a>
@ -132,7 +134,7 @@
<script setup> <script setup>
import { ref, onMounted, onUnmounted, reactive } from 'vue'; import { ref, onMounted, onUnmounted, reactive } from 'vue';
import $api from '@/service/webRequest'
// //
const isMobile = ref(false); const isMobile = ref(false);
@ -165,6 +167,7 @@ const checkIfMobile = () => {
onMounted(() => { onMounted(() => {
// //
checkIfMobile(); checkIfMobile();
getBroadcast();
// //
window.addEventListener('resize', checkIfMobile); window.addEventListener('resize', checkIfMobile);
}); });
@ -173,6 +176,19 @@ onMounted(() => {
onUnmounted(() => { onUnmounted(() => {
window.removeEventListener('resize', checkIfMobile); window.removeEventListener('resize', checkIfMobile);
}); });
const broadcast = ref([]);
const getBroadcast = () => {
$api.post("/api/Broadcast/wl_url")
.then((res) => {
console.log(res);
broadcast.value = res.data.data;
})
.catch((err) => {
console.dir(err)
})
}
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
@ -345,15 +361,19 @@ onUnmounted(() => {
} }
} }
} }
.text-wrapper_59 span { .text-wrapper_59 span {
cursor: pointer; cursor: pointer;
} }
.text-wrapper_60 span { .text-wrapper_60 span {
cursor: pointer; cursor: pointer;
} }
.text-wrapper_61 span { .text-wrapper_61 span {
cursor: pointer; cursor: pointer;
} }
.text-wrapper_62 span { .text-wrapper_62 span {
cursor: pointer; cursor: pointer;
} }

View File

@ -1,11 +1,13 @@
<template> <template>
<div class="box_32 flex-col"> <div class="box_32 flex-col">
<div class="section_1 flex-row justify-center" :style="!isMobile ? 'padding-top: 25px;height: 110px;' : 'padding-top: 0;height: 50px;'"> <div class="section_1 flex-row justify-center"
:style="!isMobile ? 'padding-top: 25px;height: 110px;' : 'padding-top: 0;height: 50px;'">
<!-- <div class="box_1 flex-col"></div> --> <!-- <div class="box_1 flex-col"></div> -->
<div class="text_1">信阳第五人民医院</div> <div class="text_1">信阳第五人民医院</div>
<!-- 手机端菜单按钮 --> <!-- 手机端菜单按钮 -->
<div v-if="isMobile" class="mobile-menu-button" @click="toggleMobileMenu"> <div v-if="isMobile" class="mobile-menu-button" @click="toggleMobileMenu">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"
stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<line x1="3" y1="12" x2="21" y2="12"></line> <line x1="3" y1="12" x2="21" y2="12"></line>
<line x1="3" y1="6" x2="21" y2="6"></line> <line x1="3" y1="6" x2="21" y2="6"></line>
<line x1="3" y1="18" x2="21" y2="18"></line> <line x1="3" y1="18" x2="21" y2="18"></line>
@ -16,49 +18,18 @@
<!-- 桌面端菜单 --> <!-- 桌面端菜单 -->
<div v-if="!isMobile" class="section_2 flex-row"> <div v-if="!isMobile" class="section_2 flex-row">
<div :class="isLinl==0?'group_2 flex-col':'group_4 flex-col'" @click="isLinl=0"> <div :class="isLinl == 0 ? 'group_2 flex-col' : 'group_4 flex-col'" @click="openLinl(0)">
<span class="text_2">首页</span> <span class="text_2">首页</span>
<div v-if="isLinl == 0" class="group_3 flex-col"></div> <div v-if="isLinl == 0" class="group_3 flex-col"></div>
</div> </div>
<div :class="isLinl==1?'group_2 flex-col':'group_4 flex-col'" @click="isLinl=1"> <div :class="isLinl == -1 ? 'group_2 flex-col' : 'group_4 flex-col'" @click="openLinl(-1)">
<span class="text_3">医院概况</span> <span class="text_3">医院概况</span>
<div v-if="isLinl==1" class="group_3 flex-col"></div> <div v-if="isLinl == -1" class="group_3 flex-col"></div>
</div> </div>
<div :class="isLinl==2?'group_2 flex-col':'group_4 flex-col'" @click="isLinl=2"> <div v-for="(item, index) in groupList" :key="item.id"
<span class="text_3">党建工作</span> :class="isLinl == item.id ? 'group_2 flex-col' : 'group_4 flex-col'" @click="isOpneLinl(item)">
<div v-if="isLinl==2" class="group_3 flex-col"></div> <span class="text_3">{{ item.name }}</span>
</div> <div v-if="isLinl == item.id" class="group_3 flex-col"></div>
<div :class="isLinl==3?'group_2 flex-col':'group_4 flex-col'" @click="isLinl=3">
<span class="text_3">医生团队</span>
<div v-if="isLinl==3" class="group_3 flex-col"></div>
</div>
<div :class="isLinl==4?'group_2 flex-col':'group_4 flex-col'" @click="isLinl=4">
<span class="text_3">科室介绍</span>
<div v-if="isLinl==4" class="group_3 flex-col"></div>
</div>
<div :class="isLinl==5?'group_2 flex-col':'group_4 flex-col'" @click="isLinl=5">
<span class="text_3">招聘信息</span>
<div v-if="isLinl==5" class="group_3 flex-col"></div>
</div>
<div :class="isLinl==6?'group_2 flex-col':'group_4 flex-col'" @click="isLinl=6">
<span class="text_3">健康科普</span>
<div v-if="isLinl==6" class="group_3 flex-col"></div>
</div>
<div :class="isLinl==7?'group_2 flex-col':'group_4 flex-col'" @click="isLinl=7">
<span class="text_3">院务公开</span>
<div v-if="isLinl==7" class="group_3 flex-col"></div>
</div>
<div :class="isLinl==8?'group_2 flex-col':'group_4 flex-col'" @click="isLinl=8">
<span class="text_3">患者服务</span>
<div v-if="isLinl==8" class="group_3 flex-col"></div>
</div>
<div :class="isLinl==9?'group_2 flex-col':'group_4 flex-col'" @click="isLinl=9">
<span class="text_3">紧急服务</span>
<div v-if="isLinl==9" class="group_3 flex-col"></div>
</div>
<div :class="isLinl==10?'group_2 flex-col':'group_4 flex-col'" @click="isLinl=10">
<span class="text_3">科研成果</span>
<div v-if="isLinl==10" class="group_3 flex-col"></div>
</div> </div>
</div> </div>
@ -66,15 +37,8 @@
<div v-if="isMobile && mobileMenuOpen" class="mobile-menu"> <div v-if="isMobile && mobileMenuOpen" class="mobile-menu">
<div class="mobile-menu-item" :class="{ 'active': isLinl == 0 }" @click="selectMenuItem(0)">首页</div> <div class="mobile-menu-item" :class="{ 'active': isLinl == 0 }" @click="selectMenuItem(0)">首页</div>
<div class="mobile-menu-item" :class="{ 'active': isLinl == 1 }" @click="selectMenuItem(1)">医院概况</div> <div class="mobile-menu-item" :class="{ 'active': isLinl == 1 }" @click="selectMenuItem(1)">医院概况</div>
<div class="mobile-menu-item" :class="{'active': isLinl == 2}" @click="selectMenuItem(2)">党建工作</div> <div v-for="(item, index) in groupList" :key="item.id" class="mobile-menu-item"
<div class="mobile-menu-item" :class="{'active': isLinl == 3}" @click="selectMenuItem(3)">医生团队</div> :class="{ 'active': isLinl == item.id }" @click="isOpneLinl(item)">{{ item.name }}</div>
<div class="mobile-menu-item" :class="{'active': isLinl == 4}" @click="selectMenuItem(4)">科室介绍</div>
<div class="mobile-menu-item" :class="{'active': isLinl == 5}" @click="selectMenuItem(5)">招聘信息</div>
<div class="mobile-menu-item" :class="{'active': isLinl == 6}" @click="selectMenuItem(6)">健康科普</div>
<div class="mobile-menu-item" :class="{'active': isLinl == 7}" @click="selectMenuItem(7)">院务公开</div>
<div class="mobile-menu-item" :class="{'active': isLinl == 8}" @click="selectMenuItem(8)">患者服务</div>
<div class="mobile-menu-item" :class="{'active': isLinl == 9}" @click="selectMenuItem(9)">紧急服务</div>
<div class="mobile-menu-item" :class="{'active': isLinl == 10}" @click="selectMenuItem(10)">科研成果</div>
</div> </div>
</div> </div>
</template> </template>
@ -89,22 +53,19 @@ const route = useRoute()
const isMenuOpen = ref(false) const isMenuOpen = ref(false)
const { locale } = useI18n() const { locale } = useI18n()
const isLinl = ref(0) const isLinl = ref(0)
import $api from '@/service/webRequest'
// //
const isMobile = ref(false) const isMobile = ref(false)
const mobileMenuOpen = ref(false) const mobileMenuOpen = ref(false)
const router = useRouter()
// //
const checkIfMobile = () => { const checkIfMobile = () => {
console.log(window.innerWidth); console.log(window.innerWidth);
// //
const coMobile = /Mobi|Android|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent); const coMobile = /Mobi|Android|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent);
if (coMobile) { if (coMobile) {
console.log('访问自手机端或平板');
isMobile.value = true isMobile.value = true
} else { } else {
console.log('访问自PC端');
isMobile.value = false isMobile.value = false
} }
} }
@ -120,17 +81,62 @@ const selectMenuItem = (index: number) => {
if (isMobile.value) { if (isMobile.value) {
mobileMenuOpen.value = false mobileMenuOpen.value = false
} }
if (index == 0) {
sessionStorage.setItem('group_id', '0')
router.push('/');
} else {
sessionStorage.setItem('group_id', '-1')
window.location.href = `/about`
}
}
const isOpneLinl = (item: any) => {
console.log(item);
isLinl.value = item.id;
sessionStorage.setItem('group_id', item.id)
mobileMenuOpen.value = false
router.push(`/list/${item.id}`)
}
const openLinl = (item) => {
isLinl.value = item;
mobileMenuOpen.value = false
if (item == 0) {
sessionStorage.setItem('group_id', '0')
router.push('/');
} else {
sessionStorage.setItem('group_id', '-1')
//
window.location.href = `/about`
}
} }
// //
onMounted(() => { onMounted(() => {
if (route.path == '/about') {
isLinl.value = -1
} else {
isLinl.value = Number(sessionStorage.getItem('group_id'))
}
checkIfMobile() checkIfMobile()
window.addEventListener('resize', checkIfMobile) window.addEventListener('resize', checkIfMobile)
getGroupList()
}) })
onUnmounted(() => { onUnmounted(() => {
window.removeEventListener('resize', checkIfMobile) window.removeEventListener('resize', checkIfMobile)
}) })
const groupList = ref([])
const getGroupList = () => {
$api.post("/api/news/group", { flag: 'top' })
.then((res: any) => {
console.log(res)
groupList.value = res.data.data;
//
groupList.value.splice(0, 0, { id: -3, name: '医生团队' });
})
.catch((err) => {
console.dir(err)
})
}
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>

View File

@ -10,15 +10,6 @@ export default defineNuxtConfig({
'/**': { trailingSlash: false } '/**': { trailingSlash: false }
} }
}, },
router: {
// extendRoutes(routes, resolve) {
// routes.push({
// name: 'index_info',
// path: '/params/:param1', // * 表示可选的多个参数
// component: resolve(__dirname, 'pages/index_info.vue')
// });
// }
},
ssr: false, ssr: false,
css: [ css: [
'swiper/css', 'swiper/css',
@ -39,7 +30,7 @@ export default defineNuxtConfig({
server: { server: {
proxy: { proxy: {
'/api': { '/api': {
target: "https://www.navigatortrades.com/", target: "http://192.168.10.140/",
changeOrigin: true, changeOrigin: true,
rewrite: (path) => path.replace(/^\/api/, ''), rewrite: (path) => path.replace(/^\/api/, ''),
} }

137
package-lock.json generated
View File

@ -15,6 +15,7 @@
"nuxt-icons": "^3.2.1", "nuxt-icons": "^3.2.1",
"pinia": "^2.1.7", "pinia": "^2.1.7",
"swiper": "^11.2.5", "swiper": "^11.2.5",
"vue-baidu-map-3x": "^1.0.40",
"vue-i18n": "^9.8.0", "vue-i18n": "^9.8.0",
"vue-swiper-animate": "^1.0.0" "vue-swiper-animate": "^1.0.0"
}, },
@ -1891,25 +1892,24 @@
} }
}, },
"node_modules/@nuxt/telemetry": { "node_modules/@nuxt/telemetry": {
"version": "2.6.5", "version": "2.6.6",
"resolved": "https://registry.npmjs.org/@nuxt/telemetry/-/telemetry-2.6.5.tgz", "resolved": "https://registry.npmjs.org/@nuxt/telemetry/-/telemetry-2.6.6.tgz",
"integrity": "sha512-lwMp9OHML/m0mjh7P5iz9PxINnk5smGkGebh88Wh8PjvnRooY1TBsbyq7mlSrNibpwD1BkwqhV5IAZOXWHLxMQ==", "integrity": "sha512-Zh4HJLjzvm3Cq9w6sfzIFyH9ozK5ePYVfCUzzUQNiZojFsI2k1QkSBrVI9BGc6ArKXj/O6rkI6w7qQ+ouL8Cag==",
"dev": true, "dev": true,
"license": "MIT", "license": "MIT",
"dependencies": { "dependencies": {
"@nuxt/kit": "^3.15.4", "@nuxt/kit": "^3.15.4",
"citty": "^0.1.6", "citty": "^0.1.6",
"consola": "^3.4.0", "consola": "^3.4.2",
"destr": "^2.0.3", "destr": "^2.0.3",
"dotenv": "^16.4.7", "dotenv": "^16.4.7",
"git-url-parse": "^16.0.0", "git-url-parse": "^16.0.1",
"is-docker": "^3.0.0", "is-docker": "^3.0.0",
"ofetch": "^1.4.1", "ofetch": "^1.4.1",
"package-manager-detector": "^0.2.9", "package-manager-detector": "^1.1.0",
"parse-git-config": "^3.0.0", "pathe": "^2.0.3",
"pathe": "^2.0.2",
"rc9": "^2.1.2", "rc9": "^2.1.2",
"std-env": "^3.8.0" "std-env": "^3.8.1"
}, },
"bin": { "bin": {
"nuxt-telemetry": "bin/nuxt-telemetry.mjs" "nuxt-telemetry": "bin/nuxt-telemetry.mjs"
@ -4467,6 +4467,12 @@
"integrity": "sha512-/hnE/qP5ZoGpol0a5mDi45bOd7t3tjYJBjsgCsivow7D48cJeV5l05RD82lPqi7gRiphZM37rnhW1l6ZoCNNnQ==", "integrity": "sha512-/hnE/qP5ZoGpol0a5mDi45bOd7t3tjYJBjsgCsivow7D48cJeV5l05RD82lPqi7gRiphZM37rnhW1l6ZoCNNnQ==",
"license": "MIT" "license": "MIT"
}, },
"node_modules/@yangjianfei/bmaplib.lushu": {
"version": "1.0.0",
"resolved": "https://registry.npmjs.org/@yangjianfei/bmaplib.lushu/-/bmaplib.lushu-1.0.0.tgz",
"integrity": "sha512-qZVijbgUgNs6tsP1muS67x0XzE5fJ3kFireouDvXO3bUYVV6XbpjZXksQTsggihLMIEvC1DO9GS9vVF8CnEeqQ==",
"license": "MIT"
},
"node_modules/abbrev": { "node_modules/abbrev": {
"version": "3.0.0", "version": "3.0.0",
"resolved": "https://registry.npmjs.org/abbrev/-/abbrev-3.0.0.tgz", "resolved": "https://registry.npmjs.org/abbrev/-/abbrev-3.0.0.tgz",
@ -4929,6 +4935,39 @@
"url": "https://github.com/sponsors/antfu" "url": "https://github.com/sponsors/antfu"
} }
}, },
"node_modules/bmaplib.curveline": {
"version": "1.0.0",
"resolved": "https://registry.npmjs.org/bmaplib.curveline/-/bmaplib.curveline-1.0.0.tgz",
"integrity": "sha512-9wcFMVhiYxNPqpvsLDAADn3qDhNzXp2mA6VyHSHg2XOAgSooC7ZiujdFhy0sp+0QYjTfJ/MjmLuNoUg2HHxH4Q==",
"license": "MIT"
},
"node_modules/bmaplib.distancetool": {
"version": "1.0.2",
"resolved": "https://registry.npmjs.org/bmaplib.distancetool/-/bmaplib.distancetool-1.0.2.tgz",
"integrity": "sha512-EvxMnQRH6xM036zx5OLPyTg5tMCTbFBuGTTHOtExLy2/T0X6v5Va0YE7c3IPm/a/Eo5V/ynYpOLOLZbRY8ccyA==",
"license": "MIT"
},
"node_modules/bmaplib.heatmap": {
"version": "1.0.4",
"resolved": "https://registry.npmjs.org/bmaplib.heatmap/-/bmaplib.heatmap-1.0.4.tgz",
"integrity": "sha512-rmhqUARBpUSJ9jXzUI2j7dIOqnc38bqubkx/8a349U2qtw/ulLUwyzRD535OrA8G7w5cz4aPKm6/rNvUAarg/Q==",
"license": "MIT"
},
"node_modules/bmaplib.markerclusterer": {
"version": "1.0.13",
"resolved": "https://registry.npmjs.org/bmaplib.markerclusterer/-/bmaplib.markerclusterer-1.0.13.tgz",
"integrity": "sha512-VrLyWSiuDEVNi0yUfwOhFQ6z1oEEHS4w36GNu3iASu6p52QIx9uAXMUkuSCHReNR0bj2Cp9SA1dSx5RpojXajQ==",
"license": "MIT",
"dependencies": {
"bmaplib.texticonoverlay": "^1.0.2"
}
},
"node_modules/bmaplib.texticonoverlay": {
"version": "1.0.2",
"resolved": "https://registry.npmjs.org/bmaplib.texticonoverlay/-/bmaplib.texticonoverlay-1.0.2.tgz",
"integrity": "sha512-4ZTWr4ZP3B6qEWput5Tut16CfZgII38YwM3bpyb4gFTQyORlKYryFp9WHWrwZZaHlOyYDAXG9SX0hka43jTADg==",
"license": "MIT"
},
"node_modules/boolbase": { "node_modules/boolbase": {
"version": "1.0.0", "version": "1.0.0",
"resolved": "https://registry.npmjs.org/boolbase/-/boolbase-1.0.0.tgz", "resolved": "https://registry.npmjs.org/boolbase/-/boolbase-1.0.0.tgz",
@ -5539,9 +5578,9 @@
"license": "MIT" "license": "MIT"
}, },
"node_modules/consola": { "node_modules/consola": {
"version": "3.4.0", "version": "3.4.2",
"resolved": "https://registry.npmjs.org/consola/-/consola-3.4.0.tgz", "resolved": "https://registry.npmjs.org/consola/-/consola-3.4.2.tgz",
"integrity": "sha512-EiPU8G6dQG0GFHNR8ljnZFki/8a+cQwEQ+7wpxdChl02Q8HXlwEZWD5lqAF8vC2sEC3Tehr8hy7vErz88LHyUA==", "integrity": "sha512-5IKcdX0nnYavi6G7TtOhwkYzyjfJlatbjMjuLSfE2kYT5pMDOilZ4OvMhi637CcDICTmz3wARPoyhqyX1Y+XvA==",
"license": "MIT", "license": "MIT",
"engines": { "engines": {
"node": "^14.18.0 || >=16.10.0" "node": "^14.18.0 || >=16.10.0"
@ -7301,16 +7340,6 @@
"giget": "dist/cli.mjs" "giget": "dist/cli.mjs"
} }
}, },
"node_modules/git-config-path": {
"version": "2.0.0",
"resolved": "https://registry.npmjs.org/git-config-path/-/git-config-path-2.0.0.tgz",
"integrity": "sha512-qc8h1KIQbJpp+241id3GuAtkdyJ+IK+LIVtkiFTRKRrmddDzs3SI9CvP1QYmWBFvm1I/PWRwj//of8bgAc0ltA==",
"dev": true,
"license": "MIT",
"engines": {
"node": ">=4"
}
},
"node_modules/git-up": { "node_modules/git-up": {
"version": "8.0.1", "version": "8.0.1",
"resolved": "https://registry.npmjs.org/git-up/-/git-up-8.0.1.tgz", "resolved": "https://registry.npmjs.org/git-up/-/git-up-8.0.1.tgz",
@ -9770,14 +9799,11 @@
"license": "BlueOak-1.0.0" "license": "BlueOak-1.0.0"
}, },
"node_modules/package-manager-detector": { "node_modules/package-manager-detector": {
"version": "0.2.11", "version": "1.1.0",
"resolved": "https://registry.npmjs.org/package-manager-detector/-/package-manager-detector-0.2.11.tgz", "resolved": "https://registry.npmjs.org/package-manager-detector/-/package-manager-detector-1.1.0.tgz",
"integrity": "sha512-BEnLolu+yuz22S56CU1SUKq3XC3PkwD5wv4ikR4MfGvnRVcmzXR9DwSlW2fEamyTPyXHomBJRzgapeuBvRNzJQ==", "integrity": "sha512-Y8f9qUlBzW8qauJjd/eu6jlpJZsuPJm2ZAV0cDVd420o4EdpH5RPdoCv+60/TdJflGatr4sDfpAL6ArWZbM5tA==",
"dev": true, "dev": true,
"license": "MIT", "license": "MIT"
"dependencies": {
"quansync": "^0.2.7"
}
}, },
"node_modules/parent-module": { "node_modules/parent-module": {
"version": "1.0.1", "version": "1.0.1",
@ -9792,27 +9818,6 @@
"node": ">=6" "node": ">=6"
} }
}, },
"node_modules/parse-git-config": {
"version": "3.0.0",
"resolved": "https://registry.npmjs.org/parse-git-config/-/parse-git-config-3.0.0.tgz",
"integrity": "sha512-wXoQGL1D+2COYWCD35/xbiKma1Z15xvZL8cI25wvxzled58V51SJM04Urt/uznS900iQor7QO04SgdfT/XlbuA==",
"dev": true,
"license": "MIT",
"dependencies": {
"git-config-path": "^2.0.0",
"ini": "^1.3.5"
},
"engines": {
"node": ">=8"
}
},
"node_modules/parse-git-config/node_modules/ini": {
"version": "1.3.8",
"resolved": "https://registry.npmjs.org/ini/-/ini-1.3.8.tgz",
"integrity": "sha512-JV/yugV2uzW5iMRSiZAyDtQd+nxtUnjeLt0acNdw98kKLrvuRVyB80tsREOE7yvGVgalhZ6RNXCmEHkUKBKxew==",
"dev": true,
"license": "ISC"
},
"node_modules/parse-json": { "node_modules/parse-json": {
"version": "8.1.0", "version": "8.1.0",
"resolved": "https://registry.npmjs.org/parse-json/-/parse-json-8.1.0.tgz", "resolved": "https://registry.npmjs.org/parse-json/-/parse-json-8.1.0.tgz",
@ -12287,6 +12292,12 @@
"node": ">=12.22" "node": ">=12.22"
} }
}, },
"node_modules/tiny-emitter": {
"version": "2.1.0",
"resolved": "https://registry.npmjs.org/tiny-emitter/-/tiny-emitter-2.1.0.tgz",
"integrity": "sha512-NB6Dk1A9xgQPMoGqC5CVXn123gWyte215ONT5Pp5a0yt4nlEoO1ZWeCwpncaekPHXO60i47ihFnZPiRPjRMq4Q==",
"license": "MIT"
},
"node_modules/tiny-invariant": { "node_modules/tiny-invariant": {
"version": "1.3.3", "version": "1.3.3",
"resolved": "https://registry.npmjs.org/tiny-invariant/-/tiny-invariant-1.3.3.tgz", "resolved": "https://registry.npmjs.org/tiny-invariant/-/tiny-invariant-1.3.3.tgz",
@ -13034,9 +13045,9 @@
} }
}, },
"node_modules/vite": { "node_modules/vite": {
"version": "6.2.1", "version": "6.2.5",
"resolved": "https://registry.npmjs.org/vite/-/vite-6.2.1.tgz", "resolved": "https://registry.npmjs.org/vite/-/vite-6.2.5.tgz",
"integrity": "sha512-n2GnqDb6XPhlt9B8olZPrgMD/es/Nd1RdChF6CBD/fHW6pUyUTt2sQW2fPRX5GiD9XEa6+8A6A4f2vT6pSsE7Q==", "integrity": "sha512-j023J/hCAa4pRIUH6J9HemwYfjB5llR2Ps0CWeikOtdR8+pAURAk0DoJC5/mm9kd+UgdnIy7d6HE4EAvlYhPhA==",
"dev": true, "dev": true,
"license": "MIT", "license": "MIT",
"dependencies": { "dependencies": {
@ -13410,6 +13421,25 @@
} }
} }
}, },
"node_modules/vue-baidu-map-3x": {
"version": "1.0.40",
"resolved": "https://registry.npmjs.org/vue-baidu-map-3x/-/vue-baidu-map-3x-1.0.40.tgz",
"integrity": "sha512-Rq3g1KNsNztkuX3SJIuCpy6HE3xHVX8ySgqS2xC3jut/hvVr5kFBS0Nu7uYppk3xYVz69S1JFxU8WUI0Xftpyg==",
"license": "MIT",
"dependencies": {
"@yangjianfei/bmaplib.lushu": "^1.0.0",
"bmaplib.curveline": "^1.0.0",
"bmaplib.distancetool": "^1.0.2",
"bmaplib.heatmap": "^1.0.4",
"bmaplib.markerclusterer": "^1.0.13",
"tiny-emitter": "^2.1.0",
"vue": "^3.2.25",
"vue-router": "^4.0.14"
},
"peerDependencies": {
"vue": "^3.2.25"
}
},
"node_modules/vue-bundle-renderer": { "node_modules/vue-bundle-renderer": {
"version": "2.1.1", "version": "2.1.1",
"resolved": "https://registry.npmjs.org/vue-bundle-renderer/-/vue-bundle-renderer-2.1.1.tgz", "resolved": "https://registry.npmjs.org/vue-bundle-renderer/-/vue-bundle-renderer-2.1.1.tgz",
@ -13514,7 +13544,6 @@
"version": "4.5.0", "version": "4.5.0",
"resolved": "https://registry.npmjs.org/vue-router/-/vue-router-4.5.0.tgz", "resolved": "https://registry.npmjs.org/vue-router/-/vue-router-4.5.0.tgz",
"integrity": "sha512-HDuk+PuH5monfNuY+ct49mNmkCRK4xJAV9Ts4z9UFc4rzdDnxQLyCMGGc8pKhZhHTVzfanpNwB/lwqevcBwI4w==", "integrity": "sha512-HDuk+PuH5monfNuY+ct49mNmkCRK4xJAV9Ts4z9UFc4rzdDnxQLyCMGGc8pKhZhHTVzfanpNwB/lwqevcBwI4w==",
"dev": true,
"license": "MIT", "license": "MIT",
"dependencies": { "dependencies": {
"@vue/devtools-api": "^6.6.4" "@vue/devtools-api": "^6.6.4"

View File

@ -36,6 +36,7 @@
"nuxt-icons": "^3.2.1", "nuxt-icons": "^3.2.1",
"pinia": "^2.1.7", "pinia": "^2.1.7",
"swiper": "^11.2.5", "swiper": "^11.2.5",
"vue-baidu-map-3x": "^1.0.40",
"vue-i18n": "^9.8.0", "vue-i18n": "^9.8.0",
"vue-swiper-animate": "^1.0.0" "vue-swiper-animate": "^1.0.0"
}, },

99
pages/about.vue Normal file
View File

@ -0,0 +1,99 @@
<template>
<div class="bg-[#ffffff] pb-[50px]">
<div class="group_3 flex-col">
<div class="section_1 flex-col">
<div class="flex group_7 flex-row">
<img class="thumbnail_1" referrerpolicy="no-referrer"
src="public/images/home.png" />
<span class="text_13">您的位置首页&gt;系统公告</span>
</div>
<div class="text_14">联系我们</div>
</div>
</div>
<div class="flex box_9 flex-row justify-center">
<div class="flex group_8 flex-col justify-center">
<div class="flex group_9 flex-row justify-between">
<div class="flex image-wrapper_1 flex-col">
<img class="label_1" referrerpolicy="no-referrer"
src="public/images/k7.png" />
</div>
<span class="text_15">医院介绍</span>
</div>
<span class="paragraph_1">
{{ hospitalInfo.description }}
</span>
</div>
<div class="block_2 flex-col relative">
<img class="w-full mb-4" referrerpolicy="no-referrer" :src="hospitalInfo.image" style=" position: absolute;top: -30px;left: -30px;"/>
</div>
</div>
<div class="z-10 mt-10">
<div class="font-bold text-center" style="font-size: 32px;">医院位置</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/css/common.scss";
@import "@/assets/css/about.css";
.map {
width: 100%;
height: 500px;
padding: 40px 360px;
}
@media screen and (max-width: 1440px) {
.map { padding:40px 30px;}
}
</style>
<style>
img {
max-width: none !important;
}
</style>

View File

@ -3,15 +3,13 @@
<div class="group_6 flex-col relative"> <div class="group_6 flex-col relative">
<swiper class="swiper-container w-full" :slides-per-view="1" @swiper="onSwiperNews" <swiper class="swiper-container w-full" :slides-per-view="1" @swiper="onSwiperNews"
v-bind="swiperOptionsNews" @slideChange="onSlideChangeNews"> v-bind="swiperOptionsNews" @slideChange="onSlideChangeNews">
<swiper-slide> <swiper-slide v-for="item in swiperList">
<img src="public/images/sw1.png" class="w-full"/> <img :src="item.rotation_image" class="w-full" />
</swiper-slide> </swiper-slide>
</swiper> </swiper>
<div class="flex items-center justify-center gap-5 absolute w-full z-10 bottom-[80px]"> <div class="flex items-center justify-center gap-5 absolute w-full z-10 bottom-[80px]">
<div class="w-[30px] bg-white h-[5px]" :class="activeIndex == 0 ? '' : 'opacity-50'"></div> <div v-for="(item, index) in swiperList" class="w-[30px] bg-white h-[5px]"
<div class="w-[30px] bg-white h-[5px]" :class="activeIndex == 1 ? '' : 'opacity-50'"></div> :class="activeIndex == index ? '' : 'opacity-50'"></div>
<div class="w-[30px] bg-white h-[5px]" :class="activeIndex == 2 ? '' : 'opacity-50'"></div>
<div class="w-[30px] bg-white h-[5px]" :class="activeIndex == 3 ? '' : 'opacity-50'"></div>
</div> </div>
</div> </div>
<!--第二块--> <!--第二块-->
@ -30,14 +28,14 @@
</div> </div>
</div> </div>
</div> </div>
<div class="box_23 flex-col"> <div class="box_23 flex-col" @click="openUrl(0)">
<div class="image-wrapper_7 flex-col i2"> <div class="image-wrapper_7 flex-col i2">
<img class="image_16" referrerpolicy="no-referrer" src="public/images/k5.png" /> <img class="image_16" referrerpolicy="no-referrer" src="public/images/k5.png" />
</div> </div>
<span class="text_62">医院概况</span> <span class="text_62">医院概况</span>
<span class="text_63">Hospital&nbsp;Overview</span> <span class="text_63">Hospital&nbsp;Overview</span>
</div> </div>
<div class="box_24 flex-col"> <div class="box_24 flex-col" @click="openUrl(1)">
<div class="image-wrapper_8 flex-col"> <div class="image-wrapper_8 flex-col">
<img class="image_16" referrerpolicy="no-referrer" src="public/images/k1.png" /> <img class="image_16" referrerpolicy="no-referrer" src="public/images/k1.png" />
</div> </div>
@ -47,7 +45,7 @@
<br /> <br />
</span> </span>
</div> </div>
<div class="box_25 flex-col"> <div class="box_25 flex-col" @click="openUrl(0)">
<div class="image-wrapper_9 flex-col"> <div class="image-wrapper_9 flex-col">
<img class="label_5" referrerpolicy="no-referrer" src="public/images/k4.png" /> <img class="label_5" referrerpolicy="no-referrer" src="public/images/k4.png" />
</div> </div>
@ -60,7 +58,7 @@
<div class="group_19 flex-col"></div> <div class="group_19 flex-col"></div>
</div> </div>
<div class="group_36 flex-col justify-between"> <div class="group_36 flex-col justify-between">
<div class="box_14 flex-col"> <div class="box_14 flex-col" @click="openUrl(2)">
<div class="image-text_20 flex-col justify-between"> <div class="image-text_20 flex-col justify-between">
<div class="image-wrapper_2 flex-col"> <div class="image-wrapper_2 flex-col">
<img class="label_1" referrerpolicy="no-referrer" src="public/images/k6.png" /> <img class="label_1" referrerpolicy="no-referrer" src="public/images/k6.png" />
@ -70,7 +68,7 @@
<span class="text_34">Emergency&nbsp;services</span> <span class="text_34">Emergency&nbsp;services</span>
</div> </div>
<div class="box_15 flex-col"> <div class="box_15 flex-col">
<div class="section_4 flex-col"> <div class="section_4 flex-col" @click="openUrl(3)">
<div class="block_2 flex-col align-center"> <div class="block_2 flex-col align-center">
<div class="image-wrapper_3 flex-col"> <div class="image-wrapper_3 flex-col">
<img class="label_2" referrerpolicy="no-referrer" src="public/images/k2.png" /> <img class="label_2" referrerpolicy="no-referrer" src="public/images/k2.png" />
@ -86,7 +84,7 @@
</div> </div>
</div> </div>
<div class="group_37 flex-col justify-between"> <div class="group_37 flex-col justify-between">
<div class="box_16 flex-col"> <div class="box_16 flex-col" @click="openUrl(4)">
<div class="image-wrapper_4 flex-col"> <div class="image-wrapper_4 flex-col">
<img class="image_10" referrerpolicy="no-referrer" src="public/images/k3.png" /> <img class="image_10" referrerpolicy="no-referrer" src="public/images/k3.png" />
</div> </div>
@ -98,7 +96,7 @@
</div> </div>
</div> </div>
<div class="flex-col z-10" style="flex-direction: row; margin: 0 auto;margin-top: 30px;"> <div class="flex-col z-10" style="flex-direction: row; margin: 0 auto;margin-top: 30px;">
<img class="image_12" referrerpolicy="no-referrer" src="public/images/ks4.png" /> <img class="image_12" referrerpolicy="no-referrer" :src="hospitalInfo.image" />
<div class="box_26 flex-col"> <div class="box_26 flex-col">
<div class="group_38 flex-row justify-between"> <div class="group_38 flex-row justify-between">
<div class="image-wrapper_10 flex-col"> <div class="image-wrapper_10 flex-col">
@ -107,20 +105,20 @@
<span class="text_67">医院简介</span> <span class="text_67">医院简介</span>
</div> </div>
<span class="text_68"> <span class="text_68">
医院内设科室15个现有专业技术人员109人其中高级职称7人中级职称25人医院设有120张床位拥有先进的医疗设备如飞利浦螺旋CT德国CE公司800mAX线机意大利移动式床边X光机日本心电监护仪日本肺功能测量系统人工肝全自动肝病治疗仪中心监护系统纤维内窥镜系统有创和无创呼吸系统重症监护系统心脏除颤系统中心负压和供氧系统自动心电分析系统全自动生化分析系统全自动血液和尿检测系统全自动酶标仪荷兰彩色B超等先进医疗设备信阳市第五人民医院奉行救死扶伤全心全意为人民服务的宗旨全体医务人员将以优质的服务质量精湛的医疗技术为广大患者提供满意周到的服务 {{ hospitalInfo.description }}
</span> </span>
</div> </div>
</div> </div>
<div class="z-10 justify-around align-center gap-10 san_count"> <div class="z-10 justify-around align-center gap-10 san_count">
<!--左侧--> <!--左侧-->
<div class="w-[50%]"> <div class="left-my-news w-[50%]">
<div class="align-center justify-between "> <div class="align-center justify-between ">
<div class="align-center"> <div class="align-center">
<img class="label_3" referrerpolicy="no-referrer" src="public/images/c2.png" /> <img class="label_3" referrerpolicy="no-referrer" src="public/images/c2.png" />
<span class="text_38">通知公告</span> <span class="text_38">通知公告</span>
</div> </div>
<div class="flex-row align-center" <div class="flex-row align-center" @click="openUrl(5)"
style="border:1px solid #000;padding: 10px 20px;border-radius: 50px;cursor: pointer;"> style="border:1px solid #000;padding: 10px 20px;border-radius: 50px;cursor: pointer;">
<span class="text_39">查看更多</span> <span class="text_39">查看更多</span>
<div class="group_22 flex-col"> <div class="group_22 flex-col">
@ -129,20 +127,20 @@
</div> </div>
</div> </div>
<div class="mt-[20px]"> <div class="mt-[20px]">
<div v-for="(item, index) in 3" class="cursor-pointer"> <div v-for="(item, index) in msgList" class="cursor-pointer" @click="goDetail(item)">
<div v-if="index == 0"> <div v-if="index == 0">
<img class="image_13" referrerpolicy="no-referrer" src="public/images/new.png" /> <img class="image_13" referrerpolicy="no-referrer" :src="item.news_image[0]" />
</div> </div>
<div class="mt-[20px]"> <div class="mt-[20px]">
<span class="text_41">国际交流添新篇发合作共筑医疗梦&nbsp;意大利锡耶纳大学教</span> <span class="text_41">{{ item.news_title }}</span>
</div> </div>
<div class="mt-[10px]"> <div class="mt-[10px]">
<span class="text_43"> <span class="text_43">
与北京华通国康公益基金会理事长陈冉率11人专家代表团到我院进行深度参观交流我院院长高社干党委副书记牛牧青副院长富奇志及相关职能科室负责人参加了会议 {{ item.news_titleshort }}
</span> </span>
</div> </div>
<div class="mt-[10px]"> <div class="mt-[10px]">
<span class="text_45">2025-04-15</span> <span class="text_45">{{ formattedYearMonthDay(item.showtime) }}</span>
</div> </div>
<div class="mt-[10px]" v-if="index < 2"> <div class="mt-[10px]" v-if="index < 2">
<div class="box_19 flex-col"></div> <div class="box_19 flex-col"></div>
@ -150,13 +148,13 @@
</div> </div>
</div> </div>
</div> </div>
<div class="w-[50%]"> <div class="left-my-news w-[50%]">
<div class="align-center justify-between "> <div class="align-center justify-between ">
<div class="align-center"> <div class="align-center">
<img class="label_3" referrerpolicy="no-referrer" src="public/images/c1.png" /> <img class="label_3" referrerpolicy="no-referrer" src="public/images/c1.png" />
<span class="text_38">医院动态</span> <span class="text_38">医院动态</span>
</div> </div>
<div class="flex-row align-center" <div class="flex-row align-center" @click="openUrl(6)"
style="cursor: pointer;border: 1px solid #000;padding: 10px 20px;border-radius: 50px;"> style="cursor: pointer;border: 1px solid #000;padding: 10px 20px;border-radius: 50px;">
<span class="text_39">查看更多</span> <span class="text_39">查看更多</span>
<div class="group_22 flex-col"> <div class="group_22 flex-col">
@ -165,16 +163,16 @@
</div> </div>
</div> </div>
<div class="mt-[20px]"> <div class="mt-[20px]">
<div v-for="(item, index) in 3" class="cursor-pointer"> <div v-for="(item, index) in dtList" class="cursor-pointer" @click="goDetail(item)">
<div v-if="index == 0"> <div v-if="index == 0">
<img class="image_13" referrerpolicy="no-referrer" src="public/images/new1.png" /> <img class="image_13" referrerpolicy="no-referrer" :src="item.news_image[0]" />
</div> </div>
<div class="mt-[20px]"> <div class="mt-[20px]">
<span class="text_41">国际交流添新篇发合作共筑医疗梦&nbsp;意大利锡耶纳大学教</span> <span class="text_41">{{ item.news_title }}</span>
</div> </div>
<div class="mt-[10px]"> <div class="mt-[10px]">
<span class="text_43"> <span class="text_43">
与北京华通国康公益基金会理事长陈冉率11人专家代表团到我院进行深度参观交流我院院长高社干党委副书记牛牧青副院长富奇志及相关职能科室负责人参加了会议 {{ item.news_titleshort }}
</span> </span>
</div> </div>
<div class="mt-[10px]"> <div class="mt-[10px]">
@ -199,16 +197,16 @@
</div> </div>
<swiper class="swiper-container h-full w-full" :slides-per-view="1" @swiper="onSwiperDoctor" <swiper class="swiper-container h-full w-full" :slides-per-view="1" @swiper="onSwiperDoctor"
v-bind="swiperOptionsDoctor" @slideChange="onSlideChangeDoctor"> v-bind="swiperOptionsDoctor" @slideChange="onSlideChangeDoctor">
<swiper-slide v-for="item in 20"> <swiper-slide v-for="item in ysList" @click="goYsDetail(item)">
<div class="group_10 flex-col cursor-pointer"> <div class="group_10 flex-col cursor-pointer">
<div class="image-text_15 flex-col justify-between"> <div class="image-text_15 flex-col justify-between">
<img class="image_3" referrerpolicy="no-referrer" src="public/images/y1.png" /> <img class="image_3" referrerpolicy="no-referrer" :src="item.news_image[0]" />
<div class="text-group_13 flex-row justify-between"> <div class="text-group_13 flex-row">
<span class="text_14">李商隐</span> <span class="text_14">{{ item.news_title }}</span>
<span class="text_15">副主任医师</span> <span class="text_15">{{ item.news_key }}</span>
</div> </div>
</div> </div>
<span class="text_16">擅长:从事眼科临床工作20年对眼科临床疾病的诊断和治疗累积了丰富的经验</span> <div class="text_16 my_text_2">{{ item.news_auto }}</div>
</div> </div>
</swiper-slide> </swiper-slide>
</swiper> </swiper>
@ -221,31 +219,18 @@
</div> </div>
<div class="flex-row mt-[20px]"> <div class="flex-row mt-[20px]">
<div class="flex items-center justify-center gap-5 w-full z-10"> <div class="flex items-center justify-center gap-5 w-full z-10">
<div class="w-[20px] bg-[#57D1C8] h-[5px]" :class="activedIndex == 0 ? '' : 'opacity-50'"></div> <div v-for="(item, index) in ysTotal" class="w-[20px] bg-[#57D1C8] h-[5px]"
<div class="w-[20px] bg-[#57D1C8] h-[5px]" :class="activedIndex == 1 ? '' : 'opacity-50'"></div> :class="activedIndex == index ? '' : 'opacity-50'"></div>
<div class="w-[20px] bg-[#57D1C8] h-[5px]" :class="activedIndex == 2 ? '' : 'opacity-50'"></div>
<div class="w-[20px] bg-[#57D1C8] h-[5px]" :class="activedIndex == 3 ? '' : 'opacity-50'"></div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
<div class="bg-white pb-[50px]"> <div class="bg-white pb-[50px]">
<div class="block_6 flex-row justify-center"> <div class="block_6 flex-row justify-center">
<div @click="card = 1" :class="['text-wrapper_12', card == 1 ? 'text-wrapper_12-is' : '', 'flex-col']"> <div v-for="item in bottomList" @click="cardOpen(item)"
<span class="text_29">先进设备</span> :class="['text-wrapper_12', card == item.id ? 'text-wrapper_12-is' : '', 'flex-col']">
<div v-if="card == 1" class="box_7 flex-col"></div> <span class="text_29">{{ item.name }}</span>
</div> <div v-if="card == item.id" class="box_7 flex-col"></div>
<div @click="card = 2" :class="['text-wrapper_12', card == 2 ? 'text-wrapper_12-is' : '', 'flex-col']">
<span class="text_29">医院环境</span>
<div v-if="card == 2" class="box_7 flex-col"></div>
</div>
<div @click="card = 3" :class="['text-wrapper_12', card == 3 ? 'text-wrapper_12-is' : '', 'flex-col']">
<span class="text_29">荣誉资质</span>
<div v-if="card == 3" class="box_7 flex-col"></div>
</div>
<div @click="card = 4" :class="['text-wrapper_12', card == 4 ? 'text-wrapper_12-is' : '', 'flex-col']">
<span class="text_29">公益行动</span>
<div v-if="card == 4" class="box_7 flex-col"></div>
</div> </div>
</div> </div>
@ -255,20 +240,17 @@
<img class="w-[50px]" src="public/images/left.png" /> <img class="w-[50px]" src="public/images/left.png" />
</div> </div>
</div> </div>
<swiper class="swiper-container h-full w-full" :slides-per-view="4" @swiper="onSwiperKK" <swiper class="swiper-container h-full w-full" :slides-per-view="4" @swiper="onSwiperKK"
v-bind="swiperOptionsKK" @slideChange="onSlideChangeKK"> v-bind="swiperOptionsKK" @slideChange="onSlideChangeKK">
<swiper-slide v-for="(item, index) in 32"> <swiper-slide v-for="(item, index) in bottomInfoList" @click="goDetail(item)">
<div class="list-items_1 flex-col cursor-pointer" :key="index"> <div class="list-items_1 flex-col cursor-pointer" :key="index">
<img src="public/images/t1.png"> <img src="public/images/t1.png">
<div class="text-wrapper_13 flex-col"> <div class="text-wrapper_13 flex-col">
<span class="text_33">26人高压氧舱</span> <span class="text_33">{{ item.news_title }}</span>
</div> </div>
</div> </div>
</swiper-slide> </swiper-slide>
</swiper> </swiper>
<div class="box_11 flex-col"> <div class="box_11 flex-col">
<div id="kkswipen_prev" style="cursor: pointer;"> <div id="kkswipen_prev" style="cursor: pointer;">
<img class="w-[50px]" src="public/images/right2.png" /> <img class="w-[50px]" src="public/images/right2.png" />
@ -277,10 +259,8 @@
</div> </div>
<div class="flex-row mt-[40px]"> <div class="flex-row mt-[40px]">
<div class="flex items-center justify-center gap-5 w-full z-10"> <div class="flex items-center justify-center gap-5 w-full z-10">
<div class="w-[20px] bg-[#57D1C8] h-[5px]" :class="activedKKIndex == 0 ? '' : 'opacity-50'"></div> <div v-for="(item, index) in bottomInfoTotal" class="w-[20px] bg-[#57D1C8] h-[5px]"
<div class="w-[20px] bg-[#57D1C8] h-[5px]" :class="activedKKIndex == 1 ? '' : 'opacity-50'"></div> :class="activedKKIndex == index ? '' : 'opacity-50'"></div>
<div class="w-[20px] bg-[#57D1C8] h-[5px]" :class="activedKKIndex == 2 ? '' : 'opacity-50'"></div>
<div class="w-[20px] bg-[#57D1C8] h-[5px]" :class="activedKKIndex == 3 ? '' : 'opacity-50'"></div>
</div> </div>
</div> </div>
</div> </div>
@ -301,9 +281,10 @@ import * as swiperAni from '@/assets/animate/animate.js'
import $api from '@/service/webRequest' import $api from '@/service/webRequest'
import { useI18n } from 'vue-i18n' import { useI18n } from 'vue-i18n'
import { useStore } from '~/store' import { useStore } from '~/store'
import { c } from 'naive-ui'
const { locale } = useI18n() const { locale } = useI18n()
const card = ref(1);
const activeIndex = ref(0); const activeIndex = ref(0);
@ -383,10 +364,162 @@ const onSwiperKK = (swiper: any) => {
const onSlideChangeKK = (s) => { const onSlideChangeKK = (s) => {
activedKKIndex.value = s.snapIndex; activedKKIndex.value = s.snapIndex;
} }
const router = useRouter()
onMounted(() => { onMounted(() => {
const coMobile = /Mobi|Android|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent);
if (coMobile) {
router.push('/phone_index')
} else {
router.push('/')
}
getSwiperList();
getHospitalInfo();
getMsgList();
getDtList();
getYsList();
getBottomList();
}) })
//
const swiperList = ref([]);
const getSwiperList = () => {
$api.post("/api/index/rotation")
.then((res: any) => {
console.log(res)
swiperList.value = res.data.data;
})
.catch((err) => {
console.dir(err)
})
}
//
const msgList = ref([]);
const getMsgList = () => {
$api.post("/api/news/index", { gory_id: 90, page: 1, pageSize: 3 })
.then((res: any) => {
console.log(res)
msgList.value = res.data.data.list;
})
.catch((err) => {
console.dir(err)
})
}
//
const dtList = ref([]);
const getDtList = () => {
$api.post("/api/news/index", { gory_id: 91, page: 1, pageSize: 3 })
.then((res: any) => {
console.log(res)
dtList.value = res.data.data.list;
})
.catch((err) => {
console.dir(err)
})
}
//
const ysList = ref([]);
const ysTotal = ref(0);
const getYsList = () => {
$api.post("/api/Newsbx/index", {page: 1, pageSize: 9999 })
.then((res: any) => {
console.log(res)
ysList.value = res.data.data.list;
//
ysTotal.value = Math.ceil(res.data.data.total_count / 5);
})
.catch((err) => {
console.dir(err)
})
}
//
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)
})
}
//
const card = ref(1);
const bottomList = ref({});
const getBottomList = () => {
$api.post("/api/news/group", { flag: 'index' })
.then((res: any) => {
console.log(res)
bottomList.value = res.data.data;
card.value = res.data.data[0].id;
getBottomInfoList();
})
.catch((err) => {
console.dir(err)
})
}
//list
const bottomInfoList = ref({});
const bottomInfoTotal = ref(0);
const getBottomInfoList = () => {
$api.post("/api/news/index", { gory_id: card.value, page: 1, pageSize: 999 })
.then((res: any) => {
console.log(res)
bottomInfoList.value = res.data.data.list;
bottomInfoTotal.value = Math.ceil(res.data.data.total_count / 8);
})
.catch((err) => {
console.dir(err)
})
}
const cardOpen = (item) => {
card.value = item.id;
getBottomInfoList();
}
const openUrl = (index: number) => {
if (index == 0) {
window.location.href = `/about`
} else if (index == 1) {
sessionStorage.setItem('group_id', '23')
window.location.href = `/list/23`
} else if (index == 2) {
sessionStorage.setItem('group_id', '87')
window.location.href = `/list/87`
} else if (index == 3) {
sessionStorage.setItem('group_id', '-3')
window.location.href = `/list/-3`
} else if (index == 4) {
sessionStorage.setItem('group_id', '34')
window.location.href = `/list/34`
} else if (index == 5) {
sessionStorage.setItem('group_id', '90')
window.location.href = `/list/90`
} else if (index == 6) {
sessionStorage.setItem('group_id', '91')
window.location.href = `/list/91`
}
else {
sessionStorage.setItem('group_id', '0')
window.location.href = `/`
}
}
// "YYYY.MM.DD"
const formattedYearMonthDay = (showtime) => {
const date = new Date(showtime);
const year = date.getFullYear();
const month = (date.getMonth() + 1).toString().padStart(2, "0");
const day = date.getDate().toString().padStart(2, "0");
return `${year}-${month}-${day}`;
};
const goDetail = (item) => {
sessionStorage.setItem('group_id', '-2')
window.open(`/info/${item.id}`)
}
const goYsDetail = (item) =>{
sessionStorage.setItem('group_id', '-3')
window.open(`/ys_info/${item.id}`)
}
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>

93
pages/info/[id].vue Normal file
View File

@ -0,0 +1,93 @@
<template>
<div class="bg-[#ffffff]">
<div class="box_6 flex-col">
<div class="group_1">
<div class="flex section_4 flex-row justify-between" style="padding-top: 67px;">
<img class="thumbnail_1" referrerpolicy="no-referrer" src="public/images/home.png" />
<span class="text_13">您的位置首页>系统公告</span>
</div>
</div>
</div>
<div class="page-container mt-[30px]">
<div>
<div class="title">{{ info.news_title }}</div>
<div class="flex flex-row justify-start author">
<div>发布人{{ info.news_auto }}</div>
<div class="ml-[70px]">发布时间{{ info.showtime }}</div>
</div>
<div style="border-top: 1px solid rgba(238, 238, 238, 1);"></div>
<div class="my-[30px]">
<div v-html="info.news_content"></div>
</div>
</div>
<div style="border-top: 1px solid rgba(238, 238, 238, 1);"></div>
<div class="py-[30px]">
<div class="">
<div class="">
<div>上一篇XXXXXXXXXXXXXXXXXXXXX</div>
<div class="mt-[10px]">下一篇暂无</div>
</div>
</div>
</div>
</div>
</div>
</template>
<script setup lang="ts">
import { useStore } from '~/store'
import $api from '@/service/webRequest'
const router = useRouter()
const route = useRoute()
const id = ref(route.params.id)
onMounted(() => {
//
document.documentElement.style.fontSize = '16px';
const coMobile = /Mobi|Android|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent);
if (coMobile) {
router.push('/phone_info/' + id.value)
} else {
router.push('/info/' + id.value)
}
getInfo();
})
const info = ref({})
const getInfo = () => {
$api.post("/api/news/info", { id: id.value })
.then((res: any) => {
console.log(res)
info.value = res.data.data
})
.catch((err) => {
console.dir(err)
})
}
</script>
<style scoped>
@import "@/assets/css/common.scss";
@import "@/assets/css/list.css";
</style>
<style>
.title {
font-size: 26px;
font-weight: 600;
color: #000000;
margin-bottom: 20px;
text-align: center;
}
.author {
font-size: 14px;
color: rgba(153, 153, 153, 1);
margin-bottom: 20px;
}
.page-container{
padding: 0 360px;
}
@media (max-width: 1440px) {
.page-container{
padding: 0 100px;
}
}
/* video{
margin: 20px auto;
} */
</style>

View File

@ -4,44 +4,142 @@
<div class="group_1"> <div class="group_1">
<div class="flex section_4 flex-row justify-between"> <div class="flex section_4 flex-row justify-between">
<img class="thumbnail_1" referrerpolicy="no-referrer" src="public/images/home.png" /> <img class="thumbnail_1" referrerpolicy="no-referrer" src="public/images/home.png" />
<span class="text_13">您的位置首页>系统公告</span> <span class="text_13">您的位置首页>{{ id=='-3'?'医生团队':gory_name }}</span>
</div> </div>
<div class="text_14">系统公告</div> <div class="text_14">{{ id=='-3'?'医生团队':gory_name }}</div>
</div> </div>
</div> </div>
<div class="flex box_7 flex-row align-center" v-for="item in 5"> <div class="flex box_7 flex-row align-center" v-for="(item, index) in newsList" :key="index"
@click="goDetail(item)">
<div class="flex block_3 flex-col"></div> <div class="flex block_3 flex-col"></div>
<div class="flex image-text_7 flex-row justify-between"> <div class="flex image-text_7 flex-row justify-between">
<img class="image_1" referrerpolicy="no-referrer" src="public/images/new1.png" /> <img class="image_1" referrerpolicy="no-referrer" :src="item.news_image[0]" />
<div class="flex group_13 flex-col justify-between"> <div class="flex group_13 flex-col justify-between">
<div class="flex text-group_7 flex-col justify-between"> <div class="flex text-group_7 flex-col justify-between">
<span class="text_15"> <span class="text_15 text-ellipsis font-bold">
青云计划再启航树立长三角放疗顶天立地人才培养 {{ item.news_title }}
</span> </span>
<span class="text_16"> <span class="text_16">
在清明节来临之际为缅怀革命先烈传承红色精神增强党支部的凝聚力和战斗力3月29日我院机关党总支党委宣传处党支部联合党委办公室党支部赴郑州烈士陵园开展传承红色基因续红色血脉.. {{ item.news_auto }}
</span> </span>
</div> </div>
<img class="label_1" referrerpolicy="no-referrer" src="public/images/bs1.png" /> <img class="label_1" referrerpolicy="no-referrer" src="public/images/bs1.png" />
</div> </div>
</div> </div>
<div class="block_4 flex-col"> <div class="block_4 flex-col">
<div class="flex text-wrapper_11 flex-col text-center"> <div v-if="id!='-3'" class="flex text-wrapper_11 flex-col text-center">
<span class="text_17">08</span> <span class="text_17">{{ formattedMonth(item.showtime) }}</span>
<span class="text_18">2025.04</span> <span class="text_18">{{ formattedYearMonth(item.showtime) }}</span>
</div>
<div v-if="id=='-3'" class="flex text-wrapper_11 flex-col text-center">
<span style="font-size: 22px;margin-top: 87px;color: #ffffff;">{{ item.news_titleshort }}</span>
</div> </div>
</div> </div>
</div> </div>
<div class="group_18 flex-row"> <div class="flex flex-row justify-center py-5">
<n-pagination v-model:page="page" :item-count="total" size="large" show-quick-jumper show-size-picker
@update:page="getPageList">
</n-pagination>
</div> </div>
</div> </div>
</template> </template>
<script> <script setup lang="ts">
import { NPagination } from 'naive-ui'
import { nextTick, ref } from 'vue'
import { useStore } from '~/store'
import $api from '@/service/webRequest'
const router = useRouter()
const route = useRoute()
const id = ref(route.params.id)
onMounted(() => {
document.documentElement.style.fontSize = '16px';
const coMobile = /Mobi|Android|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent);
if (coMobile) {
router.push('/phone_list/' + id.value)
} else {
router.push('/list/' + id.value)
}
if(id.value=='-3'){
getYsGroupList()
}else{
getGroupList()
}
})
const newsList = ref([])
const page = ref(1)
const pageSize = ref(10)
const total = ref(0)
const gory_name=ref('');
const getGroupList = () => {
$api.post("/api/news/index", { gory_id: id.value, page: page.value, pageSize: pageSize.value })
.then((res: any) => {
console.log(res)
newsList.value = res.data.data.list;
total.value = res.data.data.total_count;
gory_name.value=res.data.data.gory_name;
//
window.scrollTo(0, 0)
})
.catch((err) => {
console.dir(err)
})
}
const getPageList = (p) => {
page.value = p;
if(id.value=='-3'){
getYsGroupList()
}else{
getGroupList()
}
}
const getYsGroupList = () => {
$api.post("/api/Newsbx/index", { gory_id: id.value, page: page.value, pageSize: pageSize.value })
.then((res: any) => {
console.log(res)
newsList.value = res.data.data.list;
total.value = res.data.data.total_count;
gory_name.value=res.data.data.gory_name;
//
window.scrollTo(0, 0)
})
.catch((err) => {
console.dir(err)
})
}
const goDetail = (item: any) => {
//router.push(`/info/${item.id}`)
if(id.value=='-3'){
window.open( `/ys_info/${item.id}`)
}else{
window.open( `/info/${item.id}`)
}
}
//
const formattedMonth = (showtime) => {
const date = new Date(showtime);
return (date.getMonth() + 1).toString().padStart(2, "0");
};
// "YYYY.MM"
const formattedYearMonth = (showtime) => {
const date = new Date(showtime);
const year = date.getFullYear();
const month = (date.getMonth() + 1).toString().padStart(2, "0");
return `${year}.${month}`;
};
</script> </script>
<style scoped> <style scoped>
@import "@/assets/css/common.scss"; @import "@/assets/css/common.scss";
@import "@/assets/css/list.css"; @import "@/assets/css/list.css";
::v-deep .n-pagination .n-pagination-item:not(.n-pagination-item--disabled).n-pagination-item--active {
color: #1FC4C2;
border: 1px solid #1FC4C2;
}
</style> </style>

116
pages/phone_about.vue Normal file
View File

@ -0,0 +1,116 @@
<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>

View File

@ -3,24 +3,13 @@
<div class="group_6 flex-col relative"> <div class="group_6 flex-col relative">
<swiper class="swiper-container w-full" v-bind="swiperOptionsNews" @swiper="onSwiperNews" <swiper class="swiper-container w-full" v-bind="swiperOptionsNews" @swiper="onSwiperNews"
@slideChange="onSlideChangeNews"> @slideChange="onSlideChangeNews">
<swiper-slide> <swiper-slide v-for="item in swiperList">
<img src="public/images/sw1.png" class="w-full" /> <img :src="item.rotation_image" class="w-full" />
</swiper-slide>
<swiper-slide>
<img src="public/images/sw1.png" class="w-full" />
</swiper-slide>
<swiper-slide>
<img src="public/images/sw1.png" class="w-full" />
</swiper-slide>
<swiper-slide>
<img src="public/images/sw1.png" class="w-full" />
</swiper-slide> </swiper-slide>
</swiper> </swiper>
<div class="flex items-center justify-center gap-2 absolute w-full z-10 bottom-[30px]"> <div class="flex items-center justify-center gap-2 absolute w-full z-10 bottom-[30px]">
<div class="w-[20px] bg-white h-[3px] rounded-full" :class="activeIndex == 0 ? '' : 'opacity-50'"></div> <div v-for="(item, index) in swiperList" class="w-[20px] bg-white h-[3px] rounded-full"
<div class="w-[20px] bg-white h-[3px] rounded-full" :class="activeIndex == 1 ? '' : 'opacity-50'"></div> :class="activeIndex == index ? '' : 'opacity-50'"></div>
<div class="w-[20px] bg-white h-[3px] rounded-full" :class="activeIndex == 2 ? '' : 'opacity-50'"></div>
<div class="w-[20px] bg-white h-[3px] rounded-full" :class="activeIndex == 3 ? '' : 'opacity-50'"></div>
</div> </div>
</div> </div>
<!--第二块--> <!--第二块-->
@ -31,7 +20,7 @@
<span class="text_59 text-xl">医院信息查询</span> <span class="text_59 text-xl">医院信息查询</span>
<span class="text_60 text-sm">Hospital&nbsp;information&nbsp;inquiry</span> <span class="text_60 text-sm">Hospital&nbsp;information&nbsp;inquiry</span>
<div class="group_26 flex-col mt-2"> <div class="group_26 flex-col mt-2">
<span class="text_61 text-sm">请输入您要查询的内容</span> <input type="text" class="text_61" placeholder="请输入您要查询的内容">
<div class="group_27 flex-col"> <div class="group_27 flex-col">
<div class="group_28 flex-col"> <div class="group_28 flex-col">
<img src="public/images/ser.png" /> <img src="public/images/ser.png" />
@ -43,7 +32,7 @@
</div> </div>
<div class="box_35 flex-row flex-wrap justify-center px-4 gap-4"> <div class="box_35 flex-row flex-wrap justify-center px-4 gap-4">
<div class="group_36 flex-row flex-wrap justify-between"> <div class="group_36 flex-row flex-wrap justify-between">
<div class="box_23 flex-col w-[48%] mb-4"> <div class="box_23 flex-col w-[48%] mb-4" @click="openUrl(0)">
<div class="image-wrapper_7 flex-col i2"> <div class="image-wrapper_7 flex-col i2">
<img class="image_16 w-12 h-12" referrerpolicy="no-referrer" <img class="image_16 w-12 h-12" referrerpolicy="no-referrer"
src="public/images/k5.png" /> src="public/images/k5.png" />
@ -51,7 +40,8 @@
<span class="text-sm">医院概况</span> <span class="text-sm">医院概况</span>
<span class="text-xs">Hospital&nbsp;Overview</span> <span class="text-xs">Hospital&nbsp;Overview</span>
</div> </div>
<div class="box_24 flex-col w-[48%] mb-4" style="background-color: #BDAA82;"> <div class="box_24 flex-col w-[48%] mb-4" @click="openUrl(1)"
style="background-color: #BDAA82;">
<div class="image-wrapper_7 flex-col i2"> <div class="image-wrapper_7 flex-col i2">
<img class="image_16 w-12 h-12" referrerpolicy="no-referrer" <img class="image_16 w-12 h-12" referrerpolicy="no-referrer"
src="public/images/k1.png" /> src="public/images/k1.png" />
@ -59,7 +49,8 @@
<span class="text-sm">患者服务</span> <span class="text-sm">患者服务</span>
<span class="text-xs">Patient Services</span> <span class="text-xs">Patient Services</span>
</div> </div>
<div class="box_24 flex-col w-[48%] mb-4" style="background-color: #1F96AE;"> <div class="box_24 flex-col w-[48%] mb-4" @click="openUrl(0)"
style="background-color: #1F96AE;">
<div class="image-wrapper_7 flex-col i2"> <div class="image-wrapper_7 flex-col i2">
<img class="label_5 w-12 h-12" referrerpolicy="no-referrer" <img class="label_5 w-12 h-12" referrerpolicy="no-referrer"
src="public/images/k4.png" /> src="public/images/k4.png" />
@ -67,7 +58,8 @@
<span class="text-sm">医院位置</span> <span class="text-sm">医院位置</span>
<span class="text-xs">Hospital location</span> <span class="text-xs">Hospital location</span>
</div> </div>
<div class="box_24 flex-col w-[48%] mb-4" style="background-color: #ffffff;color: #000;"> <div class="box_24 flex-col w-[48%] mb-4" @click="openUrl(2)"
style="background-color: #ffffff;color: #000;">
<div class="image-wrapper_7 flex-col i2"> <div class="image-wrapper_7 flex-col i2">
<img class="label_5 w-12 h-12" referrerpolicy="no-referrer" <img class="label_5 w-12 h-12" referrerpolicy="no-referrer"
src="public/images/k6.png" /> src="public/images/k6.png" />
@ -75,7 +67,8 @@
<span class="text-sm">紧急服务</span> <span class="text-sm">紧急服务</span>
<span class="text-xs">Emergency services</span> <span class="text-xs">Emergency services</span>
</div> </div>
<div class="box_24 flex-col w-[48%] mb-4" style="background-color: #466C9A;;"> <div class="box_24 flex-col w-[48%] mb-4" @click="openUrl(3)"
style="background-color: #466C9A;;">
<div class="image-wrapper_7 flex-col i2"> <div class="image-wrapper_7 flex-col i2">
<img class="label_5 w-12 h-12" referrerpolicy="no-referrer" <img class="label_5 w-12 h-12" referrerpolicy="no-referrer"
src="public/images/k2.png" /> src="public/images/k2.png" />
@ -83,7 +76,8 @@
<span class="text-sm">医生团队</span> <span class="text-sm">医生团队</span>
<span class="text-xs">Doctor team</span> <span class="text-xs">Doctor team</span>
</div> </div>
<div class="box_24 flex-col w-[48%] mb-4" style="background-color: #B8C489;"> <div class="box_24 flex-col w-[48%] mb-4" @click="openUrl(4)"
style="background-color: #B8C489;">
<div class="image-wrapper_7 flex-col i2"> <div class="image-wrapper_7 flex-col i2">
<img class="label_5 w-12 h-12" referrerpolicy="no-referrer" <img class="label_5 w-12 h-12" referrerpolicy="no-referrer"
src="public/images/k3.png" /> src="public/images/k3.png" />
@ -95,7 +89,7 @@
</div> </div>
</div> </div>
<div class="flex-col z-10 px-4"> <div class="flex-col z-10 px-4">
<img class="w-full mb-4" referrerpolicy="no-referrer" src="public/images/ks4.png" /> <img class="w-full mb-4" referrerpolicy="no-referrer" :src="hospitalInfo.image" />
<div class="box_26 flex-col"> <div class="box_26 flex-col">
<div class="group_38 flex-row justify-between items-center mb-2"> <div class="group_38 flex-row justify-between items-center mb-2">
<div class="image-wrapper_10 flex-col"> <div class="image-wrapper_10 flex-col">
@ -104,7 +98,7 @@
<span class="text_67 text-lg font-medium">医院简介</span> <span class="text_67 text-lg font-medium">医院简介</span>
</div> </div>
<span class="text_68 text-sm leading-relaxed"> <span class="text_68 text-sm leading-relaxed">
医院内设科室15个现有专业技术人员109人其中高级职称7人中级职称25人医院设有120张床位拥有先进的医疗设备如飞利浦螺旋CT德国CE公司800mAX线机意大利移动式床边X光机日本心电监护仪日本肺功能测量系统人工肝全自动肝病治疗仪中心监护系统纤维内窥镜系统有创和无创呼吸系统重症监护系统心脏除颤系统中心负压和供氧系统自动心电分析系统全自动生化分析系统全自动血液和尿检测系统全自动酶标仪荷兰彩色B超等先进医疗设备信阳市第五人民医院奉行救死扶伤全心全意为人民服务的宗旨全体医务人员将以优质的服务质量精湛的医疗技术为广大患者提供满意周到的服务 {{ hospitalInfo.description }}
</span> </span>
</div> </div>
</div> </div>
@ -117,7 +111,7 @@
<img class="label_3 w-6 h-6 mr-2" referrerpolicy="no-referrer" src="public/images/c2.png" /> <img class="label_3 w-6 h-6 mr-2" referrerpolicy="no-referrer" src="public/images/c2.png" />
<span class="text_38 text-lg">通知公告</span> <span class="text_38 text-lg">通知公告</span>
</div> </div>
<div class="flex items-center border border-black px-3 py-1 rounded-full"> <div class="flex items-center border border-black px-3 py-1 rounded-full" @click="openUrl(5)">
<span class="text_39 text-xs">查看更多</span> <span class="text_39 text-xs">查看更多</span>
<div class="group_22 flex-col ml-1"> <div class="group_22 flex-col ml-1">
<img src="public/images/right.png" class="w-4 h-4" /> <img src="public/images/right.png" class="w-4 h-4" />
@ -125,20 +119,20 @@
</div> </div>
</div> </div>
<div> <div>
<div v-for="(item, index) in 3" class="mb-4"> <div v-for="(item, index) in msgList" class="mb-4" @click="goDetail(item)">
<div v-if="index == 0" class="mb-2"> <div v-if="index == 0" class="mb-2">
<img class="image_13 w-full" referrerpolicy="no-referrer" src="public/images/new.png" /> <img class="image_13 w-full" referrerpolicy="no-referrer" :src="item.news_image[0]" />
</div> </div>
<div class="mb-2"> <div class="mb-2">
<span class="text_41 text-base font-medium">国际交流添新篇发合作共筑医疗梦&nbsp;意大利锡耶纳大学教</span> <span class="text_41 text-base font-medium">{{ item.news_title }}</span>
</div> </div>
<div class="mb-2"> <div class="mb-2">
<span class="text_43 text-sm text-gray-600"> <span class="text_43 text-sm text-gray-600">
与北京华通国康公益基金会理事长陈冉率11人专家代表团到我院进行深度参观交流我院院长高社干党委副书记牛牧青副院长富奇志及相关职能科室负责人参加了会议 {{ item.news_titleshort }}
</span> </span>
</div> </div>
<div class="mb-2"> <div class="mb-2">
<span class="text_45 text-xs text-gray-400">2025-04-15</span> <span class="text_45 text-xs text-gray-400">{{ formattedYearMonthDay(item.showtime) }}</span>
</div> </div>
<div v-if="index < 2" class="mb-2"> <div v-if="index < 2" class="mb-2">
<div class="box_19 w-full h-px bg-gray-200"></div> <div class="box_19 w-full h-px bg-gray-200"></div>
@ -154,7 +148,7 @@
<img class="label_3 w-6 h-6 mr-2" referrerpolicy="no-referrer" src="public/images/c1.png" /> <img class="label_3 w-6 h-6 mr-2" referrerpolicy="no-referrer" src="public/images/c1.png" />
<span class="text_38 text-lg">医院动态</span> <span class="text_38 text-lg">医院动态</span>
</div> </div>
<div class="flex items-center border border-black px-3 py-1 rounded-full"> <div class="flex items-center border border-black px-3 py-1 rounded-full" @click="openUrl(6)">
<span class="text_39 text-xs">查看更多</span> <span class="text_39 text-xs">查看更多</span>
<div class="group_22 flex-col ml-1"> <div class="group_22 flex-col ml-1">
<img src="public/images/right.png" class="w-4 h-4" /> <img src="public/images/right.png" class="w-4 h-4" />
@ -162,17 +156,17 @@
</div> </div>
</div> </div>
<div> <div>
<div v-for="(item, index) in 3" class="mb-4"> <div v-for="(item, index) in dtList" class="mb-4" @click="goDetail(item)">
<div v-if="index == 0" class="mb-2"> <div v-if="index == 0" class="mb-2">
<img class="image_13 w-full" referrerpolicy="no-referrer" <img class="image_13 w-full" referrerpolicy="no-referrer"
src="public/images/new1.png" /> :src="item.news_image[0]" />
</div> </div>
<div class="mb-2"> <div class="mb-2">
<span class="text_41 text-base font-medium">国际交流添新篇发合作共筑医疗梦&nbsp;意大利锡耶纳大学教</span> <span class="text_41 text-base font-medium">{{ item.news_title }}</span>
</div> </div>
<div class="mb-2"> <div class="mb-2">
<span class="text_43 text-sm text-gray-600"> <span class="text_43 text-sm text-gray-600">
与北京华通国康公益基金会理事长陈冉率11人专家代表团到我院进行深度参观交流我院院长高社干党委副书记牛牧青副院长富奇志及相关职能科室负责人参加了会议 {{ item.news_titleshort }}
</span> </span>
</div> </div>
<div class="mb-2"> <div class="mb-2">
@ -192,63 +186,45 @@
<div class="box_34 flex-row relative"> <div class="box_34 flex-row relative">
<swiper class="swiper-container h-full w-full" v-bind="swiperOptionsDoctor" @swiper="onSwiperDoctor" <swiper class="swiper-container h-full w-full" v-bind="swiperOptionsDoctor" @swiper="onSwiperDoctor"
@slideChange="onSlideChangeDoctor"> @slideChange="onSlideChangeDoctor">
<swiper-slide v-for="item in 8"> <swiper-slide v-for="item in ysList" @click="goYsDetail(item)">
<div class="group_10 flex-col p-2"> <div class="group_10 flex-col p-2">
<div class="image-text_15 flex-col justify-between"> <div class="image-text_15 flex-col justify-between">
<img class="image_3 w-full" referrerpolicy="no-referrer" <img class="image_3 w-full" referrerpolicy="no-referrer"
src="public/images/y1.png" /> src="public/images/y1.png" />
<div class="text-group_13 flex-row justify-between mt-2"> <div class="text-group_13 flex-row justify-between mt-2">
<span class="text_14 text-base font-medium">李商隐</span> <span class="text_14 text-base font-medium">{{ item.news_title }}</span>
<span class="text_15 text-xs text-gray-600">副主任医师</span> <span class="text_15 text-xs text-gray-600">{{ item.news_key }}</span>
</div> </div>
</div> </div>
<span class="text_16 text-sm mt-2">擅长:从事眼科临床工作20年对眼科临床疾病的诊断和治疗累积了丰富的经验</span> <span class="text_16 text-sm mt-2">{{ item.news_auto }}</span>
</div> </div>
</swiper-slide> </swiper-slide>
</swiper> </swiper>
</div> </div>
<div class="flex-row mt-4"> <div class="flex-row mt-4">
<div class="flex items-center justify-center gap-2 w-full"> <div class="flex items-center justify-center gap-2 w-full">
<div class="w-[15px] bg-[#57D1C8] h-[3px] rounded-full" <div v-for="(item, index) in ysTotal" class="w-[15px] bg-[#57D1C8] h-[3px] rounded-full"
:class="activedIndex == 0 ? '' : 'opacity-50'"></div> :class="activedIndex == index ? '' : 'opacity-50'"></div>
<div class="w-[15px] bg-[#57D1C8] h-[3px] rounded-full"
:class="activedIndex == 1 ? '' : 'opacity-50'"></div>
<div class="w-[15px] bg-[#57D1C8] h-[3px] rounded-full"
:class="activedIndex == 2 ? '' : 'opacity-50'"></div>
<div class="w-[15px] bg-[#57D1C8] h-[3px] rounded-full"
:class="activedIndex == 3 ? '' : 'opacity-50'"></div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
<div class="bg-white pb-[30px] px-4"> <div class="bg-white pb-[30px] px-4">
<div class="block_6 flex-row justify-around mb-4"> <div class="block_6 flex-row justify-around mb-4">
<div @click="card = 1" :class="['text-wrapper_12', card == 1 ? 'text-wrapper_12-is' : '', 'flex-col']"> <div v-for="item in bottomList" @click="cardOpen(item)" :class="['text-wrapper_12', card == item.id ? 'text-wrapper_12-is' : '', 'flex-col']">
<span class="text_29 text-sm">先进设备</span> <span class="text_29 text-sm">{{ item.name }}</span>
<div v-if="card == 1" class="box_7 flex-col"></div> <div v-if="card == item.id" class="box_7 flex-col"></div>
</div>
<div @click="card = 2" :class="['text-wrapper_12', card == 2 ? 'text-wrapper_12-is' : '', 'flex-col']">
<span class="text_29 text-sm">医院环境</span>
<div v-if="card == 2" class="box_7 flex-col"></div>
</div>
<div @click="card = 3" :class="['text-wrapper_12', card == 3 ? 'text-wrapper_12-is' : '', 'flex-col']">
<span class="text_29 text-sm">荣誉资质</span>
<div v-if="card == 3" class="box_7 flex-col"></div>
</div>
<div @click="card = 4" :class="['text-wrapper_12', card == 4 ? 'text-wrapper_12-is' : '', 'flex-col']">
<span class="text_29 text-sm">公益行动</span>
<div v-if="card == 4" class="box_7 flex-col"></div>
</div> </div>
</div> </div>
<div class="block_8 flex-row relative"> <div class="block_8 flex-row relative">
<swiper class="swiper-container h-full w-full" v-bind="swiperOptionsKK" @swiper="onSwiperKK" <swiper class="swiper-container h-full w-full" v-bind="swiperOptionsKK" @swiper="onSwiperKK"
@slideChange="onSlideChangeKK"> @slideChange="onSlideChangeKK">
<swiper-slide v-for="(item, index) in 16" :key="index"> <swiper-slide v-for="(item, index) in bottomInfoList" @click="goDetail(item)">
<div class="list-items_1 flex-col p-2"> <div class="list-items_1 flex-col p-2">
<img src="public/images/t1.png" class="w-full"> <img src="public/images/t1.png" class="w-full">
<div class="text-wrapper_13 flex-col mt-2"> <div class="text-wrapper_13 flex-col mt-2">
<span class="text_33 text-xs text-center">26人高压氧舱</span> <span class="text_33 text-xs text-center">{{ item.news_title }}</span>
</div> </div>
</div> </div>
</swiper-slide> </swiper-slide>
@ -256,14 +232,8 @@
</div> </div>
<div class="flex-row mt-4"> <div class="flex-row mt-4">
<div class="flex items-center justify-center gap-2 w-full"> <div class="flex items-center justify-center gap-2 w-full">
<div class="w-[15px] bg-[#57D1C8] h-[3px] rounded-full" <div v-for="(item, index) in bottomInfoTotal" class="w-[15px] bg-[#57D1C8] h-[3px] rounded-full"
:class="activedKKIndex == 0 ? '' : 'opacity-50'"></div> :class="activedKKIndex == index ? '' : 'opacity-50'"></div>
<div class="w-[15px] bg-[#57D1C8] h-[3px] rounded-full"
:class="activedKKIndex == 1 ? '' : 'opacity-50'"></div>
<div class="w-[15px] bg-[#57D1C8] h-[3px] rounded-full"
:class="activedKKIndex == 2 ? '' : 'opacity-50'"></div>
<div class="w-[15px] bg-[#57D1C8] h-[3px] rounded-full"
:class="activedKKIndex == 3 ? '' : 'opacity-50'"></div>
</div> </div>
</div> </div>
</div> </div>
@ -287,7 +257,6 @@ import { useStore } from '~/store'
import type { Swiper as SwiperType } from 'swiper' import type { Swiper as SwiperType } from 'swiper'
const { locale } = useI18n() const { locale } = useI18n()
const card = ref(1);
const activeIndex = ref(0); const activeIndex = ref(0);
@ -367,11 +336,161 @@ const onSwiperKK = (swiper: SwiperType) => {
const onSlideChangeKK = (s: any) => { const onSlideChangeKK = (s: any) => {
activedKKIndex.value = s.snapIndex; activedKKIndex.value = s.snapIndex;
} }
const router = useRouter()
onMounted(() => { onMounted(() => {
// const coMobile = /Mobi|Android|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent);
document.documentElement.style.fontSize = '16px'; if (coMobile) {
router.push('/phone_index')
} else {
router.push('/')
}
getSwiperList();
getHospitalInfo();
getMsgList();
getDtList();
getYsList();
getBottomList();
}) })
//
const swiperList = ref([]);
const getSwiperList = () => {
$api.post("/api/index/rotation")
.then((res: any) => {
console.log(res)
swiperList.value = res.data.data;
})
.catch((err) => {
console.dir(err)
})
}
//
const msgList = ref([]);
const getMsgList = () => {
$api.post("/api/news/index", { gory_id: 90, page: 1, pageSize: 3 })
.then((res: any) => {
console.log(res)
msgList.value = res.data.data.list;
})
.catch((err) => {
console.dir(err)
})
}
//
const dtList = ref([]);
const getDtList = () => {
$api.post("/api/news/index", { gory_id: 91, page: 1, pageSize: 3 })
.then((res: any) => {
console.log(res)
dtList.value = res.data.data.list;
})
.catch((err) => {
console.dir(err)
})
}
//
const ysList = ref([]);
const ysTotal = ref(0);
const getYsList = () => {
$api.post("/api/Newsbx/index", { page: 1, pageSize: 9999 })
.then((res: any) => {
console.log(res)
ysList.value = res.data.data.list;
//
ysTotal.value = Math.ceil(res.data.data.total_count / 2);
})
.catch((err) => {
console.dir(err)
})
}
//
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)
})
}
//
const card = ref(1);
const bottomList = ref({});
const getBottomList = () => {
$api.post("/api/news/group", { flag: 'index' })
.then((res: any) => {
console.log(res)
bottomList.value = res.data.data;
card.value = res.data.data[0].id;
getBottomInfoList();
})
.catch((err) => {
console.dir(err)
})
}
//list
const bottomInfoList = ref({});
const bottomInfoTotal = ref(0);
const getBottomInfoList = () => {
$api.post("/api/news/index", { gory_id: card.value, page: 1, pageSize: 999 })
.then((res: any) => {
console.log(res)
bottomInfoList.value = res.data.data.list;
bottomInfoTotal.value = Math.ceil(res.data.data.total_count / 4);
})
.catch((err) => {
console.dir(err)
})
}
const cardOpen = (item) => {
card.value = item.id;
getBottomInfoList();
}
const openUrl = (index: number) => {
if (index == 0) {
window.location.href = `/phone_about`
} else if (index == 1) {
sessionStorage.setItem('group_id', '23')
window.location.href = `/phone_list/23`
} else if (index == 2) {
sessionStorage.setItem('group_id', '87')
window.location.href = `/phone_list/87`
} else if (index == 3) {
sessionStorage.setItem('group_id', '-3')
window.location.href = `/phone_list/-3`
} else if (index == 4) {
sessionStorage.setItem('group_id', '34')
window.location.href = `/phone_list/34`
} else if (index == 5) {
sessionStorage.setItem('group_id', '90')
window.location.href = `/phone_list/90`
} else if (index == 6) {
sessionStorage.setItem('group_id', '91')
window.location.href = `/phone_list/91`
}
else {
sessionStorage.setItem('group_id', '0')
window.location.href = `/`
}
}
// "YYYY.MM.DD"
const formattedYearMonthDay = (showtime) => {
const date = new Date(showtime);
const year = date.getFullYear();
const month = (date.getMonth() + 1).toString().padStart(2, "0");
const day = date.getDate().toString().padStart(2, "0");
return `${year}-${month}-${day}`;
};
const goDetail = (item) => {
sessionStorage.setItem('group_id', '-2')
window.open(`/phone_info/${item.id}`)
}
const goYsDetail = (item) => {
sessionStorage.setItem('group_id', '-3')
window.open(`/phone_ys_info/${item.id}`)
}
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
@ -449,14 +568,17 @@ onMounted(() => {
.group_28 { .group_28 {
margin: 8px 0 0 22px; margin: 8px 0 0 22px;
} }
.group_36 { .group_36 {
height: auto !important; height: auto !important;
margin-top: 0px !important; margin-top: 0px !important;
} }
.text_68 { .text_68 {
font-size: 14px; font-size: 14px;
line-height: 1.6; line-height: 1.6;
} }
.box_23 { .box_23 {
width: 48%; width: 48%;
text-align: center; text-align: center;
@ -464,6 +586,7 @@ onMounted(() => {
height: 145px; height: 145px;
padding-top: 20px; padding-top: 20px;
} }
.box_24 { .box_24 {
width: 48%; width: 48%;
text-align: center; text-align: center;
@ -472,6 +595,7 @@ onMounted(() => {
padding-top: 20px; padding-top: 20px;
margin-top: 0px; margin-top: 0px;
} }
.image_16, .image_16,
.label_5, .label_5,
.label_1, .label_1,
@ -502,65 +626,82 @@ onMounted(() => {
font-size: 10px; font-size: 10px;
text-align: center; text-align: center;
} }
.image-wrapper_7 { .image-wrapper_7 {
margin: 0; margin: 0;
text-align: center; text-align: center;
width: 100%; width: 100%;
} }
.box_26 { .box_26 {
margin-left: 0px;; margin-left: 0px;
;
height: auto; height: auto;
padding: 20px 10px; padding: 20px 10px;
margin-top: 0px; margin-top: 0px;
} }
.text_68 { .text_68 {
margin: 0px; margin: 0px;
height: auto; height: auto;
width: 100%; width: 100%;
} }
.group_38 { .group_38 {
margin: 0 auto; margin: 0 auto;
padding-bottom: 20px; padding-bottom: 20px;
} }
.image_13 { .image_13 {
height: 100%; height: 100%;
} }
.group_10 { .group_10 {
height: 100%; height: 100%;
width: 100%; width: 100%;
} }
.image_3 { .image_3 {
width: 100%; width: 100%;
height: 100%; height: 100%;
object-fit: cover; object-fit: cover;
} }
.image-text_15 { .image-text_15 {
width: 100%; width: 100%;
height: 100%; height: 100%;
} }
.box_33 { .box_33 {
padding-top: 20px; padding-top: 20px;
} }
.box_34 { .box_34 {
margin-top: 20px; margin-top: 20px;
} }
.box_2 { .box_2 {
height: 100%; height: 100%;
} }
.text-wrapper_12 { .text-wrapper_12 {
height: 38px height: 38px
} }
.block_6 { .block_6 {
height: 100%; height: 100%;
} }
.block_8 { .block_8 {
height: 100%; height: 100%;
margin-top: 0px; margin-top: 0px;
} }
.list-items_1 { .list-items_1 {
height: 100%; height: 100%;
width: 100%; width: 100%;
} }
.text-wrapper_13 { .text-wrapper_13 {
width: 100%; width: 100%;
} }

107
pages/phone_info/[id].vue Normal file
View File

@ -0,0 +1,107 @@
<template>
<div class="bg-[#ffffff]">
<div class="box_6 flex-col">
<div class="group_1">
<div class="flex section_4 flex-row justify-between" style="padding-top: 67px;">
<img class="thumbnail_1" referrerpolicy="no-referrer" src="public/images/home.png" />
<span class="text_13">您的位置首页>系统公告</span>
</div>
</div>
</div>
<div class="page-container mt-[30px]">
<div>
<div class="title">{{ info.news_title }}</div>
<div class="flex flex-row justify-start author">
<div>发布人{{ info.news_auto }}</div>
<div class="time">发布时间{{ info.showtime }}</div>
</div>
<div style="border-top: 1px solid rgba(238, 238, 238, 1);"></div>
<div class="my-[30px]">
<div v-html="info.news_content"></div>
</div>
</div>
<div style="border-top: 1px solid rgba(238, 238, 238, 1);"></div>
<div class="py-[30px]">
<div class="">
<div class="">
<div>上一篇XXXXXXXXXXXXXXXXXXXXX</div>
<div class="mt-[10px]">下一篇暂无</div>
</div>
</div>
</div>
</div>
</div>
</template>
<script setup lang="ts">
import { useStore } from '~/store'
import $api from '@/service/webRequest'
const router = useRouter()
const route = useRoute()
const id = ref(route.params.id)
onMounted(() => {
//
document.documentElement.style.fontSize = '16px';
const coMobile = /Mobi|Android|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent);
if (coMobile) {
router.push('/phone_info/' + id.value)
} else {
router.push('/info/' + id.value)
}
getInfo();
})
const info = ref({})
const getInfo = () => {
$api.post("/api/news/info", { id: id.value })
.then((res: any) => {
console.log(res)
info.value = res.data.data
})
.catch((err) => {
console.dir(err)
})
}
</script>
<style scoped>
@import "@/assets/css/common.scss";
@import "@/assets/css/list.css";
.title {
font-size: 26px;
font-weight: 600;
color: #000000;
margin-bottom: 20px;
text-align: center;
}
.author {
font-size: 14px;
color: rgba(153, 153, 153, 1);
margin-bottom: 20px;
}
.page-container{
padding: 0 360px;
}
.time{
margin-left: 70px;
}
@media (max-width: 1440px) {
.page-container{
padding: 0 100px;
}
}
@media (max-width: 768px) {
.page-container{
padding: 0 20px;
}
.author{
flex-direction: column;
font-size: 12px;
text-align: center;
}
.time{
margin-left: 0;
margin-top: 10px;
}
}
</style>

View File

@ -3,34 +3,31 @@
<!-- 头部导航和标题区域 --> <!-- 头部导航和标题区域 -->
<div class="box_6 flex-col px-4 py-3"> <div class="box_6 flex-col px-4 py-3">
<div class="group_1"> <div class="group_1">
<div class="flex section_4 flex-col sm:flex-row justify-between items-center mb-2"> <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" /> <img class="thumbnail_1 w-6 h-6" referrerpolicy="no-referrer" src="public/images/home.png" />
<span class="text_13 text-sm mt-1 sm:mt-0">您的位置首页>系统公告</span>
</div> </div>
<div class="text_14 text-center text-xl font-bold my-3">系统公告</div> <div class="text_13 text-sm mt-1 sm:mt-0">您的位置首页>{{ id == '-3' ? '医生团队' : gory_name }}</div>
</div>
<div class="text_14 text-center text-xl font-bold my-3">{{ id == '-3' ? '医生团队' : gory_name }}</div>
</div> </div>
</div> </div>
<!-- 公告列表 --> <!-- 公告列表 -->
<div class="flex box_7 flex-col px-4 py-2" v-for="item in 5"> <div class="flex box_7 flex-col px-4 py-2" v-for="(item, index) in newsList" :key="index"
@click="goDetail(item)">
<div class="flex image-text_7 flex-col sm:flex-row justify-between mb-4 border-b pb-4"> <div class="flex image-text_7 flex-col sm:flex-row justify-between mb-4 border-b pb-4">
<img class="image_1 w-full sm:w-24 h-auto sm:h-24 object-cover mb-3 sm:mb-0" referrerpolicy="no-referrer" src="public/images/new1.png" /> <img class="image_1 w-full sm:w-24 h-auto sm:h-24 object-cover mb-3 sm:mb-0"
referrerpolicy="no-referrer" :src="item.news_image[0]" />
<div class="flex group_13 flex-col justify-between flex-1 sm:ml-4"> <div class="flex group_13 flex-col justify-between flex-1 sm:ml-4">
<div class="flex text-group_7 flex-col justify-between"> <div class="flex text-group_7 flex-col justify-between">
<span class="text_15 text-base font-medium mb-2"> <div class="text_15 text-base font-medium mb-2">
青云计划再启航树立长三角放疗顶天立地人才培养 <span>{{ item.news_title }} </span>
</span> <span style="font-size: 12px;color: #999;margin-left: 10px;">{{ item.news_key }}</span>
<span class="text_16 text-sm text-gray-600 line-clamp-3">
在清明节来临之际为缅怀革命先烈传承红色精神增强党支部的凝聚力和战斗力3月29日我院机关党总支党委宣传处党支部联合党委办公室党支部赴郑州烈士陵园开展"传承红色基因,续红色血脉"..
</span>
</div> </div>
<div class="flex justify-between items-center mt-3"> <div class="text_16 text-sm text-gray-600 line-clamp-3">
<img class="label_1 h-5" referrerpolicy="no-referrer" src="public/images/bs1.png" /> {{ item.news_auto }}
<!-- 日期移到右侧 -->
<div class="text-right">
<span class="text_17 block text-xl font-bold">08</span>
<span class="text_18 block text-xs text-gray-500">2025.04</span>
</div> </div>
</div> </div>
</div> </div>
@ -38,15 +35,85 @@
</div> </div>
<!-- 分页或底部区域 --> <!-- 分页或底部区域 -->
<div class="group_18 flex-row justify-center my-4 px-4"> <div class="flex flex-row justify-center my-4 py-4">
<!-- 分页控件可以在这里添加 --> <n-pagination v-model:page="page" :item-count="total" :page-slot="7"
@update:page="getPageList"></n-pagination>
</div> </div>
</div> </div>
</template> </template>
<script> <script setup lang="ts">
export default { import { NPagination } from 'naive-ui'
name: 'PhoneListDetail' import { nextTick, ref } from 'vue'
import { useStore } from '~/store'
import $api from '@/service/webRequest'
const router = useRouter()
const route = useRoute()
const id = ref(route.params.id)
onMounted(() => {
//
document.documentElement.style.fontSize = '16px';
const coMobile = /Mobi|Android|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent);
if (coMobile) {
router.push('/phone_list/' + route.params.id)
} else {
router.push('/list/' + route.params.id)
}
if (id.value == '-3') {
getYsGroupList()
} else {
getGroupList()
}
})
const newsList = ref([])
const page = ref(1)
const pageSize = ref(10)
const total = ref(0)
const gory_name = ref('');
const getGroupList = () => {
$api.post("/api/news/index", { gory_id: id.value, page: page.value, pageSize: pageSize.value })
.then((res: any) => {
console.log(res)
newsList.value = res.data.data.list;
total.value = res.data.data.total_count;
gory_name.value = res.data.data.gory_name;
//
window.scrollTo(0, 0)
})
.catch((err) => {
console.dir(err)
})
}
const getYsGroupList = () => {
$api.post("/api/Newsbx/index", { gory_id: id.value, page: page.value, pageSize: pageSize.value })
.then((res: any) => {
console.log(res)
newsList.value = res.data.data.list;
total.value = res.data.data.total_count;
gory_name.value = res.data.data.gory_name;
//
window.scrollTo(0, 0)
})
.catch((err) => {
console.dir(err)
})
}
const getPageList = (p) => {
page.value = p;
if (id.value == '-3') {
getYsGroupList()
} else {
getGroupList()
}
}
const goDetail = (item: any) => {
//router.push(`/info/${item.id}`)
if (id.value == '-3') {
window.open(`/ys_info/${item.id}`)
} else {
window.open(`/info/${item.id}`)
}
} }
</script> </script>
@ -55,14 +122,17 @@ export default {
@import "@/assets/css/list.css"; @import "@/assets/css/list.css";
/* 手机端适配样式 */ /* 手机端适配样式 */
@media (max-width: 640px) { @media (max-width: 768px) {
.box_6, .box_7 {
padding: 0.75rem; .box_6,
.box_7 {
padding: 0px;
} }
.text_14 { .text_14 {
font-size: 1.25rem; font-size: 1.25rem;
margin: 0.75rem 0; margin-top: 30px;
text-align: left;
} }
.text_15 { .text_15 {
@ -72,5 +142,56 @@ export default {
.text_16 { .text_16 {
font-size: 0.875rem; font-size: 0.875rem;
} }
.group_1 {
padding-left: 30px;
}
.section_4 {
width: 100%;
height: auto;
}
.image-text_7 {
width: 100%;
margin: 0px;
height: 100%;
}
.image_1 {
width: 100%;
}
.box_7 {
height: auto;
}
.text-group_7 {
width: auto;
height: auto;
}
.text_15 {
width: 100%;
}
.text_16 {
width: 100%;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden;
margin-top: 10px;
}
.group_13 {
margin: 0px;
padding-left: 10px;
}
}
::v-deep .n-pagination .n-pagination-item:not(.n-pagination-item--disabled).n-pagination-item--active {
color: #1FC4C2;
border: 1px solid #1FC4C2;
} }
</style> </style>

View File

@ -0,0 +1,90 @@
<template>
<div class="bg-[#ffffff]">
<div class="box_6 flex-col">
<div class="group_1">
<div class="flex section_4 flex-row justify-between" style="padding-top: 67px;">
<img class="thumbnail_1" referrerpolicy="no-referrer" src="public/images/home.png" />
<span class="text_13">您的位置首页>医生团队</span>
</div>
</div>
</div>
<div class="page-container mt-[30px]">
<div>
<div class="title">{{ info.news_title }}</div>
<div class="flex flex-row justify-center author">
<div>科室{{ info.news_titleshort }}</div>
<div class="ml-[70px]">{{ info.news_key }}</div>
</div>
<div style="border-top: 1px solid rgba(238, 238, 238, 1);"></div>
<div class="my-[30px]">
<div v-html="info.news_content"></div>
</div>
</div>
<div style="border-top: 1px solid rgba(238, 238, 238, 1);"></div>
</div>
</div>
</template>
<script setup lang="ts">
import { useStore } from '~/store'
import $api from '@/service/webRequest'
const router = useRouter()
const route = useRoute()
const id = ref(route.params.id)
onMounted(() => {
//
document.documentElement.style.fontSize = '16px';
const coMobile = /Mobi|Android|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent);
if (coMobile) {
router.push('/phone_ys_info/' + id.value)
} else {
router.push('/ys_info/' + id.value)
}
getInfo();
})
const info = ref({})
const getInfo = () => {
$api.post("/api/Newsbx/info", { id: id.value })
.then((res: any) => {
console.log(res)
info.value = res.data.data
})
.catch((err) => {
console.dir(err)
})
}
</script>
<style scoped>
@import "@/assets/css/common.scss";
@import "@/assets/css/list.css";
</style>
<style>
.title {
font-size: 26px;
font-weight: 600;
color: #000000;
margin-bottom: 20px;
text-align: center;
}
.author {
font-size: 14px;
color: rgba(153, 153, 153, 1);
margin-bottom: 20px;
}
.page-container{
padding: 0 360px;
}
@media (max-width: 1440px) {
.page-container{
padding: 0 100px;
}
}
@media (max-width: 768px) {
.page-container{
padding: 0 20px;
}
}
/* video{
margin: 20px auto;
} */
</style>

85
pages/ys_info/[id].vue Normal file
View File

@ -0,0 +1,85 @@
<template>
<div class="bg-[#ffffff]">
<div class="box_6 flex-col">
<div class="group_1">
<div class="flex section_4 flex-row justify-between" style="padding-top: 67px;">
<img class="thumbnail_1" referrerpolicy="no-referrer" src="public/images/home.png" />
<span class="text_13">您的位置首页>医生团队</span>
</div>
</div>
</div>
<div class="page-container mt-[30px]">
<div>
<div class="title">{{ info.news_title }}</div>
<div class="flex flex-row justify-center author">
<div>科室{{ info.news_titleshort }}</div>
<div class="ml-[70px]">{{ info.news_key }}</div>
</div>
<div style="border-top: 1px solid rgba(238, 238, 238, 1);"></div>
<div class="my-[30px]">
<div v-html="info.news_content"></div>
</div>
</div>
<div style="border-top: 1px solid rgba(238, 238, 238, 1);"></div>
</div>
</div>
</template>
<script setup lang="ts">
import { useStore } from '~/store'
import $api from '@/service/webRequest'
const router = useRouter()
const route = useRoute()
const id = ref(route.params.id)
onMounted(() => {
//
document.documentElement.style.fontSize = '16px';
const coMobile = /Mobi|Android|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent);
if (coMobile) {
router.push('/phone_ys_info/' + id.value)
} else {
router.push('/ys_info/' + id.value)
}
getInfo();
})
const info = ref({})
const getInfo = () => {
$api.post("/api/Newsbx/info", { id: id.value })
.then((res: any) => {
console.log(res)
info.value = res.data.data
})
.catch((err) => {
console.dir(err)
})
}
</script>
<style scoped>
@import "@/assets/css/common.scss";
@import "@/assets/css/list.css";
</style>
<style>
.title {
font-size: 26px;
font-weight: 600;
color: #000000;
margin-bottom: 20px;
text-align: center;
}
.author {
font-size: 14px;
color: rgba(153, 153, 153, 1);
margin-bottom: 20px;
}
.page-container{
padding: 0 360px;
}
@media (max-width: 1440px) {
.page-container{
padding: 0 100px;
}
}
/* video{
margin: 20px auto;
} */
</style>

Binary file not shown.

Before

Width:  |  Height:  |  Size: 950 KiB

View File

@ -3,7 +3,7 @@ import { handleError } from './handleError'
function createRequestInstance(getServerUrl: () => string): AxiosInstance { function createRequestInstance(getServerUrl: () => string): AxiosInstance {
//获取域名 //获取域名
const serverUrl = window.location.origin; const serverUrl = 'http://admin.xysdwrmyy.cn';
//console.log(serverUrl); //console.log(serverUrl);
const instance = axios.create({ const instance = axios.create({
timeout: 1000 * 60 * 5, // 超时时间 timeout: 1000 * 60 * 5, // 超时时间