project-shenyangk11
/
sy_k11_H_base_daoshi_vue_ts
forked from common/base_daoshi_vue_ts
2
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

Merge branch 'dev' of company:project-shenyangk11/sy_k11_H_base_daoshi_vue_ts into dev

pull/2/head
deepblues 3 years ago
parent
d695b3799a 9c5aa9d08a
commit
5f51b62d68
18 changed files with 727 additions and 9 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 312
      public/static/offline/JSON/index.json
  2. BIN
      src/assets/images/search/close.png
  3. BIN
      src/assets/images/search/del.png
  4. BIN
      src/assets/images/search/position.png
  5. BIN
      src/assets/images/search/quickBg.png
  6. BIN
      src/assets/images/search/search.png
  7. BIN
      src/assets/images/search/searchi.png
  8. 107
      src/components/Search/Hot.vue
  9. 127
      src/components/Search/Key.vue
  10. 79
      src/components/Search/Quick.vue
  11. 51
      src/components/Search/Search.vue
  12. 3
      src/http/api/base/index.ts
  13. 3
      src/i18n/lang/en.json
  14. 3
      src/i18n/lang/tw.json
  15. 3
      src/i18n/lang/zh.json
  16. 17
      src/types/hot.d.ts
  17. 15
      src/views/Index/Top.vue
  18. 16
      src/views/ServiceList/ServiceList.vue

312
public/static/offline/JSON/index.json
View File

