From f54db1c581902b96031f33cae8f46aaee9669b9e Mon Sep 17 00:00:00 2001
From: luJianJun <2587063613@qq.com>
Date: Tue, 1 Aug 2023 10:47:07 +0800
Subject: [PATCH] =?UTF-8?q?=E6=8F=90=E4=BA=A4?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/detail.vue | 282 ++++++++++++++++++++++---------------------
 1 file changed, 145 insertions(+), 137 deletions(-)

diff --git a/src/views/detail.vue b/src/views/detail.vue
index 3b65472..ceff1dd 100644
--- a/src/views/detail.vue
+++ b/src/views/detail.vue
@@ -7,84 +7,86 @@
                 <div class="dis-f jus-bet" style="margin-top: -15px;">
                     <div class="info-box">
                         <div style="position:absolute;top:0;left:0">
-                           <el-affix :offset="0" @change="changeTitleType" z-index="666" style="width: 1200px">
-                            <div class="top-bar-box dis-f jus-x" v-if="titleType">
-                                <div class="top-bar dis-f al-item jus-bet">
-                                    <div class="dis-f al-item">
-                                        <img src="../assets/img/detail/authenticationHousing.png"
-                                            class="authentication-housing" v-if="pageType == 1 &&
-                                                housingInfo['data'] &&
-                                                housingInfo['data'].info.verified" alt="">
-                                        <img src="../assets/homeImage/intermediaryTabImg.png" class="intermediary-logo"
-                                            style="margin-right:10px;" v-if="pageType == 2 &&
-                                                housingInfo['data'] &&
-                                                housingInfo['data'].isintermediary == 1" alt="">
-                                        <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="unit">HK$</span>
-                                        <span class="rent" v-if="pageType != 3">{{ housingInfo['data'] &&
-                                            housingInfo['data'].info.rent }}</span>
-                                        <span class="rent" v-if="pageType == 3">
-                                            {{
-                                                housingInfo['data'] && housingInfo['data'].info.rent[0]
-                                            }}~
-                                            {{
-                                                housingInfo['data'] && housingInfo['data'].info.rent[1]
-                                            }}
-                                        </span>
-                                        <span>/{{ housingInfo['data'] && housingInfo['data'].info.rentalperiod }}</span>
-                                        <div class="line"></div>
+                            <el-affix :offset="0" @change="changeTitleType" z-index="666" style="width: 1200px">
+                                <div class="top-bar-box dis-f jus-x" v-if="titleType">
+                                    <div class="top-bar dis-f al-item jus-bet">
                                         <div class="dis-f al-item">
