|
@ -21,9 +21,8 @@ |
|
|
<h1 class="text-4xl text-center font-light px-4 mb-4">What Was Offered</h1> |
|
|
<h1 class="text-4xl text-center font-light px-4 mb-4">What Was Offered</h1> |
|
|
|
|
|
|
|
|
<h1 class="text-xl font-bold text-center mb-4"> |
|
|
<h1 class="text-xl font-bold text-center mb-4"> |
|
|
<span>From {{ giverName }}</span> |
|
|
|
|
|
<span> |
|
|
<span> |
|
|
to |
|
|
Offer to |
|
|
{{ |
|
|
{{ |
|
|
offeredToProject |
|
|
offeredToProject |
|
|
? projectName |
|
|
? projectName |
|
@ -36,7 +35,7 @@ |
|
|
<textarea |
|
|
<textarea |
|
|
class="block w-full rounded border border-slate-400 mb-2 px-3 py-2" |
|
|
class="block w-full rounded border border-slate-400 mb-2 px-3 py-2" |
|
|
placeholder="What was offered" |
|
|
placeholder="What was offered" |
|
|
v-model="description" |
|
|
v-model="itemDescription" |
|
|
/> |
|
|
/> |
|
|
<div class="flex flex-row justify-center"> |
|
|
<div class="flex flex-row justify-center"> |
|
|
<span |
|
|
<span |
|
@ -64,6 +63,32 @@ |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
|
|
|
<div class="flex flex-row mt-2"> |
|
|
|
|
|
<span |
|
|
|
|
|
class="rounded-l border border-r-0 border-slate-400 bg-slate-200 text-center px-2 py-2" |
|
|
|
|
|
> |
|
|
|
|
|
Conditions |
|
|
|
|
|
</span> |
|
|
|
|
|
<textarea |
|
|
|
|
|
class="w-full border border-slate-400 px-3 py-2 rounded-r" |
|
|
|
|
|
placeholder="Prerequisites, other people to include, etc." |
|
|
|
|
|
v-model="conditionDescription" |
|
|
|
|
|
/> |
|
|
|
|
|
</div> |
|
|
|
|
|
|
|
|
|
|
|
<div class="flex flex-row mt-2"> |
|
|
|
|
|
<span |
|
|
|
|
|
class="rounded-l border border-r-0 border-slate-400 bg-slate-200 text-center px-2 py-2" |
|
|
|
|
|
> |
|
|
|
|
|
{{ validThroughDateInput ? "" : "No" }} Expiration |
|
|
|
|
|
</span> |
|
|
|
|
|
<input |
|
|
|
|
|
v-model="validThroughDateInput" |
|
|
|
|
|
type="date" |
|
|
|
|
|
class="w-full rounded border border-slate-400 px-3 py-2 rounded-r" |
|
|
|
|
|
/> |
|
|
|
|
|
</div> |
|
|
|
|
|
|
|
|
<div class="h-7 mt-4 flex"> |
|
|
<div class="h-7 mt-4 flex"> |
|
|
<input |
|
|
<input |
|
|
v-if="projectId && !offeredToRecipient" |
|
|
v-if="projectId && !offeredToRecipient" |
|
@ -131,6 +156,12 @@ |
|
|
/> |
|
|
/> |
|
|
</p> |
|
|
</p> |
|
|
<div class="grid grid-cols-1 sm:grid-cols-2 gap-2"> |
|
|
<div class="grid grid-cols-1 sm:grid-cols-2 gap-2"> |
|
|
|
|
|
<button |
|
|
|
|
|
class="block w-full text-center text-lg font-bold uppercase bg-gradient-to-b from-blue-400 to-blue-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] text-white px-2 py-3 rounded-md" |
|
|
|
|
|
@click="confirm" |
|
|
|
|
|
> |
|
|
|
|
|
Sign & Send |
|
|
|
|
|
</button> |
|
|
<button |
|
|
<button |
|
|
class="block w-full text-center text-md uppercase bg-gradient-to-b from-slate-400 to-slate-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] text-white px-1.5 py-2 rounded-md" |
|
|
class="block w-full text-center text-md uppercase bg-gradient-to-b from-slate-400 to-slate-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] text-white px-1.5 py-2 rounded-md" |
|
|
@click="cancel" |
|
|
@click="cancel" |
|
@ -142,6 +173,7 @@ |
|
|
</template> |
|
|
</template> |
|
|
|
|
|
|
|
|
<script lang="ts"> |
|
|
<script lang="ts"> |
|
|
|
|
|
import { DateTime } from "luxon"; |
|
|
import { Component, Vue } from "vue-facing-decorator"; |
|
|
import { Component, Vue } from "vue-facing-decorator"; |
|
|
import { Router } from "vue-router"; |
|
|
import { Router } from "vue-router"; |
|
|
|
|
|
|
|
@ -168,21 +200,20 @@ import { Contact } from "@/db/tables/contacts"; |
|
|
TopMessage, |
|
|
TopMessage, |
|
|
}, |
|
|
}, |
|
|
}) |
|
|
}) |
|
|
export default class OfferDetails extends Vue { |
|
|
export default class OfferDetailsView extends Vue { |
|
|
$notify!: (notification: NotificationIface, timeout?: number) => void; |
|
|
$notify!: (notification: NotificationIface, timeout?: number) => void; |
|
|
|
|
|
|
|
|
activeDid = ""; |
|
|
activeDid = ""; |
|
|
apiServer = ""; |
|
|
apiServer = ""; |
|
|
|
|
|
|
|
|
amountInput = "0"; |
|
|
amountInput = "0"; |
|
|
description = ""; |
|
|
conditionDescription = ""; |
|
|
|
|
|
itemDescription = ""; |
|
|
destinationPathAfter = ""; |
|
|
destinationPathAfter = ""; |
|
|
offeredToProject = false; |
|
|
offeredToProject = false; |
|
|
offeredToRecipient = false; |
|
|
offeredToRecipient = false; |
|
|
giverDid: string | undefined; |
|
|
offererDid: string | undefined; |
|
|
giverName = ""; |
|
|
|
|
|
hideBackButton = false; |
|
|
hideBackButton = false; |
|
|
isTrade = false; |
|
|
|
|
|
message = ""; |
|
|
message = ""; |
|
|
offerId = ""; |
|
|
offerId = ""; |
|
|
prevCredToEdit?: GenericCredWrapper<OfferVerifiableCredential>; |
|
|
prevCredToEdit?: GenericCredWrapper<OfferVerifiableCredential>; |
|
@ -191,7 +222,7 @@ export default class OfferDetails extends Vue { |
|
|
recipientDid = ""; |
|
|
recipientDid = ""; |
|
|
recipientName = ""; |
|
|
recipientName = ""; |
|
|
unitCode = "HUR"; |
|
|
unitCode = "HUR"; |
|
|
validThroughDate = null; |
|
|
validThroughDateInput = ""; |
|
|
|
|
|
|
|
|
libsUtil = libsUtil; |
|
|
libsUtil = libsUtil; |
|
|
|
|
|
|
|
@ -214,67 +245,54 @@ export default class OfferDetails extends Vue { |
|
|
); |
|
|
); |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
const prevAmount = this.prevCredToEdit?.claim?.object?.amountOfThisGood; |
|
|
const prevAmount = |
|
|
|
|
|
this.prevCredToEdit?.claim?.includesObject?.amountOfThisGood; |
|
|
this.amountInput = |
|
|
this.amountInput = |
|
|
(this.$route as Router).query["amountInput"] || |
|
|
(this.$route as Router).query["amountInput"] || |
|
|
(prevAmount ? String(prevAmount) : "") || |
|
|
(prevAmount ? String(prevAmount) : "") || |
|
|
this.amountInput; |
|
|
this.amountInput; |
|
|
this.description = |
|
|
this.unitCode = ((this.$route as Router).query["unitCode"] || |
|
|
|
|
|
this.prevCredToEdit?.claim?.includesObject?.unitCode || |
|
|
|
|
|
this.unitCode) as string; |
|
|
|
|
|
|
|
|
|
|
|
this.conditionDescription = |
|
|
|
|
|
this.prevCredToEdit?.claim?.description || this.conditionDescription; |
|
|
|
|
|
this.itemDescription = |
|
|
(this.$route as Router).query["description"] || |
|
|
(this.$route as Router).query["description"] || |
|
|
this.prevCredToEdit?.claim?.description || |
|
|
this.prevCredToEdit?.claim?.itemOffered?.description || |
|
|
this.description; |
|
|
this.itemDescription; |
|
|
this.destinationPathAfter = (this.$route as Router).query[ |
|
|
this.destinationPathAfter = (this.$route as Router).query[ |
|
|
"destinationPathAfter" |
|
|
"destinationPathAfter" |
|
|
]; |
|
|
]; |
|
|
this.giverDid = ((this.$route as Router).query["giverDid"] || |
|
|
this.offererDid = ((this.$route as Router).query["offererDid"] || |
|
|
this.prevCredToEdit?.claim?.agent?.identifier || |
|
|
this.prevCredToEdit?.claim?.agent?.identifier || |
|
|
this.giverDid) as string; |
|
|
this.offererDid) as string; |
|
|
this.giverName = |
|
|
|
|
|
((this.$route as Router).query["giverName"] as string) || ""; |
|
|
|
|
|
this.hideBackButton = |
|
|
this.hideBackButton = |
|
|
(this.$route as Router).query["hideBackButton"] === "true"; |
|
|
(this.$route as Router).query["hideBackButton"] === "true"; |
|
|
this.message = ((this.$route as Router).query["message"] as string) || ""; |
|
|
this.message = ((this.$route as Router).query["message"] as string) || ""; |
|
|
// find any offer ID |
|
|
|
|
|
const fulfills = this.prevCredToEdit?.claim?.fulfills; |
|
|
|
|
|
const fulfillsArray = Array.isArray(fulfills) |
|
|
|
|
|
? fulfills |
|
|
|
|
|
: fulfills |
|
|
|
|
|
? [fulfills] |
|
|
|
|
|
: []; |
|
|
|
|
|
const offer = fulfillsArray.find((rec) => rec["@type"] === "Offer"); |
|
|
|
|
|
this.offerId = ((this.$route as Router).query["offerId"] || |
|
|
|
|
|
offer?.identifier || |
|
|
|
|
|
this.offerId) as string; |
|
|
|
|
|
|
|
|
|
|
|
// find any project ID |
|
|
// find any project ID |
|
|
const project = fulfillsArray.find((rec) => rec["@type"] === "PlanAction"); |
|
|
let project; |
|
|
|
|
|
if ( |
|
|
|
|
|
this.prevCredToEdit?.claim?.itemOffered?.isPartOf["@type"] === |
|
|
|
|
|
"PlanAction" |
|
|
|
|
|
) { |
|
|
|
|
|
project = this.prevCredToEdit?.claim?.itemOffered?.isPartOf; |
|
|
|
|
|
} |
|
|
this.projectId = ((this.$route as Router).query["projectId"] || |
|
|
this.projectId = ((this.$route as Router).query["projectId"] || |
|
|
project?.identifier || |
|
|
project?.identifier || |
|
|
this.projectId) as string; |
|
|
this.projectId) as string; |
|
|
|
|
|
this.projectName = ((this.$route as Router).query["projectName"] || |
|
|
|
|
|
project?.name || |
|
|
|
|
|
this.projectName) as string; |
|
|
|
|
|
|
|
|
this.recipientDid = ((this.$route as Router).query["recipientDid"] || |
|
|
this.recipientDid = ((this.$route as Router).query["recipientDid"] || |
|
|
this.prevCredToEdit?.claim?.recipient?.identifier) as string; |
|
|
this.prevCredToEdit?.claim?.recipient?.identifier) as string; |
|
|
this.recipientName = |
|
|
this.recipientName = |
|
|
((this.$route as Router).query["recipientName"] as string) || ""; |
|
|
((this.$route as Router).query["recipientName"] as string) || ""; |
|
|
this.unitCode = ((this.$route as Router).query["unitCode"] || |
|
|
|
|
|
this.prevCredToEdit?.claim?.object?.unitCode || |
|
|
|
|
|
this.unitCode) as string; |
|
|
|
|
|
|
|
|
|
|
|
// this is an endpoint for sharing project info to highlight something given |
|
|
this.validThroughDateInput = |
|
|
// https://developer.mozilla.org/en-US/docs/Web/Manifest/share_target |
|
|
this.prevCredToEdit?.claim?.validThrough || this.validThroughDateInput; |
|
|
if ((this.$route as Router).query["shareTitle"]) { |
|
|
|
|
|
this.description = |
|
|
|
|
|
((this.$route as Router).query["shareTitle"] as string) + |
|
|
|
|
|
(this.description ? "\n" + this.description : ""); |
|
|
|
|
|
} |
|
|
|
|
|
if ((this.$route as Router).query["shareText"]) { |
|
|
|
|
|
this.description = |
|
|
|
|
|
(this.description ? this.description + "\n" : "") + |
|
|
|
|
|
((this.$route as Router).query["shareText"] as string); |
|
|
|
|
|
} |
|
|
|
|
|
if ((this.$route as Router).query["shareUrl"]) { |
|
|
|
|
|
this.imageUrl = (this.$route as Router).query["shareUrl"] as string; |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
try { |
|
|
try { |
|
|
await db.open(); |
|
|
await db.open(); |
|
@ -284,32 +302,20 @@ export default class OfferDetails extends Vue { |
|
|
|
|
|
|
|
|
let allContacts: Contact[] = []; |
|
|
let allContacts: Contact[] = []; |
|
|
let allMyDids: string[] = []; |
|
|
let allMyDids: string[] = []; |
|
|
if ( |
|
|
if (this.recipientDid && !this.recipientName) { |
|
|
(this.giverDid && !this.giverName) || |
|
|
|
|
|
(this.recipientDid && !this.recipientName) |
|
|
|
|
|
) { |
|
|
|
|
|
allContacts = await db.contacts.toArray(); |
|
|
allContacts = await db.contacts.toArray(); |
|
|
|
|
|
|
|
|
await accountsDB.open(); |
|
|
await accountsDB.open(); |
|
|
const allAccounts = await accountsDB.accounts.toArray(); |
|
|
const allAccounts = await accountsDB.accounts.toArray(); |
|
|
allMyDids = allAccounts.map((acc) => acc.did); |
|
|
allMyDids = allAccounts.map((acc) => acc.did); |
|
|
if (this.giverDid && !this.giverName) { |
|
|
this.recipientName = didInfo( |
|
|
this.giverName = didInfo( |
|
|
this.recipientDid, |
|
|
this.giverDid, |
|
|
this.activeDid, |
|
|
this.activeDid, |
|
|
allMyDids, |
|
|
allMyDids, |
|
|
allContacts, |
|
|
allContacts, |
|
|
); |
|
|
); |
|
|
|
|
|
} |
|
|
|
|
|
if (this.recipientDid && !this.recipientName) { |
|
|
|
|
|
this.recipientName = didInfo( |
|
|
|
|
|
this.recipientDid, |
|
|
|
|
|
this.activeDid, |
|
|
|
|
|
allMyDids, |
|
|
|
|
|
allContacts, |
|
|
|
|
|
); |
|
|
|
|
|
} |
|
|
|
|
|
} |
|
|
} |
|
|
|
|
|
// these should be functions but something's wrong with the syntax in the <> conditional |
|
|
this.offeredToProject = !!this.projectId; |
|
|
this.offeredToProject = !!this.projectId; |
|
|
this.offeredToRecipient = !this.offeredToProject && !!this.recipientDid; |
|
|
this.offeredToRecipient = !this.offeredToProject && !!this.recipientDid; |
|
|
|
|
|
|
|
@ -327,7 +333,7 @@ export default class OfferDetails extends Vue { |
|
|
); |
|
|
); |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
if (this.projectId) { |
|
|
if (this.projectId && !this.projectName) { |
|
|
// console.log("Getting project name from cache", this.projectId); |
|
|
// console.log("Getting project name from cache", this.projectId); |
|
|
const project = await getPlanFromCache( |
|
|
const project = await getPlanFromCache( |
|
|
this.projectId, |
|
|
this.projectId, |
|
@ -395,7 +401,7 @@ export default class OfferDetails extends Vue { |
|
|
); |
|
|
); |
|
|
return; |
|
|
return; |
|
|
} |
|
|
} |
|
|
if (!this.description && !parseFloat(this.amountInput)) { |
|
|
if (!this.itemDescription && !parseFloat(this.amountInput)) { |
|
|
this.$notify( |
|
|
this.$notify( |
|
|
{ |
|
|
{ |
|
|
group: "alert", |
|
|
group: "alert", |
|
@ -431,7 +437,7 @@ export default class OfferDetails extends Vue { |
|
|
group: "alert", |
|
|
group: "alert", |
|
|
type: "warning", |
|
|
type: "warning", |
|
|
title: "Error", |
|
|
title: "Error", |
|
|
text: "To assign to a project, you must open this dialog through a project.", |
|
|
text: "To assign to a project, you must open this page through a project.", |
|
|
}, |
|
|
}, |
|
|
3000, |
|
|
3000, |
|
|
); |
|
|
); |
|
@ -456,7 +462,7 @@ export default class OfferDetails extends Vue { |
|
|
group: "alert", |
|
|
group: "alert", |
|
|
type: "warning", |
|
|
type: "warning", |
|
|
title: "Error", |
|
|
title: "Error", |
|
|
text: "To assign to a recipient, you must open this dialog from a contact.", |
|
|
text: "To assign to a recipient, you must open this page from a contact.", |
|
|
}, |
|
|
}, |
|
|
3000, |
|
|
3000, |
|
|
); |
|
|
); |
|
@ -476,7 +482,7 @@ export default class OfferDetails extends Vue { |
|
|
|
|
|
|
|
|
/** |
|
|
/** |
|
|
* |
|
|
* |
|
|
* @param giverDid may be null |
|
|
* @param offererDid may be null |
|
|
* @param description may be an empty string |
|
|
* @param description may be an empty string |
|
|
* @param amountInput may be 0 |
|
|
* @param amountInput may be 0 |
|
|
* @param unitCode may be omitted, defaults to "HUR" |
|
|
* @param unitCode may be omitted, defaults to "HUR" |
|
@ -495,10 +501,11 @@ export default class OfferDetails extends Vue { |
|
|
this.apiServer, |
|
|
this.apiServer, |
|
|
this.prevCredToEdit, |
|
|
this.prevCredToEdit, |
|
|
this.activeDid, |
|
|
this.activeDid, |
|
|
this.description, |
|
|
this.itemDescription, |
|
|
parseFloat(this.amountInput), |
|
|
parseFloat(this.amountInput), |
|
|
this.unitCode, |
|
|
this.unitCode, |
|
|
this.validThroughDate, |
|
|
this.conditionDescription, |
|
|
|
|
|
this.validThroughDateInput, |
|
|
recipientDid, |
|
|
recipientDid, |
|
|
projectId, |
|
|
projectId, |
|
|
); |
|
|
); |
|
@ -507,10 +514,11 @@ export default class OfferDetails extends Vue { |
|
|
this.axios, |
|
|
this.axios, |
|
|
this.apiServer, |
|
|
this.apiServer, |
|
|
this.activeDid, |
|
|
this.activeDid, |
|
|
this.description, |
|
|
this.itemDescription, |
|
|
parseFloat(this.amountInput), |
|
|
parseFloat(this.amountInput), |
|
|
this.unitCode, |
|
|
this.unitCode, |
|
|
this.validThroughDate, |
|
|
this.conditionDescription, |
|
|
|
|
|
this.validThroughDateInput, |
|
|
recipientDid, |
|
|
recipientDid, |
|
|
projectId, |
|
|
projectId, |
|
|
); |
|
|
); |
|
@ -534,7 +542,7 @@ export default class OfferDetails extends Vue { |
|
|
group: "alert", |
|
|
group: "alert", |
|
|
type: "success", |
|
|
type: "success", |
|
|
title: "Success", |
|
|
title: "Success", |
|
|
text: `That ${this.isTrade ? "trade" : "gift"} was recorded.`, |
|
|
text: `That offer was recorded.`, |
|
|
}, |
|
|
}, |
|
|
5000, |
|
|
5000, |
|
|
); |
|
|
); |
|
@ -573,12 +581,12 @@ export default class OfferDetails extends Vue { |
|
|
this.prevCredToEdit?.claim as OfferVerifiableCredential, |
|
|
this.prevCredToEdit?.claim as OfferVerifiableCredential, |
|
|
this.activeDid, |
|
|
this.activeDid, |
|
|
recipientDid, |
|
|
recipientDid, |
|
|
this.description, |
|
|
this.itemDescription, |
|
|
parseFloat(this.amountInput), |
|
|
parseFloat(this.amountInput), |
|
|
this.unitCode, |
|
|
this.unitCode, |
|
|
"", |
|
|
this.conditionDescription, |
|
|
projectId, |
|
|
projectId, |
|
|
this.validThroughDate, |
|
|
this.validThroughDateInput, |
|
|
this.prevCredToEdit?.id as string, |
|
|
this.prevCredToEdit?.id as string, |
|
|
); |
|
|
); |
|
|
const claimStr = JSON.stringify(giveClaim); |
|
|
const claimStr = JSON.stringify(giveClaim); |