|
@@ -28,42 +28,44 @@
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
- <u-row>
|
|
|
- <u-col span="6" class="card_two">
|
|
|
- <view class="">
|
|
|
- 本年度传阅卡来文部门top5
|
|
|
- </view>
|
|
|
- <view class="card_list">
|
|
|
+ <view class="grid_row">
|
|
|
+ <u-row justify="space-between" >
|
|
|
+ <u-col span="6" class="card_two">
|
|
|
+ <view class="card_two_title text-center">
|
|
|
+ 本年度传阅卡来文部门top5
|
|
|
+ </view>
|
|
|
+ <view class="card_list">
|
|
|
<u-row class="cell_item" justify="space-between" gutter="10" v-for="(item,index) in dataList">
|
|
|
- <u-col span="2">
|
|
|
+ <u-col span="3">
|
|
|
<view class="text-grey text-center">
|
|
|
{{index+1}}
|
|
|
</view>
|
|
|
</u-col>
|
|
|
- <u-col span="4">
|
|
|
- <view class="text-center text-bold text-black ellipsis-description">
|
|
|
+ <u-col span="6">
|
|
|
+ <view class=" text-bold text-black ellipsis-description">
|
|
|
{{item.name}}
|
|
|
</view>
|
|
|
</u-col>
|
|
|
- <u-col span="6">
|
|
|
- <view class="text-center text-grey text-sm ">
|
|
|
+ <u-col span="3">
|
|
|
+ <view class="text-center text-blue text-sm ">
|
|
|
{{item.num}}
|
|
|
</view>
|
|
|
</u-col>
|
|
|
</u-row>
|
|
|
- </view>
|
|
|
- </u-col>
|
|
|
- <u-col span="6" class="card_two">
|
|
|
- <view class="">
|
|
|
- 本月新增文件传阅卡分析
|
|
|
- </view>
|
|
|
- <view class="card_chart">
|
|
|
- <view class="charts-box_1">
|
|
|
- <qiun-data-charts type="ring" :opts="opts1" :chartData="chartDataOne" />
|
|
|
</view>
|
|
|
- </view>
|
|
|
- </u-col>
|
|
|
- </u-row>
|
|
|
+ </u-col>
|
|
|
+ <u-col span="6" class="card_two" style="margin-left: 10px;">
|
|
|
+ <view class="card_two_title text-center">
|
|
|
+ 本月新增文件传阅卡分析
|
|
|
+ </view>
|
|
|
+ <view class="card_chart">
|
|
|
+ <view class="charts-box_1">
|
|
|
+ <qiun-data-charts type="ring" :opts="opts1" :chartData="chartDataOne" />
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </u-col>
|
|
|
+ </u-row>
|
|
|
+ </view>
|
|
|
</view>
|
|
|
</template>
|
|
|
|
|
@@ -104,7 +106,8 @@
|
|
|
color: ["#0ec89a"],
|
|
|
enableScroll: false,
|
|
|
legend: {
|
|
|
- show: false
|
|
|
+ show: false,
|
|
|
+
|
|
|
},
|
|
|
extra: {
|
|
|
column: {
|
|
@@ -122,17 +125,12 @@
|
|
|
"#ea7ccc"
|
|
|
],
|
|
|
padding: [5, 5, 5, 5],
|
|
|
- dataLabel: true,
|
|
|
+ // dataLabel: true,
|
|
|
enableScroll: false,
|
|
|
legend: {
|
|
|
show: true,
|
|
|
- position: "right",
|
|
|
- lineHeight: 25
|
|
|
- },
|
|
|
- title: {
|
|
|
- name: "收益率",
|
|
|
- fontSize: 15,
|
|
|
- color: "#666666"
|
|
|
+ position: "bottom",
|
|
|
+ float:"left"
|
|
|
},
|
|
|
subtitle: {
|
|
|
name: "70%",
|
|
@@ -141,7 +139,7 @@
|
|
|
},
|
|
|
extra: {
|
|
|
ring: {
|
|
|
- ringWidth: 60,
|
|
|
+ ringWidth: 100,
|
|
|
activeOpacity: 0.5,
|
|
|
activeRadius: 10,
|
|
|
offsetAngle: 0,
|
|
@@ -189,7 +187,7 @@
|
|
|
}, 500);
|
|
|
setTimeout(() => {
|
|
|
let res2 = {
|
|
|
- categories: ["政府办", "去去去", "11111"],
|
|
|
+ categories: ["政府办", "法规办", "教育办"],
|
|
|
legend: {
|
|
|
show: false
|
|
|
},
|
|
@@ -205,10 +203,8 @@
|
|
|
series: [{
|
|
|
data: [{
|
|
|
"value": 50,
|
|
|
- "labelShow": false
|
|
|
}, {
|
|
|
- "value": 30,
|
|
|
- "labelShow": false
|
|
|
+ "value": 50,
|
|
|
}]
|
|
|
}]
|
|
|
};
|
|
@@ -234,7 +230,7 @@
|
|
|
|
|
|
.charts-box_1 {
|
|
|
width: 100%;
|
|
|
- height: 80px;
|
|
|
+ height: 120px;
|
|
|
}
|
|
|
|
|
|
.card_one {
|
|
@@ -279,18 +275,31 @@
|
|
|
}
|
|
|
|
|
|
.card_two {
|
|
|
- width: 100%;
|
|
|
- margin: 10px;
|
|
|
- position: relative;
|
|
|
+ height: 200px;
|
|
|
border-radius: 20px;
|
|
|
background-color: #f5f5f5;
|
|
|
box-shadow: 0 0 0 1px #ccc;
|
|
|
+
|
|
|
+ }
|
|
|
+
|
|
|
+ .grid_row {
|
|
|
+ width: 96%;
|
|
|
+ padding: 0 10px;
|
|
|
+ position: relative;
|
|
|
+ top: -20px;
|
|
|
}
|
|
|
|
|
|
.cell_item {
|
|
|
height: 30px;
|
|
|
line-height: 30px;
|
|
|
text-align: center;
|
|
|
+ border-bottom: 1px solid #eee;
|
|
|
+ }
|
|
|
|
|
|
+ .card_two_title {
|
|
|
+ height: 30px;
|
|
|
+ /* line-height: 30px; */
|
|
|
+ margin:10px 0px ;
|
|
|
+ font-size: 12px;
|
|
|
}
|
|
|
</style>
|