Skip to content

Commit 2bee1df

Browse files
uswebkuswebk
committed
[refactor] Dialog Layout
1 parent 4332991 commit 2bee1df

File tree

8 files changed

+126
-49
lines changed

8 files changed

+126
-49
lines changed

‎frontend/components/account/NewDialog.vue‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -108,6 +108,7 @@ export default {
108108
...mapActions('account', ['storeAccount', 'sendMessage']),
109109
close() {
110110
this.errors = {}
111+
this.resetForm()
111112
this.$emit('close')
112113
},
113114
resetForm() {

‎frontend/components/client/NewDialog.vue‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -106,6 +106,7 @@ export default {
106106
...mapActions('client', ['storeClient', 'sendMessage']),
107107
close() {
108108
this.errors = {}
109+
this.resetForm()
109110
this.$emit('close')
110111
},
111112
resetForm() {

‎frontend/components/dealing/NewDialog.vue‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -140,14 +140,15 @@ export default {
140140
return this.isOpen
141141
},
142142
set() {
143-
this.errors = {}
144143
this.close()
145144
},
146145
},
147146
},
148147
methods: {
149148
...mapActions('dealing', ['storeDealing', 'sendMessage']),
150149
close() {
150+
this.errors = {}
151+
this.resetForm()
151152
this.$emit('close')
152153
},
153154
resetForm() {

‎frontend/components/dns/NewDialog.vue‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -124,6 +124,7 @@ export default {
124124
...mapActions('dns', ['storeDns', 'sendMessage']),
125125
close() {
126126
this.errors = {}
127+
this.resetForm()
127128
this.$emit('close')
128129
},
129130
resetForm() {

‎frontend/components/domain/NewDialog.vue‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -138,6 +138,7 @@ export default {
138138
...mapActions('domain', ['storeDomain', 'sendMessage']),
139139
close() {
140140
this.errors = {}
141+
this.resetForm()
141142
this.$emit('close')
142143
},
143144
resetForm() {

‎frontend/components/registrar/NewDialog.vue‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -84,6 +84,7 @@ export default {
8484
...mapActions('registrar', ['storeRegistrar', 'sendMessage']),
8585
close() {
8686
this.errors = {}
87+
this.resetForm()
8788
this.$emit('close')
8889
},
8990
resetForm() {

‎frontend/components/role/NewDialog.vue‎

Lines changed: 60 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -10,30 +10,59 @@
1010
<span class="text-h6">Role Create</span>
1111
</v-card-title>
1212
<v-card-text>
13-
<v-container v-if="!loading">
14-
<v-form ref="form" lazy-validation>
15-
<v-row>
16-
<v-col cols="12">
17-
<v-text-field
18-
v-model="roleModel.name"
19-
label="Role Name"
20-
required
21-
:error-messages="errors.name"
22-
></v-text-field>
23-
</v-col>
24-
<div class="my-10"></div>
25-
<v-col v-for="roleItem in roleItems" :key="roleItem.id" cols="6">
26-
<v-switch
27-
v-model="roleModel.roles[roleItem.id]"
28-
:label="roleItem.description"
13+
<v-form ref="form" lazy-validation>
14+
<v-row justify="start">
15+
<v-col cols="4">
16+
<v-row>
17+
<v-col>
18+
<v-text-field
19+
v-model="roleModel.name"
20+
label="Role Name"
21+
required
22+
:error-messages="errors.name"
23+
></v-text-field>
24+
</v-col>
25+
</v-row>
26+
<v-row>
27+
<v-col>
28+
<v-btn color="primary" @click="store">Create</v-btn>
29+
<v-btn @click="close">Close</v-btn>
30+
</v-col>
31+
</v-row>
32+
</v-col>
33+
<v-divider vertical></v-divider>
34+
<v-col cols="8" class="px-10">
35+
<v-row>
36+
<v-col cols="12" class="py-0">
37+
<v-switch
38+
v-model="isAllSelect"
39+
color="indigo"
40+
label="All"
41+
@click="toggleSwitch"
42+
>
43+
</v-switch>
44+
<v-divider></v-divider>
45+
</v-col>
46+
<v-col
47+
v-for="roleItem in roleItems"
48+
:key="roleItem.id"
49+
cols="3"
2950
>
30-
</v-switch>
31-
</v-col>
32-
</v-row>
33-
<div class="my-5"></div>
34-
<v-btn color="primary" @click="store">Create</v-btn>
35-
</v-form>
36-
</v-container>
51+
<v-switch
52+
v-model="roleModel.roles[roleItem.id]"
53+
:label="roleItem.description"
54+
>
55+
<template #label
56+
><span class="text-caption font-weight-bold">
57+
{{ roleItem.description }}</span
58+
></template
59+
>
60+
</v-switch>
61+
</v-col>
62+
</v-row>
63+
</v-col>
64+
</v-row>
65+
</v-form>
3766
</v-card-text>
3867
<v-card-actions>
3968
<v-spacer></v-spacer>
@@ -58,6 +87,7 @@ export default {
5887
data() {
5988
return {
6089
loading: false,
90+
isAllSelect: false,
6191
roleModel: {
6292
name: '',
6393
roles: {},
@@ -80,13 +110,14 @@ export default {
80110
...mapActions('account', ['sendMessage']),
81111
...mapActions('role', ['storeRole']),
82112
close() {
113+
this.resetForm()
83114
this.errors = {}
84115
this.$emit('close')
85116
},
86117
resetForm() {
87118
this.roleModel = {
88119
name: '',
89-
roles: [],
120+
roles: {},
90121
}
91122
},
92123
async store() {
@@ -126,6 +157,11 @@ export default {
126157
this.close()
127158
this.loading = false
128159
},
160+
toggleSwitch() {
161+
for (const key in this.roleItems) {
162+
this.roleModel.roles[this.roleItems[key].id] = this.isAllSelect
163+
}
164+
},
129165
},
130166
}
131167
</script>

‎frontend/components/role/UpdateDialog.vue‎

Lines changed: 59 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -7,33 +7,62 @@
77
indeterminate
88
></v-progress-linear>
99
<v-card-title class="pl-8">
10-
<span class="text-h6"> Account Edit</span>
10+
<span class="text-h6">Role Edit</span>
1111
</v-card-title>
1212
<v-card-text>
13-
<v-container>
14-
<v-form ref="form" lazy-validation>
15-
<v-row>
16-
<v-col cols="12">
17-
<v-text-field
18-
v-model="roleModel.name"
19-
label="Role Name"
20-
required
21-
:error-messages="errors.name"
22-
></v-text-field>
23-
</v-col>
24-
<div class="my-10"></div>
25-
<v-col v-for="roleItem in roleItems" :key="roleItem.id" cols="6">
26-
<v-switch
27-
v-model="roleModel.roles[roleItem.id]"
28-
:label="roleItem.description"
13+
<v-form ref="form" lazy-validation>
14+
<v-row justify="start">
15+
<v-col cols="4">
16+
<v-row>
17+
<v-col>
18+
<v-text-field
19+
v-model="roleModel.name"
20+
label="Role Name"
21+
required
22+
:error-messages="errors.name"
23+
></v-text-field>
24+
</v-col>
25+
</v-row>
26+
<v-row>
27+
<v-col>
28+
<v-btn color="primary" @click="update">Update</v-btn>
29+
<v-btn @click="close">Close</v-btn>
30+
</v-col>
31+
</v-row>
32+
</v-col>
33+
<v-divider vertical></v-divider>
34+
<v-col cols="8" class="px-10">
35+
<v-row>
36+
<v-col cols="12" class="py-0">
37+
<v-switch
38+
v-model="isAllSelect"
39+
color="indigo"
40+
label="All"
41+
@click="toggleSwitch"
42+
>
43+
</v-switch>
44+
<v-divider></v-divider>
45+
</v-col>
46+
<v-col
47+
v-for="roleItem in roleItems"
48+
:key="roleItem.id"
49+
cols="3"
2950
>
30-
</v-switch>
31-
</v-col>
32-
</v-row>
33-
<div class="my-5"></div>
34-
<v-btn color="primary" @click="update">Update</v-btn>
35-
</v-form>
36-
</v-container>
51+
<v-switch
52+
v-model="roleModel.roles[roleItem.id]"
53+
:label="roleItem.description"
54+
>
55+
<template #label
56+
><span class="text-caption font-weight-bold">
57+
{{ roleItem.description }}</span
58+
></template
59+
>
60+
</v-switch>
61+
</v-col>
62+
</v-row>
63+
</v-col>
64+
</v-row>
65+
</v-form>
3766
</v-card-text>
3867
<v-card-actions>
3968
<v-spacer></v-spacer>
@@ -62,6 +91,7 @@ export default {
6291
},
6392
data() {
6493
return {
94+
isAllSelect: false,
6595
loading: false,
6696
errors: {},
6797
}
@@ -123,6 +153,11 @@ export default {
123153
this.close()
124154
this.loading = false
125155
},
156+
toggleSwitch() {
157+
for (const key in this.roleItems) {
158+
this.roleModel.roles[this.roleItems[key].id] = this.isAllSelect
159+
}
160+
},
126161
},
127162
}
128163
</script>

0 commit comments

Comments
 (0)