页面样式

This commit is contained in:
2023-07-31 10:01:40 +08:00
parent 199af74281
commit a6eb45baed
4 changed files with 52 additions and 38 deletions

View File

@@ -11,15 +11,15 @@
<div class="title-text"> <div class="title-text">
{{ data && data.data && data.data.subject || '暂无标题' }} {{ data && data.data && data.data.subject || '暂无标题' }}
</div> </div>
<div class="mg-t-10 dis-f al-item-start jus-bet s-w-100"> <div class="mg-t-20 dis-f al-item-start jus-bet s-w-100">
<div> <div>
<div class="dis-f al-item"> <div class="dis-f al-item">
<div class="tab-item first-tab"> <div class="tab-item first-tab">
{{ data && data.data && data.data.gptype || '' }} {{ data && data.data && data.data.gptype || '' }}
</div> </div>
<div class="tab-item mg-l-8" <div class="tab-item mg-l-8"
v-if="listData && listData.data && listData.data.type[data && data.data && data.data.type]"> v-if="listData.data && listData.data.type[data && data.data && data.data.type]">
{{ listData && listData.data && listData.data.type[data && data.data && data.data.type] || '' }} {{ listData.data && listData.data.type[data && data.data && data.data.type] || '' }}
</div> </div>
<div class="tab-item mg-l-8" <div class="tab-item mg-l-8"
v-if="data && data.data && data.data.elevator !== -1 && data.data.elevator"> v-if="data && data.data && data.data.elevator !== -1 && data.data.elevator">
@@ -156,7 +156,7 @@ location.data = store.state.indexData && store.state.indexData.config && store.s
//数据包 //数据包
let listData = reactive({ data: {} }) let listData = reactive({ data: {} })
listData.data = store.state.indexData && store.state.indexData.config listData.data = store.state.indexData && store.state.indexData.config||{}
let pageType=ref('') let pageType=ref('')
@@ -266,8 +266,8 @@ img {
z-index:66; z-index:66;
} }
.mg-t-10 { .mg-t-20 {
margin-top: 10px; margin-top: 20px;
} }
.img { .img {
@@ -318,7 +318,7 @@ img {
} }
.tab-item { .tab-item {
padding: 5px; padding:2px 5px;
background: inherit; background: inherit;
background-color: rgba(242, 242, 242, 1); background-color: rgba(242, 242, 242, 1);
border: none; border: none;
@@ -340,7 +340,7 @@ img {
font-style: normal; font-style: normal;
font-size: 15px; font-size: 15px;
color: #555555; color: #555555;
margin-top: 15px; margin-top: 20px;
.img { .img {
width: 18px; width: 18px;
@@ -355,7 +355,7 @@ img {
font-style: normal; font-style: normal;
font-size: 14px; font-size: 14px;
color: #555555; color: #555555;
margin-top: 15px; margin-top: 20px;
.time { .time {
font-family: 'PingFangSC-Regular', 'PingFang SC', sans-serif; font-family: 'PingFangSC-Regular', 'PingFang SC', sans-serif;
@@ -383,7 +383,7 @@ img {
} }
.first-tab { .first-tab {
background: #000; background: rgba(51, 51, 51, 1);
color: #fff; color: #fff;
} }
} }

View File

@@ -306,7 +306,6 @@ let watchAdv = () => {
font-style: normal; font-style: normal;
font-size: 14px; font-size: 14px;
color: #FFFFFF; color: #FFFFFF;
width: 54px;
height: 24px; height: 24px;
border-radius: 5px; border-radius: 5px;
position: absolute; position: absolute;
@@ -315,6 +314,7 @@ let watchAdv = () => {
background-color: rgba(51, 51, 51, 0.56078431372549); background-color: rgba(51, 51, 51, 0.56078431372549);
text-align: center; text-align: center;
line-height: 24px; line-height: 24px;
padding:0 6px;
} }
.intermediary-type { .intermediary-type {

View File

@@ -498,7 +498,7 @@ let setHireId = (item) => {
let dropdownCommand = (obj) => { let dropdownCommand = (obj) => {
hireTypeObj.id = obj.id hireTypeObj.id = obj.id
hireTypeObj.title = obj.title hireTypeObj.title = obj.title
store.state.routeList['hireTypeObj'] = JSON.parse(JSON.stringify(hireTypeObj)) // store.state.routeList['hireTypeObj'] = JSON.parse(JSON.stringify(hireTypeObj))
setSeachCondition('types', obj.id) setSeachCondition('types', obj.id)
} }

View File

@@ -16,7 +16,10 @@
style="margin-right:10px;" v-if="pageType == 2 && style="margin-right:10px;" v-if="pageType == 2 &&
housingInfo['data'] && housingInfo['data'] &&
housingInfo['data'].isintermediary == 1" alt=""> housingInfo['data'].isintermediary == 1" alt="">
<div class="line" v-if="housingInfo['data'] && housingInfo['data'].info.verified"></div> <div class="line" v-if="housingInfo['data'] && housingInfo['data'].info.verified
||pageType == 2 &&
housingInfo['data'] &&
housingInfo['data'].isintermediary == 1"></div>
<span class="need-houing-type" v-if="pageType == 3">预算</span> <span class="need-houing-type" v-if="pageType == 3">预算</span>
<span class="unit">HK$</span> <span class="unit">HK$</span>
<span class="rent" v-if="pageType != 3">{{ housingInfo['data'] && <span class="rent" v-if="pageType != 3">{{ housingInfo['data'] &&
@@ -70,7 +73,7 @@
</div> </div>
</div> </div>
<div class="concat-btn-box" :class="{ 'concat-btn-show': concatType }"> <div class="concat-btn-box" :class="{ 'concat-btn-show': concatType }">
<div class="contact-btn" style="margin:0 0 0 10px;" @click="getConcatData"> <div class="contact-btn top-contact-btn" style="margin:0 0 0 10px;" @click="getConcatData">
联系方式 联系方式
</div> </div>
</div> </div>
@@ -446,8 +449,8 @@
location && location[housingInfo['data'] && housingInfo['data']['info'].location] location && location[housingInfo['data'] && housingInfo['data']['info'].location]
}}</span> }}</span>
</div> </div>
<div class="dis-f jus-x" style="margin-top:15px;"> <div class="dis-f jus-x" style="margin-top:15px;" v-if="housingInfo['data'] && housingInfo['data'].info.latitude">
<div v-if="housingInfo['data'] && housingInfo['data'].info.latitude"> <div>
<mapInfo :latlng="{ <mapInfo :latlng="{
longitude: housingInfo['data'].info.longitude * 1, longitude: housingInfo['data'].info.longitude * 1,
latitude: housingInfo['data'].info.latitude * 1 latitude: housingInfo['data'].info.latitude * 1
@@ -537,31 +540,31 @@
</div> </div>
<div class="houseing-info-box dis-f al-item jus-bet"> <div class="houseing-info-box dis-f al-item jus-bet">
<div class="dis-f al-item houseing-info-box-s"> <div class="dis-f al-item houseing-info-box-s">
房源ID: <span class="houseing-id" @click="clone(housingInfo['data'] && 房源ID : &nbsp<span class="houseing-id" @click="clone(housingInfo['data'] &&
housingInfo['data'].info.uid)">{{ housingInfo['data'] && housingInfo['data'].info.uid)">{{ housingInfo['data'] &&
housingInfo['data'].info.uid }}</span> housingInfo['data'].info.uid }}</span>
<span class="browse-box"> <span class="browse-box">
浏览: <span class="text">{{ housingInfo['data'] && housingInfo['data'].info.count_view 浏览 : <span class="text">{{ housingInfo['data'] && housingInfo['data'].info.count_view
}}</span> }}</span>
</span> </span>
</div> </div>
<div class="dis-f al-item houseing-info-box-s"> <div class="dis-f al-item houseing-info-box-s">
<span> <span>
收藏: <span class="text"> 收藏 : &nbsp<span class="text">
{{ housingInfo['data'] && housingInfo['data'].info.count_fav }} {{ housingInfo['data'] && housingInfo['data'].info.count_fav }}
</span> </span>
</span> </span>
</div> </div>
<div class="dis-f al-item houseing-info-box-s"> <div class="dis-f al-item houseing-info-box-s">
<span> <span>
发布: <span class="text"> 发布 : &nbsp<span class="text">
{{ housingInfo['data'] && housingInfo['data'].info.timestamp }} {{ housingInfo['data'] && housingInfo['data'].info.timestamp }}
</span> </span>
</span> </span>
</div> </div>
<div class="dis-f al-item houseing-info-box-s" style="border-right:0px"> <div class="dis-f al-item houseing-info-box-s" style="border-right:0px">
<span> <span>
更新: <span class="text"> 更新 : &nbsp<span class="text">
{{ housingInfo['data'] && housingInfo['data'].info.updatetime }} {{ housingInfo['data'] && housingInfo['data'].info.updatetime }}
</span> </span>
</span> </span>
@@ -571,12 +574,12 @@
<div class="title"> <div class="title">
免责声明 免责声明
</div> </div>
<div class="mg-t-15"> <div class="mg-t-15 line-h-30">
发布者对房源信息的真实性、合法性等负责,平台不负责甄别和审核具体内容真实性和有效性等,请务必仔细核实相关信息,谨防上当受骗。 发布者对房源信息的真实性、合法性等负责,平台不负责甄别和审核具体内容真实性和有效性等,请务必仔细核实相关信息,谨防上当受骗。
<div> <div>
如房源信息中有内容侵犯了您的合法权益,可点击屏幕右侧的举报或联系寄托方同学(微信号 如房源信息中有内容侵犯了您的合法权益,可点击屏幕右侧的举报或联系寄托方同学(微信号
<el-dropdown> <el-dropdown>
<span class="text-line" @click="clone(concatInfo.data && concatInfo.data.wechat)">{{ <span class="text-line line-h-30" @click="clone(concatInfo.data && concatInfo.data.wechat)">{{
concatInfo.data && concatInfo.data.wechat }}</span> concatInfo.data && concatInfo.data.wechat }}</span>
<template #dropdown> <template #dropdown>
<el-dropdown-menu> <el-dropdown-menu>
@@ -610,7 +613,7 @@
<img src="../assets/homeImage/intermediaryTabImg.png" class="intermediary-logo" alt=""> <img src="../assets/homeImage/intermediaryTabImg.png" class="intermediary-logo" alt="">
</div> </div>
<div class="dis-f jus-x" <div class="dis-f jus-x"
v-if="!(pageType == 2 && housingInfo['data'] && housingInfo['data'].isintermediary != 1)"> v-if="pageType!=2||(pageType == 2 && housingInfo['data'] && housingInfo['data'].isintermediary != 1)">
<div class="user-type"> <div class="user-type">
{{ {{
indexData['data'] && indexData['data'] &&
@@ -625,7 +628,7 @@
<img src="../assets/img/detail/timeIcon.svg" class="icon" alt=""> <img src="../assets/img/detail/timeIcon.svg" class="icon" alt="">
<span> <span>
{{ checkUpdateTime(housingInfo['data'] && housingInfo['data'].info.updatetime) {{ checkUpdateTime(housingInfo['data'] && housingInfo['data'].info.updatetime)
}} </span> }}更新 </span>
</div> </div>
<div v-if="checkUpdateTime(housingInfo['data'] && housingInfo['data'].info.updatetime)"> <div v-if="checkUpdateTime(housingInfo['data'] && housingInfo['data'].info.updatetime)">
<div class="dis-f al-item jus-x time-box" v-if="housingInfo['data'] && <div class="dis-f al-item jus-x time-box" v-if="housingInfo['data'] &&
@@ -639,7 +642,7 @@
<div class="dis-f al-item jus-x time-box" <div class="dis-f al-item jus-x time-box"
v-if="housingInfo['data'] && housingInfo['data'].verifiedlistingcount"> v-if="housingInfo['data'] && housingInfo['data'].verifiedlistingcount">
<img src="../assets/img/detail/presonNumIcon.png" class="icon" alt=""> <img src="../assets/img/detail/presonNumIcon.png" class="icon" alt="">
<span>认证房源 x{{ housingInfo['data'] && housingInfo['data'].verifiedlistingcount }}</span> <div class="dis-f al-item">认证房源 x {{ housingInfo['data'] && housingInfo['data'].verifiedlistingcount }}</div>
</div> </div>
</div> </div>
<div class="intermediary-info-box" v-if="housingInfo['data'] && housingInfo['data'].contacts"> <div class="intermediary-info-box" v-if="housingInfo['data'] && housingInfo['data'].contacts">
@@ -740,7 +743,8 @@
<!-- 推荐 --> <!-- 推荐 -->
<div class="dis-f jus-x" v-if="pageType != 3 && (recommendListData.length > 0 || publisherList.length > 0)"> <div class="dis-f jus-x" v-if="pageType != 3 && (recommendListData.length > 0 || publisherList.length > 0)">
<div class="body-maxWidth housing-title" style="margin-top:50px;"> <div class="body-maxWidth housing-title" style="margin-top:50px;">
{{ pageType == 2 && housingInfo['data'].isintermediary ? `发布者的其他房源(${publisherList.length}` : '附近房源' }} {{ pageType == 2 && housingInfo['data'].isintermediary ? `发布者的其他房源(${publisherList.length}` :
pageType == 1 && housingInfo['data'] && housingInfo['data']['info'].verified ? `发布者的其他认证房源(${publisherList.length}`:'附近房源' }}
</div> </div>
</div> </div>
<div class="dis-f jus-x al-item" style="position: relative;" v-if="pageType != 3"> <div class="dis-f jus-x al-item" style="position: relative;" v-if="pageType != 3">
@@ -1164,7 +1168,6 @@ let location = store.state.indexData.config && store.state.indexData.config.loca
let setNavigation = () => { let setNavigation = () => {
let type = store.state.indexData.config && store.state.indexData.config.type let type = store.state.indexData.config && store.state.indexData.config.type
indexData['data'] = store.state.indexData indexData['data'] = store.state.indexData
console.log()
if (!location) return if (!location) return
if (pageType.value == 1 || pageType.value == 2) { if (pageType.value == 1 || pageType.value == 2) {
// location=3.8,3.13&areaItem=3 // location=3.8,3.13&areaItem=3
@@ -1207,6 +1210,7 @@ let setNavigation = () => {
} }
} }
} }
console.log(111,store.state.routeList)
} }
//中介数据 //中介数据
let contacts = reactive({ let contacts = reactive({
@@ -1232,7 +1236,7 @@ let getHousingInfo = () => {
}) })
concatInfo['data'] = store.state.indexData.wechat concatInfo['data'] = store.state.indexData.wechat
if (res.data.contacts) contacts['data'] = res.data.contacts if (res.data.contacts) contacts['data'] = res.data.contacts
if (pageType.value == 2 && housingInfo['data'].isintermediary) { if ((pageType.value == 2 && housingInfo['data'].isintermediary)||(pageType.value ==1 && housingInfo['data']['info'].verified)) {
getPublisherList() getPublisherList()
} else if (pageType.value != 3) { } else if (pageType.value != 3) {
recommendList() recommendList()
@@ -1880,6 +1884,10 @@ img {
} }
} }
.top-contact-btn{
width:200px !important;
}
.contact-btn { .contact-btn {
width: 260px; width: 260px;
height: 48px; height: 48px;
@@ -1911,7 +1919,7 @@ img {
.line { .line {
width: 1px; width: 1px;
height: 19px; height: 19px;
margin: 0 25px; margin: 0 20px;
background: #ebebeb; background: #ebebeb;
} }
@@ -1970,7 +1978,7 @@ img {
} }
.concat-btn-show { .concat-btn-show {
width: 270px; width: 210px;
} }
.tool-btn { .tool-btn {
@@ -2028,6 +2036,7 @@ img {
padding: 20px 10px; padding: 20px 10px;
margin-top: 30px; margin-top: 30px;
box-sizing: border-box; box-sizing: border-box;
line-height:20px;
.business-card-btn { .business-card-btn {
width: 100px; width: 100px;
@@ -2045,7 +2054,7 @@ img {
font-size: 14px; font-size: 14px;
color: #333; color: #333;
cursor: pointer; cursor: pointer;
margin-top: 10px; margin-top: 15px;
.logo { .logo {
width: 22px; width: 22px;
@@ -2266,7 +2275,7 @@ img {
} }
.image-box { .image-box {
margin-top: 35px; margin-top: 50px;
.img-video { .img-video {
width: 26px; width: 26px;
@@ -2301,7 +2310,7 @@ img {
height: 115px; height: 115px;
width: 100%; width: 100%;
cursor: pointer; cursor: pointer;
margin-top: 20px; margin-top: 15px;
.list-box::-webkit-scrollbar { .list-box::-webkit-scrollbar {
display: none; display: none;
@@ -2363,7 +2372,7 @@ img {
} }
.housing-info { .housing-info {
margin-top: 50px; margin-top: 60px;
.need-housing-location { .need-housing-location {
margin-top: 20px; margin-top: 20px;
@@ -2409,7 +2418,7 @@ img {
font-family: 'PingFangSC-Regular', 'PingFang SC', sans-serif; font-family: 'PingFangSC-Regular', 'PingFang SC', sans-serif;
font-weight: 400; font-weight: 400;
font-style: normal; font-style: normal;
font-size: 14px; font-size: 16px;
color: #333; color: #333;
padding: 10px 0; padding: 10px 0;
border-bottom: 1px dashed rgba(237, 237, 237, 1); border-bottom: 1px dashed rgba(237, 237, 237, 1);
@@ -2445,7 +2454,7 @@ img {
font-style: normal; font-style: normal;
font-size: 16px; font-size: 16px;
color: #333; color: #333;
margin-left: 30px; margin-left: 25px;
} }
} }
} }
@@ -2472,6 +2481,9 @@ img {
color: #7F7F7F; color: #7F7F7F;
font-size: 13px; font-size: 13px;
margin-top: 30px; margin-top: 30px;
.line-h-30{
line-height:30px;
}
.wx-qrcode-s { .wx-qrcode-s {
background-color: rgba(255, 255, 255, 1); background-color: rgba(255, 255, 255, 1);
@@ -2523,6 +2535,7 @@ img {
font-weight: 400; font-weight: 400;
font-style: normal; font-style: normal;
color: #7F7F7F; color: #7F7F7F;
font-size:13px;
.houseing-info-box-s { .houseing-info-box-s {
padding: 0 15px; padding: 0 15px;
@@ -2545,9 +2558,10 @@ img {
} }
.map-box { .map-box {
margin-top: 50px; margin-top: 60px;
.introduce-text { .introduce-text {
line-height: 35px;
font-family: 'PingFangSC-Regular', 'PingFang SC', sans-serif; font-family: 'PingFangSC-Regular', 'PingFang SC', sans-serif;
font-weight: 400; font-weight: 400;
font-style: normal; font-style: normal;