|
@ -14,6 +14,8 @@ projects, and special entities with selection. * * @author Matthew Raymer */ |
|
|
:selectable="youSelectable" |
|
|
:selectable="youSelectable" |
|
|
:conflicted="youConflicted" |
|
|
:conflicted="youConflicted" |
|
|
:entity-data="youEntityData" |
|
|
:entity-data="youEntityData" |
|
|
|
|
|
:notify="notify" |
|
|
|
|
|
:conflict-context="conflictContext" |
|
|
@entity-selected="handleEntitySelected" |
|
|
@entity-selected="handleEntitySelected" |
|
|
/> |
|
|
/> |
|
|
|
|
|
|
|
@ -23,6 +25,8 @@ projects, and special entities with selection. * * @author Matthew Raymer */ |
|
|
label="Unnamed" |
|
|
label="Unnamed" |
|
|
icon="circle-question" |
|
|
icon="circle-question" |
|
|
:entity-data="unnamedEntityData" |
|
|
:entity-data="unnamedEntityData" |
|
|
|
|
|
:notify="notify" |
|
|
|
|
|
:conflict-context="conflictContext" |
|
|
@entity-selected="handleEntitySelected" |
|
|
@entity-selected="handleEntitySelected" |
|
|
/> |
|
|
/> |
|
|
</template> |
|
|
</template> |
|
@ -38,23 +42,27 @@ projects, and special entities with selection. * * @author Matthew Raymer */ |
|
|
<!-- Entity cards (people or projects) --> |
|
|
<!-- Entity cards (people or projects) --> |
|
|
<template v-if="entityType === 'people'"> |
|
|
<template v-if="entityType === 'people'"> |
|
|
<PersonCard |
|
|
<PersonCard |
|
|
v-for="person in displayedEntities" |
|
|
v-for="person in displayedEntities as Contact[]" |
|
|
:key="person.did" |
|
|
:key="person.did" |
|
|
:person="person" |
|
|
:person="person" |
|
|
:conflicted="isPersonConflicted(person.did)" |
|
|
:conflicted="isPersonConflicted(person.did)" |
|
|
:show-time-icon="true" |
|
|
:show-time-icon="true" |
|
|
|
|
|
:notify="notify" |
|
|
|
|
|
:conflict-context="conflictContext" |
|
|
@person-selected="handlePersonSelected" |
|
|
@person-selected="handlePersonSelected" |
|
|
/> |
|
|
/> |
|
|
</template> |
|
|
</template> |
|
|
|
|
|
|
|
|
<template v-else-if="entityType === 'projects'"> |
|
|
<template v-else-if="entityType === 'projects'"> |
|
|
<ProjectCard |
|
|
<ProjectCard |
|
|
v-for="project in displayedEntities" |
|
|
v-for="project in displayedEntities as PlanData[]" |
|
|
:key="project.handleId" |
|
|
:key="project.handleId" |
|
|
:project="project" |
|
|
:project="project" |
|
|
:active-did="activeDid" |
|
|
:active-did="activeDid" |
|
|
:all-my-dids="allMyDids" |
|
|
:all-my-dids="allMyDids" |
|
|
:all-contacts="allContacts" |
|
|
:all-contacts="allContacts" |
|
|
|
|
|
:notify="notify" |
|
|
|
|
|
:conflict-context="conflictContext" |
|
|
@project-selected="handleProjectSelected" |
|
|
@project-selected="handleProjectSelected" |
|
|
/> |
|
|
/> |
|
|
</template> |
|
|
</template> |
|
@ -77,6 +85,7 @@ import SpecialEntityCard from "./SpecialEntityCard.vue"; |
|
|
import ShowAllCard from "./ShowAllCard.vue"; |
|
|
import ShowAllCard from "./ShowAllCard.vue"; |
|
|
import { Contact } from "../db/tables/contacts"; |
|
|
import { Contact } from "../db/tables/contacts"; |
|
|
import { PlanData } from "../interfaces/records"; |
|
|
import { PlanData } from "../interfaces/records"; |
|
|
|
|
|
import { NotificationIface } from "../constants/app"; |
|
|
|
|
|
|
|
|
/** |
|
|
/** |
|
|
* EntityGrid - Unified grid layout for displaying people or projects |
|
|
* EntityGrid - Unified grid layout for displaying people or projects |
|
@ -88,6 +97,7 @@ import { PlanData } from "../interfaces/records"; |
|
|
* - Empty state messaging |
|
|
* - Empty state messaging |
|
|
* - Show All navigation |
|
|
* - Show All navigation |
|
|
* - Event delegation for entity selection |
|
|
* - Event delegation for entity selection |
|
|
|
|
|
* - Warning notifications for conflicted entities |
|
|
*/ |
|
|
*/ |
|
|
@Component({ |
|
|
@Component({ |
|
|
components: { |
|
|
components: { |
|
@ -142,6 +152,14 @@ export default class EntityGrid extends Vue { |
|
|
@Prop({ default: () => ({}) }) |
|
|
@Prop({ default: () => ({}) }) |
|
|
showAllQueryParams!: Record<string, string>; |
|
|
showAllQueryParams!: Record<string, string>; |
|
|
|
|
|
|
|
|
|
|
|
/** Notification function from parent component */ |
|
|
|
|
|
@Prop() |
|
|
|
|
|
notify?: (notification: NotificationIface, timeout?: number) => void; |
|
|
|
|
|
|
|
|
|
|
|
/** Context for conflict messages (e.g., "giver", "recipient") */ |
|
|
|
|
|
@Prop({ default: "other party" }) |
|
|
|
|
|
conflictContext!: string; |
|
|
|
|
|
|
|
|
/** |
|
|
/** |
|
|
* Computed CSS classes for the grid layout |
|
|
* Computed CSS classes for the grid layout |
|
|
*/ |
|
|
*/ |
|
@ -241,7 +259,7 @@ export default class EntityGrid extends Vue { |
|
|
handleEntitySelected(event: { |
|
|
handleEntitySelected(event: { |
|
|
type: string; |
|
|
type: string; |
|
|
entityType: string; |
|
|
entityType: string; |
|
|
data: any; |
|
|
data: { did?: string; name: string }; |
|
|
}): void { |
|
|
}): void { |
|
|
this.emitEntitySelected({ |
|
|
this.emitEntitySelected({ |
|
|
type: "special", |
|
|
type: "special", |
|
@ -253,7 +271,15 @@ export default class EntityGrid extends Vue { |
|
|
// Emit methods using @Emit decorator |
|
|
// Emit methods using @Emit decorator |
|
|
|
|
|
|
|
|
@Emit("entity-selected") |
|
|
@Emit("entity-selected") |
|
|
emitEntitySelected(data: any): any { |
|
|
emitEntitySelected(data: { |
|
|
|
|
|
type: "person" | "project" | "special"; |
|
|
|
|
|
entityType?: string; |
|
|
|
|
|
data: Contact | PlanData | { did?: string; name: string }; |
|
|
|
|
|
}): { |
|
|
|
|
|
type: "person" | "project" | "special"; |
|
|
|
|
|
entityType?: string; |
|
|
|
|
|
data: Contact | PlanData | { did?: string; name: string }; |
|
|
|
|
|
} { |
|
|
return data; |
|
|
return data; |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|