From 1b8fa7b68b473a8cac7d742a7d02783e9c258b79 Mon Sep 17 00:00:00 2001
From: A1300399510 <A1300399510>
Date: Fri, 28 Jul 2023 14:42:45 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E6=94=B9=E5=9B=BE=E7=89=87=E9=A2=84?=
 =?UTF-8?q?=E8=A7=88=E7=BB=84=E4=BB=B6?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/detail/imageWatch.vue | 45 ++++++++--------
 src/components/public/backToTop.vue  | 23 ++++++++
 src/utils/util.js                    |  1 -
 src/views/apartmentDetail.vue        | 32 +----------
 src/views/detail.vue                 | 79 +++++++++++++++++-----------
 src/views/user.vue                   |  4 +-
 6 files changed, 98 insertions(+), 86 deletions(-)

diff --git a/src/components/detail/imageWatch.vue b/src/components/detail/imageWatch.vue
index 4579316..aadb8c3 100644
--- a/src/components/detail/imageWatch.vue
+++ b/src/components/detail/imageWatch.vue
@@ -3,7 +3,7 @@
         <div class="pos-r dis-f al-item mg-t-60">
             <div class="s-w-100">
                 <el-carousel arrow="never" height="600px" :autoplay="false" :initial-index="props.index"
-                    indicator-position="none" ref="carousel">
+                    indicator-position="none" ref="carousel" @change="carouselChange">
                     <el-carousel-item v-for="(item, i) in list" :key="i">
                         <div class="dis-f jus-x al-item" v-if="item">
                             <div class="img-box dis-f jus-x" style="width:600px" v-if="item['type'] != 'attachment'">
@@ -16,8 +16,8 @@
                     </el-carousel-item>
                 </el-carousel>
             </div>
-            <img src="../../assets/img/detail/imageArrowIcon.svg" class="image-arrow-icon left-arrow" @click="next" alt="">
-            <img src="../../assets/img/detail/imageArrowIcon.svg" class="image-arrow-icon right-arrow" @click="prev" alt="">
+            <img src="../../assets/img/detail/imageArrowIcon.svg" class="image-arrow-icon left-arrow" @click="prev" alt="">
+            <img src="../../assets/img/detail/imageArrowIcon.svg" class="image-arrow-icon right-arrow" @click="next" alt="">
         </div>
         <div class="tab-text">
             {{ `${imageTab + 1}/${list.length}` }}
@@ -40,7 +40,7 @@
         <img src="../../assets/img/detail/imageClose.svg" @click="close" class="close-img" alt="">
     </div>
 </template>
-  
+
 <script setup>
 import { reactive, onMounted, ref, defineProps, watchEffect } from 'vue'
 // type 的类型代表  attachment 图片  videos  视频   lives 直播
@@ -53,7 +53,12 @@ const props = defineProps({
             return []
         }
     },
-    index: Number,
+    index: {
+        type: Number,
+        default: function () {
+            return 0
+        }
+    },
     close: {
         type: Function
     },
@@ -70,33 +75,31 @@ let close = props.close
 let carousel = ref(null)
 let imageTab = ref(0)
 
- if(!props['index']) imageTab = props['index']
+
 //上一张
-let prev = () => {
-    if (imageTab.value === list.value.length - 1) return
-    imageTab.value++
-    carousel.value.prev()
-}
+let prev = () => carousel.value.prev()
+
+// 轮播图滚动后事件
+const carouselChange = value => imageTab.value = value
 
 //下一张
-let next = () => {
-    if (imageTab.value <= 0) return
-    imageTab.value--
-    carousel.value.next()
-}
+let next = () => carousel.value.next()
 
 //点击预览图
 let watchSet = (num) => {
-    imageTab.value = num
     carousel.value.setActiveItem(num)
 }
 
