@worksafevictoria/wcl7.5 1.1.0-beta.94 → 1.1.0-beta.96

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@worksafevictoria/wcl7.5",
-  "version": "1.1.0-beta.94",
+  "version": "1.1.0-beta.96",
   "main": "src/index.js",
   "license": "MIT",
   "repository": {

package/src/components/Common/CardGrid/index.vue

@@ -11,7 +11,7 @@
     :title-tag="titleTag"
     class="card-grid"
     :content-class="contentClass"
-    :class="`cardGrid-${$.uid}`"
+    :class="`cardGrid-${gridId}`"
     :card-browse-content="cardBrowseContent"
   >
     <template v-if="$slots.gridHeaderRight" v-slot:headerRight>
@@ -30,7 +30,7 @@
       >
         <column
           v-for="(item, index) in cards"
-          :key="`${redrawCounter}-${index}-${$.uid}`"
+          :key="`${redrawCounter}-${index}-${gridId}`"
           ref="cardColumns"
           :lg="largeViewPort"
           :md="mediumViewPort"
@@ -55,7 +55,7 @@
 import Row from './../../Containers/Row/index.vue'
 import Column from './../../Containers/Column/index.vue'
 import SectionGroup from './../../Containers/SectionGroup/index.vue'
-import debounce from 'lodash/debounce'
+import { debounce } from 'lodash'
 
 export default {
   name: 'CardGrid',
@@ -158,6 +158,10 @@ export default {
       type: Boolean,
       default: false,
     },
+    gridId: {
+      type: String,
+      default: 'default',
+    },
   },
   data() {
     return {

package/src/components/Global/BackToTop/index.vue

@@ -12,23 +12,23 @@
 <script>
 import Icon from '../../SubComponents/Icon/index.vue'
 import ChevUp from '../../../assets/icons/chev-up.svg?raw'
-import debounce from 'lodash/debounce'
+import { debounce } from 'lodash'
 
 export default {
   name: 'BackToTop',
   components: {
-    Icon
+    Icon,
   },
   props: {
     storybook: {
       type: Boolean,
-      default: false
-    }
+      default: false,
+    },
   },
   data() {
     return {
       ChevUp,
-      showBackToTop: false
+      showBackToTop: false,
     }
   },
   computed: {
@@ -38,7 +38,7 @@ export default {
       } else {
         return this.showBackToTop
       }
-    }
+    },
   },
   mounted() {
     this.handleDebouncedScroll = debounce(this.showHideBtbBtn, 100)
@@ -57,8 +57,8 @@ export default {
     },
     showHideBtbBtn() {
       this.showBackToTop = window.scrollY > window.innerHeight / 2
-    }
-  }
+    },
+  },
 }
 </script>
 

package/src/components/Paragraphs/Directory/Records/HSCP/index.stories.js

@@ -3,9 +3,9 @@ import hscpRecord from './index.vue'
 const cpData = 
     {
         title: 'Australian Nurses and Midwifery Federation - Victorian Branch',
-        fulladdress: 'Level 8/535 Elizabeth St Melbourne VIC 3000',
-        workphone: '03 9555 9333',
-        tollfreephone: '1800 555 333',
+        fullAddress: 'Level 8/535 Elizabeth St Melbourne VIC 3000',
+        workPhone: '03 9555 9333',
+        tollfreePhone: '1800 555 333',
         email: 'ohs@test.com.au',
         website: 'https://www.anmfvic.asn.au/education-and-training/hsr-training/events',
         contact1: 'Christina Groebl',
@@ -15,21 +15,15 @@ const cpData =
         phone2: '03 9555 0666',
         email2: 'jbradford@test.com.au',
         courses: ['HSR Initial', 'HSR Refresher'],
-        trainingvenues: ['Melbourne CBD', 'All Regional Victoria - HQ in Melbourne'],
+        trainingVenues: ['Melbourne CBD', 'All Regional Victoria - HQ in Melbourne'],
         id: '1'
     }
 
 
 export default {
-    title: 'Paragraphs/Directory/Record',
+    title: 'Paragraphs/Directory/SingleRecord',
     component: hscpRecord,
-    tags: ['autodocs'],
-    argTypes: {
-        location: {
-            control: ['object', 'boolean'],
-            table: { disable: true }
-          },
-    }
+    tags: ['autodocs']
 }
 
 export const CourseProvider = {}

package/src/components/Paragraphs/Directory/Records/HSCP/index.vue

@@ -10,7 +10,7 @@
         </column>
         <column class="address">
           <a target="_blank" :href="gMapLink">
