Merge pull request #95 from petridishdev/related-topic-links

Related topic links now route to entity pages
bcgov · Dec 20, 2021 · 7245488 · 7245488
2 parents af34cf1 + cbe06d6
commit 7245488
Show file tree

Hide file tree

Showing 2 changed files with 35 additions and 17 deletions.
diff --git a/src/components/entity/EntityResult.vue b/src/components/entity/EntityResult.vue
@@ -165,11 +165,20 @@
                 }}
               </div>
               <h3>
-                <span class="fake-link">{{
-                  getRelationshipName(
+                <router-link
+                  :to="`/entity/${
                     businessAsRelationship[i + relationshipStartIndex]
-                  )
-                }}</span>
+                      .related_topic &&
+                    businessAsRelationship[i + relationshipStartIndex]
+                      .related_topic.source_id
+                  }`"
+                  class="fake-link"
+                  >{{
+                    getRelationshipName(
+                      businessAsRelationship[i + relationshipStartIndex]
+                    )
+                  }}</router-link
+                >
               </h3>
             </div>
           </template>
@@ -268,9 +277,15 @@
           :effectiveDate="ownedByRelationship.credential.effective_date"
         >
           <template #header>
-            <div class="fake-link font-weight-bold">
+            <router-link
+              :to="`/entity/${
+                ownedByRelationship.related_topic &&
+                ownedByRelationship.related_topic.source_id
+              }`"
+              class="font-weight-bold"
+            >
               {{ getRelationshipName(ownedByRelationship) }}
-            </div>
+            </router-link>
           </template>
         </CredentialItem>
       </template>
@@ -401,7 +416,7 @@
 </template>
 
 <script lang="ts">
-import { Component, Vue } from "vue-property-decorator";
+import { Component, Vue, Watch } from "vue-property-decorator";
 import { VuetifyGoToTarget } from "vuetify/types/services/goto";
 import { mapActions, mapGetters } from "vuex";
 import {
@@ -867,6 +882,10 @@ export default class EntityResult extends Vue {
   }
 
   async created(): Promise<void> {
+    await this.reload();
+  }
+
+  async reload(): Promise<void> {
     this.setLoading(true);
     const { sourceId } = this.$route.params;
 
@@ -892,6 +911,13 @@ export default class EntityResult extends Vue {
     this.setLoading(false);
     this.loadingCallBack();
   }
+
+  @Watch("$route.params")
+  async onRouteParamsChanged(params: any): Promise<void> {
+    if (params.sourceId) {
+      this.reload();
+    }
+  }
 }
 </script>
 
@@ -913,13 +939,4 @@ export default class EntityResult extends Vue {
 .flex {
   display: flex;
 }
-.aligned {
-  display: flex;
-  align-items: center;
-}
-.align-right {
-  display: flex;
-  justify-content: right;
-  justify-items: right;
-}
 </style>
diff --git a/src/components/entity/filter/EntityFilterChips.vue b/src/components/entity/filter/EntityFilterChips.vue
@@ -66,7 +66,8 @@ export default class EntityFilterChips extends Vue {
       } else if (this.getEntityFilters[key]) {
         chips.push({
           filterField: key,
-          filterString: key as string,
+          filterString:
+            key === "show_expired" ? "Show Expired" : (key as string),
         });
       }
     });