Skip to content

Commit 3f13a19

Browse files
mvorisekmvorisek
committed
fix vue date flatpickr
1 parent 8de935d commit 3f13a19

29 files changed

+146
-120
lines changed

‎demos/_unit-test/calendar-input.php

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -20,7 +20,7 @@
2020
return $view;
2121
};
2222

23-
Header::addTo($app, ['Testing flatpickr using Behat']);
23+
Header::addTo($app, ['Testing Flatpickr using Behat']);
2424
$form = Form::addTo($app);
2525
$c = $form->addControl('field', [], ['type' => 'date']);
2626
$form->buttonSave->set($c->shortName);

‎demos/_unit-test/scope-builder.php

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -17,7 +17,7 @@
1717

1818
$project = new Condition($model->fieldName()->project_name, Condition::OPERATOR_REGEXP, '[a-zA-Z]');
1919
$brazil = new Condition($model->fieldName()->client_country_iso, '=', 'BR');
20-
$start = new Condition($model->fieldName()->start_date, '=', '2020-10-22');
20+
$start = new Condition($model->fieldName()->start_date, '=', '2020-10-22'); // TODO php/DateTime value should be supported
2121
$finish = new Condition($model->fieldName()->finish_time, '!=', '22:22');
2222
$isCommercial = new Condition($model->fieldName()->is_commercial, '0');
2323
$budget = new Condition($model->fieldName()->project_budget, '>=', '1000');

‎js/.eslintrc.js

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -49,6 +49,13 @@ module.exports = {
4949
balanced: true,
5050
},
5151
}],
52+
'comma-dangle': ['error', {
53+
arrays: 'always-multiline',
54+
objects: 'always-multiline',
55+
functions: 'never',
56+
imports: 'always-multiline',
57+
exports: 'always-multiline',
58+
}],
5259
'import/no-unresolved': 'off',
5360
'import/prefer-default-export': 'off',
5461
'import/extensions': ['error', 'always', {
@@ -57,6 +64,7 @@ module.exports = {
5764
vue: 'never',
5865
}],
5966
'vue/html-indent': ['error', 4],
67+
'vue/attribute-hyphenation': ['error', 'never'],
6068
'jsdoc/require-param': 'off',
6169
'jsdoc/require-param-description': 'off',
6270
'jsdoc/require-returns': 'off',

‎js/src/plugins/file-upload.plugin.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -156,7 +156,7 @@ export default class AtkFileUploadPlugin extends AtkPlugin {
156156
{ fUploadAction: 'upload' },
157157
this.settings.url,
158158
completeCb,
159-
xhrCb,
159+
xhrCb
160160
);
161161
}
162162

‎js/src/plugins/js-sortable.plugin.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -43,7 +43,7 @@ export default class AtkJsSortablePlugin extends AtkPlugin {
4343
{
4444
draggable: this.settings.draggable,
4545
handle: this.settings.handleClass ? '.' + this.settings.handleClass : null,
46-
},
46+
}
4747
);
4848
this.initialize();
4949

