fix: 修改问题

public/static/offline/JSON/getArtWorkList.json

@@ -1 +1 @@
-{"code":200,"msg":"操作成功","data":[{"id":198,"title":"猩猩的太空漫步","content":{"name":"猩猩的太空漫步","nameEn":"dddd","file_code":["/iotFile/project-ey_fpaur6s6fkgvszywana/20230713/vwcYXFrhK1CbEB6uFy76R.png"],"point":"0_0_4","content":"vnasfkvl","contentEn":"fwefwqe","icon":["/iotFile/project-ey_fpaur6s6fkgvszywana/20230713/DEB6NDQ8975GvfR5yKclw.png"],"icon_sel":[]}},{"id":199,"title":"共生","content":{"name":"共生","nameEn":"dddd","file_code":["/iotFile/project-ey_fpaur6s6fkgvszywana/20230713/CkR9FMDrKtej6Rt0GDAUR.png"],"point":"0_0_129","content":"1235","contentEn":"fwerf","icon":["/iotFile/project-ey_fpaur6s6fkgvszywana/20230713/RyWHWQugQvDwEjEY_MwHb.png"],"icon_sel":[]}},{"id":200,"title":"超新星","content":{"name":"超新星","nameEn":"dddd","file_code":["/iotFile/project-ey_fpaur6s6fkgvszywana/20230713/6DH-CKwe8pzVt4qmP-Knm.png"],"point":"0_0_129","content":"1326","contentEn":"56456","icon":["/iotFile/project-ey_fpaur6s6fkgvszywana/20230713/ea-Q5M6K-ri1xw3UfY18_.png"],"icon_sel":[]}},{"id":201,"title":"盛开的山谷","content":{"name":"盛开的山谷","nameEn":"dadd","file_code":["/iotFile/project-ey_fpaur6s6fkgvszywana/20230713/fH0IKTz9Nhg7nnVhtJg_o.png"],"point":"0_0_84","content":"i7u","contentEn":"hhrt","icon":["/iotFile/project-ey_fpaur6s6fkgvszywana/20230713/j49AhcyUGy3ooRveXNTAt.png"],"icon_sel":[]}},{"id":202,"title":"琥珀","content":{"name":"琥珀","nameEn":"t534","file_code":["/iotFile/project-ey_fpaur6s6fkgvszywana/20230713/rQjWB5AzY05NM7YSmWgtT.png"],"point":"0_0_84","content":"213","contentEn":"545","icon":["/iotFile/project-ey_fpaur6s6fkgvszywana/20230713/GeJT_PoeLfW6e2SgxCGmQ.png"],"icon_sel":[]}}]}
+{"code":200,"msg":"操作成功","data":[{"id":198,"title":"猩猩的太空漫步","content":{"name":"猩猩的太空漫步","nameEn":"dddd","file_code":["/iotFile/project-ey_fpaur6s6fkgvszywana/20230713/vwcYXFrhK1CbEB6uFy76R.png"],"point":"0_0_4","content":"vnasfkvl","contentEn":"fwefwqe","icon":["/iotFile/project-ey_fpaur6s6fkgvszywana/20230713/DEB6NDQ8975GvfR5yKclw.png"],"icon_sel":[]}},{"id":199,"title":"共生","content":{"name":"共生","nameEn":"dddd","file_code":["/iotFile/project-ey_fpaur6s6fkgvszywana/20230713/CkR9FMDrKtej6Rt0GDAUR.png"],"point":"0_0_129","content":"1235","contentEn":"fwerf","icon":["/iotFile/project-ey_fpaur6s6fkgvszywana/20230713/RyWHWQugQvDwEjEY_MwHb.png"],"icon_sel":[]}},{"id":200,"title":"超新星","content":{"name":"超新星","nameEn":"dddd","file_code":["/iotFile/project-ey_fpaur6s6fkgvszywana/20230713/6DH-CKwe8pzVt4qmP-Knm.png"],"point":"0_0_129","content":"1326","contentEn":"56456","icon":["/iotFile/project-ey_fpaur6s6fkgvszywana/20230713/ea-Q5M6K-ri1xw3UfY18_.png"],"icon_sel":[]}},{"id":201,"title":"盛开的山谷","content":{"name":"盛开的山谷","nameEn":"dadd","file_code":["/iotFile/project-ey_fpaur6s6fkgvszywana/20230713/fH0IKTz9Nhg7nnVhtJg_o.png"],"point":"0_0_84","content":"i7u","contentEn":"hhrt","icon":["/iotFile/project-ey_fpaur6s6fkgvszywana/20230713/j49AhcyUGy3ooRveXNTAt.png"],"icon_sel":[]}},{"id":202,"title":"琥珀","content":{"name":"琥珀","nameEn":"t534","file_code":["/iotFile/project-ey_fpaur6s6fkgvszywana/20230713/rQjWB5AzY05NM7YSmWgtT.png"],"point":"0_0_84","content":"213","contentEn":"545","icon":["/iotFile/project-ey_fpaur6s6fkgvszywana/20230713/GeJT_PoeLfW6e2SgxCGmQ.png"],"icon_sel":[]}}]}

public/static/offline/JSON/getColumnBtn.json

@@ -1 +1 @@
-{"code":200,"msg":"操作成功","data":[{"id":127,"title":"餐饮推荐","content":{"isOpen":"开启","logo_code":["/iotFile/project-ey_fpaur6s6fkgvszywana/20230714/436WqGHBEswCHsCHwiZfx.png"],"name":"餐饮推荐","nameEn":"da","type":"好吃的"}}]}
+{"code":200,"msg":"操作成功","data":[{"id":127,"title":"餐饮推荐","content":{"isOpen":"开启","logo_code":["/iotFile/project-ey_fpaur6s6fkgvszywana/20230714/436WqGHBEswCHsCHwiZfx.png"],"name":"餐饮推荐","nameEn":"da","type":"好吃的"}}]}

public/static/offline/JSON/getColumnList.json

