Files
crowd-funder-for-time-pwa/src/components/ContactBulkActions.vue
Matthew Raymer 07c5c6fd31 Convert Vue components to use @Emit decorator instead of manual emits declarations
Replace manual emits declarations with proper @Emit decorator usage across components:
- ActivityListItem: Add @Emit methods for viewImage, loadClaim, confirmClaim
- ContactInputForm: Convert handleQRScan to use @Emit("qr-scan")
- ContactBulkActions: Add @Emit methods for toggle-all-selection, copy-selected
- ContactListHeader: Add @Emit methods for all 5 emitted events
- MembersList: Add @Emit("error") method for error handling
- LargeIdenticonModal: Add @Emit("close") method
- ContactListItem: Add @Emit methods for all 4 emitted events

Update all templates to call emit methods instead of direct $emit calls.
Fix TypeScript type issues with optional parameters.
Resolves Vue warning about undeclared emitted events.

Follows vue-facing-decorator best practices and improves code consistency.
2025-07-30 05:50:39 +00:00

54 lines
1.3 KiB
Vue

<template>
<div class="mt-2 w-full text-left">
<input
v-if="!showGiveNumbers"
type="checkbox"
:checked="allContactsSelected"
class="align-middle ml-2 h-6 w-6"
data-testId="contactCheckAllBottom"
@click="emitToggleAllSelection"
/>
<button
v-if="!showGiveNumbers"
:class="copyButtonClass"
:disabled="copyButtonDisabled"
@click="emitCopySelected"
>
Copy
</button>
</div>
</template>
<script lang="ts">
import { Component, Vue, Prop, Emit } from "vue-facing-decorator";
/**
* ContactBulkActions - Contact bulk actions component
*
* Provides bulk selection controls at the bottom of the contact list.
* Handles copy operations for selected contacts.
*
* @author Matthew Raymer
*/
@Component({
name: "ContactBulkActions",
})
export default class ContactBulkActions extends Vue {
@Prop({ required: true }) showGiveNumbers!: boolean;
@Prop({ required: true }) allContactsSelected!: boolean;
@Prop({ required: true }) copyButtonClass!: string;
@Prop({ required: true }) copyButtonDisabled!: boolean;
// Emit methods using @Emit decorator
@Emit("toggle-all-selection")
emitToggleAllSelection() {
// No parameters needed
}
@Emit("copy-selected")
emitCopySelected() {
// No parameters needed
}
}
</script>