@ -1 +1,311 @@
{"code":200,"msg":"操作成功","data":{"temperature":"15","columnList":[{"moduleType":1,"name":"美食","nameEn":"","introduce":"","introduceEn":"","crossFileCode":"","verticalFileCode":""},{"moduleType":2,"name":"游玩","nameEn":"","introduce":"","introduceEn":"","crossFileCode":"","verticalFileCode":""},{"moduleType":3,"name":"购物","nameEn":"","introduce":"","introduceEn":"","crossFileCode":"","verticalFileCode":""}],"hotSearch":[{"logoCode":"Jrw0_ifPRL40HwIJuQMv7","logoUrl":"/iotFile/2023/04/18/Jrw0_ifPRL40HwIJuQMv7.png","shopCode":"N58iWdPNw2wAB0X8BxmW1","shopName":"星巴克","building":"A","buildingCode":"suG1YjUhWnvRBJm3ULnCo","buildingOrder":0,"floor":"L1","floorCode":"-vH5uZXijKrzlJQIIIkba","floorOrder":4,"xaxis":"","yaxis":"","navXaxis":"","navYaxis":""}],"status":"多云转阴"}}
{
"code": 200,
"msg": "操作成功",
"data": {
"temperature": "15",
"columnList": [
{
"moduleType": 1,
"name": "美食",
"nameEn": "",
"introduce": "",
"introduceEn": "",
"crossFileCode": "",
"verticalFileCode": ""
},
{
"moduleType": 2,
"name": "游玩",
"nameEn": "",
"introduce": "",
"introduceEn": "",
"crossFileCode": "",
"verticalFileCode": ""
},
{
"moduleType": 3,
"name": "购物",
"nameEn": "",
"introduce": "",
"introduceEn": "",
"crossFileCode": "",
"verticalFileCode": ""
}
],
"hotSearch": [
{
"logoCode": "Jrw0_ifPRL40HwIJuQMv71",
"logoUrl": "/iotFile/2023/04/18/Jrw0_ifPRL40HwIJuQMv7.png",
"shopCode": "N58iWdPNw2wAB0X8BxmW1",
"shopName": "星巴克",
"building": "A",
"buildingCode": "suG1YjUhWnvRBJm3ULnCo",
"buildingOrder": 0,
"floor": "L1",
"floorCode": "-vH5uZXijKrzlJQIIIkba",
"floorOrder": 4,
"xaxis": "",
"yaxis": "",
"navXaxis": "",
"navYaxis": ""
},
{
"logoCode": "Jrw0_ifPRL40HwIJuQMv72",
"logoUrl": "/iotFile/2023/04/18/Jrw0_ifPRL40HwIJuQMv7.png",
"shopCode": "N58iWdPNw2wAB0X8BxmW1",
"shopName": "星巴克",
"building": "A",
"buildingCode": "suG1YjUhWnvRBJm3ULnCo",
"buildingOrder": 0,
"floor": "L1",
"floorCode": "-vH5uZXijKrzlJQIIIkba",
"floorOrder": 4,
"xaxis": "",
"yaxis": "",
"navXaxis": "",
"navYaxis": ""
},
{
"logoCode": "Jrw0_ifPRL40HwIJuQMv73",
"logoUrl": "/iotFile/2023/04/18/Jrw0_ifPRL40HwIJuQMv7.png",
"shopCode": "N58iWdPNw2wAB0X8BxmW1",
"shopName": "星巴克",
"building": "A",
"buildingCode": "suG1YjUhWnvRBJm3ULnCo",
"buildingOrder": 0,
"floor": "L1",
"floorCode": "-vH5uZXijKrzlJQIIIkba",
"floorOrder": 4,
"xaxis": "",
"yaxis": "",
"navXaxis": "",
"navYaxis": ""
},
{
"logoCode": "Jrw0_ifPRL40HwIJuQMv74",
"logoUrl": "/iotFile/2023/04/18/Jrw0_ifPRL40HwIJuQMv7.png",
"shopCode": "N58iWdPNw2wAB0X8BxmW1",
"shopName": "星巴克",
"building": "A",
"buildingCode": "suG1YjUhWnvRBJm3ULnCo",
"buildingOrder": 0,
"floor": "L1",
"floorCode": "-vH5uZXijKrzlJQIIIkba",
"floorOrder": 4,
"xaxis": "",
"yaxis": "",
"navXaxis": "",
"navYaxis": ""
},
{
"logoCode": "Jrw0_ifPRL40HwIJuQMv75",
"logoUrl": "/iotFile/2023/04/18/Jrw0_ifPRL40HwIJuQMv7.png",
"shopCode": "N58iWdPNw2wAB0X8BxmW1",
"shopName": "星巴克",
"building": "A",
"buildingCode": "suG1YjUhWnvRBJm3ULnCo",
"buildingOrder": 0,
"floor": "L1",
"floorCode": "-vH5uZXijKrzlJQIIIkba",
"floorOrder": 4,
"xaxis": "",
"yaxis": "",
"navXaxis": "",
"navYaxis": ""
},
{
"logoCode": "Jrw0_ifPRL40HwIJuQMv76",
"logoUrl": "/iotFile/2023/04/18/Jrw0_ifPRL40HwIJuQMv7.png",
"shopCode": "N58iWdPNw2wAB0X8BxmW1",
"shopName": "星巴克",
"building": "A",
"buildingCode": "suG1YjUhWnvRBJm3ULnCo",
"buildingOrder": 0,
"floor": "L1",
"floorCode": "-vH5uZXijKrzlJQIIIkba",
"floorOrder": 4,
"xaxis": "",
"yaxis": "",
"navXaxis": "",
"navYaxis": ""
},
{
"logoCode": "Jrw0_ifPRL40HwIJuQMv77",
"logoUrl": "/iotFile/2023/04/18/Jrw0_ifPRL40HwIJuQMv7.png",
"shopCode": "N58iWdPNw2wAB0X8BxmW1",
"shopName": "星巴克",
"building": "A",
"buildingCode": "suG1YjUhWnvRBJm3ULnCo",
"buildingOrder": 0,
"floor": "L1",
"floorCode": "-vH5uZXijKrzlJQIIIkba",
"floorOrder": 4,
"xaxis": "",
"yaxis": "",
"navXaxis": "",
"navYaxis": ""
},
{
"logoCode": "Jrw0_ifPRL40HwIJuQMv78",
"logoUrl": "/iotFile/2023/04/18/Jrw0_ifPRL40HwIJuQMv7.png",
"shopCode": "N58iWdPNw2wAB0X8BxmW1",
"shopName": "星巴克",
"building": "A",
"buildingCode": "suG1YjUhWnvRBJm3ULnCo",
"buildingOrder": 0,
"floor": "L1",
"floorCode": "-vH5uZXijKrzlJQIIIkba",
"floorOrder": 4,
"xaxis": "",
"yaxis": "",
"navXaxis": "",
"navYaxis": ""
},
{
"logoCode": "Jrw0_ifPRL40HwIJuQMv79",
"logoUrl": "/iotFile/2023/04/18/Jrw0_ifPRL40HwIJuQMv7.png",
"shopCode": "N58iWdPNw2wAB0X8BxmW1",
"shopName": "星巴克",
"building": "A",
"buildingCode": "suG1YjUhWnvRBJm3ULnCo",
"buildingOrder": 0,
"floor": "L1",
"floorCode": "-vH5uZXijKrzlJQIIIkba",
"floorOrder": 4,
"xaxis": "",
"yaxis": "",
"navXaxis": "",
"navYaxis": ""
},
{
"logoCode": "Jrw0_ifPRL40HwIJuQMv70",
"logoUrl": "/iotFile/2023/04/18/Jrw0_ifPRL40HwIJuQMv7.png",
"shopCode": "N58iWdPNw2wAB0X8BxmW1",
"shopName": "星巴克",
"building": "A",
"buildingCode": "suG1YjUhWnvRBJm3ULnCo",
"buildingOrder": 0,
"floor": "L1",
"floorCode": "-vH5uZXijKrzlJQIIIkba",
"floorOrder": 4,
"xaxis": "",
"yaxis": "",
"navXaxis": "",
"navYaxis": ""
},
{
"logoCode": "Jrw0_ifPRL40HwIJuQMv712",
"logoUrl": "/iotFile/2023/04/18/Jrw0_ifPRL40HwIJuQMv7.png",
"shopCode": "N58iWdPNw2wAB0X8BxmW1",
"shopName": "星巴克",
"building": "A",
"buildingCode": "suG1YjUhWnvRBJm3ULnCo",
"buildingOrder": 0,
"floor": "L1",
"floorCode": "-vH5uZXijKrzlJQIIIkba",
"floorOrder": 4,
"xaxis": "",
"yaxis": "",
"navXaxis": "",
"navYaxis": ""
},
{
"logoCode": "Jrw0_ifPRL40HwIJuQMv713",
"logoUrl": "/iotFile/2023/04/18/Jrw0_ifPRL40HwIJuQMv7.png",
"shopCode": "N58iWdPNw2wAB0X8BxmW1",
"shopName": "星巴克",
"building": "A",
"buildingCode": "suG1YjUhWnvRBJm3ULnCo",
"buildingOrder": 0,
"floor": "L1",
"floorCode": "-vH5uZXijKrzlJQIIIkba",
"floorOrder": 4,
"xaxis": "",
"yaxis": "",
"navXaxis": "",
"navYaxis": ""
},
{
"logoCode": "Jrw0_ifPRL40HwIJuQMv714",
"logoUrl": "/iotFile/2023/04/18/Jrw0_ifPRL40HwIJuQMv7.png",
"shopCode": "N58iWdPNw2wAB0X8BxmW1",
"shopName": "星巴克",
"building": "A",
"buildingCode": "suG1YjUhWnvRBJm3ULnCo",
"buildingOrder": 0,
"floor": "L1",
"floorCode": "-vH5uZXijKrzlJQIIIkba",
"floorOrder": 4,
"xaxis": "",
"yaxis": "",
"navXaxis": "",
"navYaxis": ""
},
{
"logoCode": "Jrw0_ifPRL40HwIJuQMv715",
"logoUrl": "/iotFile/2023/04/18/Jrw0_ifPRL40HwIJuQMv7.png",
"shopCode": "N58iWdPNw2wAB0X8BxmW1",
"shopName": "星巴克",
"building": "A",
"buildingCode": "suG1YjUhWnvRBJm3ULnCo",
"buildingOrder": 0,
"floor": "L1",
"floorCode": "-vH5uZXijKrzlJQIIIkba",
"floorOrder": 4,
"xaxis": "",
"yaxis": "",
"navXaxis": "",
"navYaxis": ""
},
{
"logoCode": "Jrw0_ifPRL40HwIJuQMv716",
"logoUrl": "/iotFile/2023/04/18/Jrw0_ifPRL40HwIJuQMv7.png",
"shopCode": "N58iWdPNw2wAB0X8BxmW1",
"shopName": "星巴克",
"building": "A",
"buildingCode": "suG1YjUhWnvRBJm3ULnCo",
"buildingOrder": 0,
"floor": "L1",
"floorCode": "-vH5uZXijKrzlJQIIIkba",
"floorOrder": 4,
"xaxis": "",
"yaxis": "",
"navXaxis": "",
"navYaxis": ""
},
{
"logoCode": "Jrw0_ifPRL40HwIJuQMv717",
"logoUrl": "/iotFile/2023/04/18/Jrw0_ifPRL40HwIJuQMv7.png",
"shopCode": "N58iWdPNw2wAB0X8BxmW1",
"shopName": "星巴克",
"building": "A",
"buildingCode": "suG1YjUhWnvRBJm3ULnCo",
"buildingOrder": 0,
"floor": "L1",
"floorCode": "-vH5uZXijKrzlJQIIIkba",
"floorOrder": 4,
"xaxis": "",
"yaxis": "",
"navXaxis": "",
"navYaxis": ""
},
{
"logoCode": "Jrw0_ifPRL40HwIJuQMv718",
"logoUrl": "/iotFile/2023/04/18/Jrw0_ifPRL40HwIJuQMv7.png",
"shopCode": "N58iWdPNw2wAB0X8BxmW1",
"shopName": "星巴克",
"building": "A",
"buildingCode": "suG1YjUhWnvRBJm3ULnCo",
"buildingOrder": 0,
"floor": "L1",
"floorCode": "-vH5uZXijKrzlJQIIIkba",
"floorOrder": 4,
"xaxis": "",
"yaxis": "",
"navXaxis": "",
"navYaxis": ""
}
],
"status": "多云转阴"
}
}

