|
|
@@ -4,16 +4,16 @@
|
|
|
<view class="statistics">
|
|
|
<view class="statistics-t">
|
|
|
<view class="statistics-t-l">危化品总数：</view>
|
|
|
- <view class="statistics-t-r">9999 </view>
|
|
|
+ <view class="statistics-t-r">1455 </view>
|
|
|
</view>
|
|
|
<view class="statistics-b">
|
|
|
<view class="statistics-b-li">
|
|
|
- <view class="statistics-b-li-t color-A">688.5 kg</view>
|
|
|
+ <view class="statistics-b-li-t color-A">1769 kg</view>
|
|
|
<view class="statistics-b-li-b">总量</view>
|
|
|
</view>
|
|
|
<view class="line"></view>
|
|
|
<view class="statistics-b-li">
|
|
|
- <view class="statistics-b-li-t color-B">3100 </view>
|
|
|
+ <view class="statistics-b-li-t color-B">14 </view>
|
|
|
<view class="statistics-b-li-b">今日新增数</view>
|
|
|
</view>
|
|
|
<view class="line"></view>
|
|
|
@@ -31,12 +31,14 @@
|
|
|
<view class="chart-t">
|
|
|
<qiun-data-charts type="funnel" :opts="opts" :echartsH5="true" :chartData="chartData" />
|
|
|
</view>
|
|
|
- <view class="chart-b">
|
|
|
- <view>1</view>
|
|
|
- <view>化学与药学院</view>
|
|
|
- <view>总数999</view>
|
|
|
+ <view class="chart-b" v-for="(item,index) in dataList" :key="index">
|
|
|
+ <view :class="index==0?'chartOne':(index==1?'chartTow':(index==2?'chartThree':'chartFive'))">
|
|
|
+ {{index+1}}
|
|
|
+ </view>
|
|
|
+ <view>{{item.data1}}</view>
|
|
|
+ <view>总数{{item.data2}}</view>
|
|
|
<view>|</view>
|
|
|
- <view>今日新增19</view>
|
|
|
+ <view>今日新增{{item.data3}}</view>
|
|
|
<img src="@/pages/images/dataBoard/dataBoard-icon2.png">
|
|
|
</view>
|
|
|
</view>
|
|
|
@@ -53,11 +55,13 @@
|
|
|
</view>
|
|
|
<view class="table-tb">
|
|
|
<view class="table-tb-li" v-for="(item,index) in dataList" :key="index">
|
|
|
- <view>{{item.data2}}</view>
|
|
|
+ <view>
|
|
|
+ <text :class="index==0?'sortOne':(index==1?'sortTow':(index==2?'sortThree':'sortFive'))">{{index+1}}</text>
|
|
|
+ </view>
|
|
|
<view>{{item.data1}}</view>
|
|
|
<view>{{item.data2}}</view>
|
|
|
- <view>{{item.data2}}</view>
|
|
|
- <view>{{item.data2}}</view>
|
|
|
+ <view>{{item.data3}}</view>
|
|
|
+ <view>{{item.data4}}</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
@@ -107,20 +111,39 @@
|
|
|
pageSize: 10,
|
|
|
},
|
|
|
dataList: [{
|
|
|
- data1: '学院学院简称',
|
|
|
- data2: '666',
|
|
|
+ data1: '植物保护',
|
|
|
+ data2: '499',
|
|
|
+ data3: '47',
|
|
|
+ data4: '220',
|
|
|
+ data5: '137',
|
|
|
},
|
|
|
{
|
|
|
- data1: '学院学院简称',
|
|
|
- data2: '666',
|
|
|
+ data1: '资源环境',
|
|
|
+ data2: '199',
|
|
|
+ data3: '7',
|
|
|
+ data4: '120',
|
|
|
+ data5: '37',
|
|
|
},
|
|
|
{
|
|
|
- data1: '学院学院简称',
|
|
|
- data2: '666',
|
|
|
+ data1: '生命科学',
|
|
|
+ data2: '299',
|
|
|
+ data3: '71',
|
|
|
+ data4: '10',
|
|
|
+ data5: '37',
|
|
|
},
|
|
|
{
|
|
|
- data1: '学院学院简称',
|
|
|
- data2: '666',
|
|
|
+ data1: '资源环境',
|
|
|
+ data2: '199',
|
|
|
+ data3: '7',
|
|
|
+ data4: '120',
|
|
|
+ data5: '37',
|
|
|
+ },
|
|
|
+ {
|
|
|
+ data1: '生命科学',
|
|
|
+ data2: '299',
|
|
|
+ data3: '71',
|
|
|
+ data4: '10',
|
|
|
+ data5: '37',
|
|
|
},
|
|
|
],
|
|
|
total: 0,
|
|
|
@@ -146,25 +169,30 @@
|
|
|
let res = {
|
|
|
series: [{
|
|
|
data: [{
|
|
|
- "name": "一班",
|
|
|
+ "name": "植物保护",
|
|
|
"centerText": "50",
|
|
|
- "value": 50
|
|
|
+ "value": 50,
|
|
|
+ "labelText":"总量88.88kg",
|
|
|
}, {
|
|
|
- "name": "二班",
|
|
|
+ "name": "园林艺术",
|
|
|
"centerText": "30",
|
|
|
- "value": 30
|
|
|
+ "value": 30,
|
|
|
+ "labelText":"总量88.88kg"
|
|
|
}, {
|
|
|
- "name": "三班",
|
|
|
+ "name": "生命科学",
|
|
|
"centerText": "20",
|
|
|
- "value": 20
|
|
|
+ "value": 20,
|
|
|
+ "labelText":"总量88.88kg"
|
|
|
}, {
|
|
|
- "name": "四班",
|
|
|
+ "name": "理学院",
|
|
|
"centerText": "18",
|
|
|
- "value": 18
|
|
|
+ "value": 18,
|
|
|
+ "labelText":"总量88.88kg"
|
|
|
}, {
|
|
|
- "name": "五班",
|
|
|
+ "name": "农学院",
|
|
|
"centerText": "8",
|
|
|
- "value": 8
|
|
|
+ "value": 8,
|
|
|
+ "labelText":"总量88.88kg"
|
|
|
}]
|
|
|
}]
|
|
|
};
|
|
|
@@ -214,7 +242,7 @@
|
|
|
|
|
|
.chart-t {
|
|
|
width: 650rpx;
|
|
|
- height: 380rpx;
|
|
|
+ height: 452rpx;
|
|
|
}
|
|
|
|
|
|
.chart-b {
|
|
|
@@ -235,10 +263,8 @@
|
|
|
>view:nth-of-type(1) {
|
|
|
width: 32rpx;
|
|
|
height: 32rpx;
|
|
|
- background: rgba(255, 0, 0, 0.2);
|
|
|
font-weight: 400;
|
|
|
font-size: 28rpx;
|
|
|
- color: #FF0000;
|
|
|
line-height: 32rpx;
|
|
|
text-align: center;
|
|
|
margin-right: 18rpx;
|
|
|
@@ -280,6 +306,22 @@
|
|
|
height: 28rpx;
|
|
|
}
|
|
|
}
|
|
|
+ .chartOne{
|
|
|
+ background: rgba(255, 0, 0, 0.2);
|
|
|
+ color: #FF0000;
|
|
|
+ }
|
|
|
+ .chartTow{
|
|
|
+ background: #FFE3CC;
|
|
|
+ color: #FF9900;
|
|
|
+ }
|
|
|
+ .chartThree{
|
|
|
+ background: #FFEECC;
|
|
|
+ color: #FFAA00;
|
|
|
+ }
|
|
|
+ .chartFive{
|
|
|
+ background: #CCE6FE;
|
|
|
+ color: #0183FA;
|
|
|
+ }
|
|
|
}
|
|
|
|
|
|
.statistics {
|
|
|
@@ -449,6 +491,65 @@
|
|
|
width: 168rpx;
|
|
|
}
|
|
|
}
|
|
|
+ .sortOne {
|
|
|
+ display: inline-block;
|
|
|
+ width: 40rpx;
|
|
|
+ height: 40rpx;
|
|
|
+ padding: 4rpx;
|
|
|
+ box-sizing: border-box;
|
|
|
+ background: rgba(255, 0, 0, 0.2);
|
|
|
+ font-weight: 400;
|
|
|
+ font-size: 28rpx;
|
|
|
+ color: #FF0000;
|
|
|
+ line-height: 40rpx;
|
|
|
+ text-align: center;
|
|
|
+ border-radius: 20rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .sortTow {
|
|
|
+ display: inline-block;
|
|
|
+ width: 40rpx;
|
|
|
+ height: 40rpx;
|
|
|
+ padding: 4rpx;
|
|
|
+ box-sizing: border-box;
|
|
|
+ background: rgba(255, 153, 0, 0.2);
|
|
|
+ font-weight: 400;
|
|
|
+ font-size: 28rpx;
|
|
|
+ color: #FF9900;
|
|
|
+ line-height: 40rpx;
|
|
|
+ text-align: center;
|
|
|
+ border-radius: 20rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .sortThree {
|
|
|
+ display: inline-block;
|
|
|
+ width: 40rpx;
|
|
|
+ height: 40rpx;
|
|
|
+ padding: 4rpx;
|
|
|
+ box-sizing: border-box;
|
|
|
+ background: rgba(255, 242, 0, 0.2);
|
|
|
+ font-weight: 400;
|
|
|
+ font-size: 28rpx;
|
|
|
+ color: #FFF200;
|
|
|
+ line-height: 40rpx;
|
|
|
+ text-align: center;
|
|
|
+ border-radius: 20rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .sortFive {
|
|
|
+ display: inline-block;
|
|
|
+ width: 40rpx;
|
|
|
+ height: 40rpx;
|
|
|
+ padding: 4rpx;
|
|
|
+ box-sizing: border-box;
|
|
|
+ background: rgba(1, 131, 250, 0.2);
|
|
|
+ font-weight: 400;
|
|
|
+ font-size: 28rpx;
|
|
|
+ color: #0183FA;
|
|
|
+ line-height: 40rpx;
|
|
|
+ text-align: center;
|
|
|
+ border-radius: 20rpx;
|
|
|
+ }
|
|
|
|
|
|
|
|
|
}
|
heyang