-                                            {{ indexData['data'] &&
-                                                indexData['data']['config'] &&
-                                                indexData['data']['config']['type'][housingInfo['data'] &&
-                                                housingInfo['data'].info.type.substring(0, 1)]
-                                            }}
-                                            <img src="../assets/img/detail/arrowIcon.svg" class="icon" alt="">
-                                            {{ indexData['data'] &&
-                                                indexData['data']['config'] &&
-                                                indexData['data']['config']['type'][housingInfo['data'] &&
-                                                    housingInfo['data'].info.type]
-                                            }}
-                                        </div>
-                                    </div>
-                                    <div class="dis-f al-item">
-                                        <div class="tool-btn dis-f al-item jus-x">
-                                            <div class="dis-f al-item" @click="setOperation">
-                                                <img src="../assets/img/detail/collect.png"
-                                                    v-show="housingInfo['data'] && !housingInfo['data'].isfav"
-                                                    class="tool-icon" alt="">
-                                                <img src="../assets/img/detail/collectT.png"
-                                                    v-show="housingInfo['data'] && housingInfo['data'].isfav"
-                                                    class="tool-icon" alt="">
-                                                <span>
-                                                    {{ housingInfo['data'] && housingInfo['data'].isfav ?
-                                                        housingInfo['data'] && housingInfo['data']['info'].count_fav : '收藏' }}
-                                                </span>
-                                            </div>
-                                            <div class="line" style="margin:0 20px;"></div>
-                                            <div class="dis-f al-item" style="position: relative;">
-                                                <img src="../assets/img/detail/forward.png" class="tool-icon" alt="">
-                                                <span>
-                                                    转发
-                                                </span>
-                                                <transmit-btn v-if="housingInfo.data" :qrcode="housingInfo.data['qrcode']"
-                                                    :title="housingInfo.data.info['subject']"></transmit-btn>
+                                            <img src="../assets/img/detail/authenticationHousing.png"
+                                                class="authentication-housing" v-if="pageType == 1 &&
+                                                    housingInfo['data'] &&
+                                                    housingInfo['data'].info.verified" alt="">
+                                            <img src="../assets/homeImage/intermediaryTabImg.png" class="intermediary-logo"
+                                                style="margin-right:10px;" v-if="pageType == 2 &&
+                                                    housingInfo['data'] &&
+                                                    housingInfo['data'].isintermediary == 1" alt="">
+                                            <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="unit">HK$</span>
+                                            <span class="rent" v-if="pageType != 3">{{ housingInfo['data'] &&
+                                                housingInfo['data'].info.rent }}</span>
+                                            <span class="rent" v-if="pageType == 3">
+                                                {{
+                                                    housingInfo['data'] && housingInfo['data'].info.rent[0]
+                                                }}~
+                                                {{
+                                                    housingInfo['data'] && housingInfo['data'].info.rent[1]
+                                                }}
+                                            </span>
+                                            <span>/{{ housingInfo['data'] && housingInfo['data'].info.rentalperiod }}</span>
+                                            <div class="line"></div>
+                                            <div class="dis-f al-item">
+                                                {{ indexData['data'] &&
+                                                    indexData['data']['config'] &&
+                                                    indexData['data']['config']['type'][housingInfo['data'] &&
+                                                    housingInfo['data'].info.type.substring(0, 1)]
+                                                }}
+                                                <img src="../assets/img/detail/arrowIcon.svg" class="icon" alt="">
+                                                {{ indexData['data'] &&
+                                                    indexData['data']['config'] &&
+                                                    indexData['data']['config']['type'][housingInfo['data'] &&
+                                                        housingInfo['data'].info.type]
+                                                }}
                                             </div>
                                         </div>
-                                        <div class="concat-btn-box" :class="{ 'concat-btn-show': concatType }">
-                                            <div class="contact-btn top-contact-btn" style="margin:0 0 0 10px;"
-                                                @click="getConcatData">
-                                                联系方式
+                                        <div class="dis-f al-item">
+                                            <div class="tool-btn dis-f al-item jus-x">
+                                                <div class="dis-f al-item" @click="setOperation">
+                                                    <img src="../assets/img/detail/collect.png"
+                                                        v-show="housingInfo['data'] && !housingInfo['data'].isfav"
+                                                        class="tool-icon" alt="">
+                                                    <img src="../assets/img/detail/collectT.png"
+                                                        v-show="housingInfo['data'] && housingInfo['data'].isfav"
+                                                        class="tool-icon" alt="">
+                                                    <span>
+                                                        {{ housingInfo['data'] && housingInfo['data'].isfav ?
+                                                            housingInfo['data'] && housingInfo['data']['info'].count_fav : '收藏'
+                                                        }}
+                                                    </span>
+                                                </div>
+                                                <div class="line" style="margin:0 20px;"></div>
+                                                <div class="dis-f al-item" style="position: relative;">
+                                                    <img src="../assets/img/detail/forward.png" class="tool-icon" alt="">
+                                                    <span>
+                                                        转发
+                                                    </span>
+                                                    <transmit-btn v-if="housingInfo.data"
+                                                        :qrcode="housingInfo.data['qrcode']"
+                                                        :title="housingInfo.data.info['subject']"></transmit-btn>
+                                                </div>
+                                            </div>
+                                            <div class="concat-btn-box" :class="{ 'concat-btn-show': concatType }">
+                                                <div class="contact-btn top-contact-btn" style="margin:0 0 0 10px;"
+                                                    @click="getConcatData">
+                                                    联系方式
+                                                </div>
                                             </div>
                                         </div>
                                     </div>
                                 </div>
