|
Server : nginx/1.20.1 System : Linux iZ2ze9ojcl78uluczwag69Z 4.18.0-240.22.1.el8_3.x86_64 #1 SMP Thu Apr 8 19:01:30 UTC 2021 x86_64 User : www ( 1000) PHP Version : 7.3.28 Disable Function : passthru,exec,system,chroot,chgrp,chown,shell_exec,popen,proc_open,pcntl_exec,ini_alter,ini_restore,dl,openlog,syslog,readlink,symlink,popepassthru,pcntl_alarm,pcntl_fork,pcntl_waitpid,pcntl_wait,pcntl_wifexited,pcntl_wifstopped,pcntl_wifsignaled,pcntl_wifcontinued,pcntl_wexitstatus,pcntl_wtermsig,pcntl_wstopsig,pcntl_signal,pcntl_signal_dispatch,pcntl_get_last_error,pcntl_strerror,pcntl_sigprocmask,pcntl_sigwaitinfo,pcntl_sigtimedwait,pcntl_exec,pcntl_getpriority,pcntl_setpriority,imap_open,apache_setenv Directory : /www/wwwroot/0531yanglao.com/templates/index/ |
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>{$data.seo_t}</title>
<meta name="Description" content="{$data.seo_d}" />
<meta name="Keywords" content="{$data.seo_k}" />
<base href="{:server_url()}" />
<link rel="stylesheet" href="./css/style.css" />
<link rel="stylesheet" href="./css/swiper-bundle.css" />
<!--<link rel="stylesheet" href="./css/mui.css" />-->
<!-- <link rel="stylesheet" href="./css/app.css" />-->
<script src="./js/jquery-3.6.0.js"></script>
<script src="/js/map.js"></script>
<script src="./js/clipboard.min.js"></script>
<script type="text/javascript" src="https://api.map.baidu.com/api?v=2.0&ak=kpZUubsNcXzAAnAvxmOgk0BR4Tg3vjqr">
</script>
</head>
<style>
.modal {
display: none;
position: fixed;
z-index: 9999;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, 0.7);
justify-content: center;
align-items: center;
}
.modal img {
max-width: 80%;
max-height: 80%;
}
.iw_poi_title {
color: #CC5522;
font-size: 14px;
font-weight: bold;
overflow: hidden;
padding-right: 13px;
white-space: nowrap
}
.iw_poi_content {
font: 12px arial, sans-serif;
overflow: visible;
padding-top: 4px;
white-space: -moz-pre-wrap;
word-wrap: break-word
}
.rmtj_content {
width: 100% !important;
background-color: #f5f5f5;
padding: 20px 0;
}
.jigoutuijian ul:hover p {
color: #f28731;
}
.xinjia img {
height: 19px !important;
margin: 0 !important;
}
.rmtj_content .wrap {
width: 1200px !important;
margin: 0 auto;
}
/*锚点*/
.neirong h3:before {
content: "";
background: url(../images/tuoyuan.png) no-repeat;
background-size: 15px 15px;
width: 15px;
height: 15px;
position: absolute;
left: -21px;
top: 7px;
}
.button-group button {
padding: 10px 20px;
background-color: transparent;
border: none;
}
.section {
display: flex;
align-items: flex-start;
justify-content: flex-start;
flex-direction: column;
background: #fff;
margin-bottom: 20px;
width: 100%;
padding: 10px 27px;
/*padding: 130px 0 0 0;*/
box-sizing: border-box;
}
.sections{
padding: 130px 27px 10px 27px!important;
}
.button-group li {
/* width: 100%; */
height: 100%;
line-height: 60px;
padding: 0 35px;
}
.activedetail {
background-color: #f28731;
color: #fff;
}
.fixed {
position: fixed;
top: 59px;
/*left: 0;*/
}
/*图片放大*/
@media all and (max-width: 768px) {
.yycg {
width: 100%;
flex-direction: column;
padding: 0;
}
.yycg_left {
width: 100%;
height: 100%;
}
.yycg_right {
height: 100%;
width: 100%;
}
.yanglaotitle {
font-size: 17px !important;
}
.top-div h5 {
font-size: 12px;
}
.top-div h5 p {
font-size: 12px;
}
.h52 {
width: 100%;
color: #666666;
font-size: 15px;
margin: 10px 0 10px 0;
}
.button1 h5 {
margin-right: 10px;
font-size: 14px;
}
.button1 h5 img {
margin-right: 5px;
height: 19px;
width: auto;
}
.dandudiv {
padding: 0 0 10px 0;
}
.shijan {
align-items: center;
font-size: 17px;
}
.bili {
display: none;
}
/*.bili li {*/
/* width: 100%;*/
/* display: flex;*/
/* font-weight: 500!important;*/
/* font-size: 15px;*/
/* color: #333333;*/
/* justify-content: flex-start;*/
/* align-items: center;*/
/* flex-direction: row;*/
/* border-bottom: 1px solid #e6e6e6;*/
/* padding: 7px 10px;*/
/* margin: 0;*/
/*}*/
.bili li {
width: 100%;
display: grid;
grid-template-columns: 1fr 1fr 2fr;
grid-template-rows: 1fr;
gap: 10px 10px;
font-weight: 500!important;
font-size: 15px;
color: #333333;
justify-content: flex-start;
align-items: center;
flex-direction: row;
border-bottom: 1px solid #e6e6e6;
padding: 7px 10px;
margin: 0;
}
.bili li span {
font-weight: 500!important;
font-size: 14px!important;
margin-left: 5px;
color: #333333;
}
.bili li:last-child{
display: block;
}
.wapbili li button {
width: 143px;
height: 32px;
background: #1ac1b0;
border: 0;
border-radius: 10px;
margin: 0;
font-weight: 500;
padding: 0;
line-height: 32px;
color: white;
font-size: 14px;
padding: 0 !important;
}
.wapbili li {
display: flex;
justify-content: space-between;
align-items: center;
box-sizing: border-box;
}
.wapbili p {
font-size: 15px;
padding: 10px 0 0 9px;
}
.wapbeds{
display: block;
}
.neirong {
width: 100%;
height: 100%;
}
.fansi {
width: 100%;
display: flex;
justify-content: space-between;
flex-direction: column;
}
.tab-nursing {
width: 100%;
/* position: relative; */
height: auto;
z-index: 99;
flex-wrap: wrap
}
.section {
padding: 10px;
}
.neirong2 {
width: 100%;
}
.jigoutuijian ul div {
box-sizing: border-box;
display: grid;
grid-template-columns: 2fr 2fr;
grid-template-rows: 1fr;
gap: 10px 10px;
justify-content: space-between;
align-items: center;
width: 100%;
height: auto;
}
.xinjia span:last-child {
display: block;
}
.button-group li {
width: 20%;
height: 100%;
line-height: 27px;
padding: 9px 9px;
text-align: center;
font-size: 15px;
}
.neirong h3 {
margin-bottom: 15px;
}
.yanglaoyuan_content h3 a {
font-size: 17px;
}
}
</style>
<script>
$(function() {
$('#zhao').addClass('current')
});
</script>
<body>
<!-- 头部 -->
{include file='header'}
<main class="yanglaoyuan">
<div class="f_home">
<h4>首页/找养老院/{$data.title}</h4>
</div>
<div class="f_home">
<!-- 预约参观 -->
<div class="yycg">
<div class="yycg_left">
<!--<img class="bottomImg" src="{$data.pics[0]['url'] ?? ''}" alt="" title="">-->
<!--<li>-->
<!-- {foreach name='data.pics' item='item' key='key'}-->
<!-- <img class="smallImg" src="{$item.url}" alt="{$item.url}" />-->
<!-- {/foreach}-->
<div class="swiper mySwiper2">
<div class="swiper-wrapper">
{foreach name='data.pics' item='item' key='key'}
<div class="swiper-slide">
<img class="enlarge-image" src="{$item.url}" alt="{$data.title}" title="{$data.title}" />
</div> {/foreach}
</div>
<div class="swiper-button-next"></div>
<div class="swiper-button-prev"></div>
<div class="swiper-pagination"></div>
</div>
<!--模态框-->
<div id="modal" class="modal">
<img id="modal-image" src="" />
</div>
</div>
<div class="yycg_right warpb">
<div class="dandudiv">
<div class="top-div">
<p class="yanglaotitle">{$data.title}</p>
<h5>
评价 (
<p>{$data.comprehensive_score}</p>
)
</h5>
</div>
<h5 class="h52" onclick="scrollToSection('section6')"><img src="image/weizhitubiao.svg" />地址:{$data.address}</h5>
<li class="button1">
{foreach name='data.tags_name' item='name' key='key'}
<h5 class="btn0{$key + 1}"><img src="./image/duihao0{$key + 1}.svg" alt="" />{$name}
</h5>
{/foreach}
</li>
</div>
<p class="shijan">{$data.min_price}-{$data.max_price}元/月 <span>成立时间:2011-06-03</span></p>
<ul class="bili">
<li>{$data.beds}张 <span>床位</span><button class="wapbeds">查询剩余床位数</button></li>
<li>{$data.lnstitutional_nature_name} <span>机构资质</span></li>
<li>{$data.type_name} <span>机构类型</span></li>
<li>{$data.type_name} <span>成立时间</span></li>
</ul>
<ul class=" wapbili">
<li>机构类型：养老院 </li>
<li>机构性质：民办 </li>
<li>总床位数：1000张 <button>查询剩余床位数</button> </li>
<li>成立时间：</li>
<p>收住对象：半自理 认知型障碍</p>
<!--<li>1000张 <span>床位</span></li>|-->
<!--<li>民办 <span>机构资质</span></li>|-->
<!--<li>养老院 <span>机构类型</span></li>-->
</ul>
<h4>
<p><img src="image/dianhualianxi.png" />电话:123456</p>
<!--<span>机构特色：{:implode(' ', $data.institutional_characteristics_name)}</span>-->
<span>收住对象：{:implode(' ', $data.retract_objects_name)}</span>
</h4>
<!-- <p class="p">-->
<!-- 月收费区间，费用包括床位、伙食费、价格仅供参考，具体请-->
<!-- 电话咨询。-->
<!--</p>-->
<li style="margin:29px 0 0px 0;">
<button id="btn6">预约参观</button>
<button id="huoqu">获取准确报价</button>
</li>
</div>
</div>
<!-- 机构简介 -->
<div class="yanglaoyuan_content">
<div class="tab-nursing button-group">
<li id="button1" onclick="scrollToSection('section1')" class="activedetail">机构介绍</li>
<li id="button2" onclick="scrollToSection('section2')">服务项目</li>
<li id="button3" onclick="scrollToSection('section3')">收费标准</li>
<li id="button4" onclick="scrollToSection('section4')">入住须知</li>
<li id="button5" onclick="scrollToSection('section5')">配套设施</li>
<li id="button6" onclick="scrollToSection('section6')">养老院相册</li>
<li id="button7" onclick="scrollToSection('section7')">客户点评</li>
</div>
<!--<div style="width:100;height:60px;background-color:pink"></div>-->
<!-- 区域容器 -->
<div class="fansi">
<div class="neirong">
<div id="section1" class="section" >
<h3><a href="javascript:void(0)" id="jigoujianjie">机构介绍 </a></h3>
<p>{$data.content | raw}
</p>
</div>
<div id="section2" class="section" >
<h3><a href="javascript:void(0)" id="fuwuxiangmu">服务项目</a></h3>
<p>
{$data.service_content | raw}
</p>
</div>
<div id="section3" class="section" >
<h3><a href="javascript:void(0)" id="shoufeibiaozhun">收费标准</a></h3>
<p>
</p>
</div>
<div id="section4" class="section" >
<h3><a href="javascript:void(0)" id="ruzhuxuzhi">入住须知</a></h3>
<p>
{$data.notice_content | raw}
</p>
</div>
<div id="section5" class="section" >
<h3><a href="javascript:void(0)" id="peitaosheshi">配套设施</a></h3>
<p>
</p>
</div>
</div>
<div class="neirong2">
<div class="jigoutuijian">
<h3><a href="javascript:void(0);">{:implode('', $data.location_name)}机构推荐</a></h3>
{if $relation_nursing}
{foreach name='relation_nursing' item='item' key='key'}
<ul>
<a href="{:url('/nursingHome/detail',['id'=>$item.nid])}">
<p> {$item.title}<span>({:implode('', $item.location_name)})</span></p>
<div><img src="{$item.filename}" />
<li class="xinjia">
<span><img src="./image/index01.svg" alt="" />养老院</span>
<span><img src="./image/index02.svg" alt="" />{$item.beds}张</span>
<span>￥{$item.min_price}元/月</span>
</li>
</div>
</a>
</ul>
{/foreach}
{/if}
<a href="http://yl.jnbinzang.com/zyly/{:implode('', $data.location)}"
class="center"><button type="button">查看更多</button></a>
</div>
<div class="jigoutuijian jigoutuijian2">
<h3><a href="">机构资讯<p>更多<img src="./image/gengduo.png" alt=""></p></a></h3>
<ul>
{foreach name='relation_article' item='item' key='key'}
<li><img src="{$item.filename}" />
<p><a class="zit"
href="{:url('/article/detail',['id'=>$item.article_id])}">{$item.title}</a>
</p>
</li>
{/foreach}
</ul>
</div>
<div class="jigoutuijian jigoutuijian3">
<h3><a href="">扫一扫关注养老网</a></h3>
<img src="image/juxing25.png" />
</div>
</div>
</div>
<div class="lianxiwomen section" id="section6">
<h3><a href="javascript:void(0)" id="lianxiwomen">养老院相册</a></h3>
<div class="photo">
<div class="photo-main">
<img src="image/juxing25.png" alt="" />
<p>图片名</p>
</div>
<div class="photo-main">
<img src="image/juxing25.png" alt="" />
<p>图片名</p>
</div> <div class="photo-main">
<img src="image/juxing25.png" alt="" />
<p>图片名</p>
</div> <div class="photo-main">
<img src="image/juxing25.png" alt="" />
<p>图片名</p>
</div> <div class="photo-main">
<img src="image/juxing25.png" alt="" />
<p>图片名</p>
</div> <div class="photo-main">
<img src="image/juxing25.png" alt="" />
<p>图片名</p>
</div>
</div>
<!--<ol style="width: 100%;height: 500px;;border:#ccc solid 1px;" id="allmap"></ol>-->
<!--<ol style="width: 100%;height: 500px;;border:#ccc solid 1px;" id="dituContent"></ol>-->
<p>
</p>
</div>
<div class="dianping section" id="dianping1 section7">
<h3><a href="javascript:void(0)" id="kehudianping">
全部点评</a><span>({:count($data.comments)})</span></h3>
{foreach name='data.comments' item='item' key='key'}
<div>
<li><img src="{$item.avatar}" />满意</li>
<ul>
<li>
网友 <a>{$item.name}</a><span> 服务评分</span>{$data.service_score}<span> 综合评分：{$data.comprehensive_score}</span>
<p>{:date('Y-m-d', $item.create_time)}</p>
</li>
<li>
<p>
{$item.content} </p>
</li>
</ul>
</div>
{/foreach}
</div>
</div>
</div>
</main>
<!-- 底部 -->
{include file='footer'}
<!-- 底部悬浮 -->
<!--<div class="footer_b">-->
<!-- <div class="footer_b_banxin">-->
<!-- <h4>找养老院，上养老网</h4>-->
<!-- <ul>-->
<!-- <li><img src="image/bz_b3.png" />信息全面</li>-->
<!-- <li><img src="image/bz_b3.png" />信息全面</li>-->
<!-- <li><img src="image/bz_b3.png" />信息全面</li>-->
<!-- </ul>-->
<!-- <p><img src="image/bz_b3.png" />0411-84179979</p>-->
<!-- <button type="button">咨询热线</button>-->
<!-- </div>-->
<!--</div>-->
<!-- 侧边悬浮/ -->
<div class="pc_footer_b">
<div class="btn" data-clipboard-action="copy" data-clipboard-target="#target" id="copy_btn">
<img src="image/footer_erweima.png" id="weixinerweima" /><img src="image/weixin.png" />微信
</div>
<div><img src="image/xiaochengxu.png" />小程序</div>
<div><img src="image/kefu.png" />客服</div>
<div><img src="image/fankui.png" />反馈</div>
<div class="top"><img src="image/huidingbu.png" />顶部</div>
</div>
<!-- 参观信息弹出 -->
<div class="login" style="display: none">
<div class="login_content">
<div class="zezhan"></div>
<h1>填写预约参观信息</h1>
<h5>
参观机构：{$data.title}
</h5>
<form action="" method="" id="form">
<input type="date" placeholder="选择参观时间" id="time" class="width_30" />
<input type="text" name="" placeholder="参观人数" />
<input name="Checkbox" type="checkbox" checked /><label>老人同行</label>
<input type="" name="" id="" value="" placeholder="请输入联系人" /><br>
<!-- <select>-->
<!-- <option value="">选择与老人关系</option>-->
<!--</select> -->
<input type="tel" oninput="checkmobile()" id="mobile" value="" placeholder="请输入手机号" />
<label for="" class="label"><input type="tel" onclick="checkcode()" id="code" value=""
placeholder="获取验证码" />
<!--<input type="button" id="codemsg" onclick="getcode()" value="获取验证码" /> -->
<div id="codemsg" onclick="getcode()">获取验证码</div>
</label>
<input type="button" id="sub" onclick="reF()" value="确认提交" />
<!--<div class="" id="codeTip"></div>-->
<!--<div class="" id="mobileTip"></div>-->
</form>
<img src="image/guanbi.png" id="close2" />
</div>
</div>
</body>
<script src="./js/swiper-bundle.js"></script>
<!--<script src="./js/mui.min.js"></script>-->
<!--<script src="./js/scroll.js"></script>-->
<script src="./js/style.js"></script>
<script src="./js/page.js"></script>
<script type="text/javascript">
// 轮播
var swiper2 = new Swiper(".mySwiper2", {
loop: true,
slidesPerView: 1,
autoplay: {
delay: 1000000,
disableOnInteraction: false,
},
pagination: {
el: ".swiper-pagination",
clickable: true,
},
navigation: {
nextEl: ".swiper-button-next",
prevEl: ".swiper-button-prev",
},
});
var list = document.getElementsByClassName("smallImg")
for (var i = 0; i < list.length; i++) {
list[i].onclick = function() {
document.getElementsByClassName("bottomImg")[0].src = this.src
document.querySelector("h3").innerHTML = this.title
}
}
// 锚点
$(function() {
var nav = $(".button-group"); //得到导航对象
const fansi = $('.fansi')
var win = $(window); //得到窗口对象
var sc = $(document); //得到document文档对象。
win.scroll(function() {
$(".button-group li").on("click", function() {
nav.addClass("fixed")
$(".button-group").fadeIn();
});
if (sc.scrollTop() >= 600) {
// nav.removeClass('fi');
nav.addClass("fixed");
// fansi.style('padding','150px 0 0 0')
$(".button-group").fadeIn();
} else {
nav.removeClass('fixed');
// nav.addClass('fixednava');
$(".button-group").fadeIn();
}
})
})
function scrollToSection(sectionId) {
const section = document.getElementById(sectionId);
window.scrollTo({
top: section.offsetTop,
behavior: 'smooth' // 平滑滚动
});
}
document.addEventListener('scroll', function() {
const sections = document.getElementsByClassName('section');
let minDistance = Infinity;
let closestSectionId = '';
// 遍历所有区域
for (let i = 0; i < sections.length; i++) {
const distance = Math.abs(sections[i].offsetTop - window.scrollY);
// 找到离窗口顶部最近的区域
if (distance < minDistance) {
minDistance = distance;
closestSectionId = sections[i].id;
}
}
const buttons = document.querySelectorAll('.button-group li');
buttons.forEach((li) => {
li.classList.remove('activedetail'); // 移除所有按钮的高亮样式
});
const currentButton = document.getElementById(`button${closestSectionId.slice(-1)}`);
currentButton.classList.add('activedetail'); // 添加当前区域对应按钮的高亮样式
});
// 获取所有要放大查看的图片元素
var images = document.querySelectorAll('.enlarge-image');
// 给每张图片添加点击事件处理程序
images.forEach(function(image) {
image.addEventListener('click', function() {
// 获取被点击图片的src属性
var src = this.getAttribute('src');
// 显示模态框
document.getElementById('modal').style.display = 'flex';
// 设置模态框内图片的src属性
document.getElementById('modal-image').setAttribute('src', src);
});
});
// 给模态框添加点击事件处理程序，点击模态框任意位置即可关闭模态框
document.getElementById('modal').addEventListener('click', function() {
this.style.display = 'none';
});
</script>
</html>