From 8c0a28e0767475aa54ca23bae19619f78a9f2dbd Mon Sep 17 00:00:00 2001
From: jiannibang <271381693@qq.com>
Date: Wed, 8 Feb 2023 18:00:58 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E7=83=AD=E6=90=9C=E6=94=AF=E6=8C=81?=
 =?UTF-8?q?=E6=BB=9A=E5=8A=A8?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../PublicComponent/PublicComponent.vue           | 15 ++++++++++-----
 1 file changed, 10 insertions(+), 5 deletions(-)

diff --git a/src/components/PublicComponent/PublicComponent.vue b/src/components/PublicComponent/PublicComponent.vue
index f40216d..6b91b87 100644
--- a/src/components/PublicComponent/PublicComponent.vue
+++ b/src/components/PublicComponent/PublicComponent.vue
@@ -15,11 +15,13 @@
 
   <div class="hot-search">
     <h1 class="title">{{ $t('hotSearch') }}</h1>
-    <div class="row">
-      <div class="item" v-for="item of hotRecommend" :key="item.shopId" @click="handleHot(item)">
-        <div class="text">{{ item.shopName }}</div>
+    <ScrollView class="row" :list="hotRecommend" scroll-x>
+      <div style="display: inline-block; white-space: nowrap">
+        <div class="item" v-for="item of hotRecommend" :key="item.shopId" @click="handleHot(item)">
+          <div class="text">{{ item.shopName }}</div>
+        </div>
       </div>
-    </div>
+    </ScrollView>
   </div>
 
   <div class="bottom">
@@ -40,6 +42,7 @@ import { useHandleScreen } from '@/composables/useHandleScreen'
 import { useLogout } from '@/composables/useLogout'
 import { useInitMap } from '@/composables/useInitMap'
 import Map from '@/components/Map/Map.vue'
+import ScrollView from '@/base/ScrollView/ScrollView.vue'
 const Logout = defineAsyncComponent(() => import('@/base/Logout/Logout.vue'))
 const AutoBackNotification = defineAsyncComponent(() => import('@/base/AutoBackNotification/AutoBackNotification.vue'))
 const Temperature = defineAsyncComponent(() => import('@/base/Temperature/Temperature.vue'))
@@ -120,10 +123,12 @@ watch(route, to => {
   }
   .row {
     margin-top: 16px;
+    width: calc(100vw - 68px);
+    overflow: hidden;
+    white-space: nowrap;
     .item {
       position: relative;
       display: inline-block;
-      max-width: 176px;
       height: 52px;
 
       background: rgba(255, 255, 255, 0.8);