@@ -1 +1 @@
-{"code":200,"msg":"操作成功","data":[{"id":128,"title":"泽德","content":{"name":"特别好的","nameEn":"24213","logo_code":["/iotFile/project-ey_fpaur6s6fkgvszywana/20230714/Leu6cOw3HFoKh2n0N8bZN.png"],"point":"0_0_204","shopCode":"-HpSoOn7q0eo70ofL6INz"}},{"id":131,"title":"VS","content":{"name":"cn下周才","nameEn":"dqwd","logo_code":["/iotFile/project-ey_fpaur6s6fkgvszywana/20230714/pNuWHRUCK3dU9RpvVK7jE.png"],"point":"0_3_197","shopCode":"v23xZfy3M_kbvOC0awPLI"}},{"id":208,"title":"234","content":{"name":"3423","nameEn":"34234","logo_code":["/iotFile/project-ey_fpaur6s6fkgvszywana/20230714/sxl60Vl_Jsepsjyo50fYu.png"],"point":"","shopCode":""}}]}
+{"code":200,"msg":"操作成功","data":[{"id":128,"title":"泽德","content":{"name":"特别好的","nameEn":"24213","logo_code":["/iotFile/project-ey_fpaur6s6fkgvszywana/20230714/Leu6cOw3HFoKh2n0N8bZN.png"],"point":"0_0_204","shopCode":"-HpSoOn7q0eo70ofL6INz"}},{"id":131,"title":"VS","content":{"name":"cn下周才","nameEn":"dqwd","logo_code":["/iotFile/project-ey_fpaur6s6fkgvszywana/20230714/pNuWHRUCK3dU9RpvVK7jE.png"],"point":"0_3_197","shopCode":"v23xZfy3M_kbvOC0awPLI"}},{"id":208,"title":"234","content":{"name":"3423","nameEn":"34234","logo_code":["/iotFile/project-ey_fpaur6s6fkgvszywana/20230714/sxl60Vl_Jsepsjyo50fYu.png"],"point":"","shopCode":""}}]}

public/static/offline/JSON/getParkInfo.json

@@ -1 +1 @@
-{"code":200,"msg":"操作成功","data":[{"id":209,"title":"停车场介绍","content":{"name":"停车场介绍","nameEn":"dad","content":"停车场介绍","contentEn":"23123","file_code":["/iotFile/project-ey_fpaur6s6fkgvszywana/20230714/eWCChtDj-Fe-LXwCc3WZJ.png"]}}]}
+{"code":200,"msg":"操作成功","data":[{"id":209,"title":"停车场介绍","content":{"name":"停车场介绍","nameEn":"dad","content":"停车场介绍","contentEn":"23123","file_code":["/iotFile/project-ey_fpaur6s6fkgvszywana/20230714/eWCChtDj-Fe-LXwCc3WZJ.png"]}}]}

src/assets/images/art/poi.svg

@@ -0,0 +1,3 @@
+<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M8 13.9339L11.3 10.6339C11.9526 9.98127 12.397 9.14975 12.577 8.24452C12.7571 7.33928 12.6646 6.401 12.3114 5.5483C11.9582 4.69561 11.36 3.9668 10.5926 3.45404C9.82519 2.94129 8.92296 2.6676 8 2.6676C7.07704 2.6676 6.17481 2.94129 5.40739 3.45404C4.63997 3.9668 4.04183 4.69561 3.68861 5.5483C3.33539 6.401 3.24294 7.33928 3.42297 8.24452C3.603 9.14975 4.0474 9.98127 4.7 10.6339L8 13.9339ZM8 15.8193L3.75734 11.5766C2.91823 10.7375 2.34679 9.66838 2.11529 8.5045C1.88378 7.34061 2.0026 6.13422 2.45673 5.03787C2.91086 3.94151 3.6799 3.00445 4.66659 2.34516C5.65328 1.68588 6.81332 1.33398 8 1.33398C9.18669 1.33398 10.3467 1.68588 11.3334 2.34516C12.3201 3.00445 13.0891 3.94151 13.5433 5.03787C13.9974 6.13422 14.1162 7.34061 13.8847 8.5045C13.6532 9.66838 13.0818 10.7375 12.2427 11.5766L8 15.8193V15.8193ZM8 8.66727C8.35362 8.66727 8.69276 8.52679 8.94281 8.27674C9.19286 8.02669 9.33333 7.68755 9.33333 7.33393C9.33333 6.98031 9.19286 6.64117 8.94281 6.39112C8.69276 6.14108 8.35362 6.0006 8 6.0006C7.64638 6.0006 7.30724 6.14108 7.05719 6.39112C6.80714 6.64117 6.66667 6.98031 6.66667 7.33393C6.66667 7.68755 6.80714 8.02669 7.05719 8.27674C7.30724 8.52679 7.64638 8.66727 8 8.66727ZM8 10.0006C7.29276 10.0006 6.61448 9.71965 6.11438 9.21955C5.61429 8.71945 5.33334 8.04118 5.33334 7.33393C5.33334 6.62669 5.61429 5.94841 6.11438 5.44831C6.61448 4.94822 7.29276 4.66727 8 4.66727C8.70725 4.66727 9.38552 4.94822 9.88562 5.44831C10.3857 5.94841 10.6667 6.62669 10.6667 7.33393C10.6667 8.04118 10.3857 8.71945 9.88562 9.21955C9.38552 9.71965 8.70725 10.0006 8 10.0006Z" fill="#8E9090"/>
+</svg>

src/components/CarInfo/CarInfo.vue

@@ -7,25 +7,17 @@
         <img src="@/assets/images/shopDetail/go.svg" alt="" @click="go" />
       </div>
       <div class="car">
-        <div class="row">
-          <div class="car-group mr120" style="width: 330px">
-            <div class="tip">车牌号</div>
-            <div class="text">{{ carInfo.carCode }}浙B88888</div>
-          </div>
-          <div class="car-group">
-            <div class="tip">车位号</div>
-            <div class="text">{{ carInfo.spaceNo }}S-B1-001-102区</div>
-          </div>
+        <div class="car-group">
+          <div class="tip">车牌号</div>
+          <div class="text">{{ carInfo.carCode }}浙B88888</div>
         </div>
-        <div class="row" style="margin-top: 60px">
-          <div class="car-group mr120" style="width: 330px">
-            <div class="tip">停车时长</div>
-            <div class="text">{{ carInfo.parkingTime }}1小时30分钟</div>
-          </div>
-          <div class="car-group">
-            <div class="tip">停车费用</div>
-            <div class="text">{{ carInfo.spaceNo }}30元</div>
-          </div>
+        <div class="car-group">
+          <div class="tip">车位号</div>
+          <div class="text">{{ carInfo.spaceNo }}S-B1-001-102区</div>
+        </div>
+        <div class="car-group">
+          <div class="tip">停车时长</div>
+          <div class="text">{{ carInfo.parkingTime }}1小时30分钟</div>
         </div>
       </div>
       <div class="close-icon" @click="close">
