safecheck-client 3.0.33-34 → 3.0.33-35

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,563 +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}},
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
- xc: '',
226
- plan_types: [{label: '全部', value: ''}, {label: '年度安检单', value: 'false'}, {label: '首次通气单', value: 'true'}]
227
- }
228
- },
229
- props:{
230
- f_filialeids:{
231
- type:String
232
- }
233
- },
234
- methods: {
235
- barrdios() {//全屏按键事件
236
- console.log("全屏显示事件")
237
- this.barshow = true
238
- this.detailshows = false
239
- this.echartsshow = true
240
- this.show_all = true
241
- this.full_screen = false
242
- this.buttonshow = true
243
- this.showdetail = false
244
- this.styledate.echartsfloat = 'left'
245
- this.styledate.echartsheight = '65%'
246
- this.echartswidth = '50%'
247
- this.headheight = '8%'
248
- this.$parent.echarts = '2'
249
- this.$emit('echarts-changed')
250
- this.newecharts = true
251
-
252
- console.log(this.$parent.echarts, '主图状态')
253
- },
254
- showall() {//返回按键事件
255
- //修改显示状态
256
- this.barshow = false
257
- this.detailshows = true
258
- this.echartsshow = false
259
- this.buttonshow = false
260
- this.newecharts = false
261
- this.show_all = false
262
- this.full_screen = true
263
- this.showdetail = false
264
- this.styledate.echartsheight = '95%'
265
- this.echartswidth = '95%'
266
- this.$parent.echarts = -1
267
- this.headheight = '11.61%'
268
- this.$emit('echarts-changed', this.echarts)
269
- },
270
- settable() {
271
- this.model = new PagedList('rs/sql/YearCountRate', 20, {
272
- year: 'this.year',
273
- orgid: 'this.orgid',
274
- plan_type: 'this.plan_type'
275
- })
276
- this.model.year = this.year
277
- this.model.orgid = this.orgid
278
- this.model.plan_type = this.plan_type
279
- this.model.search('1=1')
280
- },
281
- set(legendname, zongliangArray, yijianArray) {
282
- console.log('legendname==>', legendname)
283
- console.log('zongliangArray==>', zongliangArray)
284
- console.log('yijianArray==>', yijianArray)
285
- let serieData = [{ //绘图数据
286
- name: '计划量',
287
- type: "bar",
288
- barWidth: '15%',
289
- barGap: "30",
290
- itemStyle: {
291
- normal: {
292
- barBorderRadius: 10,
293
- borderColor: '#acf3ed',
294
- color: '#fff',
295
- label: {
296
- show: true,
297
- textStyle: {
298
- color: "#4a7cae"
299
- },
300
- position: "top",
301
- formatter: function (p) {
302
- return p.value > 0 ? (p.value) : '';
303
- }
304
- }
305
- }
306
- },
307
- data: zongliangArray,
308
- },
309
- { //绘图数据
310
- name: '入户量',
311
- type: "bar",
312
- barWidth: '15%',
313
- barGap: "-30%",
314
- itemStyle: {
315
- normal: {
316
- barBorderRadius: 10,
317
- color: '',
318
- label: {
319
- show: true,
320
- textStyle: {
321
- color: "#fccb05"
322
- },
323
- position: "insideTop",
324
- formatter: function (p) {
325
- return p.value > 0 ? (p.value) : '';
326
- }
327
- }
328
- }
329
- },
330
- data: yijianArray,
331
- }]
332
-
333
- this.xc = echarts.init(document.getElementById('chechsafedetail'))
334
- let text = ''
335
- if (this.plan_type == '') {
336
- text = '居民用户安检工作量'
337
- }
338
- if (this.plan_type == 'false') {
339
- text = '居民用户年度安检工作量'
340
- }
341
- if (this.plan_type == 'true') {
342
- text = '居民用户首次通气安检工作量'
343
- }
344
- this.xc.setOption({
345
- title: {
346
- text: text,
347
- x: 'left'
348
- },
349
- color: ['#3398DB'],
350
- tooltip: {
351
- trigger: 'axis',
352
- axisPointer: { // 坐标轴指示器,坐标轴触发有效
353
- type: 'shadow' // 默认为直线,可选为:'line' | 'shadow'
354
- },
355
-
356
- extraCssText: 'width: auto;height: auto;'
357
- },
358
- dataZoom: [{
359
- type: 'inside',
360
- show: true,
361
- startValue: '0',
362
- xAxisIndex: [0],
363
- left: '9%',
364
- bottom: -5,
365
- start: 2,
366
- end: 90 //初始化滚动条
367
- }],
368
- grid: {
369
- left: '10',
370
- right: '10',
371
- bottom: '8',
372
- containLabel: true
373
- },
374
- legend: {
375
- data: ['计划量', '入户量'],
376
- right: 10,
377
- top: 12,
378
- textStyle: {
379
- color: "black"
380
- },
381
- itemWidth: 12,
382
- itemHeight: 10,
383
- // itemGap: 20
384
- },
385
- xAxis: [
386
- {
387
- type: 'category',
388
- name: "月份",
389
- nameTextStyle: {color: "#6f8ba8"},
390
- axisTick: {
391
- alignWithLabel: true
392
- },
393
- axisLine: {show: true, lineStyle: {color: '#999999'}},
394
- axisLabel: {
395
- show: true, interval: 0, showMinLabel: true,
396
- showMaxLabel: true, textStyle: {color: "#6f8ba8"}
397
- },
398
- data: legendname
399
- }
400
- ],
401
- yAxis: [{
402
- type: "value",
403
- name: "数量",
404
- nameTextStyle: {color: "#6f8ba8"},
405
- splitLine: {show: true, lineStyle: {type: 'dashed', color: '#e1e1e1'}},
406
- axisTick: {show: true},
407
- axisLine: {show: true, lineStyle: {color: '#999999'}},
408
- axisLabel: {show: true, textStyle: {color: "#6f8ba8"}}
409
- }],
410
- series: serieData
411
- }, true)
412
- },
413
- searchdata() {
414
- console.log('searchdata')
415
- console.log('this.orgid', this.orgid)
416
- console.log('this.plan_type', this.plan_type)
417
- let getGen = getData(this)
418
- co(getGen)
419
- }
420
- },
421
- ready() {
422
- // this.orgid = `('${this.$login.f.orgid}')`
423
- //测试
424
- // this.orgid = '2586252.6314787'
425
- // this.plan_type = ''
426
- console.log('ready')
427
- this.year = (new Date()).getFullYear()
428
-
429
- // this.searchdata()
430
- },
431
- watch: {
432
- 'year'(val) {
433
- console.log("我是watch")
434
- this.searchdata()
435
- },
436
- 'plan_type'(val) {
437
- console.log("我是plan_type")
438
- this.searchdata()
439
- },
440
- 'f_filialeids'(){
441
- console.log('safe改变了')
442
- this.orgid = this.f_filialeids
443
- this.searchdata()
444
- }
445
- }
446
-
447
- }
448
- </script>
449
- <style scoped>
450
- .div-1 {
451
- height: 85%;
452
- width: 10%;
453
- margin-left: 5%;
454
- float: left;
455
- margin-top: 1%;
456
- }
457
-
458
- .div-2 {
459
- float: right;
460
- width: 80%;
461
- height: 55.56%;
462
- margin-right: 1%;
463
- margin-top: 0.5%;
464
- }
465
-
466
- .div-3 {
467
- float: left;
468
- margin-left: 2%;
469
- padding-top: 2%;
470
- width: 96%;
471
- height: 99%;
472
- }
473
-
474
- .div-4 {
475
- background-color: #fafafa;
476
- }
477
-
478
- table {
479
- height: 100%;
480
- width: 100%;
481
- font-size: 12px
482
- }
483
-
484
- tr {
485
- height: 25%;
486
- width: 100%
487
- }
488
-
489
- td {
490
- width: 11%;
491
- font-size: 12px;
492
- color: #666666;
493
- }
494
-
495
- .td-1 {
496
- width: 16%;
497
- color: #90addf;
498
- font-size: 12px
499
- }
500
-
501
- .td-2 {
502
- width: 15%;
503
- color: #90addf;
504
- font-size: 12px
505
- }
506
-
507
- span {
508
- color: #90addf;
509
- font-size: 12px
510
- }
511
-
512
- .span-1 {
513
- color: #999999;
514
- font-size: 12px
515
- }
516
-
517
- .p-1 {
518
- font-size: 15px;
519
- height: 99%;
520
- width: 99%;
521
- font-weight: bold;
522
- color: #333333;
523
- }
524
-
525
- button {
526
- width: 10%;
527
- margin-top: 0%;
528
- margin-left: 2%;
529
- float: right;
530
- background-color: #73ca73;
531
- border-radius: 4px;
532
- border: 1px solid #73ca73;
533
- color: #ffffff;
534
- font-size: 15px;
535
- height: 120%;
536
- }
537
-
538
- .but-1 {
539
- width: 17%;
540
- float: right;
541
- border-radius: 4px;
542
- font-size: 12px;
543
- height: 130%;
544
- }
545
-
546
- .but-2 {
547
- background-color: #88b5e2;
548
- border: #88b5e2;
549
- width: 6%;
550
- }
551
-
552
- img {
553
- width: 5px;
554
- height: 18px;
555
- }
556
-
557
- .img-1 {
558
- height: 12px;
559
- width: auto;
560
- }
561
-
562
- </style>
563
-
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
+