apply-clients 3.3.101 → 3.3.104

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 (7) hide show
  1. package/package.json +1 -1
  2. package/src/components/android/AppOnetomany.vue +32 -45
  3. package/src/components/android/AppServiceView.vue +732 -752
  4. package/src/components/android/AreaSelect/AppResAreaSelectGroup.vue +9 -3
  5. package/src/components/android/Process/Processes/AppDevicesManagement.vue +513 -508
  6. package/src/components/android/Supervisory/AppSupervisoryCart.vue +1 -1
  7. package/src/components/product/Onetomany.vue +31 -44
package/src/components/android/AppServiceView.vue CHANGED
@@ -1,752 +1,732 @@
1
- <template>
2
- <div class="form-horizontal select-overspread">
3
- <validator name='v' @valid="$emit('valid')" @invalid="$emit('invalid')">
4
- <form>
5
- <div v-for="(index,item) in data.fields">
6
- <!--input-->
7
- <div :style="item.style ? item.style : ''"
8
- v-if="(item.type==='input' || item.type==='number'||item.type === 'tel'||item.type === 'email') && !item.hidden && (item.device === 'app' || !item.device) && (item.label != '证件号码')&&(item.label != '身份证') && (item.label != '用户电话')"
9
- :class="[item.required && !(item.value) ? 'apply-has-error' : '', item.bootstraped ? item.bootstraped + ' form-group app-input':'col-xs-12 form-group app-input']">
10
- <label class="control-label-justify">{{item.label}}</label>
11
- <div :style="item.value_style ? item.value_style:''"
12
- :class="item.value_bootstraped ? item.value_bootstraped : 'col-xs-8'">
13
- <input class="" style="width: 100%"
14
- :type="item.type"
15
- v-model="data.fields[index].value"
16
- :placeholder="item.placeholder"
17
- :value="data.fields[index].value"
18
- :readonly="item.readonly"
19
- :disabled="item.disabled"
20
- @change="onchange(index)"
21
- @blur="onblur(index)"
22
- @input="oninput(index)"
23
- />
24
- </div>
25
- </div>
26
-
27
- <div :style="item.style ? item.style : ''"
28
- v-if="(data.fields[index-1].value ==='营业执照'||data.fields[index-1].value ==='军官证')&& (item.label === '证件号码')"
29
- :class="[item.required && !(item.value) ? 'apply-has-error' : '', item.bootstraped ? item.bootstraped + ' form-group app-input':'col-xs-12 form-group app-input']">
30
- <label class="control-label-justify">{{item.label}}</label>
31
- <div :style="item.value_style ? item.value_style:''"
32
- :class="item.value_bootstraped ? item.value_bootstraped : 'col-xs-8'">
33
- <input class="" style="width: 100%"
34
- :type="item.type"
35
- v-model="data.fields[index].value"
36
- :placeholder="item.placeholder"
37
- :value="data.fields[index].value"
38
- :readonly="item.readonly"
39
- :disabled="item.disabled"
40
- @change="onchange(index)"
41
- @blur="onblur(index)"
42
- @input="oninput(index)"
43
- />
44
- </div>
45
- </div>
46
-
47
-
48
- <!--input身份证验证-->
49
- <div :style="item.style ? item.style : ''"
50
- v-if="(item.label==='身份证') || (item.label === '证件号码' && data.fields[index-1].value ==='身份证')"
51
- :class="[$v.f_idnumber2.identityCardValid ? '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 :style="item.value_style ? item.value_style:''"
54
- :class="item.value_bootstraped ? item.value_bootstraped : 'col-xs-8'">
55
- <input class="" style="width: 100%"
56
- :type="item.type"
57
- maxlength="18"
58
- v-model="data.fields[index].value"
59
- :placeholder="item.placeholder"
60
- :value="data.fields[index].value"
61
- onKeypress="return(/[\d\.]/.test(String.fromCharCode(event.keyCode)))"
62
- :readonly="item.readonly"
63
- v-validate:f_idnumber2='{identityCardValid: true}'
64
- @change="onchange(index)"
65
- @blur="onblur(index)"
66
- @input="oninput(index)"
67
- />
68
- </div>
69
- </div>
70
-
71
-
72
- <!--input手机号验证-->
73
- <div :style="item.style ? item.style : ''"
74
- v-if="item.label === '用户电话'"
75
- :class="[$v.f_user_phone.minlength || $v.f_user_phone.maxlength ? 'apply-has-error' : '',item.bootstraped ? item.bootstraped + ' form-group app-input':'col-xs-12 form-group app-input']">
76
- <label class="control-label-justify">{{item.label}}</label>
77
- <div :style="item.value_style ? item.value_style:''"
78
- :class="item.value_bootstraped ? item.value_bootstraped : 'col-xs-8'">
79
- <input class="" style="width: 100%"
80
- maxlength="18"
81
- type="number"
82
- onKeypress="return(/[\d\.]/.test(String.fromCharCode(event.keyCode)))"
83
- oninput="if(value.length > 11) value=value.slice(0,11)"
84
- v-validate:f_user_phone="{minlength: 7, maxlength: 11 }"
85
- v-model="data.fields[index].value"
86
- :placeholder="item.placeholder"
87
- :value="data.fields[index].value"
88
- :readonly="item.readonly"
89
- @change="onchange(index)"
90
- @blur="onblur(index)"
91
- @input="oninput(index)"
92
- />
93
- </div>
94
- </div>
95
-
96
- <!--select-->
97
- <div :style="item.style ? item.style : ''"
98
- v-if="item.type==='select' && !item.hidden && (item.device === 'app' || !item.device)"
99
- :class="[item.required && !(item.value) ? 'apply-has-error' : '', item.bootstraped ? item.bootstraped + ' form-group app-input':'col-xs-12 form-group app-input']">
100
- <label class="control-label-justify">{{item.label}}</label>
101
- <div :style="item.value_style ? item.value_style:''"
102
- :class="item.value_bootstraped ? item.value_bootstraped : 'col-xs-8'">
103
- <v-select
104
- class="select" width="100%" align="right"
105
- :placeholder="item.placeholder"
106
- :search="item.search"
107
- close-on-select value-single
108
- @select-search="selectSearch($arguments,index)"
109
- :options="data.fields[index].options"
110
- v-model="data.fields[index].value"
111
- :value.sync="data.fields[index].value"
112
- @blur="onblur(index)"
113
- @change="onchange(index)"
114
- :readonly="item.readonly"
115
- :disabled="item.disabled"
116
- ></v-select>
117
- </div>
118
- </div>
119
-
120
- <!--时间datepicker-->
121
- <div :style="item.style ? item.style : ''"
122
- v-if="item.type==='datepicker' && !item.hidden && (item.device === 'app' || !item.device)"
123
- :class="[item.required && !(item.value) ? 'apply-has-error' : '', item.bootstraped ? item.bootstraped+' form-group app-input':'col-xs-12 form-group app-input']">
124
- <label class="control-label-justify">{{item.label}}</label>
125
- <div class="form-group" :style="item.value_style ? item.value_style:''"
126
- :class="item.value_bootstraped ? item.value_bootstraped : 'col-xs-8'">
127
- <datepicker
128
- @change="onchange(index)"
129
- @blur="onblur(index)"
130
- :placeholder="item.placeholder"
131
- :value.sync="data.fields[index].value"
132
- :format="item.format ? item.format : 'yyyy-MM-dd'"
133
- v-model="data.fields[index].value"
134
- :readonly="item.readonly"
135
- :disabled="item.disabled"
136
- :show-reset-button="true">
137
- </datepicker>
138
- </div>
139
- </div>
140
-
141
- <!--textarea-->
142
- <div :style="item.style ? item.style : ''"
143
- v-if="item.type==='textarea' && !item.hidden && (item.device === 'app' || !item.device)"
144
- :class="[item.required && !(item.value) ? 'apply-has-error' : '', item.bootstraped?item.bootstraped+' form-group app-input':'col-xs-12 form-group app-input']">
145
- <label class="control-label-justify">{{item.label}}</label>
146
- <div :style="item.value_style ? item.value_style:''"
147
- :class="item.value_bootstraped ? item.value_bootstraped : 'col-xs-8'">
148
- <textarea
149
- :readonly="item.readonly"
150
- :disabled="item.disabled"
151
- class="" rows="1"
152
- style="width: 100%;height: 100%"
153
- v-model="data.fields[index].value"
154
- :value="data.fields[index].value"
155
- @change="onchange(index)"
156
- @blur="onblur(index)"
157
- @input="oninput(index)"
158
- ></textarea>
159
- </div>
160
- </div>
161
-
162
- <!--checkbox-->
163
- <div :style="item.style ? item.style : ''"
164
- v-if="item.type==='checkbox' && !item.hidden && (item.device === 'app' || !item.device)"
165
- :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']">
166
- <label class="control-label-justify">{{item.label}}</label>
167
- <div :style="item.value_style ? item.value_style:''"
168
- :class="item.value_bootstraped ? item.value_bootstraped : 'col-xs-8'">
169
- <label class="" v-for="(index2,row) in item.options">
170
- <input type="checkbox" class=""
171
- :readonly="data.fields[index].readonly"
172
- :disabled="data.fields[index].disabled"
173
- v-model="data.fields[index].value"
174
- :value="data.fields[index].options[index2].value"
175
- @change="onchange(index)"
176
- @blur="onblur(index)">
177
- {{row.label}}
178
- </label>
179
- </div>
180
- </div>
181
- </div>
182
- <!--区域地址联动-->
183
- <!--<div>-->
184
- <!-- <app-res-area-select-group-->
185
- <!-- v-if="data.f_apply_type === '报警器报建' && data.defname === '工程施工' && data.title === '工程施工' && data.f_sub_state !='完工'"-->
186
- <!-- labelstyle = "control-label"-->
187
- <!-- @shiji-select = "getSelectShijiValue"-->
188
- <!-- @xian-select = "getSelectXianValue"-->
189
- <!-- @shequ-select = "getSelectShequValue"-->
190
- <!-- >-->
191
- <!-- </app-res-area-select-group>-->
192
- <!--</div>-->
193
- <div class="col-sm-12 col-xs-12" id="test11">
194
- <accordion one-at-a-time="true">
195
- <panel v-for="(i,item) in data.onetomany" :header="item.title" :is-open="false" type="primary">
196
- <app-onetomany :onetomany="item" :index="i" :selectdata="data"></app-onetomany>
197
- </panel>
198
- <panel v-for="(i,item) in data.components" :header="item.title" :is-open="false" type="primary" v-if="item.device === 'app' || !item.device">
199
- <component :is="item.name" :selectdata="data" :mark="item.mark"></component>
200
- </panel>
201
- </accordion>
202
- </div>
203
-
204
- <!--自定义组件-->
205
- <slot>
206
- <div>
207
- <app-res-area-select-group
208
- v-if="data.f_apply_type === '报警器报建' && data.defname === '工程施工' && data.title === '工程施工' && data.f_sub_state !='完工'"
209
- labelstyle = "control-label"
210
- @shiji-select = "getSelectShijiValue"
211
- @xian-select = "getSelectXianValue"
212
- @shequ-select = "getSelectShequValue"
213
- >
214
- </app-res-area-select-group>
215
- </div>
216
- </slot>
217
-
218
- <!-- 按钮组 -->
219
- <div class="text-center">
220
- <button v-for="(index,button) in data.buttons"
221
- :disabled="button.disabled && disable_button"
222
- style="min-width:100px"
223
- :class="button.disabled && disable_button ? 'btn btn-default button_spacing' : 'btn btn-primary button_spacing'"
224
- v-if="!button.hidden && button.button_name !=='提交'&& button.button_name !=='确认'"
225
- @click.prevent="click_but(button)"
226
- >
227
- {{button.button_name}}
228
- </button>
229
- <button v-for="(index,button) in data.buttons"
230
- :disabled="(button.disabled && disable_button) || (!$v.valid)"
231
- style="min-width:100px"
232
- :class="button.disabled && disable_button || (!$v.valid) ? 'btn btn-default button_spacing' : 'btn btn-primary button_spacing'"
233
- v-if="!button.hidden && (button.button_name ==='提交'||button.button_name ==='确认')"
234
- @click.prevent="click_but(button)"
235
- >
236
- {{button.button_name}}
237
- </button>
238
- </div>
239
-
240
- <!-- 按钮模态框 -->
241
- <modal v-if="showButModal" :show.sync="showButModal" backdrop="false" large>
242
- <header slot="modal-header" class="modal-header">
243
- <button type="button" class="close" @click="closeModal()"><span>&times;</span></button>
244
- <span class="modal-title"><font
245
- size="3">{{data.button.button_name}}</font></span>
246
- </header>
247
- <article slot="modal-body" class="modal-body clearfix">
248
- <div class="form-group" >
249
- <div v-for="(index,item) in data.button.button_fields">
250
- <div :style="item.style ? item.style : ''" :class="[item.required && !(item.value) ? 'has-error' : '', item.bootstraped ? item.bootstraped + ' form-group' : 'form-group']"
251
- v-if="(item.type==='input' || item.type==='number'||item.type === 'tel'||item.type === 'email') && !item.hidden && (item.device === 'pc' || !item.device)">
252
- <label :style="item.label_style ? item.label_style : ''"
253
- :class="item.label_bootstraped ? item.label_bootstraped + ' control-label-justify control-label' : 'control-label-justify control-label'">{{item.label}}</label>
254
- <div :style="item.value_style ? item.value_style : ''"
255
- :class="item.value_bootstraped ? item.value_bootstraped : 'col-xs-8'">
256
- <input class="form-control input_view"
257
- :placeholder="item.placeholder"
258
- :type="item.type"
259
- v-model="item.value"
260
- :value="item.value"
261
- :readonly="item.readonly"
262
- :disabled="item.disabled"
263
- @change="onbutchange(index)"
264
- @blur="onbutblur(index)"
265
- @input="onbutinput(index)"
266
- />
267
- </div>
268
- </div>
269
-
270
- <!--时间datepicker-->
271
- <div :style="item.style ? item.style : ''" :class="[item.required && !(item.value) ? 'has-error' : '', item.bootstraped ? item.bootstraped + ' form-group':'form-group']"
272
- v-if="item.type==='datepicker' && !item.hidden && (item.device === 'pc' || !item.device)">
273
- <label :style="item.label_style ? item.label_style : ''"
274
- :class="item.label_bootstraped ? item.label_bootstraped + ' control-label-justify control-label' : 'control-label-justify control-label'">{{item.label}}</label>
275
- <div :style="item.value_style ? item.value_style : ''"
276
- :class="item.value_bootstraped ? item.value_bootstraped : 'col-xs-8'">
277
- <datepicker
278
- :placeholder="item.placeholder"
279
- :value.sync="item.value"
280
- v-model="item.value"
281
- :readonly="item.readonly"
282
- :disabled="item.disabled"
283
- :format="item.format ? item.format : 'yyyy-MM-dd'"
284
- :show-reset-button="true"
285
- @change="onbutchange(index)"
286
- @blur="onbutblur(index)"
287
- ></datepicker>
288
- </div>
289
- </div>
290
-
291
- <!--select-->
292
- <div :style="item.style ? item.style : ''" :class="[item.required && !(item.value) ? 'has-error' : '', item.bootstraped ? item.bootstraped + ' form-group':'form-group']"
293
- v-if="item.type==='select' && !item.hidden && (item.device === 'pc' || !item.device)">
294
- <label :style="item.label_style ? item.label_style : ''"
295
- :class="item.label_bootstraped ? item.label_bootstraped + ' control-label-justify control-label' : 'control-label-justify control-label'">{{item.label}}</label>
296
- <div :style="item.value_style ? item.value_style : ''"
297
- :class="item.value_bootstraped ? item.value_bootstraped : 'col-xs-8'">
298
- <input-select
299
- class="select select_list"
300
- :value.sync="item.value"
301
- v-model="item.value"
302
- :options='item.options'
303
- :readonly="item.readonly"
304
- :disable="item.disabled"
305
- :valueSingle="true"
306
- @blur="onbutblur(index)"
307
- @change="onbutchange(index)"
308
- ></input-select>
309
- </div>
310
- </div>
311
-
312
- <!--textarea-->
313
- <div :style="item.style ? item.style : ''" :class="[item.required && !(item.value) ? 'has-error' : '', item.bootstraped ? item.bootstraped + ' form-group':'form-group']"
314
- v-if="item.type==='textarea' && !item.hidden && (item.device === 'pc' || !item.device)">
315
- <label :style="item.label_style ? item.label_style : ''"
316
- :class="item.label_bootstraped ? item.label_bootstraped + ' control-label-justify control-label' : 'control-label-justify control-label'">{{item.label}}</label>
317
- <div :style="item.value_style ? item.value_style : ''"
318
- :class="item.value_bootstraped ? item.value_bootstraped : 'col-xs-8'">
319
- <textarea
320
- class="form-control input_view"
321
- style="width: 100%;height: 100%"
322
- v-model="item.value"
323
- :value="item.value"
324
- :rows="item.rows"
325
- :readonly="item.readonly"
326
- :disabled="item.disabled"
327
- @change="onbutchange(index)"
328
- @blur="onbutblur(index)"
329
- @input="onbutinput(index)"
330
- ></textarea>
331
- </div>
332
- </div>
333
- </div>
334
- </div>
335
- </article>
336
- <footer slot="modal-footer" class="modal-footer">
337
- <button :class="disable_modal_button ? 'btn btn-default':'btn btn-primary'"
338
- :disabled="disable_modal_button" type="button" @click="confirmModal()">
339
- 确认
340
- </button>
341
- </footer>
342
- </modal>
343
- </form>
344
- </div>
345
- </template>
346
- <script>
347
- import Vue from 'vue'
348
- import {isEmpty} from "../Util";
349
- // Date格式化
350
- Date.prototype.Format = function (fmt) {
351
- var o = {
352
- 'M+': this.getMonth() + 1, // 月份
353
- 'd+': this.getDate(), // 日
354
- 'H+': this.getHours(), // 小时
355
- 'm+': this.getMinutes(), // 分
356
- 's+': this.getSeconds(), // 秒
357
- 'q+': Math.floor((this.getMonth() + 3) / 3), // 季度
358
- 'S': this.getMilliseconds() // 毫秒
359
- }
360
- if (/(y+)/.test(fmt)) fmt = fmt.replace(RegExp.$1, (this.getFullYear() + '').substr(4 - RegExp.$1.length))
361
- for (var k in o) {
362
- if (new RegExp('(' + k + ')').test(fmt)) fmt = fmt.replace(RegExp.$1, (RegExp.$1.length === 1) ? (o[k]) : (('00' + o[k]).substr(('' + o[k]).length)))
363
- }
364
- return fmt
365
- }
366
-
367
- export default {
368
- title: '报建业务通用组件',
369
- props: {
370
- data: {
371
- type: Object
372
- },
373
- showprint: {
374
- type: Boolean,
375
- default: true
376
- }
377
- },
378
- data () {
379
- return {
380
- model: {}, // 公司等属性
381
- disable_button: true, // 控制按钮禁用
382
- disable_modal_button: true, // 控制按钮禁用
383
- showButModal: false,
384
- areaData:{
385
- sjvalue:'',
386
- xianvalue:'',
387
- sqvalue:'',
388
- }
389
- }
390
- },
391
- watch: {
392
- deep: true
393
- },
394
- computed: {
395
-
396
- },
397
- created () {
398
- // 初始化数据
399
- this.initializtion()
400
- if (this.data.readyEvent) {
401
- this.$dispatch(this.data.readyEvent)
402
- }
403
- this.$dispatch('initializtionView')
404
- },
405
- methods: {
406
- // 初始化数据
407
- initializtion () {
408
- for (const item of this.data.fields) {
409
- this.data[item.field] = item.value
410
- }
411
- // 是否禁用按钮
412
- this.disableButton()
413
- },
414
- async getSelectShijiValue(sjvalue,sjlable) {
415
-
416
- this.areaData.sjvalue = sjvalue
417
- console.log("这是父级接收的市级值:",sjvalue,sjlable)
418
- this.data.areaData = this.areaData
419
- console.log(this.areaData)
420
- // 是否禁用按钮
421
- this.disableButton()
422
- },
423
- async getSelectXianValue(xianvalue,xianlable) {
424
-
425
- this.areaData.xianvalue = xianvalue
426
- this.data.areaData = this.areaData
427
- console.log("这是父级接收的县级值:",xianvalue,xianlable)
428
- console.log(this.areaData)
429
-
430
- // 是否禁用按钮
431
- this.disableButton()
432
- },
433
- async getSelectShequValue(sqvalue,sqlable) {
434
- this.areaData.sqvalue = sqvalue
435
- this.data.areaData = this.areaData
436
- console.log(this.areaData)
437
- console.log("这是父级接收的社区值:",sqvalue,sqlable)
438
-
439
- // 是否禁用按钮
440
- this.disableButton()
441
- },
442
- // 是否禁用按钮
443
- disableButton () {
444
- let flag = false
445
-
446
- for (const field of this.data.fields) {
447
- if (field.required && !field.value && !field.hidden && field.value !== 0) {
448
- flag = true
449
- }
450
-
451
- // 任何选择框只要是否都不能提交
452
- if (field.type === 'select' && field.value === '否' && field.value_no_disable) {
453
- flag = true
454
- }
455
-
456
- if (field.type === 'checkbox' && field.required && field.value.length === 0) {
457
- flag = true
458
- }
459
- }
460
-
461
- //区域下拉框必选 流程模式为报警器报建
462
- if (this.data.f_apply_type === '报警器报建' && this.data.defname === '工程施工' && this.data.title === '工程施工' && this.data.f_sub_state !='完工'){
463
- if (!flag){
464
- if (this.areaData.sjvalue ==null || this.areaData.sjvalue.length ==0 || this.areaData.sqvalue == null || this.areaData.sqvalue.length ==0
465
- || this.areaData.xianvalue == null || this.areaData.xianvalue == 0){
466
- console.log("区域为空禁止提交:",this.areaData)
467
- flag = true
468
- }
469
- }
470
- }
471
-
472
- this.disable_button = flag
473
- },
474
- // 失去焦点且值最终发生变化触发
475
- async onchange (index) {
476
- // 是否禁用按钮
477
- this.disableButton()
478
-
479
- if (!isEmpty(this.data.fields[index].value)) {
480
- // 前缀、后缀
481
- if (this.data.fields[index].prefix) {
482
- this.data.fields[index].value = this.data.fields[index].prefix + this.data.fields[index].value
483
- }
484
- if (this.data.fields[index].suffix) {
485
- this.data.fields[index].value = this.data.fields[index].value + this.data.fields[index].suffix
486
- }
487
- }
488
-
489
- // data赋值
490
- this.data[this.data.fields[index].field] = this.data.fields[index].value
491
-
492
- if (this.data.fields[index].type === 'datepicker') {
493
- this.check_datepicker(index)
494
- }
495
-
496
- if (this.data.fields[index].onchange) {
497
- this.$dispatch(this.data.fields[index].onchange, index)
498
- }
499
- this.$dispatch('onchange', index)
500
-
501
-
502
- },
503
- // 失去焦点触发，无论值是否发生变化
504
- onblur (index) {
505
- this.disableButton()
506
-
507
- if (this.data.fields[index].onblur) {
508
- this.$dispatch(this.data.fields[index].onblur, index)
509
- }
510
-
511
- this.$dispatch('onblur', index)
512
- },
513
- oninput (index) {
514
- // 是否禁用按钮
515
- this.disableButton()
516
-
517
- if (this.data.fields[index].oninput) {
518
- this.$dispatch(this.data.fields[index].oninput, index)
519
- }
520
- this.$dispatch('oninput', index)
521
- },
522
- // 点击按钮组按钮
523
- async click_but (button) {
524
- //报警器区域地址
525
- this.data.areaData = this.areaData
526
-
527
- if (this.data.defname === '通气点火') {
528
-
529
- this.$showMessage(`请确认表号是否正确`).then((res) => {
530
-
531
-
532
- this.disable_button = true
533
-
534
- this.data.fields.forEach(item => {
535
- this.data[item.field] = item.value
536
- })
537
-
538
- this.data.button = button
539
-
540
- if (button.button_fields && button.button_fields.length > 0) {
541
- this.showButModal = true
542
- return
543
- }
544
-
545
- if (this.data.button.event) {
546
- this.$dispatch(this.data.button.event)
547
- } else {
548
- this.$dispatch('button')
549
- }
550
-
551
- })
552
-
553
- }
554
- else{
555
- this.disable_button = true
556
-
557
- this.data.fields.forEach(item => {
558
- this.data[item.field] = item.value
559
- })
560
-
561
- this.data.button = button
562
-
563
- if (button.button_fields && button.button_fields.length > 0) {
564
- this.showButModal = true
565
- return
566
- }
567
-
568
- if (this.data.button.event) {
569
- this.$dispatch(this.data.button.event)
570
- } else {
571
- this.$dispatch('button')
572
- }
573
- }
574
-
575
- },
576
- confirmModal () {
577
- this.closeModal()
578
-
579
- this.data.button.button_fields.forEach(item => {
580
- this.data.button[item.field] = item.value
581
- })
582
-
583
- if (this.data.button.event) {
584
- this.$dispatch(this.data.button.event)
585
- } else {
586
- this.$dispatch('button')
587
- }
588
- },
589
- // 关闭模态框
590
- closeModal () {
591
- this.showButModal = false
592
- this.disable_modal_button = true
593
- },
594
- onbutchange (index) {
595
- // 是否禁用按钮
596
- this.disableModalButton()
597
-
598
- if (this.data.button.button_fields[index].onchange) {
599
- this.$dispatch(this.data.button.button_fields[index].onchange, index)
600
- } else {
601
- this.$dispatch('onbutchange', index)
602
- }
603
-
604
- },
605
- onbutblur (index) {
606
- this.disableModalButton()
607
-
608
- if (this.data.button.button_fields[index].onblur) {
609
- this.$dispatch(this.data.button.button_fields[index].onblur, index)
610
- } else {
611
- this.$dispatch('onbutblur', index)
612
- }
613
- },
614
- onbutinput (index) {
615
- // 是否禁用按钮
616
- this.disableModalButton()
617
-
618
- if (this.data.button.button_fields[index].oninput) {
619
- this.$dispatch(this.data.button.button_fields[index].oninput, index)
620
- } else {
621
- this.$dispatch('onbutinput', index)
622
- }
623
- },
624
- disableModalButton () {
625
- let flag = false
626
-
627
-
628
- for (const item of this.data.button.button_fields) {
629
- if (item.required && !item.value) {
630
- if (item.value === 0) {
631
- flag = false
632
- } else {
633
- flag = true
634
- }
635
- }
636
- }
637
-
638
- this.disable_modal_button = flag
639
- },
640
- check_datepicker (index) {
641
- // 时间格式检测
642
- if (!isEmpty(this.data.fields[index].value)) {
643
-
644
- let dateReg = /^[1-9]\d{3}-(0[1-9]|1[0-2])-(0[1-9]|[1-2][0-9]|3[0-1])$/
645
- let timeReg = /^(20|21|22|23|[0-1]\d):[0-5]\d:[0-5]\d$/
646
- 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$/
647
- if (this.data.fields[index].format) {
648
- if (this.data.fields[index].format === 'yyyy-MM-dd') {
649
- if (!dateReg.test(this.data.fields[index].value)) {
650
- this.data.fields[index].value = ''
651
- this.$showAlert(this.data.fields[index].label + '格式错误如：2021-01-01', 'warning', 2000)
652
- }
653
- }
654
- if (this.data.fields[index].format === 'HH:mm:ss') {
655
- if (!timeReg.test(this.data.fields[index].value)) {
656
- this.data.fields[index].value = ''
657
- this.$showAlert(this.data.fields[index].label + '格式错误如：00:00:00', 'warning', 2000)
658
- }
659
- }
660
- if (this.data.fields[index].format === 'yyyy-MM-dd HH:mm:ss') {
661
- if (!datetimeReg.test(this.data.fields[index].value)) {
662
- this.data.fields[index].value = ''
663
- this.$showAlert(this.data.fields[index].label + '格式错误如：2021-01-01 00:00:00', 'warning', 2000)
664
- }
665
- }
666
- } else {
667
- if (!dateReg.test(this.data.fields[index].value)) {
668
- this.data.fields[index].value = ''
669
- this.$showAlert(this.data.fields[index].label + '格式错误如：2021-01-01', 'warning', 2000)
670
- }
671
- }
672
- }
673
- },
674
- selectSearch(event, index) {
675
- if (this.data.fields[index].selectSearch) {
676
- this.$dispatch(this.data.fields[index].selectSearch, event[0], index)
677
- }
678
- this.$dispatch('selectSearch', event[0], index)
679
- }
680
- },
681
- events: {
682
- }
683
- }
684
- </script>
685
- <style scoped>
686
- .control-label-justify {
687
- width: 30%;
688
- text-align: justify;
689
- text-align-last: justify;
690
- font-family: PingFang-SC-Bold;
691
- float: left;
692
- }
693
- .button_spacing{margin: 0px 0px 0px 10px;}
694
- </style>
695
- <style lang="less">
696
- .apply-has-error {
697
- border-bottom: 1px solid #a94442;
698
- }
699
- .app-input {
700
- label {
701
- float: left;
702
- }
703
- .select {
704
- button {
705
- border: none;
706
- outline: none;
707
- text-align: left;
708
- .btn-placeholder {
709
- color: #ACA899
710
- }
711
- }
712
- }
713
- .datepicker {
714
- .form-control:focus {
715
- border: none!important;
716
- outline: none!important;
717
- -webkit-box-shadow: none;
718
- box-shadow: none;
719
- }
720
- }
721
- textarea {
722
- padding: 8px 10px;
723
- border: none;
724
- outline: none;
725
- margin: 0px;
726
- }
727
- input[readonly]{
728
- color: #ACA899!important;
729
- background: #FFFFFF;
730
- border: none;
731
- outline: none;
732
- }
733
- input:disabled{
734
- color: #ACA899!important;
735
- background: #FFFFFF;
736
- border: none;
737
- outline: none;
738
- }
739
- textarea[readonly]{
740
- color: #ACA899!important;
741
- background: #FFFFFF;
742
- border: none;
743
- outline: none;
744
- }
745
- textarea:disabled{
746
- color: #ACA899!important;
747
- background: #FFFFFF;
748
- border: none;
749
- outline: none;
750
- }
751
- }
752
- </style>
1
+ <template>
2
+ <div class="form-horizontal select-overspread">
3
+ <validator name='v' @valid="$emit('valid')" @invalid="$emit('invalid')">
4
+ <form>
5
+ <div v-for="(index,item) in data.fields">
6
+ <!--input-->
7
+ <div :style="item.style ? item.style : ''"
8
+ v-if="(item.type==='input' || item.type==='number'||item.type === 'tel'||item.type === 'email') && !item.hidden && (item.device === 'app' || !item.device) && (item.label != '证件号码')&&(item.label != '身份证') && (item.label != '用户电话')"
9
+ :class="[item.required && !(item.value) ? 'apply-has-error' : '', item.bootstraped ? item.bootstraped + ' form-group app-input':'col-xs-12 form-group app-input']">
10
+ <label class="control-label-justify">{{item.label}}</label>
11
+ <div :style="item.value_style ? item.value_style:''"
12
+ :class="item.value_bootstraped ? item.value_bootstraped : 'col-xs-8'">
13
+ <input class="" style="width: 100%"
14
+ :type="item.type"
15
+ v-model="data.fields[index].value"
16
+ :placeholder="item.placeholder"
17
+ :value="data.fields[index].value"
18
+ :readonly="item.readonly"
19
+ :disabled="item.disabled"
20
+ @change="onchange(index)"
21
+ @blur="onblur(index)"
22
+ @input="oninput(index)"
23
+ />
24
+ </div>
25
+ </div>
26
+
27
+ <div :style="item.style ? item.style : ''"
28
+ v-if="(data.fields[index-1].value ==='营业执照'||data.fields[index-1].value ==='军官证')&& (item.label === '证件号码')"
29
+ :class="[item.required && !(item.value) ? 'apply-has-error' : '', item.bootstraped ? item.bootstraped + ' form-group app-input':'col-xs-12 form-group app-input']">
30
+ <label class="control-label-justify">{{item.label}}</label>
31
+ <div :style="item.value_style ? item.value_style:''"
32
+ :class="item.value_bootstraped ? item.value_bootstraped : 'col-xs-8'">
33
+ <input class="" style="width: 100%"
34
+ :type="item.type"
35
+ v-model="data.fields[index].value"
36
+ :placeholder="item.placeholder"
37
+ :value="data.fields[index].value"
38
+ :readonly="item.readonly"
39
+ :disabled="item.disabled"
40
+ @change="onchange(index)"
41
+ @blur="onblur(index)"
42
+ @input="oninput(index)"
43
+ />
44
+ </div>
45
+ </div>
46
+
47
+
48
+ <!--input身份证验证-->
49
+ <div :style="item.style ? item.style : ''"
50
+ v-if="(item.label==='身份证') || (item.label === '证件号码' && data.fields[index-1].value ==='身份证')"
51
+ :class="[$v.f_idnumber2.identityCardValid ? '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 :style="item.value_style ? item.value_style:''"
54
+ :class="item.value_bootstraped ? item.value_bootstraped : 'col-xs-8'">
55
+ <input class="" style="width: 100%"
56
+ :type="item.type"
57
+ maxlength="18"
58
+ v-model="data.fields[index].value"
59
+ :placeholder="item.placeholder"
60
+ :value="data.fields[index].value"
61
+ onKeypress="return(/[\d\.]/.test(String.fromCharCode(event.keyCode)))"
62
+ :readonly="item.readonly"
63
+ v-validate:f_idnumber2='{identityCardValid: true}'
64
+ @change="onchange(index)"
65
+ @blur="onblur(index)"
66
+ @input="oninput(index)"
67
+ />
68
+ </div>
69
+ </div>
70
+
71
+
72
+ <!--input手机号验证-->
73
+ <div :style="item.style ? item.style : ''"
74
+ v-if="item.label === '用户电话'"
75
+ :class="[$v.f_user_phone.minlength || $v.f_user_phone.maxlength ? 'apply-has-error' : '',item.bootstraped ? item.bootstraped + ' form-group app-input':'col-xs-12 form-group app-input']">
76
+ <label class="control-label-justify">{{item.label}}</label>
77
+ <div :style="item.value_style ? item.value_style:''"
78
+ :class="item.value_bootstraped ? item.value_bootstraped : 'col-xs-8'">
79
+ <input class="" style="width: 100%"
80
+ maxlength="18"
81
+ type="number"
82
+ onKeypress="return(/[\d\.]/.test(String.fromCharCode(event.keyCode)))"
83
+ oninput="if(value.length > 11) value=value.slice(0,11)"
84
+ v-validate:f_user_phone="{minlength: 7, maxlength: 11 }"
85
+ v-model="data.fields[index].value"
86
+ :placeholder="item.placeholder"
87
+ :value="data.fields[index].value"
88
+ :readonly="item.readonly"
89
+ @change="onchange(index)"
90
+ @blur="onblur(index)"
91
+ @input="oninput(index)"
92
+ />
93
+ </div>
94
+ </div>
95
+
96
+ <!--select-->
97
+ <div :style="item.style ? item.style : ''"
98
+ v-if="item.type==='select' && !item.hidden && (item.device === 'app' || !item.device)"
99
+ :class="[item.required && !(item.value) ? 'apply-has-error' : '', item.bootstraped ? item.bootstraped + ' form-group app-input':'col-xs-12 form-group app-input']">
100
+ <label class="control-label-justify">{{item.label}}</label>
101
+ <div :style="item.value_style ? item.value_style:''"
102
+ :class="item.value_bootstraped ? item.value_bootstraped : 'col-xs-8'">
103
+ <v-select
104
+ class="select" width="100%" align="right"
105
+ :placeholder="item.placeholder"
106
+ :search="item.search"
107
+ close-on-select value-single
108
+ @select-search="selectSearch($arguments,index)"
109
+ :options="data.fields[index].options"
110
+ v-model="data.fields[index].value"
111
+ :value.sync="data.fields[index].value"
112
+ @blur="onblur(index)"
113
+ @change="onchange(index)"
114
+ :readonly="item.readonly"
115
+ :disabled="item.disabled"
116
+ ></v-select>
117
+ </div>
118
+ </div>
119
+
120
+ <!--时间datepicker-->
121
+ <div :style="item.style ? item.style : ''"
122
+ v-if="item.type==='datepicker' && !item.hidden && (item.device === 'app' || !item.device)"
123
+ :class="[item.required && !(item.value) ? 'apply-has-error' : '', item.bootstraped ? item.bootstraped+' form-group app-input':'col-xs-12 form-group app-input']">
124
+ <label class="control-label-justify">{{item.label}}</label>
125
+ <div class="form-group" :style="item.value_style ? item.value_style:''"
126
+ :class="item.value_bootstraped ? item.value_bootstraped : 'col-xs-8'">
127
+ <datepicker
128
+ @change="onchange(index)"
129
+ @blur="onblur(index)"
130
+ :placeholder="item.placeholder"
131
+ :value.sync="data.fields[index].value"
132
+ :format="item.format ? item.format : 'yyyy-MM-dd'"
133
+ v-model="data.fields[index].value"
134
+ :readonly="item.readonly"
135
+ :disabled="item.disabled"
136
+ :show-reset-button="true">
137
+ </datepicker>
138
+ </div>
139
+ </div>
140
+
141
+ <!--textarea-->
142
+ <div :style="item.style ? item.style : ''"
143
+ v-if="item.type==='textarea' && !item.hidden && (item.device === 'app' || !item.device)"
144
+ :class="[item.required && !(item.value) ? 'apply-has-error' : '', item.bootstraped?item.bootstraped+' form-group app-input':'col-xs-12 form-group app-input']">
145
+ <label class="control-label-justify">{{item.label}}</label>
146
+ <div :style="item.value_style ? item.value_style:''"
147
+ :class="item.value_bootstraped ? item.value_bootstraped : 'col-xs-8'">
148
+ <textarea
149
+ :readonly="item.readonly"
150
+ :disabled="item.disabled"
151
+ class="" rows="1"
152
+ style="width: 100%;height: 100%"
153
+ v-model="data.fields[index].value"
154
+ :value="data.fields[index].value"
155
+ @change="onchange(index)"
156
+ @blur="onblur(index)"
157
+ @input="oninput(index)"
158
+ ></textarea>
159
+ </div>
160
+ </div>
161
+
162
+ <!--checkbox-->
163
+ <div :style="item.style ? item.style : ''"
164
+ v-if="item.type==='checkbox' && !item.hidden && (item.device === 'app' || !item.device)"
165
+ :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']">
166
+ <label class="control-label-justify">{{item.label}}</label>
167
+ <div :style="item.value_style ? item.value_style:''"
168
+ :class="item.value_bootstraped ? item.value_bootstraped : 'col-xs-8'">
169
+ <label class="" v-for="(index2,row) in item.options">
170
+ <input type="checkbox" class=""
171
+ :readonly="data.fields[index].readonly"
172
+ :disabled="data.fields[index].disabled"
173
+ v-model="data.fields[index].value"
174
+ :value="data.fields[index].options[index2].value"
175
+ @change="onchange(index)"
176
+ @blur="onblur(index)">
177
+ {{row.label}}
178
+ </label>
179
+ </div>
180
+ </div>
181
+ </div>
182
+ <div class="col-sm-12 col-xs-12" id="test11">
183
+ <accordion one-at-a-time="true">
184
+ <panel v-for="(i,item) in data.onetomany" :header="item.title" :is-open="false" type="primary">
185
+ <app-onetomany :onetomany="item" :index="i" :selectdata="data"></app-onetomany>
186
+ </panel>
187
+ <panel v-for="(i,item) in data.components" :header="item.title" :is-open="false" type="primary" v-if="item.device === 'app' || !item.device">
188
+ <component :is="item.name" :selectdata="data" :mark="item.mark"></component>
189
+ </panel>
190
+ </accordion>
191
+ </div>
192
+
193
+ <!--自定义组件-->
194
+ <slot>
195
+
196
+ </slot>
197
+
198
+ <!-- 按钮组 -->
199
+ <div class="text-center">
200
+ <button v-for="(index,button) in data.buttons"
201
+ :disabled="button.disabled && disable_button"
202
+ style="min-width:100px"
203
+ :class="button.disabled && disable_button ? 'btn btn-default button_spacing' : 'btn btn-primary button_spacing'"
204
+ v-if="!button.hidden && button.button_name !=='提交'&& button.button_name !=='确认'"
205
+ @click.prevent="click_but(button)"
206
+ >
207
+ {{button.button_name}}
208
+ </button>
209
+ <button v-for="(index,button) in data.buttons"
210
+ :disabled="(button.disabled && disable_button) || (!$v.valid)"
211
+ style="min-width:100px"
212
+ :class="button.disabled && disable_button || (!$v.valid) ? 'btn btn-default button_spacing' : 'btn btn-primary button_spacing'"
213
+ v-if="!button.hidden && (button.button_name ==='提交'||button.button_name ==='确认')"
214
+ @click.prevent="click_but(button)"
215
+ >
216
+ {{button.button_name}}
217
+ </button>
218
+ </div>
219
+
220
+ <!-- 按钮模态框 -->
221
+ <modal v-if="showButModal" :show.sync="showButModal" backdrop="false" large>
222
+ <header slot="modal-header" class="modal-header">
223
+ <button type="button" class="close" @click="closeModal()"><span>&times;</span></button>
224
+ <span class="modal-title"><font
225
+ size="3">{{data.button.button_name}}</font></span>
226
+ </header>
227
+ <article slot="modal-body" class="modal-body clearfix">
228
+ <div class="form-group" >
229
+ <div v-for="(index,item) in data.button.button_fields">
230
+ <div :style="item.style ? item.style : ''" :class="[item.required && !(item.value) ? 'has-error' : '', item.bootstraped ? item.bootstraped + ' form-group' : 'form-group']"
231
+ v-if="(item.type==='input' || item.type==='number'||item.type === 'tel'||item.type === 'email') && !item.hidden && (item.device === 'pc' || !item.device)">
232
+ <label :style="item.label_style ? item.label_style : ''"
233
+ :class="item.label_bootstraped ? item.label_bootstraped + ' control-label-justify control-label' : 'control-label-justify control-label'">{{item.label}}</label>
234
+ <div :style="item.value_style ? item.value_style : ''"
235
+ :class="item.value_bootstraped ? item.value_bootstraped : 'col-xs-8'">
236
+ <input class="form-control input_view"
237
+ :placeholder="item.placeholder"
238
+ :type="item.type"
239
+ v-model="item.value"
240
+ :value="item.value"
241
+ :readonly="item.readonly"
242
+ :disabled="item.disabled"
243
+ @change="onbutchange(index)"
244
+ @blur="onbutblur(index)"
245
+ @input="onbutinput(index)"
246
+ />
247
+ </div>
248
+ </div>
249
+
250
+ <!--时间datepicker-->
251
+ <div :style="item.style ? item.style : ''" :class="[item.required && !(item.value) ? 'has-error' : '', item.bootstraped ? item.bootstraped + ' form-group':'form-group']"
252
+ v-if="item.type==='datepicker' && !item.hidden && (item.device === 'pc' || !item.device)">
253
+ <label :style="item.label_style ? item.label_style : ''"
254
+ :class="item.label_bootstraped ? item.label_bootstraped + ' control-label-justify control-label' : 'control-label-justify control-label'">{{item.label}}</label>
255
+ <div :style="item.value_style ? item.value_style : ''"
256
+ :class="item.value_bootstraped ? item.value_bootstraped : 'col-xs-8'">
257
+ <datepicker
258
+ :placeholder="item.placeholder"
259
+ :value.sync="item.value"
260
+ v-model="item.value"
261
+ :readonly="item.readonly"
262
+ :disabled="item.disabled"
263
+ :format="item.format ? item.format : 'yyyy-MM-dd'"
264
+ :show-reset-button="true"
265
+ @change="onbutchange(index)"
266
+ @blur="onbutblur(index)"
267
+ ></datepicker>
268
+ </div>
269
+ </div>
270
+
271
+ <!--select-->
272
+ <div :style="item.style ? item.style : ''" :class="[item.required && !(item.value) ? 'has-error' : '', item.bootstraped ? item.bootstraped + ' form-group':'form-group']"
273
+ v-if="item.type==='select' && !item.hidden && (item.device === 'pc' || !item.device)">
274
+ <label :style="item.label_style ? item.label_style : ''"
275
+ :class="item.label_bootstraped ? item.label_bootstraped + ' control-label-justify control-label' : 'control-label-justify control-label'">{{item.label}}</label>
276
+ <div :style="item.value_style ? item.value_style : ''"
277
+ :class="item.value_bootstraped ? item.value_bootstraped : 'col-xs-8'">
278
+ <input-select
279
+ class="select select_list"
280
+ :value.sync="item.value"
281
+ v-model="item.value"
282
+ :options='item.options'
283
+ :readonly="item.readonly"
284
+ :disable="item.disabled"
285
+ :valueSingle="true"
286
+ @blur="onbutblur(index)"
287
+ @change="onbutchange(index)"
288
+ ></input-select>
289
+ </div>
290
+ </div>
291
+
292
+ <!--textarea-->
293
+ <div :style="item.style ? item.style : ''" :class="[item.required && !(item.value) ? 'has-error' : '', item.bootstraped ? item.bootstraped + ' form-group':'form-group']"
294
+ v-if="item.type==='textarea' && !item.hidden && (item.device === 'pc' || !item.device)">
295
+ <label :style="item.label_style ? item.label_style : ''"
296
+ :class="item.label_bootstraped ? item.label_bootstraped + ' control-label-justify control-label' : 'control-label-justify control-label'">{{item.label}}</label>
297
+ <div :style="item.value_style ? item.value_style : ''"
298
+ :class="item.value_bootstraped ? item.value_bootstraped : 'col-xs-8'">
299
+ <textarea
300
+ class="form-control input_view"
301
+ style="width: 100%;height: 100%"
302
+ v-model="item.value"
303
+ :value="item.value"
304
+ :rows="item.rows"
305
+ :readonly="item.readonly"
306
+ :disabled="item.disabled"
307
+ @change="onbutchange(index)"
308
+ @blur="onbutblur(index)"
309
+ @input="onbutinput(index)"
310
+ ></textarea>
311
+ </div>
312
+ </div>
313
+ </div>
314
+ </div>
315
+ </article>
316
+ <footer slot="modal-footer" class="modal-footer">
317
+ <button :class="disable_modal_button ? 'btn btn-default':'btn btn-primary'"
318
+ :disabled="disable_modal_button" type="button" @click="confirmModal()">
319
+ 确认
320
+ </button>
321
+ </footer>
322
+ </modal>
323
+ </form>
324
+ </div>
325
+ </template>
326
+ <script>
327
+ import Vue from 'vue'
328
+ import {isEmpty} from "../Util";
329
+ // Date格式化
330
+ Date.prototype.Format = function (fmt) {
331
+ var o = {
332
+ 'M+': this.getMonth() + 1, // 月份
333
+ 'd+': this.getDate(), // 日
334
+ 'H+': this.getHours(), // 小时
335
+ 'm+': this.getMinutes(), // 分
336
+ 's+': this.getSeconds(), // 秒
337
+ 'q+': Math.floor((this.getMonth() + 3) / 3), // 季度
338
+ 'S': this.getMilliseconds() // 毫秒
339
+ }
340
+ if (/(y+)/.test(fmt)) fmt = fmt.replace(RegExp.$1, (this.getFullYear() + '').substr(4 - RegExp.$1.length))
341
+ for (var k in o) {
342
+ if (new RegExp('(' + k + ')').test(fmt)) fmt = fmt.replace(RegExp.$1, (RegExp.$1.length === 1) ? (o[k]) : (('00' + o[k]).substr(('' + o[k]).length)))
343
+ }
344
+ return fmt
345
+ }
346
+
347
+ export default {
348
+ title: '报建业务通用组件',
349
+ props: {
350
+ data: {
351
+ type: Object
352
+ },
353
+ showprint: {
354
+ type: Boolean,
355
+ default: true
356
+ }
357
+ },
358
+ data () {
359
+ return {
360
+ model: {}, // 公司等属性
361
+ disable_button: true, // 控制按钮禁用
362
+ disable_modal_button: true, // 控制按钮禁用
363
+ showButModal: false,
364
+ areaData:{
365
+ sjvalue:'',
366
+ xianvalue:'',
367
+ sqvalue:'',
368
+ }
369
+ }
370
+ },
371
+ watch: {
372
+ deep: true
373
+ },
374
+ computed: {
375
+
376
+ },
377
+ created () {
378
+ // 初始化数据
379
+ this.initializtion()
380
+ if (this.data.readyEvent) {
381
+ this.$dispatch(this.data.readyEvent)
382
+ }
383
+ this.$dispatch('initializtionView')
384
+ },
385
+ methods: {
386
+ // 初始化数据
387
+ initializtion () {
388
+ for (const item of this.data.fields) {
389
+ this.data[item.field] = item.value
390
+ }
391
+ // 是否禁用按钮
392
+ this.disableButton()
393
+ },
394
+ async getSelectShijiValue(sjvalue,sjlable) {
395
+
396
+ this.areaData.sjvalue = sjvalue
397
+ console.log("这是父级接收的市级值:",sjvalue,sjlable)
398
+ this.data.areaData = this.areaData
399
+ console.log(this.areaData)
400
+ // 是否禁用按钮
401
+ this.disableButton()
402
+ },
403
+ async getSelectXianValue(xianvalue,xianlable) {
404
+
405
+ this.areaData.xianvalue = xianvalue
406
+ this.data.areaData = this.areaData
407
+ console.log("这是父级接收的县级值:",xianvalue,xianlable)
408
+ console.log(this.areaData)
409
+
410
+ // 是否禁用按钮
411
+ this.disableButton()
412
+ },
413
+ async getSelectShequValue(sqvalue,sqlable) {
414
+ this.areaData.sqvalue = sqvalue
415
+ this.data.areaData = this.areaData
416
+ console.log(this.areaData)
417
+ console.log("这是父级接收的社区值:",sqvalue,sqlable)
418
+
419
+ // 是否禁用按钮
420
+ this.disableButton()
421
+ },
422
+ // 是否禁用按钮
423
+ disableButton () {
424
+ let flag = false
425
+
426
+ for (const field of this.data.fields) {
427
+ if (field.required && !field.value && !field.hidden && field.value !== 0) {
428
+ flag = true
429
+ }
430
+
431
+ // 任何选择框只要是否都不能提交
432
+ if (field.type === 'select' && field.value === '否' && field.value_no_disable) {
433
+ flag = true
434
+ }
435
+
436
+ if (field.type === 'checkbox' && field.required && field.value.length === 0) {
437
+ flag = true
438
+ }
439
+ }
440
+
441
+ //区域下拉框必选 流程模式为报警器报建
442
+ if (this.data.f_apply_type === '报警器报建' && this.data.defname === '工程施工' && this.data.title === '工程施工' && this.data.f_sub_state !='完工'){
443
+ if (!flag){
444
+ if (this.areaData.sjvalue ==null || this.areaData.sjvalue.length ==0 || this.areaData.sqvalue == null || this.areaData.sqvalue.length ==0
445
+ || this.areaData.xianvalue == null || this.areaData.xianvalue == 0){
446
+ console.log("区域为空禁止提交:",this.areaData)
447
+ flag = true
448
+ }
449
+ }
450
+ }
451
+
452
+ this.disable_button = flag
453
+ },
454
+ // 失去焦点且值最终发生变化触发
455
+ async onchange (index) {
456
+ // 是否禁用按钮
457
+ this.disableButton()
458
+
459
+ if (!isEmpty(this.data.fields[index].value)) {
460
+ // 前缀、后缀
461
+ if (this.data.fields[index].prefix) {
462
+ this.data.fields[index].value = this.data.fields[index].prefix + this.data.fields[index].value
463
+ }
464
+ if (this.data.fields[index].suffix) {
465
+ this.data.fields[index].value = this.data.fields[index].value + this.data.fields[index].suffix
466
+ }
467
+ }
468
+
469
+ // data赋值
470
+ this.data[this.data.fields[index].field] = this.data.fields[index].value
471
+
472
+ if (this.data.fields[index].type === 'datepicker') {
473
+ this.check_datepicker(index)
474
+ }
475
+
476
+ if (this.data.fields[index].onchange) {
477
+ this.$dispatch(this.data.fields[index].onchange, index)
478
+ }
479
+ this.$dispatch('onchange', index)
480
+
481
+
482
+ },
483
+ // 失去焦点触发，无论值是否发生变化
484
+ onblur (index) {
485
+ this.disableButton()
486
+
487
+ if (this.data.fields[index].onblur) {
488
+ this.$dispatch(this.data.fields[index].onblur, index)
489
+ }
490
+
491
+ this.$dispatch('onblur', index)
492
+ },
493
+ oninput (index) {
494
+ // 是否禁用按钮
495
+ this.disableButton()
496
+
497
+ if (this.data.fields[index].oninput) {
498
+ this.$dispatch(this.data.fields[index].oninput, index)
499
+ }
500
+ this.$dispatch('oninput', index)
501
+ },
502
+ // 点击按钮组按钮
503
+ async click_but (button) {
504
+ //报警器区域地址
505
+ this.data.areaData = this.areaData
506
+
507
+ if (this.data.defname === '通气点火') {
508
+
509
+ this.$showMessage(`请确认表号是否正确`).then((res) => {
510
+
511
+
512
+ this.disable_button = true
513
+
514
+ this.data.fields.forEach(item => {
515
+ this.data[item.field] = item.value
516
+ })
517
+
518
+ this.data.button = button
519
+
520
+ if (button.button_fields && button.button_fields.length > 0) {
521
+ this.showButModal = true
522
+ return
523
+ }
524
+
525
+ if (this.data.button.event) {
526
+ this.$dispatch(this.data.button.event)
527
+ } else {
528
+ this.$dispatch('button')
529
+ }
530
+
531
+ })
532
+
533
+ }
534
+ else{
535
+ this.disable_button = true
536
+
537
+ this.data.fields.forEach(item => {
538
+ this.data[item.field] = item.value
539
+ })
540
+
541
+ this.data.button = button
542
+
543
+ if (button.button_fields && button.button_fields.length > 0) {
544
+ this.showButModal = true
545
+ return
546
+ }
547
+
548
+ if (this.data.button.event) {
549
+ this.$dispatch(this.data.button.event)
550
+ } else {
551
+ this.$dispatch('button')
552
+ }
553
+ }
554
+
555
+ },
556
+ confirmModal () {
557
+ this.closeModal()
558
+
559
+ this.data.button.button_fields.forEach(item => {
560
+ this.data.button[item.field] = item.value
561
+ })
562
+
563
+ if (this.data.button.event) {
564
+ this.$dispatch(this.data.button.event)
565
+ } else {
566
+ this.$dispatch('button')
567
+ }
568
+ },
569
+ // 关闭模态框
570
+ closeModal () {
571
+ this.showButModal = false
572
+ this.disable_modal_button = true
573
+ },
574
+ onbutchange (index) {
575
+ // 是否禁用按钮
576
+ this.disableModalButton()
577
+
578
+ if (this.data.button.button_fields[index].onchange) {
579
+ this.$dispatch(this.data.button.button_fields[index].onchange, index)
580
+ } else {
581
+ this.$dispatch('onbutchange', index)
582
+ }
583
+
584
+ },
585
+ onbutblur (index) {
586
+ this.disableModalButton()
587
+
588
+ if (this.data.button.button_fields[index].onblur) {
589
+ this.$dispatch(this.data.button.button_fields[index].onblur, index)
590
+ } else {
591
+ this.$dispatch('onbutblur', index)
592
+ }
593
+ },
594
+ onbutinput (index) {
595
+ // 是否禁用按钮
596
+ this.disableModalButton()
597
+
598
+ if (this.data.button.button_fields[index].oninput) {
599
+ this.$dispatch(this.data.button.button_fields[index].oninput, index)
600
+ } else {
601
+ this.$dispatch('onbutinput', index)
602
+ }
603
+ },
604
+ disableModalButton () {
605
+ let flag = false
606
+
607
+
608
+ for (const item of this.data.button.button_fields) {
609
+ if (item.required && !item.value) {
610
+ if (item.value === 0) {
611
+ flag = false
612
+ } else {
613
+ flag = true
614
+ }
615
+ }
616
+ }
617
+
618
+ this.disable_modal_button = flag
619
+ },
620
+ check_datepicker (index) {
621
+ // 时间格式检测
622
+ if (!isEmpty(this.data.fields[index].value)) {
623
+
624
+ let dateReg = /^[1-9]\d{3}-(0[1-9]|1[0-2])-(0[1-9]|[1-2][0-9]|3[0-1])$/
625
+ let timeReg = /^(20|21|22|23|[0-1]\d):[0-5]\d:[0-5]\d$/
626
+ 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$/
627
+ if (this.data.fields[index].format) {
628
+ if (this.data.fields[index].format === 'yyyy-MM-dd') {
629
+ if (!dateReg.test(this.data.fields[index].value)) {
630
+ this.data.fields[index].value = ''
631
+ this.$showAlert(this.data.fields[index].label + '格式错误如：2021-01-01', 'warning', 2000)
632
+ }
633
+ }
634
+ if (this.data.fields[index].format === 'HH:mm:ss') {
635
+ if (!timeReg.test(this.data.fields[index].value)) {
636
+ this.data.fields[index].value = ''
637
+ this.$showAlert(this.data.fields[index].label + '格式错误如：00:00:00', 'warning', 2000)
638
+ }
639
+ }
640
+ if (this.data.fields[index].format === 'yyyy-MM-dd HH:mm:ss') {
641
+ if (!datetimeReg.test(this.data.fields[index].value)) {
642
+ this.data.fields[index].value = ''
643
+ this.$showAlert(this.data.fields[index].label + '格式错误如：2021-01-01 00:00:00', 'warning', 2000)
644
+ }
645
+ }
646
+ } else {
647
+ if (!dateReg.test(this.data.fields[index].value)) {
648
+ this.data.fields[index].value = ''
649
+ this.$showAlert(this.data.fields[index].label + '格式错误如：2021-01-01', 'warning', 2000)
650
+ }
651
+ }
652
+ }
653
+ },
654
+ selectSearch(event, index) {
655
+ if (this.data.fields[index].selectSearch) {
656
+ this.$dispatch(this.data.fields[index].selectSearch, event[0], index)
657
+ }
658
+ this.$dispatch('selectSearch', event[0], index)
659
+ }
660
+ },
661
+ events: {
662
+ }
663
+ }
664
+ </script>
665
+ <style scoped>
666
+ .control-label-justify {
667
+ width: 30%;
668
+ text-align: justify;
669
+ text-align-last: justify;
670
+ font-family: PingFang-SC-Bold;
671
+ float: left;
672
+ }
673
+ .button_spacing{margin: 0px 0px 0px 10px;}
674
+ </style>
675
+ <style lang="less">
676
+ .apply-has-error {
677
+ border-bottom: 1px solid #a94442;
678
+ }
679
+ .app-input {
680
+ label {
681
+ float: left;
682
+ }
683
+ .select {
684
+ button {
685
+ border: none;
686
+ outline: none;
687
+ text-align: left;
688
+ .btn-placeholder {
689
+ color: #ACA899
690
+ }
691
+ }
692
+ }
693
+ .datepicker {
694
+ .form-control:focus {
695
+ border: none!important;
696
+ outline: none!important;
697
+ -webkit-box-shadow: none;
698
+ box-shadow: none;
699
+ }
700
+ }
701
+ textarea {
702
+ padding: 8px 10px;
703
+ border: none;
704
+ outline: none;
705
+ margin: 0px;
706
+ }
707
+ input[readonly]{
708
+ color: #ACA899!important;
709
+ background: #FFFFFF;
710
+ border: none;
711
+ outline: none;
712
+ }
713
+ input:disabled{
714
+ color: #ACA899!important;
715
+ background: #FFFFFF;
716
+ border: none;
717
+ outline: none;
718
+ }
719
+ textarea[readonly]{
720
+ color: #ACA899!important;
721
+ background: #FFFFFF;
722
+ border: none;
723
+ outline: none;
724
+ }
725
+ textarea:disabled{
726
+ color: #ACA899!important;
727
+ background: #FFFFFF;
728
+ border: none;
729
+ outline: none;
730
+ }
731
+ }
732
+ </style>