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 { |
declare interface ParkingInfo { |
||||
|
id: number |
||||
title: string |
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