You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
491 lines
20 KiB
491 lines
20 KiB
<!DOCTYPE html>
|
|
<html>
|
|
<!-- 巍山 -->
|
|
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1,user-scalable=no">
|
|
<script type="text/javascript" src="lib\vue\vue.min.js"></script>
|
|
<title>院外专家介绍</title>
|
|
<style>
|
|
[v-cloak] {
|
|
display: none !important;
|
|
}
|
|
|
|
body {
|
|
max-width: 600px;
|
|
margin: 0 auto;
|
|
padding: 0;
|
|
font-family: 'Microsoft YaHei', '微软雅黑', Arial, sans-serif;
|
|
color: #303133;
|
|
overflow-x: hidden;
|
|
}
|
|
|
|
.doctor_border {
|
|
border: 8px double rgba(153, 51, 51, 0.8);
|
|
margin: 8px 10px 8px 8px;
|
|
margin-bottom: 30px;
|
|
position: relative;
|
|
}
|
|
|
|
.photo {
|
|
width: 120px;
|
|
height: 184px;
|
|
float: left;
|
|
}
|
|
|
|
.other {
|
|
margin-top: 8px;
|
|
width: calc(100% - 120px);
|
|
float: right;
|
|
}
|
|
|
|
.xunzhang {
|
|
width: 30px;
|
|
height: 30px;
|
|
position: absolute;
|
|
right: 4px;
|
|
top: 5px;
|
|
}
|
|
|
|
.content {
|
|
font-size: 14px;
|
|
width: calc(100%-20px);
|
|
padding: 6px;
|
|
}
|
|
|
|
.title {
|
|
border: 2px solid firebrick;
|
|
padding: 0 6px;
|
|
border-radius: 20px;
|
|
text-align: center;
|
|
color: firebrick;
|
|
margin: 4px;
|
|
font-size: 14px;
|
|
font-weight: bold;
|
|
}
|
|
|
|
.label {
|
|
padding: 6px;
|
|
background: linear-gradient(-135deg, transparent 10px, rgba(153, 51, 51, 0.9) 0);
|
|
margin-bottom: 5px;
|
|
font-size: 12px;
|
|
}
|
|
|
|
.label_title {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
font-size: 14px;
|
|
color: #FFFFFF;
|
|
height: 22px;
|
|
line-height: 22px;
|
|
}
|
|
|
|
.label_name {
|
|
color: white;
|
|
font-weight: bold;
|
|
font-size: 20px;
|
|
}
|
|
|
|
.label_education {
|
|
margin-right: 10px;
|
|
}
|
|
|
|
.label_content {
|
|
margin-top: 4px;
|
|
color: white;
|
|
}
|
|
|
|
.tabs {
|
|
display: flex;
|
|
text-align: center;
|
|
color: #080808;
|
|
font-size: 15px;
|
|
flex-direction: column;
|
|
position: fixed;
|
|
z-index: 100;
|
|
top: 36%;
|
|
right: 0;
|
|
cursor: pointer;
|
|
opacity: 0.96;
|
|
}
|
|
|
|
.tabs div {
|
|
padding: 2px 4px;
|
|
width: 16px;
|
|
border: 1px solid #DCDFE6;
|
|
background-color: #41B883;
|
|
color: #FFFFFF;
|
|
}
|
|
|
|
.tabs div:hover {
|
|
color: black;
|
|
}
|
|
|
|
.head_title {
|
|
margin: 30px 10px 10px 10px;
|
|
border-bottom: 3px double gainsboro;
|
|
color: #45b481;
|
|
font-weight: bold;
|
|
font-size: 16px;
|
|
}
|
|
|
|
#up {
|
|
position: fixed;
|
|
background-color: #fff;
|
|
bottom: 30px;
|
|
right: 12px;
|
|
width: 40px;
|
|
height: 40px;
|
|
border-radius: 50%;
|
|
color: #409eff;
|
|
font-size: 20px;
|
|
box-shadow: 0 0 6px rgba(0, 0, 0, .12);
|
|
cursor: pointer;
|
|
z-index: 1000;
|
|
opacity: 0.9;
|
|
}
|
|
|
|
#up:hover {
|
|
opacity: 1;
|
|
}
|
|
|
|
#san {
|
|
width: 0;
|
|
height: 0;
|
|
border: 10px solid;
|
|
border-color: transparent transparent #73D8FF;
|
|
margin-left: 10px;
|
|
margin-top: 4px;
|
|
}
|
|
|
|
#dropdown {
|
|
cursor: pointer;
|
|
background-color: #FFFFFF;
|
|
width: 120px;
|
|
position: relative;
|
|
border-radius: 4px;
|
|
box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
|
|
border: 1px solid rgba(0, 0, 0, 0.1);
|
|
margin-left: 8px;
|
|
position: absolute;
|
|
z-index: 100;
|
|
font-size: 15px;
|
|
color: #606266;
|
|
top: 40px;
|
|
}
|
|
|
|
#dropdown:before {
|
|
content: '';
|
|
position: absolute;
|
|
top: -16px;
|
|
border: 1px solid #F2F6FC;
|
|
width: 0;
|
|
height: 0;
|
|
border: 8px solid;
|
|
border-color: transparent transparent rgba(0, 0, 0, 0.08);
|
|
left: 6px;
|
|
}
|
|
|
|
#dropdown div {
|
|
line-height: 40px;
|
|
padding: 0 20px;
|
|
border-bottom: 1px solid #F2F6FC;
|
|
}
|
|
|
|
#dropdown div:hover {
|
|
background-color: #F2F6FC;
|
|
color: #409EFF;
|
|
}
|
|
|
|
header {
|
|
position: relative;
|
|
}
|
|
|
|
#head_icon {
|
|
width: 30px;
|
|
height: 30px;
|
|
position: absolute;
|
|
top: 10px;
|
|
left: 8px;
|
|
}
|
|
|
|
#head_title {
|
|
font-size: 16px;
|
|
text-align: center;
|
|
line-height: 44px;
|
|
width: 100%;
|
|
}
|
|
|
|
/*切换动画*/
|
|
.v-enter-from,
|
|
.v-leave-to {
|
|
opacity: 0;
|
|
transform: translateX(20px);
|
|
}
|
|
|
|
.v-enter-active,
|
|
.v-leave-active {
|
|
transition: all 0.22s ease-out;
|
|
}
|
|
</style>
|
|
</head>
|
|
|
|
<body>
|
|
<div id="app" v-cloak>
|
|
<div @click="click_app">
|
|
|
|
|
|
<header>
|
|
<div id="head_icon" :style="{'display': display.icon_show}" @click.stop="btn_icon">
|
|
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" t="1568259326748"
|
|
class="icon" viewBox="0 0 1261 1024" version="1.1" p-id="1986" width="29.5546875" height="24">
|
|
<defs>
|
|
<style type="text/css" />
|
|
</defs>
|
|
<path
|
|
d="M99.586991 99.586991m-99.586991 0a99.586991 99.586991 0 1 0 199.173982 0 99.586991 99.586991 0 1 0-199.173982 0Z"
|
|
p-id="1987" fill="#515151" />
|
|
<path d="M307.814335 33.950111h953.836439v131.27376H307.814335z" p-id="1988" fill="#515151" />
|
|
<path
|
|
d="M99.586991 511.838333m-99.586991 0a99.586991 99.586991 0 1 0 199.173982 0 99.586991 99.586991 0 1 0-199.173982 0Z"
|
|
p-id="1989" fill="#515151" />
|
|
<path d="M307.814335 446.201452h953.836439v131.273761H307.814335z" p-id="1990" fill="#515151" />
|
|
<path
|
|
d="M99.586991 924.089675m-99.586991 0a99.586991 99.586991 0 1 0 199.173982 0 99.586991 99.586991 0 1 0-199.173982 0Z"
|
|
p-id="1991" fill="#515151" />
|
|
<path d="M307.814335 858.452794h953.836439v131.273761H307.814335z" p-id="1992" fill="#515151" />
|
|
</svg>
|
|
</div>
|
|
<!-- 下拉菜单 -->
|
|
<div id="dropdown" :style="{'display': display.dropdown_show }">
|
|
<div v-for="(item, index) in dropdown" :key="index" @click.stop="click_dropdown(item)">{{ item }}</div>
|
|
</div>
|
|
<!-- 标题 -->
|
|
<div id="head_title">专家介绍</div>
|
|
<div v-if="w_head_title === '大附院专家'" class="head_title">{{ w_head_title }}</div>
|
|
<div v-else class="head_title">{{ head_title }}</div>
|
|
</header>
|
|
|
|
<!-- 返回顶部 -->
|
|
<div id="up" @click="btn_up" :style="{'display': display.up_show}">
|
|
<div id="san"></div>
|
|
</div>
|
|
<!-- 右侧切换tabs -->
|
|
<!-- <div class="tabs">
|
|
<div @click="btn_click(true)" :style="by_style">本院专家</div>
|
|
<div @click="btn_click(false)" :style="wy_style">大附院专家</div>
|
|
</div> -->
|
|
|
|
<!-- 显示内容的模板 -->
|
|
<transition>
|
|
<div v-if="flag">
|
|
<template v-for="(item, index) in doctors">
|
|
<!-- 标题分类 -->
|
|
<div class="doctor_border" :key="index">
|
|
<img :src="item.photo" class="photo" />
|
|
<svg class="xunzhang" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"
|
|
t="1568259473074" class="icon" viewBox="0 0 1024 1024" version="1.1" p-id="2921" width="30" height="30">
|
|
<defs>
|
|
<style type="text/css" />
|
|
</defs>
|
|
<path
|
|
d="M747.813347 654.261442c26.780129-3.762565 59.050574-9.07683 77.599324-35.539659 18.610163-26.559043 12.908997-59.210247 7.871089-88.025191-2.487223-14.339918-5.604953-32.180372-3.087023-40.241843 2.206771-7.062486 14.264175-18.966358 23.963323-28.559056 19.930541-19.652136 44.741362-44.116998 44.741363-77.955519 0-33.869228-24.810821-58.303383-44.741363-77.953472-9.699148-9.564039-21.756552-21.465864-23.963323-28.495597-2.51793-8.094223 0.5998-25.967431 3.087023-40.307349 5.037907-28.806756 10.739073-61.490714-7.871089-87.98425-19.205869-27.46386-53.212252-32.213126-80.538956-36.028916-13.383923-1.842388-30.008402-4.184267-35.770982-8.530255-5.826039-4.405354-13.443289-20.966372-19.017535-33.05653-12.436117-27.021687-26.542666-57.648312-58.057732-68.301407-31.203907-10.440197-60.960516 6.188376-84.983204 19.621429-12.217078 6.810693-27.431106 15.310242-35.044262 15.310242s-22.827184-8.497502-35.044262-15.310242C452.961709 9.509668 423.084321-7.176223 392.040088 3.290586c-31.580573 10.644907-45.687121 41.275626-58.123239 68.301408-5.574246 12.090158-13.191496 28.659365-19.017535 33.05653-5.762579 4.343941-22.387058 6.687867-35.770982 8.530255-27.328751 3.813743-61.335135 8.563009-80.538956 35.994115-18.57741 26.526289-12.87829 59.177494-7.871089 87.953543 2.485176 14.374718 5.602906 32.243832 3.084976 40.32782-2.204724 7.062486-14.264175 18.964311-23.961276 28.528351C149.909399 325.642932 125.098577 350.077087 125.098577 383.946315c0 33.838521 24.810821 58.30543 44.741363 77.955519 9.699148 9.592699 21.756552 21.494523 23.961275 28.526303 2.51793 8.122883-0.5998 25.963337-3.084975 40.307349-5.0072 28.776049-10.708367 61.3945 7.871089 87.92079s50.909267 31.854884 77.705773 35.619496L160.644378 888.144376a31.705446 31.705446 0 0 0 3.242602 33.400442 32.053452 32.053452 0 0 0 31.525301 12.153618l107.210589-19.496556 53.775204 93.4848a32.26635 32.26635 0 0 0 27.994058 16.153646h0.943712a32.34414 32.34414 0 0 0 27.959257-17.809748l127.609915-255.954738a30.522223 30.522223 0 0 0 1.985685-7.408446c1.39612 0.781991 2.847513 1.561935 4.184267 2.31322 23.991982 13.404394 53.934877 30.153746 84.919745 19.590723 31.547819-10.622389 45.621614-41.242873 58.090485-68.268654 1.005125-2.190394 2.13717-4.595734 3.252838-6.960131l83.965797 169.962315-66.657588-12.122911a31.779141 31.779141 0 0 0-33.84671 15.623447l-34.886635 60.73943-36.489513-73.767158a32.297057 32.297057 0 0 0-43.136438-14.624464 31.871261 31.871261 0 0 0-14.739101 42.804808l63.32696 127.978393a32.225408 32.225408 0 0 0 27.926504 17.903914h1.009219a32.34414 32.34414 0 0 0 28.022717-16.153646l53.681037-93.4848 107.085716 19.496556a32.053452 32.053452 0 0 0 34.76381-45.55406zM382.371647 923.763872l-35.074969-60.958469a31.779141 31.779141 0 0 0-33.816003-15.623447l-66.749707 12.122911 83.982174-169.862007c1.101338 2.343927 2.212912 4.708324 3.20166 6.859823 12.468871 27.021687 26.542666 57.646265 58.123239 68.301407a63.519388 63.519388 0 0 0 20.243747 3.275356c20.642931 0 40.096498-9.484203 57.187715-18.833296z m249.05602-254.044797c-5.101367 11.093221-14.610135 31.715681-19.709455 34.186528-5.795333-0.409419-22.798525-8.968334-33.029918-14.685877-19.740161-11.027714-42.170208-23.555951-66.688294-23.555951s-46.948134 12.528237-66.688294 23.555951c-10.235487 5.717543-27.142465 16.405439-32.460825 14.81075-5.668413-2.591625-15.177181-23.214085-20.278548-34.307306-9.791267-21.275484-19.930541-43.24084-38.602117-57.335107-19.175162-14.495497-43.983936-17.996034-65.867408-21.058491-10.83324-1.496428-33.408631-4.6551-36.55502-9.185327-3.494395-4.966258 0.693966-28.962335 2.70831-40.493635 3.873108-22.180301 8.247756-47.335035 1.132045-70.172454-6.960131-22.249902-23.803649-38.870287-40.112875-54.929767-10.235487-10.094238-25.69312-25.371726-25.69312-32.589792s15.45968-22.462801 25.69312-32.548849c16.309226-16.057433 33.162979-32.681911 40.123111-54.960473 7.115711-22.837419 2.741064-48.020813-1.132045-70.205208-2.014344-11.529253-6.202705-35.52533-2.70831-40.53253 3.146389-4.503614 25.72178-7.625438 36.555019-9.15462 21.883472-3.029704 46.692246-6.497487 65.838749-20.966373 18.700235-14.153632 28.839509-36.118988 38.630777-57.365812 5.101367-11.089127 14.577381-31.713634 19.742208-34.211093 0.157627 0 0.345959-0.032754 0.503586-0.032754 6.202705 0 22.608145 9.156667 32.493578 14.685878 19.772915 11.054326 42.170208 23.557998 66.688294 23.557997s46.91538-12.487295 66.688295-23.525244c10.294853-5.717543 28.272463-15.027743 32.493578-14.81075 5.668413 2.624379 15.148521 23.246839 20.245794 34.307306 9.791267 21.244778 19.897787 43.24084 38.630777 57.394472 19.146503 14.466838 43.955277 17.936668 65.838749 20.966373 10.83324 1.529182 33.408631 4.6551 36.587773 9.185326 3.461642 4.968306-0.72672 28.993042-2.741064 40.53253-3.871061 22.215102-8.247756 47.367788-1.132045 70.215444 6.960131 22.245808 23.803649 38.870287 40.123111 54.927719 10.235487 10.094238 25.69312 25.338973 25.69312 32.54885s-15.45968 22.495554-25.69312 32.589792c-16.309226 16.05948-33.162979 32.679864-40.123111 54.958426-7.115711 22.80876-2.739016 47.963494 1.132045 70.143795 2.014344 11.5313 6.202705 35.556036 2.70831 40.557095-3.146389 4.466767-25.691073 7.625438-36.524313 9.121866-21.903943 3.070646-46.722953 6.530241-65.869455 21.029832-18.710471 14.102455-28.849745 36.06781-38.641012 57.343295zM512 159.983616c-124.434867 0-225.692497 100.483827-225.692497 223.952463s101.25763 223.952464 225.692497 223.952464 225.692497-100.48178 225.692497-223.952464-101.25763-223.952464-225.692497-223.952463z m0 383.937225c-88.884972 0-161.208926-71.771237-161.208926-159.974526S423.115028 223.973836 512 223.973836s161.208926 71.76919 161.208926 159.972479-72.323954 159.974526-161.208926 159.974526z"
|
|
p-id="2922" fill="#A34747" />
|
|
</svg>
|
|
<!-- 右侧 -->
|
|
<section class="other">
|
|
<!-- 荣誉 -->
|
|
<div v-if="item.honor"><span class="title">荣誉</span></div>
|
|
<div class="content">
|
|
<div>
|
|
<span>{{ item.honor }}</span>
|
|
</div>
|
|
</div>
|
|
<!-- 擅长 -->
|
|
<div v-if="item.skill"><span class="title">擅长</span></div>
|
|
<div class="content">
|
|
<div>
|
|
<span>{{ item.skill }}</span>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
<div style="clear: both;"></div>
|
|
<!-- 基本信息 -->
|
|
<section class="label">
|
|
<div class="label_title">
|
|
<div class="label_name">{{ item.name }}</div>
|
|
<div class="label_work">{{ item.work }}</div>
|
|
<div>
|
|
<span class="label_education">{{ item.education }}</span>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
<!-- 个人简介 -->
|
|
<section>
|
|
<div><span class="title">个人简介</span></div>
|
|
<div class="content">
|
|
<span>{{ item.summary }}</span>
|
|
</div>
|
|
</section>
|
|
</div>
|
|
</template>
|
|
</div>
|
|
|
|
</transition-group>
|
|
</div>
|
|
</div>
|
|
</body>
|
|
|
|
<script>
|
|
Vue.createApp({
|
|
data() {
|
|
return {
|
|
flag: true, // 动画
|
|
head_title: '主任医师',
|
|
w_head_title: '', // 外院标题
|
|
display: {
|
|
up_show: 'none', // 向上回滚按钮默认隐藏
|
|
dropdown_show: 'none', // 下拉菜单默认隐藏
|
|
icon_show: 'inline', // 图标默认显示
|
|
},
|
|
dropdown: [
|
|
'院外专家',
|
|
],
|
|
by_style: { // 本院
|
|
color: '#333333',
|
|
'font-weight': 'bold'
|
|
},
|
|
wy_style: {}, // 外院
|
|
doctors: [], // 显示值
|
|
yishi_doctors: [ // 主任医师
|
|
{
|
|
name: '彭松娟',
|
|
photo: './images/doctor/彭松娟.png',
|
|
work: '',
|
|
education: '',
|
|
label_txt: '',
|
|
honor: '曾在全国正畸年会参与病例壁报展示，发表论文数篇，参与市科技局科研项目两项，参与发明实用新型专利两项。',
|
|
skill: '擅长儿童早期矫治、早期咬合诱导，成人多学科联合正畸治疗，熟练掌握开展固定直丝弓矫治、隐形矫治及各类活动矫治技术。',
|
|
summary: '口腔正畸学硕士研究生，昆明市第一人民医院甘美医院正畸科医师。'
|
|
},
|
|
{
|
|
name: '刘珊',
|
|
photo: './images/doctor/刘珊.png',
|
|
work: '',
|
|
education: '',
|
|
label_txt: '',
|
|
honor: '发表论文数篇',
|
|
skill: '擅长儿童呼吸、消化、内分泌及新生儿疾病的诊治，尤其在身材矮小疾病诊治方面有自己独到的见解',
|
|
summary: '昆明市第一人民医院甘美医院儿科医师。儿科工作近十年，有着丰富的临床经验。'
|
|
},
|
|
{
|
|
name: '梅硕',
|
|
photo: './images/doctor/梅硕.png',
|
|
work: '',
|
|
education: '',
|
|
label_txt: '',
|
|
honor: '目前任云南省乳腺癌医师学会委员，以第一作者发表国内外论文5篇，次要作者核心期刊2篇，SCI次要作者1篇，相关作者文章数篇，主持市级项目1项，参与国家级及市级项目多项，个人乳腺专科专利1项。',
|
|
skill: '擅长乳腺良恶性肿瘤的诊断及治疗，对乳腺良性肿瘤的微创手术，乳腺炎的根治性治疗及乳腺癌的全程管理均有独特的见解和丰富的临床经验',
|
|
summary: '昆明市第一人民医院乳腺甲状腺外科主治医师。2001年就读于吉林大学白求恩医学院，心胸外科硕士研究生毕业后专注于乳腺外科的疾病诊疗十余年。'
|
|
},
|
|
{
|
|
name: '倪昌国',
|
|
photo: './images/doctor/倪昌国.png',
|
|
work: '',
|
|
education: '',
|
|
label_txt: '',
|
|
honor: '发表论文数篇，副主编专业著作《现代心胸外科疾病临床诊疗思维》',
|
|
skill: '擅长单孔胸腔镜肺叶切除，肺段及联合亚段切除，经剑突下胸骨拉钩辅助单孔胸腔镜全胸腺切除，胸腹腔镜食管癌根治，Da Vinci机器人手术。',
|
|
summary: '昆明市第一人民医院甘美医院心胸外科主治医师，专注普胸外科的微创诊疗。'
|
|
},
|
|
],
|
|
// 副主任医师
|
|
fyishi_doctors: [
|
|
],
|
|
// 回聘专家=======================================
|
|
hpzj_doctors: [
|
|
|
|
]
|
|
}
|
|
},
|
|
methods: {
|
|
btn_icon() { // 点击图标
|
|
this.display.dropdown_show = this.display.dropdown_show === 'inline' ? 'none' : 'inline'
|
|
},
|
|
click_app() { // 点击其他区域隐藏下拉
|
|
this.display.dropdown_show = 'none'
|
|
},
|
|
update_doctors() {
|
|
if (this.head_title === '主任医师') {
|
|
this.doctors = this.yishi_doctors
|
|
} else if (this.head_title === '副主任医师') {
|
|
this.doctors = this.fyishi_doctors
|
|
} else if (this.head_title === '回聘专家') { // 回聘专家===========================
|
|
this.doctors = this.hpzj_doctors
|
|
} else {
|
|
console.log('click err')
|
|
}
|
|
},
|
|
click_dropdown(txt) {
|
|
this.display.dropdown_show = 'none'
|
|
if (this.head_title === txt) {
|
|
return
|
|
}
|
|
this.flag = false
|
|
this.head_title = txt
|
|
this.update_doctors() // 修改数据
|
|
setTimeout(() => {
|
|
this.flag = true
|
|
}, 300)
|
|
},
|
|
btn_click(flag) {
|
|
if (flag) {
|
|
this.by_style = {
|
|
color: '#333333',
|
|
'font-weight': 'bold'
|
|
}
|
|
if (this.display.icon_show !== 'inline') {
|
|
this.flag = false
|
|
}
|
|
this.wy_style = {}
|
|
this.display.icon_show = 'inline'
|
|
this.update_doctors() // 修改数据
|
|
this.w_head_title = ''
|
|
} else {
|
|
this.w_head_title = '大附院专家'
|
|
this.by_style = {}
|
|
this.wy_style = {
|
|
color: '#333333',
|
|
'font-weight': 'bold'
|
|
}
|
|
if (this.display.icon_show !== 'none') {
|
|
this.flag = false
|
|
}
|
|
this.display.icon_show = 'none'
|
|
this.doctors = Object.assign(this.wy_doctors, {})
|
|
}
|
|
setTimeout(() => {
|
|
this.flag = true
|
|
}, 300)
|
|
document.body.scrollTop = 0
|
|
document.documentElement.scrollTop = 0
|
|
},
|
|
btn_up() { // 向上滚动
|
|
document.body.scrollTop = 0
|
|
document.documentElement.scrollTop = 0
|
|
}
|
|
},
|
|
created() {
|
|
this.doctors = Object.assign(this.yishi_doctors, {})
|
|
},
|
|
mounted() {
|
|
window.onscroll = () => {
|
|
let scrollTop = document.documentElement.scrollTop || document.body.scrollTop
|
|
this.display.up_show = scrollTop > 440 ? 'inline' : 'none'
|
|
}
|
|
}
|
|
}).mount('#app');
|
|
</script>
|
|
|
|
</html> |