-watchEffect(() => {
-    show = props.show
-    list.value = props.list
-    if (imageTab.value > 0) carousel.value.setActiveItem(imageTab.value)
+
+onMounted(() => {
+    watchEffect(() => {
+        show = props.show
+        list.value = props.list
+        if (props.index >= 0) carousel.value.setActiveItem(props.index)
+    })
 
 })
+
 </script>
 <style scoped>
 img {
diff --git a/src/components/public/backToTop.vue b/src/components/public/backToTop.vue
index dada9b3..7e50b09 100644
--- a/src/components/public/backToTop.vue
+++ b/src/components/public/backToTop.vue
@@ -5,6 +5,29 @@
 </template>
 
 <script setup>
+onMounted(() => {
+    window.addEventListener('scroll', handleScroll);
+});
+
+onUnmounted(() => {
+    window.removeEventListener('scroll', handleScroll);
+});
+
+const handleScroll = () => {
+    if (Math.random() > 0.3) return
+    // for (let i = 0; i < navList.value.length; i++) {
+    //     let element = navList.value[i]
+
+    //     const rect = eval(element.value).value.getBoundingClientRect();
+    //     const distanceToTop = rect.top;
+    //     if (distanceToTop >= 0) {
+    //         navTab.value = element.value
+    //         break;
+    //     }
+
+    // }
+}
+
 const screenroll = () => {
     window.scrollTo({
         top: 0,
diff --git a/src/utils/util.js b/src/utils/util.js
index 0377deb..2cc148a 100644
--- a/src/utils/util.js
+++ b/src/utils/util.js
@@ -31,7 +31,6 @@ function copyToClipboard(text) {
         // 4. 销毁输入框
         document.body.removeChild(textareaEle);
         resolve()
-
         // navigator.clipboard.writeText(text).then(() => {
         //     resolve()
         // }).catch((err) => {
diff --git a/src/views/apartmentDetail.vue b/src/views/apartmentDetail.vue
index 8d44de1..26ebbb5 100644
--- a/src/views/apartmentDetail.vue
+++ b/src/views/apartmentDetail.vue
@@ -23,7 +23,7 @@
             </div>
             <div class="header-content flexflex">
                 <div class="header-left">
-                    <image-watch style="z-index: 1003;" arrow="never" :index="5" :show="imageShow"
+                    <image-watch style="z-index: 1003;" arrow="never" :index="imageIndex" :show="imageShow"
                         :close="cloaseImageShow" :list="imageList"></image-watch>
                     <div class="slideshow">
                         <el-carousel :autoplay="false" arrow="never" indicator-position="none" ref="remarkCaruselUp"
@@ -263,32 +263,8 @@
                 </div>
             </div>
             <div class="details-right flexacenter">
-                <phoneqrcode :type="apartment" :qrcode="qrcode"></phoneqrcode>
+                <phoneqrcode type="apartment" :qrcode="qrcode"></phoneqrcode>
                 <groupqrcode></groupqrcode>
-                <!-- <div class="QRcode-box apartment-QRcode flexflex" v-if="true">
-                    <img class="mini-program-title" src="@/assets/img/apartmentDetail/mini-program-title.png">
-                    <div class="QRcode-case flexcenter">
-                        <img class="QRcode-img" :src="qrcode" alt="">
-                    </div>
-
-                    <div class="apartment-QRcode-hint flexacenter">
-                        <img class="scan-icon" src="@/assets/img/apartmentDetail/scan-icon.png">
-                        手机查看该公寓
-                    </div>
-                </div> -->
-                <!-- <div class="QRcode-box group-QRcode flexflex" v-if="true">
-                    <img class="group-title" src="@/assets/img/apartmentDetail/group-title.png">
-                    <div class="QRcode-case flexcenter">
-                        <img class="QRcode-img" :src="wechat['wechatqrcode']" alt="">
-                    </div>
-
-                    <div class="group-QRcode-hint flexacenter">
-                        <img class="scan-icon" src="@/assets/img/apartmentDetail/scan-icon.png">
-                        入群请添加
-                        <b>方同学的小助手</b>
-                        <b>{{ wechat['nickname'] }}</b>
-                    </div>
-                </div> -->
                 <!-- 同品牌公寓 -->
                 <div class="same-brand-title flexcenter" v-if="dualBrandList.length != 0" ref="eleseEle">
                     <img class="same-brand-icon" src="@/assets/img/apartmentDetail/same-brand.png">
@@ -423,8 +399,6 @@ import { copyToClipboard } from '@/utils/util.js'
 const { proxy } = getCurrentInstance()
 const store = useStore();
 
-const { wechat } = toRefs(store.state);
-
 let imageShow = ref(false)  // 查看大图弹窗的状态
 let imageList = ref([])  // 查看大图弹窗的状态
 let imageIndex = ref(0)  // 查看大图弹窗的状态
@@ -936,8 +910,6 @@ const publicJump = path => router.push(path)
                                 transform: translate(-50%, -50%);
                             }
 
-                            // overflow: hidden;
-
                             .img {
                                 height: 100%;
                                 border-radius: 6px;
diff --git a/src/views/detail.vue b/src/views/detail.vue
index 1b4c177..bab2924 100644
--- a/src/views/detail.vue
+++ b/src/views/detail.vue
@@ -126,7 +126,9 @@
                                     {{ !housingInfo['data'] || housingInfo['data'] &&
                                         housingInfo['data'].info && housingInfo['data'].info.rentalduration
                                         === '0' ?
-                                        '不限' : `${ indexData['data']&&indexData['data']['config']&&indexData['data']['config']['rentalduration'][housingInfo['data'] && housingInfo['data'].info.rentalduration]}` }}
+                                        '不限' : `${indexData['data'] && indexData['data']['config'] &&
+                                        indexData['data']['config']['rentalduration'][housingInfo['data']
+                                        && housingInfo['data'].info.rentalduration]}` }}
                                 </div>
                             </div>
                             <div class="condition">
@@ -162,8 +164,7 @@
                                         || 0 }}
                                 </div>
                             </div>
-                            <div class="img-list-box dis-f jus-x al-item" @click="imageShow = true"
-                                v-show="imgList.length > 0">
+                            <div class="img-list-box dis-f jus-x al-item" v-show="imgList.length > 0"> plm{{ imageIndex }}plm
                                 <img src="../assets/img/detail/moreNot.svg" class="icon left-icon" alt=""
                                     @click.stop="moveImageList('left')"
                                     v-show="imgListTab === 0 && imageLIst[imageLIst.length - 1] > 800">
@@ -177,7 +178,7 @@
                                     style="transform: rotate(180deg);" @click.stop="moveImageList('right')"
                                     v-show="imgList.length - 1 === imgListTab && imageLIst[imageLIst.length - 1] > 800">
                                 <div class="dis-f al-item list-box s-w-100" ref="imageList" v-if="imgList.length > 0">
-                                    <div v-for="(item, i) in imgList" :key="i">
+                                    <div v-for="(item, i) in imgList" :key="i" @click.stop="imageIndex = i, imageShow = true">
                                         <div class="video" v-if="item && !item.thumbnail">
                                             <div class="icon-box dis-f jus-x al-item">
                                                 <img src="../assets/img/detail/videoStop.svg" class="icon" alt="">
@@ -202,7 +203,8 @@
                             </div>
                             <!--  -->
                             <div class="need-housing-info" v-if="pageType == 3">
-                                <div class="info dis-f al-item" v-if="housingInfo['data'] && housingInfo['data'].info.property">
+                                <div class="info dis-f al-item"
+                                    v-if="housingInfo['data'] && housingInfo['data'].info.property">
                                     <div class="title-box">
                                         房屋类型
                                     </div>
@@ -219,7 +221,8 @@
                                         </span>
                                     </div>
                                 </div>
-                                <div class="info dis-f al-item" v-if="housingInfo['data'] && housingInfo['data'].info.floor">
+                                <div class="info dis-f al-item"
+                                    v-if="housingInfo['data'] && housingInfo['data'].info.floor">
                                     <div class="title-box">
                                         所在楼层
                                     </div>
@@ -235,7 +238,8 @@
                                         <!-- {{ housingInfo['data'] && housingInfo['data'].info.floor }} -->
                                     </div>
                                 </div>
-                                <div class="info dis-f al-item" v-if="housingInfo['data'] &&housingInfo['data'].info.elevator">
+                                <div class="info dis-f al-item"
+                                    v-if="housingInfo['data'] && housingInfo['data'].info.elevator">
                                     <div class="title-box">
                                         电梯
                                     </div>
@@ -248,7 +252,8 @@
                                         }}
                                     </div>
                                 </div>
-                                <div class="info dis-f al-item" v-if="housingInfo['data'] &&housingInfo['data'].info.sunshinearea">
+                                <div class="info dis-f al-item"
+                                    v-if="housingInfo['data'] && housingInfo['data'].info.sunshinearea">
                                     <div class="title-box">
                                         晾晒区
                                     </div>
@@ -264,7 +269,8 @@
                                         }}
                                     </div>
                                 </div>
