@worksafevictoria/wcl7.5 1.1.0-beta.70 → 1.1.0-beta.71
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/package.json +1 -1
- package/src/components/Paragraphs/Directory/Records/HSCP/index.stories.js +32 -0
- package/src/components/Paragraphs/Directory/Records/HSCP/index.vue +213 -0
- package/src/components/Paragraphs/Directory/Records/index.vue +28 -7
- package/src/components/Paragraphs/Directory/Records/styles.scss +1 -0
- package/src/components/Paragraphs/Directory/constants.js +23 -5
- package/src/components/Paragraphs/Directory/index.vue +3 -3
package/package.json
CHANGED
|
@@ -0,0 +1,32 @@
|
|
|
1
|
+
import hscpRecord from './index.vue'
|
|
2
|
+
|
|
3
|
+
const cpData =
|
|
4
|
+
{
|
|
5
|
+
title: 'Australian Nurses and Midwifery Federation - Victorian Branch',
|
|
6
|
+
fulladdress: 'Level 8/535 Elizabeth St Melbourne VIC 3000',
|
|
7
|
+
workphone: '03 9275 9333',
|
|
8
|
+
tollfreephone: '1800 133 353',
|
|
9
|
+
email: 'ohs@anmfvic.asn.au',
|
|
10
|
+
website: 'https://www.anmfvic.asn.au/education-and-training/hsr-training/events',
|
|
11
|
+
courses: ['HSR Initial', 'HSR Refresher'],
|
|
12
|
+
// companyid: 'ACAR-A842BA'
|
|
13
|
+
}
|
|
14
|
+
|
|
15
|
+
|
|
16
|
+
export default {
|
|
17
|
+
title: 'Paragraphs/Directory/Record',
|
|
18
|
+
component: hscpRecord,
|
|
19
|
+
tags: ['autodocs'],
|
|
20
|
+
argTypes: {
|
|
21
|
+
location: {
|
|
22
|
+
control: ['object', 'boolean'],
|
|
23
|
+
table: { disable: true }
|
|
24
|
+
},
|
|
25
|
+
}
|
|
26
|
+
}
|
|
27
|
+
|
|
28
|
+
export const CourseProvider = {}
|
|
29
|
+
|
|
30
|
+
CourseProvider.args = {
|
|
31
|
+
item: cpData,
|
|
32
|
+
}
|
|
@@ -0,0 +1,213 @@
|
|
|
1
|
+
<template>
|
|
2
|
+
<div class="paragraph--directory__records--hscp">
|
|
3
|
+
<container>
|
|
4
|
+
<row>
|
|
5
|
+
<column class="title">
|
|
6
|
+
<!-- <a target="_blank" :href="pageLink"> -->
|
|
7
|
+
{{ item.title }}
|
|
8
|
+
<!-- </a> -->
|
|
9
|
+
</column>
|
|
10
|
+
<column class="address">
|
|
11
|
+
<a target="_blank" :href="gMapLink">
|
|
12
|
+
{{ item.fulladdress }}
|
|
13
|
+
</a>
|
|
14
|
+
</column>
|
|
15
|
+
<column class="contact">
|
|
16
|
+
<div class="labl">Email</div>
|
|
17
|
+
<a target="_blank" :href="`mailto:${item.email}`"><span class="sr-only visually-hidden">Email address</span>
|
|
18
|
+
{{ item.email }}
|
|
19
|
+
</a>
|
|
20
|
+
</column>
|
|
21
|
+
<column class="contact">
|
|
22
|
+
<div class="labl">Website</div>
|
|
23
|
+
<a target="_blank" :href="`${item.website}`"><span class="sr-only visually-hidden">Website address</span>
|
|
24
|
+
{{ item.website }}
|
|
25
|
+
</a>
|
|
26
|
+
</column>
|
|
27
|
+
<column class="contact">
|
|
28
|
+
<div class="labl">Phone</div>
|
|
29
|
+
<a :href="`tel:${item.tollfreephone || item.workphone}`"><span class="sr-only visually-hidden">Phone number</span>
|
|
30
|
+
{{ item.tollfreephone || item.workphone }}
|
|
31
|
+
</a
|
|
32
|
+
>
|
|
33
|
+
</column>
|
|
34
|
+
</row>
|
|
35
|
+
</container>
|
|
36
|
+
</div>
|
|
37
|
+
</template>
|
|
38
|
+
<script>
|
|
39
|
+
import Container from '../../../../Containers/Container/index.vue'
|
|
40
|
+
import Row from '../../../../Containers/Row/index.vue'
|
|
41
|
+
import Column from '../../../../Containers/Column/index.vue'
|
|
42
|
+
|
|
43
|
+
export default {
|
|
44
|
+
components: {
|
|
45
|
+
Container,
|
|
46
|
+
Row,
|
|
47
|
+
Column
|
|
48
|
+
},
|
|
49
|
+
props: {
|
|
50
|
+
item: {
|
|
51
|
+
type: Object,
|
|
52
|
+
required: true
|
|
53
|
+
},
|
|
54
|
+
location: {
|
|
55
|
+
type: [Object, Boolean],
|
|
56
|
+
default: false
|
|
57
|
+
}
|
|
58
|
+
},
|
|
59
|
+
computed: {
|
|
60
|
+
gMapLink() {
|
|
61
|
+
// return `https://google.com/maps?q=${this.item.title}%20${this.item.suburb},${this.item.postcode}`
|
|
62
|
+
return `https://google.com/maps?q=${this.item.title}%20${this.item.fulladdress}`
|
|
63
|
+
},
|
|
64
|
+
/* pageLink() {
|
|
65
|
+
return `https://www1.worksafe.vic.gov.au/vwa/serviceproviderdirec.nsf/pages/${this.item.companyid}`
|
|
66
|
+
} */
|
|
67
|
+
},
|
|
68
|
+
}
|
|
69
|
+
</script>
|
|
70
|
+
|
|
71
|
+
<style lang="scss" scoped>
|
|
72
|
+
@import '../styles.scss';
|
|
73
|
+
|
|
74
|
+
.paragraph--directory__records--hscp {
|
|
75
|
+
|
|
76
|
+
a {
|
|
77
|
+
color: $black;
|
|
78
|
+
text-decoration: none;
|
|
79
|
+
}
|
|
80
|
+
a:hover {
|
|
81
|
+
text-decoration: underline;
|
|
82
|
+
}
|
|
83
|
+
a:focus {
|
|
84
|
+
text-decoration: underline;
|
|
85
|
+
}
|
|
86
|
+
|
|
87
|
+
.name {
|
|
88
|
+
font-size: 1rem;
|
|
89
|
+
color: $black;
|
|
90
|
+
font-weight: 700;
|
|
91
|
+
}
|
|
92
|
+
.address {
|
|
93
|
+
font-size: 15px;
|
|
94
|
+
a {
|
|
95
|
+
color: inherit;
|
|
96
|
+
text-decoration: none;
|
|
97
|
+
}
|
|
98
|
+
a:hover {
|
|
99
|
+
text-decoration: underline;
|
|
100
|
+
}
|
|
101
|
+
a:focus {
|
|
102
|
+
text-decoration: underline;
|
|
103
|
+
}
|
|
104
|
+
}
|
|
105
|
+
.phone {
|
|
106
|
+
a {
|
|
107
|
+
color: inherit;
|
|
108
|
+
}
|
|
109
|
+
}
|
|
110
|
+
.labl {
|
|
111
|
+
font-size: 15px;
|
|
112
|
+
font-weight: bold;
|
|
113
|
+
}
|
|
114
|
+
}
|
|
115
|
+
.paragraph--directory.hscp-filters {
|
|
116
|
+
.search {
|
|
117
|
+
color: $black;
|
|
118
|
+
border: 1px solid $gray;
|
|
119
|
+
border-radius: 8px;
|
|
120
|
+
padding: 10px 12px;
|
|
121
|
+
height: 42px;
|
|
122
|
+
background-repeat: no-repeat;
|
|
123
|
+
background-position: 96% 12px;
|
|
124
|
+
margin-bottom: 16px;
|
|
125
|
+
transition: none;
|
|
126
|
+
}
|
|
127
|
+
select {
|
|
128
|
+
-moz-appearance: none; /* Firefox */
|
|
129
|
+
-webkit-appearance: none; /* Safari and Chrome */
|
|
130
|
+
appearance: none;
|
|
131
|
+
height: 42px;
|
|
132
|
+
border-radius: 8px;
|
|
133
|
+
padding: 10px 12px;
|
|
134
|
+
width: 100%;
|
|
135
|
+
border: 1px solid $gray;
|
|
136
|
+
background-image: url('@worksafevictoria/wcl7.5/src/assets/icons/caret-down.svg');
|
|
137
|
+
background-position: 95% 50%;
|
|
138
|
+
background-repeat: no-repeat;
|
|
139
|
+
text-transform: capitalise;
|
|
140
|
+
}
|
|
141
|
+
.grid-column {
|
|
142
|
+
display: inline-block;
|
|
143
|
+
width: 25%;
|
|
144
|
+
|
|
145
|
+
@media (max-width: 767px) {
|
|
146
|
+
width: 50%;
|
|
147
|
+
}
|
|
148
|
+
|
|
149
|
+
@media (max-width: 539px) {
|
|
150
|
+
display: block;
|
|
151
|
+
width: 100%;
|
|
152
|
+
float: none;
|
|
153
|
+
margin-bottom: 16px;
|
|
154
|
+
}
|
|
155
|
+
}
|
|
156
|
+
.right {
|
|
157
|
+
float: right;
|
|
158
|
+
position: relative;
|
|
159
|
+
}
|
|
160
|
+
|
|
161
|
+
ul.records {
|
|
162
|
+
padding: 0;
|
|
163
|
+
margin: 0;
|
|
164
|
+
|
|
165
|
+
li {
|
|
166
|
+
text-align: left;
|
|
167
|
+
display: block;
|
|
168
|
+
width: 100%;
|
|
169
|
+
background: $white;
|
|
170
|
+
color: $black;
|
|
171
|
+
margin-bottom: 32px;
|
|
172
|
+
border: 1px solid $gray;
|
|
173
|
+
border-radius: 12px;
|
|
174
|
+
font-size: 14px;
|
|
175
|
+
padding: 16px;
|
|
176
|
+
|
|
177
|
+
.name {
|
|
178
|
+
font-size: 1rem;
|
|
179
|
+
color: $black;
|
|
180
|
+
font-weight: 700;
|
|
181
|
+
}
|
|
182
|
+
.address {
|
|
183
|
+
font-size: 15px;
|
|
184
|
+
a {
|
|
185
|
+
color: inherit;
|
|
186
|
+
}
|
|
187
|
+
}
|
|
188
|
+
.phone {
|
|
189
|
+
a {
|
|
190
|
+
color: inherit;
|
|
191
|
+
}
|
|
192
|
+
.labl {
|
|
193
|
+
font-size: 15px;
|
|
194
|
+
font-weight: bold;
|
|
195
|
+
}
|
|
196
|
+
}
|
|
197
|
+
|
|
198
|
+
@media (max-width: 767px) {
|
|
199
|
+
.name,
|
|
200
|
+
.address,
|
|
201
|
+
.phone {
|
|
202
|
+
margin-bottom: 5px;
|
|
203
|
+
width: 100%;
|
|
204
|
+
}
|
|
205
|
+
}
|
|
206
|
+
.pagination-container {
|
|
207
|
+
text-align: center;
|
|
208
|
+
}
|
|
209
|
+
}
|
|
210
|
+
}
|
|
211
|
+
}
|
|
212
|
+
</style>
|
|
213
|
+
|
|
@@ -2,12 +2,8 @@
|
|
|
2
2
|
<div v-if="items.length" class="paragraph--directory__records">
|
|
3
3
|
<template v-for="(item, index) in flatRecords">
|
|
4
4
|
<prs-record v-if="item.type === 'prs'" :key="index" :item="item" />
|
|
5
|
-
<isp-record
|
|
6
|
-
|
|
7
|
-
:key="index"
|
|
8
|
-
:item="item"
|
|
9
|
-
:location="baseLocation"
|
|
10
|
-
/>
|
|
5
|
+
<isp-record v-if="item.type === 'isp'" :key="index" :item="item" :location="baseLocation" />
|
|
6
|
+
<hscp-record v-if="item.type === 'hscp'" :key="index" :item="item" />
|
|
11
7
|
<cj-record v-if="item.type === 'cj'" :key="index" :item="item" />
|
|
12
8
|
</template>
|
|
13
9
|
</div>
|
|
@@ -16,12 +12,14 @@
|
|
|
16
12
|
import PrsRecord from './PRS/index.vue'
|
|
17
13
|
import IspRecord from './ISP/index.vue'
|
|
18
14
|
import CjRecord from './CJ/index.vue'
|
|
15
|
+
import HscpRecord from './HSCP/index.vue'
|
|
19
16
|
|
|
20
17
|
export default {
|
|
21
18
|
components: {
|
|
22
19
|
PrsRecord,
|
|
23
20
|
IspRecord,
|
|
24
|
-
CjRecord
|
|
21
|
+
CjRecord,
|
|
22
|
+
HscpRecord
|
|
25
23
|
},
|
|
26
24
|
props: {
|
|
27
25
|
items: {
|
|
@@ -142,6 +140,29 @@ export default {
|
|
|
142
140
|
}
|
|
143
141
|
})
|
|
144
142
|
}
|
|
143
|
+
if (record.record_type === 'hscp') {
|
|
144
|
+
let {
|
|
145
|
+
record_id,
|
|
146
|
+
data: {
|
|
147
|
+
attributes: {
|
|
148
|
+
title,
|
|
149
|
+
hscp: { fulladdress, workphone, tollfreephone, email, website, courses, companyid } = {}
|
|
150
|
+
} = {}
|
|
151
|
+
} = {}
|
|
152
|
+
} = record
|
|
153
|
+
flatRecords.push({
|
|
154
|
+
id: record_id,
|
|
155
|
+
type: 'hscp',
|
|
156
|
+
title,
|
|
157
|
+
fulladdress,
|
|
158
|
+
workphone,
|
|
159
|
+
tollfreephone,
|
|
160
|
+
email,
|
|
161
|
+
website,
|
|
162
|
+
courses,
|
|
163
|
+
companyid
|
|
164
|
+
})
|
|
165
|
+
}
|
|
145
166
|
if (record.record_type === 'cj') {
|
|
146
167
|
let {
|
|
147
168
|
record_id,
|
|
@@ -22,6 +22,29 @@ export const DIR_CONFIG = {
|
|
|
22
22
|
}
|
|
23
23
|
]
|
|
24
24
|
},
|
|
25
|
+
hscp: {
|
|
26
|
+
taxonomies: [
|
|
27
|
+
{
|
|
28
|
+
name: 'Service Type',
|
|
29
|
+
id: 'hscp_services',
|
|
30
|
+
record_id: 'record_hscp_services'
|
|
31
|
+
}
|
|
32
|
+
],
|
|
33
|
+
sorting: [
|
|
34
|
+
{
|
|
35
|
+
label: 'Name A-Z',
|
|
36
|
+
field: 'record_title',
|
|
37
|
+
order: 'asc',
|
|
38
|
+
type: 'az'
|
|
39
|
+
},
|
|
40
|
+
{
|
|
41
|
+
label: 'Name Z-A',
|
|
42
|
+
field: 'record_title',
|
|
43
|
+
order: 'desc',
|
|
44
|
+
type: 'az'
|
|
45
|
+
}
|
|
46
|
+
]
|
|
47
|
+
},
|
|
25
48
|
prs: {
|
|
26
49
|
taxonomies: [
|
|
27
50
|
{
|
|
@@ -39,11 +62,6 @@ export const DIR_CONFIG = {
|
|
|
39
62
|
id: 'court',
|
|
40
63
|
record_id: 'record_prs_court'
|
|
41
64
|
}
|
|
42
|
-
// {
|
|
43
|
-
// name: 'Coram',
|
|
44
|
-
// id: 'coram',
|
|
45
|
-
// taxonomy_only: true
|
|
46
|
-
// }
|
|
47
65
|
],
|
|
48
66
|
sorting: [
|
|
49
67
|
{
|
|
@@ -26,9 +26,9 @@
|
|
|
26
26
|
<div v-else class="paragraph--directory__loading-container">
|
|
27
27
|
<loading />
|
|
28
28
|
</div>
|
|
29
|
-
<div v-if="showPagination" align="center">
|
|
29
|
+
<div v-if="showPagination" align-items="center">
|
|
30
30
|
<pagination
|
|
31
|
-
align="center"
|
|
31
|
+
align-items="center"
|
|
32
32
|
aria-label="Page navigation to load more records"
|
|
33
33
|
:rows="qs.rows"
|
|
34
34
|
:offset="qs.start"
|
|
@@ -39,7 +39,7 @@
|
|
|
39
39
|
@pageClicked="loadByPageNumber($event)"
|
|
40
40
|
/>
|
|
41
41
|
</div>
|
|
42
|
-
<div v-if="noResultsFound" align="center">
|
|
42
|
+
<div v-if="noResultsFound" align-items="center">
|
|
43
43
|
<div>
|
|
44
44
|
<p>No records found, please try a different search.</p>
|
|
45
45
|
</div>
|