1
This commit is contained in:
parent
35b0437ddd
commit
ccbcab40ea
20
.codex/context-question-1.json
Normal file
20
.codex/context-question-1.json
Normal file
@ -0,0 +1,20 @@
|
||||
{
|
||||
"question": "目标 Vue 格式以哪个现有页面为准？需要复用哪些公共组件/样式？",
|
||||
"reasonToDig": "new_about.vue 当前是纯 HTML，必须对齐项目的 Nuxt/Vue SFC 格式。",
|
||||
"findings": {
|
||||
"referencePage": "pages/about.vue uses <template> + <script setup lang=\"ts\"> with Composition API, $api data fetch, scoped SCSS plus shared CSS imports.",
|
||||
"sharedStyles": [
|
||||
"@/assets/css/common.scss",
|
||||
"@/assets/css/about.css"
|
||||
],
|
||||
"sharedComponents": [
|
||||
"AppHeader.vue / AppFooter.vue likely used via layout or app shell (not imported in about.vue but globally in layout)",
|
||||
"tlbs-map-vue components for map on about page; not necessarily required for new_about"
|
||||
],
|
||||
"pattern": "Pages reside under pages/ for Nuxt routing; script uses useRouter/useMounted and TypeScript; styles use lang=\"scss\" scoped."
|
||||
},
|
||||
"evidence": [
|
||||
"pages/about.vue",
|
||||
"pages/index.vue"
|
||||
]
|
||||
}
|
||||
16
.codex/context-questions.json
Normal file
16
.codex/context-questions.json
Normal file
@ -0,0 +1,16 @@
|
||||
{
|
||||
"questions": [
|
||||
{
|
||||
"question": "目标 Vue 格式以哪个现有页面为准（about.vue 还是其他）？需要复用哪些公共组件/样式？",
|
||||
"priority": "high"
|
||||
},
|
||||
{
|
||||
"question": "页面内容是否需要动态数据（接口）还是保持静态文案与下载功能？",
|
||||
"priority": "medium"
|
||||
},
|
||||
{
|
||||
"question": "是否需要手机端适配路由（类似 phone_about.vue）或跳转逻辑？",
|
||||
"priority": "medium"
|
||||
}
|
||||
]
|
||||
}
|
||||
11
.codex/context-scan.json
Normal file
11
.codex/context-scan.json
Normal file
@ -0,0 +1,11 @@
|
||||
{
|
||||
"location": "pages/new_about.vue",
|
||||
"currentImplementation": "A standalone static HTML document with full <html>/<head>/<body> markup, inline CSS and vanilla JS for a download button; not structured as a Nuxt/Vue single-file component and bypasses project header/footer/layout.",
|
||||
"similarCases": [
|
||||
"pages/about.vue (Nuxt 3 SFC using <template> + <script setup lang=\"ts\"> with $api data fetch and map components, scoped SCSS + shared CSS imports)",
|
||||
"pages/index.vue (Nuxt SFC with script setup, composition API, swiper integration, uses project assets and routing)"
|
||||
],
|
||||
"techStack": "Nuxt 3 / Vue 3 with <script setup lang=\"ts\">, Composition API refs/onMounted/useRouter, SCSS styling, Swiper, tlbs-map-vue map components, $api service for backend requests.",
|
||||
"tests": "No dedicated test files found for the page; project appears to rely on manual/runtime verification.",
|
||||
"observationReport": "new_about.vue is off-pattern (plain HTML, inline styles/scripts, encoding garbled text) and omits shared AppHeader/AppFooter/layout wrappers. Needs conversion to project SFC format, reuse shared components/styles, and ensure text encoding corrected."
|
||||
}
|
||||
11
.codex/context-sufficiency.json
Normal file
11
.codex/context-sufficiency.json
Normal file
@ -0,0 +1,11 @@
|
||||
{
|
||||
"canDefineInterface": true,
|
||||
"understandTechChoices": true,
|
||||
"identifiedRisks": [
|
||||
"文本乱码需改为正确中文编码",
|
||||
"需要确认是否添加移动端路由跳转逻辑或沿用静态页面",
|
||||
"内联脚本改写为 Vue 逻辑，避免直接 DOM 操作"
|
||||
],
|
||||
"knowValidationMethod": "手动验证页面渲染与下载按钮行为；如无自动测试，需在浏览器/nuxt dev 查看。",
|
||||
"notes": "已有 about.vue 作为格式参考，可按同样 SFC 结构重写 new_about.vue，保持样式作用域和项目资源路径。"
|
||||
}
|
||||
251
.history/components/AppHeader_20250522152518.vue
Normal file
251
.history/components/AppHeader_20250522152518.vue
Normal file
@ -0,0 +1,251 @@
|
||||
<template>
|
||||
<div class="box_32 flex-col">
|
||||
<div class="section_1 flex-row justify-center items-center"
|
||||
:style="!isMobile ? '' : 'padding-top: 0;height: 50px;'">
|
||||
<div class="flex-col">
|
||||
<img src="public/images/logo.png" alt="logo" class="logo">
|
||||
</div>
|
||||
<div class="text_1">信阳市第五人民医院</div>
|
||||
<!-- 手机端菜单按钮 -->
|
||||
<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">
|
||||
<line x1="3" y1="12" x2="21" y2="12"></line>
|
||||
<line x1="3" y1="6" x2="21" y2="6"></line>
|
||||
<line x1="3" y1="18" x2="21" y2="18"></line>
|
||||
</svg>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 桌面端菜单 -->
|
||||
<div v-if="!isMobile" class="section_2 flex-row">
|
||||
|
||||
<NuxtLink to="/">
|
||||
<div :class="isLinl == '/' ? 'group_2 flex-col' : 'group_4 flex-col'">
|
||||
<span class="text_2">首页</span>
|
||||
<div v-if="isLinl == '/'" class="group_3 flex-col"></div>
|
||||
</div>
|
||||
</NuxtLink>
|
||||
<NuxtLink to="/about">
|
||||
<div :class="isLinl == '/about' ? 'group_2 flex-col' : 'group_4 flex-col'">
|
||||
<span class="text_3">医院概况</span>
|
||||
<div v-if="isLinl == '/about'" class="group_3 flex-col"></div>
|
||||
</div>
|
||||
</NuxtLink>
|
||||
<NuxtLink to="/list/-3">
|
||||
<div :class="isLinl == '/list/-3' ? 'group_2 flex-col' : 'group_4 flex-col'">
|
||||
<span class="text_3">医生团队</span>
|
||||
<div v-if="isLinl == '/list/-3'" class="group_3 flex-col"></div>
|
||||
</div>
|
||||
</NuxtLink>
|
||||
<NuxtLink to="/list/89">
|
||||
<div :class="isLinl == '/list/89' ? 'group_2 flex-col' : 'group_4 flex-col'">
|
||||
<span class="text_3">党建工作</span>
|
||||
<div v-if="isLinl == '/list/89'" class="group_3 flex-col"></div>
|
||||
</div>
|
||||
</NuxtLink>
|
||||
<NuxtLink to="/list/34">
|
||||
<div :class="isLinl == '/list/34' ? 'group_2 flex-col' : 'group_4 flex-col'">
|
||||
<span class="text_3">科室介绍</span>
|
||||
<div v-if="isLinl == '/list/34'" class="group_3 flex-col"></div>
|
||||
</div>
|
||||
</NuxtLink>
|
||||
<NuxtLink to="/list/19">
|
||||
<div :class="isLinl == '/list/19' ? 'group_2 flex-col' : 'group_4 flex-col'">
|
||||
<span class="text_3">招聘信息</span>
|
||||
<div v-if="isLinl == '/list/19'" class="group_3 flex-col"></div>
|
||||
</div>
|
||||
</NuxtLink>
|
||||
<NuxtLink to="/list/22">
|
||||
<div :class="isLinl == '/list/22' ? 'group_2 flex-col' : 'group_4 flex-col'">
|
||||
<span class="text_3">健康科普</span>
|
||||
<div v-if="isLinl == '/list/22'" class="group_3 flex-col"></div>
|
||||
</div>
|
||||
</NuxtLink>
|
||||
<NuxtLink to="/list/88">
|
||||
<div :class="isLinl == '/list/88' ? 'group_2 flex-col' : 'group_4 flex-col'">
|
||||
<span class="text_3">院务公开</span>
|
||||
<div v-if="isLinl == '/list/88'" class="group_3 flex-col"></div>
|
||||
</div>
|
||||
</NuxtLink>
|
||||
<NuxtLink to="/list/23">
|
||||
<div :class="isLinl == '/list/23' ? 'group_2 flex-col' : 'group_4 flex-col'">
|
||||
<span class="text_3">患者服务</span>
|
||||
<div v-if="isLinl == '/list/23'" class="group_3 flex-col"></div>
|
||||
</div>
|
||||
</NuxtLink>
|
||||
<!-- <NuxtLink to="/list/87">
|
||||
<div :class="isLinl == '/list/87' ? 'group_2 flex-col' : 'group_4 flex-col'">
|
||||
<span class="text_3">紧急服务</span>
|
||||
<div v-if="isLinl == '/list/87'" class="group_3 flex-col"></div>
|
||||
</div>
|
||||
</NuxtLink> -->
|
||||
<!-- <NuxtLink to="/list/18">
|
||||
<div :class="isLinl == '/list/18' ? 'group_2 flex-col' : 'group_4 flex-col'">
|
||||
<span class="text_3">科研成果</span>
|
||||
<div v-if="isLinl == '/list/18'" class="group_3 flex-col"></div>
|
||||
</div>
|
||||
</NuxtLink> -->
|
||||
|
||||
</div>
|
||||
|
||||
<!-- 手机端菜单 -->
|
||||
<div v-if="isMobile && mobileMenuOpen" class="mobile-menu">
|
||||
<NuxtLink to="/">
|
||||
<div class="mobile-menu-item" :class="{ 'active': isLinl == '/phone_index' }" @click="selectMenuItem(0)">首页
|
||||
</div>
|
||||
</NuxtLink>
|
||||
<NuxtLink to="/about">
|
||||
<div class="mobile-menu-item" :class="{ 'active': isLinl == '/phone_about' }" @click="selectMenuItem(1)">医院概况
|
||||
</div>
|
||||
</NuxtLink>
|
||||
<NuxtLink v-for="(item, index) in groupList" :key="item.id" :to="'/phone_list/' + item.id">
|
||||
<div class="mobile-menu-item" :class="{ 'active': isLinl == '/phone_list/' + item.id }"
|
||||
@click="mobileMenuOpen = false">{{ item.name }}</div>
|
||||
</NuxtLink>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { ref, onMounted, onUnmounted } from 'vue'
|
||||
import { useRoute } from 'vue-router'
|
||||
import { useI18n } from 'vue-i18n'
|
||||
import { useStore } from '~/store'
|
||||
const store = useStore()
|
||||
const route = useRoute()
|
||||
const isMenuOpen = ref(false)
|
||||
const { locale } = useI18n()
|
||||
const isLinl = ref('/')
|
||||
import $api from '@/service/webRequest'
|
||||
// 手机端相关变量和函数
|
||||
const isMobile = ref(false)
|
||||
const mobileMenuOpen = ref(false)
|
||||
const router = useRouter()
|
||||
// 检测是否为手机端
|
||||
const checkIfMobile = () => {
|
||||
console.log(window.innerWidth);
|
||||
// 判断是否是手机端
|
||||
const coMobile = /Mobi|Android|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent);
|
||||
if (coMobile) {
|
||||
isMobile.value = true
|
||||
} else {
|
||||
isMobile.value = false
|
||||
}
|
||||
}
|
||||
|
||||
// 切换手机端菜单显示状态
|
||||
const toggleMobileMenu = () => {
|
||||
mobileMenuOpen.value = !mobileMenuOpen.value
|
||||
}
|
||||
|
||||
// 选择菜单项并关闭手机端菜单
|
||||
const selectMenuItem = (index: number) => {
|
||||
isLinl.value = index
|
||||
if (isMobile.value) {
|
||||
mobileMenuOpen.value = false
|
||||
}
|
||||
if (index == 0) {
|
||||
sessionStorage.setItem('group_id', '0')
|
||||
router.push('/');
|
||||
} else {
|
||||
sessionStorage.setItem('group_id', '-1')
|
||||
window.location.href = `/about`
|
||||
}
|
||||
}
|
||||
|
||||
watch(route, (newRoute) => {
|
||||
console.log(newRoute);
|
||||
isLinl.value = newRoute.path
|
||||
}, { immediate: true })
|
||||
// 监听窗口大小变化
|
||||
onMounted(() => {
|
||||
//console.log(route);
|
||||
|
||||
// if (route.path == '/about') {
|
||||
// isLinl.value = -1
|
||||
// } else {
|
||||
// isLinl.value = Number(sessionStorage.getItem('group_id'))
|
||||
// }
|
||||
|
||||
checkIfMobile()
|
||||
window.addEventListener('resize', checkIfMobile)
|
||||
getGroupList()
|
||||
})
|
||||
|
||||
onUnmounted(() => {
|
||||
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>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
@import "@/assets/css/index.css";
|
||||
|
||||
/* 响应式样式 */
|
||||
.mobile-menu-button {
|
||||
position: absolute;
|
||||
right: 20px;
|
||||
top: 13px;
|
||||
cursor: pointer;
|
||||
z-index: 100;
|
||||
}
|
||||
|
||||
.mobile-menu {
|
||||
position: absolute;
|
||||
top: 50px;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
background-color: white;
|
||||
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
|
||||
z-index: 99;
|
||||
}
|
||||
|
||||
.mobile-menu-item {
|
||||
padding: 15px 20px;
|
||||
border-bottom: 1px solid #f0f0f0;
|
||||
font-size: 16px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.mobile-menu-item.active {
|
||||
color: #3788ff;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.logo {
|
||||
width: 64px;
|
||||
height: 64px;
|
||||
}
|
||||
|
||||
/* 媒体查询 */
|
||||
@media (max-width: 768px) {
|
||||
.section_1 {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.text_1 {
|
||||
font-size: 20px;
|
||||
}
|
||||
|
||||
.logo {
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
251
.history/components/AppHeader_20250618144808.vue
Normal file
251
.history/components/AppHeader_20250618144808.vue
Normal file
@ -0,0 +1,251 @@
|
||||
<template>
|
||||
<div class="box_32 flex-col">
|
||||
<div class="section_1 flex-row justify-center items-center"
|
||||
:style="!isMobile ? '' : 'padding-top: 0;height: 50px;'">
|
||||
<div class="flex-col">
|
||||
<img src="public/images/logo.png" alt="logo" class="logo">
|
||||
</div>
|
||||
<div class="text_1">信阳市第五人民医院</div>
|
||||
<!-- 手机端菜单按钮 -->
|
||||
<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">
|
||||
<line x1="3" y1="12" x2="21" y2="12"></line>
|
||||
<line x1="3" y1="6" x2="21" y2="6"></line>
|
||||
<line x1="3" y1="18" x2="21" y2="18"></line>
|
||||
</svg>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 桌面端菜单 -->
|
||||
<div v-if="!isMobile" class="section_2 flex-row">
|
||||
|
||||
<NuxtLink to="/">
|
||||
<div :class="isLinl == '/' ? 'group_2 flex-col' : 'group_4 flex-col'">
|
||||
<span class="text_2">首页</span>
|
||||
<div v-if="isLinl == '/'" class="group_3 flex-col"></div>
|
||||
</div>
|
||||
</NuxtLink>
|
||||
<NuxtLink to="/about">
|
||||
<div :class="isLinl == '/about' ? 'group_2 flex-col' : 'group_4 flex-col'">
|
||||
<span class="text_3">医院概况</span>
|
||||
<div v-if="isLinl == '/about'" class="group_3 flex-col"></div>
|
||||
</div>
|
||||
</NuxtLink>
|
||||
<NuxtLink to="/list/-3">
|
||||
<div :class="isLinl == '/list/-3' ? 'group_2 flex-col' : 'group_4 flex-col'">
|
||||
<span class="text_3">医生团队</span>
|
||||
<div v-if="isLinl == '/list/-3'" class="group_3 flex-col"></div>
|
||||
</div>
|
||||
</NuxtLink>
|
||||
<NuxtLink to="/list/89">
|
||||
<div :class="isLinl == '/list/89' ? 'group_2 flex-col' : 'group_4 flex-col'">
|
||||
<span class="text_3">党建工作</span>
|
||||
<div v-if="isLinl == '/list/89'" class="group_3 flex-col"></div>
|
||||
</div>
|
||||
</NuxtLink>
|
||||
<NuxtLink to="/list/34">
|
||||
<div :class="isLinl == '/list/34' ? 'group_2 flex-col' : 'group_4 flex-col'">
|
||||
<span class="text_3">科室介绍</span>
|
||||
<div v-if="isLinl == '/list/34'" class="group_3 flex-col"></div>
|
||||
</div>
|
||||
</NuxtLink>
|
||||
<NuxtLink to="/list/19">
|
||||
<div :class="isLinl == '/list/19' ? 'group_2 flex-col' : 'group_4 flex-col'">
|
||||
<span class="text_3">信息发布</span>
|
||||
<div v-if="isLinl == '/list/19'" class="group_3 flex-col"></div>
|
||||
</div>
|
||||
</NuxtLink>
|
||||
<NuxtLink to="/list/22">
|
||||
<div :class="isLinl == '/list/22' ? 'group_2 flex-col' : 'group_4 flex-col'">
|
||||
<span class="text_3">健康科普</span>
|
||||
<div v-if="isLinl == '/list/22'" class="group_3 flex-col"></div>
|
||||
</div>
|
||||
</NuxtLink>
|
||||
<NuxtLink to="/list/88">
|
||||
<div :class="isLinl == '/list/88' ? 'group_2 flex-col' : 'group_4 flex-col'">
|
||||
<span class="text_3">院务公开</span>
|
||||
<div v-if="isLinl == '/list/88'" class="group_3 flex-col"></div>
|
||||
</div>
|
||||
</NuxtLink>
|
||||
<NuxtLink to="/list/23">
|
||||
<div :class="isLinl == '/list/23' ? 'group_2 flex-col' : 'group_4 flex-col'">
|
||||
<span class="text_3">患者服务</span>
|
||||
<div v-if="isLinl == '/list/23'" class="group_3 flex-col"></div>
|
||||
</div>
|
||||
</NuxtLink>
|
||||
<!-- <NuxtLink to="/list/87">
|
||||
<div :class="isLinl == '/list/87' ? 'group_2 flex-col' : 'group_4 flex-col'">
|
||||
<span class="text_3">紧急服务</span>
|
||||
<div v-if="isLinl == '/list/87'" class="group_3 flex-col"></div>
|
||||
</div>
|
||||
</NuxtLink> -->
|
||||
<!-- <NuxtLink to="/list/18">
|
||||
<div :class="isLinl == '/list/18' ? 'group_2 flex-col' : 'group_4 flex-col'">
|
||||
<span class="text_3">科研成果</span>
|
||||
<div v-if="isLinl == '/list/18'" class="group_3 flex-col"></div>
|
||||
</div>
|
||||
</NuxtLink> -->
|
||||
|
||||
</div>
|
||||
|
||||
<!-- 手机端菜单 -->
|
||||
<div v-if="isMobile && mobileMenuOpen" class="mobile-menu">
|
||||
<NuxtLink to="/">
|
||||
<div class="mobile-menu-item" :class="{ 'active': isLinl == '/phone_index' }" @click="selectMenuItem(0)">首页
|
||||
</div>
|
||||
</NuxtLink>
|
||||
<NuxtLink to="/about">
|
||||
<div class="mobile-menu-item" :class="{ 'active': isLinl == '/phone_about' }" @click="selectMenuItem(1)">医院概况
|
||||
</div>
|
||||
</NuxtLink>
|
||||
<NuxtLink v-for="(item, index) in groupList" :key="item.id" :to="'/phone_list/' + item.id">
|
||||
<div class="mobile-menu-item" :class="{ 'active': isLinl == '/phone_list/' + item.id }"
|
||||
@click="mobileMenuOpen = false">{{ item.name }}</div>
|
||||
</NuxtLink>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { ref, onMounted, onUnmounted } from 'vue'
|
||||
import { useRoute } from 'vue-router'
|
||||
import { useI18n } from 'vue-i18n'
|
||||
import { useStore } from '~/store'
|
||||
const store = useStore()
|
||||
const route = useRoute()
|
||||
const isMenuOpen = ref(false)
|
||||
const { locale } = useI18n()
|
||||
const isLinl = ref('/')
|
||||
import $api from '@/service/webRequest'
|
||||
// 手机端相关变量和函数
|
||||
const isMobile = ref(false)
|
||||
const mobileMenuOpen = ref(false)
|
||||
const router = useRouter()
|
||||
// 检测是否为手机端
|
||||
const checkIfMobile = () => {
|
||||
console.log(window.innerWidth);
|
||||
// 判断是否是手机端
|
||||
const coMobile = /Mobi|Android|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent);
|
||||
if (coMobile) {
|
||||
isMobile.value = true
|
||||
} else {
|
||||
isMobile.value = false
|
||||
}
|
||||
}
|
||||
|
||||
// 切换手机端菜单显示状态
|
||||
const toggleMobileMenu = () => {
|
||||
mobileMenuOpen.value = !mobileMenuOpen.value
|
||||
}
|
||||
|
||||
// 选择菜单项并关闭手机端菜单
|
||||
const selectMenuItem = (index: number) => {
|
||||
isLinl.value = index
|
||||
if (isMobile.value) {
|
||||
mobileMenuOpen.value = false
|
||||
}
|
||||
if (index == 0) {
|
||||
sessionStorage.setItem('group_id', '0')
|
||||
router.push('/');
|
||||
} else {
|
||||
sessionStorage.setItem('group_id', '-1')
|
||||
window.location.href = `/about`
|
||||
}
|
||||
}
|
||||
|
||||
watch(route, (newRoute) => {
|
||||
console.log(newRoute);
|
||||
isLinl.value = newRoute.path
|
||||
}, { immediate: true })
|
||||
// 监听窗口大小变化
|
||||
onMounted(() => {
|
||||
//console.log(route);
|
||||
|
||||
// if (route.path == '/about') {
|
||||
// isLinl.value = -1
|
||||
// } else {
|
||||
// isLinl.value = Number(sessionStorage.getItem('group_id'))
|
||||
// }
|
||||
|
||||
checkIfMobile()
|
||||
window.addEventListener('resize', checkIfMobile)
|
||||
getGroupList()
|
||||
})
|
||||
|
||||
onUnmounted(() => {
|
||||
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>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
@import "@/assets/css/index.css";
|
||||
|
||||
/* 响应式样式 */
|
||||
.mobile-menu-button {
|
||||
position: absolute;
|
||||
right: 20px;
|
||||
top: 13px;
|
||||
cursor: pointer;
|
||||
z-index: 100;
|
||||
}
|
||||
|
||||
.mobile-menu {
|
||||
position: absolute;
|
||||
top: 50px;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
background-color: white;
|
||||
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
|
||||
z-index: 99;
|
||||
}
|
||||
|
||||
.mobile-menu-item {
|
||||
padding: 15px 20px;
|
||||
border-bottom: 1px solid #f0f0f0;
|
||||
font-size: 16px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.mobile-menu-item.active {
|
||||
color: #3788ff;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.logo {
|
||||
width: 64px;
|
||||
height: 64px;
|
||||
}
|
||||
|
||||
/* 媒体查询 */
|
||||
@media (max-width: 768px) {
|
||||
.section_1 {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.text_1 {
|
||||
font-size: 20px;
|
||||
}
|
||||
|
||||
.logo {
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -333,7 +333,6 @@
|
||||
|
||||
.group_8 {
|
||||
width: 569px;
|
||||
height: 302px;
|
||||
}
|
||||
|
||||
.group_9 {
|
||||
|
||||
9
assets/css/all.min.css
vendored
Normal file
9
assets/css/all.min.css
vendored
Normal file
File diff suppressed because one or more lines are too long
@ -947,8 +947,8 @@
|
||||
}
|
||||
|
||||
.label_1 {
|
||||
width: 70px;
|
||||
height: 70px;
|
||||
width: 60px;
|
||||
height: 60px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
@ -1807,16 +1807,17 @@
|
||||
|
||||
.text_68 {
|
||||
width: 509px;
|
||||
height: 214px;
|
||||
height: 228px;
|
||||
overflow-wrap: break-word;
|
||||
color: rgba(153, 153, 153, 1);
|
||||
font-size: 14px;
|
||||
font-family: Source Han Serif CN-Regular;
|
||||
font-weight: NaN;
|
||||
text-align: left;
|
||||
line-height: 22px;
|
||||
line-height: 23px;
|
||||
margin: 16px;
|
||||
text-indent: 2em;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.box_27 {
|
||||
|
||||
@ -434,7 +434,7 @@
|
||||
}
|
||||
|
||||
.text-wrapper_11 {
|
||||
width: 126px;
|
||||
width: 135px;
|
||||
height: 210px;
|
||||
justify-content: flex-center;
|
||||
}
|
||||
|
||||
@ -16,13 +16,13 @@
|
||||
<div class="text_76">电话：0376-3880880</div>
|
||||
<!-- <span class="text_77">门诊时间：周一至周五8:00-12:00；下午13:30-17:00</span> -->
|
||||
</div>
|
||||
<div class="text-wrapper_58 flex-col justify-between">
|
||||
<div class="text-wrapper_58 flex-col justify-between" style="padding-left: 20px;">
|
||||
<div class="text_76" style="margin-top:0px;white-space: normal;width: 100%;">信阳市第五人民医院门诊部南京路办事处社区卫生服务中心</div>
|
||||
<span class="text_76">地址：信阳市羊山新区红旗渠路95号</span>
|
||||
<div class="text_76">线路一:乘坐6路、29路到浉河区烟草局站下车。</div>
|
||||
<div class="text_76">线路一:乘坐6路、29路到浉河区烟草局站下车</div>
|
||||
<div class="text_76">线路二:乘坐7路、11路、32路、K1路</div>
|
||||
<div class="text_76" style="margin-top:0px;">到老果品市场站下车向西步行500米即可达到。</div>
|
||||
<div class="text_76">线路三:乘坐30路到楚王城站下车，步行430米即可到达，</div>
|
||||
<div class="text_76" style="margin-top:0px;">到老果品市场站下车向西步行500米即可达到</div>
|
||||
<div class="text_76">线路三:乘坐30路到楚王城站下车，步行430米即可到达</div>
|
||||
<div class="text_76">预防接种电话:0376-3380902</div>
|
||||
<div class="text_76">健康管理科电话: 0376-3880901</div>
|
||||
<div class="text_76">门诊电话:0376-3880900</div>
|
||||
@ -437,5 +437,35 @@ const getBroadcast = () => {
|
||||
.bottom_list {
|
||||
width: 350px;
|
||||
}
|
||||
.text_70{
|
||||
margin-left: 648px;
|
||||
}
|
||||
.text-wrapper_61{
|
||||
margin: 8px 0 0 30px;
|
||||
}
|
||||
}
|
||||
.text_76{
|
||||
width: 100%;
|
||||
}
|
||||
@media screen and (max-width: 1280px) {
|
||||
.block_9 {
|
||||
margin-left: 20px;
|
||||
}
|
||||
.text-wrapper_58{
|
||||
width: 906px;
|
||||
}
|
||||
.block_4{
|
||||
margin: 38px 0 0 20px;
|
||||
width: 97%;
|
||||
}
|
||||
.text-wrapper_57{
|
||||
margin: 38px 0 0 20px;
|
||||
}
|
||||
.text_70{
|
||||
margin-left: 690px;
|
||||
}
|
||||
.text-wrapper_61{
|
||||
margin: 8px 0 0 0px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -52,7 +52,7 @@
|
||||
</NuxtLink>
|
||||
<NuxtLink to="/list/19">
|
||||
<div :class="isLinl == '/list/19' ? 'group_2 flex-col' : 'group_4 flex-col'">
|
||||
<span class="text_3">招聘信息</span>
|
||||
<span class="text_3">信息发布</span>
|
||||
<div v-if="isLinl == '/list/19'" class="group_3 flex-col"></div>
|
||||
</div>
|
||||
</NuxtLink>
|
||||
@ -73,6 +73,12 @@
|
||||
<span class="text_3">患者服务</span>
|
||||
<div v-if="isLinl == '/list/23'" class="group_3 flex-col"></div>
|
||||
</div>
|
||||
</NuxtLink>
|
||||
<NuxtLink to="/new_about">
|
||||
<div :class="isLinl == '/new_about' ? 'group_2 flex-col' : 'group_4 flex-col'">
|
||||
<span class="text_3">关于我们</span>
|
||||
<div v-if="isLinl == '/new_about'" class="group_3 flex-col"></div>
|
||||
</div>
|
||||
</NuxtLink>
|
||||
<!-- <NuxtLink to="/list/87">
|
||||
<div :class="isLinl == '/list/87' ? 'group_2 flex-col' : 'group_4 flex-col'">
|
||||
@ -80,12 +86,12 @@
|
||||
<div v-if="isLinl == '/list/87'" class="group_3 flex-col"></div>
|
||||
</div>
|
||||
</NuxtLink> -->
|
||||
<NuxtLink to="/list/18">
|
||||
<!-- <NuxtLink to="/list/18">
|
||||
<div :class="isLinl == '/list/18' ? 'group_2 flex-col' : 'group_4 flex-col'">
|
||||
<span class="text_3">科研成果</span>
|
||||
<div v-if="isLinl == '/list/18'" class="group_3 flex-col"></div>
|
||||
</div>
|
||||
</NuxtLink>
|
||||
</NuxtLink> -->
|
||||
|
||||
</div>
|
||||
|
||||
@ -103,6 +109,10 @@
|
||||
<div class="mobile-menu-item" :class="{ 'active': isLinl == '/phone_list/' + item.id }"
|
||||
@click="mobileMenuOpen = false">{{ item.name }}</div>
|
||||
</NuxtLink>
|
||||
<NuxtLink to="/phone_new_about.vue">
|
||||
<div class="mobile-menu-item" :class="{ 'active': isLinl == '/phone_new_about.vue' }" @click="selectMenuItem(2)">关于我们
|
||||
</div>
|
||||
</NuxtLink>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
@ -148,9 +158,12 @@ const selectMenuItem = (index: number) => {
|
||||
if (index == 0) {
|
||||
sessionStorage.setItem('group_id', '0')
|
||||
router.push('/');
|
||||
} else {
|
||||
} else if (index == 1) {
|
||||
sessionStorage.setItem('group_id', '-1')
|
||||
window.location.href = `/about`
|
||||
} else if (index == 2) {
|
||||
sessionStorage.setItem('group_id', '-1')
|
||||
window.location.href = `/phone_new_about`
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@ -7,14 +7,15 @@ export default defineNuxtConfig({
|
||||
},
|
||||
nitro: {
|
||||
routeRules: {
|
||||
'/**': { trailingSlash: false }
|
||||
'/**': {}
|
||||
}
|
||||
},
|
||||
ssr: false,
|
||||
css: [
|
||||
'swiper/css',
|
||||
'swiper/css/mousewheel',
|
||||
'@/assets/css/common.scss'
|
||||
'@/assets/css/common.scss',
|
||||
'@/assets/css/all.min.css'
|
||||
],
|
||||
devtools: { enabled: true },
|
||||
|
||||
|
||||
@ -9,7 +9,7 @@
|
||||
<div class="text_14">医院概况</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex box_9 flex-row justify-center">
|
||||
<div class="flex box_9 flex-row justify-center" style="align-items: 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">
|
||||
|
||||
@ -66,15 +66,15 @@
|
||||
<div class="group_19 flex-col"></div>
|
||||
</div>
|
||||
<div class="group_36 flex-col justify-between">
|
||||
<NuxtLink to="/list/87">
|
||||
<NuxtLink to="/info/30327">
|
||||
<div class="box_14 flex-col">
|
||||
<div class="image-text_20 flex-col justify-between">
|
||||
<div class="image-wrapper_2 flex-col">
|
||||
<img class="label_1" referrerpolicy="no-referrer" src="public/images/k6.png" />
|
||||
</div>
|
||||
<span class="text-group_6">紧急服务</span>
|
||||
<span class="text-group_6">联系方式</span>
|
||||
</div>
|
||||
<span class="text_34">Emergency services</span>
|
||||
<span class="text_34">Contact Us</span>
|
||||
</div>
|
||||
</NuxtLink>
|
||||
<NuxtLink to="/list/-3">
|
||||
@ -218,7 +218,7 @@
|
||||
<swiper-slide v-for="item in ysList" @click="goYsDetail(item)">
|
||||
<div class="group_10 flex-col cursor-pointer">
|
||||
<div class="image-text_15 flex-col justify-between">
|
||||
<img class="image_3" referrerpolicy="no-referrer" :src="item.news_image[0]" />
|
||||
<img class="image_3" referrerpolicy="no-referrer" :src="item.news_image[0]" style="object-fit: cover;"/>
|
||||
<div class="text-group_13 flex-row">
|
||||
<span class="text_14">{{ item.news_title }}</span>
|
||||
<span class="text_15">{{ item.news_key }}</span>
|
||||
@ -243,7 +243,7 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="bg-white pb-[50px]">
|
||||
<!-- <div class="bg-white pb-[50px]">
|
||||
<div class="block_6 flex-row justify-center">
|
||||
<div v-for="item in bottomList" @click="cardOpen(item)"
|
||||
:class="['text-wrapper_12', card == item.id ? 'text-wrapper_12-is' : '', 'flex-col']">
|
||||
@ -281,7 +281,7 @@
|
||||
:class="activedKKIndex == index ? '' : 'opacity-50'"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div> -->
|
||||
</div>
|
||||
</template>
|
||||
|
||||
|
||||
@ -31,8 +31,8 @@
|
||||
<span class="text_17">{{ formattedMonth(item.showtime) }}</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 v-if="id == '-3'" class="flex text-wrapper_11 flex-col text-center" style="justify-content: center">
|
||||
<span style="font-size: 22px;color: #ffffff;">{{ item.news_titleshort }}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
535
pages/new_about.vue
Normal file
535
pages/new_about.vue
Normal file
@ -0,0 +1,535 @@
|
||||
<template>
|
||||
<div class="container-wrapper">
|
||||
<header>
|
||||
<div class="container">
|
||||
<div class="hospital-name">信阳市传染病医院</div>
|
||||
<h1>血液透析中心</h1>
|
||||
<p class="subtitle">专业、安全、人性化的透析服务，为艾滋病、病毒性肝炎、梅毒、结核病等传染病患者提供专属医疗关怀</p>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<div class="container">
|
||||
<section class="download-section">
|
||||
<h2>宣传资料下载</h2>
|
||||
<p>点击下方按钮下载本宣传稿的Word文档版本，方便打印和分享</p>
|
||||
<button class="download-btn" @click="downloadWordDoc" id="downloadBtn">
|
||||
<i class="fas fa-file-word"></i> 下载Word文档
|
||||
</button>
|
||||
<p class="note">下载后可在Microsoft Word或其他文字处理软件中编辑使用</p>
|
||||
</section>
|
||||
|
||||
<div class="content">
|
||||
<main class="main-content">
|
||||
<section class="card">
|
||||
<h2>关于我们的透析中心</h2>
|
||||
<p>信阳市传染病医院血液透析中心是豫南地区首家专门为患有艾滋病、病毒性肝炎、梅毒、结核病等传染病的肾衰竭患者提供安全、专业透析治疗的医疗设施。我们理解传染病患者在接受常规透析治疗时面临的特殊困难，因此建立了这个独立、安全、专业的透析中心。</p>
|
||||
|
||||
<div class="highlight">
|
||||
<p>我们的使命是为传染病透析患者提供与普通患者同等质量的透析治疗，同时确保所有患者和医护人员的安全，消除交叉感染风险。</p>
|
||||
</div>
|
||||
|
||||
<p>中心配备了国际先进的血液透析设备和水处理系统，采用严格的感染控制标准和操作流程，由经验丰富的传染病专科医生和透析护士团队提供专业医疗服务。</p>
|
||||
</section>
|
||||
|
||||
<section class="card">
|
||||
<h2>我们的特色服务</h2>
|
||||
|
||||
<div class="services-grid">
|
||||
<div class="service-item">
|
||||
<div class="icon">
|
||||
<i class="fas fa-shield-alt"></i>
|
||||
</div>
|
||||
<h3>严格感染控制</h3>
|
||||
<p>独立分区、专用设备、严格消毒流程，确保零交叉感染</p>
|
||||
</div>
|
||||
|
||||
<div class="service-item">
|
||||
<div class="icon">
|
||||
<i class="fas fa-user-md"></i>
|
||||
</div>
|
||||
<h3>专业医疗团队</h3>
|
||||
<p>传染病专家与透析专科医生协作，提供个性化治疗方案</p>
|
||||
</div>
|
||||
|
||||
<div class="service-item">
|
||||
<div class="icon">
|
||||
<i class="fas fa-heartbeat"></i>
|
||||
</div>
|
||||
<h3>先进设备</h3>
|
||||
<p>国际先进透析设备，确保治疗效果和患者安全</p>
|
||||
</div>
|
||||
|
||||
<div class="service-item">
|
||||
<div class="icon">
|
||||
<i class="fas fa-comments"></i>
|
||||
</div>
|
||||
<h3>心理支持</h3>
|
||||
<p>专业心理医生提供心理疏导，帮助患者积极面对疾病</p>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="card">
|
||||
<h2>为什么选择我们的透析中心？</h2>
|
||||
<p>对于患有传染病的肾衰竭患者，常规透析中心往往无法接收，或给患者带来巨大的心理压力。我们的中心解决了这一难题：</p>
|
||||
|
||||
<h3>1. 安全专业的治疗环境</h3>
|
||||
<p>中心完全按照传染病防控最高标准建设，设有独立通道、负压病房、专用设备，医疗废物严格分类处理，确保治疗过程安全可控。</p>
|
||||
|
||||
<h3>2. 尊重与隐私保护</h3>
|
||||
<p>我们尊重每一位患者的隐私权，实行严格的信息保密制度，让患者能够安心接受治疗，无需担心歧视或隐私泄露。</p>
|
||||
|
||||
<h3>3. 综合医疗服务</h3>
|
||||
<p>除了常规透析治疗，我们还提供传染病专科诊疗、药物管理、营养指导等一站式服务，全面管理患者的健康状况。</p>
|
||||
|
||||
<h3>4. 医保报销支持</h3>
|
||||
<p>中心已纳入医保定点单位，符合条件的透析治疗费用可按政策报销，减轻患者经济负担。</p>
|
||||
</section>
|
||||
</main>
|
||||
|
||||
<aside class="sidebar">
|
||||
<section class="card">
|
||||
<h2>接收患者类型</h2>
|
||||
<p>本中心专门为以下传染病患者提供血液透析服务：</p>
|
||||
<ul>
|
||||
<li><i class="fas fa-plus-circle" style="color: #1AACA2;"></i> 艾滋病病毒(HIV)感染者</li>
|
||||
<li><i class="fas fa-plus-circle" style="color: #1AACA2;"></i> 乙型/丙型病毒性肝炎患者</li>
|
||||
<li><i class="fas fa-plus-circle" style="color: #1AACA2;"></i> 梅毒感染者</li>
|
||||
<li><i class="fas fa-plus-circle" style="color: #1AACA2;"></i> 活动性结核病患者</li>
|
||||
<li><i class="fas fa-plus-circle" style="color: #1AACA2;"></i> 其他需要隔离透析的传染病患者</li>
|
||||
</ul>
|
||||
|
||||
<div class="highlight">
|
||||
<p><strong>注意：</strong>患者需提供有效的传染病诊断证明，并经中心医生评估后确定接收。</p>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="card contact-info">
|
||||
<h2>联系我们</h2>
|
||||
|
||||
<div class="contact-item">
|
||||
<div class="contact-icon">
|
||||
<i class="fas fa-map-marker-alt"></i>
|
||||
</div>
|
||||
<div>
|
||||
<h3>地址</h3>
|
||||
<p>信阳市南京大道京港澳高速立交桥东500米</p>
|
||||
<div class="address-map">
|
||||
<p><i class="fas fa-info-circle"></i> 位于信阳市传染病医院院内，内科楼3层</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="contact-item">
|
||||
<div class="contact-icon">
|
||||
<i class="fas fa-phone-alt"></i>
|
||||
</div>
|
||||
<div>
|
||||
<h3>咨询电话</h3>
|
||||
<p class="phone-number">
|
||||
<span class="doctor-name">孙医生</span> 18058633387
|
||||
</p>
|
||||
<p>工作日 8:00-17:00</p>
|
||||
<p>24小时急诊咨询：同上电话</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="contact-item">
|
||||
<div class="contact-icon">
|
||||
<i class="fas fa-clock"></i>
|
||||
</div>
|
||||
<div>
|
||||
<h3>服务时间</h3>
|
||||
<p>周一至周六：7:00-22:00 (分批次透析)</p>
|
||||
<p>周日：急诊透析服务</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="contact-item">
|
||||
<div class="contact-icon">
|
||||
<i class="fas fa-calendar-check"></i>
|
||||
</div>
|
||||
<div>
|
||||
<h3>预约方式</h3>
|
||||
<p>1. 电话预约：联系孙医生安排</p>
|
||||
<p>2. 门诊医生转诊</p>
|
||||
<p>3. 合作医院转介</p>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</aside>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<footer>
|
||||
<div class="container">
|
||||
<p>信阳市传染病医院血液透析中心 © 2023 版权所有</p>
|
||||
<p>专业医疗，安全透析，尊重隐私，用心关怀每一位患者</p>
|
||||
<p style="margin-top: 15px; font-size: 0.9rem;">本宣传稿仅供参考，具体服务内容以中心实际提供为准</p>
|
||||
</div>
|
||||
</footer>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
useHead({
|
||||
link: [
|
||||
{
|
||||
rel: 'stylesheet',
|
||||
href: 'https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css',
|
||||
}
|
||||
]
|
||||
})
|
||||
|
||||
const downloadWordDoc = () => {
|
||||
// 创建Word文档内容
|
||||
const content = `
|
||||
信阳市传染病医院血液透析中心宣传稿
|
||||
|
||||
关于我们的透析中心
|
||||
|
||||
信阳市传染病医院血液透析中心是豫南地区首家专门为患有艾滋病、病毒性肝炎、梅毒、结核病等传染病的肾衰竭患者提供安全、专业透析治疗的医疗设施。我们理解传染病患者在接受常规透析治疗时面临的特殊困难，因此建立了这个独立、安全、专业的透析中心。
|
||||
|
||||
我们的使命是为传染病透析患者提供与普通患者同等质量的透析治疗，同时确保所有患者和医护人员的安全，消除交叉感染风险。
|
||||
|
||||
中心配备了国际先进的血液透析设备和水处理系统，采用严格的感染控制标准和操作流程，由经验丰富的传染病专科医生和透析护士团队提供专业医疗服务。
|
||||
|
||||
我们的特色服务
|
||||
|
||||
1. 严格感染控制
|
||||
独立分区、专用设备、严格消毒流程，确保零交叉感染
|
||||
|
||||
2. 专业医疗团队
|
||||
传染病专家与透析专科医生协作，提供个性化治疗方案
|
||||
|
||||
3. 先进设备
|
||||
国际先进透析设备，确保治疗效果和患者安全
|
||||
|
||||
4. 心理支持
|
||||
专业心理医生提供心理疏导，帮助患者积极面对疾病
|
||||
|
||||
为什么选择我们的透析中心？
|
||||
|
||||
对于患有传染病的肾衰竭患者，常规透析中心往往无法接收，或给患者带来巨大的心理压力。我们的中心解决了这一难题：
|
||||
|
||||
1. 安全专业的治疗环境
|
||||
中心完全按照传染病防控最高标准建设，设有独立通道、负压病房、专用设备，医疗废物严格分类处理，确保治疗过程安全可控。
|
||||
|
||||
2. 尊重与隐私保护
|
||||
我们尊重每一位患者的隐私权，实行严格的信息保密制度，让患者能够安心接受治疗，无需担心歧视或隐私泄露。
|
||||
|
||||
3. 综合医疗服务
|
||||
除了常规透析治疗，我们还提供传染病专科诊疗、药物管理、营养指导等一站式服务，全面管理患者的健康状况。
|
||||
|
||||
4. 医保报销支持
|
||||
中心已纳入医保定点单位，符合条件的透析治疗费用可按政策报销，减轻患者经济负担。
|
||||
|
||||
接收患者类型
|
||||
|
||||
本中心专门为以下传染病患者提供血液透析服务：
|
||||
• 艾滋病病毒(HIV)感染者
|
||||
• 乙型/丙型病毒性肝炎患者
|
||||
• 梅毒感染者
|
||||
• 活动性结核病患者
|
||||
• 其他需要隔离透析的传染病患者
|
||||
|
||||
注意：患者需提供有效的传染病诊断证明，并经中心医生评估后确定接收。
|
||||
|
||||
联系我们
|
||||
|
||||
地址：信阳市南京大道京港澳高速立交桥东500米（信阳市传染病医院院内，内科楼3层）
|
||||
|
||||
咨询电话：孙医生 18058633387
|
||||
工作日：8:00-17:00
|
||||
24小时急诊咨询：同上电话
|
||||
|
||||
服务时间：
|
||||
周一至周六：7:00-22:00 (分批次透析)
|
||||
周日：急诊透析服务
|
||||
|
||||
预约方式：
|
||||
1. 电话预约：联系孙医生安排
|
||||
2. 门诊医生转诊
|
||||
3. 合作医院转介
|
||||
|
||||
信阳市传染病医院血液透析中心 © 2023 版权所有
|
||||
专业医疗，安全透析，尊重隐私，用心关怀每一位患者
|
||||
|
||||
本宣传稿仅供参考，具体服务内容以中心实际提供为准
|
||||
`;
|
||||
|
||||
// 创建Blob对象
|
||||
const blob = new Blob([content], { type: 'application/msword' });
|
||||
|
||||
// 创建下载链接
|
||||
const url = URL.createObjectURL(blob);
|
||||
const a = document.createElement('a');
|
||||
a.href = url;
|
||||
a.download = '信阳市传染病医院血液透析中心宣传稿.doc';
|
||||
|
||||
// 触发下载
|
||||
document.body.appendChild(a);
|
||||
a.click();
|
||||
|
||||
// 清理
|
||||
setTimeout(() => {
|
||||
document.body.removeChild(a);
|
||||
URL.revokeObjectURL(url);
|
||||
}, 100);
|
||||
|
||||
// 显示下载成功提示
|
||||
const button = document.getElementById('downloadBtn');
|
||||
if (button) {
|
||||
const originalText = button.innerHTML;
|
||||
button.innerHTML = '<i class="fas fa-check"></i> 下载完成！';
|
||||
button.style.backgroundColor = '#4CAF50';
|
||||
|
||||
setTimeout(() => {
|
||||
button.innerHTML = originalText;
|
||||
button.style.backgroundColor = '';
|
||||
}, 2000);
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
* {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
box-sizing: border-box;
|
||||
font-family: 'Segoe UI', 'Microsoft YaHei', sans-serif;
|
||||
}
|
||||
|
||||
.container-wrapper {
|
||||
background-color: #f5f9fc;
|
||||
color: #333;
|
||||
line-height: 1.6;
|
||||
min-height: 100vh;
|
||||
}
|
||||
|
||||
.container {
|
||||
max-width: 1200px;
|
||||
margin: 0 auto;
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
header {
|
||||
background: linear-gradient(135deg, #1AACA2 0%, #2ECCAA 100%);
|
||||
color: white;
|
||||
padding: 40px 20px;
|
||||
text-align: center;
|
||||
border-radius: 0 0 20px 20px;
|
||||
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
|
||||
margin-bottom: 30px;
|
||||
}
|
||||
|
||||
h1 {
|
||||
font-size: 2.5rem;
|
||||
margin-bottom: 15px;
|
||||
text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.2);
|
||||
}
|
||||
|
||||
.hospital-name {
|
||||
font-size: 1.8rem;
|
||||
margin-bottom: 10px;
|
||||
color: #e8f2f8;
|
||||
}
|
||||
|
||||
.subtitle {
|
||||
font-size: 1.4rem;
|
||||
font-weight: 300;
|
||||
max-width: 800px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.download-section {
|
||||
background-color: white;
|
||||
border-radius: 15px;
|
||||
padding: 25px;
|
||||
margin: 30px 0;
|
||||
text-align: center;
|
||||
box-shadow: 0 5px 15px rgba(0, 0, 0, 0.05);
|
||||
border-left: 6px solid #1AACA2;
|
||||
}
|
||||
|
||||
.download-btn {
|
||||
display: inline-block;
|
||||
background-color: #1AACA2;
|
||||
color: white;
|
||||
padding: 15px 35px;
|
||||
font-size: 1.2rem;
|
||||
border-radius: 50px;
|
||||
text-decoration: none;
|
||||
margin: 20px 0;
|
||||
transition: all 0.3s ease;
|
||||
border: none;
|
||||
cursor: pointer;
|
||||
box-shadow: 0 4px 8px rgba(26, 172, 162, 0.3);
|
||||
}
|
||||
|
||||
.download-btn:hover {
|
||||
background-color: #179B8E;
|
||||
transform: translateY(-3px);
|
||||
box-shadow: 0 6px 12px rgba(26, 172, 162, 0.4);
|
||||
}
|
||||
|
||||
.content {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 30px;
|
||||
margin-top: 30px;
|
||||
}
|
||||
|
||||
.main-content {
|
||||
flex: 2;
|
||||
min-width: 300px;
|
||||
}
|
||||
|
||||
.sidebar {
|
||||
flex: 1;
|
||||
min-width: 280px;
|
||||
}
|
||||
|
||||
.card {
|
||||
background-color: white;
|
||||
border-radius: 15px;
|
||||
padding: 30px;
|
||||
margin-bottom: 30px;
|
||||
box-shadow: 0 5px 15px rgba(0, 0, 0, 0.05);
|
||||
}
|
||||
|
||||
h2 {
|
||||
color: #1AACA2;
|
||||
margin-bottom: 20px;
|
||||
padding-bottom: 10px;
|
||||
border-bottom: 2px solid #E9F7F6;
|
||||
}
|
||||
|
||||
h3 {
|
||||
color: #1AACA2;
|
||||
margin: 25px 0 15px;
|
||||
}
|
||||
|
||||
p {
|
||||
margin-bottom: 15px;
|
||||
font-size: 1.05rem;
|
||||
}
|
||||
|
||||
ul, ol {
|
||||
padding-left: 25px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
li {
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.highlight {
|
||||
background-color: #E9F7F6;
|
||||
border-left: 4px solid #1AACA2;
|
||||
padding: 20px;
|
||||
margin: 25px 0;
|
||||
border-radius: 0 10px 10px 0;
|
||||
}
|
||||
|
||||
.services-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
|
||||
gap: 20px;
|
||||
margin-top: 20px;
|
||||
}
|
||||
|
||||
.service-item {
|
||||
background-color: #F0F9F7;
|
||||
padding: 20px;
|
||||
border-radius: 10px;
|
||||
text-align: center;
|
||||
transition: transform 0.3s ease;
|
||||
}
|
||||
|
||||
.service-item:hover {
|
||||
transform: translateY(-5px);
|
||||
background-color: #E1F4F2;
|
||||
}
|
||||
|
||||
.icon {
|
||||
font-size: 2.5rem;
|
||||
margin-bottom: 15px;
|
||||
color: #1AACA2;
|
||||
}
|
||||
|
||||
.contact-info {
|
||||
background: linear-gradient(135deg, #F0F9F7 0%, #E1F4F2 100%);
|
||||
padding: 25px;
|
||||
border-radius: 15px;
|
||||
}
|
||||
|
||||
.contact-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.contact-icon {
|
||||
font-size: 1.5rem;
|
||||
color: #1AACA2;
|
||||
margin-right: 15px;
|
||||
width: 30px;
|
||||
}
|
||||
|
||||
.phone-number {
|
||||
font-size: 1.3rem;
|
||||
font-weight: bold;
|
||||
color: #1AACA2;
|
||||
}
|
||||
|
||||
.doctor-name {
|
||||
color: #1AACA2;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
footer {
|
||||
text-align: center;
|
||||
padding: 30px;
|
||||
margin-top: 40px;
|
||||
background-color: #1AACA2;
|
||||
color: white;
|
||||
border-radius: 20px 20px 0 0;
|
||||
}
|
||||
|
||||
.address-map {
|
||||
margin-top: 15px;
|
||||
padding: 15px;
|
||||
background-color: #f8f8f8;
|
||||
border-radius: 8px;
|
||||
border-left: 4px solid #1AACA2;
|
||||
}
|
||||
|
||||
.note {
|
||||
margin-top: 10px;
|
||||
font-size: 0.9rem;
|
||||
color: #666;
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
h1 {
|
||||
font-size: 2rem;
|
||||
}
|
||||
|
||||
.hospital-name {
|
||||
font-size: 1.5rem;
|
||||
}
|
||||
|
||||
.subtitle {
|
||||
font-size: 1.2rem;
|
||||
}
|
||||
|
||||
.content {
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.services-grid {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -66,8 +66,8 @@
|
||||
<img class="label_5 w-12 h-12" referrerpolicy="no-referrer"
|
||||
src="public/images/k6.png" />
|
||||
</div>
|
||||
<span class="text-sm">紧急服务</span>
|
||||
<span class="text-xs">Emergency services</span>
|
||||
<span class="text-sm">联系方式</span>
|
||||
<span class="text-xs">Contact Us</span>
|
||||
</div>
|
||||
<div class="box_24 flex-col w-[48%] mb-4" @click="openUrl(3)"
|
||||
style="background-color: #466C9A;;">
|
||||
@ -458,8 +458,8 @@ const openUrl = (index: number) => {
|
||||
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`
|
||||
// sessionStorage.setItem('group_id', '87')
|
||||
window.location.href = `/phone_info/30327`
|
||||
} else if (index == 3) {
|
||||
sessionStorage.setItem('group_id', '-3')
|
||||
window.location.href = `/phone_list/-3`
|
||||
@ -646,7 +646,7 @@ const goYsDetail = (item) => {
|
||||
|
||||
.text_68 {
|
||||
margin: 0px;
|
||||
height: auto;
|
||||
height: 400px;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
|
||||
535
pages/phone_new_about.vue
Normal file
535
pages/phone_new_about.vue
Normal file
@ -0,0 +1,535 @@
|
||||
<template>
|
||||
<div class="container-wrapper">
|
||||
<header>
|
||||
<div class="container">
|
||||
<div class="hospital-name">信阳市传染病医院</div>
|
||||
<h1>血液透析中心</h1>
|
||||
<p class="subtitle">专业、安全、人性化的透析服务，为艾滋病、病毒性肝炎、梅毒、结核病等传染病患者提供专属医疗关怀</p>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<div class="container">
|
||||
<section class="download-section">
|
||||
<h2>宣传资料下载</h2>
|
||||
<p>点击下方按钮下载本宣传稿的Word文档版本，方便打印和分享</p>
|
||||
<button class="download-btn" @click="downloadWordDoc" id="downloadBtn">
|
||||
<i class="fas fa-file-word"></i> 下载Word文档
|
||||
</button>
|
||||
<p class="note">下载后可在Microsoft Word或其他文字处理软件中编辑使用</p>
|
||||
</section>
|
||||
|
||||
<div class="content">
|
||||
<main class="main-content">
|
||||
<section class="card">
|
||||
<h2>关于我们的透析中心</h2>
|
||||
<p>信阳市传染病医院血液透析中心是豫南地区首家专门为患有艾滋病、病毒性肝炎、梅毒、结核病等传染病的肾衰竭患者提供安全、专业透析治疗的医疗设施。我们理解传染病患者在接受常规透析治疗时面临的特殊困难，因此建立了这个独立、安全、专业的透析中心。</p>
|
||||
|
||||
<div class="highlight">
|
||||
<p>我们的使命是为传染病透析患者提供与普通患者同等质量的透析治疗，同时确保所有患者和医护人员的安全，消除交叉感染风险。</p>
|
||||
</div>
|
||||
|
||||
<p>中心配备了国际先进的血液透析设备和水处理系统，采用严格的感染控制标准和操作流程，由经验丰富的传染病专科医生和透析护士团队提供专业医疗服务。</p>
|
||||
</section>
|
||||
|
||||
<section class="card">
|
||||
<h2>我们的特色服务</h2>
|
||||
|
||||
<div class="services-grid">
|
||||
<div class="service-item">
|
||||
<div class="icon">
|
||||
<i class="fas fa-shield-alt"></i>
|
||||
</div>
|
||||
<h3>严格感染控制</h3>
|
||||
<p>独立分区、专用设备、严格消毒流程，确保零交叉感染</p>
|
||||
</div>
|
||||
|
||||
<div class="service-item">
|
||||
<div class="icon">
|
||||
<i class="fas fa-user-md"></i>
|
||||
</div>
|
||||
<h3>专业医疗团队</h3>
|
||||
<p>传染病专家与透析专科医生协作，提供个性化治疗方案</p>
|
||||
</div>
|
||||
|
||||
<div class="service-item">
|
||||
<div class="icon">
|
||||
<i class="fas fa-heartbeat"></i>
|
||||
</div>
|
||||
<h3>先进设备</h3>
|
||||
<p>国际先进透析设备，确保治疗效果和患者安全</p>
|
||||
</div>
|
||||
|
||||
<div class="service-item">
|
||||
<div class="icon">
|
||||
<i class="fas fa-comments"></i>
|
||||
</div>
|
||||
<h3>心理支持</h3>
|
||||
<p>专业心理医生提供心理疏导，帮助患者积极面对疾病</p>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="card">
|
||||
<h2>为什么选择我们的透析中心？</h2>
|
||||
<p>对于患有传染病的肾衰竭患者，常规透析中心往往无法接收，或给患者带来巨大的心理压力。我们的中心解决了这一难题：</p>
|
||||
|
||||
<h3>1. 安全专业的治疗环境</h3>
|
||||
<p>中心完全按照传染病防控最高标准建设，设有独立通道、负压病房、专用设备，医疗废物严格分类处理，确保治疗过程安全可控。</p>
|
||||
|
||||
<h3>2. 尊重与隐私保护</h3>
|
||||
<p>我们尊重每一位患者的隐私权，实行严格的信息保密制度，让患者能够安心接受治疗，无需担心歧视或隐私泄露。</p>
|
||||
|
||||
<h3>3. 综合医疗服务</h3>
|
||||
<p>除了常规透析治疗，我们还提供传染病专科诊疗、药物管理、营养指导等一站式服务，全面管理患者的健康状况。</p>
|
||||
|
||||
<h3>4. 医保报销支持</h3>
|
||||
<p>中心已纳入医保定点单位，符合条件的透析治疗费用可按政策报销，减轻患者经济负担。</p>
|
||||
</section>
|
||||
</main>
|
||||
|
||||
<aside class="sidebar">
|
||||
<section class="card">
|
||||
<h2>接收患者类型</h2>
|
||||
<p>本中心专门为以下传染病患者提供血液透析服务：</p>
|
||||
<ul>
|
||||
<li><i class="fas fa-plus-circle" style="color: #1AACA2;"></i> 艾滋病病毒(HIV)感染者</li>
|
||||
<li><i class="fas fa-plus-circle" style="color: #1AACA2;"></i> 乙型/丙型病毒性肝炎患者</li>
|
||||
<li><i class="fas fa-plus-circle" style="color: #1AACA2;"></i> 梅毒感染者</li>
|
||||
<li><i class="fas fa-plus-circle" style="color: #1AACA2;"></i> 活动性结核病患者</li>
|
||||
<li><i class="fas fa-plus-circle" style="color: #1AACA2;"></i> 其他需要隔离透析的传染病患者</li>
|
||||
</ul>
|
||||
|
||||
<div class="highlight">
|
||||
<p><strong>注意：</strong>患者需提供有效的传染病诊断证明，并经中心医生评估后确定接收。</p>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="card contact-info">
|
||||
<h2>联系我们</h2>
|
||||
|
||||
<div class="contact-item">
|
||||
<div class="contact-icon">
|
||||
<i class="fas fa-map-marker-alt"></i>
|
||||
</div>
|
||||
<div>
|
||||
<h3>地址</h3>
|
||||
<p>信阳市南京大道京港澳高速立交桥东500米</p>
|
||||
<div class="address-map">
|
||||
<p><i class="fas fa-info-circle"></i> 位于信阳市传染病医院院内，内科楼3层</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="contact-item">
|
||||
<div class="contact-icon">
|
||||
<i class="fas fa-phone-alt"></i>
|
||||
</div>
|
||||
<div>
|
||||
<h3>咨询电话</h3>
|
||||
<p class="phone-number">
|
||||
<span class="doctor-name">孙医生</span> 18058633387
|
||||
</p>
|
||||
<p>工作日 8:00-17:00</p>
|
||||
<p>24小时急诊咨询：同上电话</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="contact-item">
|
||||
<div class="contact-icon">
|
||||
<i class="fas fa-clock"></i>
|
||||
</div>
|
||||
<div>
|
||||
<h3>服务时间</h3>
|
||||
<p>周一至周六：7:00-22:00 (分批次透析)</p>
|
||||
<p>周日：急诊透析服务</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="contact-item">
|
||||
<div class="contact-icon">
|
||||
<i class="fas fa-calendar-check"></i>
|
||||
</div>
|
||||
<div>
|
||||
<h3>预约方式</h3>
|
||||
<p>1. 电话预约：联系孙医生安排</p>
|
||||
<p>2. 门诊医生转诊</p>
|
||||
<p>3. 合作医院转介</p>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</aside>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<footer>
|
||||
<div class="container">
|
||||
<p>信阳市传染病医院血液透析中心 © 2023 版权所有</p>
|
||||
<p>专业医疗，安全透析，尊重隐私，用心关怀每一位患者</p>
|
||||
<p style="margin-top: 15px; font-size: 0.9rem;">本宣传稿仅供参考，具体服务内容以中心实际提供为准</p>
|
||||
</div>
|
||||
</footer>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
useHead({
|
||||
link: [
|
||||
{
|
||||
rel: 'stylesheet',
|
||||
href: 'https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css',
|
||||
}
|
||||
]
|
||||
})
|
||||
|
||||
const downloadWordDoc = () => {
|
||||
// 创建Word文档内容
|
||||
const content = `
|
||||
信阳市传染病医院血液透析中心宣传稿
|
||||
|
||||
关于我们的透析中心
|
||||
|
||||
信阳市传染病医院血液透析中心是豫南地区首家专门为患有艾滋病、病毒性肝炎、梅毒、结核病等传染病的肾衰竭患者提供安全、专业透析治疗的医疗设施。我们理解传染病患者在接受常规透析治疗时面临的特殊困难，因此建立了这个独立、安全、专业的透析中心。
|
||||
|
||||
我们的使命是为传染病透析患者提供与普通患者同等质量的透析治疗，同时确保所有患者和医护人员的安全，消除交叉感染风险。
|
||||
|
||||
中心配备了国际先进的血液透析设备和水处理系统，采用严格的感染控制标准和操作流程，由经验丰富的传染病专科医生和透析护士团队提供专业医疗服务。
|
||||
|
||||
我们的特色服务
|
||||
|
||||
1. 严格感染控制
|
||||
独立分区、专用设备、严格消毒流程，确保零交叉感染
|
||||
|
||||
2. 专业医疗团队
|
||||
传染病专家与透析专科医生协作，提供个性化治疗方案
|
||||
|
||||
3. 先进设备
|
||||
国际先进透析设备，确保治疗效果和患者安全
|
||||
|
||||
4. 心理支持
|
||||
专业心理医生提供心理疏导，帮助患者积极面对疾病
|
||||
|
||||
为什么选择我们的透析中心？
|
||||
|
||||
对于患有传染病的肾衰竭患者，常规透析中心往往无法接收，或给患者带来巨大的心理压力。我们的中心解决了这一难题：
|
||||
|
||||
1. 安全专业的治疗环境
|
||||
中心完全按照传染病防控最高标准建设，设有独立通道、负压病房、专用设备，医疗废物严格分类处理，确保治疗过程安全可控。
|
||||
|
||||
2. 尊重与隐私保护
|
||||
我们尊重每一位患者的隐私权，实行严格的信息保密制度，让患者能够安心接受治疗，无需担心歧视或隐私泄露。
|
||||
|
||||
3. 综合医疗服务
|
||||
除了常规透析治疗，我们还提供传染病专科诊疗、药物管理、营养指导等一站式服务，全面管理患者的健康状况。
|
||||
|
||||
4. 医保报销支持
|
||||
中心已纳入医保定点单位，符合条件的透析治疗费用可按政策报销，减轻患者经济负担。
|
||||
|
||||
接收患者类型
|
||||
|
||||
本中心专门为以下传染病患者提供血液透析服务：
|
||||
• 艾滋病病毒(HIV)感染者
|
||||
• 乙型/丙型病毒性肝炎患者
|
||||
• 梅毒感染者
|
||||
• 活动性结核病患者
|
||||
• 其他需要隔离透析的传染病患者
|
||||
|
||||
注意：患者需提供有效的传染病诊断证明，并经中心医生评估后确定接收。
|
||||
|
||||
联系我们
|
||||
|
||||
地址：信阳市南京大道京港澳高速立交桥东500米（信阳市传染病医院院内，内科楼3层）
|
||||
|
||||
咨询电话：孙医生 18058633387
|
||||
工作日：8:00-17:00
|
||||
24小时急诊咨询：同上电话
|
||||
|
||||
服务时间：
|
||||
周一至周六：7:00-22:00 (分批次透析)
|
||||
周日：急诊透析服务
|
||||
|
||||
预约方式：
|
||||
1. 电话预约：联系孙医生安排
|
||||
2. 门诊医生转诊
|
||||
3. 合作医院转介
|
||||
|
||||
信阳市传染病医院血液透析中心 © 2023 版权所有
|
||||
专业医疗，安全透析，尊重隐私，用心关怀每一位患者
|
||||
|
||||
本宣传稿仅供参考，具体服务内容以中心实际提供为准
|
||||
`;
|
||||
|
||||
// 创建Blob对象
|
||||
const blob = new Blob([content], { type: 'application/msword' });
|
||||
|
||||
// 创建下载链接
|
||||
const url = URL.createObjectURL(blob);
|
||||
const a = document.createElement('a');
|
||||
a.href = url;
|
||||
a.download = '信阳市传染病医院血液透析中心宣传稿.doc';
|
||||
|
||||
// 触发下载
|
||||
document.body.appendChild(a);
|
||||
a.click();
|
||||
|
||||
// 清理
|
||||
setTimeout(() => {
|
||||
document.body.removeChild(a);
|
||||
URL.revokeObjectURL(url);
|
||||
}, 100);
|
||||
|
||||
// 显示下载成功提示
|
||||
const button = document.getElementById('downloadBtn');
|
||||
if (button) {
|
||||
const originalText = button.innerHTML;
|
||||
button.innerHTML = '<i class="fas fa-check"></i> 下载完成！';
|
||||
button.style.backgroundColor = '#4CAF50';
|
||||
|
||||
setTimeout(() => {
|
||||
button.innerHTML = originalText;
|
||||
button.style.backgroundColor = '';
|
||||
}, 2000);
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
* {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
box-sizing: border-box;
|
||||
font-family: 'Segoe UI', 'Microsoft YaHei', sans-serif;
|
||||
}
|
||||
|
||||
.container-wrapper {
|
||||
background-color: #f5f9fc;
|
||||
color: #333;
|
||||
line-height: 1.6;
|
||||
min-height: 100vh;
|
||||
}
|
||||
|
||||
.container {
|
||||
max-width: 1200px;
|
||||
margin: 0 auto;
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
header {
|
||||
background: linear-gradient(135deg, #1AACA2 0%, #2ECCAA 100%);
|
||||
color: white;
|
||||
padding: 40px 20px;
|
||||
text-align: center;
|
||||
border-radius: 0 0 20px 20px;
|
||||
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
|
||||
margin-bottom: 30px;
|
||||
}
|
||||
|
||||
h1 {
|
||||
font-size: 2.5rem;
|
||||
margin-bottom: 15px;
|
||||
text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.2);
|
||||
}
|
||||
|
||||
.hospital-name {
|
||||
font-size: 1.8rem;
|
||||
margin-bottom: 10px;
|
||||
color: #e8f2f8;
|
||||
}
|
||||
|
||||
.subtitle {
|
||||
font-size: 1.4rem;
|
||||
font-weight: 300;
|
||||
max-width: 800px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.download-section {
|
||||
background-color: white;
|
||||
border-radius: 15px;
|
||||
padding: 25px;
|
||||
margin: 30px 0;
|
||||
text-align: center;
|
||||
box-shadow: 0 5px 15px rgba(0, 0, 0, 0.05);
|
||||
border-left: 6px solid #1AACA2;
|
||||
}
|
||||
|
||||
.download-btn {
|
||||
display: inline-block;
|
||||
background-color: #1AACA2;
|
||||
color: white;
|
||||
padding: 15px 35px;
|
||||
font-size: 1.2rem;
|
||||
border-radius: 50px;
|
||||
text-decoration: none;
|
||||
margin: 20px 0;
|
||||
transition: all 0.3s ease;
|
||||
border: none;
|
||||
cursor: pointer;
|
||||
box-shadow: 0 4px 8px rgba(26, 172, 162, 0.3);
|
||||
}
|
||||
|
||||
.download-btn:hover {
|
||||
background-color: #179B8E;
|
||||
transform: translateY(-3px);
|
||||
box-shadow: 0 6px 12px rgba(26, 172, 162, 0.4);
|
||||
}
|
||||
|
||||
.content {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 30px;
|
||||
margin-top: 30px;
|
||||
}
|
||||
|
||||
.main-content {
|
||||
flex: 2;
|
||||
min-width: 300px;
|
||||
}
|
||||
|
||||
.sidebar {
|
||||
flex: 1;
|
||||
min-width: 280px;
|
||||
}
|
||||
|
||||
.card {
|
||||
background-color: white;
|
||||
border-radius: 15px;
|
||||
padding: 30px;
|
||||
margin-bottom: 30px;
|
||||
box-shadow: 0 5px 15px rgba(0, 0, 0, 0.05);
|
||||
}
|
||||
|
||||
h2 {
|
||||
color: #1AACA2;
|
||||
margin-bottom: 20px;
|
||||
padding-bottom: 10px;
|
||||
border-bottom: 2px solid #E9F7F6;
|
||||
}
|
||||
|
||||
h3 {
|
||||
color: #1AACA2;
|
||||
margin: 25px 0 15px;
|
||||
}
|
||||
|
||||
p {
|
||||
margin-bottom: 15px;
|
||||
font-size: 1.05rem;
|
||||
}
|
||||
|
||||
ul, ol {
|
||||
padding-left: 25px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
li {
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.highlight {
|
||||
background-color: #E9F7F6;
|
||||
border-left: 4px solid #1AACA2;
|
||||
padding: 20px;
|
||||
margin: 25px 0;
|
||||
border-radius: 0 10px 10px 0;
|
||||
}
|
||||
|
||||
.services-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
|
||||
gap: 20px;
|
||||
margin-top: 20px;
|
||||
}
|
||||
|
||||
.service-item {
|
||||
background-color: #F0F9F7;
|
||||
padding: 20px;
|
||||
border-radius: 10px;
|
||||
text-align: center;
|
||||
transition: transform 0.3s ease;
|
||||
}
|
||||
|
||||
.service-item:hover {
|
||||
transform: translateY(-5px);
|
||||
background-color: #E1F4F2;
|
||||
}
|
||||
|
||||
.icon {
|
||||
font-size: 2.5rem;
|
||||
margin-bottom: 15px;
|
||||
color: #1AACA2;
|
||||
}
|
||||
|
||||
.contact-info {
|
||||
background: linear-gradient(135deg, #F0F9F7 0%, #E1F4F2 100%);
|
||||
padding: 25px;
|
||||
border-radius: 15px;
|
||||
}
|
||||
|
||||
.contact-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.contact-icon {
|
||||
font-size: 1.5rem;
|
||||
color: #1AACA2;
|
||||
margin-right: 15px;
|
||||
width: 30px;
|
||||
}
|
||||
|
||||
.phone-number {
|
||||
font-size: 1.3rem;
|
||||
font-weight: bold;
|
||||
color: #1AACA2;
|
||||
}
|
||||
|
||||
.doctor-name {
|
||||
color: #1AACA2;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
footer {
|
||||
text-align: center;
|
||||
padding: 30px;
|
||||
margin-top: 40px;
|
||||
background-color: #1AACA2;
|
||||
color: white;
|
||||
border-radius: 20px 20px 0 0;
|
||||
}
|
||||
|
||||
.address-map {
|
||||
margin-top: 15px;
|
||||
padding: 15px;
|
||||
background-color: #f8f8f8;
|
||||
border-radius: 8px;
|
||||
border-left: 4px solid #1AACA2;
|
||||
}
|
||||
|
||||
.note {
|
||||
margin-top: 10px;
|
||||
font-size: 0.9rem;
|
||||
color: #666;
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
h1 {
|
||||
font-size: 2rem;
|
||||
}
|
||||
|
||||
.hospital-name {
|
||||
font-size: 1.5rem;
|
||||
}
|
||||
|
||||
.subtitle {
|
||||
font-size: 1.2rem;
|
||||
}
|
||||
|
||||
.content {
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.services-grid {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
9
public/css/all.min.css
vendored
Normal file
9
public/css/all.min.css
vendored
Normal file
File diff suppressed because one or more lines are too long
Binary file not shown.
|
Before Width: | Height: | Size: 1.5 KiB After Width: | Height: | Size: 1.5 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 210 KiB After Width: | Height: | Size: 396 KiB |
@ -3,8 +3,8 @@ import { handleError } from './handleError'
|
||||
|
||||
function createRequestInstance(getServerUrl: () => string): AxiosInstance {
|
||||
//获取域名
|
||||
const serverUrl = 'https://xysdwrmyy.cn';
|
||||
//const serverUrl = '/api/';
|
||||
//const serverUrl = 'https://xysdwrmyy.cn';
|
||||
const serverUrl = '/api/';
|
||||
//console.log(serverUrl);
|
||||
const instance = axios.create({
|
||||
timeout: 1000 * 60 * 5, // 超时时间
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user