-                                <div class="info dis-f al-item" v-if="housingInfo['data'] && housingInfo['data'].info.acreage[0]">
+                                <div class="info dis-f al-item"
+                                    v-if="housingInfo['data'] && housingInfo['data'].info.acreage[0]">
                                     <div class="title-box">
                                         面积
                                     </div>
@@ -286,7 +292,8 @@
                                         平方呎
                                     </div>
                                 </div>
-                                <div class="info dis-f al-item" v-if="housingInfo['data'] &&housingInfo['data'].info.publishergender">
+                                <div class="info dis-f al-item"
+                                    v-if="housingInfo['data'] && housingInfo['data'].info.publishergender">
                                     <div class="title-box">
                                         同住人性别要求
                                     </div>
@@ -295,11 +302,12 @@
                                             indexData['data'] &&
                                             indexData['data']['config'] &&
                                             indexData['data']['config']['gender'][housingInfo['data'] &&
-                                            housingInfo['data'].info.publishergender]
+                                                housingInfo['data'].info.publishergender]
                                         }}
                                     </div>
                                 </div>
-                                <div class="info dis-f al-item" v-if="housingInfo['data'] && housingInfo['data'].info.gender">
+                                <div class="info dis-f al-item"
+                                    v-if="housingInfo['data'] && housingInfo['data'].info.gender">
                                     <div class="title-box">
                                         发布者性别
                                     </div>
