Add speedbumps for delete, set preferred email/phone in profile view
This commit is contained in:
parent
b87b1a3801
commit
d05458c7fb
|
@ -341,23 +341,21 @@
|
|||
</header>
|
||||
|
||||
<section class="modal-card-body">
|
||||
<b-field grouped>
|
||||
|
||||
<b-field label="Type" expanded>
|
||||
<b-select v-model="editPhoneType" expanded>
|
||||
<option v-for="option in phoneTypeOptions"
|
||||
:key="option.value"
|
||||
:value="option.value">
|
||||
{{ option.label }}
|
||||
</option>
|
||||
</b-select>
|
||||
</b-field>
|
||||
<b-field label="Type">
|
||||
<b-select v-model="editPhoneType">
|
||||
<option v-for="option in phoneTypeOptions"
|
||||
:key="option.value"
|
||||
:value="option.value">
|
||||
{{ option.label }}
|
||||
</option>
|
||||
</b-select>
|
||||
</b-field>
|
||||
|
||||
<b-field label="Number" expanded>
|
||||
<b-input v-model.trim="editPhoneNumber"
|
||||
ref="editPhoneInput">
|
||||
</b-input>
|
||||
</b-field>
|
||||
<b-field label="Number">
|
||||
<b-input v-model.trim="editPhoneNumber"
|
||||
ref="editPhoneInput"
|
||||
expanded />
|
||||
</b-field>
|
||||
|
||||
<b-field label="Preferred?">
|
||||
|
@ -439,6 +437,72 @@
|
|||
|
||||
</${b}-table>
|
||||
|
||||
<${b}-modal has-modal-card
|
||||
% if request.use_oruga:
|
||||
v-model:active="deletePhoneShowDialog"
|
||||
% else:
|
||||
:active.sync="deletePhoneShowDialog"
|
||||
% endif
|
||||
>
|
||||
<div class="modal-card">
|
||||
|
||||
<header class="modal-card-head">
|
||||
<p class="modal-card-title">Delete Phone</p>
|
||||
</header>
|
||||
|
||||
<section class="modal-card-body">
|
||||
<p class="block">Really delete this phone number?</p>
|
||||
<p class="block has-text-weight-bold">{{ deletePhoneNumber }}</p>
|
||||
</section>
|
||||
|
||||
<footer class="modal-card-foot">
|
||||
<b-button type="is-danger"
|
||||
@click="deletePhoneSave()"
|
||||
:disabled="deletePhoneSaving"
|
||||
icon-pack="fas"
|
||||
icon-left="trash">
|
||||
{{ deletePhoneSaving ? "Working, please wait..." : "Delete" }}
|
||||
</b-button>
|
||||
<b-button @click="deletePhoneShowDialog = false">
|
||||
Cancel
|
||||
</b-button>
|
||||
</footer>
|
||||
</div>
|
||||
</${b}-modal>
|
||||
|
||||
<${b}-modal has-modal-card
|
||||
% if request.use_oruga:
|
||||
v-model:active="preferPhoneShowDialog"
|
||||
% else:
|
||||
:active.sync="preferPhoneShowDialog"
|
||||
% endif
|
||||
>
|
||||
<div class="modal-card">
|
||||
|
||||
<header class="modal-card-head">
|
||||
<p class="modal-card-title">Set Preferred Phone</p>
|
||||
</header>
|
||||
|
||||
<section class="modal-card-body">
|
||||
<p class="block">Really make this the preferred phone number?</p>
|
||||
<p class="block has-text-weight-bold">{{ preferPhoneNumber }}</p>
|
||||
</section>
|
||||
|
||||
<footer class="modal-card-foot">
|
||||
<b-button type="is-primary"
|
||||
@click="preferPhoneSave()"
|
||||
:disabled="preferPhoneSaving"
|
||||
icon-pack="fas"
|
||||
icon-left="save">
|
||||
{{ preferPhoneSaving ? "Working, please wait..." : "Set Preferred" }}
|
||||
</b-button>
|
||||
<b-button @click="preferPhoneShowDialog = false">
|
||||
Cancel
|
||||
</b-button>
|
||||
</footer>
|
||||
</div>
|
||||
</${b}-modal>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
@ -477,24 +541,21 @@
|
|||
</header>
|
||||
|
||||
<section class="modal-card-body">
|
||||
<b-field grouped>
|
||||
|
||||
<b-field label="Type" expanded>
|
||||
<b-select v-model="editEmailType" expanded>
|
||||
<option v-for="option in emailTypeOptions"
|
||||
:key="option.value"
|
||||
:value="option.value">
|
||||
{{ option.label }}
|
||||
</option>
|
||||
</b-select>
|
||||
</b-field>
|
||||
|
||||
<b-field label="Address" expanded>
|
||||
<b-input v-model.trim="editEmailAddress"
|
||||
ref="editEmailInput">
|
||||
</b-input>
|
||||
</b-field>
|
||||
<b-field label="Type">
|
||||
<b-select v-model="editEmailType">
|
||||
<option v-for="option in emailTypeOptions"
|
||||
:key="option.value"
|
||||
:value="option.value">
|
||||
{{ option.label }}
|
||||
</option>
|
||||
</b-select>
|
||||
</b-field>
|
||||
|
||||
<b-field label="Address">
|
||||
<b-input v-model.trim="editEmailAddress"
|
||||
ref="editEmailInput"
|
||||
expanded />
|
||||
</b-field>
|
||||
|
||||
<b-field v-if="!editEmailUUID"
|
||||
|
@ -590,6 +651,72 @@
|
|||
|
||||
</${b}-table>
|
||||
|
||||
<${b}-modal has-modal-card
|
||||
% if request.use_oruga:
|
||||
v-model:active="deleteEmailShowDialog"
|
||||
% else:
|
||||
:active.sync="deleteEmailShowDialog"
|
||||
% endif
|
||||
>
|
||||
<div class="modal-card">
|
||||
|
||||
<header class="modal-card-head">
|
||||
<p class="modal-card-title">Delete Email</p>
|
||||
</header>
|
||||
|
||||
<section class="modal-card-body">
|
||||
<p class="block">Really delete this email address?</p>
|
||||
<p class="block has-text-weight-bold">{{ deleteEmailAddress }}</p>
|
||||
</section>
|
||||
|
||||
<footer class="modal-card-foot">
|
||||
<b-button type="is-danger"
|
||||
@click="deleteEmailSave()"
|
||||
:disabled="deleteEmailSaving"
|
||||
icon-pack="fas"
|
||||
icon-left="trash">
|
||||
{{ deleteEmailSaving ? "Working, please wait..." : "Delete" }}
|
||||
</b-button>
|
||||
<b-button @click="deleteEmailShowDialog = false">
|
||||
Cancel
|
||||
</b-button>
|
||||
</footer>
|
||||
</div>
|
||||
</${b}-modal>
|
||||
|
||||
<${b}-modal has-modal-card
|
||||
% if request.use_oruga:
|
||||
v-model:active="preferEmailShowDialog"
|
||||
% else:
|
||||
:active.sync="preferEmailShowDialog"
|
||||
% endif
|
||||
>
|
||||
<div class="modal-card">
|
||||
|
||||
<header class="modal-card-head">
|
||||
<p class="modal-card-title">Set Preferred Email</p>
|
||||
</header>
|
||||
|
||||
<section class="modal-card-body">
|
||||
<p class="block">Really make this the preferred email address?</p>
|
||||
<p class="block has-text-weight-bold">{{ preferEmailAddress }}</p>
|
||||
</section>
|
||||
|
||||
<footer class="modal-card-foot">
|
||||
<b-button type="is-primary"
|
||||
@click="preferEmailSave()"
|
||||
:disabled="preferEmailSaving"
|
||||
icon-pack="fas"
|
||||
icon-left="save">
|
||||
{{ preferEmailSaving ? "Working, please wait..." : "Set Preferred" }}
|
||||
</b-button>
|
||||
<b-button @click="preferEmailShowDialog = false">
|
||||
Cancel
|
||||
</b-button>
|
||||
</footer>
|
||||
</div>
|
||||
</${b}-modal>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
@ -1657,6 +1784,16 @@
|
|||
editPhonePreferred: false,
|
||||
editPhoneSaving: false,
|
||||
|
||||
deletePhoneShowDialog: false,
|
||||
deletePhoneUUID: null,
|
||||
deletePhoneNumber: null,
|
||||
deletePhoneSaving: false,
|
||||
|
||||
preferPhoneShowDialog: false,
|
||||
preferPhoneUUID: null,
|
||||
preferPhoneNumber: null,
|
||||
preferPhoneSaving: false,
|
||||
|
||||
editEmailShowDialog: false,
|
||||
editEmailUUID: null,
|
||||
editEmailType: null,
|
||||
|
@ -1664,6 +1801,17 @@
|
|||
editEmailPreferred: null,
|
||||
editEmailInvalid: false,
|
||||
editEmailSaving: false,
|
||||
|
||||
deleteEmailShowDialog: false,
|
||||
deleteEmailUUID: null,
|
||||
deleteEmailAddress: null,
|
||||
deleteEmailSaving: false,
|
||||
|
||||
preferEmailShowDialog: false,
|
||||
preferEmailUUID: null,
|
||||
preferEmailAddress: null,
|
||||
preferEmailSaving: false,
|
||||
|
||||
% endif
|
||||
}
|
||||
|
||||
|
@ -1843,26 +1991,47 @@
|
|||
},
|
||||
|
||||
deletePhoneInit(phone) {
|
||||
this.deletePhoneUUID = phone.uuid
|
||||
this.deletePhoneNumber = phone.number
|
||||
this.deletePhoneShowDialog = true
|
||||
},
|
||||
|
||||
deletePhoneSave() {
|
||||
this.deletePhoneSaving = true
|
||||
let url = '${url('people.profile_delete_phone', uuid=person.uuid)}'
|
||||
let params = {
|
||||
phone_uuid: phone.uuid,
|
||||
phone_uuid: this.deletePhoneUUID,
|
||||
}
|
||||
|
||||
this.simplePOST(url, params, response => {
|
||||
this.$emit('profile-changed', response.data)
|
||||
this.refreshTab()
|
||||
this.deletePhoneShowDialog = false
|
||||
this.deletePhoneSaving = false
|
||||
}, response => {
|
||||
this.deletePhoneSaving = false
|
||||
})
|
||||
},
|
||||
|
||||
preferPhoneInit(phone) {
|
||||
this.preferPhoneUUID = phone.uuid
|
||||
this.preferPhoneNumber = phone.number
|
||||
this.preferPhoneShowDialog = true
|
||||
},
|
||||
|
||||
preferPhoneSave() {
|
||||
this.preferPhoneSaving = true
|
||||
let url = '${url('people.profile_set_preferred_phone', uuid=person.uuid)}'
|
||||
let params = {
|
||||
phone_uuid: phone.uuid,
|
||||
phone_uuid: this.preferPhoneUUID,
|
||||
}
|
||||
|
||||
this.simplePOST(url, params, response => {
|
||||
this.$emit('profile-changed', response.data)
|
||||
this.refreshTab()
|
||||
this.preferPhoneShowDialog = false
|
||||
this.preferPhoneSaving = false
|
||||
}, response => {
|
||||
this.preferPhoneSaving = false
|
||||
})
|
||||
},
|
||||
|
||||
|
@ -1917,26 +2086,47 @@
|
|||
},
|
||||
|
||||
deleteEmailInit(email) {
|
||||
this.deleteEmailUUID = email.uuid
|
||||
this.deleteEmailAddress = email.address
|
||||
this.deleteEmailShowDialog = true
|
||||
},
|
||||
|
||||
deleteEmailSave() {
|
||||
this.deleteEmailSaving = true
|
||||
let url = '${url('people.profile_delete_email', uuid=person.uuid)}'
|
||||
let params = {
|
||||
email_uuid: email.uuid,
|
||||
email_uuid: this.deleteEmailUUID,
|
||||
}
|
||||
|
||||
this.simplePOST(url, params, response => {
|
||||
this.$emit('profile-changed', response.data)
|
||||
this.refreshTab()
|
||||
this.deleteEmailShowDialog = false
|
||||
this.deleteEmailSaving = false
|
||||
}, response => {
|
||||
this.deleteEmailSaving = false
|
||||
})
|
||||
},
|
||||
|
||||
preferEmailInit(email) {
|
||||
this.preferEmailUUID = email.uuid
|
||||
this.preferEmailAddress = email.address
|
||||
this.preferEmailShowDialog = true
|
||||
},
|
||||
|
||||
preferEmailSave() {
|
||||
this.preferEmailSaving = true
|
||||
let url = '${url('people.profile_set_preferred_email', uuid=person.uuid)}'
|
||||
let params = {
|
||||
email_uuid: email.uuid,
|
||||
email_uuid: this.preferEmailUUID,
|
||||
}
|
||||
|
||||
this.simplePOST(url, params, response => {
|
||||
this.$emit('profile-changed', response.data)
|
||||
this.refreshTab()
|
||||
this.preferEmailShowDialog = false
|
||||
this.preferEmailSaving = false
|
||||
}, response => {
|
||||
this.preferEmailSaving = false
|
||||
})
|
||||
},
|
||||
|
||||
|
|
|
@ -365,7 +365,10 @@
|
|||
// TODO: this does not always work right?
|
||||
this.$refs.input.$el.querySelector('textarea').focus()
|
||||
} else {
|
||||
this.$refs.input.$el.querySelector('input').focus()
|
||||
// TODO: pretty sure we can rely on the <o-input> focus()
|
||||
// here, but not sure why we weren't already doing that?
|
||||
//this.$refs.input.$el.querySelector('input').focus()
|
||||
this.$refs.input.focus()
|
||||
}
|
||||
},
|
||||
},
|
||||
|
|
Loading…
Reference in a new issue