Skip to content
Toggle navigation
Projects
Groups
Snippets
Help
Toggle navigation
This project
Loading...
Sign in
蒋秀川
/
miniProject
Go to a project
Project
Repository
Issues
0
Merge Requests
0
Pipelines
Wiki
Settings
Activity
Graph
Charts
Create a new issue
Jobs
Commits
Issue Boards
Files
Commits
Branches
Tags
Contributors
Graph
Compare
Charts
Commit c5b4129e
authored
Jun 13, 2023
by
李君
Browse Files
Options
Browse Files
Tag
Download
Email Patches
Plain Diff
集团首页
1 parent
f5a7da44
Show whitespace changes
Inline
Side-by-side
Showing
4 changed files
with
150 additions
and
175 deletions
miniProject/api/shop.js
miniProject/index/index.js
miniProject/index/index.wxml
miniProject/index/index.wxss
miniProject/api/shop.js
View file @
c5b4129
...
@@ -20,13 +20,25 @@ module.exports = {
...
@@ -20,13 +20,25 @@ module.exports = {
getShopDetailData
(
userId
,
params
)
{
getShopDetailData
(
userId
,
params
)
{
return
http
.
get
(
`/report/users/
${
userId
}
`
,
params
);
return
http
.
get
(
`/report/users/
${
userId
}
`
,
params
);
},
},
getPermission
(
id
){
getPermission
(
id
)
{
return
http
.
get
(
`/report/auth/api/v1/auth/users/
${
id
}
`
);
return
http
.
get
(
`/report/auth/api/v1/auth/users/
${
id
}
`
);
},
},
editUserInfo
(
params
){
editUserInfo
(
params
)
{
return
http
.
post
(
`/report/users/
${
params
.
userId
}
`
,
params
);
return
http
.
post
(
`/report/users/
${
params
.
userId
}
`
,
params
);
},
},
editUserPwd
(
params
){
editUserPwd
(
params
)
{
return
http
.
post
(
`/report/users/updateUser`
,
params
);
return
http
.
post
(
`/report/users/updateUser`
,
params
);
}
},
// 集团首页卡片信息
getAccountCard
(
params
)
{
return
http
.
get
(
`/report/wechat/account/index/info`
,
params
);
},
// 集团首页客流趋势分析
getAccountTrafficTrend
(
params
)
{
return
http
.
get
(
`/report/wechat/account/index/trafficTrend`
,
params
);
},
// 集团首页门店排行
getAccountMallRank
(
params
)
{
return
http
.
get
(
`/report/wechat/account/index/mall/rank`
,
params
);
},
}
}
\ No newline at end of file
\ No newline at end of file
miniProject/index/index.js
View file @
c5b4129
import
{
import
{
getCardData
,
getTrendData
,
getStopTimeData
,
getStopTimeData
,
getAgeSexData
,
getAccountCard
,
getShopDetailData
getAccountTrafficTrend
,
getAccountMallRank
}
from
'../api/shop'
}
from
'../api/shop'
import
moment
from
'moment'
import
moment
from
'moment'
Component
({
Component
({
pageLifetimes
:
{
pageLifetimes
:
{
show
()
{
show
()
{
setTimeout
(()
=>
{
this
.
loadData
()
// console.log(8888)
this
.
setData
({
chartData
:
this
.
getLineConfig
(),
//客流趋势分析数据
chartDatastop
:
this
.
getStopTimeConfig
(),
selectName
:
wx
.
getStorageSync
(
'accountName'
)
})
},
1000
)
if
(
typeof
this
.
getTabBar
===
'function'
&&
this
.
getTabBar
())
{
if
(
typeof
this
.
getTabBar
===
'function'
&&
this
.
getTabBar
())
{
this
.
getTabBar
().
setData
({
this
.
getTabBar
().
setData
({
// 当前页面的 tabBar 索引
// 当前页面的 tabBar 索引
...
@@ -26,28 +18,20 @@ Component({
...
@@ -26,28 +18,20 @@ Component({
}
}
},
},
data
:
{
data
:
{
selectName
:
''
,
//集团名称
openMllNum
:
0
,
//开业门店数
exposure
:
0
,
//路过客流量
traffic
:
0
,
//客流量
customer
:
0
,
//顾客人数
entryRate
:
0
,
//进店率
currentTime
:
moment
().
format
(
"YYYY-MM-DD"
),
currentTime
:
moment
().
format
(
"YYYY-MM-DD"
),
types
:
1
,
//选中的时间类型
types
:
1
,
//选中的时间类型
trendtypes
:
1
,
//选中的业态
趋势类型
trendtypes
:
'PassengerFlow'
,
//选中的客流
趋势类型
chartData
:
{},
//客流趋势分析数据
chartData
:
{},
//客流趋势分析数据
chartDatastop
:
{},
//停留时长统计
show
:
false
,
//显示日期自定义选择
show
:
false
,
//显示日期自定义选择
minDate
:
new
Date
(
2022
,
0
,
1
).
getTime
(),
//自定义时间的开始日期
minDate
:
new
Date
(
2022
,
0
,
1
).
getTime
(),
//自定义时间的开始日期
maxDate
:
new
Date
(
2022
,
11
,
31
).
getTime
(),
//自定义时间的结束日期
maxDate
:
new
Date
(
2022
,
11
,
31
).
getTime
(),
//自定义时间的结束日期
// maxDate: new Date(2025, 11, 31).getTime(), //自定义时间的结束日期
rankData
:
[],
rankData
:
[{
name
:
'我婆婆呃呃呃'
,
value
:
2000
,
percentage
:
80
},
{
name
:
'我婆婆呃呃呃'
,
value
:
2000
,
percentage
:
80
},
{
name
:
'我婆婆呃呃呃'
,
value
:
2000
,
percentage
:
80
}],
indexVal
:
'PassengerFlow'
,
indexVal
:
'PassengerFlow'
,
indexList
:
[{
indexList
:
[{
name
:
'客流量'
,
name
:
'客流量'
,
...
@@ -86,6 +70,8 @@ Component({
...
@@ -86,6 +70,8 @@ Component({
clickIndex
(
event
)
{
clickIndex
(
event
)
{
this
.
setData
({
this
.
setData
({
indexVal
:
event
.
target
.
dataset
.
val
indexVal
:
event
.
target
.
dataset
.
val
},()
=>
{
this
.
getMallRank
()
});
});
},
},
// 点击自定义日期选择器的确定
// 点击自定义日期选择器的确定
...
@@ -137,7 +123,6 @@ Component({
...
@@ -137,7 +123,6 @@ Component({
},
},
// 获取卡片数据
// 获取卡片数据
getCardList
()
{
getCardList
()
{
// console.log(this.data.currentTime,this.data.selectId,this.data.selectName)
let
startTime
=
this
.
data
.
currentTime
,
let
startTime
=
this
.
data
.
currentTime
,
endTime
=
this
.
data
.
currentTime
endTime
=
this
.
data
.
currentTime
if
(
this
.
data
.
currentTime
.
includes
(
'至'
))
{
if
(
this
.
data
.
currentTime
.
includes
(
'至'
))
{
...
@@ -145,24 +130,81 @@ Component({
...
@@ -145,24 +130,81 @@ Component({
startTime
=
timeArr
[
0
]
startTime
=
timeArr
[
0
]
endTime
=
timeArr
[
1
]
endTime
=
timeArr
[
1
]
}
}
console
.
log
(
startTime
,
endTime
)
getAccountCard
({
getCardData
().
then
(
res
=>
{})
accountId
:
wx
.
getStorageSync
(
'accountId'
),
startDate
:
startTime
,
endDate
:
endTime
,
}).
then
(
res
=>
{
this
.
setData
({
selectName
:
res
.
data
.
name
,
openMllNum
:
res
.
data
.
openMllNum
,
exposure
:
res
.
data
.
exposure
,
traffic
:
res
.
data
.
traffic
,
customer
:
res
.
data
.
customer
,
entryRate
:
res
.
data
.
entryRate
,
})
})
},
},
// 获取
业态客流趋势
// 获取
客流趋势分析
getTrendList
()
{
getTrendList
()
{
getTrendData
().
then
(
res
=>
{})
// wx.showLoading();
let
startTime
=
this
.
data
.
currentTime
,
endTime
=
this
.
data
.
currentTime
if
(
this
.
data
.
currentTime
.
includes
(
'至'
))
{
let
timeArr
=
this
.
data
.
currentTime
.
split
(
'至'
)
startTime
=
timeArr
[
0
]
endTime
=
timeArr
[
1
]
}
getAccountTrafficTrend
({
accountId
:
wx
.
getStorageSync
(
'accountId'
),
startDate
:
startTime
,
endDate
:
endTime
,
dataLevel
:
'hour'
,
dataIndex
:
this
.
data
.
trendtypes
}).
then
(
res
=>
{
setTimeout
(()
=>
{
this
.
setData
({
chartData
:
this
.
getLineConfig
(
res
.
data
)
},()
=>
{
// wx.hideLoading();
})
},
1000
)
})
},
},
// 获取停留时长统计
// 获取门店排行
getStopTimeList
()
{
getMallRank
(){
getStopTimeData
().
then
(
res
=>
{})
let
startTime
=
this
.
data
.
currentTime
,
endTime
=
this
.
data
.
currentTime
if
(
this
.
data
.
currentTime
.
includes
(
'至'
))
{
let
timeArr
=
this
.
data
.
currentTime
.
split
(
'至'
)
startTime
=
timeArr
[
0
]
endTime
=
timeArr
[
1
]
}
getAccountMallRank
({
accountId
:
wx
.
getStorageSync
(
'accountId'
),
startDate
:
startTime
,
endDate
:
endTime
,
dataIndex
:
this
.
data
.
indexVal
}).
then
(
res
=>
{
let
rankData
=
res
.
data
;
let
maxVal
=
Math
.
max
.
apply
(
Math
,
rankData
.
map
((
o
)
=>
{
return
o
.
value
}))
rankData
.
forEach
(
item
=>
{
item
.
percentage
=
parseInt
(
item
.
value
*
100
/
maxVal
);
})
this
.
setData
({
rankData
})
})
},
},
// 获取所有数据
// 获取所有数据
loadData
()
{
loadData
()
{
this
.
getCardList
()
this
.
getCardList
()
this
.
getTrendList
()
this
.
getTrendList
()
this
.
get
StopTimeList
()
this
.
get
MallRank
()
},
},
//点击
业态客流趋势top5中的
tab触发
//点击
客流趋势
tab触发
ClickPassageFlow
(
e
)
{
ClickPassageFlow
(
e
)
{
this
.
setData
({
this
.
setData
({
trendtypes
:
e
.
target
.
dataset
.
type
trendtypes
:
e
.
target
.
dataset
.
type
...
@@ -172,22 +214,21 @@ Component({
...
@@ -172,22 +214,21 @@ Component({
},
},
// 返回趋势图配置项
// 返回趋势图配置项
getLineConfig
(
res
)
{
getLineConfig
(
res
)
{
// let xasix = res.xaxis.data
let
xasix
=
res
.
xaxis
.
data
||
[]
// let legendList = res.series.map(item => item.name)
let
seriesList
=
res
.
series
||
[]
// let seriesList = res.series
if
(
seriesList
.
length
<
1
)
{
// if (seriesList.length < 1) {
return
{
// return {
title
:
{
// title: {
text
:
'暂无数据'
,
// text: '暂无数据',
x
:
'center'
,
// x: 'center',
y
:
'center'
,
// y: 'center',
textStyle
:
{
// textStyle: {
fontSize
:
16
,
// fontSize: 16,
fontWeight
:
'normal'
,
// fontWeight: 'normal',
}
// }
}
// }
}
// }
}
// }
return
{
return
{
grid
:
{
grid
:
{
top
:
30
,
top
:
30
,
...
@@ -207,7 +248,7 @@ Component({
...
@@ -207,7 +248,7 @@ Component({
formatter
:
function
(
params
)
{
formatter
:
function
(
params
)
{
let
html
=
''
let
html
=
''
params
.
forEach
(
item
=>
{
params
.
forEach
(
item
=>
{
html
+=
item
.
axisValue
+
'\n'
+
item
.
seriesName
+
': '
+
item
.
value
html
+=
item
.
axisValue
+
': '
+
item
.
value
})
})
return
html
return
html
}
}
...
@@ -226,7 +267,7 @@ Component({
...
@@ -226,7 +267,7 @@ Component({
width
:
1
width
:
1
}
}
},
},
data
:
[
"Mon"
,
"Tue"
,
"Wed"
,
"Thu"
,
"Fri"
,
"Sat"
,
"Sun"
]
data
:
xasix
},
},
yAxis
:
{
yAxis
:
{
type
:
'value'
,
type
:
'value'
,
...
@@ -242,12 +283,10 @@ Component({
...
@@ -242,12 +283,10 @@ Component({
},
},
},
},
axisTick
:
{
axisTick
:
{
show
:
true
,
show
:
true
},
},
axisLine
:
{
axisLine
:
{
show
:
false
,
show
:
false
},
},
splitLine
:
{
splitLine
:
{
show
:
false
show
:
false
...
@@ -256,10 +295,21 @@ Component({
...
@@ -256,10 +295,21 @@ Component({
color
:
[
'#FD8C5E'
,
'#6FD3FF'
,
'#BC7FF8'
,
'#4F75FF'
,
'#FF9AC1'
],
color
:
[
'#FD8C5E'
,
'#6FD3FF'
,
'#BC7FF8'
,
'#4F75FF'
,
'#FF9AC1'
],
// series:seriesList.map(item=>({...item,symbol: 'none',smooth: true,}))
// series:seriesList.map(item=>({...item,symbol: 'none',smooth: true,}))
series
:
[{
series
:
[{
name
:
'客流量'
,
smooth
:
true
,
smooth
:
true
,
lineStyle
:
{
lineStyle
:
{
color
:
'#34BFFF'
color
:
{
type
:
'linear'
,
x
:
0
,
y
:
0
,
x2
:
1
,
y2
:
0
,
colorStops
:
[{
offset
:
0
,
color
:
'#6384FF'
// 0% 处的颜色
},
{
offset
:
1
,
color
:
'#34BFFF'
// 100% 处的颜色
}],
globalCoord
:
false
}
},
},
areaStyle
:
{
areaStyle
:
{
// 区域颜色
// 区域颜色
...
@@ -280,7 +330,7 @@ Component({
...
@@ -280,7 +330,7 @@ Component({
]
]
},
},
},
},
data
:
[
820
,
932
,
901
,
934
,
1290
,
1330
,
1320
]
,
data
:
seriesList
[
0
].
data
,
type
:
"line"
,
type
:
"line"
,
symbol
:
"none"
,
symbol
:
"none"
,
showSymbol
:
false
,
showSymbol
:
false
,
...
@@ -288,100 +338,5 @@ Component({
...
@@ -288,100 +338,5 @@ Component({
}]
}]
}
}
},
},
// 返回停留时长配置
getStopTimeConfig
(
confingData
)
{
let
data_sample
=
[
[
"type"
,
"停留时长"
,
''
],
[
"进样"
,
50
,
200
],
[
"离心"
,
10
,
200
],
[
"去盖"
,
30
,
200
],
[
"侧轨"
,
15
,
200
],
[
"侧轨1"
,
15
,
200
],
[
"侧轨2"
,
15
,
200
],
[
"侧轨3"
,
15
,
200
],
[
"出样"
,
18
,
200
]
];
// let data_sample = [];
// confingData.xaxis.data.forEach((item, i) => {
// let arr = [];
// arr[0] = item;
// arr[1] = confingData.series[0].data[i];
// arr[2] = 100;
// data_sample.push(arr);
// });
// data_sample.unshift(["type", confingData.title, ""]);
return
{
color
:
[
"#33CCFF"
,
"#CCEEFF"
],
legend
:
{
show
:
false
},
grid
:
{
left
:
"3%"
,
right
:
"4%"
,
bottom
:
"3%"
,
top
:
"10px"
,
containLabel
:
true
},
xAxis
:
{
type
:
"value"
,
// boundaryGap: [0, 0.01],
axisLine
:
{
show
:
false
},
splitLine
:
{
show
:
false
},
axisTick
:
{
show
:
false
},
axisLabel
:
{
show
:
false
}
},
yAxis
:
{
type
:
"category"
,
inverse
:
true
,
axisLine
:
{
show
:
false
},
splitLine
:
{
show
:
false
},
axisTick
:
{
show
:
false
}
},
dataset
:
{
source
:
data_sample
},
series
:
[{
name
:
"停留时长"
,
type
:
"bar"
,
barWidth
:
"40%"
,
label
:
{
show
:
true
,
formatter
:
function
(
params
)
{
return
params
.
data
[
1
]
+
"%"
;
},
position
:
[
"102%"
,
"0%"
]
},
itemStyle
:
{
color
:
"#679BFF"
},
z
:
3
//让实时在总计上面
},
{
name
:
""
,
type
:
"bar"
,
barWidth
:
"40%"
,
itemStyle
:
{
color
:
"#F5F7F9"
},
barGap
:
"-100%"
}
]
};
},
}
}
})
})
\ No newline at end of file
\ No newline at end of file
miniProject/index/index.wxml
View file @
c5b4129
...
@@ -7,7 +7,7 @@
...
@@ -7,7 +7,7 @@
<image src="../images/banner.png" class='images'></image>
<image src="../images/banner.png" class='images'></image>
<view class="shop_name">{{selectName}}</view>
<view class="shop_name">{{selectName}}</view>
<view class="shop_time">
<view class="shop_time">
<text>开业门店总数:
254
个</text>
<text>开业门店总数:
{{openMllNum}}
个</text>
</view>
</view>
</view>
</view>
<!-- 选择时间 -->
<!-- 选择时间 -->
...
@@ -27,40 +27,40 @@
...
@@ -27,40 +27,40 @@
<view class="card_passage">
<view class="card_passage">
<image src="../images/keliulaing.png" class="card_image"></image>
<image src="../images/keliulaing.png" class="card_image"></image>
<view class="cardName"> 路过客流量</view>
<view class="cardName"> 路过客流量</view>
<view class="cardNum">
35480
</view>
<view class="cardNum">
{{exposure}}
</view>
</view>
</view>
<view class="card_passage">
<view class="card_passage">
<image src="../images/keliuliangyellow.png" class="card_image"></image>
<image src="../images/keliuliangyellow.png" class="card_image"></image>
<view class="cardName"> 客流量</view>
<view class="cardName"> 客流量</view>
<view class="cardNum">
35480
</view>
<view class="cardNum">
{{traffic}}
</view>
</view>
</view>
<view class="card_passage">
<view class="card_passage">
<image src="../images/customer.png" class="card_image"></image>
<image src="../images/customer.png" class="card_image"></image>
<view class="cardName"> 顾客人数</view>
<view class="cardName"> 顾客人数</view>
<view class="cardNum">
35480
</view>
<view class="cardNum">
{{customer}}
</view>
</view>
</view>
<view class="card_passage">
<view class="card_passage">
<image src="../images/jindianlv.png" class="card_image"></image>
<image src="../images/jindianlv.png" class="card_image"></image>
<view class="cardName"> 进店率</view>
<view class="cardName"> 进店率</view>
<view class="cardNum">
35480
</view>
<view class="cardNum">
{{entryRate}} %
</view>
</view>
</view>
</view>
</view>
<!-- 客流趋势分析 -->
<!-- 客流趋势分析 -->
<view class="keliuliang">
<view class="keliuliang">
<text class="title_chart">客流趋势分析</text>
<text class="title_chart">客流趋势分析</text>
<view class="tab_tll">
<view class="tab_tll">
<text class="text_tltle {{trendtypes==
1?'actives':'defaults'}}" bindtap="ClickPassageFlow" data-type='1
'>过店客流</text>
<text class="text_tltle {{trendtypes==
'PassengerFlow'?'actives':'defaults'}}" bindtap="ClickPassageFlow" data-type='PassengerFlow
'>过店客流</text>
<text class="text_tltle {{trendtypes==
2?'actives':'defaults'}}" bindtap="ClickPassageFlow" data-type='2
'>进店客流</text>
<text class="text_tltle {{trendtypes==
'Exposure'?'actives':'defaults'}}" bindtap="ClickPassageFlow" data-type='Exposure
'>进店客流</text>
<text class="text_tltle {{trendtypes==
3?'actives':'defaults'}}" bindtap="ClickPassageFlow" data-type='3
'>顾客人数</text>
<text class="text_tltle {{trendtypes==
'CustomerNum'?'actives':'defaults'}}" bindtap="ClickPassageFlow" data-type='CustomerNum
'>顾客人数</text>
<text class="text_tltle {{trendtypes==
4?'actives':'defaults'}}" bindtap="ClickPassageFlow" data-type='4
'>进店率</text>
<text class="text_tltle {{trendtypes==
'IntoStoreRate'?'actives':'defaults'}}" bindtap="ClickPassageFlow" data-type='IntoStoreRate
'>进店率</text>
</view>
</view>
<basic chartId='chartDatatrend' chartData="{{chartData}}" height="500rpx"></basic>
<basic chartId='chartDatatrend' chartData="{{chartData}}" height="500rpx"></basic>
</view>
</view>
<!-- 停留时长统计 -->
<!-- 停留时长统计 -->
<view class="keliuliang">
<
!-- <
view class="keliuliang">
<text class="title_chart">停留时长统计</text>
<text class="title_chart">停留时长统计</text>
<basic chartId='chartDatastop' chartData="{{chartDatastop}}" height="500rpx"></basic>
<basic chartId='chartDatastop' chartData="{{chartDatastop}}" height="500rpx"></basic>
</view>
</view>
-->
<!-- 门店排行 -->
<!-- 门店排行 -->
<view class="keliuliang">
<view class="keliuliang">
<text class="title_chart">门店排行</text>
<text class="title_chart">门店排行</text>
...
@@ -80,7 +80,7 @@
...
@@ -80,7 +80,7 @@
</view>
</view>
<view class="progress progressCustom">
<view class="progress progressCustom">
<view class="bar">
<view class="bar">
<van-progress show-pivot="{{false}}" percentage="{{item.percentage}}" stroke-width="10" />
<van-progress
custom-class='customColor'
show-pivot="{{false}}" percentage="{{item.percentage}}" stroke-width="10" />
</view>
</view>
</view>
</view>
</view>
</view>
...
...
miniProject/index/index.wxss
View file @
c5b4129
...
@@ -162,7 +162,12 @@
...
@@ -162,7 +162,12 @@
margin-bottom: 10rpx;
margin-bottom: 10rpx;
border-radius: 100rpx;
border-radius: 100rpx;
}
}
.desc_content{
background-color: #F5F5F7 !important;
}
.desc_content_active{
background: linear-gradient(254deg, #78B3FB 0%, #487EF7 100%) !important;
}
.indexList .desc_info:nth-child(4) {
.indexList .desc_info:nth-child(4) {
margin-right: 0 !important;
margin-right: 0 !important;
}
}
...
@@ -243,3 +248,6 @@
...
@@ -243,3 +248,6 @@
font-size: 28rpx;
font-size: 28rpx;
font-weight: 900;
font-weight: 900;
}
}
.customColor .van-progress__portion{
background: linear-gradient(152deg, #597CFF 0%, #7998FF 100%) !important;
}
\ No newline at end of file
\ No newline at end of file
Write
Preview
Markdown
is supported
Attach a file
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to post a comment