1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _antDesignVue = require('ant-design-vue');
var _createDOMForm = require('../src/createDOMForm');
var _createDOMForm2 = _interopRequireDefault(_createDOMForm);
var _styles = require('./styles');
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }
var Form = {
props: {
form: Object
},
methods: {
onSubmit: function onSubmit(e) {
console.log('submit');
e.preventDefault();
this.form.validateFieldsAndScroll(function (error, values) {
if (!error) {
console.log('ok', values);
} else {
console.log('error', error, values);
}
});
},
reset: function reset(e) {
e.preventDefault();
this.form.resetFields();
},
checkStart: function checkStart(rule, value, callback) {
var validateFields = this.form.validateFields;
validateFields(['end'], { force: true });
callback();
},
checkEnd: function checkEnd(rule, value, callback) {
var end = value;
var getFieldValue = this.form.getFieldValue;
var start = getFieldValue('start');
if (!end || !start) {
callback('please select both start and end time');
} else if (end.valueOf() < start.valueOf()) {
callback('start time should be less than end time');
} else {
callback();
}
}
},
render: function render() {
var h = arguments[0];
var form = this.form;
var getFieldProps = form.getFieldProps,
getFieldError = form.getFieldError;
return h(
'div',
{
style: {
margin: 20
}
},
[h('h2', ['startTime and endTime validation']), h(
'form',
{
on: {
'submit': this.onSubmit
}
},
[h(
'div',
{ style: _styles.regionStyle },
[h('div', ['start:']), h('div', [h(_antDesignVue.DatePicker, getFieldProps('start', { rules: [this.checkStart] }))])]
), h(
'div',
{ style: _styles.regionStyle },
[h('div', ['end:']), h('div', [h(_antDesignVue.DatePicker, getFieldProps('end', { rules: [this.checkEnd] }))])]
), h(
'div',
{ style: _styles.errorStyle },
[getFieldError('end') ? getFieldError('end').join(',') : '']
), h(
'div',
{ style: _styles.regionStyle },
[h(
'button',
{
on: {
'click': this.reset
}
},
['reset']
), '\xA0', h('input', {
attrs: { type: 'submit', value: 'submit' }
})]
)]
)]
);
}
}; /* eslint no-console:0 */
exports['default'] = (0, _createDOMForm2['default'])()(Form);