@@ -140,14 +132,8 @@ function go() {
     position: absolute;
     bottom: 102px;
     left: 368px;
-    .row {
-      @include fl();
-    }
   }
   .car-group {
-    &.mr120 {
-      margin-right: 100px;
-    }
     .tip {
       padding-bottom: 16px;
       font-size: 20px;

src/components/CarSearch/CarSearch.vue

@@ -0,0 +1,163 @@
+<template>
+  <div class="car-search-wrapper">
+    <div class="masker" @click="close"></div>
+    <div class="close-icon" @click="close">
+      <img src="@/assets/images/shopDetail/close.svg" alt="" />
+    </div>
+    <div class="car-search-content">
+      <div class="title">{{ $t('searchCar') }}</div>
+      <div class="point">已为您搜索到以下车位号，选择车位号进行导航</div>
+      <ScrollView v-if="searchList.length" :list="searchList" class="myScroll" scrollbar>
+        <div class="list">
+          <div v-for="item in searchList" :key="item" class="item" @click="search(item)">{{ item }}</div>
+        </div>
+      </ScrollView>
+      <img v-else class="empty" src="@/assets/images/stay_tuned.svg" alt="" />
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { useRouter } from 'vue-router'
+import { useRootStore } from '@/store/root'
+import ScrollView from '@/base/ScrollView/ScrollView.vue'
+
+type Prop = {
+  searchList: string[]
+}
+defineProps<Prop>()
+const emits = defineEmits(['close'])
+function close() {
+  emits('close')
+}
+const store = useRootStore()
+const router = useRouter()
+function search(shopNum: string) {
+  const info = window.Map_QM.pathPark({ shopNum })
+  if (info?.node) {
+    const floor: any = store.buildingList[0].floorList.find(item => item.floorOrder === info.floor)?.floor
+    const shop = {
+      shopCode: '',
+      shopName: shopNum,
+      floorOrder: info.floor,
+      floor,
+      logoUrl: '/static/img/tcjf.png',
+      yaxis: info.node
+    }
+    store.SET_SHOP(shop)
+    router.push('/nav')
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+:deep(.bscroll-vertical-scrollbar) {
+  width: 6px;
+  height: 120px !important;
+  background: rgb(0 0 0 / 3%);
+  border-radius: 6px;
+  opacity: 1 !important;
+  .bscroll-indicator {
+    background: rgb(0 0 0 / 6%) !important;
+    border: none !important;
+    border-radius: 6px !important;
+  }
+}
+.car-search-wrapper {
+  position: fixed;
+  top: 0;
+  left: 0;
+  z-index: 1001;
+  width: 1920px;
+  height: 1080px;
+  background: rgb(142 144 145 / 50%);
+  backdrop-filter: blur(50px);
+
+  .masker {
+    position: fixed;
+    top: 0;
+    left: 0;
+    z-index: 2;
+    width: 1920px;
+    height: 1080px;
+  }
+  .car-search-content {
+    position: absolute;
+    top: 112px;
+    left: 528px;
+    z-index: 3;
+    width: 864px;
+    padding-top: 48px;
+    background: rgb(247 247 247);
+    border-radius: 16px;
+    .title {
+      width: 864px;
+      margin-bottom: 40px;
+      font-size: 28px;
+      font-family: 'font_bold';
+      text-align: center;
+      color: #534f46;
+      font-style: normal;
+      font-weight: 700;
+      line-height: 36px;
+    }
+    .point {
+      margin-bottom: 24px;
+      margin-left: 52px;
+      font-size: 16px;
+      font-family: 'font_regular';
+      color: #534f46;
+      font-style: normal;
+      font-weight: 400;
+      line-height: 24px;
+    }
+    .myScroll {
+      position: relative;
+      overflow: hidden;
+      width: 790px;
+      height: 684px;
+      margin-left: 52px;
+      .list {
+        width: 768px;
+        .item {
+          width: 768px;
+          height: 76px;
+          padding: 22px 40px;
+          margin-bottom: 8px;
+          font-size: 24px;
+          font-family: 'font_bold';
+          color: #534f46;
+          background: #fff;
+          border-radius: 16px;
+          font-style: normal;
+          font-weight: 700;
+          line-height: 32px;
+        }
+      }
+    }
+  }
+  .close-icon {
+    @include fl(center);
+
+    position: fixed;
+    top: 72px;
+    right: 496px;
+    z-index: 4;
+    width: 100px;
+    height: 100px;
+    background: rgb(255 255 255 / 60%);
+    border: 2px solid #fff;
+    border-radius: 50px;
+    backdrop-filter: blur(20px);
+    img {
+      width: 48px;
+      height: 48px;
+    }
+  }
+  .empty {
+    width: 768px;
+    height: 495px;
+    margin-left: 52px;
+  }
+}
+</style>

src/components/Header/Header.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="header-container">
-    <div class="left" @click="go">
-      <div class="search-container">
+    <div class="left">
+      <div class="search-container" @click="go">
         <img src="@/assets/images/header/search.svg" alt="" />
         <div class="line"></div>
         <div>
@@ -9,9 +9,9 @@
           <div class="text_en">SEARCH</div>
         </div>
       </div>
-      <div v-if="columnList.length && columnList[0].moduleType" class="recommend" @click="show">
+      <div v-if="columnList.length && columnList[0].title" class="recommend" @click="show">
         <img class="rem" src="@/assets/images/header/zan.svg" alt="" />
-        <div>{{ $t('header.recommend') }}</div>
+        <div>{{ switchLanguage(columnList[0].content, 'name') }}</div>
       </div>
     </div>
     <div class="right">
@@ -22,10 +22,11 @@
 </template>
 
 <script setup lang="ts">
+import { useSwitchLanguage } from '@/composables/useSwitchLanguage'
 import { useRootStore } from '@/store/root'
 import { toRefs } from 'vue'
 import WeaAndTime from './WeaAndTime.vue'
-
+const { switchLanguage } = useSwitchLanguage()
 const store = useRootStore()
 const { columnList } = toRefs(store)
 

src/components/Map/Map.vue

@@ -28,7 +28,7 @@
       <div class="triangle">
         <img src="@/assets/images/guide/triangle.svg" alt="" />
       </div>
-      <div class="circle">{{ shop.industryCode }}</div>
+      <div class="circle">{{ shop.shopCode }}</div>
     </div>
     <!-- 地图艺术装置弹框 -->
     <div id="artWorkInfo">
@@ -220,6 +220,9 @@ function handleDetail() {
   background: #8a766a;
   border-radius: 14px 14px 0 0;
   .name {
+    @include no-wrap;
+
+    width: 180px;
     margin-bottom: 4px;
     font-size: 14px;
     font-family: 'font_bold';
@@ -229,6 +232,9 @@ function handleDetail() {
     line-height: 22px;
   }
   .nameEn {
+    @include no-wrap;
+
+    width: 180px;
     font-size: 10px;
     font-family: 'font_bold';
     color: rgb(255 255 255 / 60%);
@@ -238,6 +244,8 @@ function handleDetail() {
   }
 }
 .middle {
+  @include fl();
+
   width: 200px;
   height: 32px;
   padding: 10px 16px;

src/components/PictureText/PictureText.vue

@@ -114,12 +114,15 @@ defineProps<Props>()
     }
     .qr-container {
       @include fl();
+
+      overflow: hidden;
+      width: 708px;
       .item {
         width: 80px;
         height: 102px;
         margin-right: 24px;
         text-align: center;
-        .img {
+        img {
           width: 80px;
           height: 80px;
           margin-bottom: 8px;

src/components/PlateInput/PlateInput.vue

@@ -4,8 +4,8 @@
       <div
         v-for="(item, index) of renderInputLength"
         :key="item"
-        :class="{ active: index === list.length && list.length <= 7 }"
-        :style="index === 1 ? 'margin-right: 82px' : ''"
+        :class="{ active: index === list.length && list.length <= 7, space: searchMethod === '车位' }"
+        :style="index === 1 && searchMethod === '车牌' ? 'margin-right: 82px' : ''"
         class="input"
         @click="handleEnergy"
       >
@@ -18,7 +18,7 @@
         </transition>
       </div>
     </div>
-    <div class="btn" @click="confirm">
+    <div class="btn" :class="{ dis: list.length < 3 && searchMethod === '车位' }" @click="confirm">
       <slot></slot>
       <span>{{ btnText }}</span>
     </div>
@@ -42,7 +42,7 @@ const props = withDefaults(defineProps<Props>(), {
 const PLATE_LENGTH = 8 //车牌长度
 
 const renderInputLength = computed(() => (props.searchMethod === '车牌' ? PLATE_LENGTH : props.spaceLength))
-const btnText = computed(() => (props.searchMethod === '车牌' ? '自主寻车' : '寻车导航'))
+const btnText = computed(() => (props.searchMethod === '车牌' ? '自主寻车' : '搜索'))
 
 const emits = defineEmits(['handle-energy', 'confirm'])
 const isEnergy = ref(false)
@@ -53,6 +53,9 @@ function handleEnergy() {
   })
 }
 function confirm() {
+  if (props.list.length < 3 && props.searchMethod === '车位') {
+    return
+  }
   emits('confirm')
 }
 
@@ -77,6 +80,8 @@ $btn-width: 197px;
 .plate-container {
   position: relative;
   display: flex;
+  justify-content: space-between;
+  width: 856px;
   margin-bottom: 40px;
   &::before {
     position: absolute;
@@ -92,6 +97,9 @@ $btn-width: 197px;
   }
   .input-wrapper {
     display: flex;
+    .space {
+      width: 128px;
+    }
   }
   .input {
     position: relative;
@@ -149,7 +157,6 @@ $btn-width: 197px;
     width: $btn-width;
     height: $height;
     padding: 0 58px;
-    margin-left: 38px;
     font-size: $btn-font-size;
     font-family: 'font_bold';
     color: $btn-color;
@@ -162,5 +169,8 @@ $btn-width: 197px;
       transition: all 0.3s;
     }
   }
+  .dis {
+    background: rgb(0 0 0 / 20%);
+  }
 }
 </style>

src/components/PublicComponent/PublicComponent.vue

@@ -9,8 +9,11 @@
   <Menu />
 
   <Search v-if="showSearch"></Search>
+
   <!-- 推荐弹窗 -->
-  <RecommendDialog v-if="showColumnList" />
+  <Transition enter-active-class="animate__animated animate__fadeIn" leave-active-class="animate__animated animate__fadeOut">
+    <RecommendDialog />
+  </Transition>
 
   <shopdetail v-if="showDetail"></shopdetail>
 
@@ -38,7 +41,7 @@ const RecommendDialog = defineAsyncComponent(() => import('@/components/Recommen
 const router = useRouter()
 const route = useRoute()
 const store = useRootStore()
-const { language, showSearch, showDetail, shopList, showColumnList } = storeToRefs(store)
+const { language, showSearch, showDetail, shopList } = storeToRefs(store)
 const { checkHandleScreen, showCountDownDialog, title, toIndexTime, toWallpaperTime, isWallpaper } = useHandleScreen(handleScreen)
 
 //指定时间返回首页时做的操作

src/components/Recommend/Recommend.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="recommend-container">
+  <div v-if="showColumnList" class="recommend-container">
     <div class="masker" @click="close"></div>
     <div class="close-icon" @click="close">
       <img src="@/assets/images/shopDetail/close.svg" alt="" />
@@ -7,21 +7,21 @@
 
     <div class="content">
       <div class="name-container">
-        <div class="name">餐饮推荐</div>
+        <div class="name">{{ columnList[0].content.name }}</div>
         <div class="line">/</div>
-        <div class="nameEn">DINING RECOMMENDATION</div>
+        <div class="nameEn">{{ columnList[0].content.nameEn }}</div>
       </div>
       <ScrollView v-if="list?.length" :pull-up="false" observe-image :list="list" class="shop-scroll" scrollbar>
         <div v-masonry transition-duration="0.5s" :gutter="24" class="item" item-selector=".card">
           <div v-for="(item, index) in list" :key="index" v-masonry-tile class="card" @click="clickShop(item)">
-            <img :src="item.fileUrl" alt="" class="imgs" />
+            <img :src="item.content.logo_code[0]" alt="" class="imgs" />
             <div class="bottom">
-              <div class="name">{{ switchLanguage(item, 'name') }}</div>
-              <div v-if="item.shopCode" class="pos">
-                <div class="shopName">{{ switchLanguage(item, 'shopName') }}</div>
+              <div class="name">{{ switchLanguage(item.content, 'name') }}</div>
+              <div v-if="item.content.shopCode" class="pos">
+                <div class="shopName">{{ switchLanguage(shopMap[item.content.shopCode], 'shopName') }}</div>
                 <div class="number">
-                  <img src="" alt="" />
-                  <div>{{ item.houseNumber }}</div>
+                  <img src="@/assets/images/art/poi.svg" alt="" />
+                  <div>{{ shopMap[item.content.shopCode].houseNumber }}</div>
                 </div>
               </div>
             </div>
@@ -33,42 +33,48 @@
 </template>
 
 <script setup lang="ts">
-import { toRefs } from 'vue'
+import { toRefs, ref } from 'vue'
 import { useRootStore } from '@/store/root'
 import { useRouter } from 'vue-router'
 import { useSwitchLanguage } from '@/composables/useSwitchLanguage'
+import { getColumnList } from '@/http/api/base'
 import Brand from '@/utils/Class/Brand'
 import ScrollView from '@/base/ScrollView/ScrollView.vue'
 const store = useRootStore()
-const { shopList } = toRefs(store)
-const list: any = []
+const { columnList, showColumnList, shopMap } = toRefs(store)
 const router = useRouter()
 const { switchLanguage } = useSwitchLanguage()
 
-const emits = defineEmits(['close'])
 function close() {
-  emits('close')
+  showColumnList.value = false
 }
 function clickShop(item: FeaturedList) {
-  if (item.shopCode) {
-    const arr = shopList.value.filter(shop => shop.shopCode === item.shopCode)
-    store.SET_SHOP(arr[0])
+  if (item.content.shopCode) {
+    store.SET_SHOP(shopMap[item.content.shopCode])
     store.SET_SHOW_DETAIL(true)
-  } else {
+  } else if (item.content.point) {
+    // 点位信息
+    const poi = item.content.point.split('_')
+    const floors = store.currentBuildingFloorsList.filter(item => item.floorOrder === Number(poi[1]))
     store.SET_SHOP(
       new Brand({
-        shopName: item.name,
-        floorOrder: item.floorOrder,
-        floor: item.floor,
-        logoUrl: item.fileUrl,
-        yaxis: item.point,
-        shopCode: item.shopCode,
-        shopNameEn: item.nameEn
+        shopName: item.content.name,
+        floorOrder: floors[0].floorOrder,
+        floor: floors[0].floor,
+        logoUrl: item.content.logo_code[0],
+        yaxis: poi[2],
+        shopCode: '',
+        shopNameEn: item.content.nameEn
       })
     )
     router.push('/nav')
   }
 }
+
+const list = ref<FeaturedList[]>([])
+getColumnList().then(({ data }) => {
+  list.value = data
+})
 </script>
 
 <style lang="scss" scoped>
@@ -122,6 +128,8 @@ function clickShop(item: FeaturedList) {
     border-radius: 24px;
     .name-container {
       @include fl();
+
+      margin-bottom: 40px;
       .name {
         font-size: 48px;
         font-family: 'font_bold';
@@ -150,9 +158,11 @@ function clickShop(item: FeaturedList) {
     }
     .shop-scroll {
       overflow: hidden;
+      width: 1482px;
       height: 712px;
       .item {
         display: block;
+        width: 1452px;
         .card {
           width: 354px;
           margin-bottom: 12px;

src/composables/useFindCar.ts

@@ -1,17 +1,20 @@
-import { ref } from 'vue'
+import { ref, toRefs } from 'vue'
 import { getFindCar } from '@/http/api/parking'
 import { isLicensePlate } from '@/utils/utils'
 import { useRootStore } from '@/store/root'
-import { useRouter } from 'vue-router'
+// import { useRouter } from 'vue-router'
 import { HTTP_CODE } from '@/enums'
 import Message from '@/base/Message/Message'
 
 export const useFindCar = () => {
   const showCarDetail = ref(false)
+  const showCarSearch = ref(false)
   const loading = ref(false)
   const result = ref<CarInfo>()
+  const searchList = ref<string[]>([])
   const store = useRootStore()
-  const router = useRouter()
+  const { mapParkList } = toRefs(store)
+  // const router = useRouter()
   async function confirm(plate: string, type: number) {
     if (!type) {
       if (!isLicensePlate(plate)) {
@@ -38,26 +41,24 @@ export const useFindCar = () => {
         loading.value = false
       }
     } else {
-      if (!plate.length) {
-        Message({ type: 'success', text: '请输入正确的车位号' })
-        return
-      }
-      const info = window.Map_QM.pathPark({ shopNum: plate })
-      if (info?.node) {
-        const floor: any = store.buildingList[0].floorList.find(item => item.floorOrder === info.floor)?.floor
-        const shop = {
-          shopCode: '',
-          shopName: plate,
-          floorOrder: info.floor,
-          floor,
-          logoUrl: '/static/img/tcjf.png',
-          yaxis: info.node
-        }
-        store.SET_SHOP(shop)
-        router.push('/nav')
-      } else {
-        Message({ text: `暂未查到相关信息`, type: 'success' })
-      }
+      searchList.value = mapParkList.value.filter(item => item.includes(plate))
+      showCarSearch.value = true
+      // const info = window.Map_QM.pathPark({ shopNum: plate })
+      // if (info?.node) {
+      //   const floor: any = store.buildingList[0].floorList.find(item => item.floorOrder === info.floor)?.floor
+      //   const shop = {
+      //     shopCode: '',
+      //     shopName: plate,
+      //     floorOrder: info.floor,
+      //     floor,
+      //     logoUrl: '/static/img/tcjf.png',
+      //     yaxis: info.node
+      //   }
+      //   store.SET_SHOP(shop)
+      //   router.push('/nav')
+      // } else {
+      //   Message({ text: `暂未查到相关信息`, type: 'success' })
+      // }
     }
   }
 
@@ -67,5 +68,5 @@ export const useFindCar = () => {
     const minutes = totalMinutes % 60
     return `${hours > 0 ? `${hours}小时` : ''}${minutes > 0 ? ` ${minutes}分钟` : ''}`
   }
-  return { loading, result, showCarDetail, confirm }
+  return { loading, result, showCarDetail, confirm, searchList, showCarSearch }
 }

src/composables/useInitConfigAndMallInfo.ts

@@ -1,5 +1,5 @@
 import { useRootStore } from '@/store/root'
-import { getConfig, getFacilitiesList, getWeather } from '@/http/api/base'
+import { getConfig, getFacilitiesList, getWeather, getColumnBtn } from '@/http/api/base'
 import { getShopAndBuildingList } from '@/http/api/shop'
 import { getDeviceInfo } from '@/http/api/building'
 import { getArtWorkList } from '@/http/api/art'
@@ -14,17 +14,27 @@ export const useInitConfigAndMallInfo = async () => {
       store.SET_CONFIG(_config.data[0].content)
     }
 
-    const [_DeviceInfo, _shopAndBuilding, _facilityList, _weather, _shopListByFloor, _shopListByIndustry, _brandInfo, _artWorkList] =
-      await Promise.all([
-        getDeviceInfo(),
-        getShopAndBuildingList(),
-        getFacilitiesList(),
-        getWeather(),
-        getShopListByFloor(),
-        getShopListByIndustry(),
-        getBrandInfo(),
-        getArtWorkList()
-      ])
+    const [
+      _DeviceInfo,
+      _shopAndBuilding,
+      _facilityList,
+      _weather,
+      _shopListByFloor,
+      _shopListByIndustry,
+      _brandInfo,
+      _artWorkList,
+      _colomList
+    ] = await Promise.all([
+      getDeviceInfo(),
+      getShopAndBuildingList(),
+      getFacilitiesList(),
+      getWeather(),
+      getShopListByFloor(),
+      getShopListByIndustry(),
+      getBrandInfo(),
+      getArtWorkList(),
+      getColumnBtn()
+    ])
 
     const { shopList, buildingList } = _shopAndBuilding.data
     store.SET_DEVICE(_DeviceInfo.data)
@@ -36,6 +46,7 @@ export const useInitConfigAndMallInfo = async () => {
     store.SET_FACILITY_LIST(_facilityList.data)
     store.SET_WEATHER(_weather.data)
     store.SET_ART_PLACE_LIST(_artWorkList.data)
+    store.SET_COLUMN_LIST(_colomList.data)
   } catch (error) {
     Message({ text: '初始化数据失败', type: 'success' })
   }

src/composables/useInitMap.ts

@@ -20,10 +20,17 @@ export const useInitMap = async function () {
         store.SET_MAP_STATUS(true)
         window.Map_QM.addEventListener('shop', onClickShop, false)
         window.Map_QM.renderer.domElement.addEventListener('webglcontextlost', onContextLost)
+        const arr: string[] = []
+        window.Map_QM.util.allMap[0].buildArr.forEach((item: any) => {
+          item.mapData.parkArea.forEach((park: any) => {
+            arr.push(park.parkNum)
+          })
+        })
+        store.SET_MAP_PARK_LIST(arr)
       },
       {
         build: device.value?.buildingOrder ?? 0,
-        floor: device.value.floorOrder,
+        floor: 6,
         navPoint: device.value.location,
         angle: device.value.angle,
         iconUrl: delPrefixOfFacilityList,

src/composables/useParkingKeyboard.ts

@@ -4,7 +4,7 @@ import { isZhWord, isUppercaseWord } from '@/utils/utils'
 export const useParkingKeyboard = () => {
   const NOT_ENERGY_PLATE = 7 //非能源车牌长度
   const ENERGY_PLATE = 8 //能源车牌长度
-  const SPACE_MAX_LENGTH = 6 //车位最大允许长度
+  const SPACE_MAX_LENGTH = 3 //车位最大允许长度
   const LICENSE = ['川', 'A'] //默认车牌前缀
 
   const plate = ref(LICENSE.slice())

src/composables/useStartNavi.ts

@@ -16,7 +16,7 @@ export const useStartNavi = (shop: Ref<Shop>, device: Ref<Device>, setPauseRefFn
   startNavi(shop.value)
 
   onBeforeUnmount(() => {
-    window.Map_QM.showFloor(device.value.floorOrder)
+    window.Map_QM.showFloor(6)
   })
 
   //导航动画

src/http/api/base/index.ts

@@ -29,3 +29,9 @@ export const getFloorPicList = () => request<FloorPic[]>({ url: `${PREFIX.STATIC
 
 // 获取区域缩略图
 export const getAreaPicList = () => request<AreaPic[]>({ url: `${PREFIX.STATIC_URL}/JSON/getAreaPicList.json` })
+
+// 获取专栏按钮列表
+export const getColumnBtn = () => request<Featured[]>({ url: `${PREFIX.STATIC_URL}/JSON/getColumnBtn.json` })
+
+// 获取专栏列表
+export const getColumnList = () => request<FeaturedList[]>({ url: `${PREFIX.STATIC_URL}/JSON/getColumnList.json` })

src/http/api/parking/index.ts

@@ -3,6 +3,10 @@ import { getPrefixUrl } from '../../http'
 import { PREFIX } from '@/enums'
 //找车
 export const getFindCar = (license: string) =>
-  request<CarInfo>({ url: `${getPrefixUrl().interfaceUrl}/ThirdPark/GetPlaceInfo?carCode=${license}` })
+  request<CarInfo>({ url: `${getPrefixUrl().interfaceUrl}/api/guide/v1/web/thirdParkRevision?plateId=${license}` })
 
-export const getParkingInfo = () => request<ParkingInfo>({ url: `${PREFIX.STATIC_URL}/JSON/getParkingInfo.json` })
+// 获取停车场信息
+export const getParkInfo = () => request<ParkingInfo[]>({ url: `${PREFIX.STATIC_URL}/JSON/getParkInfo.json` })
+
+// 获取停车场二维码
+export const getParkingQrList = () => request<Qr[]>({ url: `${PREFIX.STATIC_URL}/JSON/getParkingQrList.json` })

src/i18n/lang/en.json

@@ -8,6 +8,7 @@
   "play": "Play",
   "speedUp": "Speed up",
   "stopSpeedUp": "Stop acceleration",
+  "searchCar": "Result",
   "header": {
     "recommend": "Recommend"
   },

src/i18n/lang/zh.json

@@ -8,6 +8,7 @@
   "play": "播放",
   "speedUp": "加速",
   "stopSpeedUp": "停止加速",
+  "searchCar": "车位号搜索结果",
   "header": {
     "recommend": "餐饮推荐"
   },

src/store/root/actions.ts

@@ -24,6 +24,7 @@ export interface Actions {
   SET_IS4K(flag: boolean): void
   SET_SHOP_MAP(shopMap: ShopMap): void
   SET_ART_PLACE_LIST(list: ArtPlace[]): void
+  SET_MAP_PARK_LIST(list: string[]): void
 }
 
 export type GenActions = CreateActions<Root, State, Actions>
@@ -88,5 +89,8 @@ export const actions: GenActions = {
   },
   SET_ART_PLACE_LIST(list) {
     this.artPlaceList = list
+  },
+  SET_MAP_PARK_LIST(list) {
+    this.mapParkList = list
   }
 }

src/store/root/state.ts

@@ -20,6 +20,7 @@ export interface State {
   is4K: boolean //是否4K
   shopMap: ShopMap // 店铺code与店铺信息集合
   artPlaceList: ArtPlace[] // 艺术装置集合
+  mapParkList: string[] // 停车位列表
 }
 
 export const state = (): State => ({
@@ -41,5 +42,6 @@ export const state = (): State => ({
   showColumnList: false,
   is4K: true,
   shopMap: {} as ShopMap,
-  artPlaceList: []
+  artPlaceList: [],
+  mapParkList: []
 })

src/types/featured.d.ts

@@ -1,22 +1,23 @@
 declare interface Featured {
-  moduleType: string
-  name: string //名称
-  nameEn: string //英文名称
-  introduce: string
-  introduceEn: string
-  crossFileCode: string //横屏图片
-  verticalFileCode: string //竖屏图片
+  id: number
+  title: string
+  content: {
+    isOpen: '开启' | '关闭'
+    logo_code: string[]
+    name: string
+    nameEn: string
+    type: '好吃的' | '好玩的' | '值得买'
+  }
 }
 
 declare interface FeaturedList {
-  nameEn: string
-  shopNameEn: string
-  point: number
-  floorOrder: number
-  floor: string
-  shopCode: stirng
-  shopName: string
-  name: string
-  houseNumber: string
-  fileUrl: string
+  id: number
+  title: string
+  content: {
+    name: string
+    nameEn: string
+    logo_code: string[]
+    point: string
+    shopCode: string
+  }
 }

src/types/map.d.ts

@@ -33,6 +33,7 @@ export declare global {
       // 地图工具对象
       util: {
         options: { playSpeed: number }
+        allMap: any
         changePlaySpeed(speed: number = 6): void
       }
       // render 对象

src/types/parkingInfo.d.ts

@@ -1,8 +1,11 @@
 declare interface ParkingInfo {
+  id: number
   title: string
-  titleEn: string
-  content: string
-  contentEn: string
-  fileList: string[]
-  qrFileList: Array<{ name: string; nameEn: string; fileUrl: string }>
+  content: {
+    name: string
+    nameEn: string
+    content: string
+    contentEn: string
+    file_code: string[]
+  }
 }

src/views/Art/Art.vue

@@ -1,34 +1,40 @@
 <template>
-  <div class="art-container">
-    <div class="name">艺术装置</div>
-    <div class="nameEn">ARTWORK</div>
-    <ScrollView class="myScroll" :list="[]" scroll-x>
-      <div style="display: inline-block">
-        <div class="lists">
-          <ArtItem />
+  <Transition appear enter-active-class="animate__animated animate__fadeIn">
+    <div class="art-container">
+      <div class="name">艺术装置</div>
+      <div class="nameEn">ARTWORK</div>
+      <ScrollView class="myScroll" :list="artPlaceList" scroll-x scrollbar>
+        <div style="display: inline-block">
+          <div class="lists">
+            <ArtItem v-for="item in artPlaceList" :key="item.id" :art-info="item" />
+          </div>
         </div>
-      </div>
-    </ScrollView>
-  </div>
+      </ScrollView>
+    </div>
+  </Transition>
 </template>
 
 <script setup lang="ts">
-import ScrollView from '@/base/ScrollView/ScrollView.vue'
+import { toRefs } from 'vue'
+import { useRootStore } from '@/store/root'
 import ArtItem from './ArtItem.vue'
+import ScrollView from '@/base/ScrollView/ScrollView.vue'
+
+const store = useRootStore()
+const { artPlaceList } = toRefs(store)
 </script>
 
 <style lang="scss" scoped>
-:deep(.bscroll-vertical-scrollbar) {
-  width: 500px;
-  height: 1px !important;
+:deep(.bscroll-horizontal-scrollbar) {
+  z-index: 3 !important;
+  width: 500px !important;
   background: rgb(0 0 0 / 10%);
-  border-radius: 1px;
+  border-radius: 6px;
   opacity: 1 !important;
   .bscroll-indicator {
-    height: 2px !important;
     background: #e00068 !important;
     border: none !important;
-    border-radius: 1px !important;
+    border-radius: 6px !important;
   }
 }
 .art-container {

src/views/Art/ArtItem.vue

@@ -1,16 +1,16 @@
 <template>
   <div class="art-item">
-    <img class="pic" src="" alt="" />
+    <img class="pic" :src="artInfo.content.file_code[0]" alt="" />
     <div class="info">
       <div class="top">
         <div>
-          <div class="title"></div>
-          <div class="titleEn"></div>
+          <div class="title">{{ artInfo.content.name }}</div>
+          <div class="titleEn">{{ artInfo.content.nameEn }}</div>
         </div>
         <img src="@/assets/images/art/go.svg" alt="" />
       </div>
-      <ScrollView :list="[]" class="intro-scroll">
-        <div class="intro"></div>
+      <ScrollView :list="switchLanguage(artInfo.content, 'content')" class="intro-scroll" scrollbar>
+        <div class="intro">{{ switchLanguage(artInfo.content, 'content') }}</div>
       </ScrollView>
     </div>
   </div>
@@ -18,6 +18,12 @@
 
 <script setup lang="ts">
 import ScrollView from '@/base/ScrollView/ScrollView.vue'
+import { useSwitchLanguage } from '@/composables/useSwitchLanguage'
+const { switchLanguage } = useSwitchLanguage()
+type Prop = {
+  artInfo: ArtPlace
+}
+defineProps<Prop>()
 </script>
 
 <style lang="scss" scoped>
@@ -80,10 +86,12 @@ import ScrollView from '@/base/ScrollView/ScrollView.vue'
       }
     }
     .intro-scroll {
+      position: relative;
       overflow: hidden;
       width: 296px;
       height: 166px;
       .intro {
+        width: 274px;
         font-size: 12px;
         font-family: 'font_regular';
         color: #8e9090;

src/views/Guide/ArtList.vue

@@ -49,15 +49,14 @@ function show(item: Art, index: number) {
   current.value = index
   // 点位信息
   const poi = item.content.point.split('_')
-  console.log(poi)
   hideMapDialog()
   window.Map_QM.addElementByNode(document.getElementById('artInfo'), Number(poi[2]))
   const art: any = document.getElementById('artInfo')
-  art.style.visibility = 'visibility'
+  art.style.visibility = 'visible'
 
   const floors = store.currentBuildingFloorsList.filter(item => item.floorOrder === Number(poi[1]))
   const shop = {
-    shopCode: '',
+    shopCode: index + 1,
     shopName: item.content.name,
     shopNameEn: item.content.nameEn,
     floorOrder: floors[0].floorOrder,

src/views/Guide/FloorPicList.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="floor-pic-list">
+  <div class="floor-pic-lists">
     <div
       v-for="(item, index) in picList"
       :key="item.id"
@@ -32,9 +32,9 @@ getFloorPicList().then(({ data }) => {
 </script>
 
 <style lang="scss" scoped>
-.floor-pic-list {
+.floor-pic-lists {
   position: fixed;
-  top: 232px;
+  top: 246px;
   right: 50px;
   z-index: 998;
   .floor {

src/views/Guide/Guide.vue

@@ -141,7 +141,7 @@ function show(item: ArtPlace) {
   hideMapDialog()
   window.Map_QM.addElementByNode(document.getElementById('artWorkInfo'), Number(poi[2]))
   const art: any = document.getElementById('artWorkInfo')
-  art.style.visibility = 'visibility'
+  art.style.visibility = 'visible'
 
   const floors = store.currentBuildingFloorsList.filter(item => item.floorOrder === Number(poi[1]))
   const shop = {

src/views/Parking/Parking.vue

@@ -10,46 +10,50 @@
       :list="list"
       @click="handleSwitch"
     />
-    <div class="content">
-      <div class="content-left">
-        <PlateInput
-          :list="plate"
-          :search-method="searchMethod"
-          :space-length="inputLength"
-          @confirm="onConfirm"
-          @handle-energy="handleEnergy"
-        >
-          <Loading v-if="loading" fill="#fff" :size="20" />
-        </PlateInput>
-        <PlateKeyboard :search-methods="searchMethod" @del="del" @handle-keyboard="handleKeyboard" />
-      </div>
-      <div class="content-right">
-        <div class="parking-carousel">
-          <EffectFade v-slot="{ item }" :list="parkingInfo.fileList">
-            <img class="img" :src="item" alt="" />
-          </EffectFade>
-        </div>
-        <div class="info">
-          <h1 class="title">{{ switchLanguage(parkingInfo, 'title') }}</h1>
-          <ScrollView class="parking-scroll" scrollbar :list="switchLanguage(parkingInfo, 'content')" :pull-up="false">
-            <div class="intro">{{ switchLanguage(parkingInfo, 'content') }}</div>
-          </ScrollView>
+    <Transition appear enter-active-class="animate__animated animate__fadeIn">
+      <div class="content">
+        <div class="content-left">
+          <div v-if="searchMethod === '车位'" class="point">请输入车位号后三位</div>
+          <PlateInput
+            :list="plate"
+            :search-method="searchMethod"
+            :space-length="inputLength"
+            @confirm="onConfirm"
+            @handle-energy="handleEnergy"
+          >
+            <Loading v-if="loading" fill="#fff" :size="20" />
+          </PlateInput>
+          <PlateKeyboard :search-methods="searchMethod" @del="del" @handle-keyboard="handleKeyboard" />
         </div>
-        <div class="qr-container">
-          <img src="" alt="" />
-          <div class="name">寻车扫码</div>
+        <div v-if="parkingInfo.length" class="content-right">
+          <div class="parking-carousel">
+            <EffectFade v-slot="{ item }" :list="parkingInfo[0].content.file_code">
+              <img class="img" :src="item" alt="" />
+            </EffectFade>
+          </div>
+          <div class="info">
+            <h1 class="title">{{ switchLanguage(parkingInfo[0].content, 'name') }}</h1>
+            <ScrollView class="parking-scroll" scrollbar :list="switchLanguage(parkingInfo[0].content, 'content')" :pull-up="false">
+              <div class="intro">{{ switchLanguage(parkingInfo[0].content, 'content') }}</div>
+            </ScrollView>
+          </div>
+          <div v-if="qrlist.length" class="qr-container">
+            <img :src="qrlist[0].content.file_code[0]" alt="" />
+            <div class="name">{{ switchLanguage(qrlist[0].content, 'name') }}</div>
+          </div>
         </div>
       </div>
-    </div>
+    </Transition>
   </div>
   <CarInfo v-if="showCarDetail" :car-info="result" @close="showCarDetail = false" />
+  <CarSearch v-if="showCarSearch" :search-list="searchList" @close="showCarSearch = false" />
 </template>
 
 <script setup lang="ts">
-import { ref, shallowRef, defineAsyncComponent } from 'vue'
+import { ref, defineAsyncComponent } from 'vue'
 import { useFindCar } from '@/composables/useFindCar'
 import { useParkingKeyboard } from '@/composables/useParkingKeyboard'
-import { getParkingInfo } from '@/http/api/parking'
+import { getParkInfo, getParkingQrList } from '@/http/api/parking'
 import { useSwitchLanguage } from '@/composables/useSwitchLanguage'
 import PlateInput from '@/components/PlateInput/PlateInput.vue'
 import PlateKeyboard from '@/components/PlateKeyboard/PlateKeyboard.vue'
@@ -58,6 +62,7 @@ import EffectFade from '@/components/EffectFade/EffectFade.vue'
 import ScrollView from '@/base/ScrollView/ScrollView.vue'
 import switchtab from '@/components/SwitchTab/SwitchTab.vue'
 const CarInfo = defineAsyncComponent(() => import('@/components/CarInfo/CarInfo.vue'))
+const CarSearch = defineAsyncComponent(() => import('@/components/CarSearch/CarSearch.vue'))
 const { switchLanguage } = useSwitchLanguage()
 const list = [
   {
@@ -87,7 +92,7 @@ function handleSwitch(index: number) {
 
 const { del, handleKeyboard, handleEnergy, inputLength, plate, plateToString, searchMethod, LICENSE, changeSearchMethod } =
   useParkingKeyboard()
-const { confirm, loading, showCarDetail, result } = useFindCar()
+const { confirm, loading, showCarDetail, result, searchList, showCarSearch } = useFindCar()
 
 function onConfirm() {
   confirm(plateToString.value, tabIdx.value)
@@ -98,13 +103,30 @@ function onConfirm() {
   }
 }
 
-const parkingInfo = shallowRef<ParkingInfo>({} as ParkingInfo)
-getParkingInfo().then(({ data }) => {
-  parkingInfo.value = data ?? {}
+const parkingInfo = ref<ParkingInfo[]>([])
+getParkInfo().then(({ data }) => {
+  parkingInfo.value = data
+})
+
+const qrlist = ref<Qr[]>([])
+getParkingQrList().then(({ data }) => {
+  qrlist.value = data
 })
 </script>
 
 <style lang="scss" scoped>
+:deep(.bscroll-vertical-scrollbar) {
+  width: 6px;
+  height: 120px !important;
+  background: rgb(0 0 0 / 3%);
+  border-radius: 6px;
+  opacity: 1 !important;
+  .bscroll-indicator {
+    background: rgb(0 0 0 / 6%) !important;
+    border: none !important;
+    border-radius: 6px !important;
+  }
+}
 .parking-container {
   position: fixed;
   top: 180px;
@@ -120,6 +142,17 @@ getParkingInfo().then(({ data }) => {
     .content-left {
       margin-top: 228px;
       margin-right: 136px;
+      .point {
+        position: fixed;
+        top: 368px;
+        left: 100px;
+        font-size: 16px;
+        font-family: 'font_regular';
+        color: #534f46;
+        font-style: normal;
+        font-weight: 400;
+        line-height: 24px;
+      }
     }
     .content-right {
       position: relative;
@@ -136,7 +169,7 @@ getParkingInfo().then(({ data }) => {
           height: 200px;
         }
         .img {
-          width: 540px;
+          width: 720px;
           height: 405px;
           border-radius: 16px;
         }
@@ -161,18 +194,6 @@ getParkingInfo().then(({ data }) => {
           overflow: hidden;
           height: 182px;
           margin: 0 18px 40px 48px;
-          :deep(.bscroll-vertical-scrollbar) {
-            width: 6px !important;
-            height: 120px !important;
-            background: rgb(0 0 0 / 3%) !important;
-            opacity: 1 !important;
-            .bscroll-indicator {
-              height: 40px !important;
-              background: #fff !important;
-              border: none !important;
-              box-shadow: 0 8px 20px rgb(0 0 0 / 10%) !important;
-            }
-          }
           .intro {
             padding-right: 24px;
             font-size: 14px;

src/views/Traffic/Traffic.vue

@@ -9,8 +9,10 @@
     :list="list"
     @click="handleSwitch"
   />
-  <PictureText v-if="isCurrent" :ac-list="mallIntro" :qr-list="[]" />
-  <img v-else class="tra" :src="traImg ? traImg : require('@/assets/images/empty_big.svg')" alt="" />
+  <Transition appear enter-active-class="animate__animated animate__fadeIn">
+    <PictureText v-if="isCurrent" :ac-list="mallIntro" :qr-list="[]" />
+    <img v-else class="tra" :src="traImg ? traImg : require('@/assets/images/empty_big.svg')" alt="" />
+  </Transition>
 </template>
 
 <script setup lang="ts">