Skip to content

Commit 1f65850

Browse files
dunglasdunglas
authored
Merge pull request #176 from alOneh/vuejs-client-update
update the vue generator
2 parents 9b8b99a + 75dc4c2 commit 1f65850

37 files changed

+607
-495
lines changed

‎src/generators/VueGenerator.js‎

Lines changed: 0 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -9,27 +9,22 @@ export default class extends BaseGenerator {
99
// modules
1010
"store/modules/foo/index.js",
1111
"store/modules/foo/create/actions.js",
12-
"store/modules/foo/create/getters.js",
1312
"store/modules/foo/create/index.js",
1413
"store/modules/foo/create/mutation_types.js",
1514
"store/modules/foo/create/mutations.js",
1615
"store/modules/foo/delete/actions.js",
17-
"store/modules/foo/delete/getters.js",
1816
"store/modules/foo/delete/index.js",
1917
"store/modules/foo/delete/mutation_types.js",
2018
"store/modules/foo/delete/mutations.js",
2119
"store/modules/foo/list/actions.js",
22-
"store/modules/foo/list/getters.js",
2320
"store/modules/foo/list/index.js",
2421
"store/modules/foo/list/mutation_types.js",
2522
"store/modules/foo/list/mutations.js",
2623
"store/modules/foo/show/actions.js",
27-
"store/modules/foo/show/getters.js",
2824
"store/modules/foo/show/index.js",
2925
"store/modules/foo/show/mutation_types.js",
3026
"store/modules/foo/show/mutations.js",
3127
"store/modules/foo/update/actions.js",
32-
"store/modules/foo/update/getters.js",
3328
"store/modules/foo/update/index.js",
3429
"store/modules/foo/update/mutation_types.js",
3530
"store/modules/foo/update/mutations.js",
@@ -131,27 +126,22 @@ export const store = new Vuex.Store({
131126
// modules
132127
"store/modules/%s/index.js",
133128
"store/modules/%s/create/actions.js",
134-
"store/modules/%s/create/getters.js",
135129
"store/modules/%s/create/index.js",
136130
"store/modules/%s/create/mutation_types.js",
137131
"store/modules/%s/create/mutations.js",
138132
"store/modules/%s/delete/actions.js",
139-
"store/modules/%s/delete/getters.js",
140133
"store/modules/%s/delete/index.js",
141134
"store/modules/%s/delete/mutation_types.js",
142135
"store/modules/%s/delete/mutations.js",
143136
"store/modules/%s/list/actions.js",
144-
"store/modules/%s/list/getters.js",
145137
"store/modules/%s/list/index.js",
146138
"store/modules/%s/list/mutation_types.js",
147139
"store/modules/%s/list/mutations.js",
148140
"store/modules/%s/show/actions.js",
149-
"store/modules/%s/show/getters.js",
150141
"store/modules/%s/show/index.js",
151142
"store/modules/%s/show/mutation_types.js",
152143
"store/modules/%s/show/mutations.js",
153144
"store/modules/%s/update/actions.js",
154-
"store/modules/%s/update/getters.js",
155145
"store/modules/%s/update/index.js",
156146
"store/modules/%s/update/mutation_types.js",
157147
"store/modules/%s/update/mutations.js",

‎src/generators/VueGenerator.test.js‎

Lines changed: 0 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -52,9 +52,6 @@ test("Generate a Vue app", () => {
5252
expect(
5353
fs.existsSync(`${tmpobj.name}/store/modules/foo/${action}/actions.js`)
5454
).toBe(true);
55-
expect(
56-
fs.existsSync(`${tmpobj.name}/store/modules/foo/${action}/getters.js`)
57-
).toBe(true);
5855
expect(
5956
fs.existsSync(`${tmpobj.name}/store/modules/foo/${action}/index.js`)
6057
).toBe(true);

‎templates/quasar/common/store/update/actions.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -46,6 +46,6 @@ export const updateCommon = ({ commit, state }, values, { types }) => {
4646
}
4747

4848
// eslint-disable-next-line
49-
commit(commit(types.SET_ERROR, e.errors._error));
49+
commit(types.SET_ERROR, e.errors._error);
5050
});
5151
};

‎templates/vue/components/foo/Create.vue‎

Lines changed: 27 additions & 26 deletions
Original file line numberDiff line numberDiff line change
@@ -12,12 +12,11 @@
1212
role="alert">
1313
<span
1414
class="fa fa-exclamation-triangle"
15-
aria-hidden="true" /> \{{ error }}
15+
aria-hidden="true">\{{ error }}</span>
1616
</div>
1717

1818
<{{{titleUcFirst}}}Form
1919
:handle-submit="onSendForm"
20-
:handle-update-field="updateField"
2120
:values="item"
2221
:errors="violations" />
2322

@@ -28,52 +27,54 @@
2827
</template>
2928

3029
<script>
31-
import { createNamespacedHelpers } from 'vuex'
32-
import {{{titleUcFirst}}}Form from './Form'
30+
import { createHelpers } from 'vuex-map-fields';
31+
import { mapActions } from 'vuex';
32+
import {{{titleUcFirst}}}Form from './Form';
3333
34-
const { mapGetters, mapActions } = createNamespacedHelpers('{{{lc}}}/create')
34+
const { mapFields } = createHelpers({
35+
getterType: '{{{lc}}}/create/getField',
36+
mutationType: '{{{lc}}}/create/updateField',
37+
});
3538
3639
export default {
3740
components: {
38-
{{{titleUcFirst}}}Form
41+
{{{titleUcFirst}}}Form,
3942
},
4043
4144
data () {
4245
return {
43-
item: {}
44-
}
46+
item: {},
47+
};
4548
},
4649
47-
computed: mapGetters([
48-
'error',
49-
'isLoading',
50-
'created',
51-
'violations'
52-
]),
50+
computed: {
51+
...mapFields([
52+
'error',
53+
'isLoading',
54+
'created',
55+
'violations',
56+
]),
57+
},
5358
5459
watch: {
5560
// eslint-disable-next-line object-shorthand,func-names
56-
created: function (created) {
61+
created: function(created) {
5762
if (!created) {
58-
return
63+
return;
5964
}
6065
61-
this.$router.push({ name: '{{{titleUcFirst}}}Update', params: { id: created['@id'] } })
66+
this.$router.push({ name: '{{{titleUcFirst}}}Update', params: { id: created['@id'] } });
6267
}
6368
},
6469
6570
methods: {
66-
...mapActions([
67-
'create'
71+
...mapActions('{{{lc}}}/create', [
72+
'create',
6873
]),
6974
7075
onSendForm () {
71-
this.create(this.item)
76+
this.create(this.item);
7277
},
73-
74-
updateField (field, value) {
75-
Object.assign(this.item, { [field]: value })
76-
}
77-
}
78-
}
78+
},
79+
};
7980
</script>

‎templates/vue/components/foo/Form.vue‎

Lines changed: 71 additions & 34 deletions
Original file line numberDiff line numberDiff line change
@@ -5,21 +5,31 @@
55
<label
66
for="{{{../lc}}}_{{{name}}}"
77
class="form-control-label">{{{name}}}</label>
8-
<input
9-
id="{{{../lc}}}_{{{name}}}"
10-
v-model="item.{{{name}}}"
11-
:class="['form-control', isInvalid('{{{name}}}') ? 'is-invalid' : '']"
12-
type="{{{type}}}"
13-
{{#if step}}
14-
step="{{{step}}}"
15-
{{/if~}}
16-
{{#if required}}
17-
required="true"
18-
{{/if}}
19-
placeholder="{{{description}}}"
20-
@input="handleUpdateField('{{{name}}}', $event.target.value)">
8+
{{#if reference}}
9+
<select
10+
v-model="item.{{{name}}}"
11+
id="{{{../lc}}}_{{{name}}}"{{#unless maxCardinality}}
12+
multiple{{/unless}}
13+
class="form-control"
14+
>
15+
<option v-for="selectItem in {{{name}}}SelectItems"
16+
:key="selectItem['@id']"
17+
:value="selectItem['@id']"
18+
:selected="isSelected('{{{name}}}', selectItem['@id'])">\{{ selectItem.name }}
19+
</option>
20+
</select>
21+
{{else}}
22+
<input
23+
id="{{{../lc}}}_{{{name}}}"
24+
v-model="item.{{{name}}}"
25+
:class="['form-control', !isValid('{{{name}}}') ? 'is-invalid' : 'is-valid']"
26+
type="{{{type}}}"{{#if step}}
27+
step="{{{step}}}"{{/if}}{{#if required}}
28+
required="required"{{/if}}
29+
placeholder="{{{description}}}">
30+
{{/if}}
2131
<div
22-
v-if="isInvalid('{{{name}}}')"
32+
v-if="!isValid('{{{name}}}')"
2333
class="invalid-feedback">\{{ violations.{{{name}}} }}</div>
2434
</div>
2535
{{/each}}
@@ -31,49 +41,76 @@
3141
</template>
3242

3343
<script>
34-
export default {
44+
import { find, get, isUndefined } from 'lodash';
45+
import { mapFields } from 'vuex-map-fields';
46+
import { mapActions } from 'vuex';
47+
48+
export default {
3549
props: {
3650
handleSubmit: {
3751
type: Function,
38-
required: true
39-
},
40-
41-
handleUpdateField: {
42-
type: Function,
43-
required: true
52+
required: true,
4453
},
4554
4655
values: {
4756
type: Object,
48-
required: true
57+
required: true,
4958
},
5059
5160
errors: {
5261
type: Object,
53-
default: () => {}
62+
default: () => {},
5463
},
5564
5665
initialValues: {
5766
type: Object,
58-
default: () => {}
67+
default: () => {},
5968
}
6069
},
6170
71+
mounted() {
72+
{{#each formFields}}
73+
{{#if reference}}
74+
this.{{{name}}}GetSelectItems();
75+
{{/if}}
76+
{{/each}}
77+
},
78+
6279
computed: {
80+
{{#each formFields}}
81+
{{#if reference}}
82+
...mapFields('{{{name}}}/list', {
83+
'{{{name}}}SelectItems': 'selectItems',
84+
}),
85+
{{/if}}
86+
{{/each}}
87+
6388
// eslint-disable-next-line
64-
item () {
65-
return this.initialValues || this.values
89+
item() {
90+
return this.initialValues || this.values;
6691
},
6792
68-
violations () {
69-
return this.errors || {}
70-
}
93+
violations() {
94+
return this.errors || {};
95+
},
7196
},
7297
7398
methods: {
74-
isInvalid (key) {
75-
return Object.keys(this.violations).length > 0 && this.violations[key]
76-
}
77-
}
78-
}
99+
...mapActions({
100+
{{#each formFields}}
101+
{{#if reference}}
102+
{{{name}}}GetSelectItems: '{{{name}}}/list/getSelectItems',
103+
{{/if}}
104+
{{/each}}
105+
}),
106+
107+
isSelected(collection, id) {
108+
return find(this.item[collection], ['@id', id]) !== undefined;
109+
},
110+
111+
isValid(key) {
112+
return isUndefined(get(this.violations, key));
113+
},
114+
},
115+
};
79116
</script>

0 commit comments

Comments
 (0)