fix: revert QR scanner to emit pattern after function prop binding fails

- Revert ContactInputForm QR scanner from function props back to emit pattern
- Remove problematic onQRScan function prop that wasn't resolving correctly
- Update ContactsView to use @qr-scan event handler instead of function prop
- Maintain debugging logs to track click events and method execution
- Keep other function props intact for other event handlers

The function prop approach for QR scanning failed due to Vue prop resolution
issues, causing the default function to be called instead of the parent handler.
Reverting to emits provides reliable parent-child communication for this case.
This commit is contained in:
Matthew Raymer
2025-07-18 06:40:08 +00:00
parent 73a472d8b7
commit 0bcf34c703
5 changed files with 108 additions and 34 deletions

View File

@@ -25,13 +25,19 @@
<ContactInputForm
v-model="contactInput"
:is-registered="isRegistered"
@submit="onClickNewContact"
@show-onboard-meeting="showOnboardMeetingDialog"
@registration-required="
notify.warning('You must get registered before you can create invites.')
:on-submit="onClickNewContact"
:on-show-onboard-meeting="showOnboardMeetingDialog"
:on-registration-required="
() =>
notify.warning(
'You must get registered before you can create invites.',
)
"
:on-navigate-onboard-meeting="
() => $router.push({ name: 'onboard-meeting-list' })
"
@navigate-onboard-meeting="$router.push({ name: 'onboard-meeting-list' })"
@qr-scan="handleQRCodeClick"
:on-update-model-value="(value: string) => (contactInput = value)"
/>
<ContactListHeader
@@ -1236,10 +1242,17 @@ export default class ContactsView extends Vue {
* Handle QR code button click - route to appropriate scanner
* Uses native scanner on mobile platforms, web scanner otherwise
*/
private handleQRCodeClick() {
public handleQRCodeClick() {
console.log("[ContactsView] handleQRCodeClick method called");
this.$logAndConsole("[ContactsView] handleQRCodeClick method called", false);
if (Capacitor.isNativePlatform()) {
console.log("[ContactsView] Navigating to contact-qr-scan-full");
this.$router.push({ name: "contact-qr-scan-full" });
} else {
console.log("[ContactsView] Navigating to contact-qr");
this.$router.push({ name: "contact-qr" });
}
}