Improve phone/email handling when making new custorder

still needs more improvement, but this is a start
This commit is contained in:
Lance Edgar 2021-09-27 18:04:07 -04:00
parent 82074a37ba
commit ad6562558d
2 changed files with 259 additions and 70 deletions

View file

@ -107,19 +107,24 @@
</b-radio> </b-radio>
</div> </div>
<div v-show="contactIsKnown"> <div v-show="contactIsKnown"
<b-field label="Customer" horizontal> style="padding-left: 10rem;">
<tailbone-autocomplete ref="contactAutocomplete"
v-model="contactUUID" <b-field label="Customer" grouped>
placeholder="Enter name or phone number" <b-field style="margin-left: 1rem;""
:initial-label="contactDisplay" :expanded="!contactUUID">
% if new_order_requires_customer: <tailbone-autocomplete ref="contactAutocomplete"
serviceUrl="${url('{}.customer_autocomplete'.format(route_prefix))}" v-model="contactUUID"
% else: placeholder="Enter name or phone number"
serviceUrl="${url('{}.person_autocomplete'.format(route_prefix))}" :initial-label="contactDisplay"
% endif % if new_order_requires_customer:
@input="contactChanged"> serviceUrl="${url('{}.customer_autocomplete'.format(route_prefix))}"
</tailbone-autocomplete> % else:
serviceUrl="${url('{}.person_autocomplete'.format(route_prefix))}"
% endif
@input="contactChanged">
</tailbone-autocomplete>
</b-field>
<b-button v-if="contactUUID && contactProfileURL" <b-button v-if="contactUUID && contactProfileURL"
type="is-primary" type="is-primary"
tag="a" target="_blank" tag="a" target="_blank"
@ -129,23 +134,111 @@
View Profile View Profile
</b-button> </b-button>
</b-field> </b-field>
<b-field label="Phone Number" horizontal
v-show="contactUUID"> <b-field grouped v-show="contactUUID"
{{ phoneNumberEntry }} style="margin-top: 2rem;">
## <b-input v-model="phoneNumberEntry"
## @input="phoneNumberChanged" <b-field label="Phone Number"
## @keydown.native="phoneNumberKeyDown"> style="margin-right: 3rem;">
## </b-input> <div class="level">
## <b-button v-if="!phoneNumberSaved" <div class="level-left">
## type="is-primary" <div class="level-item">
## icon-pack="fas" {{ orderPhoneNumber }}
## icon-left="fas fa-save" </div>
## @click="setContactData()"> <div class="level-item">
## Please save when finished editing <b-button type="is-primary"
## </b-button> @click="editPhoneNumberInit()"
## <!-- <tailbone-autocomplete --> icon-pack="fas"
## <!-- serviceUrl="${url('customers.autocomplete.phone')}"> --> icon-left="edit">
## <!-- </tailbone-autocomplete> --> Edit
</b-button>
<b-modal has-modal-card
:active.sync="editPhoneNumberShowDialog">
<div class="modal-card">
<header class="modal-card-head">
<p class="modal-card-title">Edit Phone Number</p>
</header>
<section class="modal-card-body">
<b-field label="Phone Number"
:type="editPhoneNumberValue ? null : 'is-danger'">
<b-input v-model="editPhoneNumberValue"
ref="editPhoneNumberInput">
</b-input>
</b-field>
</section>
<footer class="modal-card-foot">
<b-button type="is-primary"
icon-pack="fas"
icon-left="save"
:disabled="editPhoneNumberSaveDisabled"
@click="editPhoneNumberSave()">
{{ editPhoneNumberSaveText }}
</b-button>
<b-button @click="editPhoneNumberShowDialog = false">
Cancel
</b-button>
</footer>
</div>
</b-modal>
</div>
</div>
</div>
</b-field>
<b-field label="Email Address">
<div class="level">
<div class="level-left">
<div class="level-item">
{{ orderEmailAddress }}
</div>
<div class="level-item">
<b-button type="is-primary"
@click="editEmailAddressInit()"
icon-pack="fas"
icon-left="edit">
Edit
</b-button>
<b-modal has-modal-card
:active.sync="editEmailAddressShowDialog">
<div class="modal-card">
<header class="modal-card-head">
<p class="modal-card-title">Edit Email Address</p>
</header>
<section class="modal-card-body">
<b-field label="Email Address"
:type="editEmailAddressValue ? null : 'is-danger'">
<b-input v-model="editEmailAddressValue"
ref="editEmailAddressInput">
</b-input>
</b-field>
</section>
<footer class="modal-card-foot">
<b-button type="is-primary"
icon-pack="fas"
icon-left="save"
:disabled="editEmailAddressSaveDisabled"
@click="editEmailAddressSave()">
{{ editEmailAddressSaveText }}
</b-button>
<b-button @click="editEmailAddressShowDialog = false">
Cancel
</b-button>
</footer>
</div>
</b-modal>
</div>
</div>
</div>
</b-field>
</b-field> </b-field>
</div> </div>
@ -400,10 +493,20 @@
contactDisplay: ${json.dumps(six.text_type(batch.customer or ''))|n}, contactDisplay: ${json.dumps(six.text_type(batch.customer or ''))|n},
customerEntry: null, customerEntry: null,
contactProfileURL: ${json.dumps(contact_profile_url)|n}, contactProfileURL: ${json.dumps(contact_profile_url)|n},
phoneNumberEntry: ${json.dumps(batch.phone_number)|n}, ## phoneNumberEntry: ${json.dumps(batch.phone_number)|n},
orderPhoneNumber: ${json.dumps(batch.phone_number)|n},
phoneNumberSaved: true, phoneNumberSaved: true,
customerName: null, customerName: null,
phoneNumber: null, phoneNumber: null,
orderEmailAddress: ${json.dumps(batch.email_address)|n},
editPhoneNumberShowDialog: false,
editPhoneNumberValue: null,
editPhoneNumberSaving: false,
editEmailAddressShowDialog: false,
editEmailAddressValue: null,
editEmailAddressSaving: false,
items: ${json.dumps(order_items)|n}, items: ${json.dumps(order_items)|n},
editingItem: null, editingItem: null,
@ -478,13 +581,13 @@
text: "Please identify the customer.", text: "Please identify the customer.",
} }
} }
if (!this.phoneNumberEntry) { if (!this.orderPhoneNumber) {
return { return {
type: 'is-warning', type: 'is-warning',
text: "Please provide a phone number for the customer.", text: "Please provide a phone number for the customer.",
} }
} }
phoneNumber = this.phoneNumberEntry phoneNumber = this.orderPhoneNumber
} else { // customer is not known } else { // customer is not known
if (!this.customerName) { if (!this.customerName) {
return { return {
@ -522,6 +625,40 @@
} }
}, },
editPhoneNumberSaveDisabled() {
if (this.editPhoneNumberSaving) {
return true
}
if (!this.editPhoneNumberValue) {
return true
}
return false
},
editPhoneNumberSaveText() {
if (this.editPhoneNumberSaving) {
return "Working, please wait..."
}
return "Save"
},
editEmailAddressSaveDisabled() {
if (this.editEmailAddressSaving) {
return true
}
if (!this.editEmailAddressValue) {
return true
}
return false
},
editEmailAddressSaveText() {
if (this.editEmailAddressSaving) {
return "Working, please wait..."
}
return "Save"
},
itemsPanelHeader() { itemsPanelHeader() {
let text = "Items" let text = "Items"
@ -621,18 +758,6 @@
}) })
}, },
// setContactData() {
// let params = {
// action: 'set_customer_data',
// customer_uuid: this.contactUUID,
// phone_number: this.phoneNumberEntry,
// }
// let that = this
// this.submitBatchData(params, function(response) {
// that.phoneNumberSaved = true
// })
// },
submitOrder() { submitOrder() {
this.submittingOrder = true this.submittingOrder = true
@ -678,22 +803,78 @@
% else: % else:
that.contactUUID = response.data.person_uuid that.contactUUID = response.data.person_uuid
% endif % endif
that.phoneNumberEntry = response.data.phone_number that.orderPhoneNumber = response.data.phone_number
that.orderEmailAddress = response.data.email_address
that.contactProfileURL = response.data.contact_profile_url that.contactProfileURL = response.data.contact_profile_url
}) })
}, },
// phoneNumberChanged(value) { editPhoneNumberInit() {
// this.phoneNumberSaved = false this.editPhoneNumberValue = this.orderPhoneNumber
// }, this.editPhoneNumberShowDialog = true
this.$nextTick(() => {
this.$refs.editPhoneNumberInput.focus()
})
},
// phoneNumberKeyDown(event) { editPhoneNumberSave() {
// if (event.which == 13) { // Enter this.editPhoneNumberSaving = true
// this.setContactData()
// } let params = {
// }, action: 'update_phone_number',
phone_number: this.editPhoneNumberValue,
}
this.submitBatchData(params, response => {
if (response.data.success) {
this.orderPhoneNumber = response.data.phone_number
this.editPhoneNumberShowDialog = false
} else {
this.$buefy.toast.open({
message: "Save failed: " + response.data.error,
type: 'is-danger',
duration: 2000, // 2 seconds
})
}
this.editPhoneNumberSaving = false
})
},
editEmailAddressInit() {
this.editEmailAddressValue = this.orderEmailAddress
this.editEmailAddressShowDialog = true
this.$nextTick(() => {
this.$refs.editEmailAddressInput.focus()
})
},
editEmailAddressSave() {
this.editEmailAddressSaving = true
let params = {
action: 'update_email_address',
email_address: this.editEmailAddressValue,
}
this.submitBatchData(params, response => {
if (response.data.success) {
this.orderEmailAddress = response.data.email_address
this.editEmailAddressShowDialog = false
} else {
this.$buefy.toast.open({
message: "Save failed: " + response.data.error,
type: 'is-danger',
duration: 2000, // 2 seconds
})
}
this.editEmailAddressSaving = false
})
},
showAddItemDialog() { showAddItemDialog() {
this.customerPanelOpen = false
this.editingItem = null this.editingItem = null
this.productIsKnown = true this.productIsKnown = true
this.productUUID = null this.productUUID = null

View file

@ -228,6 +228,8 @@ class CustomerOrderView(MasterView):
json_actions = [ json_actions = [
'assign_contact', 'assign_contact',
'unassign_contact', 'unassign_contact',
'update_phone_number',
'update_email_address',
'get_customer_info', 'get_customer_info',
# 'set_customer_data', # 'set_customer_data',
'find_product_by_upc', 'find_product_by_upc',
@ -413,22 +415,28 @@ class CustomerOrderView(MasterView):
return context return context
# def set_customer_data(self, batch, data): def update_phone_number(self, batch, data):
# if 'customer_uuid' in data: app = self.get_rattail_app()
# batch.customer_uuid = data['customer_uuid']
# if 'person_uuid' in data: batch.phone_number = app.format_phone_number(data['phone_number'])
# batch.person_uuid = data['person_uuid'] self.Session.flush()
# elif batch.customer_uuid: self.Session.refresh(batch)
# self.Session.flush()
# batch.person = batch.customer.first_person() return {
# else: # no customer set 'success': True,
# batch.person_uuid = None 'phone_number': batch.phone_number,
# if 'phone_number' in data: }
# batch.phone_number = data['phone_number']
# if 'email_address' in data: def update_email_address(self, batch, data):
# batch.email_address = data['email_address']
# self.Session.flush() batch.email_address = data['email_address']
# return {'success': True} self.Session.flush()
self.Session.refresh(batch)
return {
'success': True,
'email_address': batch.email_address,
}
def product_autocomplete(self): def product_autocomplete(self):
""" """