@dcodegroup-au/page-builder 0.3.6 → 0.3.7
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/dist/page-builder.css +1 -1
- package/dist/page-builder.es.js +6709 -6609
- package/dist/page-builder.umd.js +45 -45
- package/example/src/App.vue +4 -2
- package/example/src/pages/BestLife.js +0 -1
- package/example/src/pages/OurVision.js +148 -0
- package/package.json +1 -1
- package/src/components/PageBuilder.vue +2 -0
- package/src/components/PageRender.vue +2 -0
- package/src/components/builders/Header.vue +5 -9
- package/src/components/builders/Links.vue +9 -2
- package/src/components/helpers/defaultProps.js +1 -1
- package/src/components/helpers/pageBuilderFactory.js +11 -1
- package/src/components/presenters/modules/Callout.vue +32 -0
- package/src/components/presenters/modules/TwoColumnsImageContent.vue +37 -2
- package/tailwind.config.js +3 -0
package/example/src/App.vue
CHANGED
|
@@ -2,6 +2,7 @@
|
|
|
2
2
|
import {Home} from "./pages/Home.js";
|
|
3
3
|
import {BestLife} from "./pages/BestLife.js";
|
|
4
4
|
import {AboutUs} from "./pages/AboutUs.js";
|
|
5
|
+
import {OurVision} from "./pages/OurVision.js";
|
|
5
6
|
|
|
6
7
|
const slide = {
|
|
7
8
|
title: "About ELAA",
|
|
@@ -85,9 +86,10 @@ const breadcrumbs = [
|
|
|
85
86
|
|
|
86
87
|
<template>
|
|
87
88
|
<div>
|
|
89
|
+
{{ JSON.stringify(OurVision) }}
|
|
88
90
|
<div style="margin: 40px 0">
|
|
89
91
|
<h1 style="margin-bottom: 20px; font-size: 50px;">Page Render</h1>
|
|
90
|
-
<PageRender :page="
|
|
92
|
+
<PageRender :page="OurVision"/>
|
|
91
93
|
</div>
|
|
92
94
|
<div style="margin: 40px 0">
|
|
93
95
|
<h1 style="margin-bottom: 20px; font-size: 50px;">Slider Edit</h1>
|
|
@@ -103,7 +105,7 @@ const breadcrumbs = [
|
|
|
103
105
|
</div>
|
|
104
106
|
<div style="margin: 40px 0">
|
|
105
107
|
<h1 style="margin-bottom: 20px; font-size: 50px;">Page Builder</h1>
|
|
106
|
-
<PageBuilder v-model="
|
|
108
|
+
<PageBuilder v-model="OurVision" :breadcrumbs="breadcrumbs"/>
|
|
107
109
|
</div>
|
|
108
110
|
</div>
|
|
109
111
|
</template>
|
|
@@ -0,0 +1,148 @@
|
|
|
1
|
+
export const OurVision =
|
|
2
|
+
{
|
|
3
|
+
title: "Our Vision & History",
|
|
4
|
+
sections: [
|
|
5
|
+
{
|
|
6
|
+
title: "Standard header",
|
|
7
|
+
type: "standard_header",
|
|
8
|
+
components: [
|
|
9
|
+
{
|
|
10
|
+
name: "Standard header",
|
|
11
|
+
type: "header",
|
|
12
|
+
title: "Our Vision & History",
|
|
13
|
+
supporting_text_max_length: 500,
|
|
14
|
+
supporting_text: "ELAA is the national peak body championing excellence in early learning for children and supporting parents and service. For over 30 years Early Learning Association Australia (ELAA) has been working with parents and early learning providers toward a shared vision of excellence in early learning for every child.",
|
|
15
|
+
},
|
|
16
|
+
]
|
|
17
|
+
},
|
|
18
|
+
{
|
|
19
|
+
title: "Callout Section",
|
|
20
|
+
type: "callout",
|
|
21
|
+
components: [
|
|
22
|
+
{
|
|
23
|
+
name: "Callout Section",
|
|
24
|
+
type: "callout",
|
|
25
|
+
title: "Our Vision",
|
|
26
|
+
has_extra: true,
|
|
27
|
+
title_label: "Eyebrow heading",
|
|
28
|
+
supporting_text: "Excellence and equity in early childhood education and care",
|
|
29
|
+
supporting_text_label: "Message *",
|
|
30
|
+
featured_image: "https://beta-frontend.elaa.org.au/img/our-vision-and-purpose.png"
|
|
31
|
+
},
|
|
32
|
+
]
|
|
33
|
+
},
|
|
34
|
+
{
|
|
35
|
+
title: "Callout Section",
|
|
36
|
+
type: "callout",
|
|
37
|
+
components: [
|
|
38
|
+
{
|
|
39
|
+
name: "Callout Section",
|
|
40
|
+
type: "callout",
|
|
41
|
+
title: "Our Purpose",
|
|
42
|
+
has_extra: true,
|
|
43
|
+
title_label: "Eyebrow heading",
|
|
44
|
+
supporting_text: "To build meaningful, reliable, and human-centered software that solves real problems, empowers users, and advances innovation responsibly.",
|
|
45
|
+
supporting_text_label: "Message *",
|
|
46
|
+
},
|
|
47
|
+
]
|
|
48
|
+
},
|
|
49
|
+
{
|
|
50
|
+
title: "Two columns with image and content",
|
|
51
|
+
type: "two_column_image_content",
|
|
52
|
+
display: "horizontal",
|
|
53
|
+
components: [
|
|
54
|
+
{
|
|
55
|
+
name: "Image Block",
|
|
56
|
+
type: "image_block",
|
|
57
|
+
featured_image: "https://beta-frontend.elaa.org.au/img/our-vision-and-purpose-2.png",
|
|
58
|
+
},
|
|
59
|
+
{
|
|
60
|
+
name: "Standard header",
|
|
61
|
+
type: "header",
|
|
62
|
+
title: "Our values",
|
|
63
|
+
supporting_text_max_length: 500,
|
|
64
|
+
supporting_text: "We create software to address real-world needs — making life easier, work more efficient, and systems more intelligent.",
|
|
65
|
+
},
|
|
66
|
+
{
|
|
67
|
+
name: "Feature items",
|
|
68
|
+
type: "feature_items",
|
|
69
|
+
supportive_text: "Section can contain up to 10 items.",
|
|
70
|
+
max_items: 10,
|
|
71
|
+
data: [
|
|
72
|
+
{
|
|
73
|
+
has_extra: true,
|
|
74
|
+
as_item: true,
|
|
75
|
+
title: "Excellence",
|
|
76
|
+
icon: "AlertCircle",
|
|
77
|
+
supporting_text: "We create software to address real-world needs — making life easier, work more efficient, and systems more intelligent 1.",
|
|
78
|
+
},
|
|
79
|
+
{
|
|
80
|
+
has_extra: true,
|
|
81
|
+
as_item: true,
|
|
82
|
+
title: "Equity",
|
|
83
|
+
icon: 'AlignLeft01',
|
|
84
|
+
supporting_text: "We create software to address real-world needs — making life easier, work more efficient, and systems more intelligent 2.",
|
|
85
|
+
},
|
|
86
|
+
{
|
|
87
|
+
has_extra: true,
|
|
88
|
+
as_item: true,
|
|
89
|
+
title: "Collaboration",
|
|
90
|
+
icon: 'AlignLeft01',
|
|
91
|
+
supporting_text: "We create software to address real-world needs — making life easier, work more efficient, and systems more intelligent 3.",
|
|
92
|
+
},
|
|
93
|
+
{
|
|
94
|
+
has_extra: true,
|
|
95
|
+
as_item: true,
|
|
96
|
+
title: "Collaboration",
|
|
97
|
+
icon: 'AlignLeft01',
|
|
98
|
+
supporting_text: "We create software to address real-world needs — making life easier, work more efficient, and systems more intelligent 3.",
|
|
99
|
+
},
|
|
100
|
+
{
|
|
101
|
+
has_extra: true,
|
|
102
|
+
as_item: true,
|
|
103
|
+
title: "Collaboration",
|
|
104
|
+
icon: 'AlignLeft01',
|
|
105
|
+
supporting_text: "We create software to address real-world needs — making life easier, work more efficient, and systems more intelligent 3.",
|
|
106
|
+
},
|
|
107
|
+
]
|
|
108
|
+
}
|
|
109
|
+
]
|
|
110
|
+
},
|
|
111
|
+
{
|
|
112
|
+
title: "Bullet Points Section",
|
|
113
|
+
type: "bullet_points",
|
|
114
|
+
components: [
|
|
115
|
+
{
|
|
116
|
+
name: "Section header",
|
|
117
|
+
type: "header",
|
|
118
|
+
title: "Support Services",
|
|
119
|
+
featured_image: "https://beta.elaa.org.au/img/what-we-do/best-start-best-life/divided-01.jpg"
|
|
120
|
+
},
|
|
121
|
+
{
|
|
122
|
+
name: "Bullet Points",
|
|
123
|
+
type: "bullet_points",
|
|
124
|
+
supportive_text: "This section can contain up to 10 items.",
|
|
125
|
+
max_items: 10,
|
|
126
|
+
max_title: 500,
|
|
127
|
+
data: [
|
|
128
|
+
{
|
|
129
|
+
title: "Through our Commonwealth",
|
|
130
|
+
},
|
|
131
|
+
{
|
|
132
|
+
title: "We work with members, peak bodies.",
|
|
133
|
+
},
|
|
134
|
+
{
|
|
135
|
+
title: "We work with members, peak bodies.",
|
|
136
|
+
},
|
|
137
|
+
{
|
|
138
|
+
title: "We work with members, peak bodies.",
|
|
139
|
+
},
|
|
140
|
+
{
|
|
141
|
+
title: "We work with members, peak bodies.",
|
|
142
|
+
},
|
|
143
|
+
]
|
|
144
|
+
}
|
|
145
|
+
]
|
|
146
|
+
},
|
|
147
|
+
]
|
|
148
|
+
};
|
package/package.json
CHANGED
|
@@ -127,6 +127,7 @@ const componentMaps = ref({
|
|
|
127
127
|
vertical_tabs: markRaw(VItems),
|
|
128
128
|
links: markRaw(VLinks),
|
|
129
129
|
header: markRaw(VHeader),
|
|
130
|
+
callout: markRaw(VHeader),
|
|
130
131
|
link_grid: markRaw(VLinks),
|
|
131
132
|
logos: markRaw(VLogos),
|
|
132
133
|
carousel: markRaw(VCollectionCarousel),
|
|
@@ -136,6 +137,7 @@ const componentMaps = ref({
|
|
|
136
137
|
image_block: markRaw(VImageBlock),
|
|
137
138
|
timeline_items: markRaw(VItems),
|
|
138
139
|
bullet_points: markRaw(VLinks),
|
|
140
|
+
feature_items: markRaw(VLinks),
|
|
139
141
|
link_cards: markRaw(VItems),
|
|
140
142
|
});
|
|
141
143
|
|
|
@@ -24,6 +24,7 @@ import Timeline from "@/components/presenters/modules/Timeline.vue";
|
|
|
24
24
|
import LinkCard from "@/components/presenters/modules/LinkCard.vue";
|
|
25
25
|
import LinkList from "@/components/presenters/modules/LinkList.vue";
|
|
26
26
|
import BulletPoints from "@/components/presenters/modules/BulletPoints.vue";
|
|
27
|
+
import Callout from "@/components/presenters/modules/Callout.vue";
|
|
27
28
|
|
|
28
29
|
const props = defineProps({
|
|
29
30
|
page: {
|
|
@@ -46,6 +47,7 @@ const componentMaps = ref({
|
|
|
46
47
|
link_card: markRaw(LinkCard),
|
|
47
48
|
link_list: markRaw(LinkList),
|
|
48
49
|
bullet_points: markRaw(BulletPoints),
|
|
50
|
+
callout: markRaw(Callout),
|
|
49
51
|
});
|
|
50
52
|
|
|
51
53
|
const currentComponent = (section) => {
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
<template>
|
|
2
|
-
<div class="bg-gray-50 px-6 py-5 rounded-xl">
|
|
2
|
+
<div :class="{'bg-gray-50 px-6 py-5 rounded-xl': !dataRef?.as_item, '-mx-6 -my-5': dataRef?.as_item}">
|
|
3
3
|
<p class="text-lg font-semibold text-gray-900 pb-4" :class="{'border-b border-gray-200': !dataRef?.has_extra}">
|
|
4
|
-
{{ dataRef
|
|
4
|
+
{{ dataRef?.name }}
|
|
5
5
|
</p>
|
|
6
6
|
<div class="flex flex-col gap-4 rounded-xl py-5 bg-gray-50 px-0" :class="{'!bg-gray-200 !px-6': dataRef?.hasOwnProperty('has_extra')}">
|
|
7
7
|
<div :class="{'flex gap-4': dataRef.hasOwnProperty('icon')}">
|
|
@@ -18,7 +18,7 @@
|
|
|
18
18
|
v-if="dataRef.hasOwnProperty('title')"
|
|
19
19
|
is-vertical
|
|
20
20
|
field="title"
|
|
21
|
-
label-text="Title *"
|
|
21
|
+
:label-text="dataRef?.title_label ?? 'Title *'"
|
|
22
22
|
class="w-full mb-4"
|
|
23
23
|
:value="dataRef.title"
|
|
24
24
|
:limit="51"
|
|
@@ -37,7 +37,7 @@
|
|
|
37
37
|
is-vertical
|
|
38
38
|
v-if="dataRef.hasOwnProperty('supporting_text')"
|
|
39
39
|
field="supporting_text"
|
|
40
|
-
label-text="Supporting Text *"
|
|
40
|
+
:label-text="dataRef?.supporting_text_label ?? 'Supporting Text *'"
|
|
41
41
|
class="w-full mb-4"
|
|
42
42
|
:value="dataRef.supporting_text"
|
|
43
43
|
:limit="dataRef.supporting_text_max_length ?? 100"
|
|
@@ -83,11 +83,7 @@ const VFileUpload = inject("VFileUpload", DefaultFileUpload);
|
|
|
83
83
|
const emit = defineEmits(["update"]);
|
|
84
84
|
const props = defineProps({
|
|
85
85
|
...defaultProps,
|
|
86
|
-
hasExtra: {
|
|
87
|
-
type: Boolean,
|
|
88
|
-
default: true
|
|
89
|
-
},
|
|
90
86
|
});
|
|
91
87
|
|
|
92
|
-
const dataRef = ref(props.data.
|
|
88
|
+
const dataRef = ref(props.data?.component ?? props.data);
|
|
93
89
|
</script>
|
|
@@ -39,7 +39,9 @@
|
|
|
39
39
|
</div>
|
|
40
40
|
<div class="flex flex-col gap-6">
|
|
41
41
|
<div class="flex flex-col gap-1.5">
|
|
42
|
+
<Header v-if="isFeatureItem" :data="item"></Header>
|
|
42
43
|
<input-wrapper
|
|
44
|
+
v-else
|
|
43
45
|
is-vertical
|
|
44
46
|
field="title"
|
|
45
47
|
label-text="Title *"
|
|
@@ -57,7 +59,7 @@
|
|
|
57
59
|
class="border-1 border-solid border-gray-300 rounded-lg bg-white w-full"
|
|
58
60
|
/>
|
|
59
61
|
<textarea
|
|
60
|
-
v-
|
|
62
|
+
v-if="isBulletPoint"
|
|
61
63
|
v-model="item.title"
|
|
62
64
|
name="title"
|
|
63
65
|
placeholder="Title"
|
|
@@ -90,6 +92,7 @@ import {createLink} from "@/components/helpers/pageBuilderFactory";
|
|
|
90
92
|
import ActionMenu from "@/components/common/ActionMenu.vue";
|
|
91
93
|
import InputWrapper from "@/components/common/InputWrapper.vue";
|
|
92
94
|
import LinkedTo from "@/components/common/LinkedTo.vue";
|
|
95
|
+
import Header from "@/components/builders/Header.vue";
|
|
93
96
|
import VModal from "@/components/common/Modal.vue";
|
|
94
97
|
|
|
95
98
|
const emit = defineEmits(["update"]);
|
|
@@ -107,6 +110,10 @@ const isBulletPoint = computed(() => {
|
|
|
107
110
|
return componentData.value.type === 'bullet_points';
|
|
108
111
|
});
|
|
109
112
|
|
|
113
|
+
const isFeatureItem = computed(() => {
|
|
114
|
+
return componentData.value.type === 'feature_items';
|
|
115
|
+
});
|
|
116
|
+
|
|
110
117
|
function addItem() {
|
|
111
118
|
if (!componentData.value.hasOwnProperty('data')) {
|
|
112
119
|
componentData.value.data = [];
|
|
@@ -115,7 +122,7 @@ function addItem() {
|
|
|
115
122
|
if (componentData.value.data?.length >= componentData.value.max_items) {
|
|
116
123
|
return;
|
|
117
124
|
}
|
|
118
|
-
componentData.value.data?.push(createLink({}, isBulletPoint.value));
|
|
125
|
+
componentData.value.data?.push(createLink({}, isBulletPoint.value, isFeatureItem.value));
|
|
119
126
|
|
|
120
127
|
nextTick(() => {
|
|
121
128
|
if (lastItemRef.value) {
|
|
@@ -43,7 +43,17 @@ export function createItem(overrides = {}, withSecondary = true, isTimeline = fa
|
|
|
43
43
|
};
|
|
44
44
|
}
|
|
45
45
|
|
|
46
|
-
export function createLink(overrides = {}, isBulletPoint = false) {
|
|
46
|
+
export function createLink(overrides = {}, isBulletPoint = false, isFeatureItem = false) {
|
|
47
|
+
if (isFeatureItem) {
|
|
48
|
+
return {
|
|
49
|
+
has_extra: true,
|
|
50
|
+
as_item: true,
|
|
51
|
+
title: "Item title",
|
|
52
|
+
icon: "AlertCircle",
|
|
53
|
+
supporting_text: "Enter your description here.",
|
|
54
|
+
}
|
|
55
|
+
}
|
|
56
|
+
|
|
47
57
|
if (isBulletPoint) {
|
|
48
58
|
return {
|
|
49
59
|
title: "New link",
|
|
@@ -0,0 +1,32 @@
|
|
|
1
|
+
<template>
|
|
2
|
+
<div class="overflow-hidden">
|
|
3
|
+
<div class="max-w-[1640px] md:px-[120px] mx-auto w-full mt-[40px]" :class="{'flex gap-8': headerComponent?.featured_image}">
|
|
4
|
+
<img v-if="headerComponent?.featured_image"
|
|
5
|
+
:src="headerComponent?.featured_image"
|
|
6
|
+
class="w-[480px] object-cover rounded-[24px]"
|
|
7
|
+
alt="Feature"/>
|
|
8
|
+
<div v-if="headerComponent"
|
|
9
|
+
class="w-full rounded-[24px] flex items-center justify-center flex-col"
|
|
10
|
+
:class="{'bg-pale-100 min-h-[320px]': !headerComponent?.featured_image, 'border border-brand-400': headerComponent?.featured_image}"
|
|
11
|
+
>
|
|
12
|
+
<h3 class="text-xl text-brand-600 font-semibold max-w-[744px]">{{ headerComponent.title }}</h3>
|
|
13
|
+
<p v-if="headerComponent?.supporting_text" class="text-[30px] font-semibold mt-2 text-gray-900 leading-[38px] max-w-[744px] text-center" v-html="headerComponent.supporting_text"></p>
|
|
14
|
+
</div>
|
|
15
|
+
</div>
|
|
16
|
+
</div>
|
|
17
|
+
</template>
|
|
18
|
+
<script setup>
|
|
19
|
+
import {ref, computed} from "vue";
|
|
20
|
+
|
|
21
|
+
const props = defineProps({
|
|
22
|
+
section: {
|
|
23
|
+
required: true,
|
|
24
|
+
type: Object,
|
|
25
|
+
},
|
|
26
|
+
});
|
|
27
|
+
|
|
28
|
+
const section = ref(props.section);
|
|
29
|
+
const headerComponent = computed(() => {
|
|
30
|
+
return section.value.components.find((component) => component.type === "callout");
|
|
31
|
+
});
|
|
32
|
+
</script>
|
|
@@ -1,21 +1,50 @@
|
|
|
1
1
|
<template>
|
|
2
2
|
<div class="overflow-hidden">
|
|
3
3
|
<div class="max-w-[1640px] md:px-[120px] mx-auto w-full mt-4 px-4">
|
|
4
|
-
<div class="grid grid-cols-12 gap-4">
|
|
4
|
+
<div class="grid grid-cols-12 gap-4" v-if="paragraphComponent">
|
|
5
5
|
<div class="col-span-4 bg-gray-100 rounded-xl p-8" v-if="paragraphComponent">
|
|
6
6
|
<h3 class="text-[20px] text-gray-900 font-semibold">{{ paragraphComponent.title }}</h3>
|
|
7
7
|
<p class="text-md font-normal mt-2 text-gray-600 leading-6" v-html="paragraphComponent.paragraph"></p>
|
|
8
8
|
</div>
|
|
9
9
|
<div class="col-span-8" v-if="imageComponent">
|
|
10
|
-
<img :src="imageComponent.featured_image" :alt="imageComponent.caption" class="w-full h-auto"
|
|
10
|
+
<img :src="imageComponent.featured_image" :alt="imageComponent.caption" class="w-full h-auto"/>
|
|
11
11
|
<p v-html="imageComponent.caption" class="mt-2 text-[13px]"></p>
|
|
12
12
|
</div>
|
|
13
13
|
</div>
|
|
14
|
+
<div v-else class="my-[44px]">
|
|
15
|
+
<div
|
|
16
|
+
v-if="headerComponent"
|
|
17
|
+
class="w-full flex-col mb-6"
|
|
18
|
+
>
|
|
19
|
+
<h3 class="text-[36px] text-gray-900 font-semibold">{{ headerComponent.title }}</h3>
|
|
20
|
+
<p v-if="headerComponent?.supporting_text"
|
|
21
|
+
class="text-[20px] font-normal mt-4 text-gray-600 leading-[30px]"
|
|
22
|
+
v-html="headerComponent.supporting_text"></p>
|
|
23
|
+
</div>
|
|
24
|
+
<div class="flex flex-row gap-8">
|
|
25
|
+
<div class="grid grid-cols-2 gap-8 w-2/3">
|
|
26
|
+
<div v-for="item in featureItemsComponent.data" class="flex gap-3">
|
|
27
|
+
<div v-if="item?.icon" class="w-[48px] h-[48px] bg-brand-100 border-[8px] border-brand-50 rounded-full flex items-center justify-center">
|
|
28
|
+
<IconComponent :icon="item.icon" icon-classes="w-5 h-5 text-brand-600"></IconComponent>
|
|
29
|
+
</div>
|
|
30
|
+
<div class="max-w-[324px]">
|
|
31
|
+
<h3 class="font-semibold text-[20px] text-gray-900">{{ item.title }}</h3>
|
|
32
|
+
<p class="mt-2 text-md font-normal text-gray-600 leading-[24px]">{{ item.supporting_text }}</p>
|
|
33
|
+
</div>
|
|
34
|
+
</div>
|
|
35
|
+
</div>
|
|
36
|
+
<div v-if="imageComponent" class="w-[560px]">
|
|
37
|
+
<img :src="imageComponent.featured_image" :alt="imageComponent?.caption ?? 'Image'"
|
|
38
|
+
class="rounded-br-[24px] rounded-tl-[24px] w-full"/>
|
|
39
|
+
</div>
|
|
40
|
+
</div>
|
|
41
|
+
</div>
|
|
14
42
|
</div>
|
|
15
43
|
</div>
|
|
16
44
|
</template>
|
|
17
45
|
|
|
18
46
|
<script setup>
|
|
47
|
+
import IconComponent from "@/components/common/Icon.vue";
|
|
19
48
|
import {ref, computed} from "vue";
|
|
20
49
|
|
|
21
50
|
const props = defineProps({
|
|
@@ -29,8 +58,14 @@ const section = ref(props.section);
|
|
|
29
58
|
const paragraphComponent = computed(() => {
|
|
30
59
|
return section.value.components.find((component) => component.type === "paragraph");
|
|
31
60
|
});
|
|
61
|
+
const headerComponent = computed(() => {
|
|
62
|
+
return section.value.components.find((component) => component.type === "header");
|
|
63
|
+
});
|
|
32
64
|
const imageComponent = computed(() => {
|
|
33
65
|
return section.value.components.find((component) => component.type === "image_block");
|
|
34
66
|
});
|
|
67
|
+
const featureItemsComponent = computed(() => {
|
|
68
|
+
return section.value.components.find((component) => component.type === "feature_items");
|
|
69
|
+
});
|
|
35
70
|
|
|
36
71
|
</script>
|