BIN
src/assets/images/search/close.png
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 2.0 KiB

BIN
src/assets/images/search/del.png
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 631 B

BIN
src/assets/images/search/position.png
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 573 B

BIN
src/assets/images/search/quickBg.png
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 38 KiB

BIN
src/assets/images/search/search.png
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 2.6 KiB

BIN
src/assets/images/search/searchi.png
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.5 KiB

107
src/components/Search/Hot.vue
View File

@ -0,0 +1,107 @@
<template>
<div class="hot-container">
<div class="title">{{ $t('hot') }}</div>
<ScrollView class="myScoll" :list="list" :pull-up="false">
<div class="shop_list">
<div v-for="item in list" :key="item.shopCode" class="shop_item">
<div class="top">
<img v-lazy="item.logoUrl" alt="" />
</div>
<div class="info">
<div class="name">{{ switchLanguage(item, 'shopName') }}</div>
<div class="right">
<img src="@/assets/images/search/position.png" alt="" />
<div class="hose_num">{{ item.houseNumber }}</div>
</div>
</div>
</div>
</div>
</ScrollView>
</div>
</template>
<script setup lang="ts">
import { ref } from 'vue'
import { getIndexJson } from '@/http/api/base'
import ScrollView from '@/base/ScrollView/ScrollView.vue'
const list = ref<HotSearch[]>()
getIndexJson().then(({ data }) => {
list.value = data.hotSearch
})
</script>
<style lang="scss" scoped>
.hot-container {
width: 714px;
.title {
margin-bottom: 24px;
font-size: 36px;
font-family: 'font_bold';
color: #595447;
font-style: normal;
font-weight: 700;
line-height: 44px;
}
.myScoll {
overflow: hidden;
height: 626px;
}
.shop_list {
display: grid;
gap: 12px 12px;
grid-template-columns: 1fr 1fr 1fr;
.shop_item {
width: 230px;
height: 270px;
.top {
@include fl(center);
width: 230px;
height: 230px;
margin-bottom: 16px;
background: #fff;
border-radius: 8px;
img {
width: 180px;
height: 180px;
}
}
.info {
@include fl(space-between);
width: 230px;
height: 24px;
.name {
@include no-wrap;
max-width: 140px;
height: 24px;
font-size: 16px;
font-family: 'font_bold';
color: rgb(0 0 0 / 60%);
font-style: normal;
font-weight: 700;
line-height: 24px;
}
.right {
@include fl();
img {
width: 14px;
height: 16px;
margin-right: 6px;
}
.hose_num {
font-size: 14px;
font-family: 'font_bold';
color: #a6976f;
font-style: normal;
font-weight: 700;
line-height: 22px;
}
}
}
}
}
}
</style>

