|
@@ -1,4 +1,44 @@
|
|
|
<template>
|
|
|
+ <!-- <div class="block">-->
|
|
|
+ <!-- <div-->
|
|
|
+ <!-- v-for="index in 5"-->
|
|
|
+ <!-- class="flex flex-center"-->
|
|
|
+ <!-- style="-->
|
|
|
+ <!-- height: 26px;-->
|
|
|
+ <!-- margin-left: 10px;-->
|
|
|
+ <!-- margin-right: 10px;-->
|
|
|
+ <!-- margin-top: 7px;-->
|
|
|
+ <!-- "-->
|
|
|
+ <!-- >-->
|
|
|
+ <!-- <div-->
|
|
|
+ <!-- v-if="index <= 3"-->
|
|
|
+ <!-- style="width: 5%; font-size: 18px; font-weight: bold; color: #ffa100"-->
|
|
|
+ <!-- >-->
|
|
|
+ <!-- {{ index }}.-->
|
|
|
+ <!-- </div>-->
|
|
|
+ <!-- <div-->
|
|
|
+ <!-- v-else-->
|
|
|
+ <!-- style="width: 5%; font-size: 18px; font-weight: bold; color: #ffffff"-->
|
|
|
+ <!-- >-->
|
|
|
+ <!-- {{ index }}.-->
|
|
|
+ <!-- </div>-->
|
|
|
+ <!-- <div class="flex flex-align-center" style="width: 85%">-->
|
|
|
+ <!-- <div-->
|
|
|
+ <!-- style="-->
|
|
|
+ <!-- align-items: center;-->
|
|
|
+ <!-- width: 88%;-->
|
|
|
+ <!-- height: 26px;-->
|
|
|
+ <!-- margin-left: 3px;-->
|
|
|
+ <!-- background: rgba(171, 118, 48, 0.82);-->
|
|
|
+ <!-- border-radius: 20px;-->
|
|
|
+ <!-- "-->
|
|
|
+ <!-- >-->
|
|
|
+ <!-- 什么项目的名字11111-->
|
|
|
+ <!-- </div>-->
|
|
|
+ <!-- </div>-->
|
|
|
+ <!-- <div style="width: 10%; color: rgb(6, 243, 223)">118</div>-->
|
|
|
+ <!-- </div>-->
|
|
|
+ <!-- </div>-->
|
|
|
<div>
|
|
|
<charts
|
|
|
style="margin-top: -40px"
|
|
@@ -60,6 +100,8 @@ export default {
|
|
|
}
|
|
|
},
|
|
|
axisLabel: {
|
|
|
+ inside: true,
|
|
|
+ color: '#fff',
|
|
|
textStyle: {
|
|
|
fontSize: "20",
|
|
|
color: function(params,index) {
|
|
@@ -112,6 +154,13 @@ export default {
|
|
|
this.option.series[0].data = result.data.records.map((item) => {
|
|
|
return item.viewNumber
|
|
|
}).reverse()
|
|
|
+ this.option.yAxis.data = result.data.records.map((item,index) => {
|
|
|
+ if (item.name.length>=16){
|
|
|
+ return index+1+"."+item.name.substring(0,14)+"..."
|
|
|
+ }else {
|
|
|
+ return index+1+"."+item.name
|
|
|
+ }
|
|
|
+ }).reverse()
|
|
|
}
|
|
|
})
|
|
|
},
|