Skip to content

bdc / bdcjg-web

Go to a project
Toggle navigation
Toggle navigation pinning
d511ea9f by 田浩浩
Options

Merge branch 'master' of http://yun.pashanhoo.com:9090/bdc/bdcjg-web

2 parents 1bffcee7 c1737b81
Inline Side-by-side
Showing 6 changed files with 222 additions and 100 deletions
...@@ -7,13 +7,14 @@ class business { ...@@ -7,13 +7,14 @@ class business {
7 startDate:开始日期 7 startDate:开始日期
8 endDate:结束日期 8 endDate:结束日期
9 */ 9 */
10 async getSuucessRate(startDate,endDate) { 10 async getSuucessRate(startDate,endDate,qxdm) {
11 return request({ 11 return request({
12 url: SERVER.SERVERAPI + '/rest/statistics/Business/sf', 12 url: SERVER.SERVERAPI + '/rest/statistics/Business/sf',
13 method: 'get', 13 method: 'get',
14 params: { 14 params: {
15 startDate:startDate, 15 startDate:startDate,
16 endDate:endDate 16 endDate:endDate,
17 qxdm:qxdm
17 } 18 }
18 }) 19 })
19 } 20 }
......
...@@ -7,13 +7,14 @@ class efficient { ...@@ -7,13 +7,14 @@ class efficient {
7 startDate:开始日期 7 startDate:开始日期
8 endDate:结束日期 8 endDate:结束日期
9 */ 9 */
10 async getProcessCounts(startDate, endDate) { 10 async getProcessCounts(startDate, endDate,qxdm) {
11 return request({ 11 return request({
12 url: SERVER.SERVERAPI + "/rest/statistics/Efficient/getProcessCounts", 12 url: SERVER.SERVERAPI + "/rest/statistics/Efficient/getProcessCounts",
13 method: "post", 13 method: "post",
14 params: { 14 params: {
15 startDate: startDate, 15 startDate: startDate,
16 endDate: endDate, 16 endDate: endDate,
17 qxdm:qxdm
17 }, 18 },
18 }); 19 });
19 } 20 }
......
...@@ -30,7 +30,7 @@ ...@@ -30,7 +30,7 @@
30 border-right: none; 30 border-right: none;
31 text-align: center; 31 text-align: center;
32 padding: 0; 32 padding: 0;
33 color: #02D9FD; 33 color: #05bbdb;
34 line-height: 16px; 34 line-height: 16px;
35 font-size: 12px; 35 font-size: 12px;
36 margin-top: 8px !important; 36 margin-top: 8px !important;
......
...@@ -2,25 +2,44 @@ ...@@ -2,25 +2,44 @@
2 <!-- 监控日志 --> 2 <!-- 监控日志 -->
3 <div class="jktjDetail form-clues"> 3 <div class="jktjDetail form-clues">
4 <!-- 头部搜索 --> 4 <!-- 头部搜索 -->
5 <el-form ref="form" :model="form" :inline="true" class="from-clues-header" label-width="100px"> 5 <div class="from-clues-header">
6 <el-form-item> 6 <el-form ref="form" :model="form" label-width="100px">
7 <Breadcrumb /> 7 <el-form-item>
8 </el-form-item> 8 <Breadcrumb />
9 <el-row class="rows"> 9 </el-form-item>
10 <el-col :span="8"> 10 <el-row>
11 <el-form-item label="开始日期"> 11 <el-col :span="4">
12 <el-date-picker v-model="valueTime" value-format="yyyy/MM/dd HH:mm:ss" type="datetimerange" 12 <el-form-item label="开始日期" prop="startTime">
13 range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期"> 13 <el-date-picker
14 </el-date-picker> 14 type="datetime"
15 </el-form-item> 15 placeholder="开始日期"
16 </el-col> 16 :picker-options="pickerOptionsStart"
17 <!-- 操作按钮 --> 17 clearable
18 <el-col :span="3" class="btnColRight"> 18 v-model="form.startTime"
19 <btn nativeType="cz" @click="resetForm">重置</btn> 19 value-format="yyyy/MM/dd HH:mm:ss"
20 <btn nativeType="cx" @click="getProcessCounts">查询</btn> 20 ></el-date-picker>
21 </el-col> 21 </el-form-item>
22 </el-row> 22 </el-col>
23 </el-form> 23 <el-col :span="4">
24 <el-form-item label="结束日期" prop="endTime">
25 <el-date-picker
26 type="datetime"
27 placeholder="结束日期"
28 :picker-options="pickerOptionsEnd"
29 clearable
30 v-model="form.endTime"
31 value-format="yyyy/MM/dd HH:mm:ss"
32 ></el-date-picker>
33 </el-form-item>
34 </el-col>
35 <!-- 操作按钮 -->
36 <el-col :span="3" class="btnColRight">
37 <btn nativeType="cz" @click="resetForm">重置</btn>
38 <btn nativeType="cx" @click="getProcessCounts">查询</btn>
39 </el-col>
40 </el-row>
41 </el-form>
42 </div>
24 <!-- 表格 --> 43 <!-- 表格 -->
25 <div class="form-clues-content echarts-box" v-if="pieChartsData.length"> 44 <div class="form-clues-content echarts-box" v-if="pieChartsData.length">
26 <div id="myChart" class="chart"></div> 45 <div id="myChart" class="chart"></div>
...@@ -53,16 +72,18 @@ export default { ...@@ -53,16 +72,18 @@ export default {
53 } 72 }
54 }, 73 },
55 }, 74 },
75 form: {
76 startTime: getFirstDayOfSeason(),
77 endTime: timeFormat(new Date(), true),
78 },
56 // 搜索表单 79 // 搜索表单
57 valueTime: [getFirstDayOfSeason(), timeFormat(new Date(), true)],
58 // valueTime: ["2022/01/01 00:00:00", timeFormat(new Date())],
59 pieChartsData: [], 80 pieChartsData: [],
60 }; 81 };
61 }, 82 },
62 created () { 83 created () {},
84 mounted() {
63 this.getProcessCounts(); 85 this.getProcessCounts();
64 }, 86 },
65 mounted () { },
66 computed: { 87 computed: {
67 ...mapGetters(["dicData"]), 88 ...mapGetters(["dicData"]),
68 }, 89 },
...@@ -71,8 +92,8 @@ export default { ...@@ -71,8 +92,8 @@ export default {
71 async getProcessCounts () { 92 async getProcessCounts () {
72 this.pieChartsData = []; 93 this.pieChartsData = [];
73 let { result: res } = await efficient.getProcessCounts( 94 let { result: res } = await efficient.getProcessCounts(
74 this.valueTime[0], 95 this.form.startTime,
75 this.valueTime[1] 96 this.form.endTime
76 ); 97 );
77 //获取图表配置项需要的数据 98 //获取图表配置项需要的数据
78 res.length > 0 && 99 res.length > 0 &&
...@@ -86,13 +107,18 @@ export default { ...@@ -86,13 +107,18 @@ export default {
86 groupId: item.recType, 107 groupId: item.recType,
87 }); 108 });
88 }); 109 });
89 // 初始化图表 110 this.$nextTick(() => {
90 this.echartInit(); 111 // 初始化图表
91 this.barChartInit(res[0].recType); 112 this.echartInit();
113 this.barChartInit(res[0].recType);
114 });
92 }, 115 },
93 // 重置 116 // 重置
94 resetForm () { 117 resetForm () {
95 this.valueTime = [getFirstDayOfSeason(), timeFormat(new Date(), true)]; 118 this.form = {
119 startTime: getFirstDayOfSeason(),
120 endTime: timeFormat(new Date(), true),
121 };
96 this.getProcessCounts(); 122 this.getProcessCounts();
97 }, 123 },
98 //玫瑰图初始化 124 //玫瑰图初始化
...@@ -103,7 +129,7 @@ export default { ...@@ -103,7 +129,7 @@ export default {
103 // 绘制图表 129 // 绘制图表
104 myChart.setOption({ 130 myChart.setOption({
105 legend: { 131 legend: {
106 bottom: "6%", 132 bottom: "2%",
107 left: "center", 133 left: "center",
108 textStyle: { 134 textStyle: {
109 color: "#fff", 135 color: "#fff",
...@@ -118,14 +144,11 @@ export default { ...@@ -118,14 +144,11 @@ export default {
118 name: "各业务类型办理数量", 144 name: "各业务类型办理数量",
119 type: "pie", 145 type: "pie",
120 radius: [0, 250], 146 radius: [0, 250],
121 center: ["50%", "30%"], 147 center: ["50%", "45%"],
122 roseType: "area", 148 roseType: "area",
123 itemStyle: { 149 itemStyle: {
124 borderRadius: 8, 150 borderRadius: 8,
125 }, 151 },
126 label: {
127 show: false,
128 },
129 data: this.pieChartsData, 152 data: this.pieChartsData,
130 }, 153 },
131 ], 154 ],
...@@ -164,19 +187,37 @@ export default { ...@@ -164,19 +187,37 @@ export default {
164 //请求recType对应业务的各区县数据 187 //请求recType对应业务的各区县数据
165 let { result: res } = await efficient.getProcessDays( 188 let { result: res } = await efficient.getProcessDays(
166 recType, 189 recType,
167 this.valueTime[0], 190 this.form.startTime,
168 this.valueTime[1] 191 this.form.endTime
169 ); 192 );
193 //行政区数组
170 let xzqArr = []; 194 let xzqArr = [];
171 //行政区代码过滤 195 this.dicData["A20"].forEach((item) => {
172 res.length > 0 && 196 xzqArr.push(item.DNAME);
173 res.forEach((item) => { 197 let tempArr = res.filter((i) => {
174 xzqArr.push( 198 return i.qxdm == item.DCODE;
175 this.dicData["A20"].filter((i) => {
176 return i.DCODE == item.qxdm;
177 })[0].DNAME
178 );
179 }); 199 });
200 if (tempArr.length) {
201 item.avgDay = tempArr[0].avgDay;
202 item.maxDay = tempArr[0].maxDay;
203 item.minDay = tempArr[0].minDay;
204 } else {
205 item.avgDay = 0;
206 item.maxDay = 0;
207 item.minDay = 0;
208 }
209 });
210 //补全无数据行政区后的结果数组
211 let dealArr = [...this.dicData["A20"]];
212 // //行政区代码过滤
213 // res.length > 0 &&
214 // res.forEach((item) => {
215 // xzqArr.push(
216 // this.dicData["A20"].filter((i) => {
217 // return i.DCODE == item.qxdm;
218 // })[0].DNAME
219 // );
220 // });
180 let myChartBar = this.$echarts.init( 221 let myChartBar = this.$echarts.init(
181 document.getElementById("myChart-bar") 222 document.getElementById("myChart-bar")
182 ); 223 );
...@@ -211,7 +252,7 @@ export default { ...@@ -211,7 +252,7 @@ export default {
211 textStyle: { 252 textStyle: {
212 show: true, 253 show: true,
213 color: "#fff", 254 color: "#fff",
214 fontSize: "20", 255 fontSize: "16",
215 }, 256 },
216 }, 257 },
217 }, 258 },
...@@ -236,18 +277,21 @@ export default { ...@@ -236,18 +277,21 @@ export default {
236 series: [ 277 series: [
237 { 278 {
238 type: "bar", 279 type: "bar",
280 barMaxWidth: '60',
239 name: "最短用时", 281 name: "最短用时",
240 data: res.map((item) => item.minDay), 282 data: dealArr.map((item) => item.minDay),
241 }, 283 },
242 { 284 {
243 type: "bar", 285 type: "bar",
286 barMaxWidth: '60',
244 name: "平均用时", 287 name: "平均用时",
245 data: res.map((item) => item.avgDay), 288 data: dealArr.map((item) => item.avgDay),
246 }, 289 },
247 { 290 {
248 type: "bar", 291 type: "bar",
292 barMaxWidth: '60',
249 name: "最长用时", 293 name: "最长用时",
250 data: res.map((item) => item.maxDay), 294 data: dealArr.map((item) => item.maxDay),
251 }, 295 },
252 ], 296 ],
253 }); 297 });
......
...@@ -8,19 +8,46 @@ ...@@ -8,19 +8,46 @@
8 <Breadcrumb /> 8 <Breadcrumb />
9 </el-form-item> 9 </el-form-item>
10 <el-row> 10 <el-row>
11 <el-col :span="6"> 11 <el-col :span="4">
12 <el-form-item label="行政区"> 12 <el-form-item label="行政区">
13 <el-select v-model="form.XZQDM" class="width100" clearable placeholder="行政区"> 13 <el-select
14 <el-option v-for="item in dicData['A20']" :key="item.DCODE" :label="item.DNAME" :value="item.DCODE"> 14 v-model="form.qxdm"
15 class="width100"
16 clearable
17 placeholder="行政区"
18 >
19 <el-option
20 v-for="item in dicData['A20']"
21 :key="item.DCODE"
22 :label="item.DNAME"
23 :value="item.DCODE"
24 >
15 </el-option> 25 </el-option>
16 </el-select> 26 </el-select>
17 </el-form-item> 27 </el-form-item>
18 </el-col> 28 </el-col>
19 <el-col :span="8"> 29 <el-col :span="4">
20 <el-form-item label="开始日期"> 30 <el-form-item label="开始日期" prop="startTime">
21 <el-date-picker v-model="valueTime" value-format="yyyy/MM/dd HH:mm:ss" type="datetimerange" 31 <el-date-picker
22 range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期"> 32 type="datetime"
23 </el-date-picker> 33 placeholder="开始日期"
34 :picker-options="pickerOptionsStart"
35 clearable
36 v-model="form.startTime"
37 value-format="yyyy/MM/dd HH:mm:ss"
38 ></el-date-picker>
39 </el-form-item>
40 </el-col>
41 <el-col :span="4">
42 <el-form-item label="结束日期" prop="endTime">
43 <el-date-picker
44 type="datetime"
45 placeholder="结束日期"
46 :picker-options="pickerOptionsEnd"
47 clearable
48 v-model="form.endTime"
49 value-format="yyyy/MM/dd HH:mm:ss"
50 ></el-date-picker>
24 </el-form-item> 51 </el-form-item>
25 </el-col> 52 </el-col>
26 <!-- 操作按钮 --> 53 <!-- 操作按钮 -->
...@@ -63,13 +90,12 @@ export default { ...@@ -63,13 +90,12 @@ export default {
63 } 90 }
64 }, 91 },
65 }, 92 },
66 // 搜索表单
67 valueTime: [getFirstDayOfSeason(), timeFormat(new Date(), true)],
68 recTypeArr: [], 93 recTypeArr: [],
69 chartData: [], 94 chartData: [],
95 // 搜索表单
70 form: { 96 form: {
71 startTime: "", 97 startTime: getFirstDayOfSeason(),
72 endTime: "", 98 endTime: timeFormat(new Date(),true),
73 qxdm: "", 99 qxdm: "",
74 }, 100 },
75 }; 101 };
...@@ -86,8 +112,9 @@ export default { ...@@ -86,8 +112,9 @@ export default {
86 this.recTypeArr = []; 112 this.recTypeArr = [];
87 this.chartData = []; 113 this.chartData = [];
88 let { result: res } = await business.getSuucessRate( 114 let { result: res } = await business.getSuucessRate(
89 this.valueTime[0], 115 this.form.startTime,
90 this.valueTime[1] 116 this.form.endTime,
117 this.form.qxdm
91 ); 118 );
92 this.chartData = res; 119 this.chartData = res;
93 //行政区代码过滤 120 //行政区代码过滤
...@@ -95,15 +122,17 @@ export default { ...@@ -95,15 +122,17 @@ export default {
95 res.forEach((item) => { 122 res.forEach((item) => {
96 this.recTypeArr.push(item.recTypeName); 123 this.recTypeArr.push(item.recTypeName);
97 }); 124 });
98 this.echartInit(); 125 this.$nextTick(() => {
126 // 初始化图表
127 this.echartInit();
128 });
99 }, 129 },
100 // 重置 130 // 重置
101 resetForm () { 131 resetForm () {
102 this.form = { 132 this.form = {
103 startTime: "", 133 startTime: getFirstDayOfSeason(),
104 endTime: "", 134 endTime: timeFormat(new Date(),true),
105 }; 135 };
106 this.valueTime = [getFirstDayOfSeason(), timeFormat(new Date(), true)];
107 this.getSuucessRate(); 136 this.getSuucessRate();
108 }, 137 },
109 echartInit () { 138 echartInit () {
...@@ -193,7 +222,7 @@ export default { ...@@ -193,7 +222,7 @@ export default {
193 color: "#fff", 222 color: "#fff",
194 fontSize: "16", 223 fontSize: "16",
195 }, 224 },
196 interval: 5, 225 splitNumber:4,
197 axisLabel: { 226 axisLabel: {
198 formatter: "{value} %", 227 formatter: "{value} %",
199 textStyle: { 228 textStyle: {
...@@ -208,6 +237,7 @@ export default { ...@@ -208,6 +237,7 @@ export default {
208 { 237 {
209 name: "成功", 238 name: "成功",
210 type: "bar", 239 type: "bar",
240 barMaxWidth: '60',
211 tooltip: { 241 tooltip: {
212 valueFormatter: function (value) { 242 valueFormatter: function (value) {
213 return value + " ml"; 243 return value + " ml";
...@@ -220,6 +250,7 @@ export default { ...@@ -220,6 +250,7 @@ export default {
220 { 250 {
221 name: "失败", 251 name: "失败",
222 type: "bar", 252 type: "bar",
253 barMaxWidth: '60',
223 tooltip: { 254 tooltip: {
224 valueFormatter: function (value) { 255 valueFormatter: function (value) {
225 return value + " ml"; 256 return value + " ml";
...@@ -232,6 +263,7 @@ export default { ...@@ -232,6 +263,7 @@ export default {
232 { 263 {
233 name: "成功率", 264 name: "成功率",
234 type: "line", 265 type: "line",
266 barMaxWidth: '60',
235 yAxisIndex: 1, 267 yAxisIndex: 1,
236 tooltip: { 268 tooltip: {
237 valueFormatter: function (value) { 269 valueFormatter: function (value) {
......
...@@ -8,38 +8,68 @@ ...@@ -8,38 +8,68 @@
8 <Breadcrumb /> 8 <Breadcrumb />
9 </el-form-item> 9 </el-form-item>
10 <el-row> 10 <el-row>
11 <el-col :span="6"> 11 <el-col :span="4">
12 <el-form-item label="行政区"> 12 <el-form-item label="行政区">
13 <el-select v-model="form.XZQDM" class="width100" clearable placeholder="行政区"> 13 <el-select
14 <el-option v-for="item in dicData['A20']" :key="item.DCODE" :label="item.DNAME" :value="item.DCODE"> 14 v-model="form.qxdm"
15 class="width100"
16 clearable
17 placeholder="行政区"
18 >
19 <el-option
20 v-for="item in dicData['A20']"
21 :key="item.DCODE"
22 :label="item.DNAME"
23 :value="item.DCODE"
24 >
15 </el-option> 25 </el-option>
16 </el-select> 26 </el-select>
17 </el-form-item> 27 </el-form-item>
18 </el-col> 28 </el-col>
19 <el-col :span="8"> 29 <el-col :span="4">
20 <el-form-item label="开始日期"> 30 <el-form-item label="开始日期" prop="startTime">
21 <el-date-picker v-model="valueTime" type="datetimerange" range-separator="至" start-placeholder="开始日期" 31 <el-date-picker
22 end-placeholder="结束日期"> 32 type="datetime"
23 </el-date-picker> 33 placeholder="开始日期"
34 :picker-options="pickerOptionsStart"
35 clearable
36 v-model="form.startTime"
37 value-format="yyyy/MM/dd HH:mm:ss"
38 ></el-date-picker>
39 </el-form-item>
40 </el-col>
41 <el-col :span="4">
42 <el-form-item label="结束日期" prop="endTime">
43 <el-date-picker
44 type="datetime"
45 placeholder="结束日期"
46 :picker-options="pickerOptionsEnd"
47 clearable
48 v-model="form.endTime"
49 value-format="yyyy/MM/dd HH:mm:ss"
50 ></el-date-picker>
24 </el-form-item> 51 </el-form-item>
25 </el-col> 52 </el-col>
26 <!-- 操作按钮 --> 53 <!-- 操作按钮 -->
27 <el-col :span="3" class="btnColRight"> 54 <el-col :span="3" class="btnColRight">
28 <btn nativeType="cz" @click="resetForm">重置</btn> 55 <btn nativeType="cz" @click="resetForm">重置</btn>
29 <btn nativeType="cx">查询</btn> 56 <btn nativeType="cx" @click="getProcessCounts">查询</btn>
30 </el-col> 57 </el-col>
31 </el-row> 58 </el-row>
32 </el-form> 59 </el-form>
33 </div> 60 </div>
34 <!-- 图表 --> 61 <!-- 图表 -->
35 <div class="form-clues-content echarts-box"> 62 <div class="form-clues-content echarts-box" v-if="chartData.length">
36 <div id="myChart" class="chart"></div> 63 <div id="myChart" class="chart"></div>
37 </div> 64 </div>
65 <div class="form-clues-content echarts-box center" v-else>暂无数据</div>
38 </div> 66 </div>
39 </template> 67 </template>
40 68
41 <script> 69 <script>
42 import { mapGetters } from "vuex"; 70 import { mapGetters } from "vuex";
71 import efficient from "@/api/efficient";
72 import { getFirstDayOfSeason, timeFormat } from "@/utils/operation";
43 export default { 73 export default {
44 name: "jktj", 74 name: "jktj",
45 data () { 75 data () {
...@@ -62,21 +92,37 @@ export default { ...@@ -62,21 +92,37 @@ export default {
62 }, 92 },
63 // 搜索表单 93 // 搜索表单
64 valueTime: "", 94 valueTime: "",
95 // 搜索表单
65 form: { 96 form: {
66 startTime: "", 97 startTime: getFirstDayOfSeason(),
67 endTime: "", 98 endTime: timeFormat(new Date(),true),
68 XZQDM: "", 99 qxdm: "",
69 }, 100 },
101 chartData:[]
70 }; 102 };
71 }, 103 },
72 mounted () { 104 mounted() {
73 // 初始化图表 105 // 查询业务量
74 this.echartInit(); 106 this.getProcessCounts();
75 }, 107 },
76 computed: { 108 computed: {
77 ...mapGetters(["dicData"]), 109 ...mapGetters(["dicData"]),
78 }, 110 },
79 methods: { 111 methods: {
112 async getProcessCounts(){
113 this.chartData = [];
114 let { result: res } = await efficient.getProcessCounts(
115 this.form.startTime,
116 this.form.endTime,
117 this.form.qxdm
118 );
119 //获取图表配置项需要的数据
120 this.chartData = res;
121 this.$nextTick(() => {
122 // 初始化图表
123 this.echartInit(this.chartData)
124 });
125 },
80 // 重置 126 // 重置
81 resetForm () { 127 resetForm () {
82 this.form = { 128 this.form = {
...@@ -84,7 +130,8 @@ export default { ...@@ -84,7 +130,8 @@ export default {
84 endTime: "", 130 endTime: "",
85 }; 131 };
86 }, 132 },
87 echartInit () { 133 //图表渲染
134 echartInit(chartArr) {
88 // 基于准备好的dom，初始化echarts实例 135 // 基于准备好的dom，初始化echarts实例
89 let myChart = this.$echarts.init(document.getElementById("myChart")); 136 let myChart = this.$echarts.init(document.getElementById("myChart"));
90 // 绘制图表 137 // 绘制图表
...@@ -96,7 +143,6 @@ export default { ...@@ -96,7 +143,6 @@ export default {
96 textStyle: { 143 textStyle: {
97 fontSize: 16, // 字体大小 144 fontSize: 16, // 字体大小
98 }, 145 },
99 extraCssText: "width:220px;height:160px;", // 背景色
100 }, 146 },
101 grid: { 147 grid: {
102 top: 120, 148 top: 120,
...@@ -104,14 +150,7 @@ export default { ...@@ -104,14 +150,7 @@ export default {
104 xAxis: [ 150 xAxis: [
105 { 151 {
106 type: "category", 152 type: "category",
107 data: [ 153 data: chartArr.map(item=>item.recTypeName),
108 "土地所有权",
109 "建设用地、宅基地使用权",
110 "构（建）筑物所有权",
111 "林权",
112 "注销登记",
113 "抵押权登记",
114 ],
115 axisLabel: { 154 axisLabel: {
116 interval: 0, 155 interval: 0,
117 formatter: function (val) { 156 formatter: function (val) {
...@@ -139,7 +178,7 @@ export default { ...@@ -139,7 +178,7 @@ export default {
139 textStyle: { 178 textStyle: {
140 show: true, 179 show: true,
141 color: "#fff", 180 color: "#fff",
142 fontSize: "20", 181 fontSize: "16",
143 }, 182 },
144 }, 183 },
145 }, 184 },
...@@ -163,8 +202,9 @@ export default { ...@@ -163,8 +202,9 @@ export default {
163 ], 202 ],
164 series: [ 203 series: [
165 { 204 {
166 data: [200, 120, 150, 80, 70, 30], 205 data: chartArr.map(item=>item.counts),
167 type: "bar", 206 type: "bar",
207 barMaxWidth: '60',
168 }, 208 },
169 ], 209 ],
170 }); 210 });
...@@ -183,7 +223,11 @@ export default { ...@@ -183,7 +223,11 @@ export default {
183 .rows { 223 .rows {
184 margin-left: 100px; 224 margin-left: 100px;
185 } 225 }
186 226 .center {
227 line-height: 50vh;
228 text-align: center;
229 color:#b6b5b5
230 }
187 .echarts-box { 231 .echarts-box {
188 display: flex; 232 display: flex;
189 justify-content: center; 233 justify-content: center;
......