php
/
ZhiHuiJiaoWu_UniApp
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

fixbug

master
王泽彦 10 months ago
parent
d920b91a7a
commit
2dc31df741
1 changed files with 400 additions and 350 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 750
      pages/market/index/index.vue

750
pages/market/index/index.vue
View File

@ -1,19 +1,20 @@
<template> <template>
<view class="assemble"> <view class="assemble">
<!--自定义导航栏--> <!--自定义导航栏-->
<view class="navbar_section"> <view class="navbar_section">
<view class="title">首页</view> <view class="title">首页</view>
</view> </view>
<view style="height: 20rpx;"></view> <view style="height: 20rpx;"></view>
<!-- 市场人员展示--> <!-- 市场人员展示-->
<view class="div-style" v-if="infoData.role_type == 'market_type'"> <view class="div-style" v-if="infoData.role_type == 'market_type'">
<view style="height: 38vh;"> <view style="height: 38vh;">
<view style="display: flex;align-items: center;padding: 20rpx 0 0 20rpx;"> <view style="display: flex;align-items: center;padding: 20rpx 0 0 20rpx;">
<view> <view>
<image :src="$util.img('/uniapp_src/static/images/index/danlan.png')" class="drop-image"></image> <image :src="$util.img('/uniapp_src/static/images/index/danlan.png')" class="drop-image">
</image>
</view> </view>
<view class="title">本月业绩</view> <view class="title">本月业绩</view>
</view> </view>
@ -22,9 +23,10 @@
<view style="padding: 20rpx 0;"> <view style="padding: 20rpx 0;">
<view style="display: flex;align-items: center;"> <view style="display: flex;align-items: center;">
<view style="padding: 12rpx;"> <view style="padding: 12rpx;">
<image :src="$util.img('/uniapp_src/static/images/index/huang.png')" class="drop-image-x"></image> <image :src="$util.img('/uniapp_src/static/images/index/huang.png')"
class="drop-image-x"></image>
</view> </view>
<view class="title-x">拉新总数</view> <view class="title-x">资源总数</view>
</view> </view>
<view class="title-x1">{{infoData.month.new_total}}人</view> <view class="title-x1">{{infoData.month.new_total}}人</view>
</view> </view>
@ -32,7 +34,8 @@
<view> <view>
<view style="display: flex;align-items: center;"> <view style="display: flex;align-items: center;">
<view style="padding: 12rpx;"> <view style="padding: 12rpx;">
<image :src="$util.img('/uniapp_src/static/images/index/lvs.png')" class="drop-image-x"></image> <image :src="$util.img('/uniapp_src/static/images/index/lvs.png')"
class="drop-image-x"></image>
</view> </view>
<view class="title-x">已分配</view> <view class="title-x">已分配</view>
</view> </view>
@ -42,9 +45,10 @@
<view> <view>
<view style="display: flex;align-items: center;"> <view style="display: flex;align-items: center;">
<view style="padding: 12rpx;"> <view style="padding: 12rpx;">
<image :src="$util.img('/uniapp_src/static/images/index/shenlan.png')" class="drop-image-x"></image> <image :src="$util.img('/uniapp_src/static/images/index/shenlan.png')"
class="drop-image-x"></image>
</view> </view>
<view class="title-x">昨日拉新</view> <view class="title-x">昨日新增</view>
</view> </view>
<view class="title-x1">{{infoData.month.yesterday_new}}人</view> <view class="title-x1">{{infoData.month.yesterday_new}}人</view>
</view> </view>
@ -52,43 +56,56 @@
<view> <view>
<view style="display: flex;align-items: center;"> <view style="display: flex;align-items: center;">
<view style="padding: 12rpx;"> <view style="padding: 12rpx;">
<image :src="$util.img('/uniapp_src/static/images/index/lan.png')" class="drop-image-x"></image> <image :src="$util.img('/uniapp_src/static/images/index/lan.png')"
class="drop-image-x"></image>
</view> </view>
<view class="title-x">今日拉新</view> <view class="title-x">今日新增</view>
</view> </view>
<view class="title-x1">{{infoData.month.today_new}}人</view> <view class="title-x1">{{infoData.month.today_new}}人</view>
</view> </view>
</view> </view>
<!-- 统计图--> <!-- 统计图-->
<view class="right1"> <view class="right1">
<view style="text-align: center;">{{infoData.date_range}}</view> <view style="text-align: center;">{{infoData.date_range}}</view>
<view class="statistics_box"> <view class="statistics_box">
<view class="item"> <view class="item">
<view class="box"> <view class="box">
<view class="progress-bar" :style="{ height: `${infoData.month.yesterday_new_rate}%`, background: '#f59a23' }"></view> <view class="progress-bar"
<view class="ratio" :style="{ color: infoData.month.yesterday_new_rate <= 0 ? '#333333' : '#000' }">{{ infoData.month.yesterday_new_rate }}%</view> :style="{ height: `${infoData.month.yesterday_new_rate}%`, background: '#f59a23' }">
</view> </view>
<view class="title">昨日</view> <view class="ratio"
</view> :style="{ color: infoData.month.yesterday_new_rate <= 0 ? '#333333' : '#000' }">
{{ infoData.month.yesterday_new_rate }}%</view>
<view class="item"> </view>
<view class="box"> <view class="title">昨日</view>
<view class="progress-bar" :style="{ height: `${infoData.month.assigned_sales_rate}%`, background: '#039f64' }"></view> </view>
<view class="ratio" :style="{ color: infoData.month.assigned_sales_rate <= 0 ? '#333333' : '#000' }">{{ infoData.month.assigned_sales_rate }}%</view>
</view> <view class="item">
<view class="title">分配</view> <view class="box">
</view> <view class="progress-bar"
:style="{ height: `${infoData.month.assigned_sales_rate}%`, background: '#039f64' }">
<view class="item"> </view>
<view class="box"> <view class="ratio"
<view class="progress-bar" :style="{ height: `${infoData.month.today_new_rate}%`, background: '#4066f2' }"></view> :style="{ color: infoData.month.assigned_sales_rate <= 0 ? '#333333' : '#000' }">
<view class="ratio" :style="{ color: infoData.month.today_new_rate <= 0 ? '#333333' : '#000' }">{{ infoData.month.today_new_rate }}%</view> {{ infoData.month.assigned_sales_rate }}%</view>
</view> </view>
<view class="title">今日</view> <view class="title">分配</view>
</view> </view>
</view> <view class="item">
<view class="box">
<view class="progress-bar"
:style="{ height: `${infoData.month.today_new_rate}%`, background: '#4066f2' }">
</view>
<view class="ratio"
:style="{ color: infoData.month.today_new_rate <= 0 ? '#333333' : '#000' }">
{{ infoData.month.today_new_rate }}%</view>
</view>
<view class="title">今日</view>
</view>
</view>
</view> </view>
</view> </view>
@ -110,9 +127,10 @@
<view style="width: 48%;"> <view style="width: 48%;">
<view style="display: flex;align-items: center;"> <view style="display: flex;align-items: center;">
<view style="padding: 12rpx;"> <view style="padding: 12rpx;">
<image :src="$util.img('/uniapp_src/static/images/index/danlv.png')" class="drop-image-x"></image> <image :src="$util.img('/uniapp_src/static/images/index/danlv.png')"
class="drop-image-x"></image>
</view> </view>
<view class="title-x">拉新总数</view> <view class="title-x">资源总数</view>
</view> </view>
<view class="title-x1">{{infoData.last_month.new_total}}人</view> <view class="title-x1">{{infoData.last_month.new_total}}人</view>
</view> </view>
@ -120,9 +138,10 @@
<view style="width: 48%;"> <view style="width: 48%;">
<view style="display: flex;align-items: center;"> <view style="display: flex;align-items: center;">
<view style="padding: 12rpx;"> <view style="padding: 12rpx;">
<image :src="$util.img('/uniapp_src/static/images/index/danlv.png')" class="drop-image-x"></image> <image :src="$util.img('/uniapp_src/static/images/index/danlv.png')"
class="drop-image-x"></image>
</view> </view>
<view class="title-x">已分配</view> <view class="title-x">业绩收入</view>
</view> </view>
<view class="title-x1">{{infoData.last_month.assigned_sales}}人</view> <view class="title-x1">{{infoData.last_month.assigned_sales}}人</view>
</view> </view>
@ -132,285 +151,309 @@
<view style="width: 48%;"> <view style="width: 48%;">
<view style="display: flex;align-items: center;"> <view style="display: flex;align-items: center;">
<view style="padding: 12rpx;"> <view style="padding: 12rpx;">
<image :src="$util.img('/uniapp_src/static/images/index/danlv.png')" class="drop-image-x"></image> <image :src="$util.img('/uniapp_src/static/images/index/danlv.png')"
class="drop-image-x"></image>
</view> </view>
<view class="title-x">昨日拉新</view> <view class="title-x">关单数量</view>
</view> </view>
<view class="title-x1">{{infoData.last_month.yesterday_new}}人</view> <view class="title-x1">{{infoData.last_month.yesterday_new}}人</view>
</view> </view>
<view style="width: 48%;"> <!-- <view style="width: 48%;">
<view style="display: flex;align-items: center;"> <view style="display: flex;align-items: center;">
<view style="padding: 12rpx;"> <view style="padding: 12rpx;">
<image :src="$util.img('/uniapp_src/static/images/index/danlv.png')" class="drop-image-x"></image> <image :src="$util.img('/uniapp_src/static/images/index/danlv.png')"
</view> class="drop-image-x"></image>
<view class="title-x">今日拉新</view> </view>
</view> <view class="title-x">今日拉新</view>
<view class="title-x1">{{infoData.last_month.today_new}}人</view> </view>
</view> <view class="title-x1">{{infoData.last_month.today_new}}人</view>
</view> -->
</view> </view>
</view> </view>
</view> </view>
</view> </view>
</view> </view>
<!-- 销售人员展示--> <!-- 销售人员展示-->
<view class="div-style" v-if="infoData.role_type == 'sale_type'"> <view class="div-style" v-if="infoData.role_type == 'sale_type'">
<view style="height: 38vh;"> <view style="height: 38vh;">
<view style="display: flex;align-items: center;padding: 20rpx 0 0 20rpx;"> <view style="display: flex;align-items: center;padding: 20rpx 0 0 20rpx;">
<view> <view>
<image :src="$util.img('/uniapp_src/static/images/index/danlan.png')" class="drop-image"></image> <image :src="$util.img('/uniapp_src/static/images/index/danlan.png')" class="drop-image">
</view> </image>
<view class="title">本月业绩</view> </view>
</view> <view class="title">本月业绩</view>
<view class="coach-message"> </view>
<view class="left1"> <view class="coach-message">
<view style="padding: 20rpx 0;"> <view class="left1">
<view style="display: flex;align-items: center;"> <view style="padding: 20rpx 0;">
<view style="padding: 12rpx;"> <view style="display: flex;align-items: center;">
<image :src="$util.img('/uniapp_src/static/images/index/huang.png')" class="drop-image-x"></image> <view style="padding: 12rpx;">
</view> <image :src="$util.img('/uniapp_src/static/images/index/huang.png')"
<view class="title-x">已分配</view> class="drop-image-x"></image>
</view> </view>
<view class="title-x1">{{infoData.month.assigned_clients}}人</view> <view class="title-x">已分配</view>
</view> </view>
<view class="title-x1">{{infoData.month.assigned_clients}}人</view>
<view> </view>
<view style="display: flex;align-items: center;">
<view style="padding: 12rpx;"> <view>
<image :src="$util.img('/uniapp_src/static/images/index/lvs.png')" class="drop-image-x"></image> <view style="display: flex;align-items: center;">
</view> <view style="padding: 12rpx;">
<view class="title-x">已沟通</view> <image :src="$util.img('/uniapp_src/static/images/index/lvs.png')"
</view> class="drop-image-x"></image>
<view class="title-x1">{{infoData.month.contacted_clients}}人</view> </view>
</view> <view class="title-x">已沟通</view>
</view>
<view> <view class="title-x1">{{infoData.month.contacted_clients}}人</view>
<view style="display: flex;align-items: center;"> </view>
<view style="padding: 12rpx;">
<image :src="$util.img('/uniapp_src/static/images/index/shenlan.png')" class="drop-image-x"></image> <view>
</view> <view style="display: flex;align-items: center;">
<view class="title-x">未成交</view> <view style="padding: 12rpx;">
</view> <image :src="$util.img('/uniapp_src/static/images/index/shenlan.png')"
<view class="title-x1">{{infoData.month.unconverted_clients}}人</view> class="drop-image-x"></image>
</view> </view>
<view class="title-x">未成交</view>
<view> </view>
<view style="display: flex;align-items: center;"> <view class="title-x1">{{infoData.month.unconverted_clients}}人</view>
<view style="padding: 12rpx;"> </view>
<image :src="$util.img('/uniapp_src/static/images/index/lan.png')" class="drop-image-x"></image>
</view> <view>
<view class="title-x">待续费</view> <view style="display: flex;align-items: center;">
</view> <view style="padding: 12rpx;">
<view class="title-x1">{{infoData.month.renewal_clients}}人</view> <image :src="$util.img('/uniapp_src/static/images/index/lan.png')"
</view> class="drop-image-x"></image>
</view>
<view> <view class="title-x">待续费</view>
<view style="display: flex;align-items: center;"> </view>
<view style="padding: 12rpx;"> <view class="title-x1">{{infoData.month.renewal_clients}}人</view>
<image :src="$util.img('/uniapp_src/static/images/index/lan.png')" class="drop-image-x"></image> </view>
</view>
<view class="title-x">已关单</view> <view>
</view> <view style="display: flex;align-items: center;">
<view class="title-x1">{{infoData.month.closed_clients}}人</view> <view style="padding: 12rpx;">
</view> <image :src="$util.img('/uniapp_src/static/images/index/lan.png')"
class="drop-image-x"></image>
</view>
<view class="title-x">已关单</view>
</view> </view>
<view class="title-x1">{{infoData.month.closed_clients}}人</view>
<!--统计图--> </view>
<view class="right1">
<view style="text-align: center;">{{infoData.date}}</view>
<view class="statistics_box">
<!--未成交--> </view>
<view class="item">
<view class="box"> <!--统计图-->
<view class="progress-bar" :style="{ height: `${infoData.month.unconverted_rate}%`, background: '#f59a23' }"></view> <view class="right1">
<view class="ratio" :style="{ color: infoData.month.unconverted_rate <= 0 ? '#333333' : '#fff' }">{{ infoData.month.unconverted_rate }}%</view> <view style="text-align: center;">{{infoData.date}}</view>
</view> <view class="statistics_box">
<view class="title">未成交</view> <!--未成交-->
</view> <view class="item">
<!--待续费--> <view class="box">
<view class="item"> <view class="progress-bar"
<view class="box"> :style="{ height: `${infoData.month.unconverted_rate}%`, background: '#f59a23' }">
<view class="progress-bar" :style="{ height: `${infoData.month.renewal_rate}%`, background: '#039f64' }"></view> </view>
<view class="ratio" :style="{ color: infoData.month.renewal_rate <= 0 ? '#333333' : '#fff' }">{{ infoData.month.renewal_rate }}%</view> <view class="ratio"
</view> :style="{ color: infoData.month.unconverted_rate <= 0 ? '#333333' : '#fff' }">
<view class="title">待续费</view> {{ infoData.month.unconverted_rate }}%</view>
</view> </view>
<!--已关单--> <view class="title">未成交</view>
<view class="item"> </view>
<view class="box"> <!--待续费-->
<view class="progress-bar" :style="{ height: `${infoData.month.closed_rate}%`, background: '#4066f2' }"></view> <view class="item">
<view class="ratio" :style="{ color: infoData.month.closed_rate <= 0 ? '#333333' : '#fff' }">{{ infoData.month.closed_rate }}%</view> <view class="box">
</view> <view class="progress-bar"
<view class="title">已关单</view> :style="{ height: `${infoData.month.renewal_rate}%`, background: '#039f64' }">
</view> </view>
<view class="ratio"
</view> :style="{ color: infoData.month.renewal_rate <= 0 ? '#333333' : '#fff' }">
</view> {{ infoData.month.renewal_rate }}%</view>
</view>
</view> <view class="title">待续费</view>
</view> </view>
<!--已关单-->
<view style="width: 90%;background: #EFF3F8;height: 4rpx;margin: auto;"></view> <view class="item">
<view class="box">
<view style="height: 38vh;"> <view class="progress-bar"
<view style="display: flex;align-items: center;padding: 20rpx 0 0 20rpx;"> :style="{ height: `${infoData.month.closed_rate}%`, background: '#4066f2' }">
<view> </view>
<image :src="$util.img('/uniapp_src/static/images/index/danlv.png')" class="drop-image"></image> <view class="ratio"
</view> :style="{ color: infoData.month.closed_rate <= 0 ? '#333333' : '#fff' }">
<view class="title">上月业绩</view> {{ infoData.month.closed_rate }}%</view>
</view> </view>
<view class="title">已关单</view>
<view class="coach-message"> </view>
<view class="this_month">
<view style="padding: 20rpx 0;display: flex;justify-content: space-between;"> </view>
<view style="width: 48%;"> </view>
<view style="display: flex;align-items: center;">
<view style="padding: 12rpx;"> </view>
<image :src="$util.img('/uniapp_src/static/images/index/danlv.png')" class="drop-image-x"></image> </view>
</view>
<view class="title-x">已分配</view> <view style="width: 90%;background: #EFF3F8;height: 4rpx;margin: auto;"></view>
</view>
<view class="title-x1">{{infoData.last_month.assigned_clients}}人</view> <view style="height: 38vh;">
</view> <view style="display: flex;align-items: center;padding: 20rpx 0 0 20rpx;">
<view style="width: 48%;"> <view>
<view style="display: flex;align-items: center;"> <image :src="$util.img('/uniapp_src/static/images/index/danlv.png')" class="drop-image"></image>
<view style="padding: 12rpx;"> </view>
<image :src="$util.img('/uniapp_src/static/images/index/danlv.png')" class="drop-image-x"></image> <view class="title">上月业绩</view>
</view> </view>
<view class="title-x">已沟通</view>
</view> <view class="coach-message">
<view class="title-x1">{{infoData.last_month.contacted_clients}}人</view> <view class="this_month">
</view> <view style="padding: 20rpx 0;display: flex;justify-content: space-between;">
</view> <view style="width: 48%;">
<view style="display: flex;align-items: center;">
<view style="padding: 20rpx 0;display: flex;justify-content: space-between;"> <view style="padding: 12rpx;">
<view style="width: 48%;"> <image :src="$util.img('/uniapp_src/static/images/index/danlv.png')"
<view style="display: flex;align-items: center;"> class="drop-image-x"></image>
<view style="padding: 12rpx;"> </view>
<image :src="$util.img('/uniapp_src/static/images/index/danlv.png')" class="drop-image-x"></image> <view class="title-x">已分配</view>
</view> </view>
<view class="title-x">未成交</view> <view class="title-x1">{{infoData.last_month.assigned_clients}}人</view>
</view> </view>
<view class="title-x1">{{infoData.last_month.unconverted_clients}}个</view> <view style="width: 48%;">
</view> <view style="display: flex;align-items: center;">
<view style="width: 48%;"> <view style="padding: 12rpx;">
<view style="display: flex;align-items: center;"> <image :src="$util.img('/uniapp_src/static/images/index/danlv.png')"
<view style="padding: 12rpx;"> class="drop-image-x"></image>
<image :src="$util.img('/uniapp_src/static/images/index/danlv.png')" class="drop-image-x"></image> </view>
</view> <view class="title-x">已沟通</view>
<view class="title-x">待续费</view> </view>
</view> <view class="title-x1">{{infoData.last_month.contacted_clients}}人</view>
<view class="title-x1">{{infoData.last_month.renewal_clients}}人</view> </view>
</view> </view>
</view>
<view style="padding: 20rpx 0;display: flex;justify-content: space-between;">
<view style="padding: 20rpx 0;display: flex;justify-content: space-between;"> <view style="width: 48%;">
<view style="display: flex;align-items: center;">
<view style="width: 48%;"> <view style="padding: 12rpx;">
<view style="display: flex;align-items: center;"> <image :src="$util.img('/uniapp_src/static/images/index/danlv.png')"
<view style="padding: 12rpx;"> class="drop-image-x"></image>
<image :src="$util.img('/uniapp_src/static/images/index/danlv.png')" class="drop-image-x"></image> </view>
</view> <view class="title-x">未成交</view>
<view class="title-x">已关单</view> </view>
</view> <view class="title-x1">{{infoData.last_month.unconverted_clients}}个</view>
<view class="title-x1">{{infoData.last_month.closed_clients}}人</view> </view>
</view> <view style="width: 48%;">
</view> <view style="display: flex;align-items: center;">
</view> <view style="padding: 12rpx;">
</view> <image :src="$util.img('/uniapp_src/static/images/index/danlv.png')"
</view> class="drop-image-x"></image>
</view> </view>
<AQTabber /> <view class="title-x">待续费</view>
</view>
<view class="title-x1">{{infoData.last_month.renewal_clients}}人</view>
</view>
</view>
<view style="padding: 20rpx 0;display: flex;justify-content: space-between;">
<view style="width: 48%;">
<view style="display: flex;align-items: center;">
<view style="padding: 12rpx;">
<image :src="$util.img('/uniapp_src/static/images/index/danlv.png')"
class="drop-image-x"></image>
</view>
<view class="title-x">已关单</view>
</view>
<view class="title-x1">{{infoData.last_month.closed_clients}}人</view>
</view>
</view>
</view>
</view>
</view>
</view>
<AQTabber />
</view> </view>
</template> </template>
<script> <script>
import apiRoute from '@/api/apiRoute.js'; import apiRoute from '@/api/apiRoute.js';
import AQTabber from "@/components/AQ/AQTabber.vue" import AQTabber from "@/components/AQ/AQTabber.vue"
export default { export default {
components: { components: {
AQTabber, AQTabber,
}, },
data() { data() {
return { return {
infoData:{},//详情 infoData: {}, //详情
userInfo: {},//当前登录的用户信息 userInfo: {}, //当前登录的用户信息
} }
}, },
onShow() { onShow() {
this.init() this.init()
}, },
methods: { methods: {
async init() { async init() {
await this.getUserInfo() await this.getUserInfo()
await this.getXsIndex() await this.getXsIndex()
}, },
//获取用户信息 //获取用户信息
async getUserInfo(){ async getUserInfo() {
let res = await apiRoute.getPersonnelInfo({}) let res = await apiRoute.getPersonnelInfo({})
if (res.code != 1) { if (res.code != 1) {
uni.showToast({ uni.showToast({
title: res.msg, title: res.msg,
icon: 'none' icon: 'none'
}) })
return return
} }
this.userInfo = res.data this.userInfo = res.data
}, },
//获取销售首页详情 //获取销售首页详情
async getXsIndex() { async getXsIndex() {
let role_key_arr = this.userInfo.role_key_arr.join(',') let role_key_arr = this.userInfo.role_key_arr.join(',')
let params = { let params = {
personnel_id:this.userInfo.id,//员工表id personnel_id: this.userInfo.id, //员工表id
role_key_arr: role_key_arr, // 角色key 转换数组为字符串，若为空则赋予空字符串 role_key_arr: role_key_arr, // 角色key 转换数组为字符串，若为空则赋予空字符串
} }
let res = await apiRoute.xs_statisticsMarketHome(params) let res = await apiRoute.xs_statisticsMarketHome(params)
if (res.code != 1) { if (res.code != 1) {
uni.showToast({ uni.showToast({
title: res.msg, title: res.msg,
icon: 'none' icon: 'none'
}) })
return return
} }
this.infoData = res.data this.infoData = res.data
console.log('统计',this.infoData) console.log('统计', this.infoData)
}, },
} }
} }
</script> </script>
<style lang="less" scoped> <style lang="less" scoped>
//自定义导航栏
.navbar_section {
border: 1px solid #fff;
display: flex;
justify-content: center;
align-items: center;
background: #fff;
.title {
padding: 40rpx 0rpx;
//自定义导航栏 /* 小程序端样式 */
.navbar_section{ // #ifdef MP-WEIXIN
border: 1px solid #fff; padding: 80rpx 0rpx;
display: flex; // #endif
justify-content: center;
align-items: center;
background: #fff;
.title{
padding: 40rpx 0rpx;
/* 小程序端样式 */
// #ifdef MP-WEIXIN
padding: 80rpx 0rpx;
// #endif
font-size: 30rpx; font-size: 30rpx;
color: #858585; color: #858585;
} }
} }
.assemble { .assemble {
width: 100%; width: 100%;
@ -451,53 +494,60 @@ export default {
margin: auto; margin: auto;
} }
.right1 { .right1 {
width: 48%; width: 48%;
height: 95%; height: 95%;
margin: auto; margin: auto;
.statistics_box {
margin: auto; .statistics_box {
margin-top: 10rpx; margin: auto;
display: flex; margin-top: 10rpx;
justify-content: space-between; display: flex;
.item { justify-content: space-between;
width: 90rpx;
display: flex; .item {
flex-direction: column; width: 90rpx;
align-items: center; display: flex;
.box { flex-direction: column;
width: 100%; align-items: center;
height: 328rpx;
border: 1px solid #ddd; .box {
border-radius: 6rpx; width: 100%;
background: #f5f5f5; height: 328rpx;
position: relative; border: 1px solid #ddd;
.progress-bar { border-radius: 6rpx;
width: 100%; background: #f5f5f5;
height: 0; position: relative;
transition: height 0.3s ease;
position: absolute; .progress-bar {
bottom: 0; width: 100%;
} height: 0;
.ratio { transition: height 0.3s ease;
width: 100%; position: absolute;
position: absolute; bottom: 0;
bottom: -0rpx; }
font-size: 26rpx;
text-align: center; .ratio {
} width: 100%;
} position: absolute;
.title { bottom: -0rpx;
margin-top: 5rpx; font-size: 26rpx;
padding: 0; text-align: center;
font-size: 26rpx; }
color: #999999;; }
text-align: center;
} .title {
} margin-top: 5rpx;
} padding: 0;
} font-size: 26rpx;
color: #999999;
;
text-align: center;
}
}
}
}
.this_month { .this_month {
width: 100%; width: 100%;
height: 95%; height: 95%;

Write Preview
Loading…
Cancel
Save