-                            </div>
-                        </el-affix>
+                            </el-affix>
                         </div>
                         <div class="detail-price-box dis-f" style="align-items: end;">
                             <span class="need-houing-type" v-if="pageType == 3">预算</span>
@@ -787,7 +789,7 @@
         <footerTool class="mg-t-60"></footerTool>
         <div class="pop-mask" v-show="showConcat">
             <div class="pop-box">
-                <!-- 两种信息 -->
+                <!-- 多种信息 -->
                 <!-- third-concat -->
                 <div class="pop-big-box" v-show="concatData.data && concatData.data.count > 1"
                     :class="{ 'third-concat': concatData.data && concatData.data.count === 3 ? !concatData.data.wechatdata.url : concatData.data && concatData.data.count > 3 }">
@@ -798,59 +800,79 @@
                             <div class="user-liner-box dis-f al-item"
                                 :class="{ 'jus-bet': concatData.data && concatData.data.count > 2 }">
                                 <!-- class='s-w-100' -->
-                                <div style="padding:0 0 30px 0;"
-                                    :class="[{ 's-w-100': concatData.data && concatData.data.count === 2 }]">
+                                <div style="padding:0 0 30px 0;" class="s-w-100">
                                     <div class="liner-title">
                                         联系方式
                                     </div>
-                                    <div class="whatsapp-box"
-                                        v-if="concatData.data && concatData.data.wechat && concatData.data.count > 2">
-                                        <div class="dis-f al-item">
-                                            <img src="../assets/img/detail/wxIcon.png" class="whatsapp-icon" alt="">
-                                            微信
-                                        </div>
-                                        <div class="dis-f al-item box-text mg-l-35">
-                                            <div style="width:120px;">
-                                                {{ concatData.data && concatData.data.wechat }}
+                                    <div class="dis-f jus-bet s-w-100">
+                                        <div>
+                                            <div
+                                                v-if="concatData.data && concatData.data.wechat && concatData.data.count > 2">
+                                                <div class="dis-f al-item">
+                                                    <img src="../assets/img/detail/wxIcon.png" class="whatsapp-icon" alt="">
+                                                    微信
+                                                </div>
+                                                <div class="dis-f al-item box-text mg-l-35">
+                                                    <div style="width:120px;">
+                                                        {{ concatData.data && concatData.data.wechat }}
+                                                    </div>
+                                                    <div class="clone-btn dis-f al-item jus-x mg-l-50"
+                                                        @click.stop="clone(concatData.data.wechat)">
+                                                        <img src="../assets/img/detail/cloneIcon.png" class="icon" alt="">
+                                                        复制
+                                                    </div>
+                                                </div>
                                             </div>
-                                            <div class="clone-btn dis-f al-item jus-x mg-l-50"
-                                                @click.stop="clone(concatData.data.wechat)">
-                                                <img src="../assets/img/detail/cloneIcon.png" class="icon" alt="">
-                                                复制
+                                            <div
+                                                v-if="concatData.data && concatData.data.whatsapp && concatData.data.count > 2">
+                                                <div class="dis-f al-item">
+                                                    <img src="../assets/img/detail/WhatsAppIcon.png" class="whatsapp-icon"
+                                                        alt="">
+                                                    WhatsApp
+                                                </div>
+                                                <div class="dis-f al-item box-text mg-l-35">
+                                                    <div style="width:120px;">
+                                                        {{ concatData.data && concatData.data.whatsapp }}
+                                                    </div>
+                                                    <div class="clone-btn dis-f al-item jus-x mg-l-50"
+                                                        @click.stop="clone(concatData.data.whatsapp)">
+                                                        <img src="../assets/img/detail/cloneIcon.png" class="icon" alt="">
+                                                        复制
+                                                    </div>
+                                                </div>
+                                            </div>
+                                            <div v-if="concatData.data && concatData.data.tel && concatData.data.count > 2">
+                                                <div class="dis-f al-item">
+                                                    <img src="../assets/img/detail/phoneIcon.png" class="whatsapp-icon"
+                                                        alt="">
+                                                    电话号码
+                                                </div>
+                                                <div class="dis-f al-item box-text mg-l-35">
+                                                    <div style="width:120px;">
+                                                        {{ concatData.data && concatData.data.tel }}
+                                                    </div>
+                                                    <div class="clone-btn dis-f al-item jus-x mg-l-50"
+                                                        @click.stop="clone(concatData.data.tel)">
+                                                        <img src="../assets/img/detail/cloneIcon.png" class="icon" alt="">
+                                                        复制
+                                                    </div>
+                                                </div>
                                             </div>
                                         </div>
