From 8d3059f5f08306d5b625c732d12a3c5df7d39546 Mon Sep 17 00:00:00 2001
From: zhangyao <zhangyao@1000mu.com>
Date: Fri, 21 Jul 2023 16:40:34 +0800
Subject: [PATCH] =?UTF-8?q?fix:=20=E4=BF=AE=E6=94=B9=E5=93=81=E7=89=8C?=
 =?UTF-8?q?=E9=A1=B5=E9=9D=A2?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../SearchKeyboard/SearchKeyboard.vue         |  4 +-
 src/views/Brand/shopList.vue                  | 90 ++++++++++---------
 src/views/Search/Search.vue                   |  2 +-
 3 files changed, 50 insertions(+), 46 deletions(-)

diff --git a/src/components/SearchKeyboard/SearchKeyboard.vue b/src/components/SearchKeyboard/SearchKeyboard.vue
index 1b5d0fa..8d909fc 100644
--- a/src/components/SearchKeyboard/SearchKeyboard.vue
+++ b/src/components/SearchKeyboard/SearchKeyboard.vue
@@ -215,7 +215,7 @@ watch(mode, newVal => {
       handWritingRef.value.setCanvasSize()
       handWritingRef.value.updateBound()
       handWritingRef.value.reload()
-    }, 200)
+    }, 500)
   }
 })
 