@@ -317,7 +325,8 @@
                             </div>
                             <!--  -->
                             <div class="info-box-s" v-if="pageType != 3">
-                                <div class="info dis-f al-item" v-if="housingInfo['data'] &&housingInfo['data'].info.property">
+                                <div class="info dis-f al-item"
+                                    v-if="housingInfo['data'] && housingInfo['data'].info.property">
                                     <div class="title-box">
                                         房屋类型
                                     </div>
@@ -326,11 +335,12 @@
                                             indexData['data'] &&
                                             indexData['data']['config'] &&
                                             indexData['data']['config']['property'][housingInfo['data'] &&
-                                            housingInfo['data'].info.property]
+                                                housingInfo['data'].info.property]
                                         }}
                                     </span>
                                 </div>
-                                <div class="info dis-f al-item" v-if="housingInfo['data'] &&housingInfo['data'].info.elevator">
+                                <div class="info dis-f al-item"
+                                    v-if="housingInfo['data'] && housingInfo['data'].info.elevator">
                                     <div class="title-box">
                                         所在楼层
                                     </div>
@@ -345,11 +355,12 @@
                                             indexData['data'] &&
                                             indexData['data']['config'] &&
                                             indexData['data']['config']['elevator'][housingInfo['data'] &&
-                                            housingInfo['data'].info.elevator]
+                                                housingInfo['data'].info.elevator]
                                         }}
                                     </span>
                                 </div>
-                                <div class="info dis-f al-item" v-if="housingInfo['data'] &&housingInfo['data'].info.sunshinearea">
+                                <div class="info dis-f al-item"
+                                    v-if="housingInfo['data'] && housingInfo['data'].info.sunshinearea">
                                     <div class="title-box">
                                         晾晒区
                                     </div>
@@ -365,7 +376,8 @@
                                         }}
                                     </span>
                                 </div>
-                                <div class="info dis-f al-item" style="margin-top:30px;" v-if="housingInfo['data'] && housingInfo['data'].info.acreage">
+                                <div class="info dis-f al-item" style="margin-top:30px;"
+                                    v-if="housingInfo['data'] && housingInfo['data'].info.acreage">
                                     <div class="title-box">
                                         面积
                                     </div>
@@ -376,7 +388,8 @@
                                         }} 平方呎
                                     </span>
                                 </div>
-                                <div class="info dis-f al-item" style="margin-top:30px;" v-if="housingInfo['data'] &&housingInfo['data'].info.gender">
+                                <div class="info dis-f al-item" style="margin-top:30px;"
+                                    v-if="housingInfo['data'] && housingInfo['data'].info.gender">
                                     <div class="title-box">
                                         性别要求
                                     </div>
@@ -441,7 +454,7 @@
                                 </div>
                             </div>
                         </div>
-                        <div class="dis-f jus-x" v-if="distanceList[0]&&distanceList[0].name && pageType != 3">
+                        <div class="dis-f jus-x" v-if="distanceList[0] && distanceList[0].name && pageType != 3">
                             <div class="distance-box dis-f jus-bet">
                                 <div class="distance-info-box pos-r" :class="{ 'show-distance-info-box': showDistance }"
                                     :style="{ 'height': showDistance ? `${70 + 42 + 82 * distanceList.length - 1}px` : '0px' }">
@@ -595,7 +608,8 @@
                                 v-if="pageType == 2 && housingInfo['data'] && housingInfo['data'].isintermediary == 1">
                                 <img src="../assets/homeImage/intermediaryTabImg.png" class="intermediary-logo" alt="">
                             </div>
