ylj/ahyd_DIB
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

update

Browse Source
This commit is contained in:
cclu 2023-12-20 18:08:13 +08:00
parent efca65f4c1
commit 3728fe28b6
7 changed files with 605 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
pages.json
View File

@ -187,6 +187,13 @@
"navigationStyle": "custom"
}
},
{
"path": "formatPortraitBI",
"style": {
"navigationBarTitleText": "",
"navigationStyle": "custom"
}
},
{
"path": "managePortrait",
"style": {

2
pages/commercialBI/commercialType.vue
View File

@ -38,7 +38,7 @@ export default {
{img:'https://eshangtech.com/ShopICO/ahyd-BID/index/guest.svg',url:'/pages/commercialBI/guestPortrait',text:'客群'},
{img:'https://eshangtech.com/ShopICO/ahyd-BID/index/business_icon.svg',url:'/pages/commercialBI/managePortrait',text:'经营'},
{img:'https://eshangtech.com/ShopICO/ahyd-BID/index/trade.svg',url:'/pages/commercialBI/businessPortrait',text:'交易'},
{img:'https://eshangtech.com/ShopICO/ahyd-BID/index/brand.svg',url:'/pages/commercialBI/formatPortrait',text:'品牌'},
{img:'https://eshangtech.com/ShopICO/ahyd-BID/index/brand.svg',url:'/pages/commercialBI/formatPortraitBI',text:'品牌'},
{img:'https://eshangtech.com/ShopICO/ahyd-BID/newCommercialBI/newExamineIcon.svg',url:`/pages/examine/detail?type=${1}`,text:'考核'},
{img:'https://eshangtech.com/ShopICO/ahyd-BID/newCommercialBI/inspectionIcon.svg',url:`/pages/examine/detail?type=${2}`,text:'巡检'},
],

592
pages/commercialBI/formatPortraitBI.vue Normal file
View File

@ -0,0 +1,592 @@
<template>
<div class="main">
<div style="position: fixed;right: 0;top: 20%;z-index:99999999999">
<commercial-type :have="4"/>
</div>
<header-top :bgUrl="bgUrl" :menu="menu" :bgColor="bgColor" :title="title" :analyseInfo="analyseInfo" :topBg="topBg" :page="page" :backType="backType"
:serverpartName="serviceInfo.SERVERPART_NAME" :spregionTypeName="serviceInfo.SPREGIONTYPE_NAME" :serviceInfo="serviceInfo"/>
<div class="charts">
<div class="chartsItem">
<div class="top">
<p class="title">{{thisMonth}}月业态充盈度</p>
<div class="time">
<div class="select">
<picker mode="date" fields="month" :value="single" :end="endData" @change="bindDateChange" >
<view class="time">
<view class="uni-input" style="background: transparent;padding: 0;height:100%">{{ single }}</view>
<image class="icon" src="/static/images/index/arrow_bottom.svg"></image>
</view>
</picker>
</div>
</div>
</div>
<div v-if="fillDegreeList.result.series[0].data.length>0">
<filling-degree :data="fillDegreeList" @handleChangeBandLevel="handleChangeBandLevel" :isClick="isClick"/>
<analyse :analyseInfo="{analysisins_type: 1502,analysisins_format: 2000}" />
</div>
<no-data v-else/>
</div>
<!-- <div class="chartsItem" style="margin-top: 32px">-->
<!-- <p class="title">品牌消费水平<text class="unit"></text></p>-->
<!-- <div v-if="bandLevelList.length>0">-->
<!-- <band-level :data="bandLevelList"/>-->
<!-- <analyse :analyseInfo="{analysisins_type: 1503,analysisins_format: 2000}" />-->
<!-- </div>-->
<!-- <no-data v-else/>-->
<!-- </div>-->
<!-- <div class="chartsItem" style="margin-top: 32px">-->
<!-- <p class="title">业态消费水平<text class="unit"></text></p>-->
<!-- <div v-if="consumLevelList.series.length>0">-->
<!-- <consumption-level :data="consumLevelList" />-->
<!-- <analyse :analyseInfo="{analysisins_type: 1504,analysisins_format: 2000}" />-->
<!-- </div>-->
<!-- <no-data v-else/>-->
<!-- </div>-->
<div class="chartsItem" style="margin-top: 32px">
<p class="title">品牌指数</p>
<div >
<div class="labelList">
<div :class="item[5]?'labelItem labelItemSelect':'labelItem labelItemUnSelect'" v-for="(item,index) in brandLabelList" :key="index" @click="changeLabel(item)">
<image class="icon" :src="item[4]"></image>
<p class="name">{{item[0]}}<text class="number">({{item[1]}})</text></p>
</div>
</div>
<band-number v-if="brandInfoList.length>0" :data="brandInfoList"/>
</div>
<no-data v-if="!brandInfoList.length"/>
</div>
</div>
</div>
</template>
<script>
import request from '@/util/index.js'
import headerTop from "./components/headerTop.vue";
import analyse from "./components/analyse.vue";
import FillingDegree from "./components/format/fillingDegree.vue";
import BandLevel from "./components/format/bandLevel.vue";
import ConsumptionLevel from "./components/format/consumLevel.vue";
import BandNumber from "./components/format/bandNumber.vue";
import NoData from "./components/noData.vue";
import commercialType from "./commercialType.vue";
export default {
name: "businessPortrait",
components: {NoData, BandNumber, ConsumptionLevel, BandLevel, FillingDegree, analyse, headerTop,commercialType},
data() {
return {
topBg:'linear-gradient(180deg, #C6C1F0 0%, #CECBF3 100%);',//顶部组件的悬浮背景色
labelList:['女性','高消费','喜爱奶茶','浙江','20-30岁','江苏'],//标签
title:'业态品牌',//页面标题
bgColor: '180deg, #459FFF 0%, #473AFF 100%',
bgUrl: 'https://eshangtech.com/ShopICO/ahyd-BID/newCommercialBI/formatPortraitBIBg.svg',//背景图片路径
page:'/pages/commercialBI/formatPortrait',
time: '',//跳转携带的时间
menu: {},//手机配置信息
fillDegreeList:[],//业态充盈度
bandLevelList:[],//品牌消费水平
consumLevelList:[],//业态消费水平
brandLabelList:[],//品牌指数标签列表
brandLabelListNoChange:[],//把第一次进来请求到的标签列表存起来
brandInfoList:[],//品牌指数列表
brandInfoListNoChange:[],//把第一次请求到的全部品牌指数列表存起来
serviceInfo:{}, //当前服务区信息
backType:'',//返回的页面类型
analyseInfo:{
analysisins_type: 1501 // 传给headTop组件的
},
selectKey:'',//有数据的话
str:'',
isClick:true,//图表是否能点击
single:'',//显示时间
thisMonth:'',//几月
endData:'', // 结束时间
}
},
onLoad(option) {
let serviceInfo = JSON.parse(option.serviceInfo)
this.backType = option.type
this.serviceInfo = serviceInfo
//跳转的时候带上时间
this.time = option.time
this.endData = new Date()
},
onShow(){
let storeTime = uni.getStorageSync('lastDay')
if (storeTime){
this.time = storeTime
}
this.single = this.$util.getThisMonthHave(this.time)
const date = new Date(this.single)
let m = date.getMonth() + 1
if (m<10){
m = '0' + m
}
this.thisMonth = m
let storeServiceInfo = uni.getStorageSync('currentService')
if (storeServiceInfo){
this.serviceInfo = storeServiceInfo
}
// 获取手机参数对页面进行适配
let systemInfo = uni.getSystemInfoSync()
// 把获取到的手机参数保存
uni.setStorageSync('phoneInfo', systemInfo)
this.statusBarHeight = Number(systemInfo.statusBarHeight)
this.menu = uni.getMenuButtonBoundingClientRect()
if (!storeServiceInfo){
this.nearestService()
}
//业态充盈度
this.getFillDegreeList()
// //品牌消费水平
// this.getBandLevelList()
// //业态消费水平
// this.getConsumLevelList()
//品牌指数列表
this.getBrandInfoList()
},
onUnload() {
this.$util.addUserBehavior()
},
methods:{
bindDateChange(e){
const date = new Date(e.detail.value)
const nowDate = new Date()
let nowMonth = nowDate.getMonth() + 1
let m = date.getMonth() + 1
this.single = e.detail.value
let d
if (nowMonth === m){
let nowYear = nowDate.getFullYear()
let nowMonth = nowDate.getMonth() +1
if (nowMonth<10){
nowMonth = '0'+ nowMonth
}
let nowDay = nowDate.getDate() - 1
if (nowDay<10){
nowDay = '0'+ nowDay
}
this.time = `${nowYear}-${nowMonth}-${nowDay}`
d = nowDay
}else{
d = this.$util.getThisMonthDay(e.detail.value)
this.time = e.detail.value + '-' + d
}
if (m<10){
m = '0' + m
}
this.thisMonth = m
this.endTime = e.detail.value + '-' + d
this.onRefresh()
console.log('this.time',this.time)
},
onRefresh(){
//业态充盈度
this.getFillDegreeList()
//品牌指数列表
this.getBrandInfoList()
},
async changeLabel(item){
console.log('item',item)
let list = this.brandLabelList
list.forEach(selectItem=>{
selectItem[5] = false
})
list.forEach(selectItem=>{
if (item[3] === selectItem[3]){
selectItem[5] = true
}else{
selectItem[5] = false
}
})
this.brandLabelList = list
let req = {
ProvinceCode:'340000',
Serverpart_ID:this.serviceInfo.Serverpart_ID,
Statistics_Date:this.time,
BusinessTradeIds:item[3],
}
let totalData = await request.$webGet('CommercialApi/BaseInfo/GetBrandAnalysis',req)
this.brandInfoList =totalData.Result_Data.ShopBrandList
this.$forceUpdate()
// 如果要多选 就下面注释的这段
// let str = ''
// list.forEach(selectItem=>{
// if (item[3] === selectItem[3]){
// if (selectItem[4]){
// selectItem[4] = false
// }else{
// selectItem[4] = true
// }
// }
// })
// this.brandLabelList = list
// let req
// let str1 = ''
// let str2 = ''
// // if(item[2] === '1000'){
// this.brandLabelList.forEach(selectItem=>{
// if (selectItem[2] === '1000'){
// if (selectItem[4]){
// if (str1 === ''){
// str1 = selectItem[3]
// }else{
// str1+=',' + selectItem[3]
// }
// }
// }else if(selectItem[2] === '2000'){
// if (selectItem[4]){
// if (str2 === ''){
// str2 = selectItem[3]
// }else{
// str2+=',' + selectItem[3]
// }
// }
// }
// })
// // }else if(item[2] === '2000'){
// // this.brandLabelList.forEach(selectItem=>{
// // if (selectItem[2] === '2000'){
// // if (selectItem[4]){
// // if (str2 === ''){
// // str2 = selectItem[3]
// // }else{
// // str2+=',' + selectItem[3]
// // }
// // }
// // }
// // })
// // }
// if (str1 && !str2){
// req = {
// ProvinceCode:'340000',
// Serverpart_ID:this.serviceInfo.Serverpart_ID,
// Statistics_Date:this.time,
// BusinessTradeIds:str1,
// }
// }else if(!str1 && str2){
// req = {
// ProvinceCode:'340000',
// Serverpart_ID:this.serviceInfo.Serverpart_ID,
// Statistics_Date:this.time,
// BrandType:str2,
// }
// }else if(str1 && str2){
// req = {
// ProvinceCode:'340000',
// Serverpart_ID:this.serviceInfo.Serverpart_ID,
// Statistics_Date:this.time,
// BusinessTradeIds:str1,
// BrandType:str2,
// }
// }
},
// 业态充盈的改变事件
async handleChangeBandLevel(key){
uni.showLoading({
title: '加载中...'
})
let req
if (key===false){
req = {
ProvinceCode:'340000',
Serverpart_ID:this.serviceInfo.Serverpart_ID,
Statistics_Date:this.time
}
this.selectKey = ''
}else{
req = {
ProvinceCode:'340000',
Serverpart_ID:this.serviceInfo.Serverpart_ID,
Statistics_Date:this.time,
BusinessTradeIds:key
}
this.selectKey = key
}
let totalData = await request.$webGet('CommercialApi/BaseInfo/GetBrandAnalysis',req)
if (totalData.Result_Data){
this.brandLabelList = totalData.Result_Data.BrandTag
this.brandInfoList =totalData.Result_Data.ShopBrandList
uni.hideLoading()
}
},
async nearestService(){
let seat = uni.getStorageSync('seatInfo');
let req = {
longitude:seat.longitude,
Province_Code:'340000',
latitude:seat.latitude,
}
const data = await request.$webGet('CommercialApi/BaseInfo/GetServerpartList',req)
let res = {
SERVERPART_NAME:data.Result_Data.List[0].SERVERPART_NAME,//服务区
SPREGIONTYPE_NAME:data.Result_Data.List[0].SPREGIONTYPE_NAME,//片区
Serverpart_ID:data.Result_Data.List[0].SERVERPART_ID,
longitude:data.Result_Data.List[0].SERVERPART_X,
latitude:data.Result_Data.List[0].SERVERPART_Y,
}
uni.setStorageSync('currentService',res)
},
async getFillDegreeList(){
const req = {
ProvinceCode:'340000',
StatisticsDate:this.time,
serverpartId:this.serviceInfo.Serverpart_ID,
BusinessTradeIds:-1
}
const data = await request.$webGet('CommercialApi/Revenue/GetBusinessTradeRevenue',req)
let res = []
let all = 0
data.Result_Data.BusinessTradeRank.forEach((item,index)=>{
if (index<=10){
res.push({name:`${item.name} ${item.value}%`,value:Number(item.value),key:item.key})
all+=Number(item.value)
}else if(index===11){
res.push({name:`其他${(100-all).toFixed(2)}%`,value:Number((100 - all).toFixed(2)),key:item.key})
}
})
let result= {
series: [
{
data:res
}
]
};
let obj = {
result:result,
Abundant:data.Result_Data.Abundant//是否盈足
}
// let res = {
// series: [
// {
// data: [{"name":"商超","value":27.6},
// {"name":"水果饮品","value":20.7},
// {"name":"餐饮","value":15.5},
// {"name":"小吃","value":11.9},
// {"name":"地方特产","value":8.4},
// {"name":"连锁品牌","value":7.2},
// {"name":"粽子","value":5.6},
// {"name":"箱包工艺","value":3.1}]
// }
// ]
// }
this.fillDegreeList = obj
},
async getBandLevelList(){
let req = {
ProvinceCode:'340000',
StatisticsDate:this.time,
ServerpartId:this.serviceInfo.Serverpart_ID,
ShowWholeBrand:false
}
let res =[]
let totalData = await request.$webGet('CommercialApi/Revenue/GetBusinessBrandLevel',req)
totalData.Result_Data.legend.forEach(item=>{
res.push({name:item,small:0,normal:0,big:0})
})
res.forEach((item,index)=>{
totalData.Result_Data.ColumnList.forEach((subItem,subIndex)=>{
if (subItem.name==='低消费'){
item.small = subItem.data[index]
}else if(subItem.name==='普通消费'){
item.normal = subItem.data[index]
}else if(subItem.name==='高消费'){
item.big = subItem.data[index]
}
})
})
// let res=[{name:'五芳斋',big:'14.8',normal:'41.7',small:'43.5'},
// {name:'驿佰购',big:'44.1',normal:'31.7',small:'24.2'},
// {name:'老娘舅',big:'15.2',normal:'70.1',small:'14.5'},
// {name:'吉祥馄饨',big:'25.2',normal:'39.9',small:'34.7'}]
this.bandLevelList = res
},
async getConsumLevelList(){
let req = {
ProvinceCode:'340000',
StatisticsDate:this.time,
ServerpartId:this.serviceInfo.Serverpart_ID,
ShowWholeTrade:false
}
let res = {
categories:[],
series:[]
}
let totalData = await request.$webGet('CommercialApi/Revenue/GetBusinessTradeLevel',req)
res.categories = totalData.Result_Data.legend
totalData.Result_Data.ColumnList.forEach(item=>{
res.series.push({name:item.name,data:item.data})
})
// let res = {
// categories:["商超","餐饮","水果饮品","小吃","连锁品牌"],
// series: [
// {
// name: "低消费",
// textColor: "#FFFFFF",
// data: [18,27,21,24,6]
// },
// {
// name: "普通消费",
// textColor: "#FFFFFF",
// data: [18,27,21,24,6]
// },
// {
// name: "高消费",
// textColor: "#FFFFFF",
// data: [64,46,58,52,88]
// },
// ]
// }
this.consumLevelList = res
},
async getBrandInfoList(){
let req = {
ProvinceCode:'340000',
Serverpart_ID:this.serviceInfo.Serverpart_ID,
Statistics_Date:this.time
}
let totalData = await request.$webGet('CommercialApi/BaseInfo/GetBrandAnalysis',req)
this.brandLabelList = totalData.Result_Data.BrandTag
this.brandLabelListNoChange = totalData.Result_Data.BrandTag
this.brandInfoList =totalData.Result_Data.ShopBrandList
this.brandInfoListNoChange = totalData.Result_Data.ShopBrandList
console.log('this.brandInfoList',this.brandInfoList)
// let res = [{icon:'',name:'老娘舅',company:'老娘舅餐饮股份有限公司',type:0,time:'2019.03-2022.03',label:["中式快餐","30-40岁男性"],info:[9,8,8]},
// {icon:'',name:'老乡鸡',company:'老乡鸡餐饮股份有限公司',type:1,time:'2019.03-2022.03',label:["中式快餐","30-40岁男性"],info:[9,9,9]},
// {icon:'',name:'永和大王',company:'永和大王餐饮股份有限公司',type:2,time:'2019.03-2022.03',label:["中式快餐","30-40岁男性"],info:[8,8,8]}]
}
}
}
</script>
<style scoped lang="scss">
.main {
width: 100vw;
min-height: 100vh;
.charts{
width: 100%;
box-sizing: border-box;
padding: 28px 16px 24px;
background: #fff;
.chartsItem{
.top{
display: flex;
justify-content: space-between;
align-items: center;
.title{
font-size: 17px;
font-family: PingFangSC-Semibold, PingFang SC;
font-weight: 600;
color: #160002;
line-height: 24px;
.unit{
font-size: 14px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #786B6C;
line-height: 20px;
margin-left: 4px;
}
}
.time{
margin-bottom: 4px;
.select{
margin-left: 8px;
display: inline-block;
.time {
display: flex;
align-items: center;
margin-right: 4px;
.day {
font-size: 32rpx;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #782717;
line-height: 44rpx;
margin-right: 4px;
}
.uni-input {
font-size: 14px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #ae664e;
line-height: 36rpx;
}
.icon {
width: 24px;
height: 16px;
}
}
}
}
}
.title{
font-size: 17px;
font-family: PingFangSC-Semibold, PingFang SC;
font-weight: 600;
color: #160002;
line-height: 24px;
.unit{
font-size: 14px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #786B6C;
line-height: 20px;
margin-left: 4px;
}
}
.labelList{
display: flex;
align-items: center;
flex-flow: wrap;
margin-top: 12px;
.labelItem{
border-radius: 4px;
padding:2px 6px;
margin-right: 6px;
margin-bottom: 6px;
box-sizing: border-box;
display: flex;
align-items: center;
.icon{
width: 16px;
height: 16px;
margin-right: 4px;
}
.name{
font-size: 14px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #160002;
line-height: 20px;
.number{
font-size: 14px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #A69E9F;
line-height: 20px;
margin-left: 4px;
}
}
}
.labelItemSelect{
border:1px solid #ccc;
background: rgba(202, 208, 218, 0.5)
}
.labelItemUnSelect{
border:1px solid #ccc;
background: rgba(237, 239, 244, 0.2)
}
}
}
}
}
</style>

4
pages/commercialBI/managePortrait.vue
View File

@ -43,7 +43,7 @@
</view>
</view>
<div class="progressPlan">
<div class="trans" :style="{width:plan.percentageMonth + '%'}"></div>
<div class="trans" :style="{width:`${plan.percentageMonth>=100?100:plan.percentageMonth}%`}"></div>
<!-- <div class=pro :style="{width:(100 - plan.percentageMonth)+ '%'}"></div>-->
<!-- <view class="trans" :style="{width: plan.percentageMonth + '%'}"></view>-->
<!-- <image class="img" src="https://eshangtech.com/ShopICO/ahyd-BID/index/progress_orange.png"></image>-->
@ -92,7 +92,7 @@
</view>
</view>
<div class="progressPlan">
<div class="transYear" :style="{width:plan.percentageYear + '%'}"></div>
<div class="transYear" :style="{width:`${plan.percentageYear>=100?100:plan.percentageYear}%`}"></div>
<!-- <image class="img" :style="{width: plan.percentageYear + '%'}" src="https://eshangtech.com/ShopICO/ahyd-BID/index/progress_blue.png"></image>-->
<!-- <div class=pro :style="{width:(100 - plan.percentageYear)+ '%'}"></div>-->
</div>

2
pages/examine/commercialType.vue
View File

@ -38,7 +38,7 @@ export default {
{img:'https://eshangtech.com/ShopICO/ahyd-BID/index/guest.svg',url:'/pages/commercialBI/guestPortrait',text:'客群'},
{img:'https://eshangtech.com/ShopICO/ahyd-BID/index/business_icon.svg',url:'/pages/commercialBI/managePortrait',text:'经营'},
{img:'https://eshangtech.com/ShopICO/ahyd-BID/index/trade.svg',url:'/pages/commercialBI/businessPortrait',text:'交易'},
{img:'https://eshangtech.com/ShopICO/ahyd-BID/index/brand.svg',url:'/pages/commercialBI/formatPortrait',text:'品牌'},
{img:'https://eshangtech.com/ShopICO/ahyd-BID/index/brand.svg',url:'/pages/commercialBI/formatPortraitBI',text:'品牌'},
{img:'https://eshangtech.com/ShopICO/ahyd-BID/newCommercialBI/newExamineIcon.svg',url:`/pages/examine/detail?type=${1}`,text:'考核'},
{img:'https://eshangtech.com/ShopICO/ahyd-BID/newCommercialBI/inspectionIcon.svg',url:`/pages/examine/detail?type=${2}`,text:'巡检'},
],

2
pages/index/index.vue
View File

@ -337,7 +337,7 @@
</view>
<view class="funEntry">
<span @click="handleGoProject">111</span>
<!-- <span @click="handleGoProject">111</span>-->
<!-- 八个有背景的导航栏-->
<view class="funBox">
<view class="firstBox">

2
pages/map/commercialType.vue
View File

@ -38,7 +38,7 @@ export default {
{img:'https://eshangtech.com/ShopICO/ahyd-BID/index/guest.svg',url:'/pages/commercialBI/guestPortrait',text:'客群'},
{img:'https://eshangtech.com/ShopICO/ahyd-BID/index/business_icon.svg',url:'/pages/commercialBI/managePortrait',text:'经营'},
{img:'https://eshangtech.com/ShopICO/ahyd-BID/index/trade.svg',url:'/pages/commercialBI/businessPortrait',text:'交易'},
{img:'https://eshangtech.com/ShopICO/ahyd-BID/index/brand.svg',url:'/pages/commercialBI/formatPortrait',text:'品牌'},
{img:'https://eshangtech.com/ShopICO/ahyd-BID/index/brand.svg',url:'/pages/commercialBI/formatPortraitBI',text:'品牌'},
{img:'https://eshangtech.com/ShopICO/ahyd-BID/newCommercialBI/newExamineIcon.svg',url:`/pages/examine/detail?type=${1}`,text:'考核'},
{img:'https://eshangtech.com/ShopICO/ahyd-BID/newCommercialBI/inspectionIcon.svg',url:`/pages/examine/detail?type=${2}`,text:'巡检'},
],