geer-builder 1.2.957 → 1.2.958
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.
- package/GUpdateProfile.vue +239 -166
- package/models/DB_CMS.js +9 -0
- package/package.json +1 -1
package/GUpdateProfile.vue
CHANGED
|
@@ -1,190 +1,263 @@
|
|
|
1
1
|
<template>
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
2
|
+
<div class="account-settings" v-if="this.user_info">
|
|
3
|
+
<g-header icon="fa fa-user-circle" title="Account Settings"
|
|
4
|
+
>Update information for your account</g-header
|
|
5
|
+
>
|
|
6
|
+
<div class="q-mt-md">
|
|
7
|
+
<g-card>
|
|
8
|
+
<q-form @submit="submitUpdateAccount()" class="q-pa-sm">
|
|
9
|
+
<div class="fieldset">
|
|
10
|
+
<div class="field">
|
|
11
|
+
<div class="field-label">Profile Picture</div>
|
|
12
|
+
<k-uploader
|
|
13
|
+
@input="submitUpdateAccount()"
|
|
14
|
+
:id="'profile_picture/' + user_info.uid"
|
|
15
|
+
filename="profile_picture"
|
|
16
|
+
v-model="form_data.profile_picture"
|
|
17
|
+
></k-uploader>
|
|
18
|
+
</div>
|
|
19
|
+
<div class="field">
|
|
20
|
+
<div class="field-label">Country *</div>
|
|
21
|
+
<q-select
|
|
22
|
+
option-label="name"
|
|
23
|
+
option-value="code"
|
|
24
|
+
:disable="is_submitting"
|
|
25
|
+
:options="country_options"
|
|
26
|
+
v-model="form_data.country"
|
|
27
|
+
dense
|
|
28
|
+
placeholder="Enter Last Name"
|
|
29
|
+
class="input"
|
|
30
|
+
outlined
|
|
31
|
+
stack-label
|
|
32
|
+
/>
|
|
33
|
+
</div>
|
|
34
|
+
<div class="field">
|
|
35
|
+
<div class="field-label">Contact Number</div>
|
|
36
|
+
<q-input
|
|
37
|
+
:disable="is_submitting"
|
|
38
|
+
v-model="form_data.contact_number"
|
|
39
|
+
dense
|
|
40
|
+
placeholder="Enter Contact Number"
|
|
41
|
+
class="input"
|
|
42
|
+
outlined
|
|
43
|
+
stack-label
|
|
44
|
+
/>
|
|
45
|
+
</div>
|
|
20
46
|
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
47
|
+
<div
|
|
48
|
+
class="beneficiary-holder"
|
|
49
|
+
v-if="beneficiary_form == true && slot_owned > 0"
|
|
50
|
+
>
|
|
51
|
+
<div class="title">BENEFICIARY INFORMATION</div>
|
|
52
|
+
<div class="field">
|
|
53
|
+
<div class="b-field">
|
|
54
|
+
<q-input
|
|
55
|
+
v-model="beneficiary.full_name"
|
|
56
|
+
dense
|
|
57
|
+
placeholder="Enter Beneficiary Full Name"
|
|
58
|
+
class="input"
|
|
59
|
+
outlined
|
|
60
|
+
stack-label
|
|
61
|
+
/>
|
|
62
|
+
</div>
|
|
63
|
+
<div class="b-field">
|
|
64
|
+
<q-input
|
|
65
|
+
v-model="beneficiary.contact_number"
|
|
66
|
+
dense
|
|
67
|
+
placeholder="Enter Beneficiary Contact Number"
|
|
68
|
+
class="input"
|
|
69
|
+
outlined
|
|
70
|
+
stack-label
|
|
71
|
+
/>
|
|
72
|
+
</div>
|
|
73
|
+
<div class="b-field">
|
|
74
|
+
<q-input
|
|
75
|
+
v-model="beneficiary.email"
|
|
76
|
+
dense
|
|
77
|
+
placeholder="Enter Beneficiary Email Address"
|
|
78
|
+
class="input"
|
|
79
|
+
outlined
|
|
80
|
+
stack-label
|
|
81
|
+
/>
|
|
82
|
+
</div>
|
|
83
|
+
<div class="b-field">
|
|
84
|
+
<q-input
|
|
85
|
+
v-model="beneficiary.relation"
|
|
86
|
+
dense
|
|
87
|
+
placeholder="Enter Relation to Member"
|
|
88
|
+
class="input"
|
|
89
|
+
outlined
|
|
90
|
+
stack-label
|
|
91
|
+
/>
|
|
92
|
+
</div>
|
|
93
|
+
</div>
|
|
94
|
+
<div class="row">
|
|
95
|
+
<div
|
|
96
|
+
class="col-12"
|
|
97
|
+
style="width: 93%; margin: 20px auto 10px auto"
|
|
98
|
+
>
|
|
99
|
+
<q-input
|
|
100
|
+
v-model="beneficiary.address"
|
|
101
|
+
dense
|
|
102
|
+
placeholder="Enter Beneficiary Address"
|
|
103
|
+
class="input"
|
|
104
|
+
outlined
|
|
105
|
+
stack-label
|
|
106
|
+
/>
|
|
107
|
+
</div>
|
|
108
|
+
</div>
|
|
109
|
+
</div>
|
|
43
110
|
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
111
|
+
<div class="field q-mt-sm">
|
|
112
|
+
<q-btn
|
|
113
|
+
:loading="is_submitting"
|
|
114
|
+
type="submit"
|
|
115
|
+
color="primary full-width"
|
|
116
|
+
unelevated
|
|
117
|
+
>Update Account</q-btn
|
|
118
|
+
>
|
|
119
|
+
</div>
|
|
120
|
+
</div>
|
|
121
|
+
</q-form>
|
|
122
|
+
</g-card>
|
|
55
123
|
</div>
|
|
124
|
+
</div>
|
|
125
|
+
<div v-else>
|
|
126
|
+
<span>You need to login to view this component.</span>
|
|
127
|
+
</div>
|
|
56
128
|
</template>
|
|
57
129
|
<script>
|
|
58
|
-
import GCard
|
|
59
|
-
import GHeader
|
|
60
|
-
import KUploader
|
|
61
|
-
import GlobalMixins
|
|
62
|
-
|
|
130
|
+
import GCard from "./components/GCard";
|
|
131
|
+
import GHeader from "./components/GHeader";
|
|
132
|
+
import KUploader from "./components/KUploader";
|
|
133
|
+
import GlobalMixins from "./mixins/global_mixins.js";
|
|
63
134
|
|
|
64
135
|
export default {
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
profile_picture : '',
|
|
85
|
-
gender : 'Male',
|
|
86
|
-
country : { name: 'Philippines', code: 'PH' },
|
|
87
|
-
},
|
|
88
|
-
gender_options : ['Male', 'Female'],
|
|
89
|
-
country_options : [{ name: 'Philippines', code: 'PH' }],
|
|
90
|
-
slot_owned: 0,
|
|
91
|
-
|
|
92
|
-
}),
|
|
93
|
-
async mounted()
|
|
94
|
-
{
|
|
95
|
-
let public_settings = await this.$_getData('public_settings');
|
|
96
|
-
|
|
97
|
-
if(this.user_info)
|
|
98
|
-
{
|
|
99
|
-
this.form_data.contact_number = this.user_info.contact_number;
|
|
100
|
-
this.form_data.profile_picture = this.user_info.profile_picture;
|
|
101
|
-
this.form_data.contact_number = this.user_info.contact_number;
|
|
102
|
-
if(this.user_info.hasOwnProperty('slot_owned')){
|
|
103
|
-
this.slot_owned = this.user_info.slot_owned;
|
|
104
|
-
}
|
|
105
|
-
}
|
|
106
|
-
if(public_settings.hasOwnProperty('beneficiary_form') && public_settings.beneficiary_form == true){
|
|
107
|
-
if(this.user_info.hasOwnProperty('beneficiary_status') && this.user_info.beneficiary_status == true){
|
|
108
|
-
this.beneficiary_form = false;
|
|
109
|
-
}else{
|
|
110
|
-
this.beneficiary_form = true;
|
|
111
|
-
}
|
|
112
|
-
}
|
|
113
|
-
|
|
136
|
+
components: { GCard, GHeader, KUploader },
|
|
137
|
+
mixins: [GlobalMixins],
|
|
138
|
+
data: () => ({
|
|
139
|
+
beneficiary_form: false,
|
|
140
|
+
beneficiary: {
|
|
141
|
+
full_name: "",
|
|
142
|
+
contact_number: "",
|
|
143
|
+
email: "",
|
|
144
|
+
relation: "",
|
|
145
|
+
address: "",
|
|
146
|
+
},
|
|
147
|
+
is_update_profile_dialog_open: false,
|
|
148
|
+
is_submitting: false,
|
|
149
|
+
change_password_dialog: false,
|
|
150
|
+
form_data: {
|
|
151
|
+
contact_number: "",
|
|
152
|
+
profile_picture: "",
|
|
153
|
+
gender: "Male",
|
|
154
|
+
country: { name: "Philippines", code: "PH" },
|
|
114
155
|
},
|
|
115
|
-
|
|
116
|
-
{
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
156
|
+
gender_options: ["Male", "Female"],
|
|
157
|
+
country_options: [{ name: "Philippines", code: "PH" }],
|
|
158
|
+
slot_owned: 0,
|
|
159
|
+
}),
|
|
160
|
+
async mounted() {
|
|
161
|
+
let public_settings = await this.$_getData("public_settings");
|
|
120
162
|
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
this.is_submitting = false;
|
|
129
|
-
}
|
|
130
|
-
catch (error)
|
|
131
|
-
{
|
|
132
|
-
this.is_submitting = false;
|
|
133
|
-
this.$q.dialog({ title: `Something's not quite right`, message: error.message });
|
|
134
|
-
}
|
|
135
|
-
},
|
|
136
|
-
async changePassword()
|
|
137
|
-
{
|
|
138
|
-
this.change_password_dialog=true;
|
|
139
|
-
}
|
|
163
|
+
if (this.user_info) {
|
|
164
|
+
this.form_data.contact_number = this.user_info.contact_number;
|
|
165
|
+
this.form_data.profile_picture = this.user_info.profile_picture;
|
|
166
|
+
this.form_data.contact_number = this.user_info.contact_number;
|
|
167
|
+
if (this.user_info.hasOwnProperty("slot_owned")) {
|
|
168
|
+
this.slot_owned = this.user_info.slot_owned;
|
|
169
|
+
}
|
|
140
170
|
}
|
|
141
|
-
|
|
171
|
+
if (
|
|
172
|
+
public_settings.hasOwnProperty("beneficiary_form") &&
|
|
173
|
+
public_settings.beneficiary_form == true
|
|
174
|
+
) {
|
|
175
|
+
if (
|
|
176
|
+
this.user_info.hasOwnProperty("beneficiary_status") &&
|
|
177
|
+
this.user_info.beneficiary_status == true
|
|
178
|
+
) {
|
|
179
|
+
this.beneficiary_form = false;
|
|
180
|
+
} else {
|
|
181
|
+
this.beneficiary_form = true;
|
|
182
|
+
}
|
|
183
|
+
}
|
|
184
|
+
},
|
|
185
|
+
methods: {
|
|
186
|
+
async submitUpdateAccount() {
|
|
187
|
+
this.is_submitting = true;
|
|
188
|
+
|
|
189
|
+
try {
|
|
190
|
+
if (this.beneficiary_form == true) {
|
|
191
|
+
this.form_data.beneficiary_detail = this.beneficiary;
|
|
192
|
+
}
|
|
193
|
+
this.code_info = await this.$_fbCall(
|
|
194
|
+
"memberUpdateProfile",
|
|
195
|
+
this.form_data,
|
|
196
|
+
);
|
|
197
|
+
this.$q.dialog({
|
|
198
|
+
title: `Success!`,
|
|
199
|
+
message: "Profile has been succesfully updated.",
|
|
200
|
+
html: true,
|
|
201
|
+
});
|
|
202
|
+
this.is_submitting = false;
|
|
203
|
+
} catch (error) {
|
|
204
|
+
this.is_submitting = false;
|
|
205
|
+
this.$q.dialog({
|
|
206
|
+
title: `Something's not quite right`,
|
|
207
|
+
message: error.message,
|
|
208
|
+
});
|
|
209
|
+
}
|
|
210
|
+
},
|
|
211
|
+
async changePassword() {
|
|
212
|
+
this.change_password_dialog = true;
|
|
213
|
+
},
|
|
214
|
+
},
|
|
215
|
+
};
|
|
142
216
|
</script>
|
|
143
217
|
|
|
144
218
|
<style lang="scss">
|
|
145
219
|
.account-settings {
|
|
146
|
-
|
|
147
|
-
|
|
220
|
+
.fieldset {
|
|
221
|
+
padding: 10px 10px;
|
|
148
222
|
|
|
149
|
-
|
|
150
|
-
|
|
223
|
+
.field {
|
|
224
|
+
padding: 5px 20px;
|
|
151
225
|
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
input {
|
|
226
|
+
&-label {
|
|
227
|
+
color: #aaa;
|
|
228
|
+
margin-bottom: 5px;
|
|
229
|
+
}
|
|
158
230
|
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
|
|
164
|
-
color: #ccc;
|
|
165
|
-
}
|
|
231
|
+
input {
|
|
232
|
+
&::-webkit-input-placeholder {
|
|
233
|
+
/* Edge */
|
|
234
|
+
color: #ccc;
|
|
235
|
+
}
|
|
166
236
|
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
|
|
170
|
-
}
|
|
171
|
-
|
|
237
|
+
&:-ms-input-placeholder {
|
|
238
|
+
/* Internet Explorer 10-11 */
|
|
239
|
+
color: #ccc;
|
|
172
240
|
}
|
|
173
|
-
.beneficiary-holder{
|
|
174
|
-
.title{
|
|
175
|
-
font-weight: bold;
|
|
176
|
-
margin: 10px auto;
|
|
177
|
-
}
|
|
178
|
-
.field{
|
|
179
|
-
display: grid;
|
|
180
|
-
grid-template-columns: 1fr 1fr;
|
|
181
|
-
grid-column-gap: 10px;
|
|
182
|
-
grid-row-gap: 20px;
|
|
183
|
-
.b-field{
|
|
184
241
|
|
|
185
|
-
|
|
186
|
-
|
|
242
|
+
&::placeholder {
|
|
243
|
+
color: #ccc;
|
|
244
|
+
}
|
|
245
|
+
}
|
|
246
|
+
}
|
|
247
|
+
.beneficiary-holder {
|
|
248
|
+
.title {
|
|
249
|
+
font-weight: bold;
|
|
250
|
+
margin: 10px auto;
|
|
251
|
+
}
|
|
252
|
+
.field {
|
|
253
|
+
display: grid;
|
|
254
|
+
grid-template-columns: 1fr 1fr;
|
|
255
|
+
grid-column-gap: 10px;
|
|
256
|
+
grid-row-gap: 20px;
|
|
257
|
+
.b-field {
|
|
187
258
|
}
|
|
259
|
+
}
|
|
188
260
|
}
|
|
261
|
+
}
|
|
189
262
|
}
|
|
190
|
-
</style>
|
|
263
|
+
</style>
|
package/models/DB_CMS.js
ADDED