-                            <div class="dis-f jus-x" v-if="pageType == 1||(pageType == 2 && housingInfo['data'] && housingInfo['data'].isintermediary != 1)">
+                            <div class="dis-f jus-x"
+                                v-if="pageType == 1 || (pageType == 2 && housingInfo['data'] && housingInfo['data'].isintermediary != 1)">
                                 <div class="user-type">
                                     {{
                                         indexData['data'] &&
@@ -675,7 +689,7 @@
                         </div>
                         <el-affix position="top" :offset="0" @change="changeConcatType">
                         </el-affix>
-                        <phoneqrcode class="mg-t-20" :type="housing"
+                        <phoneqrcode class="mg-t-20" type="housing"
                             :qrcode="housingInfo['data'] && housingInfo['data'].qrcode">
                         </phoneqrcode>
                         <groupqrcode></groupqrcode>
@@ -963,7 +977,7 @@
         </div>
 
     </div>
-    <watchImage :show="imageShow" :close="cloaseImageShow" :list="imgList"></watchImage>
+    <watchImage :show="imageShow" :index="imageIndex" :close="cloaseImageShow" :list="imgList"></watchImage>
     <!-- 右下角咨询 -->
     <circle-btn></circle-btn>
     <back-to-top></back-to-top>
@@ -1003,6 +1017,7 @@ let uniqid = ref('')
 let showBusinessCard = ref(false)
 //查看图片
 let imageShow = ref(false)
+let imageIndex = ref(0)
 let cloaseImageShow = () => {
     imageShow.value = false
 }
@@ -1146,11 +1161,11 @@ let setNavigation = () => {
     if (pageType.value == 1 || pageType.value == 2) {
         // location=3.8,3.13&areaItem=3
         // console.log(`${store.state.routeList['secondaryIndex'].path}/location/${JSON.stringify([housingInfo['data']['info'].location.substring(0, 1)])}`)
-        store.state.routeList['secondaryIndex']={
-            path:housingInfo['data']['info'].intermediary===1?'/intermediaryHousing':
-                 housingInfo['data']['info'].intermediary===6?'/needHousing':'/personHousing',
-            title:housingInfo['data']['info'].intermediary===1?'中介房源':
-                 housingInfo['data']['info'].intermediary===6?'求房源':'个人房源'
+        store.state.routeList['secondaryIndex'] = {
+            path: housingInfo['data']['info'].intermediary === 1 ? '/intermediaryHousing' :
+                housingInfo['data']['info'].intermediary === 6 ? '/needHousing' : '/personHousing',
+            title: housingInfo['data']['info'].intermediary === 1 ? '中介房源' :
+                housingInfo['data']['info'].intermediary === 6 ? '求房源' : '个人房源'
         }
         store.state.routeList['thirdIndex'] = {
             path: `${store.state.routeList['secondaryIndex'].path}`,
@@ -1172,7 +1187,7 @@ let setNavigation = () => {
 
                 title: `${location[housingInfo['data']['info'].location]}${type[housingInfo['data']['info'].type]}`
             }
-    }else{
+    } else {
         store.state.routeList['thirdIndex'] = ''
         store.state.routeList['fourthIndex'] = ''
     }
@@ -1200,8 +1215,8 @@ let getHousingInfo = () => {
             })
             concatInfo['data'] = store.state.indexData.wechat
             if (res.data.contacts) contacts['data'] = res.data.contacts
-            console.log('pageType',pageType.value)
-            if ( pageType.value ==2) {
+            console.log('pageType', pageType.value)
+            if (pageType.value == 2) {
                 getPublisherList()
             } else if (pageType.value == 1) {
                 recommendList()
@@ -1310,7 +1325,7 @@ let recommendList = () => {
     }).then(res => {
         console.log(res)
         if (res.code === 200) {
-            if (res.data.data&&res.data.data.length >= 30) {
+            if (res.data.data && res.data.data.length >= 30) {
                 loadMore.value = true
             } else {
                 loadMore.value = false
diff --git a/src/views/user.vue b/src/views/user.vue
index ac6d9dc..5456ff0 100644
--- a/src/views/user.vue
+++ b/src/views/user.vue
@@ -557,11 +557,11 @@ onUnmounted(() => {
 }
 
 .btn-qrcode {
-    height: 365px;
+    width: 360px;
     margin: 0 auto;
 
     .bj {
-        height: 100%;
+        width: 100%;
         box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.2784313725490196);
         border-radius: 10px;
     }