127
src/components/Search/Key.vue
View File

@ -0,0 +1,127 @@
<template>
<div class="key-container">
<div class="inp">
<img src="@/assets/images/search/searchi.png" alt="" />
<div class="ph">搜索</div>
</div>
<div class="board-container">
<ul class="letter-items">
<li v-for="(item, index) of letter" :key="item" class="letter" :class="{ 'active-btn': current === index }">
{{ item }}
</li>
<li class="letter del" :class="{ 'active-btn': current === 37 }">
<img src="@/assets/images/search/del.png" alt="" />
</li>
</ul>
</div>
</div>
</template>
<script setup lang="ts">
import { ref } from 'vue'
// 键盘按钮列表
const letter = [
'Q',
'W',
'E',
'R',
'T',
'Y',
'U',
'I',
'O',
'P',
'A',
'S',
'D',
'F',
'G',
'H',
'J',
'K',
'L',
'Z',
'X',
'C',
'V',
'B',
'N',
'M'
]
const current = ref(-1)
</script>
<style lang="scss" scoped>
.key-container {
margin: 68px 52px 286px 100px;
.inp {
position: relative;
width: 714px;
height: 80px;
padding: 22px 40px;
margin-bottom: 4px;
background: #fff;
border-radius: 12px;
img {
position: absolute;
top: 12px;
right: 29px;
width: 56px;
height: 56px;
}
.ph {
font-size: 28px;
font-family: 'font_bold';
color: #9f9585;
font-style: normal;
font-weight: 700;
line-height: 36px;
}
}
.board-container {
width: 714px;
height: 256px;
padding: 32px 41px;
background: #fff;
border-radius: 12px;
.letter-items {
display: flex;
width: 632px;
flex-wrap: wrap;
.letter {
@include fl(center);
width: 56px;
height: 56px;
margin-right: 8px;
margin-bottom: 12px;
font-size: 20px;
font-family: 'font_bold';
color: #9f9585;
background: #f4f4f4;
border-radius: 75px;
font-style: normal;
font-weight: 700;
line-height: 28px;
&:nth-child(10) {
margin-right: 0;
}
&:nth-child(11) {
margin-left: 25px;
}
&:nth-child(19) {
margin-right: 24px;
}
}
.active-btn {
animation: gradient 3s ease 1;
}
.del {
width: 184px;
margin-right: 0;
}
}
}
}
</style>

