Skip to content

T
tl_estate
Commit 42402898 authored by agping's avatar agping
Browse files
Options

分享楼盘详情

parent ab0867e3
Expand all Hide whitespace changes
Inline Side-by-side
Showing with 851 additions and 0 deletions
application/app/view/index/building_detail.html 0 → 100644
View file @ 42402898
<!doctype html>
<html>
<head>
<meta charset="utf-8" />
<title>同联商业</title>
<meta http-equiv="X-UA-Compatible" content="IE=10" />
<meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=0" />
<meta name="Keywords" content="" />
<meta name="Description" content="" />
<link rel="stylesheet" href="/app/css/common.css">
<link rel="stylesheet" href="/app/css/details.css">
<link rel="stylesheet" href="/app/css/b_lunbo.css">
<link rel="stylesheet" href="/app/css/details_office_tl.css">
<link>
</head>
<style type="text/css">
.shop-img-list{
margin-top: .8rem;
width: 7.5rem;
overflow-x: scroll;
white-space: nowrap;
box-sizing: border-box;
padding-left: .36rem;
}
.shop-img-list>div{
display: inline-block;
position: relative;
}
.img_video_bofang{
position: absolute;
width: 3.2rem;
height: 2.38rem;
background: url(/app/images/bofang@2x.png) no-repeat center center/.6rem .6rem;
}
.shop-img-list img{
width: 3.2rem;
height: 2.38rem;
border-radius:.1rem;
margin-right: .18rem;
}
.m_part1_w{
height: 4.2rem!important;
border: 0!important;
}
#img_item_ul video{
width: 7.5rem;
max-height:calc(100vh - 1.96rem);
object-fit:fill;
/*position: absolute;
bottom: 1.06rem;*/
}
#img_item_ul img{
width: 7.5rem;
}
#img_item_ul li{
display: flex;
align-items: center;
background: #F8F9FB;
}
.shop-detail-tel{
position: absolute;
bottom: 0;
width:7.50rem;
height:1.06rem;
background:rgba(255,255,255,1);
box-sizing: border-box;
padding: .3rem;
}
.shop-detail-tel span:nth-of-type(1){
font-size:.28rem;
font-weight:500;
color:rgba(51,51,51,1);
}
.shop-detail-tel span:nth-of-type(2){
font-size:.24rem;
font-weight:400;
color:rgba(102,102,102,1);
margin-right: 1rem;
}
.shop-detail-tel span:nth-of-type(3){
font-size:.28rem;
font-weight:400;
color:rgba(255,128,24,1);
}
.tel-agent-video{
position: absolute;
right: .2rem;
top: .18rem;
width: .6rem;
height: .6rem;
background: url(/app/images/agent-tel-pc.png) no-repeat center center/.4rem .4rem;
}
.b1_span_{
font-size: 0.34rem;
color: #FF8018;
}
.b1_span_totl {
color: #999999;
font-size: 0.24rem;
}
.total-office{
text-align: center;
width: 100%;
height: .76rem;
line-height: .76rem;
font-size: .3rem;
color: #333333;
background-color: rgba(255,128,24,.12);
border-radius: .05rem;
margin: .2rem 0;
}
/*pc 官网css*/
.head-img-agent-pc {
height: .64rem;
width: .64rem;
border-radius: .32rem;
vertical-align: middle;
float: left;
}
.tel-img-agent-pc{
height: .5rem;
width: .5rem;
vertical-align: middle;
}
.agent-content-pc{
float: left;
margin-left: .16rem;
}
.agent-name-pc{
color: #333;
font-size: .28rem;
}
.agent-grade-pc{
color: #999;
font-size: .24rem;
}
#fix_tel_pc{
float: right;
margin-right: .3rem;
}
#fix_tel{
display: inline-block;
}
.ul-agent-content-pc li{
overflow: hidden;
margin-bottom: .3rem;
}
</style>
<body style="background: #FFFFFF">
<input type="hidden" id="open_id" value='{$data}' />
<header class="m_part1_w">
<div class="u_btn1b" onclick="window.history.go(-1)" style="margin-top:0.1rem"><span style=""><i class="icon-angle-left" style="font-size:0.65rem"></i></span></div>
<div class="line_a" style="margin-top: 1rem;">
<p class="a_fonta office-title"></p>
</div>
<p class="b3_spanhao_font" id="font_24" style="margin-bottom: .1rem;">
<span class="b3_spanhao_left">
编号：
<span class="b3_spanhao office-id"></span>
</span>
</p>
<div class="shop-img-list">
</div>
</header>
<!--line 1-->
<p class="line_hr"></p>
<!--line 2-->
<div class="line_b">
<ul>
<li class="ul_b1">
<span class="b1_span_ office_price_total">总价</span>
<span class="b1_span_totl office_price">单价</span>
</li>
<li class="ul_b2">
<span class="b1_span_ office_mianji">面积</span>
<span class="b1_span_totl office_gongwei">工位</span>
</li>
<li class="ul_b3">
<span class="b1_span_ office_zhuangxiu">精装修</span>
<span class="b1_span_totl office_ceng">中区(共28层)</span>
</li>
</ul>
</div>
<p class="line_hr"></p>
<div class="line_a_ul">
<ul class="line_a_ulul">
</ul>
</div>
<!--line 3-->
<!--办公楼详情h5-->
<p class="b3_font1">
类型：
<span class="gw office_type"></span>
</p>
<p class="b3_font1">
可注册公司：
<span class="gw office_zhuce"></span>
</p>
<p class="b3_font1">
签约年限：
<span class="gw office_qianyue"></span>
</p>
<p class="b3_font1">
免租时间：
<span class="gw office_mianzhu"></span>
</p>
<p class="b3_font1">
付款方式：
<span class="gw office_fukuan">付三押二</span>
</p>
<p class="b3_font1">
物业管理费：
<span class="gw office_wuye">3-5年</span>
</p>
<p class="b3_font1">
转让费：
<span class="gw office_zhuanrang"></span>
</p>
<p class="b3_font1">
入驻时间：
<span class="gw office_ruzhu"></span>
</p>
<p class="b3_font1">
车位情况：
<span class="gw office_chewei"></span>
</p>
<!--<p class="line_hr"></p>-->
<!--<div class="b4_font" style="overflow: hidden;">
<p class="total-office">查看绿地汇中心</p>
</div>-->
<div class="b4_font" style="overflow: hidden;">
<p class="b4_font_p">
位置信息
</p>
<p class="b4_font2">
地址：<span class="b4_span1 gw office_dizhi"></span>
</p>
<p class="b4_font2">
交通：<span class="b4_span1 gw office_jiaotong"></span>
</p>
<p class="b4_font2" style="height: .2rem;">
</p>
</div>
<div class="pc-contact-agent b4_font">
<p class="b4_font_p">
咨询经纪人
</p>
<ul class="b4_font2 ul-agent-content-pc" style="margin-bottom: 3.6rem;">
</ul>
</div>
<!--下载app部分-->
<div class="public fix_area_top" style=" z-index: 9999999;top: 0;display: none;">
<img src="/app/images/pbl_cha.png" class="pbl_cha" />
<img src="/app/images/img_logo@2x.png" class="pbl_logo" />
<p>
<span style="font-size: 0.24rem;margin-top: 0.33rem;">海量真实旺铺，就在同联商业 </span>
</p>
<a id="jump_link" href="javascript:;">
<span class="pbl_xz">立即打开</span>
</a>
</div>
<!--底部联系人浮窗部分-->
<div class="fix_area_bottom_new">
<div>
<div>
<p>
<img src="" onerror="javascript:this.src='/app/images/ic_default_headpic.png'" class="head-img-agent"/>
<span class="head-agent">&nbsp;经纪人：<span id="fix_name"></span></span>
</p>
</div>
<div>
<p>
<a id="fix_tel" href="javascript:;">
<img src="/app/images/share_call_tel.gif" class="tel-agent"/>
</a>
</p>
</div>
</div>
<a href="javascript:;" id="fix_area_bottom_btn"><img src="/app/images/xq_cha@2x.png" /></a>
</div>
<div class="shop-list">
<img src="/app/images/clik_shop_icon2.png" />
</div>
<!--点击任意视频 全屏显示（轮播）-->
<div class="lp-bunner" style="display: none;">
<ul class="swiper-wrapper" id="img_item_ul">
</ul>
<span class="lp-bunner-page">
<span class="back-to-shop-detail"></span>
<span class="lp-index"> 1 </span> / <span class="lp-sum"> 50 </span>
</span>
</div>
<script src="/app/js/jquery-1122-min.js" charset="UTF-8"></script>
<script src="/app/js/swiper.js"></script>
<script src="/app/js/common.js" charset="utf-8"></script>
<script src="/app/js/app_office_jump.js"></script>
<script src="/app/js/detaila_office_tl.js?new1"></script>
<script src="/app/js/jquery.cookie.js"></script>
<script src="/app/js/Tab_min.js" charset="utf-8"></script>
</body>
</html>
\ No newline at end of file
public/app/css/details_building_tl.css 0 → 100644
View file @ 42402898
.line_a{
width: 92%;
height: auto;
overflow: hidden;
margin: 0 auto;
}
.a_fonta{
font-size: 0.38rem;
color: #333333;
float: left;
font-weight: 900;
margin-top:0.4rem;
width: 100%;
}
.a_fontb{
font-size: 0.4rem;
color: #111;
float: left;
font-weight: 900;
margin-top:0.3rem;
width: 100%;
}
#font_24{
font-size: .24rem;
color: #4D4D4D;
}
.a_fontc{
background-image: url("../images/tonglian/di_wuye@2x.png");
background-size: 100% 0.6rem;
color: #ff9419;
font-size: 0.28rem;
text-indent: 0.26rem;
font-weight: 400;
float: left;
padding-right: 0.26rem;
line-height: 0.6rem;
margin-top: 0.3rem;
}
.a_fontd{
background-image: url("../images/tonglian/di_jinchang@2x.png");
background-size: 100% 0.6rem;
color: #ff9419;
font-size: 0.28rem;
text-indent: 0.26rem;
font-weight: 400;
float: left;
padding-right: 0.26rem;
line-height: 0.6rem;
margin-left: 0.3rem;
margin-top: 0.3rem;
}
.line_a_ul{
width: 100%;
}
.line_a_ulul{
margin-top: 0.15rem;
width: 92%;
}
.line_a_ul ul li{
width: 1.2rem;
height: .4rem;
font-size: 0.2rem;
color: #1A1A1A;
line-height: 0.4rem;
float: left;
margin-left: 0.3rem;
text-align: center;
margin-top: 0.15rem;
background-color: #F0F0F0;
}
.line_hr{
width: 92%;
height: 1px;
background: #E6E6E6;
margin-top: 0.4rem;
float: left;
margin-left: 3%;
}
.line_b{
width: 92%;
height: auto;
overflow: hidden;
}
.line_b ul li{
float: left;
}
.ul_b1{
width: 28%;
margin-left: 4%;
}
.ul_b3{
width: 28%;
margin-left: 4%;
}
.b1_span{
width: 100%;
font-size: 0.24rem;
color: #999;
text-align: center;
float: left;
margin-top: 0.4rem;
}
.b1_span_{
width: 100%;
font-size: 0.26rem;
color: #1A1A1A;
text-align: center;
float: left;
margin-top: 0.4rem;
}
.b1_span2{
color: #ff9419;
font-size: 0.4rem;
text-align: center;
margin-top: 0.3rem;
margin-left: 0.4rem;
}
/*.b1_span_totl{
color: #ff9419;
font-size: 0.4rem;
text-align: center;
width: 100%;
float: left;
}*/
.b1_span_totl{
color: #FF5C50;
font-size: 0.26rem;
text-align: center;
width: 100%;
float: left;
margin-top: .2rem;
}
.b1_span_totl_{
color: #1A1A1A;
font-size: 0.4rem;
text-align: center;
width: 100%;
float: left;
margin-top: .2rem;
}
.ul_b2{
width: 35%;
margin-left: 1%;
}
.b1_font{
color: #ff9419;
font-size: 0.28rem;
}
.b3_font1{
width: 92%;
font-size: 0.28rem;
color: #999999;
margin-left: 0.3rem;
float: left;
margin-top: 0.4rem;
}
.b3_font2{
width: 92%;
font-size: 0.28rem;
color: #999999;
margin-left: 0.3rem;
float: left;
margin-top: 0.3rem;
}
.gw{
color: #333333;
}
.b3_font3{
width: 15%;
font-size: 0.28rem;
color: #999999;
margin-left: 0.3rem;
float: left;
}
.b3_span3{
width: 78%;
/*float: left;*/
font-size: 0.28rem;
}
.dt{
margin-top: 0.3rem;
}
.b4_font{
width: 92%;
margin: 0 auto;
height: auto;
}
.b4_font .b4_font_p{
color: #333333;
font-size: 0.34rem;
width: 100%;
float: left;
font-weight: 900;
margin-top: 0.4rem;
}
.yw{
width: 100%;
font-size: 0.28rem;
color: #333333;
float: left;
margin-top: 0.3rem;
}
.b4_font2{
width: 100%;
font-size: 0.28rem;
color: #999999;
float: left;
margin-top: 0.3rem;
}
.zhaoshang-time-p, .kaiye-time-p{
display: none;
}
.b4_font3 {
width: 15%;
font-size: 0.28rem;
color: #999999;
/* margin-left: 0.3rem; */
float: left;
margin-top: 0.3rem;
}
.img_url{
width: 100%;
height: 3rem;
background: #fff5bd;
float: left;
margin-top: 0.4rem;
}
.but_right{
width: 0.13rem;
height: 0.23rem;
float: right;
margin-top: 0.13rem;
}
.lp{
margin-left: 0!important;
}
/*楼盘图*/
.bx-wrapper {
position: relative;
margin: 0 auto 60px;
padding: 0;
*zoom: 1;
}
.bx-wrapper img {
max-width: 100%;
display: block;
margin-top: 0.3rem;
}
.bx-wrapper .bx-pager,
.bx-wrapper .bx-controls-auto {
position: absolute;
bottom: -30px;
width: 100%;
display: none;
}
.bx-wrapper .bx-controls-direction a {
position: absolute;
top: 50%;
margin-top: -16px;
outline: 0;
width: 32px;
height: 32px;
text-indent: -9999px;
z-index: 9999;
}
.bx-wrapper .bx-controls-direction a.disabled {
display: none;
}
/* AUTO CONTROLS (START / STOP) */
.bx-wrapper .bx-controls-auto {
text-align: center;
}
.bx-wrapper .bx-controls-auto .bx-start:hover,
.bx-wrapper .bx-controls-auto .bx-start.active {
background-position: -86px 0;
}
.bx-wrapper .bx-controls-auto .bx-stop:hover,
.bx-wrapper .bx-controls-auto .bx-stop.active {
background-position: -86px -33px;
}
/* PAGER WITH AUTO-CONTROLS HYBRID LAYOUT */
.bx-wrapper .bx-controls.bx-has-controls-auto.bx-has-pager .bx-pager {
text-align: left;
width: 80%;
}
.bx-wrapper .bx-controls.bx-has-controls-auto.bx-has-pager .bx-controls-auto {
right: 0;
width: 35px;
}
/* IMAGE CAPTIONS */
.bx-wrapper .bx-caption {
position: absolute;
bottom: 0;
left: 0;
background: #666\9;
background: rgba(80, 80, 80, 0.75);
width: 100%;
}
.slide img{
width: 7.5rem;
height: 4rem;
float: left;
object-fit: contain;
}
.right{
float: right;
width: 47%;
}
.b3_span_shop_num{
display: none;
}
#planter{
margin-bottom: .3rem;
}
/*配套设施*/
.supporting-facilities{
width: 100%;
margin-bottom: 3.5rem;
}
.supporting-facilities>li{
float: left;
width: 20%;
margin-top: .32rem;
text-align: center;
}
.supporting-facilities>li span{
float: left;
width: 100%;
}
.supporting-facilities-img{
width: .4rem;
}
.icon-bg-facilities{
margin-bottom:.14rem ;
}
/*商铺详情 新的版本 样式更改*/
.b3_spanhao_font{
width: 92%;
font-size: 0.28rem;
color: #999999;
margin-left: 0.3rem;
float: left;
margin-top: .08rem;
}
.b3_spanhao_left{
float: right;
}
.b4_font_p_evaluation_first{
font-size: .28rem;
color: #333;
line-height: .56rem;
font-weight: 900;
}
.b4_font_p_evaluation{
font-size: .28rem;
color: #333;
margin-top: 0rem;
line-height: .56rem;
font-weight: 900;
}
.b4_font_evaluation{
color: #999999;
font-weight: 500;
}
.fix_area_bottom_new{
width: 100%;
position: fixed;
bottom: 0;
left: 0;
z-index: 9999;
display: none;
}
.fix_area_bottom_new>div{
width: 100%;
height: 1rem;
/*background: rgba(0,0,0,0.7);*/
background: #FFFFFF;
box-shadow: 0 -4px 4px 0 #F8F9FB;
position: absolute;
bottom: 0;
left: 0;
font-size: 0.24rem;
color: #000;
}
.fix_area_bottom_new>div>div:nth-of-type(1){
width: 53%;
float: left;
}
.fix_area_bottom_new>div>div:nth-of-type(2){
float: right;
margin-right: .3rem;
}
.fix_area_bottom_new>div>div:nth-of-type(1)>p{
margin-top: .18rem;
}
.fix_area_bottom_new>div>div:nth-of-type(2)>p{
/*margin-left: 1rem;*/
margin-top: .08rem;
text-align: center;
}
.head-img-agent{
height: .64rem;
width: .64rem;
border-radius: .32rem;
margin-left: .3rem;
vertical-align: middle;
margin-top: -0.16rem;
}
.tel-agent{
width: 2.52rem;
height: .84rem;
}
body{
margin-bottom: 1.4rem;
}
.head-agent{
display: inline-block;
width: 2.5rem;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
margin-top: 0.16rem;
}
/*商铺详情 动画*/
.shop-list{
position: fixed;
right: .2rem;
bottom: 2rem;
height: 2rem;
width: 1.64rem;
display: none;
background: url(/app/images/clik_shop_icon1.png) no-repeat 0 0/1.64rem 1.78rem;
}
.shop-list>img{
width: .8rem;
height: .88rem;
position: absolute;
animation: fly 1.5s infinite;
-webkit-animation: fly 1.5s infinite;
}
@keyframes fly {
0% {
bottom: 0;
right: -.1rem;
}
70% {
bottom: .3rem;
right: .14rem;
}
100% {
bottom: 0;
right: -.1rem;
}
}
@-webkit-keyframes fly {
0% {
bottom: 0;
right: -.1rem;
}
70% {
bottom: .3rem;
right: .14rem;
}
100% {
bottom: 0;
right: -.1rem;
}
}
/*.shop-list img{
width: 1.6rem;
}*/
.b3_span_shop_mianji{
display: none;
}
/*pc 官网css*/
.head-img-agent-pc {
height: .64rem;
width: .64rem;
border-radius: .32rem;
vertical-align: middle;
float: left;
}
.tel-img-agent-pc{
height: .5rem;
width: .5rem;
vertical-align: middle;
}
.agent-content-pc{
float: left;
margin-left: .16rem;
}
.agent-name-pc{
color: #333;
font-size: .28rem;
}
.agent-grade-pc{
color: #999;
font-size: .24rem;
}
#fix_tel_pc{
float: right;
margin-right: .3rem;
}
#fix_tel{
display: inline-block;
}
.ul-agent-content-pc li{
overflow: hidden;
margin-bottom: .3rem;
}
public/app/js/detaila_building_tl.js 0 → 100644
View file @ 42402898
This diff is collapsed.
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment