|
@@ -1,238 +1,514 @@
|
|
|
-<template>
|
|
|
- <view>
|
|
|
- <u-navbar v-show="false"
|
|
|
- title="首页" title-color="#101010"></u-navbar>
|
|
|
-
|
|
|
- <view class="navbar" >
|
|
|
- 智泊e家 运管端
|
|
|
-
|
|
|
- </view>
|
|
|
- <view class="tabs-box">
|
|
|
-
|
|
|
- </view>
|
|
|
- <view class="main">
|
|
|
-
|
|
|
-
|
|
|
- <view class="statistics">
|
|
|
- <view class="title">
|
|
|
- <view class="icon">
|
|
|
- <image class="img" src="@/assets/img/circleCopy1@1x.png" mode=""></image>
|
|
|
- </view>
|
|
|
- <view class="text">
|
|
|
- 综合统计
|
|
|
- </view>
|
|
|
-
|
|
|
- </view>
|
|
|
-
|
|
|
- <view class="content" >
|
|
|
- <jpContent :status="jpContentMap.body1">
|
|
|
- <table>
|
|
|
- <tr>
|
|
|
- <td rowspan="2" >
|
|
|
- <view id="body1pie1" class="body1pie">
|
|
|
+<template>
|
|
|
+ <view>
|
|
|
+ <u-navbar v-show="false" title="首页" title-color="#101010"></u-navbar>
|
|
|
+
|
|
|
+ <view class="navbar">
|
|
|
+ 智泊e家 运管端
|
|
|
+
|
|
|
+ </view>
|
|
|
+ <view class="tabs-box">
|
|
|
+
|
|
|
+ </view>
|
|
|
+ <view class="main">
|
|
|
+
|
|
|
+
|
|
|
+ <view class="statistics ">
|
|
|
+ <view class="title">
|
|
|
+ <view class="icon">
|
|
|
+ <image class="img" src="@/assets/img/circleCopy1@1x.png" mode=""></image>
|
|
|
+ </view>
|
|
|
+ <view class="text">
|
|
|
+ 综合统计
|
|
|
+ </view>
|
|
|
+
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <view class="content">
|
|
|
+ <jpContent :status="jpContentMap.body1">
|
|
|
+ <view class="body1pie-table">
|
|
|
+ <view class="tr">
|
|
|
+ <view class="td td1" >
|
|
|
+ <view id="body1pie1" class="body1pie">
|
|
|
+
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="td td2">
|
|
|
+ <view class="td td3">
|
|
|
+ <view class="td td4">空闲<span class="body1pie-num color53B56B">5</span>台</view>
|
|
|
+ <view class="td td4">占用<span class="body1pie-num colorAAAAAA">5</span>台</view>
|
|
|
+ </view>
|
|
|
+ <view class="td td3">
|
|
|
+
|
|
|
+ <view class="td td4">公共车位<span class="body1pie-num colorEF8132">5</span>台</view>
|
|
|
+ <view class="td td4">私家车位<span class="body1pie-num colorDC4441">5</span>台</view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <view class="tr" >
|
|
|
+ <view class="td td1" >
|
|
|
+ <view id="body1pie2" class="body1pie">
|
|
|
+
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="td td2" >
|
|
|
+ <view class="td td3" >
|
|
|
|
|
|
+ <view class="td td4">正常<span class="body1pie-num color53B56B">5</span>台</view>
|
|
|
+ <view class="td td4">离线<span class="body1pie-num colorAAAAAA">5</span>台</view>
|
|
|
</view>
|
|
|
- </td>
|
|
|
- <td>空闲5台</td>
|
|
|
- <td>占用5台</td>
|
|
|
- </tr>
|
|
|
- <tr>
|
|
|
-
|
|
|
- <td>公共车位3台</td>
|
|
|
- <td>私家车位1台</td>
|
|
|
- </tr>
|
|
|
- <tr>
|
|
|
- <td rowspan="2" >
|
|
|
- <view id="body1pie2" class="body1pie">
|
|
|
+ <view class="td td3" >
|
|
|
|
|
|
+ <view class="td td4">故障<span class="body1pie-num colorEF8132">5</span>台</view>
|
|
|
+ <view class="td td4">低电量<span class="body1pie-num colorDC4441">5</span>台</view>
|
|
|
</view>
|
|
|
- </td>
|
|
|
- <td>空闲5台</td>
|
|
|
- <td>占用5台</td>
|
|
|
- </tr>
|
|
|
- <tr>
|
|
|
-
|
|
|
- <td>公共车位3台</td>
|
|
|
- <td>私家车位1台</td>
|
|
|
- </tr>
|
|
|
- <tr>
|
|
|
- <td rowspan="2" >
|
|
|
- <view id="body1pie3" class="body1pie">
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <view class="tr">
|
|
|
+ <view class="td td1">
|
|
|
+ <view id="body1pie3" class="body1pie">
|
|
|
+
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="td td2" >
|
|
|
+ <view class="td td3" >
|
|
|
|
|
|
+ <view class="td td4">管理员<span class="body1pie-num color307AF6">5</span>人</view>
|
|
|
+ <view class="td td4">白名单<span class="body1pie-num color53B56B">5</span>人</view>
|
|
|
</view>
|
|
|
- </td>
|
|
|
- <td>空闲5台</td>
|
|
|
- <td>占用5台</td>
|
|
|
- </tr>
|
|
|
- <tr>
|
|
|
-
|
|
|
- <td>公共车位3台</td>
|
|
|
- <td>私家车位1台</td>
|
|
|
- </tr>
|
|
|
-
|
|
|
- </table>
|
|
|
- </jpContent>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
-
|
|
|
- </view>
|
|
|
- <tabbar :current="0"></tabbar>
|
|
|
-
|
|
|
- </view>
|
|
|
-</template>
|
|
|
-
|
|
|
-<script>
|
|
|
- import Tabbar from '@/components/Tabbar.vue'
|
|
|
- import jpContent from '@/components/JPcontent.vue'
|
|
|
-
|
|
|
- import * as API from '@/apis/pagejs/index.js'
|
|
|
-
|
|
|
- export default {
|
|
|
- components: {
|
|
|
- Tabbar,jpContent
|
|
|
- },
|
|
|
- data() {
|
|
|
- return {
|
|
|
- isReady:false,
|
|
|
- jpContentMap:{
|
|
|
- body1:2
|
|
|
+ <view class="td td3" >
|
|
|
+
|
|
|
+ <view class="td td4">游客<span class="body1pie-num colorEF8375">5</span>人次</view>
|
|
|
+ <view class="td td4"></view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ </view>
|
|
|
+
|
|
|
+
|
|
|
+ </view>
|
|
|
+ </jpContent>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ </view>
|
|
|
+ <tabbar :current="0"></tabbar>
|
|
|
+
|
|
|
+ </view>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+ import Tabbar from '@/components/Tabbar.vue'
|
|
|
+ import jpContent from '@/components/JPcontent.vue'
|
|
|
+ import * as echarts from 'echarts';
|
|
|
+
|
|
|
+ import * as API from '@/apis/pagejs/index.js'
|
|
|
+
|
|
|
+ export default {
|
|
|
+ components: {
|
|
|
+ Tabbar,
|
|
|
+ jpContent
|
|
|
+ },
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ isReady: false,
|
|
|
+ echartsList: {
|
|
|
+
|
|
|
+ },
|
|
|
+ jpContentMap: {
|
|
|
+ body1: 2
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ onLoad() {
|
|
|
+
|
|
|
+ },
|
|
|
+ onReady() {
|
|
|
+ this.getfindByOpenId();
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ getbody1pie1() {
|
|
|
+ var img=require("@/assets/img/index/pie1-1.svg")
|
|
|
+ var key = "body1pie1"
|
|
|
+ var myChart = this.echartsList[key];
|
|
|
+ if (!myChart) {
|
|
|
+ myChart = echarts.init(document.getElementById(key), null, {
|
|
|
+ width: uni.upx2px(88),
|
|
|
+ height: uni.upx2px(88)
|
|
|
+ })
|
|
|
+
|
|
|
+ }
|
|
|
+ myChart.clear()
|
|
|
+ var option = {
|
|
|
+
|
|
|
+ series: [{
|
|
|
+ silent: true,
|
|
|
+ type: 'pie',
|
|
|
+ radius: ['70%', '100%'],
|
|
|
+ label: {
|
|
|
+ show: false,
|
|
|
+ },
|
|
|
+
|
|
|
+ data: [{
|
|
|
+ value: 1048,
|
|
|
+ itemStyle: { color: '#AAAAAA' }
|
|
|
+ },
|
|
|
+ {
|
|
|
+ value: 735 ,
|
|
|
+ itemStyle: { color: '#53B56B' }
|
|
|
+ }
|
|
|
+ ]
|
|
|
+ }],
|
|
|
+ grid: {
|
|
|
+ top: 0,
|
|
|
+ left: 0,
|
|
|
+ right: 0,
|
|
|
+ bottom: 0,
|
|
|
+ containLabel: true
|
|
|
+ },
|
|
|
+ graphic: [{
|
|
|
+ type: 'image',
|
|
|
+ id: 'logo',
|
|
|
+ left: 'center',
|
|
|
+ top: 'center',
|
|
|
+ style: {
|
|
|
+ image: img, // 图片路径
|
|
|
+ width: uni.upx2px(40),
|
|
|
+ height: uni.upx2px(40)
|
|
|
+ }
|
|
|
+ }]
|
|
|
+ }
|
|
|
+ myChart.setOption(option);
|
|
|
+ this.echartsList[key] = myChart;
|
|
|
+ },
|
|
|
+ getbody1pie2() {
|
|
|
+ var img=require("@/assets/img/index/pie1-2.svg")
|
|
|
+
|
|
|
+ var key = "body1pie2"
|
|
|
+ var myChart = this.echartsList[key];
|
|
|
+ if (!myChart) {
|
|
|
+ myChart = echarts.init(document.getElementById(key), null, {
|
|
|
+ width: uni.upx2px(88),
|
|
|
+ height: uni.upx2px(88)
|
|
|
+ })
|
|
|
+
|
|
|
+ }
|
|
|
+ myChart.clear()
|
|
|
+ var option = {
|
|
|
+
|
|
|
+ series: [{
|
|
|
+ silent: true,
|
|
|
+ type: 'pie',
|
|
|
+ radius: ['70%', '100%'],
|
|
|
+ label: {
|
|
|
+ show: false,
|
|
|
+ },
|
|
|
+
|
|
|
+ data: [{
|
|
|
+ value: 1048,
|
|
|
+ itemStyle: { color: '#AAAAAA' }
|
|
|
+ },
|
|
|
+ {
|
|
|
+ value: 735 ,
|
|
|
+ itemStyle: { color: '#53B56B' }
|
|
|
+ },
|
|
|
+ {
|
|
|
+ value: 1048,
|
|
|
+ itemStyle: { color: '#EF8132' }
|
|
|
+ },
|
|
|
+ {
|
|
|
+ value: 735 ,
|
|
|
+ itemStyle: { color: '#DC4441' }
|
|
|
+ }
|
|
|
+ ]
|
|
|
+ }],
|
|
|
+ grid: {
|
|
|
+ top: 0,
|
|
|
+ left: 0,
|
|
|
+ right: 0,
|
|
|
+ bottom: 0,
|
|
|
+ containLabel: true
|
|
|
+ },
|
|
|
+ graphic: [{
|
|
|
+ type: 'image',
|
|
|
+ id: 'logo',
|
|
|
+ left: 'center',
|
|
|
+ top: 'center',
|
|
|
+ style: {
|
|
|
+ image: img, // 图片路径
|
|
|
+ width: uni.upx2px(40),
|
|
|
+ height: uni.upx2px(40)
|
|
|
+ }
|
|
|
+ }]
|
|
|
}
|
|
|
- }
|
|
|
- },
|
|
|
- onLoad() {
|
|
|
- this.getfindByOpenId();
|
|
|
- },
|
|
|
- onReady() {
|
|
|
-
|
|
|
- },
|
|
|
- methods: {
|
|
|
- init(){
|
|
|
+ myChart.setOption(option);
|
|
|
+ this.echartsList[key] = myChart;
|
|
|
+ },
|
|
|
+ getbody1pie3() {
|
|
|
+ var img=require("@/assets/img/index/pie1-3.svg")
|
|
|
+
|
|
|
+ var key = "body1pie3"
|
|
|
+ var myChart = this.echartsList[key];
|
|
|
+ if (!myChart) {
|
|
|
+ myChart = echarts.init(document.getElementById(key), null, {
|
|
|
+ width: uni.upx2px(88),
|
|
|
+ height: uni.upx2px(88)
|
|
|
+ })
|
|
|
+
|
|
|
+ }
|
|
|
+ myChart.clear()
|
|
|
+ var option = {
|
|
|
|
|
|
- },
|
|
|
- getfindByOpenId() {
|
|
|
- uni.showLoading({
|
|
|
- title: "加载中",
|
|
|
- mask: true,
|
|
|
- })
|
|
|
- API.findByOpenId({
|
|
|
- openId: this.jphelp.getOpenId(),
|
|
|
- }).then((response) => {
|
|
|
- uni.hideLoading();
|
|
|
- this.isReady = true;
|
|
|
-
|
|
|
- this.init()
|
|
|
- }).catch(error => {
|
|
|
- uni.showToast({
|
|
|
- title: error,
|
|
|
- icon: "none"
|
|
|
- })
|
|
|
- })
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
-</script>
|
|
|
+ series: [{
|
|
|
+ type: 'pie',
|
|
|
+ silent: true, // 禁用交互效果
|
|
|
|
|
|
+ radius: ['70%', '100%'],
|
|
|
+ label: {
|
|
|
+ show: false,
|
|
|
+ },
|
|
|
+
|
|
|
+ data: [
|
|
|
+ {
|
|
|
+ value: 735 ,
|
|
|
+ itemStyle: { color: '#53B56B' }
|
|
|
+ },
|
|
|
+ {
|
|
|
+ value: 735 ,
|
|
|
+ itemStyle: { color: '#EF8375' }
|
|
|
+ },
|
|
|
+ {
|
|
|
+ value: 735 ,
|
|
|
+ itemStyle: { color: '#307AF6' }
|
|
|
+ }
|
|
|
+ ]
|
|
|
+ }],
|
|
|
+ grid: {
|
|
|
+ top: 0,
|
|
|
+ left: 0,
|
|
|
+ right: 0,
|
|
|
+ bottom: 0,
|
|
|
+ containLabel: true
|
|
|
+ },
|
|
|
+ graphic: [{
|
|
|
+ type: 'image',
|
|
|
+ id: 'logo',
|
|
|
+ left: 'center',
|
|
|
+ top: 'center',
|
|
|
+ style: {
|
|
|
+ image: img, // 图片路径
|
|
|
+ width: uni.upx2px(40),
|
|
|
+ height: uni.upx2px(40)
|
|
|
+ }
|
|
|
+ }]
|
|
|
+ }
|
|
|
+ myChart.setOption(option);
|
|
|
+ this.echartsList[key] = myChart;
|
|
|
+ },
|
|
|
+ init() {
|
|
|
+ this.getbody1pie1()
|
|
|
+ this.getbody1pie2()
|
|
|
+ this.getbody1pie3()
|
|
|
+ },
|
|
|
+ getfindByOpenId() {
|
|
|
+ uni.showLoading({
|
|
|
+ title: "加载中",
|
|
|
+ mask: true,
|
|
|
+ })
|
|
|
+ API.findByOpenId({
|
|
|
+ openId: this.jphelp.getOpenId(),
|
|
|
+ }).then((response) => {
|
|
|
+
|
|
|
+ uni.hideLoading();
|
|
|
+ this.isReady = true;
|
|
|
+ this.loginset(response)
|
|
|
+ try {
|
|
|
+ this.init()
|
|
|
+ } catch (e) {
|
|
|
+ console.log(e)
|
|
|
+ uni.showToast({
|
|
|
+ title: e,
|
|
|
+ icon: "none"
|
|
|
+ })
|
|
|
+ }
|
|
|
+
|
|
|
+ }).catch(error => {
|
|
|
+ uni.showToast({
|
|
|
+ title: error,
|
|
|
+ icon: "none"
|
|
|
+ })
|
|
|
+ uni.redirectTo({
|
|
|
+ url: '/pages/login/login'
|
|
|
+ })
|
|
|
+ })
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+</script>
|
|
|
+
|
|
|
<style scoped lang="scss">
|
|
|
- // 导航栏
|
|
|
- .navbar {
|
|
|
-
|
|
|
-
|
|
|
- background-color: rgba(22, 119, 255, 1);
|
|
|
- color: #fff;
|
|
|
- line-height: 88rpx;
|
|
|
- display: flex;
|
|
|
- justify-content: space-between;
|
|
|
- align-items: center;
|
|
|
- padding: 0 32rpx;
|
|
|
- color: rgba(255, 255, 255, 1);
|
|
|
- font-size: 36rpx;
|
|
|
- position: fixed;
|
|
|
- left: 0;
|
|
|
- right: 0;
|
|
|
- top: 0;
|
|
|
- z-index: 999999;
|
|
|
- font-weight: bold;
|
|
|
-
|
|
|
+ .color307AF6{
|
|
|
+ color:#307AF6
|
|
|
}
|
|
|
- .main {
|
|
|
- border-radius: 16px 16px 0px 0px;
|
|
|
- background: linear-gradient(180deg, rgba(242, 244, 246, 1) 61%, rgba(255, 255, 255, 0) 100%);
|
|
|
- margin-top: -24rpx;
|
|
|
- padding: 32rpx ;
|
|
|
- .statistics {
|
|
|
- border-radius: 8px;
|
|
|
- background-color: rgba(255, 255, 255, 1);
|
|
|
- box-shadow: 0px 1px 6px 0px rgba(0, 59, 142, 0.05);
|
|
|
- margin-bottom: 24rpx;
|
|
|
- padding: 40rpx;
|
|
|
-
|
|
|
- .title {
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- margin-bottom: 16rpx;
|
|
|
-
|
|
|
- .img {
|
|
|
- width: 36rpx;
|
|
|
- height: 36rpx;
|
|
|
- vertical-align: middle;
|
|
|
- border-radius: 999px;
|
|
|
-
|
|
|
- }
|
|
|
-
|
|
|
- .change {
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
-
|
|
|
- .change-img {
|
|
|
- width: 32rpx;
|
|
|
- height: 32rpx;
|
|
|
- vertical-align: middle;
|
|
|
- }
|
|
|
-
|
|
|
- text {
|
|
|
-
|
|
|
- margin-left: 8rpx;
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
-
|
|
|
- .text {
|
|
|
- color: rgba(16, 16, 16, 1);
|
|
|
- font-size: 36rpx;
|
|
|
- margin-left: 16rpx;
|
|
|
- font-weight: bold;
|
|
|
- }
|
|
|
-
|
|
|
- .change {
|
|
|
- margin-left: 16rpx;
|
|
|
- font-size: 24rpx;
|
|
|
- color: #838383;
|
|
|
-
|
|
|
+ .color53B56B{
|
|
|
+ color:#53B56B
|
|
|
+ }
|
|
|
+ .colorAAAAAA{
|
|
|
+ color:#AAAAAA
|
|
|
+ }
|
|
|
+ .colorEF8132{
|
|
|
+ color:#EF8132
|
|
|
+ }
|
|
|
+ .colorDC4441{
|
|
|
+ color:#DC4441
|
|
|
+ }
|
|
|
+ .colorEF8375{
|
|
|
+ color:#EF8375
|
|
|
+ }
|
|
|
+
|
|
|
+ .body1pie-table{
|
|
|
+ color: rgba(51,51,51,1);
|
|
|
+ font-size: 32rpx;
|
|
|
+ font-weight: bold;
|
|
|
+ .tr{
|
|
|
+ .td1{
|
|
|
+ padding-right: 24rpx;
|
|
|
}
|
|
|
-
|
|
|
- .check-all {
|
|
|
- margin-left: auto;
|
|
|
- color: rgba(131, 131, 131, 1);
|
|
|
- font-size: 24rpx;
|
|
|
+ display: flex;
|
|
|
+ margin-bottom: 40rpx;
|
|
|
+ .td2{
|
|
|
+
|
|
|
+ width: 100%;
|
|
|
+ .td3{
|
|
|
+ display: flex;
|
|
|
+
|
|
|
+ .td4{
|
|
|
+ width: 120px;
|
|
|
+ }
|
|
|
+ }
|
|
|
}
|
|
|
- }
|
|
|
}
|
|
|
- }
|
|
|
- .tabs-box {
|
|
|
- padding: 32rpx 0;
|
|
|
- margin-top: 66rpx;
|
|
|
- padding-right: 32rpx;
|
|
|
- background-color: rgba(22, 119, 255, 1);
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- justify-content: space-between;
|
|
|
-
|
|
|
- .tabs {
|
|
|
- width: 97%;
|
|
|
+ // td{
|
|
|
+ // padding-right: 24rpx;
|
|
|
+
|
|
|
+ // }
|
|
|
+ .body1pie{
|
|
|
+
|
|
|
}
|
|
|
- .more{
|
|
|
- padding-right: 12rpx;
|
|
|
+ .body1pie-num{
|
|
|
+ margin: 0 8rpx;
|
|
|
}
|
|
|
-
|
|
|
}
|
|
|
-</style>
|
|
|
+
|
|
|
+ // 导航栏
|
|
|
+ .navbar {
|
|
|
+
|
|
|
+
|
|
|
+ background-color: rgba(22, 119, 255, 1);
|
|
|
+ color: #fff;
|
|
|
+ line-height: 88rpx;
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ align-items: center;
|
|
|
+ padding: 0 32rpx;
|
|
|
+ color: rgba(255, 255, 255, 1);
|
|
|
+ font-size: 36rpx;
|
|
|
+ position: fixed;
|
|
|
+ left: 0;
|
|
|
+ right: 0;
|
|
|
+ top: 0;
|
|
|
+ z-index: 999999;
|
|
|
+ font-weight: bold;
|
|
|
+
|
|
|
+ }
|
|
|
+
|
|
|
+ .main {
|
|
|
+ border-radius: 16px 16px 0px 0px;
|
|
|
+ background: linear-gradient(180deg, rgba(242, 244, 246, 1) 61%, rgba(255, 255, 255, 0) 100%);
|
|
|
+ margin-top: -24rpx;
|
|
|
+ padding: 32rpx;
|
|
|
+
|
|
|
+ .statistics {
|
|
|
+ border-radius: 8px;
|
|
|
+ background-color: rgba(255, 255, 255, 1);
|
|
|
+ box-shadow: 0px 1px 6px 0px rgba(0, 59, 142, 0.05);
|
|
|
+ margin-bottom: 24rpx;
|
|
|
+ padding: 40rpx;
|
|
|
+
|
|
|
+ .title {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ margin-bottom: 32rpx;
|
|
|
+
|
|
|
+ .img {
|
|
|
+ width: 36rpx;
|
|
|
+ height: 36rpx;
|
|
|
+ vertical-align: middle;
|
|
|
+ border-radius: 999px;
|
|
|
+
|
|
|
+ }
|
|
|
+
|
|
|
+ .change {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+
|
|
|
+ .change-img {
|
|
|
+ width: 32rpx;
|
|
|
+ height: 32rpx;
|
|
|
+ vertical-align: middle;
|
|
|
+ }
|
|
|
+
|
|
|
+ text {
|
|
|
+
|
|
|
+ margin-left: 8rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+ .text {
|
|
|
+ color: rgba(16, 16, 16, 1);
|
|
|
+ font-size: 36rpx;
|
|
|
+ margin-left: 16rpx;
|
|
|
+ font-weight: bold;
|
|
|
+ }
|
|
|
+
|
|
|
+ .change {
|
|
|
+ margin-left: 16rpx;
|
|
|
+ font-size: 24rpx;
|
|
|
+ color: #838383;
|
|
|
+
|
|
|
+ }
|
|
|
+
|
|
|
+ .check-all {
|
|
|
+ margin-left: auto;
|
|
|
+ color: rgba(131, 131, 131, 1);
|
|
|
+ font-size: 24rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .statistics-end {
|
|
|
+ padding-bottom: 0;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .tabs-box {
|
|
|
+ padding: 32rpx 0;
|
|
|
+ margin-top: 66rpx;
|
|
|
+ padding-right: 32rpx;
|
|
|
+ background-color: rgba(22, 119, 255, 1);
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: space-between;
|
|
|
+
|
|
|
+ .tabs {
|
|
|
+ width: 97%;
|
|
|
+ }
|
|
|
+
|
|
|
+ .more {
|
|
|
+ padding-right: 12rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ }
|
|
|
+</style>
|