79
src/components/Search/Quick.vue
View File

@ -0,0 +1,79 @@
<template>
<div class="quick-container">
<div class="quick-item">
<img class="sea" src="@/assets/images/search/search.png" alt="" />
<div class="text">
{{ $t('search_home') }}
</div>
</div>
<div v-for="item in fac" :key="item.code" class="quick-item" @click="handleFacility(item)">
<div class="top">
<img v-if="item.abbreviation === 'xsj'" src="@/assets/images/index/toilet.png" alt="" />
<img v-if="item.abbreviation === 'tcc'" src="@/assets/images/index/parking.png" alt="" />
<img v-if="item.abbreviation === 'fwt'" src="@/assets/images/index/service.png" alt="" />
</div>
<div class="text">
{{ switchLanguage(item, 'name') }}
</div>
</div>
</div>
</template>
<script setup lang="ts">
import { toRefs, computed } from 'vue'
import { useRootStore } from '@/store/root'
import { useFacilityNav } from '@/composables/useFacilityNav'
const store = useRootStore()
const { facilityList } = toRefs(store)
const { handleFacility } = useFacilityNav() //公共设施导航
const fac = computed(() => {
return facilityList.value.filter(item => item.abbreviation === 'xsj' || item.abbreviation === 'tcc' || item.abbreviation === 'fwt')
})
</script>
<style lang="scss" scoped>
.quick-container {
@include fl();
width: 1680px;
height: 162px;
padding: 21px 560px;
background: url('@/assets/images/search/quickBg.png') no-repeat;
background-size: 100% 100%;
border-radius: 24px 0 0;
.quick-item {
@include fl(center);
width: 80px;
height: 120px;
margin-right: 80px;
flex-direction: column;
.sea {
width: 80px;
height: 80px;
border-radius: 50%;
}
.top {
@include fl(center);
width: 80px;
height: 80px;
background: #fff;
border-radius: 50%;
img {
width: 48px;
height: 48px;
}
}
.text {
margin-top: 16px;
font-size: 16px;
font-family: 'font_regular';
color: #84754e;
font-style: normal;
font-weight: 400;
line-height: 24px;
}
}
}
</style>

