Browse Source

finish contact selection for gives

world-fix
Trent Larson 1 year ago
parent
commit
a2b3cebdb3
  1. 20
      src/components/GiftedDialog.vue
  2. 7
      src/libs/endorserServer.ts
  3. 17
      src/views/HomeView.vue
  4. 38
      src/views/ProjectViewView.vue

20
src/components/GiftedDialog.vue

@ -2,13 +2,12 @@
<div v-if="visible" class="dialog-overlay"> <div v-if="visible" class="dialog-overlay">
<div class="dialog"> <div class="dialog">
<h1 class="text-lg text-center"> <h1 class="text-lg text-center">
Received from {{ contact?.name || "nobody in particular" }} {{ message }} {{ giver?.name || "somebody not specified" }}
</h1> </h1>
<p class="py-2">{{ message }}</p>
<input <input
type="text" type="text"
class="block w-full rounded border border-slate-400 mb-4 px-3 py-2" class="block w-full rounded border border-slate-400 mb-4 px-3 py-2"
placeholder="What you received" placeholder="What was received"
v-model="description" v-model="description"
/> />
<div class="flex flex-row"> <div class="flex flex-row">
@ -27,9 +26,10 @@
</div> </div>
</div> </div>
</div> </div>
<p class="text-right">Sign & Send to publish to the world</p>
<div class="text-right"> <div class="text-right">
<button class="rounded border border-slate-400" @click="confirm"> <button class="rounded border border-slate-400" @click="confirm">
<span class="m-2">Confirm</span> <span class="m-2">Sign & Send</span>
</button> </button>
&nbsp; &nbsp;
<button class="rounded border border-slate-400" @click="cancel"> <button class="rounded border border-slate-400" @click="cancel">
@ -45,15 +45,16 @@ export default {
props: ["message"], props: ["message"],
data() { data() {
return { return {
contact: null, giver: null,
description: "", description: "",
hours: "0", hours: "0",
visible: false, visible: false,
}; };
}, },
methods: { methods: {
open(contact) { open(giver) {
this.contact = contact; // giver: GiverInputInfo
this.giver = giver;
this.visible = true; this.visible = true;
}, },
close() { close() {
@ -69,10 +70,13 @@ export default {
this.close(); this.close();
this.$emit("dialog-result", { this.$emit("dialog-result", {
action: "confirm", action: "confirm",
contact: this.contact, giver: this.giver,
hours: parseFloat(this.hours), hours: parseFloat(this.hours),
description: this.description, description: this.description,
}); });
this.description = "";
this.giver = null;
this.hours = "0";
}, },
cancel() { cancel() {
this.close(); this.close();

7
src/libs/endorserServer.ts

@ -15,6 +15,11 @@ export interface AgreeVerifiableCredential {
object: Record<any, any>; object: Record<any, any>;
} }
export interface GiverInputInfo {
did?: string;
name?: string;
}
export interface ClaimResult { export interface ClaimResult {
success: { claimId: string; handleId: string }; success: { claimId: string; handleId: string };
error: { code: string; message: string }; error: { code: string; message: string };
@ -111,7 +116,7 @@ export async function createAndSubmitGive(
toDid: string, toDid: string,
description: string, description: string,
hours: number, hours: number,
fulfillsProjectHandleId: string fulfillsProjectHandleId?: string
): Promise<AxiosResponse<ClaimResult> | InternalError> { ): Promise<AxiosResponse<ClaimResult> | InternalError> {
// Make a claim // Make a claim
const vcClaim: GiveVerifiableCredential = { const vcClaim: GiveVerifiableCredential = {

17
src/views/HomeView.vue

@ -52,6 +52,7 @@
<div> <div>
<h1 class="text-2xl">Quick Action</h1> <h1 class="text-2xl">Quick Action</h1>
<p>Choose a contact to whom to show appreciation:</p> <p>Choose a contact to whom to show appreciation:</p>
<!-- similar contact selection code is in multiple places -->
<div class="px-4"> <div class="px-4">
<button <button
v-for="contact in allContacts" v-for="contact in allContacts"
@ -63,7 +64,7 @@
</button> </button>
<span v-if="allContacts.length > 0">&nbsp;or&nbsp;</span> <span v-if="allContacts.length > 0">&nbsp;or&nbsp;</span>
<button @click="openDialog()" class="text-blue-500"> <button @click="openDialog()" class="text-blue-500">
nobody in particular someone not specified
</button> </button>
</div> </div>
</div> </div>
@ -71,7 +72,7 @@
<GiftedDialog <GiftedDialog
ref="customDialog" ref="customDialog"
@dialog-result="handleDialogResult" @dialog-result="handleDialogResult"
message="Confirm to publish to the world." message="Received from"
> >
</GiftedDialog> </GiftedDialog>
@ -268,13 +269,13 @@ export default class HomeView extends Vue {
return unitCode === "HUR" ? (single ? "hour" : "hours") : unitCode; return unitCode === "HUR" ? (single ? "hour" : "hours") : unitCode;
} }
openDialog(contact) { openDialog(giver) {
this.$refs.customDialog.open(contact); this.$refs.customDialog.open(giver);
} }
handleDialogResult(result) { handleDialogResult(result) {
if (result.action === "confirm") { if (result.action === "confirm") {
return new Promise((resolve) => { return new Promise((resolve) => {
this.recordGive(result.contact, result.description, result.hours); this.recordGive(result.contact?.did, result.description, result.hours);
resolve(); resolve();
}); });
} else { } else {
@ -284,11 +285,11 @@ export default class HomeView extends Vue {
/** /**
* *
* @param contact may be null * @param giverDid may be null
* @param description may be an empty string * @param description may be an empty string
* @param hours may be 0 * @param hours may be 0
*/ */
recordGive(contact, description, hours) { recordGive(giverDid, description, hours) {
if (this.activeDid == null) { if (this.activeDid == null) {
this.alertTitle = "Error"; this.alertTitle = "Error";
this.alertMessage = this.alertMessage =
@ -308,7 +309,7 @@ export default class HomeView extends Vue {
this.axios, this.axios,
this.apiServer, this.apiServer,
identity, identity,
contact?.did, giverDid,
this.activeDid, this.activeDid,
description, description,
hours hours

38
src/views/ProjectViewView.vue

@ -109,16 +109,35 @@
</div> </div>
<button <button
@click="openDialog()" @click="openDialog({ name: 'you', did: activeDid })"
class="block text-center text-lg font-bold uppercase bg-blue-600 text-white px-2 py-3 rounded-md mb-8" class="block text-center text-lg font-bold uppercase bg-blue-600 text-white px-2 py-3 rounded-md mb-8"
> >
Given I gave...
</button> </button>
<div>
<p>... or choose a contact who gave:</p>
<!-- similar contact selection code is in multiple places -->
<div class="px-4">
<button
v-for="contact in allContacts"
:key="contact.did"
@click="openDialog(contact)"
class="text-blue-500"
>
&nbsp;{{ contact.name }},
</button>
<span v-if="allContacts.length > 0">&nbsp;or&nbsp;</span>
<button @click="openDialog()" class="text-blue-500">
someone not specified
</button>
</div>
</div>
<GiftedDialog <GiftedDialog
ref="customDialog" ref="customDialog"
@dialog-result="handleDialogResult" @dialog-result="handleDialogResult"
message="Confirm to publish to the world." message="Received from"
> >
</GiftedDialog> </GiftedDialog>
@ -171,6 +190,7 @@ import { Options, Vue } from "vue-class-component";
import GiftedDialog from "@/components/GiftedDialog.vue"; import GiftedDialog from "@/components/GiftedDialog.vue";
import { accountsDB, db } from "@/db"; import { accountsDB, db } from "@/db";
import { Contact } from "@/db/tables/contacts";
import { MASTER_SETTINGS_KEY } from "@/db/tables/settings"; import { MASTER_SETTINGS_KEY } from "@/db/tables/settings";
import { createAndSubmitGive } from "@/libs/endorserServer"; import { createAndSubmitGive } from "@/libs/endorserServer";
import { accessToken } from "@/libs/crypto"; import { accessToken } from "@/libs/crypto";
@ -181,6 +201,7 @@ import { IIdentifier } from "@veramo/core";
}) })
export default class ProjectViewView extends Vue { export default class ProjectViewView extends Vue {
activeDid = ""; activeDid = "";
allContacts: Array<Contact> = [];
apiServer = ""; apiServer = "";
expanded = false; expanded = false;
name = ""; name = "";
@ -253,6 +274,7 @@ export default class ProjectViewView extends Vue {
const settings = await db.settings.get(MASTER_SETTINGS_KEY); const settings = await db.settings.get(MASTER_SETTINGS_KEY);
this.activeDid = settings?.activeDid || ""; this.activeDid = settings?.activeDid || "";
this.apiServer = settings?.apiServer || ""; this.apiServer = settings?.apiServer || "";
this.allContacts = await db.contacts.toArray();
await accountsDB.open(); await accountsDB.open();
const num_accounts = await accountsDB.accounts.count(); const num_accounts = await accountsDB.accounts.count();
@ -275,21 +297,21 @@ export default class ProjectViewView extends Vue {
handleDialogResult(result) { handleDialogResult(result) {
if (result.action === "confirm") { if (result.action === "confirm") {
return new Promise((resolve) => { return new Promise((resolve) => {
this.recordGive(result.contact, result.description, result.hours); this.recordGive(result.contact?.did, result.description, result.hours);
resolve(); resolve();
}); });
} else { } else {
// action was "cancel" so do nothing // action was not "confirm" so do nothing
} }
} }
/** /**
* *
* @param contact may be null * @param giverDid may be null
* @param description may be an empty string * @param description may be an empty string
* @param hours may be 0 * @param hours may be 0
*/ */
async recordGive(contact, description, hours) { async recordGive(giverDid, description, hours) {
if (this.activeDid == null) { if (this.activeDid == null) {
this.alertTitle = "Error"; this.alertTitle = "Error";
this.alertMessage = this.alertMessage =
@ -306,7 +328,7 @@ export default class ProjectViewView extends Vue {
this.axios, this.axios,
this.apiServer, this.apiServer,
identity, identity,
contact?.did, giverDid,
this.activeDid, this.activeDid,
description, description,
hours, hours,

Loading…
Cancel
Save