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

add number of confirmers to certificate & show DID info when appropriate

Browse Source
This commit is contained in:
Trent Larson
2024-12-20 15:49:42 -07:00
parent 2cb70f8497
commit e67ae23879
5 changed files with 57 additions and 23 deletions
Download Patch File Download Diff File Expand all files Collapse all files

53
src/views/ClaimCertificateView.vue
View File

@@ -23,7 +23,7 @@ import QRCode from "qrcode";
import { APP_SERVER, NotificationIface } from "@/constants/app";
import { db, retrieveSettingsForActiveAccount } from "@/db/index";
import * as endorserServer from "@/libs/endorserServer";
import * as serverUtil from "@/libs/endorserServer";
@Component
export default class ClaimCertificateView extends Vue {
@@ -35,7 +35,7 @@ export default class ClaimCertificateView extends Vue {
claimId = "";
claimData = null;
endorserServer = endorserServer;
serverUtil = serverUtil;
async created() {
const settings = await retrieveSettingsForActiveAccount();
@@ -50,14 +50,27 @@ export default class ClaimCertificateView extends Vue {
async fetchClaim() {
try {
const response = await fetch(
const headers = await serverUtil.getHeaders(this.activeDid);
const response = await this.axios.get(
`${this.apiServer}/api/claim/${this.claimId}`,
{ headers },
);
if (response.ok) {
this.claimData = await response.json();
if (response.status === 200) {
this.claimData = await response.data;
const claimEntryIds = [this.claimId];
const headers = await serverUtil.getHeaders(this.activeDid);
const confirmerResponse = await this.axios.post(
`${this.apiServer}/api/v2/report/confirmers/?claimEntryIds=${this.claimId}`,
{ claimEntryIds },
{ headers },
);
let confirmerIds: Array<string> = [];
if (confirmerResponse.status === 200) {
confirmerIds = await confirmerResponse.data.data;
}
await nextTick(); // Wait for the DOM to update
if (this.claimData) {
this.drawCanvas(this.claimData);
this.drawCanvas(this.claimData, confirmerIds);
}
} else {
throw new Error(`Error fetching claim: ${response.statusText}`);
@@ -74,7 +87,8 @@ export default class ClaimCertificateView extends Vue {
}
async drawCanvas(
claimData: endorserServer.GenericCredWrapper<endorserServer.GenericVerifiableCredential>,
claimData: serverUtil.GenericCredWrapper<serverUtil.GenericVerifiableCredential>,
confirmerIds: Array<string>,
) {
await db.open();
const allContacts = await db.contacts.toArray();
@@ -102,7 +116,7 @@ export default class ClaimCertificateView extends Vue {
// Draw claim type
ctx.font = "bold 20px Arial";
const claimTypeText =
this.endorserServer.capitalizeAndInsertSpacesBeforeCaps(
this.serverUtil.capitalizeAndInsertSpacesBeforeCaps(
claimData.claimType || "",
);
const claimTypeWidth = ctx.measureText(claimTypeText).width;
@@ -121,8 +135,10 @@ export default class ClaimCertificateView extends Vue {
(CANVAS_WIDTH - presentedWidth) / 2, // Center horizontally
CANVAS_HEIGHT * 0.37,
);
const agentText = endorserServer.didInfoForCertificate(
claimData.claim.agent,
const agentDid =
claimData.claim.agent.identifier || claimData.claim.agent;
const agentText = serverUtil.didInfoForCertificate(
agentDid,
allContacts,
);
ctx.font = "bold 20px Arial";
@@ -155,12 +171,21 @@ export default class ClaimCertificateView extends Vue {
ctx.font = "14px Arial";
const issuerText =
"Issued by " +
endorserServer.didInfoForCertificate(
claimData.issuer,
allContacts,
);
serverUtil.didInfoForCertificate(claimData.issuer, allContacts);
ctx.fillText(issuerText, CANVAS_WIDTH * 0.3, CANVAS_HEIGHT * 0.6);
}
if (confirmerIds.length > 0) {
const confirmerText =
"Confirmed by " +
confirmerIds.length +
(confirmerIds.length === 1 ? " person" : " people");
ctx.font = "14px Arial";
ctx.fillText(
confirmerText,
CANVAS_WIDTH * 0.3,
CANVAS_HEIGHT * 0.63,
);
}
// Draw claim ID
ctx.font = "14px Arial";