kentbull
/
crowd-funder-for-time-pwa
forked from trent_larson/crowd-funder-for-time-pwa
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

give-detail page: add more-correct parameters from confirm-give page, and allow toggling of project & user-recipient

kb/add-usage-guide
Trent Larson 3 months ago
parent
15256bf698
commit
b87142d3ed
3 changed files with 121 additions and 102 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 2
      src/main.ts
  2. 163
      src/views/ConfirmGiftView.vue
  3. 58
      src/views/GiftedDetails.vue

2
src/main.ts
View File

@ -69,6 +69,7 @@ import {
faRotate,
faShareNodes,
faSpinner,
faSquare,
faSquareCaretDown,
faSquareCaretUp,
faSquarePlus,
@ -138,6 +139,7 @@ library.add(
faRotate,
faShareNodes,
faSpinner,
faSquare,
faSquareCaretDown,
faSquareCaretUp,
faSquarePlus,

163
src/views/ConfirmGiftView.vue
View File

@ -27,7 +27,7 @@
</h1>
</div>
<div v-if="detailsForGive">
<div v-if="giveDetails">
<div class="flex justify-center">
<button
class="col-span-1 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-4 py-2 rounded-md"
@ -69,19 +69,19 @@
{{ giverName }}
</div>
<div class="ml-6">gave</div>
<div v-if="veriClaim.claim?.object">
<div v-if="giveDetails.amount">
<fa icon="hand-holding-dollar" class="fa-fw text-slate-400" />
{{
displayAmount(
veriClaim.claim.object.unitCode,
veriClaim.claim.object.amountOfThisGood,
giveDetails.unit,
giveDetails.amount,
)
}}
</div>
<div>
<div v-if="giveDetails.description">
<fa icon="message" class="fa-fw text-slate-400" />
{{ veriClaim.claim?.object ? "and:" : "" }}
{{ veriClaim.claim?.description }}
{{ giveDetails.amount ? "and:" : "" }}
{{ giveDetails.description }}
</div>
<div class="ml-6">to</div>
<div>
@ -91,17 +91,17 @@
<div>
<fa icon="calendar" class="fa-fw text-slate-400" />
on
{{ veriClaim.issuedAt?.substring(0, 10) }}
{{ giveDetails.issuedAt.substring(0, 10) }}
</div>
<!-- Fullfills Links -->
<!-- fullfills links for a give -->
<div class="mt-2" v-if="detailsForGive?.fulfillsPlanHandleId">
<div class="mt-2" v-if="giveDetails?.fulfillsPlanHandleId">
<router-link
:to="
'/project/' +
encodeURIComponent(detailsForGive?.fulfillsPlanHandleId)
encodeURIComponent(giveDetails?.fulfillsPlanHandleId)
"
class="text-blue-500 mt-2 cursor-pointer"
target="_blank"
@ -113,16 +113,16 @@
<!-- if there's another, it's probably fulfilling an offer, too -->
<div
v-if="
detailsForGive?.fulfillsType &&
detailsForGive?.fulfillsType !== 'PlanAction' &&
detailsForGive?.fulfillsHandleId
giveDetails?.fulfillsType &&
giveDetails?.fulfillsType !== 'PlanAction' &&
giveDetails?.fulfillsHandleId
"
>
<!-- router-link to /claim/ only changes URL path -->
<router-link
:to="
'/claim/' +
encodeURIComponent(detailsForGive?.fulfillsHandleId)
encodeURIComponent(giveDetails?.fulfillsHandleId)
"
class="text-blue-500 mt-2 cursor-pointer"
target="_blank"
@ -130,7 +130,7 @@
This fulfills
{{
capitalizeAndInsertSpacesBeforeCapsWithAPrefix(
detailsForGive.fulfillsType,
giveDetails.fulfillsType,
)
}}
<fa icon="arrow-up-right-from-square" class="fa-fw" />
@ -254,7 +254,7 @@
<div v-if="confirmerIdList.includes(activeDid)">
You have confirmed this claim.
</div>
<div v-else-if="veriClaim.issuer == activeDid">
<div v-else-if="giveDetails.agentDid == activeDid">
You cannot confirm this because you issued this claim, so you already
count as confirming it.
</div>
@ -428,7 +428,7 @@ export default class ClaimView extends Vue {
confirmerIdList: string[] = []; // list of DIDs that have confirmed this claim excluding the issuer
confsVisibleErrorMessage = "";
confsVisibleToIdList: string[] = []; // list of DIDs that can see any confirmer
detailsForGive = null;
giveDetails = null;
giverName = "";
issuerName = "";
numConfsNotVisible = 0; // number of hidden DIDs in the confirmerIdList, minus the issuer if they aren't visible
@ -449,7 +449,7 @@ export default class ClaimView extends Vue {
this.confirmerIdList = [];
this.confsVisibleErrorMessage = "";
this.confsVisibleToIdList = [];
this.detailsForGive = null;
this.giveDetails = null;
this.numConfsNotVisible = 0;
this.urlForNewGive = "";
this.veriClaim = serverUtil.BLANK_GENERIC_SERVER_RECORD;
@ -603,64 +603,7 @@ export default class ClaimView extends Vue {
this.issuerName = this.didInfo(this.veriClaim.issuer);
this.urlForNewGive = "/gifted-details?";
if (this.veriClaim.claim.object) {
if (this.veriClaim.claim.object.amountOfThisGood) {
this.urlForNewGive +=
"&amountInput=" +
encodeURIComponent(
String(this.veriClaim.claim.object.amountOfThisGood),
);
}
if (this.veriClaim.claim.object.unitCode) {
this.urlForNewGive +=
"&unitCode=" +
encodeURIComponent(this.veriClaim.claim.object.unitCode as string);
}
}
if (this.veriClaim.claim.description) {
this.urlForNewGive +=
"&description=" +
encodeURIComponent(this.veriClaim.claim.description as string);
}
this.giverName = this.didInfo(
this.veriClaim.claim.agent?.identifier as string,
);
if (this.veriClaim.claim.agent) {
this.urlForNewGive +=
"&giverDid=" +
encodeURIComponent(this.veriClaim.claim.agent.identifier as string) +
"&giverName=" +
encodeURIComponent(this.giverName);
}
this.recipientName = this.didInfo(
this.veriClaim.claim.recipient?.identifier as string,
);
if (this.veriClaim.claim.recipient) {
this.urlForNewGive +=
"&recipientDid=" +
encodeURIComponent(
this.veriClaim.claim.recipient.identifier as string,
) +
"&recipientName=" +
encodeURIComponent(this.recipientName);
}
if (this.veriClaim.claim.image) {
this.urlForNewGive +=
"&image=" + encodeURIComponent(this.veriClaim.claim.image as string);
}
if (this.veriClaim.claim.fulfills) {
this.urlForNewGive += this.fulfillsUrlSnippet(
this.veriClaim.claim.fulfills,
);
if (Array.isArray(this.veriClaim.claim.fulfills)) {
for (const fulfills of this.veriClaim.claim.fulfills) {
console.log("adding fulfills:", fulfills);
this.urlForNewGive += this.fulfillsUrlSnippet(fulfills);
}
}
}
// use give record when possible since it may include edits
const giveUrl =
this.apiServer +
"/api/v2/report/gives?handleId=" +
@ -671,7 +614,7 @@ export default class ClaimView extends Vue {
});
// giveResp.data is a Give from https://api.endorser.ch/api-docs/
if (giveResp.status === 200) {
this.detailsForGive = giveResp.data.data[0];
this.giveDetails = giveResp.data.data[0];
} else {
console.error("Error getting detailed give info:", giveResp);
this.$notify(
@ -685,6 +628,52 @@ export default class ClaimView extends Vue {
);
}
this.urlForNewGive = "/gifted-details?";
if (this.giveDetails.amount) {
this.urlForNewGive +=
"&amountInput=" + encodeURIComponent(String(this.giveDetails.amount));
}
if (this.giveDetails.unit) {
this.urlForNewGive +=
"&unitCode=" + encodeURIComponent(this.giveDetails.unit);
}
if (this.giveDetails.description) {
this.urlForNewGive +=
"&description=" + encodeURIComponent(this.giveDetails.description);
}
this.giverName = this.didInfo(this.giveDetails.agentDid);
if (this.giveDetails.agentDid) {
this.urlForNewGive +=
"&giverDid=" +
encodeURIComponent(this.giveDetails.agentDid) +
"&giverName=" +
encodeURIComponent(this.giverName);
}
this.recipientName = this.didInfo(this.giveDetails.recipientDid);
if (this.giveDetails.recipientDid) {
this.urlForNewGive +=
"&recipientDid=" +
encodeURIComponent(this.giveDetails.recipientDid) +
"&recipientName=" +
encodeURIComponent(this.recipientName);
}
if (this.giveDetails.fullClaim.image) {
this.urlForNewGive +=
"&image=" + encodeURIComponent(this.giveDetails.fullClaim.image);
}
if (
this.giveDetails.type == "Offer" &&
this.giveDetails.fulfillsHandleId
) {
this.urlForNewGive +=
"&offerId=" + encodeURIComponent(this.giveDetails.fulfillsHandleId);
}
if (this.giveDetails.fulfillsPlanHandleId) {
this.urlForNewGive +=
"&projectId=" +
encodeURIComponent(this.giveDetails.fulfillsPlanHandleId);
}
// retrieve the list of confirmers
const confirmUrl =
this.apiServer +
@ -698,7 +687,7 @@ export default class ClaimView extends Vue {
const resultList1 = response.data.result || [];
const resultList2 = R.reject(serverUtil.isHiddenDid, resultList1);
const resultList3 = R.reject(
(did: string) => did === this.veriClaim.issuer,
(did: string) => did === this.giveDetails.agentDid,
resultList2,
);
this.confirmerIdList = resultList3;
@ -729,16 +718,6 @@ export default class ClaimView extends Vue {
}
}
fulfillsUrlSnippet(object) {
if (object["@type"] === "PlanAction") {
return "&projectId=" + encodeURIComponent(object.identifier);
} else if (object["@type"] === "OfferAction") {
return "&offerId=" + encodeURIComponent(object.identifier);
} else {
return "";
}
}
confirmConfirmClaim() {
this.$notify(
{
@ -785,7 +764,7 @@ export default class ClaimView extends Vue {
title: "Success",
text: "Confirmation submitted.",
},
5000,
3000,
);
} else {
console.error("Got error submitting the confirmation:", result);
@ -818,7 +797,7 @@ export default class ClaimView extends Vue {
(this.$refs.customGiveDialog as GiftedDialog).open(
giver,
undefined,
this.veriClaim.handleId,
this.giveDetails.handleId,
"Offer fulfilled by " + (giver?.name || "someone not named"),
);
}
@ -860,7 +839,7 @@ export default class ClaimView extends Vue {
},
3000,
);
} else if (this.veriClaim.issuer == this.activeDid) {
} else if (this.giveDetails.agentDid == this.activeDid) {
this.$notify(
{
group: "alert",
@ -870,7 +849,7 @@ export default class ClaimView extends Vue {
},
3000,
);
} else if (serverUtil.containsHiddenDid(this.veriClaim.claim)) {
} else if (serverUtil.containsHiddenDid(this.giveDetails.fullClaim)) {
this.$notify(
{
group: "alert",

58
src/views/GiftedDetails.vue
View File

@ -76,17 +76,40 @@
</div>
<ImageMethodDialog ref="imageDialog" />
<div v-if="projectId" class="mt-4">
<div class="mt-4">
<input
v-if="!givenToUser"
type="checkbox"
class="h-6 w-6 mr-2"
v-model="givenToProject"
/>
<fa
icon="check"
class="bg-slate-500 text-white h-5 w-5 px-0.5 py-0.5 mr-2 rounded"
v-else
icon="square"
class="bg-slate-500 text-slate-500 h-5 w-5 px-0.5 py-0.5 mr-2 rounded"
@click="
notifyUser('Cannot be both given to you and also given to a project.')
"
/>
<label class="text-sm">This is given to {{ projectName }}</label>
<label class="text-sm">This was given to {{ projectName }}</label>
</div>
<div v-if="showGivenToUser" class="mt-4">
<input type="checkbox" class="h-6 w-6 mr-2" v-model="givenToUser" />
<label class="text-sm">Given to you</label>
<div class="mt-4">
<input
v-if="!givenToProject"
type="checkbox"
class="h-6 w-6 mr-2"
v-model="givenToUser"
/>
<fa
v-else
icon="square"
class="bg-slate-500 text-slate-500 h-5 w-5 px-0.5 py-0.5 mr-2 rounded"
@click="
notifyUser('Cannot be both given to a project and also given to you.')
"
/>
<label class="text-sm">This was given to you</label>
</div>
<div class="mt-4">
@ -148,6 +171,7 @@ export default class GiftedDetails extends Vue {
amountInput = "0";
description = "";
destinationNameAfter = "";
givenToProject = false;
givenToUser = false;
giverDid: string | undefined;
giverName = "";
@ -215,7 +239,8 @@ export default class GiftedDetails extends Vue {
this.recipientName =
this.recipientDid === this.activeDid ? "you" : "someone not named";
}
this.showGivenToUser =
this.givenToProject = !!this.projectId;
this.givenToUser =
!this.projectId && this.recipientDid === this.activeDid;
// eslint-disable-next-line @typescript-eslint/no-explicit-any
@ -241,7 +266,7 @@ export default class GiftedDetails extends Vue {
this.axios,
this.apiServer,
);
// console.log("Got project name from cache", project);
console.log("Got project name from cache", project);
this.projectName = project?.name
? "the project: " + project.name
: "a project";
@ -413,6 +438,18 @@ export default class GiftedDetails extends Vue {
await this.recordGive();
}
notifyUser(message: string) {
this.$notify(
{
group: "alert",
type: "warning",
title: "Error",
text: message,
},
3000,
);
}
/**
*
* @param giverDid may be null
@ -429,6 +466,7 @@ export default class GiftedDetails extends Vue {
? this.activeDid
: undefined
: this.recipientDid;
const projectId = this.givenToProject ? this.projectId : undefined;
const result = await createAndSubmitGive(
this.axios,
this.apiServer,
@ -438,7 +476,7 @@ export default class GiftedDetails extends Vue {
this.description,
parseFloat(this.amountInput),
this.unitCode,
this.projectId,
projectId,
this.offerId,
this.isTrade,
this.imageUrl,

Write Preview
Loading…
Cancel
Save