liyongle
3 years ago
24 changed files with 378 additions and 130 deletions
File diff suppressed because one or more lines are too long
@ -0,0 +1,20 @@ |
|||
{ |
|||
"code": 200, |
|||
"msg": "操作成功", |
|||
"data": [ |
|||
{ |
|||
"id": 209, |
|||
"title": "停车场介绍", |
|||
"content": { |
|||
"name": "停车场介绍", |
|||
"nameEn": "dad", |
|||
"content": "停车场介绍", |
|||
"contentEn": "23123", |
|||
"file_code": [ |
|||
"/iotFile/project-odubitlp9mjy2wyuqkpfga/20230609/skps.png", |
|||
"/iotFile/project-odubitlp9mjy2wyuqkpfga/20230609/-zGlLfxNuSkVWjOQ3tsnc.jpg" |
|||
] |
|||
} |
|||
} |
|||
] |
|||
} |
|||
@ -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> |
|||
@ -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[] |
|||
} |
|||
} |
|||
|
|||
Loading…
Reference in new issue