From 67dce9e678d747b4da6dd95a61e9796e1991d75d Mon Sep 17 00:00:00 2001 From: Trent Larson Date: Sat, 11 Nov 2023 22:25:06 -0700 Subject: [PATCH] allow for a project ID in the URL --- project.task.yaml | 1 + src/router/index.ts | 2 +- src/views/ProjectViewView.vue | 140 ++++++++++++++++++++++++---------- 3 files changed, 102 insertions(+), 41 deletions(-) diff --git a/project.task.yaml b/project.task.yaml index 31027bcc..af1c65bf 100644 --- a/project.task.yaml +++ b/project.task.yaml @@ -49,6 +49,7 @@ tasks: - .5 make a VC details page - .1 Add units or different icon to the coins (to distinguish $, BTC, hours, etc) - .5 include the hash of the latest commit on help page next to version +- .5 remove references to localStorage for projectId (now that it's pulling from the path) - contacts v+ : - 01 Import all the non-sensitive data (ie. contacts & settings). diff --git a/src/router/index.ts b/src/router/index.ts index 331d314b..8868f60d 100644 --- a/src/router/index.ts +++ b/src/router/index.ts @@ -148,7 +148,7 @@ const routes: Array = [ ), }, { - path: "/project", + path: "/project/:id?", name: "project", component: () => import(/* webpackChunkName: "project" */ "../views/ProjectViewView.vue"), diff --git a/src/views/ProjectViewView.vue b/src/views/ProjectViewView.vue index c619b38e..5f42993a 100644 --- a/src/views/ProjectViewView.vue +++ b/src/views/ProjectViewView.vue @@ -137,10 +137,12 @@

- Given to this Project + Given To This Project

-
    +
    (None yet. Record one above.)
    + +
-
+

- …and from this Project + Contributions By This Project

+ +
-
    -
  • -
    - - {{ didInfo(give.agentDid, activeDid, allMyDids, allContacts) }} - - - {{ give.amount }} - -
    -
    - - {{ give.description }} -
    +
    +

    + Contributions To This Project +

    +
      +
    • +
    @@ -218,6 +222,7 @@ import { didInfo, GiverInputInfo, GiveServerRecord, + PlanServerRecord, } from "@/libs/endorserServer"; import QuickNav from "@/components/QuickNav.vue"; import EntityIcon from "@/components/EntityIcon.vue"; @@ -242,8 +247,9 @@ export default class ProjectViewView extends Vue { apiServer = ""; description = ""; expanded = false; + fulfilledByThis: PlanServerRecord | null = null; + fulfillersToThis: Array = []; givesToThis: Array = []; - givesByThis: Array = []; latitude = 0; longitude = 0; name = ""; @@ -266,7 +272,12 @@ export default class ProjectViewView extends Vue { this.allMyDids = accountsArr.map((acc) => acc.did); const account = accountsArr.find((acc) => acc.did === this.activeDid); const identity = JSON.parse(account?.identity || "null"); - this.LoadProject(identity); + + const pathParam = window.location.pathname.substring("/project/".length); + if (pathParam) { + this.projectId = decodeURIComponent(pathParam); + } + this.LoadProject(this.projectId, identity); } public async getIdentity(activeDid: string) { @@ -320,11 +331,11 @@ export default class ProjectViewView extends Vue { this.expanded = false; } - async LoadProject(identity: IIdentifier) { + async LoadProject(projectId: string, identity: IIdentifier) { + this.projectId = projectId; + const url = - this.apiServer + - "/api/claim/byHandle/" + - encodeURIComponent(this.projectId); + this.apiServer + "/api/claim/byHandle/" + encodeURIComponent(projectId); const headers: RawAxiosRequestHeaders = { "Content-Type": "application/json", }; @@ -389,7 +400,7 @@ export default class ProjectViewView extends Vue { const givesInUrl = this.apiServer + "/api/v2/report/givesForPlans?planIds=" + - encodeURIComponent(JSON.stringify([this.projectId])); + encodeURIComponent(JSON.stringify([projectId])); try { const resp = await this.axios.get(givesInUrl, { headers }); if (resp.status === 200 && resp.data.data) { @@ -422,21 +433,21 @@ export default class ProjectViewView extends Vue { ); } - const givesOutUrl = + const fulfilledByUrl = this.apiServer + - "/api/v2/report/givesProvidedBy?providerId=" + - encodeURIComponent(this.projectId); + "/api/v2/report/planFulfilledByPlan?planHandleId=" + + encodeURIComponent(projectId); try { - const resp = await this.axios.get(givesOutUrl, { headers }); - if (resp.status === 200 && resp.data.data) { - this.givesByThis = resp.data.data; + const resp = await this.axios.get(fulfilledByUrl, { headers }); + if (resp.status === 200) { + this.fulfilledByThis = resp.data.data; } else { this.$notify( { group: "alert", type: "danger", title: "Error", - text: "Failed to retrieve gives by this project.", + text: "Failed to retrieve plans fulfilled by this project.", }, -1, ); @@ -448,15 +459,64 @@ export default class ProjectViewView extends Vue { group: "alert", type: "danger", title: "Error", - text: "Something went wrong retrieving gives by project.", + text: "Something went wrong retrieving plans fulfilled by this project.", }, -1, ); console.error( - "Error retrieving gives by this project:", + "Error retrieving plans fulfilled by this project:", serverError.message, ); } + + const fulfillersToUrl = + this.apiServer + + "/api/v2/report/planFulfillersToPlan?planHandleId=" + + encodeURIComponent(projectId); + try { + const resp = await this.axios.get(fulfillersToUrl, { headers }); + if (resp.status === 200) { + this.fulfillersToThis = resp.data.data; + } else { + this.$notify( + { + group: "alert", + type: "danger", + title: "Error", + text: "Failed to retrieve plan fulfillers to this project.", + }, + -1, + ); + } + } catch (error: unknown) { + const serverError = error as AxiosError; + this.$notify( + { + group: "alert", + type: "danger", + title: "Error", + text: "Something went wrong retrieving plan fulfillers to this project.", + }, + -1, + ); + console.error( + "Error retrieving plan fulfillers to this project:", + serverError.message, + ); + } + } + + /** + * Handle clicking on a project entry found in the list + * @param id of the project + **/ + async onClickLoadProject(projectId: string) { + localStorage.setItem("projectId", projectId); + const route = { + path: "/project/" + encodeURIComponent(projectId), + }; + this.$router.push(route); + this.LoadProject(projectId, await this.getIdentity(this.activeDid)); } getOpenStreetMapUrl() {