apply-clients 3.3.71-4 → 3.3.73

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.
Files changed (15) hide show
  1. package/build/dev-server.js +127 -127
  2. package/package.json +1 -1
  3. package/src/App.vue +20 -20
  4. package/src/apply.js +92 -92
  5. package/src/applyAndroid.js +31 -34
  6. package/src/components/android/AppServiceView.vue +595 -602
  7. package/src/components/android/Process/AppExplorationUser.vue +396 -489
  8. package/src/components/android/Process/AppServiceControl.vue +876 -1330
  9. package/src/components/product/Print/IgnitionBill/IgnitionBill.vue +259 -259
  10. package/src/components/product/Print/IgnitionBill/printIgnitionBill.vue +168 -168
  11. package/src/components/product/ServiceView.vue +691 -631
  12. package/src/main.js +6 -7
  13. package/src/components/android/Process/Processes/selectApply.vue +0 -250
  14. package/src/components/android/Process/Processes/selectUserinfo.vue +0 -182
  15. package/yarn.lock +0 -9013
package/src/components/android/AppServiceView.vue CHANGED
@@ -1,602 +1,595 @@
1
- <template>
2
- <div class="form-horizontal select-overspread">
3
- <div v-for="(index,item) in data.fields">
4
- <!--input-->
5
- <div :style="item.style ? item.style : ''"
6
- v-if="(item.type==='input' || item.type==='number'||item.type === 'tel'||item.type === 'email') && !item.hidden && (item.device === 'app' || !item.device)"
7
- :class="[item.required && !(item.value) ? 'apply-has-error' : '', item.bootstraped ? item.bootstraped + ' form-group app-input':'col-xs-12 form-group app-input']">
8
- <label class="control-label-justify">{{item.label}}</label>
9
- <div :style="item.value_style ? item.value_style:''"
10
- :class="item.value_bootstraped ? item.value_bootstraped : 'col-xs-8'">
11
- <input class="" style="width: 100%"
12
- :type="item.type"
13
- v-model="data.fields[index].value"
14
- :placeholder="item.placeholder"
15
- :value="data.fields[index].value"
16
- :readonly="item.readonly"
17
- :disabled="item.disabled"
18
- @change="onchange(index)"
19
- @blur="onblur(index)"
20
- @input="oninput(index)"
21
- />
22
- </div>
23
- </div>
24
-
25
- <!--select-->
26
- <div :style="item.style ? item.style : ''"
27
- v-if="item.type==='select' && !item.hidden && (item.device === 'app' || !item.device)"
28
- :class="[item.required && !(item.value) ? 'apply-has-error' : '', item.bootstraped ? item.bootstraped + ' form-group app-input':'col-xs-12 form-group app-input']">
29
- <label class="control-label-justify">{{item.label}}</label>
30
- <div :style="item.value_style ? item.value_style:''"
31
- :class="item.value_bootstraped ? item.value_bootstraped : 'col-xs-8'">
32
- <v-select
33
- class="select" width="100%" align="right"
34
- :placeholder="item.placeholder"
35
- :search="item.search"
36
- close-on-select value-single
37
- @select-search="selectSearch($arguments,index)"
38
- :options="data.fields[index].options"
39
- v-model="data.fields[index].value"
40
- :value.sync="data.fields[index].value"
41
- @blur="onblur(index)"
42
- @change="onchange(index)"
43
- :readonly="item.readonly"
44
- :disabled="item.disabled"
45
- ></v-select>
46
- </div>
47
- </div>
48
-
49
- <!--时间datepicker-->
50
- <div :style="item.style ? item.style : ''"
51
- v-if="item.type==='datepicker' && !item.hidden && (item.device === 'app' || !item.device)"
52
- :class="[item.required && !(item.value) ? 'apply-has-error' : '', item.bootstraped ? item.bootstraped+' form-group app-input':'col-xs-12 form-group app-input']">
53
- <label class="control-label-justify">{{item.label}}</label>
54
- <div class="form-group" :style="item.value_style ? item.value_style:''"
55
- :class="item.value_bootstraped ? item.value_bootstraped : 'col-xs-8'">
56
- <datepicker
57
- @change="onchange(index)"
58
- @blur="onblur(index)"
59
- :placeholder="item.placeholder"
60
- :value.sync="data.fields[index].value"
61
- :format="item.format ? item.format : 'yyyy-MM-dd'"
62
- v-model="data.fields[index].value"
63
- :readonly="item.readonly"
64
- :disabled="item.disabled"
65
- :show-reset-button="true">
66
- </datepicker>
67
- </div>
68
- </div>
69
-
70
- <!--textarea-->
71
- <div :style="item.style ? item.style : ''"
72
- v-if="item.type==='textarea' && !item.hidden && (item.device === 'app' || !item.device)"
73
- :class="[item.required && !(item.value) ? 'apply-has-error' : '', item.bootstraped?item.bootstraped+' form-group app-input':'col-xs-12 form-group app-input']">
74
- <label class="control-label-justify">{{item.label}}</label>
75
- <div :style="item.value_style ? item.value_style:''"
76
- :class="item.value_bootstraped ? item.value_bootstraped : 'col-xs-8'">
77
- <textarea
78
- :readonly="item.readonly"
79
- :disabled="item.disabled"
80
- class="" rows="1"
81
- style="width: 100%;height: 100%"
82
- v-model="data.fields[index].value"
83
- :value="data.fields[index].value"
84
- @change="onchange(index)"
85
- @blur="onblur(index)"
86
- @input="oninput(index)"
87
- ></textarea>
88
- </div>
89
- </div>
90
-
91
- <!--checkbox-->
92
- <div :style="item.style ? item.style : ''"
93
- v-if="item.type==='checkbox' && !item.hidden && (item.device === 'app' || !item.device)"
94
- :class="[item.required && item.value.length === 0 ? 'apply-has-error' : '',item.bootstraped?item.bootstraped+' form-group app-input':'col-xs-12 form-group app-input']">
95
- <label class="control-label-justify">{{item.label}}</label>
96
- <div :style="item.value_style ? item.value_style:''"
97
- :class="item.value_bootstraped ? item.value_bootstraped : 'col-xs-8'">
98
- <label class="" v-for="(index2,row) in item.options">
99
- <input type="checkbox" class=""
100
- :readonly="data.fields[index].readonly"
101
- :disabled="data.fields[index].disabled"
102
- v-model="data.fields[index].value"
103
- :value="data.fields[index].options[index2].value"
104
- @change="onchange(index)"
105
- @blur="onblur(index)">
106
- {{row.label}}
107
- </label>
108
- </div>
109
- </div>
110
- </div>
111
-
112
- <div class="col-sm-12 col-xs-12" id="test11">
113
- <accordion one-at-a-time="true">
114
- <panel v-for="(i,item) in data.onetomany" :header="item.title" :is-open="false" type="primary">
115
- <app-onetomany :onetomany="item" :index="i"></app-onetomany>
116
- </panel>
117
- <panel v-for="(i,item) in data.components" :header="item.title" :is-open="false" type="primary" v-if="item.device === 'app' || !item.device">
118
- <component :is="item.name" :selectdata="data" :mark="item.mark"></component>
119
- </panel>
120
- </accordion>
121
- </div>
122
-
123
- <!--自定义组件-->
124
- <slot></slot>
125
-
126
- <!-- 按钮组 -->
127
- <div class="text-center">
128
- <button v-for="(index,button) in data.buttons"
129
- :disabled="button.disabled && disable_button"
130
- style="min-width:100px"
131
- :class="button.disabled && disable_button ? 'btn btn-default button_spacing' : 'btn btn-primary button_spacing'"
132
- v-if="!button.hidden"
133
- @click.prevent="click_but(button)"
134
- >
135
- {{button.button_name}}
136
- </button>
137
- </div>
138
-
139
- <!-- 按钮模态框 -->
140
- <modal v-if="showButModal" :show.sync="showButModal" backdrop="false" large>
141
- <header slot="modal-header" class="modal-header">
142
- <button type="button" class="close" @click="closeModal()"><span>&times;</span></button>
143
- <span class="modal-title"><font
144
- size="3">{{data.button.button_name}}</font></span>
145
- </header>
146
- <article slot="modal-body" class="modal-body clearfix">
147
- <div class="form-group" >
148
- <div v-for="(index,item) in data.button.button_fields">
149
- <div :style="item.style ? item.style : ''" :class="[item.required && !(item.value) ? 'has-error' : '', item.bootstraped ? item.bootstraped + ' form-group' : 'form-group']"
150
- v-if="(item.type==='input' || item.type==='number'||item.type === 'tel'||item.type === 'email') && !item.hidden && (item.device === 'pc' || !item.device)">
151
- <label :style="item.label_style ? item.label_style : ''"
152
- :class="item.label_bootstraped ? item.label_bootstraped + ' control-label-justify control-label' : 'control-label-justify control-label'">{{item.label}}</label>
153
- <div :style="item.value_style ? item.value_style : ''"
154
- :class="item.value_bootstraped ? item.value_bootstraped : 'col-xs-8'">
155
- <input class="form-control input_view"
156
- :placeholder="item.placeholder"
157
- :type="item.type"
158
- v-model="item.value"
159
- :value="item.value"
160
- :readonly="item.readonly"
161
- :disabled="item.disabled"
162
- @change="onbutchange(index)"
163
- @blur="onbutblur(index)"
164
- @input="onbutinput(index)"
165
- />
166
- </div>
167
- </div>
168
-
169
- <!--时间datepicker-->
170
- <div :style="item.style ? item.style : ''" :class="[item.required && !(item.value) ? 'has-error' : '', item.bootstraped ? item.bootstraped + ' form-group':'form-group']"
171
- v-if="item.type==='datepicker' && !item.hidden && (item.device === 'pc' || !item.device)">
172
- <label :style="item.label_style ? item.label_style : ''"
173
- :class="item.label_bootstraped ? item.label_bootstraped + ' control-label-justify control-label' : 'control-label-justify control-label'">{{item.label}}</label>
174
- <div :style="item.value_style ? item.value_style : ''"
175
- :class="item.value_bootstraped ? item.value_bootstraped : 'col-xs-8'">
176
- <datepicker
177
- :placeholder="item.placeholder"
178
- :value.sync="item.value"
179
- v-model="item.value"
180
- :readonly="item.readonly"
181
- :disabled="item.disabled"
182
- :format="item.format ? item.format : 'yyyy-MM-dd'"
183
- :show-reset-button="true"
184
- @change="onbutchange(index)"
185
- @blur="onbutblur(index)"
186
- ></datepicker>
187
- </div>
188
- </div>
189
-
190
- <!--select-->
191
- <div :style="item.style ? item.style : ''" :class="[item.required && !(item.value) ? 'has-error' : '', item.bootstraped ? item.bootstraped + ' form-group':'form-group']"
192
- v-if="item.type==='select' && !item.hidden && (item.device === 'pc' || !item.device)">
193
- <label :style="item.label_style ? item.label_style : ''"
194
- :class="item.label_bootstraped ? item.label_bootstraped + ' control-label-justify control-label' : 'control-label-justify control-label'">{{item.label}}</label>
195
- <div :style="item.value_style ? item.value_style : ''"
196
- :class="item.value_bootstraped ? item.value_bootstraped : 'col-xs-8'">
197
- <input-select
198
- class="select select_list"
199
- :value.sync="item.value"
200
- v-model="item.value"
201
- :options='item.options'
202
- :readonly="item.readonly"
203
- :disable="item.disabled"
204
- :valueSingle="true"
205
- @blur="onbutblur(index)"
206
- @change="onbutchange(index)"
207
- ></input-select>
208
- </div>
209
- </div>
210
-
211
- <!--textarea-->
212
- <div :style="item.style ? item.style : ''" :class="[item.required && !(item.value) ? 'has-error' : '', item.bootstraped ? item.bootstraped + ' form-group':'form-group']"
213
- v-if="item.type==='textarea' && !item.hidden && (item.device === 'pc' || !item.device)">
214
- <label :style="item.label_style ? item.label_style : ''"
215
- :class="item.label_bootstraped ? item.label_bootstraped + ' control-label-justify control-label' : 'control-label-justify control-label'">{{item.label}}</label>
216
- <div :style="item.value_style ? item.value_style : ''"
217
- :class="item.value_bootstraped ? item.value_bootstraped : 'col-xs-8'">
218
- <textarea
219
- class="form-control input_view"
220
- style="width: 100%;height: 100%"
221
- v-model="item.value"
222
- :value="item.value"
223
- :rows="item.rows"
224
- :readonly="item.readonly"
225
- :disabled="item.disabled"
226
- @change="onbutchange(index)"
227
- @blur="onbutblur(index)"
228
- @input="onbutinput(index)"
229
- ></textarea>
230
- </div>
231
- </div>
232
- </div>
233
- </div>
234
- </article>
235
- <footer slot="modal-footer" class="modal-footer">
236
- <button :class="disable_modal_button ? 'btn btn-default':'btn btn-primary'"
237
- :disabled="disable_modal_button" type="button" @click="confirmModal()">
238
- 确认
239
- </button>
240
- </footer>
241
- </modal>
242
- </div>
243
- </template>
244
- <script>
245
- import Vue from 'vue'
246
- import {isEmpty} from "../Util";
247
- // Date格式化
248
- Date.prototype.Format = function (fmt) {
249
- var o = {
250
- 'M+': this.getMonth() + 1, // 月份
251
- 'd+': this.getDate(), // 日
252
- 'H+': this.getHours(), // 小时
253
- 'm+': this.getMinutes(), // 分
254
- 's+': this.getSeconds(), // 秒
255
- 'q+': Math.floor((this.getMonth() + 3) / 3), // 季度
256
- 'S': this.getMilliseconds() // 毫秒
257
- }
258
- if (/(y+)/.test(fmt)) fmt = fmt.replace(RegExp.$1, (this.getFullYear() + '').substr(4 - RegExp.$1.length))
259
- for (var k in o) {
260
- if (new RegExp('(' + k + ')').test(fmt)) fmt = fmt.replace(RegExp.$1, (RegExp.$1.length === 1) ? (o[k]) : (('00' + o[k]).substr(('' + o[k]).length)))
261
- }
262
- return fmt
263
- }
264
-
265
- export default {
266
- title: '报建业务通用组件',
267
- props: {
268
- data: {
269
- type: Object
270
- },
271
- showprint: {
272
- type: Boolean,
273
- default: true
274
- }
275
- },
276
- data () {
277
- return {
278
- model: {}, // 公司等属性
279
- disable_button: true, // 控制按钮禁用
280
- disable_modal_button: true, // 控制按钮禁用
281
- showButModal: false
282
- }
283
- },
284
- watch: {
285
- deep: true
286
- },
287
- computed: {
288
-
289
- },
290
- created () {
291
- // 初始化数据
292
- this.initializtion()
293
- if (this.data.readyEvent) {
294
- this.$dispatch(this.data.readyEvent)
295
- }
296
- this.$dispatch('initializtionView')
297
- },
298
- methods: {
299
- // 初始化数据
300
- initializtion () {
301
- for (const item of this.data.fields) {
302
- this.data[item.field] = item.value
303
- }
304
- // 是否禁用按钮
305
- this.disableButton()
306
- },
307
- // 是否禁用按钮
308
- disableButton () {
309
- let flag = false
310
-
311
- for (const field of this.data.fields) {
312
- if (field.required && !field.value && !field.hidden && field.value !== 0) {
313
- flag = true
314
- }
315
-
316
- // 任何选择框只要是否都不能提交
317
- if (field.type === 'select' && field.value === '否' && field.value_no_disable) {
318
- flag = true
319
- }
320
-
321
- if (field.type === 'checkbox' && field.required && field.value.length === 0) {
322
- flag = true
323
- }
324
- }
325
-
326
- this.disable_button = flag
327
- },
328
- // 失去焦点且值最终发生变化触发
329
- async onchange (index) {
330
- // 是否禁用按钮
331
- this.disableButton()
332
-
333
- if (!isEmpty(this.data.fields[index].value)) {
334
- // 前缀、后缀
335
- if (this.data.fields[index].prefix) {
336
- this.data.fields[index].value = this.data.fields[index].prefix + this.data.fields[index].value
337
- }
338
- if (this.data.fields[index].suffix) {
339
- this.data.fields[index].value = this.data.fields[index].value + this.data.fields[index].suffix
340
- }
341
- }
342
-
343
- // data赋值
344
- this.data[this.data.fields[index].field] = this.data.fields[index].value
345
-
346
- if (this.data.fields[index].type === 'datepicker') {
347
- this.check_datepicker(index)
348
- }
349
-
350
- if (this.data.fields[index].onchange) {
351
- this.$dispatch(this.data.fields[index].onchange, index)
352
- }
353
- this.$dispatch('onchange', index)
354
-
355
-
356
- },
357
- // 失去焦点触发，无论值是否发生变化
358
- onblur (index) {
359
- this.disableButton()
360
-
361
- if (this.data.fields[index].onblur) {
362
- this.$dispatch(this.data.fields[index].onblur, index)
363
- }
364
-
365
- this.$dispatch('onblur', index)
366
- },
367
- oninput (index) {
368
- // 是否禁用按钮
369
- this.disableButton()
370
-
371
- if (this.data.fields[index].oninput) {
372
- this.$dispatch(this.data.fields[index].oninput, index)
373
- }
374
- this.$dispatch('oninput', index)
375
- },
376
- // 点击按钮组按钮
377
- async click_but (button) {
378
- if (this.data.defname === '通气点火') {
379
-
380
- this.$showMessage(`请确认表号是否正确`).then((res) => {
381
-
382
-
383
- this.disable_button = true
384
-
385
- this.data.fields.forEach(item => {
386
- this.data[item.field] = item.value
387
- })
388
-
389
- this.data.button = button
390
-
391
- if (button.button_fields && button.button_fields.length > 0) {
392
- this.showButModal = true
393
- return
394
- }
395
-
396
- if (this.data.button.event) {
397
- this.$dispatch(this.data.button.event)
398
- } else {
399
- this.$dispatch('button')
400
- }
401
-
402
- })
403
-
404
- }
405
- else{
406
- this.disable_button = true
407
-
408
- this.data.fields.forEach(item => {
409
- this.data[item.field] = item.value
410
- })
411
-
412
- this.data.button = button
413
-
414
- if (button.button_fields && button.button_fields.length > 0) {
415
- this.showButModal = true
416
- return
417
- }
418
-
419
- if (this.data.button.event) {
420
- this.$dispatch(this.data.button.event)
421
- } else {
422
- this.$dispatch('button')
423
- }
424
- }
425
- },
426
- confirmModal () {
427
- this.closeModal()
428
-
429
- this.data.button.button_fields.forEach(item => {
430
- this.data.button[item.field] = item.value
431
- })
432
-
433
- if (this.data.button.event) {
434
- this.$dispatch(this.data.button.event)
435
- } else {
436
- this.$dispatch('button')
437
- }
438
- },
439
- // 关闭模态框
440
- closeModal () {
441
- this.showButModal = false
442
- this.disable_modal_button = true
443
- },
444
- onbutchange (index) {
445
- // 是否禁用按钮
446
- this.disableModalButton()
447
-
448
- if (this.data.button.button_fields[index].onchange) {
449
- this.$dispatch(this.data.button.button_fields[index].onchange, index)
450
- } else {
451
- this.$dispatch('onbutchange', index)
452
- }
453
-
454
- },
455
- onbutblur (index) {
456
- this.disableModalButton()
457
-
458
- if (this.data.button.button_fields[index].onblur) {
459
- this.$dispatch(this.data.button.button_fields[index].onblur, index)
460
- } else {
461
- this.$dispatch('onbutblur', index)
462
- }
463
- },
464
- onbutinput (index) {
465
- // 是否禁用按钮
466
- this.disableModalButton()
467
-
468
- if (this.data.button.button_fields[index].oninput) {
469
- this.$dispatch(this.data.button.button_fields[index].oninput, index)
470
- } else {
471
- this.$dispatch('onbutinput', index)
472
- }
473
- },
474
- disableModalButton () {
475
- let flag = false
476
-
477
-
478
- for (const item of this.data.button.button_fields) {
479
- if (item.required && !item.value) {
480
- if (item.value === 0) {
481
- flag = false
482
- } else {
483
- flag = true
484
- }
485
- }
486
- }
487
-
488
- this.disable_modal_button = flag
489
- },
490
- check_datepicker (index) {
491
- // 时间格式检测
492
- if (!isEmpty(this.data.fields[index].value)) {
493
-
494
- let dateReg = /^[1-9]\d{3}-(0[1-9]|1[0-2])-(0[1-9]|[1-2][0-9]|3[0-1])$/
495
- let timeReg = /^(20|21|22|23|[0-1]\d):[0-5]\d:[0-5]\d$/
496
- let datetimeReg = /^[1-9]\d{3}-(0[1-9]|1[0-2])-(0[1-9]|[1-2][0-9]|3[0-1])\s+(20|21|22|23|[0-1]\d):[0-5]\d:[0-5]\d$/
497
- if (this.data.fields[index].format) {
498
- if (this.data.fields[index].format === 'yyyy-MM-dd') {
499
- if (!dateReg.test(this.data.fields[index].value)) {
500
- this.data.fields[index].value = ''
501
- this.$showAlert(this.data.fields[index].label + '格式错误如：2021-01-01', 'warning', 2000)
502
- }
503
- }
504
- if (this.data.fields[index].format === 'HH:mm:ss') {
505
- if (!timeReg.test(this.data.fields[index].value)) {
506
- this.data.fields[index].value = ''
507
- this.$showAlert(this.data.fields[index].label + '格式错误如：00:00:00', 'warning', 2000)
508
- }
509
- }
510
- if (this.data.fields[index].format === 'yyyy-MM-dd HH:mm:ss') {
511
- if (!datetimeReg.test(this.data.fields[index].value)) {
512
- this.data.fields[index].value = ''
513
- this.$showAlert(this.data.fields[index].label + '格式错误如：2021-01-01 00:00:00', 'warning', 2000)
514
- }
515
- }
516
- } else {
517
- if (!dateReg.test(this.data.fields[index].value)) {
518
- this.data.fields[index].value = ''
519
- this.$showAlert(this.data.fields[index].label + '格式错误如：2021-01-01', 'warning', 2000)
520
- }
521
- }
522
- }
523
- },
524
- selectSearch(event, index) {
525
- if (this.data.fields[index].selectSearch) {
526
- this.$dispatch(this.data.fields[index].selectSearch, event[0], index)
527
- }
528
- this.$dispatch('selectSearch', event[0], index)
529
- }
530
- },
531
- events: {
532
- }
533
- }
534
- </script>
535
- <style scoped>
536
- .control-label-justify {
537
- width: 30%;
538
- text-align: justify;
539
- text-align-last: justify;
540
- font-family: PingFang-SC-Bold;
541
- float: left;
542
- }
543
- .button_spacing{margin: 0px 0px 0px 10px;}
544
- </style>
545
- <style lang="less">
546
- .apply-has-error {
547
- border-bottom: 1px solid #a94442;
548
- }
549
- .app-input {
550
- label {
551
- float: left;
552
- }
553
- .select {
554
- button {
555
- border: none;
556
- outline: none;
557
- text-align: left;
558
- .btn-placeholder {
559
- color: #ACA899
560
- }
561
- }
562
- }
563
- .datepicker {
564
- .form-control:focus {
565
- border: none!important;
566
- outline: none!important;
567
- -webkit-box-shadow: none;
568
- box-shadow: none;
569
- }
570
- }
571
- textarea {
572
- padding: 8px 10px;
573
- border: none;
574
- outline: none;
575
- margin: 0px;
576
- }
577
- input[readonly]{
578
- color: #ACA899!important;
579
- background: #FFFFFF;
580
- border: none;
581
- outline: none;
582
- }
583
- input:disabled{
584
- color: #ACA899!important;
585
- background: #FFFFFF;
586
- border: none;
587
- outline: none;
588
- }
589
- textarea[readonly]{
590
- color: #ACA899!important;
591
- background: #FFFFFF;
592
- border: none;
593
- outline: none;
594
- }
595
- textarea:disabled{
596
- color: #ACA899!important;
597
- background: #FFFFFF;
598
- border: none;
599
- outline: none;
600
- }
601
- }
602
- </style>
1
+ <template>
2
+ <div class="form-horizontal select-overspread">
3
+ <div v-for="(index,item) in data.fields">
4
+ <!--input-->
5
+ <div :style="item.style ? item.style : ''"
6
+ v-if="(item.type==='input' || item.type==='number'||item.type === 'tel'||item.type === 'email') && !item.hidden && (item.device === 'app' || !item.device)"
7
+ :class="[item.required && !(item.value) ? 'apply-has-error' : '', item.bootstraped ? item.bootstraped + ' form-group app-input':'col-xs-12 form-group app-input']">
8
+ <label class="control-label-justify">{{item.label}}</label>
9
+ <div :style="item.value_style ? item.value_style:''"
10
+ :class="item.value_bootstraped ? item.value_bootstraped : 'col-xs-8'">
11
+ <input class="" style="width: 100%"
12
+ :type="item.type"
13
+ v-model="data.fields[index].value"
14
+ :placeholder="item.placeholder"
15
+ :value="data.fields[index].value"
16
+ :readonly="item.readonly"
17
+ :disabled="item.disabled"
18
+ @change="onchange(index)"
19
+ @blur="onblur(index)"
20
+ @input="oninput(index)"
21
+ />
22
+ </div>
23
+ </div>
24
+
25
+ <!--select-->
26
+ <div :style="item.style ? item.style : ''"
27
+ v-if="item.type==='select' && !item.hidden && (item.device === 'app' || !item.device)"
28
+ :class="[item.required && !(item.value) ? 'apply-has-error' : '', item.bootstraped ? item.bootstraped + ' form-group app-input':'col-xs-12 form-group app-input']">
29
+ <label class="control-label-justify">{{item.label}}</label>
30
+ <div :style="item.value_style ? item.value_style:''"
31
+ :class="item.value_bootstraped ? item.value_bootstraped : 'col-xs-8'">
32
+ <v-select
33
+ class="select" width="100%" align="right"
34
+ :placeholder="item.placeholder"
35
+ :search="item.search"
36
+ close-on-select value-single
37
+ :options="data.fields[index].options"
38
+ v-model="data.fields[index].value"
39
+ :value.sync="data.fields[index].value"
40
+ @blur="onblur(index)"
41
+ @change="onchange(index)"
42
+ :readonly="item.readonly"
43
+ :disabled="item.disabled"
44
+ ></v-select>
45
+ </div>
46
+ </div>
47
+
48
+ <!--时间datepicker-->
49
+ <div :style="item.style ? item.style : ''"
50
+ v-if="item.type==='datepicker' && !item.hidden && (item.device === 'app' || !item.device)"
51
+ :class="[item.required && !(item.value) ? 'apply-has-error' : '', item.bootstraped ? item.bootstraped+' form-group app-input':'col-xs-12 form-group app-input']">
52
+ <label class="control-label-justify">{{item.label}}</label>
53
+ <div class="form-group" :style="item.value_style ? item.value_style:''"
54
+ :class="item.value_bootstraped ? item.value_bootstraped : 'col-xs-8'">
55
+ <datepicker
56
+ @change="onchange(index)"
57
+ @blur="onblur(index)"
58
+ :placeholder="item.placeholder"
59
+ :value.sync="data.fields[index].value"
60
+ :format="item.format ? item.format : 'yyyy-MM-dd'"
61
+ v-model="data.fields[index].value"
62
+ :readonly="item.readonly"
63
+ :disabled="item.disabled"
64
+ :show-reset-button="true">
65
+ </datepicker>
66
+ </div>
67
+ </div>
68
+
69
+ <!--textarea-->
70
+ <div :style="item.style ? item.style : ''"
71
+ v-if="item.type==='textarea' && !item.hidden && (item.device === 'app' || !item.device)"
72
+ :class="[item.required && !(item.value) ? 'apply-has-error' : '', item.bootstraped?item.bootstraped+' form-group app-input':'col-xs-12 form-group app-input']">
73
+ <label class="control-label-justify">{{item.label}}</label>
74
+ <div :style="item.value_style ? item.value_style:''"
75
+ :class="item.value_bootstraped ? item.value_bootstraped : 'col-xs-8'">
76
+ <textarea
77
+ :readonly="item.readonly"
78
+ :disabled="item.disabled"
79
+ class="" rows="1"
80
+ style="width: 100%;height: 100%"
81
+ v-model="data.fields[index].value"
82
+ :value="data.fields[index].value"
83
+ @change="onchange(index)"
84
+ @blur="onblur(index)"
85
+ @input="oninput(index)"
86
+ ></textarea>
87
+ </div>
88
+ </div>
89
+
90
+ <!--checkbox-->
91
+ <div :style="item.style ? item.style : ''"
92
+ v-if="item.type==='checkbox' && !item.hidden && (item.device === 'app' || !item.device)"
93
+ :class="[item.required && item.value.length === 0 ? 'apply-has-error' : '',item.bootstraped?item.bootstraped+' form-group app-input':'col-xs-12 form-group app-input']">
94
+ <label class="control-label-justify">{{item.label}}</label>
95
+ <div :style="item.value_style ? item.value_style:''"
96
+ :class="item.value_bootstraped ? item.value_bootstraped : 'col-xs-8'">
97
+ <label class="" v-for="(index2,row) in item.options">
98
+ <input type="checkbox" class=""
99
+ :readonly="data.fields[index].readonly"
100
+ :disabled="data.fields[index].disabled"
101
+ v-model="data.fields[index].value"
102
+ :value="data.fields[index].options[index2].value"
103
+ @change="onchange(index)"
104
+ @blur="onblur(index)">
105
+ {{row.label}}
106
+ </label>
107
+ </div>
108
+ </div>
109
+ </div>
110
+
111
+ <div class="col-sm-12 col-xs-12">
112
+ <accordion one-at-a-time="true">
113
+ <panel v-for="(i,item) in data.onetomany" :header="item.title" :is-open="false" type="primary">
114
+ <app-onetomany :onetomany="item" :index="i"></app-onetomany>
115
+ </panel>
116
+ <panel v-for="(i,item) in data.components" :header="item.title" :is-open="false" type="primary" v-if="item.device === 'app' || !item.device">
117
+ <component :is="item.name" :selectdata="data" :mark="item.mark"></component>
118
+ </panel>
119
+ </accordion>
120
+ </div>
121
+
122
+ <!--自定义组件-->
123
+ <slot></slot>
124
+
125
+ <!-- 按钮组 -->
126
+ <div class="text-center">
127
+ <button v-for="(index,button) in data.buttons"
128
+ :disabled="button.disabled && disable_button"
129
+ style="min-width:100px"
130
+ :class="button.disabled && disable_button ? 'btn btn-default button_spacing' : 'btn btn-primary button_spacing'"
131
+ v-if="!button.hidden"
132
+ @click.prevent="click_but(button)"
133
+ >
134
+ {{button.button_name}}
135
+ </button>
136
+ </div>
137
+
138
+ <!-- 按钮模态框 -->
139
+ <modal v-if="showButModal" :show.sync="showButModal" backdrop="false" large>
140
+ <header slot="modal-header" class="modal-header">
141
+ <button type="button" class="close" @click="closeModal()"><span>&times;</span></button>
142
+ <span class="modal-title"><font
143
+ size="3">{{data.button.button_name}}</font></span>
144
+ </header>
145
+ <article slot="modal-body" class="modal-body clearfix">
146
+ <div class="form-group" >
147
+ <div v-for="(index,item) in data.button.button_fields">
148
+ <div :style="item.style ? item.style : ''" :class="[item.required && !(item.value) ? 'has-error' : '', item.bootstraped ? item.bootstraped + ' form-group' : 'form-group']"
149
+ v-if="(item.type==='input' || item.type==='number'||item.type === 'tel'||item.type === 'email') && !item.hidden && (item.device === 'pc' || !item.device)">
150
+ <label :style="item.label_style ? item.label_style : ''"
151
+ :class="item.label_bootstraped ? item.label_bootstraped + ' control-label-justify control-label' : 'control-label-justify control-label'">{{item.label}}</label>
152
+ <div :style="item.value_style ? item.value_style : ''"
153
+ :class="item.value_bootstraped ? item.value_bootstraped : 'col-xs-8'">
154
+ <input class="form-control input_view"
155
+ :placeholder="item.placeholder"
156
+ :type="item.type"
157
+ v-model="item.value"
158
+ :value="item.value"
159
+ :readonly="item.readonly"
160
+ :disabled="item.disabled"
161
+ @change="onbutchange(index)"
162
+ @blur="onbutblur(index)"
163
+ @input="onbutinput(index)"
164
+ />
165
+ </div>
166
+ </div>
167
+
168
+ <!--时间datepicker-->
169
+ <div :style="item.style ? item.style : ''" :class="[item.required && !(item.value) ? 'has-error' : '', item.bootstraped ? item.bootstraped + ' form-group':'form-group']"
170
+ v-if="item.type==='datepicker' && !item.hidden && (item.device === 'pc' || !item.device)">
171
+ <label :style="item.label_style ? item.label_style : ''"
172
+ :class="item.label_bootstraped ? item.label_bootstraped + ' control-label-justify control-label' : 'control-label-justify control-label'">{{item.label}}</label>
173
+ <div :style="item.value_style ? item.value_style : ''"
174
+ :class="item.value_bootstraped ? item.value_bootstraped : 'col-xs-8'">
175
+ <datepicker
176
+ :placeholder="item.placeholder"
177
+ :value.sync="item.value"
178
+ v-model="item.value"
179
+ :readonly="item.readonly"
180
+ :disabled="item.disabled"
181
+ :format="item.format ? item.format : 'yyyy-MM-dd'"
182
+ :show-reset-button="true"
183
+ @change="onbutchange(index)"
184
+ @blur="onbutblur(index)"
185
+ ></datepicker>
186
+ </div>
187
+ </div>
188
+
189
+ <!--select-->
190
+ <div :style="item.style ? item.style : ''" :class="[item.required && !(item.value) ? 'has-error' : '', item.bootstraped ? item.bootstraped + ' form-group':'form-group']"
191
+ v-if="item.type==='select' && !item.hidden && (item.device === 'pc' || !item.device)">
192
+ <label :style="item.label_style ? item.label_style : ''"
193
+ :class="item.label_bootstraped ? item.label_bootstraped + ' control-label-justify control-label' : 'control-label-justify control-label'">{{item.label}}</label>
194
+ <div :style="item.value_style ? item.value_style : ''"
195
+ :class="item.value_bootstraped ? item.value_bootstraped : 'col-xs-8'">
196
+ <input-select
197
+ class="select select_list"
198
+ :value.sync="item.value"
199
+ v-model="item.value"
200
+ :options='item.options'
201
+ :readonly="item.readonly"
202
+ :disable="item.disabled"
203
+ :valueSingle="true"
204
+ @blur="onbutblur(index)"
205
+ @change="onbutchange(index)"
206
+ ></input-select>
207
+ </div>
208
+ </div>
209
+
210
+ <!--textarea-->
211
+ <div :style="item.style ? item.style : ''" :class="[item.required && !(item.value) ? 'has-error' : '', item.bootstraped ? item.bootstraped + ' form-group':'form-group']"
212
+ v-if="item.type==='textarea' && !item.hidden && (item.device === 'pc' || !item.device)">
213
+ <label :style="item.label_style ? item.label_style : ''"
214
+ :class="item.label_bootstraped ? item.label_bootstraped + ' control-label-justify control-label' : 'control-label-justify control-label'">{{item.label}}</label>
215
+ <div :style="item.value_style ? item.value_style : ''"
216
+ :class="item.value_bootstraped ? item.value_bootstraped : 'col-xs-8'">
217
+ <textarea
218
+ class="form-control input_view"
219
+ style="width: 100%;height: 100%"
220
+ v-model="item.value"
221
+ :value="item.value"
222
+ :rows="item.rows"
223
+ :readonly="item.readonly"
224
+ :disabled="item.disabled"
225
+ @change="onbutchange(index)"
226
+ @blur="onbutblur(index)"
227
+ @input="onbutinput(index)"
228
+ ></textarea>
229
+ </div>
230
+ </div>
231
+ </div>
232
+ </div>
233
+ </article>
234
+ <footer slot="modal-footer" class="modal-footer">
235
+ <button :class="disable_modal_button ? 'btn btn-default':'btn btn-primary'"
236
+ :disabled="disable_modal_button" type="button" @click="confirmModal()">
237
+ 确认
238
+ </button>
239
+ </footer>
240
+ </modal>
241
+ </div>
242
+ </template>
243
+ <script>
244
+ import Vue from 'vue'
245
+ import {isEmpty} from "../Util";
246
+ // Date格式化
247
+ Date.prototype.Format = function (fmt) {
248
+ var o = {
249
+ 'M+': this.getMonth() + 1, // 月份
250
+ 'd+': this.getDate(), // 日
251
+ 'H+': this.getHours(), // 小时
252
+ 'm+': this.getMinutes(), // 分
253
+ 's+': this.getSeconds(), // 秒
254
+ 'q+': Math.floor((this.getMonth() + 3) / 3), // 季度
255
+ 'S': this.getMilliseconds() // 毫秒
256
+ }
257
+ if (/(y+)/.test(fmt)) fmt = fmt.replace(RegExp.$1, (this.getFullYear() + '').substr(4 - RegExp.$1.length))
258
+ for (var k in o) {
259
+ if (new RegExp('(' + k + ')').test(fmt)) fmt = fmt.replace(RegExp.$1, (RegExp.$1.length === 1) ? (o[k]) : (('00' + o[k]).substr(('' + o[k]).length)))
260
+ }
261
+ return fmt
262
+ }
263
+
264
+ export default {
265
+ title: '报建业务通用组件',
266
+ props: {
267
+ data: {
268
+ type: Object
269
+ },
270
+ showprint: {
271
+ type: Boolean,
272
+ default: true
273
+ }
274
+ },
275
+ data () {
276
+ return {
277
+ model: {}, // 公司等属性
278
+ disable_button: true, // 控制按钮禁用
279
+ disable_modal_button: true, // 控制按钮禁用
280
+ showButModal: false
281
+ }
282
+ },
283
+ watch: {
284
+ deep: true
285
+ },
286
+ computed: {
287
+
288
+ },
289
+ created () {
290
+ // 初始化数据
291
+ this.initializtion()
292
+ if (this.data.readyEvent) {
293
+ this.$dispatch(this.data.readyEvent)
294
+ }
295
+ this.$dispatch('initializtionView')
296
+ },
297
+ methods: {
298
+ // 初始化数据
299
+ initializtion () {
300
+ for (const item of this.data.fields) {
301
+ this.data[item.field] = item.value
302
+ }
303
+ // 是否禁用按钮
304
+ this.disableButton()
305
+ },
306
+ // 是否禁用按钮
307
+ disableButton () {
308
+ let flag = false
309
+
310
+ for (const field of this.data.fields) {
311
+ if (field.required && !field.value && !field.hidden && field.value !== 0) {
312
+ flag = true
313
+ }
314
+
315
+ // 任何选择框只要是否都不能提交
316
+ if (field.type === 'select' && field.value === '否' && field.value_no_disable) {
317
+ flag = true
318
+ }
319
+
320
+ if (field.type === 'checkbox' && field.required && field.value.length === 0) {
321
+ flag = true
322
+ }
323
+ }
324
+
325
+ this.disable_button = flag
326
+ },
327
+ // 失去焦点且值最终发生变化触发
328
+ async onchange (index) {
329
+ // 是否禁用按钮
330
+ this.disableButton()
331
+
332
+ if (!isEmpty(this.data.fields[index].value)) {
333
+ // 前缀、后缀
334
+ if (this.data.fields[index].prefix) {
335
+ this.data.fields[index].value = this.data.fields[index].prefix + this.data.fields[index].value
336
+ }
337
+ if (this.data.fields[index].suffix) {
338
+ this.data.fields[index].value = this.data.fields[index].value + this.data.fields[index].suffix
339
+ }
340
+ }
341
+
342
+ // data赋值
343
+ this.data[this.data.fields[index].field] = this.data.fields[index].value
344
+
345
+ if (this.data.fields[index].type === 'datepicker') {
346
+ this.check_datepicker(index)
347
+ }
348
+
349
+ if (this.data.fields[index].onchange) {
350
+ this.$dispatch(this.data.fields[index].onchange, index)
351
+ }
352
+ this.$dispatch('onchange', index)
353
+
354
+
355
+ },
356
+ // 失去焦点触发，无论值是否发生变化
357
+ onblur (index) {
358
+ this.disableButton()
359
+
360
+ if (this.data.fields[index].onblur) {
361
+ this.$dispatch(this.data.fields[index].onblur, index)
362
+ }
363
+
364
+ this.$dispatch('onblur', index)
365
+ },
366
+ oninput (index) {
367
+ // 是否禁用按钮
368
+ this.disableButton()
369
+
370
+ if (this.data.fields[index].oninput) {
371
+ this.$dispatch(this.data.fields[index].oninput, index)
372
+ }
373
+ this.$dispatch('oninput', index)
374
+ },
375
+ // 点击按钮组按钮
376
+ async click_but (button) {
377
+ if (this.data.defname === '通气点火') {
378
+
379
+ this.$showMessage(`请确认表号是否正确`).then((res) => {
380
+
381
+
382
+ this.disable_button = true
383
+
384
+ this.data.fields.forEach(item => {
385
+ this.data[item.field] = item.value
386
+ })
387
+
388
+ this.data.button = button
389
+
390
+ if (button.button_fields && button.button_fields.length > 0) {
391
+ this.showButModal = true
392
+ return
393
+ }
394
+
395
+ if (this.data.button.event) {
396
+ this.$dispatch(this.data.button.event)
397
+ } else {
398
+ this.$dispatch('button')
399
+ }
400
+
401
+ })
402
+
403
+ }
404
+ else{
405
+ this.disable_button = true
406
+
407
+ this.data.fields.forEach(item => {
408
+ this.data[item.field] = item.value
409
+ })
410
+
411
+ this.data.button = button
412
+
413
+ if (button.button_fields && button.button_fields.length > 0) {
414
+ this.showButModal = true
415
+ return
416
+ }
417
+
418
+ if (this.data.button.event) {
419
+ this.$dispatch(this.data.button.event)
420
+ } else {
421
+ this.$dispatch('button')
422
+ }
423
+ }
424
+ },
425
+ confirmModal () {
426
+ this.closeModal()
427
+
428
+ this.data.button.button_fields.forEach(item => {
429
+ this.data.button[item.field] = item.value
430
+ })
431
+
432
+ if (this.data.button.event) {
433
+ this.$dispatch(this.data.button.event)
434
+ } else {
435
+ this.$dispatch('button')
436
+ }
437
+ },
438
+ // 关闭模态框
439
+ closeModal () {
440
+ this.showButModal = false
441
+ this.disable_modal_button = true
442
+ },
443
+ onbutchange (index) {
444
+ // 是否禁用按钮
445
+ this.disableModalButton()
446
+
447
+ if (this.data.button.button_fields[index].onchange) {
448
+ this.$dispatch(this.data.button.button_fields[index].onchange, index)
449
+ } else {
450
+ this.$dispatch('onbutchange', index)
451
+ }
452
+
453
+ },
454
+ onbutblur (index) {
455
+ this.disableModalButton()
456
+
457
+ if (this.data.button.button_fields[index].onblur) {
458
+ this.$dispatch(this.data.button.button_fields[index].onblur, index)
459
+ } else {
460
+ this.$dispatch('onbutblur', index)
461
+ }
462
+ },
463
+ onbutinput (index) {
464
+ // 是否禁用按钮
465
+ this.disableModalButton()
466
+
467
+ if (this.data.button.button_fields[index].oninput) {
468
+ this.$dispatch(this.data.button.button_fields[index].oninput, index)
469
+ } else {
470
+ this.$dispatch('onbutinput', index)
471
+ }
472
+ },
473
+ disableModalButton () {
474
+ let flag = false
475
+
476
+
477
+ for (const item of this.data.button.button_fields) {
478
+ if (item.required && !item.value) {
479
+ if (item.value === 0) {
480
+ flag = false
481
+ } else {
482
+ flag = true
483
+ }
484
+ }
485
+ }
486
+
487
+ this.disable_modal_button = flag
488
+ },
489
+ check_datepicker (index) {
490
+ // 时间格式检测
491
+ if (!isEmpty(this.data.fields[index].value)) {
492
+
493
+ let dateReg = /^[1-9]\d{3}-(0[1-9]|1[0-2])-(0[1-9]|[1-2][0-9]|3[0-1])$/
494
+ let timeReg = /^(20|21|22|23|[0-1]\d):[0-5]\d:[0-5]\d$/
495
+ let datetimeReg = /^[1-9]\d{3}-(0[1-9]|1[0-2])-(0[1-9]|[1-2][0-9]|3[0-1])\s+(20|21|22|23|[0-1]\d):[0-5]\d:[0-5]\d$/
496
+ if (this.data.fields[index].format) {
497
+ if (this.data.fields[index].format === 'yyyy-MM-dd') {
498
+ if (!dateReg.test(this.data.fields[index].value)) {
499
+ this.data.fields[index].value = ''
500
+ this.$showAlert(this.data.fields[index].label + '格式错误如：2021-01-01', 'warning', 2000)
501
+ }
502
+ }
503
+ if (this.data.fields[index].format === 'HH:mm:ss') {
504
+ if (!timeReg.test(this.data.fields[index].value)) {
505
+ this.data.fields[index].value = ''
506
+ this.$showAlert(this.data.fields[index].label + '格式错误如：00:00:00', 'warning', 2000)
507
+ }
508
+ }
509
+ if (this.data.fields[index].format === 'yyyy-MM-dd HH:mm:ss') {
510
+ if (!datetimeReg.test(this.data.fields[index].value)) {
511
+ this.data.fields[index].value = ''
512
+ this.$showAlert(this.data.fields[index].label + '格式错误如：2021-01-01 00:00:00', 'warning', 2000)
513
+ }
514
+ }
515
+ } else {
516
+ if (!dateReg.test(this.data.fields[index].value)) {
517
+ this.data.fields[index].value = ''
518
+ this.$showAlert(this.data.fields[index].label + '格式错误如：2021-01-01', 'warning', 2000)
519
+ }
520
+ }
521
+ }
522
+ }
523
+ },
524
+ events: {
525
+ }
526
+ }
527
+ </script>
528
+ <style scoped>
529
+ .control-label-justify {
530
+ width: 30%;
531
+ text-align: justify;
532
+ text-align-last: justify;
533
+ font-family: PingFang-SC-Bold;
534
+ float: left;
535
+ }
536
+ .button_spacing{margin: 0px 0px 0px 10px;}
537
+ </style>
538
+ <style lang="less">
539
+ .apply-has-error {
540
+ border-bottom: 1px solid #a94442;
541
+ }
542
+ .app-input {
543
+ label {
544
+ float: left;
545
+ }
546
+ .select {
547
+ button {
548
+ border: none;
549
+ outline: none;
550
+ text-align: left;
551
+ .btn-placeholder {
552
+ color: #ACA899
553
+ }
554
+ }
555
+ }
556
+ .datepicker {
557
+ .form-control:focus {
558
+ border: none!important;
559
+ outline: none!important;
560
+ -webkit-box-shadow: none;
561
+ box-shadow: none;
562
+ }
563
+ }
564
+ textarea {
565
+ padding: 8px 10px;
566
+ border: none;
567
+ outline: none;
568
+ margin: 0px;
569
+ }
570
+ input[readonly]{
571
+ color: #ACA899!important;
572
+ background: #FFFFFF;
573
+ border: none;
574
+ outline: none;
575
+ }
576
+ input:disabled{
577
+ color: #ACA899!important;
578
+ background: #FFFFFF;
579
+ border: none;
580
+ outline: none;
581
+ }
582
+ textarea[readonly]{
583
+ color: #ACA899!important;
584
+ background: #FFFFFF;
585
+ border: none;
586
+ outline: none;
587
+ }
588
+ textarea:disabled{
589
+ color: #ACA899!important;
590
+ background: #FFFFFF;
591
+ border: none;
592
+ outline: none;
593
+ }
594
+ }
595
+ </style>