apply-clients 3.3.74 → 3.3.78

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