样式修改

This commit is contained in:
2023-08-01 11:42:52 +08:00
parent d358fee8b1
commit bbbeed395a
2 changed files with 64 additions and 29 deletions

View File

@@ -246,6 +246,8 @@ console.log('houseingPageType',houseingPageType)
let type = houseingPageType === '0' ? 'person' : houseingPageType === '1' ? 'intermediary' : houseingPageType === '6' ? 'need' : 'apartment' let type = houseingPageType === '0' ? 'person' : houseingPageType === '1' ? 'intermediary' : houseingPageType === '6' ? 'need' : 'apartment'
tabType.value = type tabType.value = type
if(isNeedHousing.value)tabType.value = '6'
//页面判断 //页面判断
let checkPageType = () => { let checkPageType = () => {
// houseingPageType 0个人 1中介 6求房源 // houseingPageType 0个人 1中介 6求房源

View File

@@ -800,20 +800,21 @@
<div class="user-liner-box dis-f al-item" <div class="user-liner-box dis-f al-item"
:class="{ 'jus-bet': concatData.data && concatData.data.count > 2 }"> :class="{ 'jus-bet': concatData.data && concatData.data.count > 2 }">
<!-- class='s-w-100' --> <!-- class='s-w-100' -->
<div style="padding:0 0 30px 0;" class="s-w-100"> <div class="s-w-100">
<div class="liner-title"> <div class="liner-title"
:class="{'mg-b-50':concatData.data && concatData.data.count == 2&&concatData.data.wechatdata.url}">
联系方式 联系方式
</div> </div>
<div class="dis-f jus-bet s-w-100"> <div class="dis-f jus-bet s-w-100">
<div> <div v-if="concatData.data && (concatData.data.count > 2||(!concatData.data.wechatdata.url&&concatData.data.count== 2))">
<div <div class="mg-b-30"
v-if="concatData.data && concatData.data.wechat && concatData.data.count > 2"> v-if="concatData.data && concatData.data.wechat && concatData.data.count >= 2">
<div class="dis-f al-item"> <div class="dis-f al-item">
<img src="../assets/img/detail/wxIcon.png" class="whatsapp-icon" alt=""> <img src="../assets/img/detail/wxIcon.png" class="whatsapp-icon" alt="">
微信 微信
</div> </div>
<div class="dis-f al-item box-text mg-l-35"> <div class="dis-f al-item box-text mg-l-35">
<div style="width:120px;"> <div class="num-text">
{{ concatData.data && concatData.data.wechat }} {{ concatData.data && concatData.data.wechat }}
</div> </div>
<div class="clone-btn dis-f al-item jus-x mg-l-50" <div class="clone-btn dis-f al-item jus-x mg-l-50"
@@ -823,15 +824,15 @@
</div> </div>
</div> </div>
</div> </div>
<div <div class="mg-b-30"
v-if="concatData.data && concatData.data.whatsapp && concatData.data.count > 2"> v-if="concatData.data && concatData.data.count >= 2">
<div class="dis-f al-item"> <div class="dis-f al-item">
<img src="../assets/img/detail/WhatsAppIcon.png" class="whatsapp-icon" <img src="../assets/img/detail/WhatsAppIcon.png" class="whatsapp-icon"
alt=""> alt="">
WhatsApp WhatsApp
</div> </div>
<div class="dis-f al-item box-text mg-l-35"> <div class="dis-f al-item box-text mg-l-35">
<div style="width:120px;"> <div class="num-text">
{{ concatData.data && concatData.data.whatsapp }} {{ concatData.data && concatData.data.whatsapp }}
</div> </div>
<div class="clone-btn dis-f al-item jus-x mg-l-50" <div class="clone-btn dis-f al-item jus-x mg-l-50"
@@ -841,14 +842,15 @@
</div> </div>
</div> </div>
</div> </div>
<div v-if="concatData.data && concatData.data.tel && concatData.data.count > 2"> <div class="mg-b-30"
v-if="concatData.data && concatData.data.tel && concatData.data.count >= 2">
<div class="dis-f al-item"> <div class="dis-f al-item">
<img src="../assets/img/detail/phoneIcon.png" class="whatsapp-icon" <img src="../assets/img/detail/phoneIcon.png" class="whatsapp-icon"
alt=""> alt="">
电话号码 电话号码
</div> </div>
<div class="dis-f al-item box-text mg-l-35"> <div class="dis-f al-item box-text mg-l-35">
<div style="width:120px;"> <div class="num-text">
{{ concatData.data && concatData.data.tel }} {{ concatData.data && concatData.data.tel }}
</div> </div>
<div class="clone-btn dis-f al-item jus-x mg-l-50" <div class="clone-btn dis-f al-item jus-x mg-l-50"
@@ -859,7 +861,6 @@
</div> </div>
</div> </div>
</div> </div>
<div <div
v-if="concatData.data && concatData.data.count > 2 && concatData.data.wechatdata.url"> v-if="concatData.data && concatData.data.count > 2 && concatData.data.wechatdata.url">
<div class="wx-qrcode-s dis-f jus-x al-item"> <div class="wx-qrcode-s dis-f jus-x al-item">
@@ -875,9 +876,22 @@
</div> </div>
</div> </div>
</div> </div>
<div class="round dis-f jus-x al-item"
:class="{'mg-t-20':concatData.data && concatData.data.count > 2 && !concatData.data.wechatdata.url}"
v-if="concatData.data && concatData.data.count >= 2 && !concatData.data.wechatdata.url">
<div class="deepen dis-f jus-x al-item">
<div class="center-box dis-f jus-x al-item">
<div class="center-s dis-f jus-x al-item">
<div class="drop">
</div>
</div>
</div>
</div>
</div>
</div> </div>
<div class="dis-f jus-x al-item whatsapp-wx-box s-w-100" <div class="dis-f al-item whatsapp-wx-box s-w-100 jus-sp"
v-if="concatData.data && concatData.data.count === 2 && concatData.data.wechatdata.aid !== 0"> v-if="concatData.data && concatData.data.count === 2 && concatData.data.wechatdata.aid !== 0&&concatData.data.wechatdata.url">
<div> <div>
<div> <div>
<div v-if="concatData.data.whatsapp"> <div v-if="concatData.data.whatsapp">
@@ -903,8 +917,8 @@
</div> </div>
</div> </div>
</div> </div>
<div class="liner"></div> <div class="liner" v-if="concatData.data && concatData.data.wechatdata.url"></div>
<div> <div v-if="concatData.data && concatData.data.wechatdata.url">
<div class="wx-qrcode-s dis-f jus-x al-item"> <div class="wx-qrcode-s dis-f jus-x al-item">
<img :src="concatData.data && concatData.data.wechatdata.url" <img :src="concatData.data && concatData.data.wechatdata.url"
class="user-img" alt=""> class="user-img" alt="">
@@ -918,18 +932,18 @@
</div> </div>
</div> </div>
</div> </div>
</div> <!-- <div class="round dis-f jus-x al-item"
</div> v-if="concatData.data && !concatData.data.wechatdata.url">
<div class="round dis-f jus-x al-item" <div class="deepen dis-f jus-x al-item">
v-if="concatData.data && !concatData.data.wechatdata.url"> <div class="center-box dis-f jus-x al-item">
<div class="deepen dis-f jus-x al-item"> <div class="center-s dis-f jus-x al-item">
<div class="center-box dis-f jus-x al-item"> <div class="drop">
<div class="center-s dis-f jus-x al-item">
<div class="drop">
</div>
</div>
</div> </div>
</div> </div>
</div> </div> -->
</div> </div>
</div> </div>
</div> </div>
@@ -1480,6 +1494,9 @@ img {
.jus-x { .jus-x {
justify-content: center; justify-content: center;
} }
.jus-sp{
justify-content: space-around;
}
.al-item { .al-item {
align-items: center; align-items: center;
@@ -1657,12 +1674,15 @@ img {
letter-spacing: normal; letter-spacing: normal;
color: #333333; color: #333333;
.mg-l-80{
margin-left:80px;
}
.round { .round {
width: 180px; width: 180px;
height: 180px; height: 180px;
background: rgba(218, 246, 241, 0.5); background: rgba(218, 246, 241, 0.5);
border-radius: 50%; border-radius: 50%;
margin-left: 80px;
.deepen { .deepen {
width: 130px; width: 130px;
@@ -1698,7 +1718,7 @@ img {
height: 368px; height: 368px;
position: absolute; position: absolute;
z-index: 333; z-index: 333;
padding: 0px 80px 0 60px; padding: 0px 80px 0 45px;
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;
@@ -1720,7 +1740,6 @@ img {
} }
.whatsapp-wx-box { .whatsapp-wx-box {
margin-top: 50px;
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;
@@ -1744,7 +1763,7 @@ img {
width: 1px; width: 1px;
height: 190px; height: 190px;
border: 1px solid #e2e7ec; border: 1px solid #e2e7ec;
margin: 0 100px 0 100px margin: 0 30px 0 30px
} }
} }
@@ -1754,6 +1773,15 @@ img {
font-style: normal; font-style: normal;
font-size: 24px; font-size: 24px;
color: #000000; color: #000000;
margin-bottom: 30px;
}
.mg-b-50{
margin-bottom:50px;
}
.mg-b-30 {
margin-bottom: 30px;
} }
.box-text { .box-text {
@@ -1763,6 +1791,11 @@ img {
font-size: 18px; font-size: 18px;
color: #000000; color: #000000;
margin-top: 20px; margin-top: 20px;
.num-text {
width:180px;
word-wrap: break-word;
}
} }
.mg-l-35 { .mg-l-35 {