fix(loyalty): clear staff_id when autocomplete selection is removed
When a staff member was selected and then the name field was edited or cleared, the staff_id (email) remained set. Now tracks the selected member name and clears staff_id when the search text diverges. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
@@ -62,6 +62,9 @@ function loyaltyPinsList(config) {
|
|||||||
staffSearch: '',
|
staffSearch: '',
|
||||||
showStaffDropdown: false,
|
showStaffDropdown: false,
|
||||||
|
|
||||||
|
// Track which member was selected (to detect when user edits away)
|
||||||
|
_selectedStaffName: '',
|
||||||
|
|
||||||
get filteredStaff() {
|
get filteredStaff() {
|
||||||
if (!this.staffSearch) return this.staffMembers;
|
if (!this.staffSearch) return this.staffMembers;
|
||||||
const q = this.staffSearch.toLowerCase();
|
const q = this.staffSearch.toLowerCase();
|
||||||
@@ -75,13 +78,24 @@ function loyaltyPinsList(config) {
|
|||||||
this.pinForm.name = member.full_name;
|
this.pinForm.name = member.full_name;
|
||||||
this.pinForm.staff_id = member.email;
|
this.pinForm.staff_id = member.email;
|
||||||
this.staffSearch = member.full_name;
|
this.staffSearch = member.full_name;
|
||||||
|
this._selectedStaffName = member.full_name;
|
||||||
this.showStaffDropdown = false;
|
this.showStaffDropdown = false;
|
||||||
},
|
},
|
||||||
|
|
||||||
|
onStaffSearchInput() {
|
||||||
|
this.pinForm.name = this.staffSearch;
|
||||||
|
// If user modified the text away from the selected member, clear staff_id
|
||||||
|
if (this._selectedStaffName && this.staffSearch !== this._selectedStaffName) {
|
||||||
|
this.pinForm.staff_id = '';
|
||||||
|
this._selectedStaffName = '';
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
clearStaffSelection() {
|
clearStaffSelection() {
|
||||||
this.staffSearch = '';
|
this.staffSearch = '';
|
||||||
this.pinForm.name = '';
|
this.pinForm.name = '';
|
||||||
this.pinForm.staff_id = '';
|
this.pinForm.staff_id = '';
|
||||||
|
this._selectedStaffName = '';
|
||||||
this.showStaffDropdown = false;
|
this.showStaffDropdown = false;
|
||||||
},
|
},
|
||||||
|
|
||||||
|
|||||||
@@ -136,7 +136,7 @@
|
|||||||
<label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-1">{{ _('loyalty.shared.pins.pin_name') }}</label>
|
<label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-1">{{ _('loyalty.shared.pins.pin_name') }}</label>
|
||||||
<input type="text" x-model="staffSearch" required
|
<input type="text" x-model="staffSearch" required
|
||||||
@focus="open = staffMembers.length > 0"
|
@focus="open = staffMembers.length > 0"
|
||||||
@input="open = staffMembers.length > 0; pinForm.name = staffSearch"
|
@input="open = staffMembers.length > 0; onStaffSearchInput()"
|
||||||
autocomplete="off"
|
autocomplete="off"
|
||||||
class="w-full px-3 py-2 text-sm border border-gray-300 dark:border-gray-600 rounded-lg focus:border-purple-400 focus:outline-none dark:bg-gray-700 dark:text-gray-300"
|
class="w-full px-3 py-2 text-sm border border-gray-300 dark:border-gray-600 rounded-lg focus:border-purple-400 focus:outline-none dark:bg-gray-700 dark:text-gray-300"
|
||||||
placeholder="{{ _('loyalty.shared.pins.pin_name') }}">
|
placeholder="{{ _('loyalty.shared.pins.pin_name') }}">
|
||||||
@@ -205,7 +205,7 @@
|
|||||||
<label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-1">{{ _('loyalty.shared.pins.pin_name') }}</label>
|
<label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-1">{{ _('loyalty.shared.pins.pin_name') }}</label>
|
||||||
<input type="text" x-model="staffSearch" required
|
<input type="text" x-model="staffSearch" required
|
||||||
@focus="open = staffMembers.length > 0"
|
@focus="open = staffMembers.length > 0"
|
||||||
@input="open = staffMembers.length > 0; pinForm.name = staffSearch"
|
@input="open = staffMembers.length > 0; onStaffSearchInput()"
|
||||||
autocomplete="off"
|
autocomplete="off"
|
||||||
class="w-full px-3 py-2 text-sm border border-gray-300 dark:border-gray-600 rounded-lg focus:border-purple-400 focus:outline-none dark:bg-gray-700 dark:text-gray-300"
|
class="w-full px-3 py-2 text-sm border border-gray-300 dark:border-gray-600 rounded-lg focus:border-purple-400 focus:outline-none dark:bg-gray-700 dark:text-gray-300"
|
||||||
placeholder="{{ _('loyalty.shared.pins.pin_name') }}">
|
placeholder="{{ _('loyalty.shared.pins.pin_name') }}">
|
||||||
|
|||||||
Reference in New Issue
Block a user