-            {{ item.fulladdress }}
+            {{ item.fullAddress }}
           </a>
         </column>
         <column class="contact">
@@ -28,7 +28,7 @@
         <column class="contact">
           <div class="label">Phone</div>
           <a :href="`tel:${item.tollfreephone || item.workphone}`"><span class="sr-only visually-hidden">Phone number</span>
-            {{ item.tollfreephone || item.workphone }}
+            {{ item.tollfreePhone || item.workPhone }}
           </a>
         </column>
         <column class="hscp-caret" sm="1">
@@ -107,7 +107,7 @@
         <row>
           <column>
             <ul>
-              <li v-for="(venue) in item.trainingvenues" :key="venue.id">
+              <li v-for="(venue) in item.trainingVenues" :key="venue.id">
                 {{venue}}
               </li>
             </ul> 
@@ -148,10 +148,6 @@ export default {
     item: {
       type: Object,
       required: true
-    },
-    location: {
-      type: [Object, Boolean],
-      default: false
     }
   },
   data() {
@@ -161,6 +157,11 @@ export default {
       CaretDown,
     }
   },
+  computed: {
+    gMapLink() {
+      return `https://google.com/maps?q=${this.item.title}%20${this.item.fullAddress}`
+    },
+  },
   methods: {
     handleClick(title) {
       this.visible = !this.visible

package/src/components/Paragraphs/TabbedCards/index.vue

@@ -1,7 +1,7 @@
 <template>
   <div
     v-if="tabbedCards.length > 0 && loaded"
-    :ref="`tabbedCards-${uid}`"
+    :ref="`tabbedCards-${tabbedCards[0].cardid}`"
     class="tabbed-cards"
   >
     <div v-for="(r, rIndex) in rows" :key="rIndex">
@@ -40,8 +40,7 @@
             :is-expandable="true"
           />
         </template>
-        <template
-          v-slot:cardGridFooter >
+        <template v-slot:cardGridFooter>
           <column
             v-if="selectedRow === rIndex && selectedCard"
             class="listgroup-column"
@@ -105,13 +104,12 @@ export default {
       screenWidth: 0,
       loaded: false,
       tabList: null,
-      uid: Math.random().toString(36).slice(2, 11)
     }
   },
   computed: {
     rows() {
-      let r = Math.ceil(this.tabbedCards.length / this.cols);
-      return r;
+      let r = Math.ceil(this.tabbedCards.length / this.cols)
+      return r
     },
     cols() {
       if (this.screenWidth < 575.98) {
@@ -140,7 +138,7 @@ export default {
   },
   methods: {
     getCardIdPrefix(rIndex, cardIndex) {
-      const cardPrefix = `tabbedcards-${this.uid}-r-${rIndex}`
+      const cardPrefix = `tabbedcards-${this.tabbedCards[0].cardid}-r-${rIndex}`
       if (cardIndex !== null && cardIndex !== undefined) {
         return `${cardPrefix}-${cardIndex}`
       }
@@ -152,10 +150,11 @@ export default {
       return rows.slice(start, end)
     },
     checkSelectedCard(card) {
-      return JSON.stringify(card) === JSON.stringify(this.selectedCard);
+      return JSON.stringify(card) === JSON.stringify(this.selectedCard)
     },
     setCurrentRow(rowIndex, card) {
-      const sameCardSelected = this.checkSelectedCard(card.selectedCard) || !card.selectedCard
+      const sameCardSelected =
+        this.checkSelectedCard(card.selectedCard) || !card.selectedCard
 
       this.selectedCard = null
       this.selectedRow = null

package/src/components/Paragraphs/Tabs/index.vue

@@ -16,14 +16,11 @@
         <b-tabs v-model="tabIndex">
           <b-tab
             v-for="(item, index) in items"
-            :key="`${index}-${$.uid}`"
+            :key="`${index}-${item.cardId}`"
             :title="item.title"
             :title-link-class="`tab-item-${index}-${$.uid}`"
           >
-            <rich-text
-              :content="item.content.value"
-              :without-container="true"
-            />
+            <rich-text :content="item" :without-container="true" />
           </b-tab>
         </b-tabs>
       </template>

package/src/components/SubComponents/FormAddressPostcode/index.vue

@@ -41,7 +41,8 @@
 </template>
 <script>
 import axios from 'axios'
-import debounce from 'lodash/debounce'
+import { debounce } from 'lodash'
+
 import { detectBrowser } from '../../../../lib/detect-browser'
 import { BSpinner } from 'bootstrap-vue-next'