-                                    </div>
-                                    <div class="whatsapp-box"
-                                        v-if="concatData.data && concatData.data.whatsapp && concatData.data.count > 2">
-                                        <div class="dis-f al-item">
-                                            <img src="../assets/img/detail/WhatsAppIcon.png" class="whatsapp-icon" alt="">
-                                            WhatsApp
-                                        </div>
-                                        <div class="dis-f al-item box-text mg-l-35">
-                                            <div style="width:120px;">
-                                                {{ concatData.data && concatData.data.whatsapp }}
+
+                                        <div
+                                            v-if="concatData.data && concatData.data.count > 2 && concatData.data.wechatdata.url">
+                                            <div class="wx-qrcode-s dis-f jus-x al-item">
+                                                <img :src="concatData.data && concatData.data.wechatdata.url"
+                                                    class="user-img" alt="">
                                             </div>
-                                            <div class="clone-btn dis-f al-item jus-x mg-l-50"
-                                                @click.stop="clone(concatData.data.whatsapp)">
-                                                <img src="../assets/img/detail/cloneIcon.png" class="icon" alt="">
-                                                复制
-                                            </div>
-                                        </div>
-                                    </div>
-                                    <div class="whatsapp-box"
-                                        v-if="concatData.data && concatData.data.tel && concatData.data.count > 2">
-                                        <div class="dis-f al-item">
-                                            <img src="../assets/img/detail/phoneIcon.png" class="whatsapp-icon" alt="">
-                                            电话号码
-                                        </div>
-                                        <div class="dis-f al-item box-text mg-l-35">
-                                            <div style="width:120px;">
-                                                {{ concatData.data && concatData.data.tel }}
-                                            </div>
-                                            <div class="clone-btn dis-f al-item jus-x mg-l-50"
-                                                @click.stop="clone(concatData.data.tel)">
-                                                <img src="../assets/img/detail/cloneIcon.png" class="icon" alt="">
-                                                复制
+                                            <div style="margin-top:15px;font-size:14px;text-align: center;">
+                                                <div>
+                                                    微信扫码添加好友
+                                                </div>
+                                                <div style="margin-top:5px;font-size:14px;">
+                                                    备注：寄托租房
+                                                </div>
                                             </div>
                                         </div>
                                     </div>
@@ -898,20 +920,6 @@
                                         </div>
                                     </div>
                                 </div>
-                                <div v-if="concatData.data && concatData.data.count > 2 && concatData.data.wechatdata.url">
-                                    <div class="wx-qrcode-s dis-f jus-x al-item">
-                                        <img :src="concatData.data && concatData.data.wechatdata.url" class="user-img"
-                                            alt="">
-                                    </div>
-                                    <div style="margin-top:15px;font-size:14px;text-align: center;">
-                                        <div>
-                                            微信扫码添加好友
-                                        </div>
-                                        <div style="margin-top:5px;font-size:14px;">
-                                            备注：寄托租房
-                                        </div>
-                                    </div>
-                                </div>
                                 <div class="round dis-f jus-x al-item"
                                     v-if="concatData.data && !concatData.data.wechatdata.url">
                                     <div class="deepen dis-f jus-x al-item">
@@ -1767,12 +1775,12 @@ img {
 
                     .whatsapp-box {
                         margin-top: 30px;
+                    }
 
-                        .whatsapp-icon {
-                            width: 25px;
-                            height: 24px;
-                            margin-right: 10px;
-                        }
+                    .whatsapp-icon {
+                        width: 25px;
+                        height: 24px;
+                        margin-right: 10px;
                     }
                 }