safecheck-client 3.0.33-35 → 3.0.33-37

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,573 +1,573 @@
1
- <template lang="html">
2
- <div class="div-4">
3
- <div :style="{height:headheight,background:'#eaeff4'}">
4
- <div class="div-2">
5
- <div class="form-group">
6
- <label v-show="full_screen" class="control-label">安检类型</label>
7
- <v-select id="c_plan_year" :value.sync="plan_type" v-show="full_screen"
8
- :value-single="true"
9
- :options='plan_types' close-on-select clear-button></v-select>
10
- <button class="but-1" @click="barrdios" v-show="full_screen"><img src='../../../assets/echarts6.png'
11
- class="img-1"/>&nbsp;全屏显示
12
- </button>
13
- <button @click="showall" v-show="show_all" class="but-2">返回</button>
14
- </div>
15
- </div>
16
- </div>
17
-
18
- <div v-bind:style="{height: barheight,width:'100%'}">
19
- <div class="flex-row" style="height: 90%;">
20
- <div class="span">
21
- <div class="form-inline" v-if="echartsshow" style="height: auto;margin-bottom: 5%;margin-top: 5%">
22
- <div class="form-group">
23
- <label >年份:</label>
24
-
25
- <v-select id="c_plan_year" :value.sync="year"
26
- :value-single="true"
27
- :options='c_year_list' close-on-select clear-button></v-select>
28
- </div>
29
- <div class="form-group">
30
- <label class="control-label">安检类型</label>
31
- <v-select id="c_plan_year" :value.sync="plan_type"
32
- :value-single="true"
33
- :options='plan_types' close-on-select clear-button></v-select>
34
- </div>
35
- </div>
36
-
37
- <div id="chechsafedetail"></div>
38
- </div>
39
-
40
-
41
- <!--调用子组件绘图查表-->
42
- <div v-show="echartsshow">
43
- <h4 v-if="plan_type == ''" align="center">居民用户安检工作量统计表</h4>
44
- <h4 v-if="plan_type == 'false'" align="center">居民用户年度安检工作量统计表</h4>
45
- <h4 v-if="plan_type == 'true'" align="center">居民用户首次同期安检工作量统计表</h4>
46
- <criteria-paged :model="model" v-ref:crip>
47
- <data-grid :model="model" partial='list' id="datagridstyle1" v-ref:grid1
48
- classname="table table-bordered table table-hover">
49
- <template partial='head'>
50
- <tr>
51
- <th>
52
- <nobr>月份</nobr>
53
- </th>
54
- <th>
55
- <nobr>计划量</nobr>
56
- </th>
57
- <th>
58
- <nobr>入户</nobr>
59
- </th>
60
- <th>
61
- <nobr>入户(在用)</nobr>
62
- </th>
63
- <th>
64
- <nobr>入户(未用)</nobr>
65
- </th>
66
- <th>
67
- <nobr>到访不遇</nobr>
68
- </th>
69
- <th>
70
- <nobr>拒检</nobr>
71
- </th>
72
- <th>
73
- <nobr>入户率</nobr>
74
- </th>
75
- </tr>
76
- </template>
77
- <template partial='body'>
78
- <tr class="tr-1">
79
- <td class="td-1" style="text-align: center;">
80
- {{ row.f_plan_month }}
81
- </td>
82
- <td class="td-1" style="text-align: center;">
83
- {{ row.zongliang }}
84
- </td>
85
- <td class="td-1" style="text-align: center;">
86
- {{ row.rh + row.wsy }}
87
- </td>
88
- <td class="td-1" style="text-align: center;">
89
- {{ row.rh }}
90
- </td>
91
- <td class="td-1" style="text-align: center;">
92
- {{ row.wsy }}
93
- </td>
94
- <td class="td-1" style="text-align: center;">
95
- {{ row.dfby }}
96
- </td>
97
- <td class="td-1" style="text-align: center;">
98
- {{ row.jj }}
99
- </td>
100
- <td class="td-1" style="text-align: center;">
101
- {{ (100 * (row.rh + row.wsy) / row.zongliang).toFixed(0) }}%
102
- </td>
103
- </tr>
104
- </template>
105
- <template partial='foot'>
106
- <tr>
107
- <td colspan="1" style="text-align: right">合计:</td>
108
- <td style="text-align: center">
109
- <nobr>{{ $parent.$parent.$parent.count.zongliang }}</nobr>
110
- </td>
111
- <td style="text-align: center">
112
- <nobr>{{ $parent.$parent.$parent.count.rh + $parent.$parent.$parent.count.wsy }}</nobr>
113
- </td>
114
- <td style="text-align: center">
115
- <nobr>{{ $parent.$parent.$parent.count.wsy }}</nobr>
116
- </td>
117
- <td style="text-align: center">
118
- <nobr>{{ $parent.$parent.$parent.count.rh }}</nobr>
119
- </td>
120
- <td style="text-align: center">
121
- <nobr>{{ $parent.$parent.$parent.count.dfby }}</nobr>
122
- </td>
123
- <td style="text-align: center">
124
- <nobr>{{ $parent.$parent.$parent.count.jj }}</nobr>
125
- </td>
126
- <td style="text-align: center">
127
- <nobr>{{ $parent.$parent.$parent.count.checkrate }}</nobr>
128
- </td>
129
- </tr>
130
- </template>
131
- </data-grid>
132
- </criteria-paged>
133
- </div>
134
- </div>
135
- </div>
136
- </div>
137
- </template>
138
-
139
- <script>
140
- import * as Util from '../../Util'
141
- import co from 'co'
142
- import echarts from 'echarts'
143
- import {HttpResetClass} from 'vue-client'
144
- import {PagedList} from 'vue-client'
145
-
146
- let getData = function* (self) {
147
- let load = new HttpResetClass()
148
- console.log('getData')
149
- console.log('self.plan_type', self.plan_type)
150
- console.log('self.orgid', self.orgid)
151
- self.set()
152
- load.load('POST', 'rs/sql/YearCountRate', {data: {year: self.year, orgid: self.orgid, plan_type: self.plan_type,f_safecheck_type:self.f_safecheck_type}},
153
- {resolveMsg: null, rejectMsg: null})
154
- .then((res) => {
155
- let legendname = []
156
- let zongliangArray = []
157
- let yijianArray = []
158
- self.count.zongliang = 0
159
- self.count.rh = 0
160
- self.count.dfby = 0
161
- self.count.jj = 0
162
- self.count.wsy = 0
163
- self.count.checkrate = '0.00%'
164
- for (var i = 0; i < res.data.length; i++) {
165
- legendname[i] = res.data[i].f_plan_month
166
- zongliangArray[i] = res.data[i].zongliang
167
- yijianArray[i] = res.data[i].rh
168
- self.count.zongliang += res.data[i].zongliang
169
- self.count.rh += res.data[i].rh
170
- self.count.dfby += res.data[i].dfby
171
- self.count.jj += res.data[i].jj
172
- self.count.wsy += res.data[i].wsy
173
- }
174
- legendname[12] = ''
175
- self.count.checkrate = (100 * self.count.rh / self.count.zongliang).toFixed(0) + '%'
176
- //掉绘图
177
- if (!legendname[0]){
178
- legendname = [1,2,3,4,5,6,7,8,9,10,11,12]
179
- }
180
- self.set(legendname, zongliangArray, yijianArray)
181
- self.settable()
182
- })
183
- }
184
- export default {
185
- title: '用户数量分布',
186
- data() {
187
- let options = []
188
- let ye = (new Date()).getFullYear()
189
- for (let i = ye - 5; i <= ye; i++) {
190
- options.push({label: i + '', value: i + ''})
191
- }
192
- return {
193
- full_screen: true,//控制全屏按键显示状态
194
- show_all: false,//控制返回按键显示状态
195
- //控制图表的显示状态
196
- echartsshow: false,
197
- detailshows: true,
198
-
199
- //控制图表的style
200
- barheight: '88.37%',
201
- headheight: '11.61%',
202
- styledate: {
203
- echartsheight: '95%',
204
- echartsfloat: 'none',
205
- },
206
- c_year_list: options,
207
- f: this.$login.f,
208
- chosenOrg: {
209
- id: 0
210
- },
211
- count: {
212
- zongliang: 0,
213
- rh: 0,
214
- dfby: 0,
215
- jj: 0,
216
- wsy: 0,
217
- checkrate: '0.00%',
218
- },
219
- model: new PagedList(),
220
- orgid: `('${this.$login.f.orgid}')`,
221
- //测试
222
- // orgid:'2586252.6314787',
223
- year: (new Date()).getFullYear(),
224
- plan_type: '',
225
- f_safecheck_type:'',
226
- xc: '',
227
- plan_types: [{label: '全部', value: ''}, {label: '年度安检单', value: 'false'}, {label: '首次通气单', value: 'true'}]
228
- }
229
- },
230
- props:{
231
- f_filialeids:{
232
- type:String
233
- }
234
- },
235
- methods: {
236
- barrdios() {//全屏按键事件
237
- console.log("全屏显示事件")
238
- this.barshow = true
239
- this.detailshows = false
240
- this.echartsshow = true
241
- this.show_all = true
242
- this.full_screen = false
243
- this.buttonshow = true
244
- this.showdetail = false
245
- this.styledate.echartsfloat = 'left'
246
- this.styledate.echartsheight = '65%'
247
- this.echartswidth = '50%'
248
- this.headheight = '8%'
249
- this.$parent.echarts = '2'
250
- this.$emit('echarts-changed')
251
- this.newecharts = true
252
-
253
- console.log(this.$parent.echarts, '主图状态')
254
- },
255
- showall() {//返回按键事件
256
- //修改显示状态
257
- this.barshow = false
258
- this.detailshows = true
259
- this.echartsshow = false
260
- this.buttonshow = false
261
- this.newecharts = false
262
- this.show_all = false
263
- this.full_screen = true
264
- this.showdetail = false
265
- this.styledate.echartsheight = '95%'
266
- this.echartswidth = '95%'
267
- this.$parent.echarts = -1
268
- this.headheight = '11.61%'
269
- this.$emit('echarts-changed', this.echarts)
270
- },
271
- settable() {
272
- this.model = new PagedList('rs/sql/YearCountRate', 20, {
273
- year: 'this.year',
274
- orgid: 'this.orgid',
275
- plan_type: 'this.plan_type',
276
- f_safecheck_type: 'this.f_safecheck_type'
277
- })
278
- this.model.year = this.year
279
- this.model.orgid = this.orgid
280
- this.model.plan_type = this.plan_type
281
- this.model.f_safecheck_type = this.f_safecheck_type
282
- this.model.search('1=1')
283
- },
284
- set(legendname, zongliangArray, yijianArray) {
285
- console.log('legendname==>', legendname)
286
- console.log('zongliangArray==>', zongliangArray)
287
- console.log('yijianArray==>', yijianArray)
288
- let serieData = [{ //绘图数据
289
- name: '计划量',
290
- type: "bar",
291
- barWidth: '15%',
292
- barGap: "30",
293
- itemStyle: {
294
- normal: {
295
- barBorderRadius: 10,
296
- borderColor: '#acf3ed',
297
- color: '#fff',
298
- label: {
299
- show: true,
300
- textStyle: {
301
- color: "#4a7cae"
302
- },
303
- position: "top",
304
- formatter: function (p) {
305
- return p.value > 0 ? (p.value) : '';
306
- }
307
- }
308
- }
309
- },
310
- data: zongliangArray,
311
- },
312
- { //绘图数据
313
- name: '入户量',
314
- type: "bar",
315
- barWidth: '15%',
316
- barGap: "-30%",
317
- itemStyle: {
318
- normal: {
319
- barBorderRadius: 10,
320
- color: '',
321
- label: {
322
- show: true,
323
- textStyle: {
324
- color: "#fccb05"
325
- },
326
- position: "insideTop",
327
- formatter: function (p) {
328
- return p.value > 0 ? (p.value) : '';
329
- }
330
- }
331
- }
332
- },
333
- data: yijianArray,
334
- }]
335
-
336
- this.xc = echarts.init(document.getElementById('chechsafedetail'))
337
- let text = ''
338
- if (this.plan_type == '') {
339
- text = '居民用户安检工作量'
340
- }
341
- if (this.plan_type == 'false') {
342
- text = '居民用户年度安检工作量'
343
- }
344
- if (this.plan_type == 'true') {
345
- text = '居民用户首次通气安检工作量'
346
- }
347
- this.xc.setOption({
348
- title: {
349
- text: text,
350
- x: 'left'
351
- },
352
- color: ['#3398DB'],
353
- tooltip: {
354
- trigger: 'axis',
355
- axisPointer: { // 坐标轴指示器,坐标轴触发有效
356
- type: 'shadow' // 默认为直线,可选为:'line' | 'shadow'
357
- },
358
-
359
- extraCssText: 'width: auto;height: auto;'
360
- },
361
- dataZoom: [{
362
- type: 'inside',
363
- show: true,
364
- startValue: '0',
365
- xAxisIndex: [0],
366
- left: '9%',
367
- bottom: -5,
368
- start: 2,
369
- end: 90 //初始化滚动条
370
- }],
371
- grid: {
372
- left: '10',
373
- right: '10',
374
- bottom: '8',
375
- containLabel: true
376
- },
377
- legend: {
378
- data: ['计划量', '入户量'],
379
- right: 10,
380
- top: 12,
381
- textStyle: {
382
- color: "black"
383
- },
384
- itemWidth: 12,
385
- itemHeight: 10,
386
- // itemGap: 20
387
- },
388
- xAxis: [
389
- {
390
- type: 'category',
391
- name: "月份",
392
- nameTextStyle: {color: "#6f8ba8"},
393
- axisTick: {
394
- alignWithLabel: true
395
- },
396
- axisLine: {show: true, lineStyle: {color: '#999999'}},
397
- axisLabel: {
398
- show: true, interval: 0, showMinLabel: true,
399
- showMaxLabel: true, textStyle: {color: "#6f8ba8"}
400
- },
401
- data: legendname
402
- }
403
- ],
404
- yAxis: [{
405
- type: "value",
406
- name: "数量",
407
- nameTextStyle: {color: "#6f8ba8"},
408
- splitLine: {show: true, lineStyle: {type: 'dashed', color: '#e1e1e1'}},
409
- axisTick: {show: true},
410
- axisLine: {show: true, lineStyle: {color: '#999999'}},
411
- axisLabel: {show: true, textStyle: {color: "#6f8ba8"}}
412
- }],
413
- series: serieData
414
- }, true)
415
- },
416
- searchdata() {
417
- console.log('searchdata')
418
- console.log('this.orgid', this.orgid)
419
- console.log('this.plan_type', this.plan_type)
420
- let getGen = getData(this)
421
- co(getGen)
422
- }
423
- },
424
- ready() {
425
- // this.orgid = `('${this.$login.f.orgid}')`
426
- //测试
427
- // this.orgid = '2586252.6314787'
428
- // this.plan_type = ''
429
- console.log('ready')
430
- this.year = (new Date()).getFullYear()
431
-
432
- // this.searchdata()
433
- },
434
- watch: {
435
- 'year'(val) {
436
- console.log("我是watch")
437
- this.searchdata()
438
- },
439
- 'plan_type'(val) {
440
- console.log("我是plan_type")
441
- this.f_safecheck_type = ''
442
- if (this.plan_type == 'false') {
443
- this.f_safecheck_type = '年度普检'
444
- }
445
- if (this.plan_type == 'true') {
446
- this.f_safecheck_type = '首次通气'
447
- }
448
- this.searchdata()
449
- },
450
- 'f_filialeids'(){
451
- console.log('safe改变了')
452
- this.orgid = this.f_filialeids
453
- this.searchdata()
454
- }
455
- }
456
-
457
- }
458
- </script>
459
- <style scoped>
460
- .div-1 {
461
- height: 85%;
462
- width: 10%;
463
- margin-left: 5%;
464
- float: left;
465
- margin-top: 1%;
466
- }
467
-
468
- .div-2 {
469
- float: right;
470
- width: 80%;
471
- height: 55.56%;
472
- margin-right: 1%;
473
- margin-top: 0.5%;
474
- }
475
-
476
- .div-3 {
477
- float: left;
478
- margin-left: 2%;
479
- padding-top: 2%;
480
- width: 96%;
481
- height: 99%;
482
- }
483
-
484
- .div-4 {
485
- background-color: #fafafa;
486
- }
487
-
488
- table {
489
- height: 100%;
490
- width: 100%;
491
- font-size: 12px
492
- }
493
-
494
- tr {
495
- height: 25%;
496
- width: 100%
497
- }
498
-
499
- td {
500
- width: 11%;
501
- font-size: 12px;
502
- color: #666666;
503
- }
504
-
505
- .td-1 {
506
- width: 16%;
507
- color: #90addf;
508
- font-size: 12px
509
- }
510
-
511
- .td-2 {
512
- width: 15%;
513
- color: #90addf;
514
- font-size: 12px
515
- }
516
-
517
- span {
518
- color: #90addf;
519
- font-size: 12px
520
- }
521
-
522
- .span-1 {
523
- color: #999999;
524
- font-size: 12px
525
- }
526
-
527
- .p-1 {
528
- font-size: 15px;
529
- height: 99%;
530
- width: 99%;
531
- font-weight: bold;
532
- color: #333333;
533
- }
534
-
535
- button {
536
- width: 10%;
537
- margin-top: 0%;
538
- margin-left: 2%;
539
- float: right;
540
- background-color: #73ca73;
541
- border-radius: 4px;
542
- border: 1px solid #73ca73;
543
- color: #ffffff;
544
- font-size: 15px;
545
- height: 120%;
546
- }
547
-
548
- .but-1 {
549
- width: 17%;
550
- float: right;
551
- border-radius: 4px;
552
- font-size: 12px;
553
- height: 130%;
554
- }
555
-
556
- .but-2 {
557
- background-color: #88b5e2;
558
- border: #88b5e2;
559
- width: 6%;
560
- }
561
-
562
- img {
563
- width: 5px;
564
- height: 18px;
565
- }
566
-
567
- .img-1 {
568
- height: 12px;
569
- width: auto;
570
- }
571
-
572
- </style>
573
-
1
+ <template lang="html">
2
+ <div class="div-4">
3
+ <div :style="{height:headheight,background:'#eaeff4'}">
4
+ <div class="div-2">
5
+ <div class="form-group">
6
+ <label v-show="full_screen" class="control-label">安检类型</label>
7
+ <v-select id="c_plan_year" :value.sync="plan_type" v-show="full_screen"
8
+ :value-single="true"
9
+ :options='plan_types' close-on-select clear-button></v-select>
10
+ <button class="but-1" @click="barrdios" v-show="full_screen"><img src='../../../assets/echarts6.png'
11
+ class="img-1"/>&nbsp;全屏显示
12
+ </button>
13
+ <button @click="showall" v-show="show_all" class="but-2">返回</button>
14
+ </div>
15
+ </div>
16
+ </div>
17
+
18
+ <div v-bind:style="{height: barheight,width:'100%'}">
19
+ <div class="flex-row" style="height: 90%;">
20
+ <div class="span">
21
+ <div class="form-inline" v-if="echartsshow" style="height: auto;margin-bottom: 5%;margin-top: 5%">
22
+ <div class="form-group">
23
+ <label >年份:</label>
24
+
25
+ <v-select id="c_plan_year" :value.sync="year"
26
+ :value-single="true"
27
+ :options='c_year_list' close-on-select clear-button></v-select>
28
+ </div>
29
+ <div class="form-group">
30
+ <label class="control-label">安检类型</label>
31
+ <v-select id="c_plan_year" :value.sync="plan_type"
32
+ :value-single="true"
33
+ :options='plan_types' close-on-select clear-button></v-select>
34
+ </div>
35
+ </div>
36
+
37
+ <div id="chechsafedetail"></div>
38
+ </div>
39
+
40
+
41
+ <!--调用子组件绘图查表-->
42
+ <div v-show="echartsshow">
43
+ <h4 v-if="plan_type == ''" align="center">居民用户安检工作量统计表</h4>
44
+ <h4 v-if="plan_type == 'false'" align="center">居民用户年度安检工作量统计表</h4>
45
+ <h4 v-if="plan_type == 'true'" align="center">居民用户首次同期安检工作量统计表</h4>
46
+ <criteria-paged :model="model" v-ref:crip>
47
+ <data-grid :model="model" partial='list' id="datagridstyle1" v-ref:grid1
48
+ classname="table table-bordered table table-hover">
49
+ <template partial='head'>
50
+ <tr>
51
+ <th>
52
+ <nobr>月份</nobr>
53
+ </th>
54
+ <th>
55
+ <nobr>计划量</nobr>
56
+ </th>
57
+ <th>
58
+ <nobr>入户</nobr>
59
+ </th>
60
+ <th>
61
+ <nobr>入户(在用)</nobr>
62
+ </th>
63
+ <th>
64
+ <nobr>入户(未用)</nobr>
65
+ </th>
66
+ <th>
67
+ <nobr>到访不遇</nobr>
68
+ </th>
69
+ <th>
70
+ <nobr>拒检</nobr>
71
+ </th>
72
+ <th>
73
+ <nobr>入户率</nobr>
74
+ </th>
75
+ </tr>
76
+ </template>
77
+ <template partial='body'>
78
+ <tr class="tr-1">
79
+ <td class="td-1" style="text-align: center;">
80
+ {{ row.f_plan_month }}
81
+ </td>
82
+ <td class="td-1" style="text-align: center;">
83
+ {{ row.zongliang }}
84
+ </td>
85
+ <td class="td-1" style="text-align: center;">
86
+ {{ row.rh + row.wsy }}
87
+ </td>
88
+ <td class="td-1" style="text-align: center;">
89
+ {{ row.rh }}
90
+ </td>
91
+ <td class="td-1" style="text-align: center;">
92
+ {{ row.wsy }}
93
+ </td>
94
+ <td class="td-1" style="text-align: center;">
95
+ {{ row.dfby }}
96
+ </td>
97
+ <td class="td-1" style="text-align: center;">
98
+ {{ row.jj }}
99
+ </td>
100
+ <td class="td-1" style="text-align: center;">
101
+ {{ (100 * (row.rh + row.wsy) / row.zongliang).toFixed(0) }}%
102
+ </td>
103
+ </tr>
104
+ </template>
105
+ <template partial='foot'>
106
+ <tr>
107
+ <td colspan="1" style="text-align: right">合计:</td>
108
+ <td style="text-align: center">
109
+ <nobr>{{ $parent.$parent.$parent.count.zongliang }}</nobr>
110
+ </td>
111
+ <td style="text-align: center">
112
+ <nobr>{{ $parent.$parent.$parent.count.rh + $parent.$parent.$parent.count.wsy }}</nobr>
113
+ </td>
114
+ <td style="text-align: center">
115
+ <nobr>{{ $parent.$parent.$parent.count.wsy }}</nobr>
116
+ </td>
117
+ <td style="text-align: center">
118
+ <nobr>{{ $parent.$parent.$parent.count.rh }}</nobr>
119
+ </td>
120
+ <td style="text-align: center">
121
+ <nobr>{{ $parent.$parent.$parent.count.dfby }}</nobr>
122
+ </td>
123
+ <td style="text-align: center">
124
+ <nobr>{{ $parent.$parent.$parent.count.jj }}</nobr>
125
+ </td>
126
+ <td style="text-align: center">
127
+ <nobr>{{ $parent.$parent.$parent.count.checkrate }}</nobr>
128
+ </td>
129
+ </tr>
130
+ </template>
131
+ </data-grid>
132
+ </criteria-paged>
133
+ </div>
134
+ </div>
135
+ </div>
136
+ </div>
137
+ </template>
138
+
139
+ <script>
140
+ import * as Util from '../../Util'
141
+ import co from 'co'
142
+ import echarts from 'echarts'
143
+ import {HttpResetClass} from 'vue-client'
144
+ import {PagedList} from 'vue-client'
145
+
146
+ let getData = function* (self) {
147
+ let load = new HttpResetClass()
148
+ console.log('getData')
149
+ console.log('self.plan_type', self.plan_type)
150
+ console.log('self.orgid', self.orgid)
151
+ self.set()
152
+ load.load('POST', 'rs/sql/YearCountRate', {data: {year: self.year, orgid: self.orgid, plan_type: self.plan_type,f_safecheck_type:self.f_safecheck_type}},
153
+ {resolveMsg: null, rejectMsg: null})
154
+ .then((res) => {
155
+ let legendname = []
156
+ let zongliangArray = []
157
+ let yijianArray = []
158
+ self.count.zongliang = 0
159
+ self.count.rh = 0
160
+ self.count.dfby = 0
161
+ self.count.jj = 0
162
+ self.count.wsy = 0
163
+ self.count.checkrate = '0.00%'
164
+ for (var i = 0; i < res.data.length; i++) {
165
+ legendname[i] = res.data[i].f_plan_month
166
+ zongliangArray[i] = res.data[i].zongliang
167
+ yijianArray[i] = res.data[i].rh
168
+ self.count.zongliang += res.data[i].zongliang
169
+ self.count.rh += res.data[i].rh
170
+ self.count.dfby += res.data[i].dfby
171
+ self.count.jj += res.data[i].jj
172
+ self.count.wsy += res.data[i].wsy
173
+ }
174
+ legendname[12] = ''
175
+ self.count.checkrate = (100 * self.count.rh / self.count.zongliang).toFixed(0) + '%'
176
+ //掉绘图
177
+ if (!legendname[0]){
178
+ legendname = [1,2,3,4,5,6,7,8,9,10,11,12]
179
+ }
180
+ self.set(legendname, zongliangArray, yijianArray)
181
+ self.settable()
182
+ })
183
+ }
184
+ export default {
185
+ title: '用户数量分布',
186
+ data() {
187
+ let options = []
188
+ let ye = (new Date()).getFullYear()
189
+ for (let i = ye - 5; i <= ye; i++) {
190
+ options.push({label: i + '', value: i + ''})
191
+ }
192
+ return {
193
+ full_screen: true,//控制全屏按键显示状态
194
+ show_all: false,//控制返回按键显示状态
195
+ //控制图表的显示状态
196
+ echartsshow: false,
197
+ detailshows: true,
198
+
199
+ //控制图表的style
200
+ barheight: '88.37%',
201
+ headheight: '11.61%',
202
+ styledate: {
203
+ echartsheight: '95%',
204
+ echartsfloat: 'none',
205
+ },
206
+ c_year_list: options,
207
+ f: this.$login.f,
208
+ chosenOrg: {
209
+ id: 0
210
+ },
211
+ count: {
212
+ zongliang: 0,
213
+ rh: 0,
214
+ dfby: 0,
215
+ jj: 0,
216
+ wsy: 0,
217
+ checkrate: '0.00%',
218
+ },
219
+ model: new PagedList(),
220
+ orgid: `('${this.$login.f.orgid}')`,
221
+ //测试
222
+ // orgid:'2586252.6314787',
223
+ year: (new Date()).getFullYear(),
224
+ plan_type: '',
225
+ f_safecheck_type:'',
226
+ xc: '',
227
+ plan_types: [{label: '全部', value: ''}, {label: '年度安检单', value: 'false'}, {label: '首次通气单', value: 'true'}]
228
+ }
229
+ },
230
+ props:{
231
+ f_filialeids:{
232
+ type:String
233
+ }
234
+ },
235
+ methods: {
236
+ barrdios() {//全屏按键事件
237
+ console.log("全屏显示事件")
238
+ this.barshow = true
239
+ this.detailshows = false
240
+ this.echartsshow = true
241
+ this.show_all = true
242
+ this.full_screen = false
243
+ this.buttonshow = true
244
+ this.showdetail = false
245
+ this.styledate.echartsfloat = 'left'
246
+ this.styledate.echartsheight = '65%'
247
+ this.echartswidth = '50%'
248
+ this.headheight = '8%'
249
+ this.$parent.echarts = '2'
250
+ this.$emit('echarts-changed')
251
+ this.newecharts = true
252
+
253
+ console.log(this.$parent.echarts, '主图状态')
254
+ },
255
+ showall() {//返回按键事件
256
+ //修改显示状态
257
+ this.barshow = false
258
+ this.detailshows = true
259
+ this.echartsshow = false
260
+ this.buttonshow = false
261
+ this.newecharts = false
262
+ this.show_all = false
263
+ this.full_screen = true
264
+ this.showdetail = false
265
+ this.styledate.echartsheight = '95%'
266
+ this.echartswidth = '95%'
267
+ this.$parent.echarts = -1
268
+ this.headheight = '11.61%'
269
+ this.$emit('echarts-changed', this.echarts)
270
+ },
271
+ settable() {
272
+ this.model = new PagedList('rs/sql/YearCountRate', 20, {
273
+ year: 'this.year',
274
+ orgid: 'this.orgid',
275
+ plan_type: 'this.plan_type',
276
+ f_safecheck_type: 'this.f_safecheck_type'
277
+ })
278
+ this.model.year = this.year
279
+ this.model.orgid = this.orgid
280
+ this.model.plan_type = this.plan_type
281
+ this.model.f_safecheck_type = this.f_safecheck_type
282
+ this.model.search('1=1')
283
+ },
284
+ set(legendname, zongliangArray, yijianArray) {
285
+ console.log('legendname==>', legendname)
286
+ console.log('zongliangArray==>', zongliangArray)
287
+ console.log('yijianArray==>', yijianArray)
288
+ let serieData = [{ //绘图数据
289
+ name: '计划量',
290
+ type: "bar",
291
+ barWidth: '15%',
292
+ barGap: "30",
293
+ itemStyle: {
294
+ normal: {
295
+ barBorderRadius: 10,
296
+ borderColor: '#acf3ed',
297
+ color: '#fff',
298
+ label: {
299
+ show: true,
300
+ textStyle: {
301
+ color: "#4a7cae"
302
+ },
303
+ position: "top",
304
+ formatter: function (p) {
305
+ return p.value > 0 ? (p.value) : '';
306
+ }
307
+ }
308
+ }
309
+ },
310
+ data: zongliangArray,
311
+ },
312
+ { //绘图数据
313
+ name: '入户量',
314
+ type: "bar",
315
+ barWidth: '15%',
316
+ barGap: "-30%",
317
+ itemStyle: {
318
+ normal: {
319
+ barBorderRadius: 10,
320
+ color: '',
321
+ label: {
322
+ show: true,
323
+ textStyle: {
324
+ color: "#fccb05"
325
+ },
326
+ position: "insideTop",
327
+ formatter: function (p) {
328
+ return p.value > 0 ? (p.value) : '';
329
+ }
330
+ }
331
+ }
332
+ },
333
+ data: yijianArray,
334
+ }]
335
+
336
+ this.xc = echarts.init(document.getElementById('chechsafedetail'))
337
+ let text = ''
338
+ if (this.plan_type == '') {
339
+ text = '居民用户安检工作量'
340
+ }
341
+ if (this.plan_type == 'false') {
342
+ text = '居民用户年度安检工作量'
343
+ }
344
+ if (this.plan_type == 'true') {
345
+ text = '居民用户首次通气安检工作量'
346
+ }
347
+ this.xc.setOption({
348
+ title: {
349
+ text: text,
350
+ x: 'left'
351
+ },
352
+ color: ['#3398DB'],
353
+ tooltip: {
354
+ trigger: 'axis',
355
+ axisPointer: { // 坐标轴指示器,坐标轴触发有效
356
+ type: 'shadow' // 默认为直线,可选为:'line' | 'shadow'
357
+ },
358
+
359
+ extraCssText: 'width: auto;height: auto;'
360
+ },
361
+ dataZoom: [{
362
+ type: 'inside',
363
+ show: true,
364
+ startValue: '0',
365
+ xAxisIndex: [0],
366
+ left: '9%',
367
+ bottom: -5,
368
+ start: 2,
369
+ end: 90 //初始化滚动条
370
+ }],
371
+ grid: {
372
+ left: '10',
373
+ right: '10',
374
+ bottom: '8',
375
+ containLabel: true
376
+ },
377
+ legend: {
378
+ data: ['计划量', '入户量'],
379
+ right: 10,
380
+ top: 12,
381
+ textStyle: {
382
+ color: "black"
383
+ },
384
+ itemWidth: 12,
385
+ itemHeight: 10,
386
+ // itemGap: 20
387
+ },
388
+ xAxis: [
389
+ {
390
+ type: 'category',
391
+ name: "月份",
392
+ nameTextStyle: {color: "#6f8ba8"},
393
+ axisTick: {
394
+ alignWithLabel: true
395
+ },
396
+ axisLine: {show: true, lineStyle: {color: '#999999'}},
397
+ axisLabel: {
398
+ show: true, interval: 0, showMinLabel: true,
399
+ showMaxLabel: true, textStyle: {color: "#6f8ba8"}
400
+ },
401
+ data: legendname
402
+ }
403
+ ],
404
+ yAxis: [{
405
+ type: "value",
406
+ name: "数量",
407
+ nameTextStyle: {color: "#6f8ba8"},
408
+ splitLine: {show: true, lineStyle: {type: 'dashed', color: '#e1e1e1'}},
409
+ axisTick: {show: true},
410
+ axisLine: {show: true, lineStyle: {color: '#999999'}},
411
+ axisLabel: {show: true, textStyle: {color: "#6f8ba8"}}
412
+ }],
413
+ series: serieData
414
+ }, true)
415
+ },
416
+ searchdata() {
417
+ console.log('searchdata')
418
+ console.log('this.orgid', this.orgid)
419
+ console.log('this.plan_type', this.plan_type)
420
+ let getGen = getData(this)
421
+ co(getGen)
422
+ }
423
+ },
424
+ ready() {
425
+ // this.orgid = `('${this.$login.f.orgid}')`
426
+ //测试
427
+ // this.orgid = '2586252.6314787'
428
+ // this.plan_type = ''
429
+ console.log('ready')
430
+ this.year = (new Date()).getFullYear()
431
+
432
+ // this.searchdata()
433
+ },
434
+ watch: {
435
+ 'year'(val) {
436
+ console.log("我是watch")
437
+ this.searchdata()
438
+ },
439
+ 'plan_type'(val) {
440
+ console.log("我是plan_type")
441
+ this.f_safecheck_type = ''
442
+ if (this.plan_type == 'false') {
443
+ this.f_safecheck_type = '年度普检'
444
+ }
445
+ if (this.plan_type == 'true') {
446
+ this.f_safecheck_type = '首次通气'
447
+ }
448
+ this.searchdata()
449
+ },
450
+ 'f_filialeids'(){
451
+ console.log('safe改变了')
452
+ this.orgid = this.f_filialeids
453
+ this.searchdata()
454
+ }
455
+ }
456
+
457
+ }
458
+ </script>
459
+ <style scoped>
460
+ .div-1 {
461
+ height: 85%;
462
+ width: 10%;
463
+ margin-left: 5%;
464
+ float: left;
465
+ margin-top: 1%;
466
+ }
467
+
468
+ .div-2 {
469
+ float: right;
470
+ width: 80%;
471
+ height: 55.56%;
472
+ margin-right: 1%;
473
+ margin-top: 0.5%;
474
+ }
475
+
476
+ .div-3 {
477
+ float: left;
478
+ margin-left: 2%;
479
+ padding-top: 2%;
480
+ width: 96%;
481
+ height: 99%;
482
+ }
483
+
484
+ .div-4 {
485
+ background-color: #fafafa;
486
+ }
487
+
488
+ table {
489
+ height: 100%;
490
+ width: 100%;
491
+ font-size: 12px
492
+ }
493
+
494
+ tr {
495
+ height: 25%;
496
+ width: 100%
497
+ }
498
+
499
+ td {
500
+ width: 11%;
501
+ font-size: 12px;
502
+ color: #666666;
503
+ }
504
+
505
+ .td-1 {
506
+ width: 16%;
507
+ color: #90addf;
508
+ font-size: 12px
509
+ }
510
+
511
+ .td-2 {
512
+ width: 15%;
513
+ color: #90addf;
514
+ font-size: 12px
515
+ }
516
+
517
+ span {
518
+ color: #90addf;
519
+ font-size: 12px
520
+ }
521
+
522
+ .span-1 {
523
+ color: #999999;
524
+ font-size: 12px
525
+ }
526
+
527
+ .p-1 {
528
+ font-size: 15px;
529
+ height: 99%;
530
+ width: 99%;
531
+ font-weight: bold;
532
+ color: #333333;
533
+ }
534
+
535
+ button {
536
+ width: 10%;
537
+ margin-top: 0%;
538
+ margin-left: 2%;
539
+ float: right;
540
+ background-color: #73ca73;
541
+ border-radius: 4px;
542
+ border: 1px solid #73ca73;
543
+ color: #ffffff;
544
+ font-size: 15px;
545
+ height: 120%;
546
+ }
547
+
548
+ .but-1 {
549
+ width: 17%;
550
+ float: right;
551
+ border-radius: 4px;
552
+ font-size: 12px;
553
+ height: 130%;
554
+ }
555
+
556
+ .but-2 {
557
+ background-color: #88b5e2;
558
+ border: #88b5e2;
559
+ width: 6%;
560
+ }
561
+
562
+ img {
563
+ width: 5px;
564
+ height: 18px;
565
+ }
566
+
567
+ .img-1 {
568
+ height: 12px;
569
+ width: auto;
570
+ }
571
+
572
+ </style>
573
+