118 lines
3.6 KiB
Vue
118 lines
3.6 KiB
Vue
<template>
|
|
<view class="summaryOfPortraitsMain">
|
|
<view class="summaryTab" :style="{top: (menu.bottom + 18) + 'px'}">
|
|
<sliderPage :index="selectPortrait" @handleChangeIndex="handleChangeIndex"/>
|
|
</view>
|
|
<swiper v-if="isShowSwiper" class="summaryOfPortraitsBox" @change="handleChangeSelect" :current="selectPortrait">
|
|
<!-- 服务区基本信息 0-->
|
|
<swiper-item class="swiperItem">
|
|
<mapDetail :selectIndex="selectPortrait"/>
|
|
</swiper-item>
|
|
<!-- 车流预警 1-->
|
|
<swiper-item class="swiperItem">
|
|
<carPortrait :selectIndex="selectPortrait" :serviceInfo="serviceInfo"/>
|
|
</swiper-item>
|
|
<!-- 客群画像 2-->
|
|
<swiper-item class="swiperItem">
|
|
<guestPortrait :selectIndex="selectPortrait"/>
|
|
</swiper-item>
|
|
<!-- 经营画像 3-->
|
|
<swiper-item class="swiperItem">
|
|
<managePortrait :selectIndex="selectPortrait"/>
|
|
</swiper-item>
|
|
<!-- 交易画像 4-->
|
|
<swiper-item class="swiperItem">
|
|
<businessPortrait :selectIndex="selectPortrait"/>
|
|
</swiper-item>
|
|
<!-- 业态品牌 5-->
|
|
<swiper-item class="swiperItem">
|
|
<formatPortraitBI v-if="serviceInfo.SERVERPART_NAME!=='安徽驿达'" :selectIndex="selectPortrait"/>
|
|
<formatPortrait v-else :selectIndex="selectPortrait" :comeType="'summaryOfPortraits'"/>
|
|
</swiper-item>
|
|
<!-- 考评考核 6-->
|
|
<swiper-item class="swiperItem">
|
|
<newAmine :selectIndex="selectPortrait" :pageType="1"/>
|
|
</swiper-item>
|
|
<!-- 日常巡检 7-->
|
|
<swiper-item class="swiperItem">
|
|
<newAmine :selectIndex="selectPortrait" :pageType="2"/>
|
|
</swiper-item>
|
|
</swiper>
|
|
</view>
|
|
</template>
|
|
<script>
|
|
import mapDetail from "./components/mapDetail.vue";
|
|
import carPortrait from "./components/carPortrait.vue";
|
|
import guestPortrait from "./components/guestPortrait.vue";
|
|
import managePortrait from "./components/managePortrait.vue";
|
|
import businessPortrait from "./components/businessPortrait.vue"
|
|
import formatPortraitBI from "./components/formatPortraitBI.vue";
|
|
import formatPortrait from "./components/formatPortrait.vue";
|
|
import newAmine from "./components/newAmine.vue";
|
|
import sliderPage from "./components/components/sliderPage.vue";
|
|
export default {
|
|
components:{mapDetail,carPortrait,guestPortrait,managePortrait,businessPortrait,formatPortraitBI,newAmine,sliderPage,formatPortrait},
|
|
data(){
|
|
return {
|
|
selectPortrait:0,// 选择要看的商业画像
|
|
query:'',// 传入的页面元素
|
|
isShowSwiper:false,// 是否显示滑动块
|
|
menu:{},
|
|
serviceInfo:{},// 当前选中服务区
|
|
}
|
|
},
|
|
onLoad(query){
|
|
console.log('query',query)
|
|
if (query.index){
|
|
this.selectPortrait = Number(query.index)
|
|
}
|
|
console.log('onLoad')
|
|
this.menu = uni.getMenuButtonBoundingClientRect()
|
|
|
|
},
|
|
onShow(){
|
|
console.log('onShow')
|
|
this.isShowSwiper = true
|
|
let seat = uni.getStorageSync('currentService')
|
|
this.serviceInfo = seat
|
|
},
|
|
onHide(){
|
|
this.isShowSwiper = false
|
|
},
|
|
methods:{
|
|
// 商业汇总的滑动方法
|
|
handleChangeSelect(e){
|
|
console.log('e',e)
|
|
this.selectPortrait = e.detail.current
|
|
},
|
|
// 切换页码
|
|
handleChangeIndex(e){
|
|
this.selectPortrait = e
|
|
this.$forceUpdate()
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
<style scoped lang="scss">
|
|
.summaryOfPortraitsMain{
|
|
width: 100%;
|
|
height: 100%;
|
|
.summaryTab{
|
|
position: fixed;
|
|
left:0;
|
|
width: 100vw;
|
|
background: transparent;
|
|
z-index: 99;
|
|
}
|
|
.summaryOfPortraitsBox{
|
|
width: 100%;
|
|
height: 100%;
|
|
.swiperItem{
|
|
width: 100%;
|
|
height: 100%;
|
|
overflow-y: auto;
|
|
}
|
|
}
|
|
}
|
|
</style>
|