odjbin/city-store-transfer
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

罗世杰：完成首页数据分析、客服悬浮

Browse Source
This commit is contained in:
LuoShijie
2023-11-14 00:33:31 +08:00
parent c639b24e9c
commit c21816d077
3 changed files with 161 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files

152
pages/index/HomeMainContent/Statistics.vue
View File

@@ -7,21 +7,39 @@
height="320rpx"
/>
</view>
<text class="text1">累计用户</text>
<text class="num1">{{ sumUser.total }}</text>
<view class="border border1"></view>
<text class="num11">昨日新增{{ sumUser.yesterday }}位</text>
</view>
<view class="right">
<view>
<u-image src="/static/statistics/sy_icon_ljzd1.png"
width="340rpx"
height="150rpx"
/>
<view class="right1">
<view>
<u-image src="/static/statistics/sy_icon_ljzd1.png"
width="340rpx"
height="150rpx"
/>
</view>
<text class="text2">累计转店</text>
<text class="num2">{{ sumTrans.total }}</text>
<view class="border border2"></view>
<text class="num21">昨日新增{{ sumTrans.yesterday }}位</text>
</view>
<view>
<u-image src="/static/statistics/sy_icon_ljzd0.png"
width="340rpx"
height="150rpx"
/>
<view class="right2">
<view>
<u-image src="/static/statistics/sy_icon_ljzd0.png"
width="340rpx"
height="150rpx"
/>
</view>
<text class="text3">累计找店</text>
<text class="num3">{{ sumSearch.total }}</text>
<view class="border border3"></view>
<text class="num22">昨日新增{{ sumSearch.yesterday }}位</text>
</view>
</view>
@@ -29,6 +47,31 @@
</template>
<script>
export default {
props:{
sumUser:{
type:Object,
default: {
"total": 231753,
"yesterday": 1345
}
},
sumTrans:{
type:Object,
default: {
"total": 231753,
"yesterday": 1345
}
},
sumSearch:{
type:Object,
default: {
"total": 231753,
"yesterday": 1345
}
}
},
}
</script>
<style scoped lang="scss">
@@ -37,20 +80,101 @@
margin: 10px 0;
display: flex;
justify-content: space-between;
font-weight: 800;
text {
font-size: 13px;
font-size: 26rpx;
font-weight: 800;
}
.border {
width: 229rpx;
height: 49rpx;
background: #FFFFFF;
box-shadow: 0px 1px 2px 0px rgba(178,247,214,0.42);
border-radius: 0px 24px 24px 0px;
opacity: 0.7;
}
.left {
color: #06562E;
position: relative;
.text1 {
position: absolute;
top: 39rpx;
left: 33rpx;
}
.num1 {
position: absolute;
top: 76rpx;
left: 33rpx;
font-size: 34rpx;
}
.num11 {
position: absolute;
top: 150rpx;
left: 51rpx;
line-height: 37rpx;
z-index: 1;
}
.border1 {
position: absolute;
top: 144rpx;
left: 33rpx;
}
}
.right{
.right {
display: flex;
flex-direction: column;
justify-content: space-between;
.right1 {
position: relative;
color: #7C441C;
.border2 {
position: absolute;
top: 60rpx;
left: 20rpx;
}
.text2 {
position: absolute;
top: 14rpx;
left: 20rpx;
}
.num2 {
position: absolute;
top: 9rpx;
left: 144rpx;
font-size: 34rpx;
}
.num21 {
position: absolute;
left: 38rpx;
top: 66rpx;
}
}
.right2 {
position: relative;
color: #912C2C;
.border3 {
position: absolute;
top: 71rpx;
left: 20rpx;
}
.text3 {
position: absolute;
left: 20rpx;
top: 25rpx;
}
.num3 {
position: absolute;
top: 20rpx;
left: 144rpx;
font-size: 34rpx;
}
.num22 {
position: absolute;
left: 38rpx;
top: 77rpx;
}
}
}
}
</style>