51
src/components/Search/Search.vue
View File

@ -0,0 +1,51 @@
<template>
<div class="search-container">
<img class="close" src="@/assets/images/search/close.png" alt="" @click="close" />
<div class="bg">
<Quick />
<div class="content">
<Key />
<Hot />
</div>
</div>
</div>
</template>
<script setup lang="ts">
import Quick from './Quick.vue'
import Hot from './Hot.vue'
import Key from './Key.vue'
const emits = defineEmits(['close'])
function close() {
emits('close')
}
</script>
<style lang="scss" scoped>
.search-container {
position: fixed;
top: 0;
left: 0;
z-index: 998;
width: 1920px;
height: 1080px;
padding: 80px 120px;
background: rgb(0 0 0 / 50%);
.close {
position: fixed;
top: 50px;
right: 50px;
width: 100px;
height: 100px;
}
.bg {
background: #efeeea;
border-radius: 24px;
}
.content {
@include fl(flex-start, flex-start);
margin-top: 64px;
}
}
</style>

3
src/http/api/base/index.ts
View File

@ -18,3 +18,6 @@ export const getBackTime = () => request<[number, number]>({ url: `/JSON/getBack
//手写地址 //手写地址
export const getHandWriting = (data: WrittenQuery) => request<string[]>({ url: 'http://saas.1000my.com:8014/words', method: 'post', data }) export const getHandWriting = (data: WrittenQuery) => request<string[]>({ url: 'http://saas.1000my.com:8014/words', method: 'post', data })
// 获取首页数据
export const getIndexJson = () => request({ url: `/JSON/index.json` })

3
src/i18n/lang/en.json
View File

@ -19,5 +19,6 @@
}, },
"dispoint": "Activity and Discount", "dispoint": "Activity and Discount",
"service": "Service", "service": "Service",
"school": "College Of Culture"
"school": "College Of Culture",
"hot": "Hot Shop"
} }

3
src/i18n/lang/tw.json
View File

@ -19,5 +19,6 @@
}, },
"dispoint": "優惠與活動", "dispoint": "優惠與活動",
"service": "貼心服務", "service": "貼心服務",
"school": "文化學院"
"school": "文化學院",
"hot": "熱門店鋪"
} }

3
src/i18n/lang/zh.json
View File

@ -19,5 +19,6 @@
}, },
"dispoint": "优惠与活动", "dispoint": "优惠与活动",
"service": "贴心服务", "service": "贴心服务",
"school": "文化学院"
"school": "文化学院",
"hot": "热门店铺"
} }

17
src/types/hot.d.ts
View File

@ -0,0 +1,17 @@
declare interface HotSearch {
logoCode: string
logoUrl: string
shopCode: string
shopName: string
building: string
buildingCode: string
buildingOrder: number
floor: string
floorCode: string
floorOrder: number
xaxis: string
yaxis: string
navXaxis: string
navYaxis: string
houseNumber: string
}

15
src/views/Index/Top.vue
View File

@ -1,7 +1,7 @@
<template> <template>
<Transition name="zoom"> <Transition name="zoom">
<div class="top-container"> <div class="top-container">
<div class="top-item">
<div class="top-item" @click="show = true">
<div class="top"> <div class="top">
<img src="@/assets/images/index/search.png" alt="" /> <img src="@/assets/images/index/search.png" alt="" />
</div> </div>
@ -9,7 +9,7 @@
{{ $t('search_home') }} {{ $t('search_home') }}
</div> </div>
</div> </div>
<div v-for="item in fac" :key="item.code" class="top-item">
<div v-for="item in fac" :key="item.code" class="top-item" @click="handleFacility(item)">
<div class="top"> <div class="top">
<img v-if="item.abbreviation === 'xsj'" src="@/assets/images/index/toilet.png" alt="" /> <img v-if="item.abbreviation === 'xsj'" src="@/assets/images/index/toilet.png" alt="" />
<img v-if="item.abbreviation === 'tcc'" src="@/assets/images/index/parking.png" alt="" /> <img v-if="item.abbreviation === 'tcc'" src="@/assets/images/index/parking.png" alt="" />
@ -21,17 +21,26 @@
</div> </div>
</div> </div>
</Transition> </Transition>
<Search v-if="show" @close="close" />
</template> </template>
<script setup lang="ts"> <script setup lang="ts">
import { toRefs, computed } from 'vue'
import { ref, toRefs, computed } from 'vue'
import { useRootStore } from '@/store/root' import { useRootStore } from '@/store/root'
import { useFacilityNav } from '@/composables/useFacilityNav'
import Search from '@/components/Search/Search.vue'
const store = useRootStore() const store = useRootStore()
const { facilityList } = toRefs(store) const { facilityList } = toRefs(store)
const { handleFacility } = useFacilityNav() //公共设施导航
const fac = computed(() => { const fac = computed(() => {
return facilityList.value.filter(item => item.abbreviation === 'xsj' || item.abbreviation === 'tcc' || item.abbreviation === 'fwt') return facilityList.value.filter(item => item.abbreviation === 'xsj' || item.abbreviation === 'tcc' || item.abbreviation === 'fwt')
}) })
const show = ref(false)
function close() {
show.value = false
}
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>

16
src/views/ServiceList/ServiceList.vue
View File

@ -10,20 +10,32 @@
</div> </div>
</div> </div>
</Transition> </Transition>
<div class="btn">
<div class="btn" @click="go">
<span class="text">导航至</span> <span class="text">导航至</span>
<span class="textC">服务台</span> <span class="textC">服务台</span>
</div> </div>
</template> </template>
<script setup lang="ts"> <script setup lang="ts">
import { ref } from 'vue'
import { ref, toRefs } from 'vue'
import { useRootStore } from '@/store/root'
import { getServiceList } from '@/http/api/serviceList/index' import { getServiceList } from '@/http/api/serviceList/index'
import { useFacilityNav } from '@/composables/useFacilityNav'
const store = useRootStore()
const { facilityList } = toRefs(store)
const { handleFacility } = useFacilityNav() //公共设施导航
// 服务信息 // 服务信息
const serviceList = ref<ServiceInfo[]>([]) const serviceList = ref<ServiceInfo[]>([])
getServiceList().then(({ data }) => { getServiceList().then(({ data }) => {
serviceList.value = data.serveList serviceList.value = data.serveList
}) })
function go() {
const arr = facilityList.value.filter(item => item.abbreviation === 'fwt')
if (arr.length !== 0) {
handleFacility(arr[0])
}
}
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>

Write Preview
Loading…
Cancel
Save