@@ -241,6 +241,8 @@ watch(wordsList, () => {
   // padding: 48px 64px;
   background: rgb(255 255 255 / 0%);
   border-radius: 0;
+
+  --animate-duration: 200ms;
   .btn-group {
     position: absolute;
     top: 0;
diff --git a/src/views/Brand/shopList.vue b/src/views/Brand/shopList.vue
index a021b59..f1ee26e 100644
--- a/src/views/Brand/shopList.vue
+++ b/src/views/Brand/shopList.vue
@@ -12,16 +12,8 @@
       @click="handleSwitch"
     />
     <!-- 店铺 -->
-    <!-- <scroll-view
-      class="shop-scroll"
-      :style="{
-        top: recList.length === 0 ? '360px' : ''
-      }"
-      :list="selectedShopList"
-      ref="shopScroll"
-    > -->
-
-    <swiper
+    <scroll-view ref="shopScroll" class="shop-scroll" :refresh-delay="200" :pull-up="true" :list="pageList" @scroll-end="myScrollEnd">
+      <!-- <swiper
       ref="myScroll"
       class="shop-scroll animate__animated animate__fadeInUp"
       :speed="300"
@@ -38,30 +30,35 @@
       :modules="modulesShop"
       @after-init="getSwiper"
       @reach-end="myScrollEnd"
-    >
-      <!--
-      @observer-update="updateSwiper" -->
-      <swiper-slide v-for="(items, index) in pageList" :key="index" :data-floor-name="items.name">
-        <ul class="shop-items">
-          <div v-show="items.shopList && items.shopList.length" ref="shopDiv" class="shop-div" :data-floorname="items.name">
-            <div class="shop-floor">
-              {{ items.name }}
-              <div class="top-right-txt" :style="{ width: items.name !== device.floor ? '0px' : '' }">
-                <img v-if="items.name === device.floor" src="../../assets/images/brand/pos.svg" class="pos-icon" alt="" />
-                <span v-if="items.name === device.floor">{{ $t('brand.pos') }}</span>
-              </div>
-            </div>
-            <!--  :style="{ 'grid-template-columns': isH && recList.length === 0 ? 'repeat(5, 240px)' : null }" -->
-            <div class="shop-wrapper">
-              <shopItem v-for="(item, idx) of items.shopList" :key="idx" class="item" :shop="item" @click="handleShop(item)" />
+    >      
+      <swiper-slide v-for="(items, index) in pageList" :key="index" :data-floor-name="items.name"> -->
+
+      <ul class="shop-items">
+        <div
+          v-for="(items, index) in pageList"
+          v-show="items.shopList && items.shopList.length"
+          :key="index"
+          ref="shopDiv"
+          class="shop-div"
+          :data-floorname="items.name"
+        >
+          <div class="shop-floor">
+            {{ items.name }}
+            <div class="top-right-txt" :style="{ width: items.name !== device.floor ? '0px' : '' }">
+              <img v-if="items.name === device.floor" src="../../assets/images/brand/pos.svg" class="pos-icon" alt="" />
+              <span v-if="items.name === device.floor">{{ $t('brand.pos') }}</span>
             </div>
           </div>
-        </ul>
-      </swiper-slide>
+          <!--  :style="{ 'grid-template-columns': isH && recList.length === 0 ? 'repeat(5, 240px)' : null }" -->
+          <div class="shop-wrapper">
+            <shopItem v-for="(item, idx) of items.shopList" :key="idx" class="item" :shop="item" @click="handleShop(item)" />
+          </div>
+        </div>
+      </ul>
+      <!-- </swiper-slide>
       <div class="swiper-scrollbar"></div>
-    </swiper>
-
-    <!-- </scroll-view> -->
+    </swiper> -->
+    </scroll-view>
 
     <!-- 楼层和业态 -->
     <div class="right-control-area animate__animated animate__fadeInRight">
@@ -114,12 +111,14 @@
 </template>
 <script setup lang="ts">
 import { ref, computed, nextTick, shallowRef, onMounted } from 'vue'
-import { FreeMode } from 'swiper'
-import { Swiper, SwiperSlide } from 'swiper/vue'
-import 'swiper/css'
-import 'swiper/css/pagination'
-import 'swiper/css/free-mode'
-// import ScrollView from '@/base/ScrollView/ScrollView.vue'
+// import { FreeMode } from 'swiper'
+// import { Swiper, SwiperSlide } from 'swiper/vue'
+// import 'swiper/css'
+// import 'swiper/css/pagination'
+// import 'swiper/css/free-mode'
+// const modulesShop = [FreeMode]
+
+import ScrollView from '@/base/ScrollView/ScrollView.vue'
 // import CollapseVue from '@/base/Collapse/Collapse.vue'
 
 import { getBrandInfo } from '@/http/api/brand/index'
@@ -141,10 +140,9 @@ const store = useRootStore()
 const { device, currentBuildingFloorsList, shopListGroupByFloor, shopListGroupByIndustry } = storeToRefs(store)
 
 const { switchLanguage } = useSwitchLanguage()
-// const shopScroll = computed(() => document.querySelector('.shop-scroll>.swiper-wrapper'))
-const swiperRef = shallowRef()
 
-const modulesShop = [FreeMode]
+const shopScroll = ref()
+const swiperRef = shallowRef()
 
 const toggleFormatAndFloors = ref<0 | 1 | 2>(0)
 
@@ -231,15 +229,18 @@ selfListByIndustry.value = [...shopListGroupByIndustry.value]
 onMounted(() => {
   selectedShopList.value = selfListByIndustry.value
 })
-function getSwiper(obj: any) {
-  swiperRef.value = obj
-  swiperRef.value.update()
-}
+// function getSwiper(obj: any) {
+//   swiperRef.value = obj
+//   swiperRef.value.update()
+// }
 
 function updateSwiper(time = 300, isToCurentFloor = false) {
   nextTick(() => {
     const timeId = setTimeout(() => {
       clearTimeout(timeId)
+      if (shopScroll.value) {
+        shopScroll.value.scrollTo(0, 0)
+      }
       // showList.value = true
       if (swiperRef.value) {
         // console.dir('swiperRef.value :>> ', swiperRef)
@@ -475,6 +476,7 @@ function myScrollEnd() {
     }
   }
   .shop-scroll {
+    overflow: hidden;
     width: 1388px;
     height: 770px;
     padding-bottom: 30px;
diff --git a/src/views/Search/Search.vue b/src/views/Search/Search.vue
index d337cfc..d27ad48 100644
--- a/src/views/Search/Search.vue
+++ b/src/views/Search/Search.vue
@@ -142,7 +142,7 @@ const { handleFacility } = useFacilityNav()
 
 const store = useRootStore()
 const hotSearchList = ref([])
-const { shopList, facilityList, language } = storeToRefs(store)
+const { shopList, facilityList, language, shop } = storeToRefs(store)
 // const route = useRoute()
 const INPUT_MAX_LEN = computed(() => (mode.value === 'hand' ? 5 : 7))
 const input = ref('')