feat 今年游客总数弹窗
This commit is contained in:
@@ -132,3 +132,11 @@ export function getVideCollectCateSort(data) {
|
|||||||
data
|
data
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
//今年游客总数
|
||||||
|
export function getSpotVisitor(data) {
|
||||||
|
return request({
|
||||||
|
url: '/fjtcc-api/api/largeScreen/spot/spotVisitor',
|
||||||
|
method: 'get',
|
||||||
|
data
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|||||||
@@ -268,9 +268,9 @@
|
|||||||
|
|
||||||
</div>
|
</div>
|
||||||
<div class="list">
|
<div class="list">
|
||||||
<div class="item" v-for="(item, index) in 10" :key="index">
|
<div class="item" v-for="(item, index) in orderedScenicData" :key="index">
|
||||||
<div>白帝城</div>
|
<div>{{item.name}}</div>
|
||||||
<div>1000</div>
|
<div>{{item.value}}</div>
|
||||||
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
@@ -287,7 +287,7 @@
|
|||||||
import { Vue3SeamlessScroll } from 'vue3-seamless-scroll'
|
import { Vue3SeamlessScroll } from 'vue3-seamless-scroll'
|
||||||
|
|
||||||
import ScrollNumber from '@/components/ScrollNumber/index.vue'
|
import ScrollNumber from '@/components/ScrollNumber/index.vue'
|
||||||
import { getSpotListApi, getBaiduMapApi, getBaiduMapCrowdedApi } from '@/api/home'
|
import { getSpotListApi, getBaiduMapApi, getBaiduMapCrowdedApi,getSpotVisitor } from '@/api/home'
|
||||||
import occupancy from './occupancy'
|
import occupancy from './occupancy'
|
||||||
import icon8 from '@/assets/images/icon-8.png'
|
import icon8 from '@/assets/images/icon-8.png'
|
||||||
import icon9 from '@/assets/images/icon-9.png'
|
import icon9 from '@/assets/images/icon-9.png'
|
||||||
@@ -314,6 +314,19 @@
|
|||||||
spotList.value = res.data
|
spotList.value = res.data
|
||||||
getBaiduMap()
|
getBaiduMap()
|
||||||
}
|
}
|
||||||
|
const visitorList = ref([])
|
||||||
|
const scenicOrder = ['白帝城·瞿塘峡', '三峡之巅', '龙桥河'];
|
||||||
|
const orderedScenicData = computed(() => {
|
||||||
|
return scenicOrder.map(name => ({
|
||||||
|
name: name, // 景点名(键)
|
||||||
|
value: visitorList.value[name] // 对应数值(值)
|
||||||
|
}));
|
||||||
|
});
|
||||||
|
const getSpotVisitorList = async () => {
|
||||||
|
let res = await getSpotVisitor()
|
||||||
|
visitorList.value = res.data
|
||||||
|
console.log(res,'getSpotVisitor')
|
||||||
|
}
|
||||||
const getBaiduMap = async () => {
|
const getBaiduMap = async () => {
|
||||||
let res = await getBaiduMapApi({
|
let res = await getBaiduMapApi({
|
||||||
nodeid: 7162
|
nodeid: 7162
|
||||||
@@ -515,7 +528,7 @@
|
|||||||
|
|
||||||
onMounted(() => {
|
onMounted(() => {
|
||||||
getSpotList()
|
getSpotList()
|
||||||
|
getSpotVisitorList()
|
||||||
})
|
})
|
||||||
</script>
|
</script>
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
@@ -543,7 +556,7 @@
|
|||||||
width: 100%;
|
width: 100%;
|
||||||
margin-top: vh(20);
|
margin-top: vh(20);
|
||||||
.header {
|
.header {
|
||||||
height: vh(28);
|
height: vh(80);
|
||||||
font-weight: 400;
|
font-weight: 400;
|
||||||
font-size: font-vw(20);
|
font-size: font-vw(20);
|
||||||
color: #fff;
|
color: #fff;
|
||||||
@@ -574,7 +587,7 @@
|
|||||||
border-radius: 5px; /* 滑块的圆角 */
|
border-radius: 5px; /* 滑块的圆角 */
|
||||||
}
|
}
|
||||||
.item {
|
.item {
|
||||||
height: vh(50);
|
height: vh(80);
|
||||||
font-weight: 400;
|
font-weight: 400;
|
||||||
font-size: font-vw(14);
|
font-size: font-vw(14);
|
||||||
color: #f1f7ff;
|
color: #f1f7ff;
|
||||||
|
|||||||
Reference in New Issue
Block a user