‎js/src/plugins/reload-view.plugin.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -26,7 +26,7 @@ export default class AtkReloadViewPlugin extends AtkPlugin {
2626
// add new param and remove duplicate, prioritizing the latest one.
2727
let urlParams = Object.assign(
2828
atk.urlHelper.parseParams(this.settings.url),
29-
this.settings.urlOptions ? this.settings.urlOptions : {},
29+
this.settings.urlOptions ? this.settings.urlOptions : {}
3030
);
3131

3232
// get store object.

‎js/src/services/upload.service.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -23,7 +23,7 @@ class UploadService {
2323
data,
2424
uploadUrl,
2525
completeCb = function (r, c) {},
26-
xhrCb = function () { return new window.XMLHttpRequest(); },
26+
xhrCb = function () { return new window.XMLHttpRequest(); }
2727
) {
2828
const formData = new FormData();
2929

‎js/src/vue-components/multiline/multiline.component.js

Lines changed: 9 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -38,7 +38,7 @@ export default {
3838
</SuiTableFooter>
3939
</SuiTable>
4040
<div>
41-
<input ref="atkmlInput" :form="form" :name="name" type="hidden" :value="value" />
41+
<input ref="atkmlInput" :form="form" :name="name" type="hidden" :value="valueJson" />
4242
</div>
4343
</div>`,
4444
props: {
@@ -55,8 +55,8 @@ export default {
5555

5656
return {
5757
form: this.data.formName,
58-
value: this.data.inputValue,
59-
name: this.data.inputName, // form input name where to set multiline content value.
58+
valueJson: this.data.inputValue,
59+
name: this.data.inputName,
6060
rowData: [],
6161
fieldData: this.data.fields || [],
6262
eventFields: this.data.eventFields || [],
@@ -72,7 +72,7 @@ export default {
7272
AtkMultilineBody: multilineBody,
7373
},
7474
mounted: function () {
75-
this.rowData = this.buildRowData(this.value ? this.value : '[]');
75+
this.rowData = this.buildRowData(this.valueJson ? this.valueJson : '[]');
7676
this.updateInputValue();
7777

7878
atk.eventBus.on(this.$root.$el.id + '-update-row', (payload) => {
@@ -112,7 +112,7 @@ export default {
112112
this.rowData.push(newRow);
113113
this.updateInputValue();
114114
if (this.data.afterAdd && typeof this.data.afterAdd === 'function') {
115-
this.data.afterAdd(JSON.parse(this.value));
115+
this.data.afterAdd(JSON.parse(this.valueJson));
116116
}
117117
this.fetchExpression(newRow.__atkml);
118118
this.fetchOnUpdateAction();
@@ -125,7 +125,7 @@ export default {
125125
this.updateInputValue();
126126
this.fetchOnUpdateAction();
127127
if (this.data.afterDelete && typeof this.data.afterDelete === 'function') {
128-
this.data.afterDelete(JSON.parse(this.value));
128+
this.data.afterDelete(JSON.parse(this.valueJson));
129129
}
130130
},
131131
onUpdate: function (atkmlId, fieldName, value) {
@@ -183,7 +183,7 @@ export default {
183183
* as JSON string.
184184
*/
185185
updateInputValue: function () {
186-
this.value = JSON.stringify(this.rowData);
186+
this.valueJson = JSON.stringify(this.rowData);
187187
},
188188
/**
189189
* Build rowData from JSON string.
@@ -213,7 +213,7 @@ export default {
213213
on: 'now',
214214
url: this.data.url,
215215
method: 'POST',
216-
data: { __atkml_action: 'on-change', rows: this.value },
216+
data: { __atkml_action: 'on-change', rows: this.valueJson },
217217
});
218218
}
219219
},
@@ -233,7 +233,7 @@ export default {
233233
fetchExpression: async function (atkmlId) {
234234
if (this.hasExpression()) {
235235
const row = this.findRow(atkmlId);
236-
// server will return expression field - value if define.
236+
// server will return expression field/value if defined
237237
if (row) {
238238
const resp = await this.postData(row);
239239
if (resp.expressions) {

‎js/src/vue-components/query-builder/fomantic-ui-group.component.vue

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,11 @@
11
<template>
22
<div
33
class="vqb-group ui fluid card"
4-
:class="[labels.spaceRule, 'depth-' + depth.toString()]"
4+
:class="[labels.spaceRule, 'depth-' + depth]"
55
>
66
<div
77
class="vbq-group-heading content"
8-
:class="'depth-' + depth.toString()"
8+
:class="'depth-' + depth"
99
>
1010
<div class="ui grid">
1111
<div class="fourteen wide column">

‎js/src/vue-components/query-builder/query-builder.component.vue

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@
44
:form="form"
55
:name="name"
66
type="hidden"
7-
:value="value"
7+
:value="valueJson"
88
>
99
<VueQueryBuilder
1010
v-model="query"
@@ -64,7 +64,7 @@ export default {
6464
};
6565
},
6666
computed: {
67-
value: function () {
67+
valueJson: function () {
6868
return JSON.stringify(this.query, null);
6969
},
7070
},

‎js/src/vue-components/share/atk-date-picker.js

Lines changed: 30 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -5,41 +5,51 @@
55
* https://github.com/ankurk91/vue-flatpickr-component
66
*
77
* Properties:
8-
* config: Any of flatpickr options
9-
*
10-
* Will emit a dateChange event when date is set.
8+
* config: Any of Flatpickr options
119
*/
1210
export default {
1311
name: 'AtkDatePicker',
14-
template: '<FlatpickrPicker v-model="date" :config="flatPickr" />',
15-
props: ['config', 'value'],
12+
template: `
13+
<FlatpickrPicker
14+
:config="flatPickr"
15+
:modelValue="getFlatpickrValue(modelValue)"
16+
@update:modelValue="onUpdate"
17+
/>`,
18+
props: ['config', 'modelValue'],
1619
data: function () {
17-
const { useDefault, ...fpickr } = this.config;
20+
const { useDefault, ...otherConfig } = this.config;
1821

19-
if (useDefault && !fpickr.defaultDate && !this.value) {
20-
fpickr.defaultDate = new Date();
21-
} else if (this.value) {
22-
fpickr.defaultDate = this.value;
22+
if (useDefault && !otherConfig.defaultDate && !this.modelValue) {
23+
otherConfig.defaultDate = new Date();
24+
} else if (this.modelValue) {
25+
otherConfig.defaultDate = this.modelValue;
2326
}
2427

25-
if (!fpickr.locale) {
26-
fpickr.locale = flatpickr.l10ns.default;
28+
if (!otherConfig.locale) {
29+
otherConfig.locale = flatpickr.l10ns.default;
2730
}
2831

2932
return {
30-
flatPickr: fpickr,
31-
date: null,
33+
flatPickr: otherConfig,
3234
};
3335
},
3436
emits: ['setDefault'],
3537
mounted: function () {
3638
// if value is not set but default date is, then emit proper string value to parent.
37-
if (!this.value && this.flatPickr.defaultDate) {
38-
if (this.flatPickr.defaultDate instanceof Date) {
39-
this.$emit('setDefault', flatpickr.formatDate(this.config.defaultDate, this.config.dateFormat));
40-
} else {
41-
this.$emit('setDefault', this.flatPickr.defaultDate);
42-
}
39+
if (!this.modelValue && this.flatPickr.defaultDate) {
40+
this.onUpdate(
41+
this.flatPickr.defaultDate instanceof Date
42+
? flatpickr.formatDate(this.config.defaultDate, this.config.dateFormat)
43+
: this.flatPickr.defaultDate
44+
);
4345
}
4446
},
47+
methods: {
48+
getFlatpickrValue: function (value) {
49+
return value;
50+
},
51+
onUpdate: function (value) {
52+
this.$emit('update:modelValue', value);
53+
},
54+
},
4555
};

‎js/src/vue-components/share/atk-lookup.js

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -26,12 +26,12 @@ export default {
2626
props: ['config', 'modelValue', 'optionalValue'],
2727
data: function () {
2828
const {
29-
url, reference, ...suiDropdown
29+
url, reference, ...otherConfig
3030
} = this.config;
31-
suiDropdown.selection = true;
31+
otherConfig.selection = true;
3232

3333
return {
34-
dropdownProps: suiDropdown,
34+
dropdownProps: otherConfig,
3535
url: url || null,
3636
isLoading: false,
3737
field: reference,

‎js/src/vue-components/tree-item-selector/tree-item-selector.component.js

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -265,7 +265,6 @@ export default {
265265
* Set input field with current mapped model value.
266266
*/
267267
setInput: function (value) {
268-
// console.log('set input');
269268
this.getInputElement().value = value;
270269
},
271270
/**

0 commit comments

Comments
 (0)