dwd-projects
/
teenybeanspreschoolcurriculum.com
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

directusDomain

master
Suvodip Ghosh 2023-02-22 20:43:00 +05:30
parent 04b5887ff7
commit 003deea0b3
36 changed files with 195 additions and 195 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
src/components/Administrators.vue
View File

@ -54,7 +54,7 @@
<p class="text-justify text-xl lg:text-2xl pt-2 text-color-2 px-4">Find relevant helpful articles for marketing preschool solutions below and get to know more about the same. </p> <p class="text-justify text-xl lg:text-2xl pt-2 text-color-2 px-4">Find relevant helpful articles for marketing preschool solutions below and get to know more about the same. </p>
<div class="grid grid-cols-1 md:grid-cols-2 xl:grid-cols-3 gap-8 mt-10 place-items-center"> <div class="grid grid-cols-1 md:grid-cols-2 xl:grid-cols-3 gap-8 mt-10 place-items-center">
<div class="grid w-fit" v-for="marketing in marketing" :key="marketing"> <div class="grid w-fit" v-for="marketing in marketing" :key="marketing">
<img class="w-full rounded-tl-3xl rounded-br-3xl px-4" v-if="marketing.img" :src="'https://curriculum-app-api.beanstalkedu.com/assets/'+marketing.img+'?width=420&amp;height=280'" alt="" > <img class="w-full rounded-tl-3xl rounded-br-3xl px-4" v-if="marketing.img" :src="'https://management.beanstalkedu.com/assets/'+marketing.img+'?width=420&amp;height=280'" alt="" >
<div class="flex bg-yellow-200 absolute mt-56 lg:mt-40 ml-4 text-lg leading-tight w-14 h-14 font-semibold text-blue-700 rounded-full text-center p-1">{{ marketing.date}}</div> <div class="flex bg-yellow-200 absolute mt-56 lg:mt-40 ml-4 text-lg leading-tight w-14 h-14 font-semibold text-blue-700 rounded-full text-center p-1">{{ marketing.date}}</div>
<h2 class="text-color-1 text-3xl font-semibold pt-10 px-4">{{ marketing.title}}</h2> <h2 class="text-color-1 text-3xl font-semibold pt-10 px-4">{{ marketing.title}}</h2>
<div class="text-justify line-clamp-3 font-20px text-color-2 px-4" v-html="marketing.meta_description"></div> <div class="text-justify line-clamp-3 font-20px text-color-2 px-4" v-html="marketing.meta_description"></div>
@ -135,7 +135,7 @@
<p class="text-xl lg:text-3xl pt-2 text-color-2">Read the most suitable administration preschool solutions and be familiar with all necessary information for your management decisions. </p> <p class="text-xl lg:text-3xl pt-2 text-color-2">Read the most suitable administration preschool solutions and be familiar with all necessary information for your management decisions. </p>
<div class="grid grid-cols-1 md:grid-cols-2 xl:grid-cols-3 gap-8 mt-20 place-items-center"> <div class="grid grid-cols-1 md:grid-cols-2 xl:grid-cols-3 gap-8 mt-20 place-items-center">
<div class="grid w-fit" v-for="adminstration in adminstration" :key="adminstration"> <div class="grid w-fit" v-for="adminstration in adminstration" :key="adminstration">
<img class="w-full rounded-tl-3xl rounded-br-3xl px-4" v-if="adminstration.img" :src="'https://curriculum-app-api.beanstalkedu.com/assets/'+adminstration.img+'?width=420&amp;height=280'" alt="" > <img class="w-full rounded-tl-3xl rounded-br-3xl px-4" v-if="adminstration.img" :src="'https://management.beanstalkedu.com/assets/'+adminstration.img+'?width=420&amp;height=280'" alt="" >
<div class="flex bg-yellow-200 absolute mt-56 lg:mt-40 ml-4 text-lg leading-tight w-14 h-14 font-semibold text-blue-700 rounded-full text-center p-1">{{ adminstration.date}}</div> <div class="flex bg-yellow-200 absolute mt-56 lg:mt-40 ml-4 text-lg leading-tight w-14 h-14 font-semibold text-blue-700 rounded-full text-center p-1">{{ adminstration.date}}</div>
<h1 class="text-color-1 text-2xl pt-4 px-4 line-clamp-2 font-semibold">{{ adminstration.meta}}</h1> <h1 class="text-color-1 text-2xl pt-4 px-4 line-clamp-2 font-semibold">{{ adminstration.meta}}</h1>
<div class="font-20px text-justify text-color-2 px-4 line-clamp-4" v-html="adminstration.meta_description"></div> <div class="font-20px text-justify text-color-2 px-4 line-clamp-4" v-html="adminstration.meta_description"></div>
@ -427,7 +427,7 @@ export default {
// }, // },
// body: JSON.stringify(formData) // body: JSON.stringify(formData)
// }; // };
// fetch('https://curriculum-app-api.beanstalkedu.com/items/contact_form', dataToSave) // fetch('https://management.beanstalkedu.com/items/contact_form', dataToSave)
// .then(response => response.json()) // .then(response => response.json())
// .then(data => this.contact_form = data.data); // .then(data => this.contact_form = data.data);
// // console.log(this.contact_form) // // console.log(this.contact_form)
@ -435,13 +435,13 @@ export default {
// } // }
}, },
mounted: function () { mounted: function () {
fetch('https://curriculum-app-api.beanstalkedu.com/items/blog?filter[status][_eq]=published&filter[category][_eq]=marketing&limit=3&sort=sort,-date_created&filter[property][_eq]=teenybeans_curriculum') fetch('https://management.beanstalkedu.com/items/blog?filter[status][_eq]=published&filter[category][_eq]=marketing&limit=3&sort=sort,-date_created&filter[property][_eq]=teenybeans_curriculum')
.then(resp => resp.json()) .then(resp => resp.json())
.then(data => { .then(data => {
this.marketing=data.data this.marketing=data.data
// console.log(this.marketing) // console.log(this.marketing)
}) })
fetch('https://curriculum-app-api.beanstalkedu.com/items/blog?filter[status][_eq]=published&filter[category][_eq]=adminstration&limit=3&sort=sort,-date_created&filter[property][_eq]=teenybeans_curriculum') fetch('https://management.beanstalkedu.com/items/blog?filter[status][_eq]=published&filter[category][_eq]=adminstration&limit=3&sort=sort,-date_created&filter[property][_eq]=teenybeans_curriculum')
.then(resp => resp.json()) .then(resp => resp.json())
.then(data => { .then(data => {
this.adminstration=data.data this.adminstration=data.data

20
src/components/Audio-books.vue
View File

@ -39,7 +39,7 @@
<div @click="showAbModal(audiobooks.file)"> <div @click="showAbModal(audiobooks.file)">
<div class="grid place-items-center"> <div class="grid place-items-center">
<div class=" "> <div class=" ">
<img class="w-56" v-if="audiobooks.img" :src="'https://curriculum-app-api.beanstalkedu.com/assets/'+ audiobooks.img" alt=""/> <img class="w-56" v-if="audiobooks.img" :src="'https://management.beanstalkedu.com/assets/'+ audiobooks.img" alt=""/>
</div> </div>
<h1 class="pt-4 w-fit font-20px">{{audiobooks.title}}</h1> <h1 class="pt-4 w-fit font-20px">{{audiobooks.title}}</h1>
</div> </div>
@ -61,14 +61,14 @@
<div class="grid place-items-center"> <div class="grid place-items-center">
<div class=" relative flex "> <div class=" relative flex ">
<label class="grid place-items-center" :for="audiobooks.file"> <label class="grid place-items-center" :for="audiobooks.file">
<img class="w-56" v-if="audiobooks.img" :src="'https://curriculum-app-api.beanstalkedu.com/assets/'+ audiobooks.img" alt=""/> <img class="w-56" v-if="audiobooks.img" :src="'https://management.beanstalkedu.com/assets/'+ audiobooks.img" alt=""/>
<h1 class="pt-4 flex justify-center w-fit font-20px">{{audiobooks.title}}</h1> <h1 class="pt-4 flex justify-center w-fit font-20px">{{audiobooks.title}}</h1>
</label> </label>
<input type="checkbox" :id="audiobooks.file" class="modal-toggle" /> <input type="checkbox" :id="audiobooks.file" class="modal-toggle" />
<label :for="audiobooks.file" class="modal cursor-pointer"> <label :for="audiobooks.file" class="modal cursor-pointer">
<label class="modal-box relative" for=""> <label class="modal-box relative" for="">
<audio controls > <audio controls >
<source :src="'https://curriculum-app-api.beanstalkedu.com/assets/'+audiobooks.file" type="audio/mpeg"> <source :src="'https://management.beanstalkedu.com/assets/'+audiobooks.file" type="audio/mpeg">
Your browser does not support the audio element. Your browser does not support the audio element.
</audio> </audio>
</label> </label>
@ -93,7 +93,7 @@
<div @click="showAbModal(audiobooks.file)"> <div @click="showAbModal(audiobooks.file)">
<div class="grid place-items-center"> <div class="grid place-items-center">
<div class=" "> <div class=" ">
<img class="w-56" v-if="audiobooks.img" :src="'https://curriculum-app-api.beanstalkedu.com/assets/'+ audiobooks.img" alt=""/> <img class="w-56" v-if="audiobooks.img" :src="'https://management.beanstalkedu.com/assets/'+ audiobooks.img" alt=""/>
</div> </div>
<h1 class="pt-4 w-fit font-20px">{{audiobooks.title}}</h1> <h1 class="pt-4 w-fit font-20px">{{audiobooks.title}}</h1>
</div> </div>
@ -116,7 +116,7 @@
<div @click="showAbModal(audiobooks.file)"> <div @click="showAbModal(audiobooks.file)">
<div class="grid place-items-center"> <div class="grid place-items-center">
<div class=" "> <div class=" ">
<img class="w-56" v-if="audiobooks.img" :src="'https://curriculum-app-api.beanstalkedu.com/assets/'+ audiobooks.img" alt=""/> <img class="w-56" v-if="audiobooks.img" :src="'https://management.beanstalkedu.com/assets/'+ audiobooks.img" alt=""/>
</div> </div>
<h1 class="pt-4 w-fit font-20px">{{audiobooks.title}}</h1> <h1 class="pt-4 w-fit font-20px">{{audiobooks.title}}</h1>
</div> </div>
@ -138,7 +138,7 @@
<div v-for="worksheet in worksheets" :key="worksheets.id" class="grid"> <div v-for="worksheet in worksheets" :key="worksheets.id" class="grid">
<div class="grid place-items-center"> <div class="grid place-items-center">
<div class="bg-gray-200 w-56 h-72 relative -rotate-6 rounded-tl-xl rounded-br-xl shadow-xl"> <div class="bg-gray-200 w-56 h-72 relative -rotate-6 rounded-tl-xl rounded-br-xl shadow-xl">
<img class="w-56 h-72 rotate-6 relative" v-if="worksheet.img" :src="'https://curriculum-app-api.beanstalkedu.com/assets/'+ worksheet.img" alt=""/> <img class="w-56 h-72 rotate-6 relative" v-if="worksheet.img" :src="'https://management.beanstalkedu.com/assets/'+ worksheet.img" alt=""/>
</div> </div>
<h1 class="text-center pt-8 ">{{ worksheet.title}}</h1> <h1 class="text-center pt-8 ">{{ worksheet.title}}</h1>
<button class=" bg-blue-700 p-1 text-white pl-4 pr-4 rounded-tl-lg rounded-br-lg ml-6 mt-8"><img class="w-5 pr-1 inline" src="/img/download.png" alt="">Download</button> <button class=" bg-blue-700 p-1 text-white pl-4 pr-4 rounded-tl-lg rounded-br-lg ml-6 mt-8"><img class="w-5 pr-1 inline" src="/img/download.png" alt="">Download</button>
@ -168,7 +168,7 @@
<div class="modal-content" @click="doNothing()"> <div class="modal-content" @click="doNothing()">
<span @click="hideAbModal" class="close">&times;</span> <span @click="hideAbModal" class="close">&times;</span>
<audio controls> <audio controls>
<source :src="'https://curriculum-app-api.beanstalkedu.com/assets/'+ abID" type="audio/ogg"> <source :src="'https://management.beanstalkedu.com/assets/'+ abID" type="audio/ogg">
Your browser does not support the audio element. Your browser does not support the audio element.
</audio> </audio>
</div> </div>
@ -206,19 +206,19 @@ export default {
}, },
mounted: function () { mounted: function () {
// this.getVideos() // this.getVideos()
fetch('https://curriculum-app-api.beanstalkedu.com/items/audio_books?filter[category][_eq]=literacy') fetch('https://management.beanstalkedu.com/items/audio_books?filter[category][_eq]=literacy')
.then(resp => resp.json()) .then(resp => resp.json())
.then(worksheets => { .then(worksheets => {
this.abliteracy=worksheets.data.reverse().slice(0, 3) this.abliteracy=worksheets.data.reverse().slice(0, 3)
// console.log(this.abliteracy) // console.log(this.abliteracy)
}) })
fetch('https://curriculum-app-api.beanstalkedu.com/items/audio_books?filter[category][_eq]=mathematics') fetch('https://management.beanstalkedu.com/items/audio_books?filter[category][_eq]=mathematics')
.then(resp => resp.json()) .then(resp => resp.json())
.then(worksheets => { .then(worksheets => {
this.abmath=worksheets.data.reverse().slice(0, 3) this.abmath=worksheets.data.reverse().slice(0, 3)
// console.log(this.abmath) // console.log(this.abmath)
}) })
fetch('https://curriculum-app-api.beanstalkedu.com/items/audio_books?filter[category][_eq]=world') fetch('https://management.beanstalkedu.com/items/audio_books?filter[category][_eq]=world')
.then(resp => resp.json()) .then(resp => resp.json())
.then(worksheets => { .then(worksheets => {
this.abworld=worksheets.data.reverse().slice(0, 3) this.abworld=worksheets.data.reverse().slice(0, 3)

10
src/components/Audio-literacy.vue
View File

@ -25,7 +25,7 @@
<div @click="showAbModal(audiobooks.file)"> <div @click="showAbModal(audiobooks.file)">
<div class="grid place-items-center"> <div class="grid place-items-center">
<div class=" "> <div class=" ">
<img class="w-56" v-if="audiobooks.img" :src="'https://curriculum-app-api.beanstalkedu.com/assets/'+ audiobooks.img" alt=""/> <img class="w-56" v-if="audiobooks.img" :src="'https://management.beanstalkedu.com/assets/'+ audiobooks.img" alt=""/>
</div> </div>
<h1 class="pt-4 w-fit font-20px">{{audiobooks.title}}</h1> <h1 class="pt-4 w-fit font-20px">{{audiobooks.title}}</h1>
</div> </div>
@ -42,7 +42,7 @@
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 gap-10 place-items-center opacity-20 w-full"> <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 gap-10 place-items-center opacity-20 w-full">
<div v-for="audiobooks in abfliteracy" :key="abfliteracy.id" class="grid"> <div v-for="audiobooks in abfliteracy" :key="abfliteracy.id" class="grid">
<div class="grid place-items-center"> <div class="grid place-items-center">
<img class="w-56" v-if="audiobooks.img" :src="'https://curriculum-app-api.beanstalkedu.com/assets/'+ audiobooks.img" alt=""/> <img class="w-56" v-if="audiobooks.img" :src="'https://management.beanstalkedu.com/assets/'+ audiobooks.img" alt=""/>
<h1 class="text-center pt-4 w-fit">{{audiobooks.title}}</h1> <h1 class="text-center pt-4 w-fit">{{audiobooks.title}}</h1>
</div> </div>
</div> </div>
@ -54,7 +54,7 @@
<div class="modal-content" @click="doNothing()"> <div class="modal-content" @click="doNothing()">
<span @click="hideAbModal" class="close">&times;</span> <span @click="hideAbModal" class="close">&times;</span>
<audio controls> <audio controls>
<source :src="'https://curriculum-app-api.beanstalkedu.com/assets/'+ abID" type="audio/ogg"> <source :src="'https://management.beanstalkedu.com/assets/'+ abID" type="audio/ogg">
Your browser does not support the audio element. Your browser does not support the audio element.
</audio> </audio>
</div> </div>
@ -178,13 +178,13 @@ export default {
} }
}, },
mounted: function () { mounted: function () {
fetch('https://curriculum-app-api.beanstalkedu.com/items/audio_books?filter[category][_eq]=literacy') fetch('https://management.beanstalkedu.com/items/audio_books?filter[category][_eq]=literacy')
.then(resp => resp.json()) .then(resp => resp.json())
.then(audiobooks => { .then(audiobooks => {
this.ablitreacy=audiobooks.data.reverse().slice(0, 4) this.ablitreacy=audiobooks.data.reverse().slice(0, 4)
// console.log(this.ablitreacy) // console.log(this.ablitreacy)
}) })
fetch('https://curriculum-app-api.beanstalkedu.com/items/audio_books?filter[category][_eq]=literacy') fetch('https://management.beanstalkedu.com/items/audio_books?filter[category][_eq]=literacy')
.then(resp => resp.json()) .then(resp => resp.json())
.then(audiobooks => { .then(audiobooks => {
this.abfliteracy=audiobooks.data.reverse().slice(4, 8) this.abfliteracy=audiobooks.data.reverse().slice(4, 8)

10
src/components/Audio-mathematics.vue
View File

@ -25,7 +25,7 @@
<div @click="showAbModal(audiobooks.file)"> <div @click="showAbModal(audiobooks.file)">
<div class="grid place-items-center"> <div class="grid place-items-center">
<div class=" "> <div class=" ">
<img class="w-56" v-if="audiobooks.img" :src="'https://curriculum-app-api.beanstalkedu.com/assets/'+ audiobooks.img" alt=""/> <img class="w-56" v-if="audiobooks.img" :src="'https://management.beanstalkedu.com/assets/'+ audiobooks.img" alt=""/>
</div> </div>
<h1 class="pt-4 w-fit font-20px">{{audiobooks.title}}</h1> <h1 class="pt-4 w-fit font-20px">{{audiobooks.title}}</h1>
</div> </div>
@ -42,7 +42,7 @@
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 gap-10 place-items-center opacity-20 w-full"> <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 gap-10 place-items-center opacity-20 w-full">
<div v-for="audiobooks in abfmath" :key="abfmath.id" class="grid"> <div v-for="audiobooks in abfmath" :key="abfmath.id" class="grid">
<div class="grid place-items-center"> <div class="grid place-items-center">
<img class="w-56" v-if="audiobooks.img" :src="'https://curriculum-app-api.beanstalkedu.com/assets/'+ audiobooks.img" alt=""/> <img class="w-56" v-if="audiobooks.img" :src="'https://management.beanstalkedu.com/assets/'+ audiobooks.img" alt=""/>
<h1 class="text-center pt-4 w-fit">{{audiobooks.title}}</h1> <h1 class="text-center pt-4 w-fit">{{audiobooks.title}}</h1>
</div> </div>
</div> </div>
@ -54,7 +54,7 @@
<div class="modal-content" @click="doNothing()"> <div class="modal-content" @click="doNothing()">
<span @click="hideAbModal" class="close">&times;</span> <span @click="hideAbModal" class="close">&times;</span>
<audio controls> <audio controls>
<source :src="'https://curriculum-app-api.beanstalkedu.com/assets/'+ abID" type="audio/ogg"> <source :src="'https://management.beanstalkedu.com/assets/'+ abID" type="audio/ogg">
Your browser does not support the audio element. Your browser does not support the audio element.
</audio> </audio>
</div> </div>
@ -175,13 +175,13 @@ export default {
} }
}, },
mounted: function () { mounted: function () {
fetch('https://curriculum-app-api.beanstalkedu.com/items/audio_books?filter[category][_eq]=mathematics') fetch('https://management.beanstalkedu.com/items/audio_books?filter[category][_eq]=mathematics')
.then(resp => resp.json()) .then(resp => resp.json())
.then(worksheets => { .then(worksheets => {
this.abmath=worksheets.data.reverse().slice(0, 4) this.abmath=worksheets.data.reverse().slice(0, 4)
// console.log(this.abmath) // console.log(this.abmath)
}) })
fetch('https://curriculum-app-api.beanstalkedu.com/items/audio_books?filter[category][_eq]=mathematics') fetch('https://management.beanstalkedu.com/items/audio_books?filter[category][_eq]=mathematics')
.then(resp => resp.json()) .then(resp => resp.json())
.then(worksheets => { .then(worksheets => {
this.abfmath=worksheets.data.reverse().slice(4, 8) this.abfmath=worksheets.data.reverse().slice(4, 8)

10
src/components/Audio-worlds.vue
View File

@ -25,7 +25,7 @@
<div @click="showAbModal(audiobooks.file)"> <div @click="showAbModal(audiobooks.file)">
<div class="grid place-items-center"> <div class="grid place-items-center">
<div class=" "> <div class=" ">
<img class="w-56" v-if="audiobooks.img" :src="'https://curriculum-app-api.beanstalkedu.com/assets/'+ audiobooks.img" alt=""/> <img class="w-56" v-if="audiobooks.img" :src="'https://management.beanstalkedu.com/assets/'+ audiobooks.img" alt=""/>
</div> </div>
<h1 class="pt-4 w-fit font-20px">{{audiobooks.title}}</h1> <h1 class="pt-4 w-fit font-20px">{{audiobooks.title}}</h1>
</div> </div>
@ -42,7 +42,7 @@
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 gap-10 place-items-center opacity-20 w-full"> <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 gap-10 place-items-center opacity-20 w-full">
<div v-for="audiobooks in abfworld" :key="abfworld.id" class="grid"> <div v-for="audiobooks in abfworld" :key="abfworld.id" class="grid">
<div class="grid place-items-center"> <div class="grid place-items-center">
<img class="w-56" v-if="audiobooks.img" :src="'https://curriculum-app-api.beanstalkedu.com/assets/'+ audiobooks.img" alt=""/> <img class="w-56" v-if="audiobooks.img" :src="'https://management.beanstalkedu.com/assets/'+ audiobooks.img" alt=""/>
<h1 class="text-center pt-4 w-fit">{{audiobooks.title}}</h1> <h1 class="text-center pt-4 w-fit">{{audiobooks.title}}</h1>
</div> </div>
</div> </div>
@ -54,7 +54,7 @@
<div class="modal-content" @click="doNothing()"> <div class="modal-content" @click="doNothing()">
<span @click="hideAbModal" class="close">&times;</span> <span @click="hideAbModal" class="close">&times;</span>
<audio controls> <audio controls>
<source :src="'https://curriculum-app-api.beanstalkedu.com/assets/'+ abID" type="audio/ogg"> <source :src="'https://management.beanstalkedu.com/assets/'+ abID" type="audio/ogg">
Your browser does not support the audio element. Your browser does not support the audio element.
</audio> </audio>
</div> </div>
@ -175,13 +175,13 @@ export default {
} }
}, },
mounted: function () { mounted: function () {
fetch('https://curriculum-app-api.beanstalkedu.com/items/audio_books?filter[category][_eq]=world') fetch('https://management.beanstalkedu.com/items/audio_books?filter[category][_eq]=world')
.then(resp => resp.json()) .then(resp => resp.json())
.then(audiobooks => { .then(audiobooks => {
this.abworld=audiobooks.data.reverse().slice(0, 4) this.abworld=audiobooks.data.reverse().slice(0, 4)
// console.log(this.abworld) // console.log(this.abworld)
}) })
fetch('https://curriculum-app-api.beanstalkedu.com/items/audio_books?filter[category][_eq]=world') fetch('https://management.beanstalkedu.com/items/audio_books?filter[category][_eq]=world')
.then(resp => resp.json()) .then(resp => resp.json())
.then(audiobooks => { .then(audiobooks => {
this.abfworld=audiobooks.data.reverse().slice(4, 8) this.abfworld=audiobooks.data.reverse().slice(4, 8)

6
src/components/AudioBookModal.vue
View File

@ -8,7 +8,7 @@
<div @click="showAbModal(audiobooks.file)"> <div @click="showAbModal(audiobooks.file)">
<div class="grid place-items-center"> <div class="grid place-items-center">
<div class=" "> <div class=" ">
<img class="w-56" v-if="audiobooks.img" :src="'https://curriculum-app-api.beanstalkedu.com/assets/'+ audiobooks.img" alt=""/> <img class="w-56" v-if="audiobooks.img" :src="'https://management.beanstalkedu.com/assets/'+ audiobooks.img" alt=""/>
</div> </div>
<h1 class="pt-4 w-fit font-20px">{{audiobooks.title}}</h1> <h1 class="pt-4 w-fit font-20px">{{audiobooks.title}}</h1>
</div> </div>
@ -27,7 +27,7 @@
<div class="modal-content" @click="doNothing()"> <div class="modal-content" @click="doNothing()">
<span @click="hideAbModal" class="close">&times;</span> <span @click="hideAbModal" class="close">&times;</span>
<audio controls> <audio controls>
<source :src="'https://curriculum-app-api.beanstalkedu.com/assets/'+ abID" type="audio/ogg"> <source :src="'https://management.beanstalkedu.com/assets/'+ abID" type="audio/ogg">
Your browser does not support the audio element. Your browser does not support the audio element.
</audio> </audio>
</div> </div>
@ -65,7 +65,7 @@
}, },
mounted: function () { mounted: function () {
// this.getVideos() // this.getVideos()
fetch('https://curriculum-app-api.beanstalkedu.com/items/audio_books?filter[category][_eq]=literacy') fetch('https://management.beanstalkedu.com/items/audio_books?filter[category][_eq]=literacy')
.then(resp => resp.json()) .then(resp => resp.json())
.then(audiobooks => { .then(audiobooks => {
this.abliteracy=audiobooks.data this.abliteracy=audiobooks.data

4
src/components/Blog.vue
View File

@ -54,7 +54,7 @@
<div class="grid grid-cols-1 lg:grid-cols-2 xl:grid-cols-3"> <div class="grid grid-cols-1 lg:grid-cols-2 xl:grid-cols-3">
<div v-for="(item, index) in tbBlog" class="shadow-md rounded p-2 m-2"> <div v-for="(item, index) in tbBlog" class="shadow-md rounded p-2 m-2">
<figure class=" p-4 "> <figure class=" p-4 ">
<img class="w-full" v-if="item.img" :src="'https://curriculum-app-api.beanstalkedu.com/assets/'+item.img" alt="" style="width:100%; height: 205px;"> <img class="w-full" v-if="item.img" :src="'https://management.beanstalkedu.com/assets/'+item.img" alt="" style="width:100%; height: 205px;">
<!-- '?width=420&amp;height=280' --> <!-- '?width=420&amp;height=280' -->
<div class="flex place-items-center bg-yellow-200 absolute -mt-12 ml-4 text-lg leading-tight w-14 h-14 font-semibold text-blue-700 rounded-full text-center p-1">{{item.date}}</div> <div class="flex place-items-center bg-yellow-200 absolute -mt-12 ml-4 text-lg leading-tight w-14 h-14 font-semibold text-blue-700 rounded-full text-center p-1">{{item.date}}</div>
<div class="pt-6 space-y-4"> <div class="pt-6 space-y-4">
@ -143,7 +143,7 @@
}, },
methods: { methods: {
getItemByCategory() { getItemByCategory() {
fetch('https://curriculum-app-api.beanstalkedu.com/items/blog?filter[status][_eq]=published&filter[property][_eq]=teenybeans_curriculum&sort=sort,-date_created') fetch('https://management.beanstalkedu.com/items/blog?filter[status][_eq]=published&filter[property][_eq]=teenybeans_curriculum&sort=sort,-date_created')
.then(response => response.json()) .then(response => response.json())
.then(data => { .then(data => {
this.tbBlog = data.data this.tbBlog = data.data

2
src/components/BlogFaq.vue
View File

@ -44,7 +44,7 @@ setup(){
}, },
mounted: function () { mounted: function () {
fetch('https://curriculum-app-api.beanstalkedu.com/items/blog?filter[property][_eq]=teenybeans_curriculum&filter[slug][_eq]=' + this.$route.params.id) fetch('https://management.beanstalkedu.com/items/blog?filter[property][_eq]=teenybeans_curriculum&filter[slug][_eq]=' + this.$route.params.id)
.then(response => response.json()) .then(response => response.json())
.then(data => { .then(data => {
this.page = data.data this.page = data.data

2
src/components/BlogGetinTouch.vue
View File

@ -63,7 +63,7 @@ setup(){
}, },
mounted: function () { mounted: function () {
fetch('https://curriculum-app-api.beanstalkedu.com/items/blog?filter[property][_eq]=teenybeans_curriculum&filter[slug][_eq]=' + this.$route.params.id) fetch('https://management.beanstalkedu.com/items/blog?filter[property][_eq]=teenybeans_curriculum&filter[slug][_eq]=' + this.$route.params.id)
.then(response => response.json()) .then(response => response.json())
.then(data => { .then(data => {
this.page = data.data this.page = data.data

6
src/components/Dailyplan.vue
View File

@ -27,7 +27,7 @@
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 mt-16 place-items-center mb-32 gap-16 "> <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 mt-16 place-items-center mb-32 gap-16 ">
<div v-for="lessonplan in dailyplan" :key="lessonplan.id"> <div v-for="lessonplan in dailyplan" :key="lessonplan.id">
<div @click="showLpModal(lessonplan.file)"> <div @click="showLpModal(lessonplan.file)">
<div class="grid gap-4"><img class="cursor-pointer w-96 h-6/6 " v-if="lessonplan.lesson_icon" :src="'https://curriculum-app-api.beanstalkedu.com/assets/'+ lessonplan.lesson_icon" alt=""/></div> <div class="grid gap-4"><img class="cursor-pointer w-96 h-6/6 " v-if="lessonplan.lesson_icon" :src="'https://management.beanstalkedu.com/assets/'+ lessonplan.lesson_icon" alt=""/></div>
</div> </div>
<!-- <div class="grid h-72 w-64 border-4"><img class="h-80 w-64" src="/img/lessonplan.jpg" alt=""/></div> <!-- <div class="grid h-72 w-64 border-4"><img class="h-80 w-64" src="/img/lessonplan.jpg" alt=""/></div>
<div class="grid h-72 w-64 border-4"><img class="h-80 w-64" src="/img/lessonplan.jpg" alt=""/></div> --> <div class="grid h-72 w-64 border-4"><img class="h-80 w-64" src="/img/lessonplan.jpg" alt=""/></div> -->
@ -39,7 +39,7 @@
<div class="modal-content"> <div class="modal-content">
<span @click="hideLpModal" class="close text-4xl font-bold cursor-pointer text-gray-200 border-2 rounded-full p-1">X</span> <span @click="hideLpModal" class="close text-4xl font-bold cursor-pointer text-gray-200 border-2 rounded-full p-1">X</span>
<div> <div>
<img width="540" :src="'https://curriculum-app-api.beanstalkedu.com/assets/'+ file" alt=""/> <img width="540" :src="'https://management.beanstalkedu.com/assets/'+ file" alt=""/>
</div> </div>
</div> </div>
</div> </div>
@ -78,7 +78,7 @@ export default {
} }
}, },
mounted: function () { mounted: function () {
fetch('https://curriculum-app-api.beanstalkedu.com/items/lesson_plan?filter[plan][_eq]=daily') fetch('https://management.beanstalkedu.com/items/lesson_plan?filter[plan][_eq]=daily')
.then(resp => resp.json()) .then(resp => resp.json())
.then(data => { .then(data => {
this.dailyplan=data.data this.dailyplan=data.data

4
src/components/Educators.vue
View File

@ -107,7 +107,7 @@
<div class="flex text-color-1 hero-text justify-center font-semibold">Curriculum Blogs</div> <div class="flex text-color-1 hero-text justify-center font-semibold">Curriculum Blogs</div>
<div class="grid grid-cols-1 md:grid-cols-2 xl:grid-cols-3 gap-8 mt-10 justify-center"> <div class="grid grid-cols-1 md:grid-cols-2 xl:grid-cols-3 gap-8 mt-10 justify-center">
<div class="grid w-fit h-fit" v-for="(item, index) in tbBlog"> <div class="grid w-fit h-fit" v-for="(item, index) in tbBlog">
<img class="w-full rounded-tl-3xl rounded-br-3xl px-4" v-if="item.img" :src="'https://curriculum-app-api.beanstalkedu.com/assets/'+item.img+'?width=420&amp;height=280'" alt="" > <img class="w-full rounded-tl-3xl rounded-br-3xl px-4" v-if="item.img" :src="'https://management.beanstalkedu.com/assets/'+item.img+'?width=420&amp;height=280'" alt="" >
<div class="flex bg-yellow-200 absolute mt-48 ml-4 text-lg leading-tight w-14 h-14 font-semibold text-blue-700 rounded-full text-center p-1">{{ item.date}}</div> <div class="flex bg-yellow-200 absolute mt-48 ml-4 text-lg leading-tight w-14 h-14 font-semibold text-blue-700 rounded-full text-center p-1">{{ item.date}}</div>
<h1 class="text-color-1 text-2xl font-semibold pt-4 px-4 line-clamp-2 w-fit">{{ item.meta}}</h1> <h1 class="text-color-1 text-2xl font-semibold pt-4 px-4 line-clamp-2 w-fit">{{ item.meta}}</h1>
<div class="text-lg text-justify font-light w-fit text-color-2 px-4 line-clamp-4" v-html="item.meta_description"></div> <div class="text-lg text-justify font-light w-fit text-color-2 px-4 line-clamp-4" v-html="item.meta_description"></div>
@ -551,7 +551,7 @@ export default {
this.getinTouchQry=false this.getinTouchQry=false
}, },
getItemByCategory() { getItemByCategory() {
fetch('https://curriculum-app-api.beanstalkedu.com/items/blog?filter[status][_eq]=published&filter[category][_eq]=curriculum&limit=3&sort=sort,-date_created&filter[property][_eq]=teenybeans_curriculum') fetch('https://management.beanstalkedu.com/items/blog?filter[status][_eq]=published&filter[category][_eq]=curriculum&limit=3&sort=sort,-date_created&filter[property][_eq]=teenybeans_curriculum')
.then(response => response.json()) .then(response => response.json())
.then(data => { .then(data => {
this.tbBlog = data.data this.tbBlog = data.data

4
src/components/Homepage.vue
View File

@ -105,7 +105,7 @@
@swiper="onSwiper" @swiper="onSwiper"
@slideChange="onSlideChange"> @slideChange="onSlideChange">
<swiper-slide v-for="lesson in lessonplan" :key="lesson.id"> <swiper-slide v-for="lesson in lessonplan" :key="lesson.id">
<img class="" lesson.lesson_icon :src="'https://curriculum-app-api.beanstalkedu.com/assets/'+ lesson.lesson_icon" alt=""> <img class="" lesson.lesson_icon :src="'https://management.beanstalkedu.com/assets/'+ lesson.lesson_icon" alt="">
</swiper-slide> </swiper-slide>
</swiper> </swiper>
</div> </div>
@ -318,7 +318,7 @@
} }
}, },
mounted: function () { mounted: function () {
fetch('https://curriculum-app-api.beanstalkedu.com/items/lesson_plan') fetch('https://management.beanstalkedu.com/items/lesson_plan')
.then(response => response.json()) .then(response => response.json())
.then(data => { .then(data => {
this.lessonplan = data.data this.lessonplan = data.data

6
src/components/Monthlyplan.vue
View File

@ -27,7 +27,7 @@
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 mt-16 place-items-center mb-32 gap-16 "> <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 mt-16 place-items-center mb-32 gap-16 ">
<div v-for="lessonplan in monthlyplan" :key="lessonplan.id"> <div v-for="lessonplan in monthlyplan" :key="lessonplan.id">
<div @click="showLpModal(lessonplan.file)"> <div @click="showLpModal(lessonplan.file)">
<div class="grid gap-4"><img class=" cursor-pointer w-96 h-6/6 " v-if="lessonplan.lesson_icon" :src="'https://curriculum-app-api.beanstalkedu.com/assets/'+ lessonplan.lesson_icon" alt=""/></div> <div class="grid gap-4"><img class=" cursor-pointer w-96 h-6/6 " v-if="lessonplan.lesson_icon" :src="'https://management.beanstalkedu.com/assets/'+ lessonplan.lesson_icon" alt=""/></div>
</div> </div>
<!-- <div class="grid h-72 w-64 border-4"><img class="h-80 w-64" src="/img/lessonplan.jpg" alt=""/></div> <!-- <div class="grid h-72 w-64 border-4"><img class="h-80 w-64" src="/img/lessonplan.jpg" alt=""/></div>
<div class="grid h-72 w-64 border-4"><img class="h-80 w-64" src="/img/lessonplan.jpg" alt=""/></div> --> <div class="grid h-72 w-64 border-4"><img class="h-80 w-64" src="/img/lessonplan.jpg" alt=""/></div> -->
@ -39,7 +39,7 @@
<div class="modal-content"> <div class="modal-content">
<span @click="hideLpModal" class="close text-4xl font-bold cursor-pointer text-gray-200 border-2 rounded-full p-1">X</span> <span @click="hideLpModal" class="close text-4xl font-bold cursor-pointer text-gray-200 border-2 rounded-full p-1">X</span>
<div> <div>
<img width="540" :src="'https://curriculum-app-api.beanstalkedu.com/assets/'+ file" alt=""/> <img width="540" :src="'https://management.beanstalkedu.com/assets/'+ file" alt=""/>
</div> </div>
</div> </div>
</div> </div>
@ -78,7 +78,7 @@ export default {
} }
}, },
mounted: function () { mounted: function () {
fetch('https://curriculum-app-api.beanstalkedu.com/items/lesson_plan?filter[plan][_eq]=monthly') fetch('https://management.beanstalkedu.com/items/lesson_plan?filter[plan][_eq]=monthly')
.then(resp => resp.json()) .then(resp => resp.json())
.then(data => { .then(data => {
this.monthlyplan=data.data this.monthlyplan=data.data

8
src/components/OccasionAudioBook.vue
View File

@ -7,7 +7,7 @@
<div @click="showAbModal(audiobooks.file)"> <div @click="showAbModal(audiobooks.file)">
<div class="grid place-items-center cursor-pointer"> <div class="grid place-items-center cursor-pointer">
<div class=" "> <div class=" ">
<img class="w-56" v-if="audiobooks.audio_icon" :src="'https://curriculum-app-api.beanstalkedu.com/assets/'+ audiobooks.audio_icon" alt=""/> <img class="w-56" v-if="audiobooks.audio_icon" :src="'https://management.beanstalkedu.com/assets/'+ audiobooks.audio_icon" alt=""/>
</div> </div>
<h1 class="pt-4 w-fit font-20px">{{audiobooks.title}}</h1> <h1 class="pt-4 w-fit font-20px">{{audiobooks.title}}</h1>
</div> </div>
@ -19,7 +19,7 @@
<div class="modal-content" @click="doNothing()"> <div class="modal-content" @click="doNothing()">
<span @click="hideAbModal" class="close">&times;</span> <span @click="hideAbModal" class="close">&times;</span>
<audio controls> <audio controls>
<source :src="'https://curriculum-app-api.beanstalkedu.com/assets/'+ abID" type="audio/ogg"> <source :src="'https://management.beanstalkedu.com/assets/'+ abID" type="audio/ogg">
Your browser does not support the audio element. Your browser does not support the audio element.
</audio> </audio>
</div> </div>
@ -57,7 +57,7 @@ export default {
}, },
mounted: function () { mounted: function () {
// this.getVideos() // this.getVideos()
fetch('https://curriculum-app-api.beanstalkedu.com/items/occassion?filter[status][_eq]=published') fetch('https://management.beanstalkedu.com/items/occassion?filter[status][_eq]=published')
.then(response => response.json()) .then(response => response.json())
.then(data => { .then(data => {
this.page = data.data this.page = data.data
@ -65,7 +65,7 @@ export default {
// console.log(this.page[0].id) // console.log(this.page[0].id)
return this.page[0].id return this.page[0].id
}) })
fetch('https://curriculum-app-api.beanstalkedu.com/items/occassion_audio_book') fetch('https://management.beanstalkedu.com/items/occassion_audio_book')
.then(resp => resp.json()) .then(resp => resp.json())
.then(audiobooks => { .then(audiobooks => {
this.audiobooks=audiobooks.data.reverse().slice(0, 3) this.audiobooks=audiobooks.data.reverse().slice(0, 3)

10
src/components/OccassionVideo.vue
View File

@ -7,7 +7,7 @@
<div v-for="vdo in videos.slice(0, 3)" :key="videos.id" class="p-4"> <div v-for="vdo in videos.slice(0, 3)" :key="videos.id" class="p-4">
<div @click="showYtModal(vdo.youtube_id)"> <div @click="showYtModal(vdo.youtube_id)">
<div class="flex bg-gray-200 -rotate-6 cursor-pointer gap-8"> <div class="flex bg-gray-200 -rotate-6 cursor-pointer gap-8">
<div class="flex rotate-6 relative"><img v-if="vdo.video_thumb" :src="'https://curriculum-app-api.beanstalkedu.com/assets/'+vdo.video_thumb" alt="" class="rounded-tl-xl rounded-br-xl shadow-2xl" /> <div class="flex rotate-6 relative"><img v-if="vdo.video_thumb" :src="'https://management.beanstalkedu.com/assets/'+vdo.video_thumb" alt="" class="rounded-tl-xl rounded-br-xl shadow-2xl" />
<img class="absolute top-16 left-24 -rotate-6 w-16" src="/img/svg/play.svg" alt="" /> <img class="absolute top-16 left-24 -rotate-6 w-16" src="/img/svg/play.svg" alt="" />
</div> </div>
</div> </div>
@ -16,7 +16,7 @@
<!-- <label :for="vdo.videos_file" > <!-- <label :for="vdo.videos_file" >
<div class="flex bg-gray-200 -rotate-6 cursor-pointer gap-8"> <div class="flex bg-gray-200 -rotate-6 cursor-pointer gap-8">
<div class="flex rotate-6 relative"><img v-if="vdo.video_thumb" :src="'https://curriculum-app-api.beanstalkedu.com/assets/'+vdo.video_thumb" alt="" class="rounded-tl-xl rounded-br-xl shadow-2xl" /> <div class="flex rotate-6 relative"><img v-if="vdo.video_thumb" :src="'https://management.beanstalkedu.com/assets/'+vdo.video_thumb" alt="" class="rounded-tl-xl rounded-br-xl shadow-2xl" />
<img v-else src="/img/image_not_available.png" alt="" /> <img v-else src="/img/image_not_available.png" alt="" />
<img class="absolute top-20 left-28 -rotate-6 w-24" src="/img/svg/play.svg" alt="" /> <img class="absolute top-20 left-28 -rotate-6 w-24" src="/img/svg/play.svg" alt="" />
</div> </div>
@ -35,7 +35,7 @@
<a href="/plan"> <a href="/plan">
<div v-for="vdo in videos.slice(3, 4)" :key="videos.id" class="p-4"> <div v-for="vdo in videos.slice(3, 4)" :key="videos.id" class="p-4">
<div class="flex bg-gray-200 -rotate-6 gap-8"> <div class="flex bg-gray-200 -rotate-6 gap-8">
<div class="flex rotate-6 relative"><img v-if="vdo.video_thumb" :src="'https://curriculum-app-api.beanstalkedu.com/assets/'+vdo.video_thumb" alt="" class="rounded-tl-lg rounded-br-lg" /> <div class="flex rotate-6 relative"><img v-if="vdo.video_thumb" :src="'https://management.beanstalkedu.com/assets/'+vdo.video_thumb" alt="" class="rounded-tl-lg rounded-br-lg" />
<div class="absolute top-16 left-20"> <div class="absolute top-16 left-20">
<h3 class="text-center inline-block px-4 py-2.5 bg-amber-500 text-white font-medium text-xs leading-tight rounded shadow-md hover:bg-amber-400 hover:shadow-lg focus:bg-amber-600 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-blue-800 active:shadow-lg transition duration-150 ease-in-out">+ Subscribe </h3> <h3 class="text-center inline-block px-4 py-2.5 bg-amber-500 text-white font-medium text-xs leading-tight rounded shadow-md hover:bg-amber-400 hover:shadow-lg focus:bg-amber-600 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-blue-800 active:shadow-lg transition duration-150 ease-in-out">+ Subscribe </h3>
<h3 class="-ml-2"> &nbsp;To download <br> more resources</h3> <h3 class="-ml-2"> &nbsp;To download <br> more resources</h3>
@ -94,7 +94,7 @@ methods: {
} }
}, },
mounted: function () { mounted: function () {
fetch('https://curriculum-app-api.beanstalkedu.com/items/occassion?filter[status][_eq]=published') fetch('https://management.beanstalkedu.com/items/occassion?filter[status][_eq]=published')
.then(response => response.json()) .then(response => response.json())
.then(data => { .then(data => {
this.page = data.data this.page = data.data
@ -103,7 +103,7 @@ methods: {
return this.page[0].id return this.page[0].id
}) })
.then((occassionID) => { .then((occassionID) => {
fetch('https://curriculum-app-api.beanstalkedu.com/items/occassion_videos?filter[occassion_key][_in]='+ occassionID) fetch('https://management.beanstalkedu.com/items/occassion_videos?filter[occassion_key][_in]='+ occassionID)
.then(resp => resp.json()) .then(resp => resp.json())
.then(videos => { .then(videos => {
this.videos=videos.data.reverse().slice(0, 4) this.videos=videos.data.reverse().slice(0, 4)

2
src/components/Premium.vue
View File

@ -305,7 +305,7 @@ export default {
}, },
body: JSON.stringify(formData) body: JSON.stringify(formData)
}; };
fetch('https://curriculum-app-api.beanstalkedu.com/items/contact_form', dataToSave) fetch('https://management.beanstalkedu.com/items/contact_form', dataToSave)
.then(response => response.json()) .then(response => response.json())
.then(data => this.contact_form = data.data); .then(data => this.contact_form = data.data);
// console.log(this.contact_form) // console.log(this.contact_form)

4
src/components/Slider.vue
View File

@ -9,7 +9,7 @@
@swiper="onSwiper" @swiper="onSwiper"
@slideChange="onSlideChange" @slideChange="onSlideChange"
> >
<swiper-slide v-for="lesson in lessonplan" :key="lesson.id" :image="'https://curriculum-app-api.beanstalkedu.com/assets/'+ lesson.lesson_icon">Slide 1</swiper-slide> <swiper-slide v-for="lesson in lessonplan" :key="lesson.id" :image="'https://management.beanstalkedu.com/assets/'+ lesson.lesson_icon">Slide 1</swiper-slide>
<swiper-slide>Slide 2</swiper-slide> <swiper-slide>Slide 2</swiper-slide>
<swiper-slide>Slide 3</swiper-slide> <swiper-slide>Slide 3</swiper-slide>
... ...
@ -59,7 +59,7 @@
}; };
}, },
mounted: function () { mounted: function () {
fetch('https://curriculum-app-api.beanstalkedu.com/items/lesson_plan?filter[plan][_eq]=daily') fetch('https://management.beanstalkedu.com/items/lesson_plan?filter[plan][_eq]=daily')
.then(response => response.json()) .then(response => response.json())
.then(data => { .then(data => {
this.lessonplan = data.data this.lessonplan = data.data

4
src/components/SliderLessonplan.vue
View File

@ -19,7 +19,7 @@
@swiper="onSwiper" @swiper="onSwiper"
@slideChange="onSlideChange"> @slideChange="onSlideChange">
<swiper-slide v-for="lesson in lessonplan" :key="lesson.id"> <swiper-slide v-for="lesson in lessonplan" :key="lesson.id">
<img class="" lesson.lesson_icon :src="'https://curriculum-app-api.beanstalkedu.com/assets/'+ lesson.lesson_icon" alt=""> <img class="" lesson.lesson_icon :src="'https://management.beanstalkedu.com/assets/'+ lesson.lesson_icon" alt="">
</swiper-slide> </swiper-slide>
</swiper> </swiper>
</div> </div>
@ -101,7 +101,7 @@ width: 350px;
} }
}, },
mounted: function () { mounted: function () {
fetch('https://curriculum-app-api.beanstalkedu.com/items/lesson_plan') fetch('https://management.beanstalkedu.com/items/lesson_plan')
.then(response => response.json()) .then(response => response.json())
.then(data => { .then(data => {
this.lessonplan = data.data this.lessonplan = data.data

4
src/components/TestSwiper.vue
View File

@ -9,7 +9,7 @@
@slideChange="onSlideChange" @slideChange="onSlideChange"
> >
<swiper-slide v-for="lesson in lessonplan" :key="lesson.id"> <swiper-slide v-for="lesson in lessonplan" :key="lesson.id">
<img lesson.lesson_icon :src="'https://curriculum-app-api.beanstalkedu.com/assets/'+ lesson.lesson_icon" alt=""> <img lesson.lesson_icon :src="'https://management.beanstalkedu.com/assets/'+ lesson.lesson_icon" alt="">
</swiper-slide> </swiper-slide>
</swiper> </swiper>
</template> </template>
@ -66,7 +66,7 @@
} }
}, },
mounted: function () { mounted: function () {
fetch('https://curriculum-app-api.beanstalkedu.com/items/lesson_plan?filter[plan][_eq]=daily') fetch('https://management.beanstalkedu.com/items/lesson_plan?filter[plan][_eq]=daily')
.then(response => response.json()) .then(response => response.json())
.then(data => { .then(data => {
this.lessonplan = data.data this.lessonplan = data.data

48
src/components/Themes.vue
View File

@ -11,7 +11,7 @@
</div> </div>
<div class="flex w-fit justify-center place-items-center"> <div class="flex w-fit justify-center place-items-center">
<!-- <img class="w-full h-fit drop-shadow-2xl rounded-3xl py-4 cursor-none" src="/img/occassion1.png" alt=""> --> <!-- <img class="w-full h-fit drop-shadow-2xl rounded-3xl py-4 cursor-none" src="/img/occassion1.png" alt=""> -->
<img class="w-fit h-fit" v-if="page" :src="'https://curriculum-app-api.beanstalkedu.com/assets/'+page[0].theme_hero_img" alt=""> <img class="w-fit h-fit" v-if="page" :src="'https://management.beanstalkedu.com/assets/'+page[0].theme_hero_img" alt="">
</div> </div>
</div> </div>
</section> </section>
@ -23,7 +23,7 @@
<!-- section hero --> <!-- section hero -->
<!-- <section class="container-fluid"> <!-- <section class="container-fluid">
<div class="flex place-items-center load-wraper"> <div class="flex place-items-center load-wraper">
<img class="w-screen " v-if="page" :src="'https://curriculum-app-api.beanstalkedu.com/assets/'+page[0].theme_hero_img" alt=""> <img class="w-screen " v-if="page" :src="'https://management.beanstalkedu.com/assets/'+page[0].theme_hero_img" alt="">
<div class="absolute lg:inset-16 2xl:pl-32 2xl:pt-16 p-4 text-color-1 hero-text font-bold"> Theme of the month - <div class="absolute lg:inset-16 2xl:pl-32 2xl:pt-16 p-4 text-color-1 hero-text font-bold"> Theme of the month -
<div v-if="page">{{page[0].theme_title}} </div> <div v-if="page">{{page[0].theme_title}} </div>
</div> </div>
@ -45,13 +45,13 @@
<div v-if="ideas" class="grid place-items-center grid-cols-1 md:grid-cols-2 xl:grid-cols-3 2xl:grid-cols-4 "> <div v-if="ideas" class="grid place-items-center grid-cols-1 md:grid-cols-2 xl:grid-cols-3 2xl:grid-cols-4 ">
<div v-for="ida in ideas.slice(0, 4)" :key="ideas.id" class=""> <div v-for="ida in ideas.slice(0, 4)" :key="ideas.id" class="">
<div class="flex relative"> <div class="flex relative">
<img v-if="ida.celebration_ideas_img" :src="'https://curriculum-app-api.beanstalkedu.com/assets/'+ida.celebration_ideas_img" alt="" class="pt-4 rounded-tl-xl rounded-br-xl shadow-xl" /> <img v-if="ida.celebration_ideas_img" :src="'https://management.beanstalkedu.com/assets/'+ida.celebration_ideas_img" alt="" class="pt-4 rounded-tl-xl rounded-br-xl shadow-xl" />
<div class="absolute top-10 left-8 text-2xl text-color-1 font-semibold">{{ida.celebration_ideas_title}} <div class="absolute top-10 left-8 text-2xl text-color-1 font-semibold">{{ida.celebration_ideas_title}}
</div> </div>
<div class="absolute top-16 py-3 left-8 text-xl text-color-2">{{ida.celebration_ideas_body_text}} <div class="absolute top-16 py-3 left-8 text-xl text-color-2">{{ida.celebration_ideas_body_text}}
</div> </div>
<div class="absolute bottom-10 left-32 md:left-28"> <div class="absolute bottom-10 left-32 md:left-28">
<a :href="'https://curriculum-app-api.beanstalkedu.com/assets/'+ida.celebration_ideas_img+'?download'"> <a :href="'https://management.beanstalkedu.com/assets/'+ida.celebration_ideas_img+'?download'">
<h3 class="text-center inline-block px-6 py-2.5 bg-blue-500 text-white font-medium text-base leading-tight rounded shadow-md hover:bg-blue-400 hover:shadow-lg focus:bg-blue-600 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-blue-800 active:shadow-lg transition duration-150 ease-in-out"> View Now </h3> <h3 class="text-center inline-block px-6 py-2.5 bg-blue-500 text-white font-medium text-base leading-tight rounded shadow-md hover:bg-blue-400 hover:shadow-lg focus:bg-blue-600 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-blue-800 active:shadow-lg transition duration-150 ease-in-out"> View Now </h3>
</a> </a>
</div> </div>
@ -67,9 +67,9 @@
<div v-if="worksheets" class="grid place-items-center grid-cols-1 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 mt-6"> <div v-if="worksheets" class="grid place-items-center grid-cols-1 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 mt-6">
<div v-for="wkst in worksheets.slice(0, 3)" :key="worksheets.id" class="p-4"> <div v-for="wkst in worksheets.slice(0, 3)" :key="worksheets.id" class="p-4">
<div class="flex relative"> <div class="flex relative">
<img v-if="wkst.theme_worksheets_img" :src="'https://curriculum-app-api.beanstalkedu.com/assets/'+wkst.theme_worksheets_img" alt="" class="w-80 shadow-2xl rounded-tl-lg rounded-br-lg" /> <img v-if="wkst.theme_worksheets_img" :src="'https://management.beanstalkedu.com/assets/'+wkst.theme_worksheets_img" alt="" class="w-80 shadow-2xl rounded-tl-lg rounded-br-lg" />
<div class="absolute bottom-10 left-20"> <div class="absolute bottom-10 left-20">
<a :href="'https://curriculum-app-api.beanstalkedu.com/assets/'+wkst.file+'?download'"> <a :href="'https://management.beanstalkedu.com/assets/'+wkst.file+'?download'">
<h3 class="text-center inline-block px-6 py-2.5 bg-blue-500 text-white font-medium text-base leading-tight rounded shadow-md hover:bg-blue-400 hover:shadow-lg focus:bg-blue-600 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-blue-800 active:shadow-lg transition duration-150 ease-in-out"> Download </h3> <h3 class="text-center inline-block px-6 py-2.5 bg-blue-500 text-white font-medium text-base leading-tight rounded shadow-md hover:bg-blue-400 hover:shadow-lg focus:bg-blue-600 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-blue-800 active:shadow-lg transition duration-150 ease-in-out"> Download </h3>
</a> </a>
</div> </div>
@ -79,7 +79,7 @@
<a href="/worksheets"> <a href="/worksheets">
<div v-for="wkst in worksheets.slice(3, 4)" :key="worksheets.id" class="p-4"> <div v-for="wkst in worksheets.slice(3, 4)" :key="worksheets.id" class="p-4">
<div class="flex relative"> <div class="flex relative">
<img v-if="wkst.theme_worksheets_img" :src="'https://curriculum-app-api.beanstalkedu.com/assets/'+wkst.theme_worksheets_img" alt="" class="w-80 shadow-2xl rounded-tl-lg rounded-br-lg" /> <img v-if="wkst.theme_worksheets_img" :src="'https://management.beanstalkedu.com/assets/'+wkst.theme_worksheets_img" alt="" class="w-80 shadow-2xl rounded-tl-lg rounded-br-lg" />
<div class="absolute top-40 left-20"> <div class="absolute top-40 left-20">
<h3 class="text-center inline-block px-6 py-2.5 bg-amber-500 text-white font-medium text-base leading-tight rounded shadow-md hover:bg-amber-400 hover:shadow-lg focus:bg-amber-600 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-blue-800 active:shadow-lg transition duration-150 ease-in-out"> + Subscribe </h3> <h3 class="text-center inline-block px-6 py-2.5 bg-amber-500 text-white font-medium text-base leading-tight rounded shadow-md hover:bg-amber-400 hover:shadow-lg focus:bg-amber-600 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-blue-800 active:shadow-lg transition duration-150 ease-in-out"> + Subscribe </h3>
<h3 class="-ml-2 absolute left-8 text-center"> &nbsp;To download <br> more resources</h3> <h3 class="-ml-2 absolute left-8 text-center"> &nbsp;To download <br> more resources</h3>
@ -98,7 +98,7 @@
<div v-for="vdo in videos.slice(0, 3)" :key="videos.id" class="p-4"> <div v-for="vdo in videos.slice(0, 3)" :key="videos.id" class="p-4">
<div @click="showYtModal(vdo.youtube_id)"> <div @click="showYtModal(vdo.youtube_id)">
<div class="flex bg-gray-200 -rotate-6 cursor-pointer gap-8 rounded-tl-xl rounded-br-xl shadow-2xl"> <div class="flex bg-gray-200 -rotate-6 cursor-pointer gap-8 rounded-tl-xl rounded-br-xl shadow-2xl">
<div class="flex rotate-6 relative"><img class="rounded-tl-xl rounded-br-xl shadow-2xl w-96" v-if="vdo.video_thumb" :src="'https://curriculum-app-api.beanstalkedu.com/assets/'+vdo.video_thumb" alt="" /> <div class="flex rotate-6 relative"><img class="rounded-tl-xl rounded-br-xl shadow-2xl w-96" v-if="vdo.video_thumb" :src="'https://management.beanstalkedu.com/assets/'+vdo.video_thumb" alt="" />
<img class="absolute inset-16 left-32 w-16" src="/img/svg/play.svg" alt="" /> <img class="absolute inset-16 left-32 w-16" src="/img/svg/play.svg" alt="" />
</div> </div>
</div> </div>
@ -106,7 +106,7 @@
</div> </div>
<!-- <label :for="vdo.videos_file" > <!-- <label :for="vdo.videos_file" >
<div class="flex bg-gray-200 -rotate-6 cursor-pointer gap-8"> <div class="flex bg-gray-200 -rotate-6 cursor-pointer gap-8">
<div class="flex rotate-6 relative"><img v-if="vdo.video_thumb" :src="'https://curriculum-app-api.beanstalkedu.com/assets/'+vdo.video_thumb" alt="" class="rounded-tl-xl rounded-br-xl shadow-2xl" /> <div class="flex rotate-6 relative"><img v-if="vdo.video_thumb" :src="'https://management.beanstalkedu.com/assets/'+vdo.video_thumb" alt="" class="rounded-tl-xl rounded-br-xl shadow-2xl" />
<img v-else src="/img/image_not_available.png" alt="" /> <img v-else src="/img/image_not_available.png" alt="" />
<img class="absolute top-20 left-28 -rotate-6 w-24" src="/img/svg/play.svg" alt="" /> <img class="absolute top-20 left-28 -rotate-6 w-24" src="/img/svg/play.svg" alt="" />
</div> </div>
@ -125,7 +125,7 @@
<a href="/plan"> <a href="/plan">
<div v-for="vdo in videos.slice(3, 4)" :key="videos.id" class="p-4"> <div v-for="vdo in videos.slice(3, 4)" :key="videos.id" class="p-4">
<div class="flex bg-gray-00 -rotate-6 gap-8"> <div class="flex bg-gray-00 -rotate-6 gap-8">
<div class="flex rotate-6 relative"><img v-if="vdo.video_thumb" :src="'https://curriculum-app-api.beanstalkedu.com/assets/'+vdo.video_thumb" alt="" class="rounded-tl-xl rounded-br-xl" /> <div class="flex rotate-6 relative"><img v-if="vdo.video_thumb" :src="'https://management.beanstalkedu.com/assets/'+vdo.video_thumb" alt="" class="rounded-tl-xl rounded-br-xl" />
<div class="absolute top-20 left-28 "> <div class="absolute top-20 left-28 ">
<h3 class="text-center inline-block px-6 py-2.5 bg-amber-500 text-white font-medium text-xs leading-tight rounded shadow-md hover:bg-amber-400 hover:shadow-lg focus:bg-amber-600 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-blue-800 active:shadow-lg transition duration-150 ease-in-out">+ Subscribe </h3> <h3 class="text-center inline-block px-6 py-2.5 bg-amber-500 text-white font-medium text-xs leading-tight rounded shadow-md hover:bg-amber-400 hover:shadow-lg focus:bg-amber-600 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-blue-800 active:shadow-lg transition duration-150 ease-in-out">+ Subscribe </h3>
<h3 class="-ml-2"> &nbsp;To download <br> more resources</h3> <h3 class="-ml-2"> &nbsp;To download <br> more resources</h3>
@ -143,7 +143,7 @@
<div class="grid place-items-center grid-cols-1 md:grid-cols-2 lg:grid-cols-5 "> <div class="grid place-items-center grid-cols-1 md:grid-cols-2 lg:grid-cols-5 ">
<div v-for="aud in audio" :key="audio.id" class="p-2"> <div v-for="aud in audio" :key="audio.id" class="p-2">
<label :for="aud.file" > <label :for="aud.file" >
<img class="cursor-pointer rounded-tl-xl rounded-br-xl w-56" v-if="aud.audio_icon" :src="'https://curriculum-app-api.beanstalkedu.com/assets/'+aud.audio_icon" alt=""> <img class="cursor-pointer rounded-tl-xl rounded-br-xl w-56" v-if="aud.audio_icon" :src="'https://management.beanstalkedu.com/assets/'+aud.audio_icon" alt="">
<div class="cursor-pointer text-center text-xl text-color-2 pt-2">{{aud.title}}</div> <div class="cursor-pointer text-center text-xl text-color-2 pt-2">{{aud.title}}</div>
</label> </label>
<!-- <label :for="aud.file" class="btn">{{aud.id}} -</label> --> <!-- <label :for="aud.file" class="btn">{{aud.id}} -</label> -->
@ -152,7 +152,7 @@
<label :for="aud.file" class="modal cursor-pointer"> <label :for="aud.file" class="modal cursor-pointer">
<label class="modal-box relative" for=""> <label class="modal-box relative" for="">
<audio controls> <audio controls>
<source :src="'https://curriculum-app-api.beanstalkedu.com/assets/'+aud.file" type="audio/mpeg">Your browser does not support the audio element. <source :src="'https://management.beanstalkedu.com/assets/'+aud.file" type="audio/mpeg">Your browser does not support the audio element.
</audio> </audio>
</label> </label>
</label> </label>
@ -172,7 +172,7 @@
<div class="grid place-items-center grid-cols-1 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 pb-32 px-4"> <div class="grid place-items-center grid-cols-1 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 pb-32 px-4">
<div v-for="slide in stories" :key="stories.id" class="p-4 "> <div v-for="slide in stories" :key="stories.id" class="p-4 ">
<div class="flex bg-gray-200 rotate-6 gap-8"> <div class="flex bg-gray-200 rotate-6 gap-8">
<div class="flex -rotate-6 relative"><img v-if="slide.img" :src="'https://curriculum-app-api.beanstalkedu.com/assets/'+slide.img" alt="" class="rounded-tl-lg rounded-br-lg" /> <div class="flex -rotate-6 relative"><img v-if="slide.img" :src="'https://management.beanstalkedu.com/assets/'+slide.img" alt="" class="rounded-tl-lg rounded-br-lg" />
<img v-else src="/img/image_not_available.png" alt="" /> <img v-else src="/img/image_not_available.png" alt="" />
<div class="flex absolute bg-white p-2 rounded-md m-4 justify-center text-sm md:text-xl">{{slide.title}}</div> <div class="flex absolute bg-white p-2 rounded-md m-4 justify-center text-sm md:text-xl">{{slide.title}}</div>
<p class="absolute inset-x-0 bottom-6 text-blue-100 text-justify p-3 font-semibold rounded-br-lg line-clamp-3">{{slide.text}}</p> <p class="absolute inset-x-0 bottom-6 text-blue-100 text-justify p-3 font-semibold rounded-br-lg line-clamp-3">{{slide.text}}</p>
@ -191,7 +191,7 @@
<div class="grid place-items-center grid-cols-1 md:grid-cols-2 lg:grid-cols-5 "> <div class="grid place-items-center grid-cols-1 md:grid-cols-2 lg:grid-cols-5 ">
<div v-for="yt in youtube" :key="youtube.id" class="p-2"> <div v-for="yt in youtube" :key="youtube.id" class="p-2">
<a :href="'https://www.youtube.com/watch?v='+yt.youtube_id"> <a :href="'https://www.youtube.com/watch?v='+yt.youtube_id">
<div><img class="rounded-tl-xl rounded-br-xl" :src="'https://curriculum-app-api.beanstalkedu.com/assets/'+yt.youtube_thumbnail" alt=""> <div><img class="rounded-tl-xl rounded-br-xl" :src="'https://management.beanstalkedu.com/assets/'+yt.youtube_thumbnail" alt="">
<div class="text-center text-lg ">{{yt.about_the_video}}</div> <div class="text-center text-lg ">{{yt.about_the_video}}</div>
</div> </div>
</a> </a>
@ -205,7 +205,7 @@
<div class="grid" v-for="themes in allThemes" :key="themes.id"> <div class="grid" v-for="themes in allThemes" :key="themes.id">
<a :href="'/themes/'+ themes.theme_slug"> <a :href="'/themes/'+ themes.theme_slug">
<div> <div>
<img class="rounded-lg shadow-2xl" v-if="themes.theme_icon" :src="'https://curriculum-app-api.beanstalkedu.com/assets/' + themes.theme_icon" alt=""/> <img class="rounded-lg shadow-2xl" v-if="themes.theme_icon" :src="'https://management.beanstalkedu.com/assets/' + themes.theme_icon" alt=""/>
</div> </div>
</a> </a>
</div> </div>
@ -219,7 +219,7 @@
:slide-ratio="1/4" :slide-ratio="1/4"
:dragging-distance="200" :dragging-distance="200"
:breakpoints="{ 800: { visibleSlides: 1, slideMultiple: 1 } }"> :breakpoints="{ 800: { visibleSlides: 1, slideMultiple: 1 } }">
<vueper-slide v-for="themes in allThemes" :key="themes.id" :image="'https://curriculum-app-api.beanstalkedu.com/assets/'+ themes.theme_icon" /> <vueper-slide v-for="themes in allThemes" :key="themes.id" :image="'https://management.beanstalkedu.com/assets/'+ themes.theme_icon" />
</vueper-slides> --> </vueper-slides> -->
</section> </section>
<section class="container mx-auto py-20 px-4 xl:px-24"> <section class="container mx-auto py-20 px-4 xl:px-24">
@ -288,7 +288,7 @@ export default {
} }
}, },
mounted: function () { mounted: function () {
fetch('https://curriculum-app-api.beanstalkedu.com/items/themes?filter[status][_eq]=published') fetch('https://management.beanstalkedu.com/items/themes?filter[status][_eq]=published')
.then(response => response.json()) .then(response => response.json())
.then(data => { .then(data => {
@ -297,7 +297,7 @@ export default {
// console.log(this.page[0].id) // console.log(this.page[0].id)
return this.page[0].id return this.page[0].id
}).then((themeID) => { }).then((themeID) => {
fetch('https://curriculum-app-api.beanstalkedu.com/items/theme_celebration_stories?filter[theme_key][_in]=' + themeID) fetch('https://management.beanstalkedu.com/items/theme_celebration_stories?filter[theme_key][_in]=' + themeID)
.then(resp => resp.json()) .then(resp => resp.json())
.then(stories => { .then(stories => {
this.stories=stories.data this.stories=stories.data
@ -307,7 +307,7 @@ export default {
return themeID return themeID
}).then((themeID) => { }).then((themeID) => {
fetch('https://curriculum-app-api.beanstalkedu.com/items/theme_celebration_ideas?filter[theme_key][_in]=' + themeID) fetch('https://management.beanstalkedu.com/items/theme_celebration_ideas?filter[theme_key][_in]=' + themeID)
.then(resp => resp.json()) .then(resp => resp.json())
.then(ideas => { .then(ideas => {
this.ideas=ideas.data this.ideas=ideas.data
@ -316,7 +316,7 @@ export default {
return themeID return themeID
}) })
.then((themeID) => { .then((themeID) => {
fetch('https://curriculum-app-api.beanstalkedu.com/items/theme_workshets?filter[theme_key][_in]='+ themeID) fetch('https://management.beanstalkedu.com/items/theme_workshets?filter[theme_key][_in]='+ themeID)
.then(resp => resp.json()) .then(resp => resp.json())
.then(worksheets => { .then(worksheets => {
this.worksheets=worksheets.data this.worksheets=worksheets.data
@ -325,7 +325,7 @@ export default {
return themeID return themeID
}) })
.then((themeID) => { .then((themeID) => {
fetch('https://curriculum-app-api.beanstalkedu.com/items/theme_videos?filter[theme_key][_in]='+ themeID) fetch('https://management.beanstalkedu.com/items/theme_videos?filter[theme_key][_in]='+ themeID)
.then(resp => resp.json()) .then(resp => resp.json())
.then(videos => { .then(videos => {
this.videos=videos.data this.videos=videos.data
@ -334,7 +334,7 @@ export default {
return themeID return themeID
}) })
.then((themeID) => { .then((themeID) => {
fetch('https://curriculum-app-api.beanstalkedu.com/items/theme_youtube_videos?filter[theme_key][_in]='+ themeID) fetch('https://management.beanstalkedu.com/items/theme_youtube_videos?filter[theme_key][_in]='+ themeID)
.then(resp => resp.json()) .then(resp => resp.json())
.then(youtube => { .then(youtube => {
this.youtube=youtube.data this.youtube=youtube.data
@ -343,14 +343,14 @@ export default {
return themeID return themeID
}) })
.then((themeID) => { .then((themeID) => {
fetch('https://curriculum-app-api.beanstalkedu.com/items/theme_audio_book?limit=3') fetch('https://management.beanstalkedu.com/items/theme_audio_book?limit=3')
.then(resp => resp.json()) .then(resp => resp.json())
.then(audio => { .then(audio => {
this.audio=audio.data this.audio=audio.data
// console.log(this.audio) // console.log(this.audio)
}) })
}) })
fetch('https://curriculum-app-api.beanstalkedu.com/items/themes?filter[status][_eq]=draft&limit=3') fetch('https://management.beanstalkedu.com/items/themes?filter[status][_eq]=draft&limit=3')
.then(response => response.json()) .then(response => response.json())
.then(data => { .then(data => {

8
src/components/ThemesAudioBook.vue
View File

@ -7,7 +7,7 @@
<div @click="showAbModal(audiobooks.file)"> <div @click="showAbModal(audiobooks.file)">
<div class="grid place-items-center cursor-pointer"> <div class="grid place-items-center cursor-pointer">
<div class=" "> <div class=" ">
<img class="w-56" v-if="audiobooks.audio_icon" :src="'https://curriculum-app-api.beanstalkedu.com/assets/'+ audiobooks.audio_icon" alt=""/> <img class="w-56" v-if="audiobooks.audio_icon" :src="'https://management.beanstalkedu.com/assets/'+ audiobooks.audio_icon" alt=""/>
</div> </div>
<h1 class="pt-4 w-fit font-20px text-center">{{audiobooks.title}}</h1> <h1 class="pt-4 w-fit font-20px text-center">{{audiobooks.title}}</h1>
</div> </div>
@ -19,7 +19,7 @@
<div class="modal-content" @click="doNothing()"> <div class="modal-content" @click="doNothing()">
<span @click="hideAbModal" class="close">&times;</span> <span @click="hideAbModal" class="close">&times;</span>
<audio controls> <audio controls>
<source :src="'https://curriculum-app-api.beanstalkedu.com/assets/'+ abID" type="audio/ogg"> <source :src="'https://management.beanstalkedu.com/assets/'+ abID" type="audio/ogg">
Your browser does not support the audio element. Your browser does not support the audio element.
</audio> </audio>
</div> </div>
@ -57,7 +57,7 @@ export default {
}, },
mounted: function () { mounted: function () {
// this.getVideos() // this.getVideos()
fetch('https://curriculum-app-api.beanstalkedu.com/items/themes?filter[status][_eq]=published') fetch('https://management.beanstalkedu.com/items/themes?filter[status][_eq]=published')
.then(response => response.json()) .then(response => response.json())
.then(data => { .then(data => {
this.page = data.data this.page = data.data
@ -65,7 +65,7 @@ export default {
// console.log(this.page[0].id) // console.log(this.page[0].id)
return this.page[0].id return this.page[0].id
}) })
fetch('https://curriculum-app-api.beanstalkedu.com/items/theme_audio_book') fetch('https://management.beanstalkedu.com/items/theme_audio_book')
.then(resp => resp.json()) .then(resp => resp.json())
.then(audiobooks => { .then(audiobooks => {
this.audiobooks=audiobooks.data.reverse().slice(0, 3) this.audiobooks=audiobooks.data.reverse().slice(0, 3)

10
src/components/ThemesVideos.vue
View File

@ -7,7 +7,7 @@
<div v-for="vdo in videos.slice(0, 3)" :key="videos.id" class="p-4"> <div v-for="vdo in videos.slice(0, 3)" :key="videos.id" class="p-4">
<div @click="showYtModal(vdo.youtube_id)"> <div @click="showYtModal(vdo.youtube_id)">
<div class="flex bg-gray-200 -rotate-6 cursor-pointer gap-8"> <div class="flex bg-gray-200 -rotate-6 cursor-pointer gap-8">
<div class="flex rotate-6 relative"><img v-if="vdo.video_thumb" :src="'https://curriculum-app-api.beanstalkedu.com/assets/'+vdo.video_thumb" alt="" class="rounded-tl-xl rounded-br-xl shadow-2xl" /> <div class="flex rotate-6 relative"><img v-if="vdo.video_thumb" :src="'https://management.beanstalkedu.com/assets/'+vdo.video_thumb" alt="" class="rounded-tl-xl rounded-br-xl shadow-2xl" />
<img class="absolute top-16 left-24 -rotate-6 w-16" src="/img/svg/play.svg" alt="" /> <img class="absolute top-16 left-24 -rotate-6 w-16" src="/img/svg/play.svg" alt="" />
</div> </div>
</div> </div>
@ -16,7 +16,7 @@
<!-- <label :for="vdo.videos_file" > <!-- <label :for="vdo.videos_file" >
<div class="flex bg-gray-200 -rotate-6 cursor-pointer gap-8"> <div class="flex bg-gray-200 -rotate-6 cursor-pointer gap-8">
<div class="flex rotate-6 relative"><img v-if="vdo.video_thumb" :src="'https://curriculum-app-api.beanstalkedu.com/assets/'+vdo.video_thumb" alt="" class="rounded-tl-xl rounded-br-xl shadow-2xl" /> <div class="flex rotate-6 relative"><img v-if="vdo.video_thumb" :src="'https://management.beanstalkedu.com/assets/'+vdo.video_thumb" alt="" class="rounded-tl-xl rounded-br-xl shadow-2xl" />
<img v-else src="/img/image_not_available.png" alt="" /> <img v-else src="/img/image_not_available.png" alt="" />
<img class="absolute top-20 left-28 -rotate-6 w-24" src="/img/svg/play.svg" alt="" /> <img class="absolute top-20 left-28 -rotate-6 w-24" src="/img/svg/play.svg" alt="" />
</div> </div>
@ -35,7 +35,7 @@
<a href="/plan"> <a href="/plan">
<div v-for="vdo in videos.slice(3, 4)" :key="videos.id" class="p-4"> <div v-for="vdo in videos.slice(3, 4)" :key="videos.id" class="p-4">
<div class="flex bg-gray-200 -rotate-6 gap-8"> <div class="flex bg-gray-200 -rotate-6 gap-8">
<div class="flex rotate-6 relative"><img v-if="vdo.video_thumb" :src="'https://curriculum-app-api.beanstalkedu.com/assets/'+vdo.video_thumb" alt="" class="rounded-tl-lg rounded-br-lg" /> <div class="flex rotate-6 relative"><img v-if="vdo.video_thumb" :src="'https://management.beanstalkedu.com/assets/'+vdo.video_thumb" alt="" class="rounded-tl-lg rounded-br-lg" />
<div class="absolute top-16 left-20"> <div class="absolute top-16 left-20">
<h3 class="text-center inline-block px-4 py-2.5 bg-amber-500 text-white font-medium text-xs leading-tight rounded shadow-md hover:bg-amber-400 hover:shadow-lg focus:bg-amber-600 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-blue-800 active:shadow-lg transition duration-150 ease-in-out">+ Subscribe </h3> <h3 class="text-center inline-block px-4 py-2.5 bg-amber-500 text-white font-medium text-xs leading-tight rounded shadow-md hover:bg-amber-400 hover:shadow-lg focus:bg-amber-600 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-blue-800 active:shadow-lg transition duration-150 ease-in-out">+ Subscribe </h3>
<h3 class="-ml-2"> &nbsp;To download <br> more resources</h3> <h3 class="-ml-2"> &nbsp;To download <br> more resources</h3>
@ -94,7 +94,7 @@ methods: {
} }
}, },
mounted: function () { mounted: function () {
fetch('https://curriculum-app-api.beanstalkedu.com/items/themes?filter[status][_eq]=published') fetch('https://management.beanstalkedu.com/items/themes?filter[status][_eq]=published')
.then(response => response.json()) .then(response => response.json())
.then(data => { .then(data => {
this.page = data.data this.page = data.data
@ -103,7 +103,7 @@ methods: {
return this.page[0].id return this.page[0].id
}) })
.then((themesID) => { .then((themesID) => {
fetch('https://curriculum-app-api.beanstalkedu.com/items/theme_videos?filter[theme_key][_in]='+ themesID) fetch('https://management.beanstalkedu.com/items/theme_videos?filter[theme_key][_in]='+ themesID)
.then(resp => resp.json()) .then(resp => resp.json())
.then(videos => { .then(videos => {
this.videos=videos.data.reverse().slice(0, 4) this.videos=videos.data.reverse().slice(0, 4)

8
src/components/Video-literacy.vue
View File

@ -26,7 +26,7 @@
<div @click="showYtModal(videobooks.youtube_id)"> <div @click="showYtModal(videobooks.youtube_id)">
<div class="grid place-items-center"> <div class="grid place-items-center">
<div class="relative rounded-tl-xl rounded-br-xl bg-gray-200 rotate-6"> <div class="relative rounded-tl-xl rounded-br-xl bg-gray-200 rotate-6">
<img class="w-96 relative -rotate-6 rounded-tl-xl rounded-br-xl cursor-pointer" v-if="videobooks.img" :src="'https://curriculum-app-api.beanstalkedu.com/assets/'+ videobooks.img" alt=""/> <img class="w-96 relative -rotate-6 rounded-tl-xl rounded-br-xl cursor-pointer" v-if="videobooks.img" :src="'https://management.beanstalkedu.com/assets/'+ videobooks.img" alt=""/>
<img class="absolute inset-24 lg:inset-16 left-36 lg:left-24 w-16 cursor-pointer" src="/img/svg/play.svg" alt=""/> <img class="absolute inset-24 lg:inset-16 left-36 lg:left-24 w-16 cursor-pointer" src="/img/svg/play.svg" alt=""/>
</div> </div>
<h1 class="text-center pt-4 w-fit font-20px">{{videobooks.title}}</h1> <h1 class="text-center pt-4 w-fit font-20px">{{videobooks.title}}</h1>
@ -46,7 +46,7 @@
<div v-for="videobooks in vbfliteracy" :key="vbfliteracy.id" class="grid"> <div v-for="videobooks in vbfliteracy" :key="vbfliteracy.id" class="grid">
<div class="grid place-items-center"> <div class="grid place-items-center">
<div class="flex rounded-tl-xl rounded-br-xl bg-gray-200 rotate-6"> <div class="flex rounded-tl-xl rounded-br-xl bg-gray-200 rotate-6">
<img class="-rotate-6 rounded-tl-xl rounded-br-xl" v-if="videobooks.img" :src="'https://curriculum-app-api.beanstalkedu.com/assets/'+ videobooks.img" alt=""/> <img class="-rotate-6 rounded-tl-xl rounded-br-xl" v-if="videobooks.img" :src="'https://management.beanstalkedu.com/assets/'+ videobooks.img" alt=""/>
</div> </div>
<h1 class="text-center pt-4 w-fit">{{videobooks.title}}</h1> <h1 class="text-center pt-4 w-fit">{{videobooks.title}}</h1>
</div> </div>
@ -156,13 +156,13 @@ export default {
} }
}, },
mounted: function () { mounted: function () {
fetch('https://curriculum-app-api.beanstalkedu.com/items/video_book?filter[category][_eq]=literacy') fetch('https://management.beanstalkedu.com/items/video_book?filter[category][_eq]=literacy')
.then(resp => resp.json()) .then(resp => resp.json())
.then(videobooks => { .then(videobooks => {
this.vbliteracy=videobooks.data.reverse().slice(0, 4) this.vbliteracy=videobooks.data.reverse().slice(0, 4)
// console.log(this.vbliteracy) // console.log(this.vbliteracy)
}) })
fetch('https://curriculum-app-api.beanstalkedu.com/items/video_book?filter[category][_eq]=literacy') fetch('https://management.beanstalkedu.com/items/video_book?filter[category][_eq]=literacy')
.then(resp => resp.json()) .then(resp => resp.json())
.then(videobooks => { .then(videobooks => {
this.vbfliteracy=videobooks.data.reverse().slice(5, 12) this.vbfliteracy=videobooks.data.reverse().slice(5, 12)

8
src/components/Video-mathematics.vue
View File

@ -25,7 +25,7 @@
<div @click="showYtModal(videobooks.youtube_id)"> <div @click="showYtModal(videobooks.youtube_id)">
<div class="grid place-items-center"> <div class="grid place-items-center">
<div class="relative rounded-tl-xl rounded-br-xl bg-gray-200 rotate-6"> <div class="relative rounded-tl-xl rounded-br-xl bg-gray-200 rotate-6">
<img class="w-96 relative -rotate-6 rounded-tl-xl rounded-br-xl cursor-pointer" v-if="videobooks.img" :src="'https://curriculum-app-api.beanstalkedu.com/assets/'+ videobooks.img" alt=""/> <img class="w-96 relative -rotate-6 rounded-tl-xl rounded-br-xl cursor-pointer" v-if="videobooks.img" :src="'https://management.beanstalkedu.com/assets/'+ videobooks.img" alt=""/>
<img class="absolute inset-24 lg:inset-16 left-36 lg:left-24 w-16 cursor-pointer" src="/img/svg/play.svg" alt=""/> <img class="absolute inset-24 lg:inset-16 left-36 lg:left-24 w-16 cursor-pointer" src="/img/svg/play.svg" alt=""/>
</div> </div>
<h1 class="text-center pt-4 w-fit font-20px">{{videobooks.title}}</h1> <h1 class="text-center pt-4 w-fit font-20px">{{videobooks.title}}</h1>
@ -45,7 +45,7 @@
<div v-for="videobooks in vbfmath" :key="vbfmath.id" class="grid"> <div v-for="videobooks in vbfmath" :key="vbfmath.id" class="grid">
<div class="grid place-items-center"> <div class="grid place-items-center">
<div class="flex rounded-tl-xl rounded-br-xl bg-gray-200 rotate-6"> <div class="flex rounded-tl-xl rounded-br-xl bg-gray-200 rotate-6">
<img class="-rotate-6 rounded-tl-xl rounded-br-xl" v-if="videobooks.img" :src="'https://curriculum-app-api.beanstalkedu.com/assets/'+ videobooks.img" alt=""/> <img class="-rotate-6 rounded-tl-xl rounded-br-xl" v-if="videobooks.img" :src="'https://management.beanstalkedu.com/assets/'+ videobooks.img" alt=""/>
<img class="absolute inset-24 lg:inset-16 left-36 lg:left-24 w-16" src="/img/svg/play.svg" alt=""/> <img class="absolute inset-24 lg:inset-16 left-36 lg:left-24 w-16" src="/img/svg/play.svg" alt=""/>
</div> </div>
<h1 class="text-center pt-4 w-fit">{{videobooks.title}}</h1> <h1 class="text-center pt-4 w-fit">{{videobooks.title}}</h1>
@ -155,13 +155,13 @@ export default {
} }
}, },
mounted: function () { mounted: function () {
fetch('https://curriculum-app-api.beanstalkedu.com/items/video_book?filter[category][_eq]=mathematics') fetch('https://management.beanstalkedu.com/items/video_book?filter[category][_eq]=mathematics')
.then(resp => resp.json()) .then(resp => resp.json())
.then(videobooks => { .then(videobooks => {
this.vbmath=videobooks.data this.vbmath=videobooks.data
// console.log(this.vbmath) // console.log(this.vbmath)
}) })
fetch('https://curriculum-app-api.beanstalkedu.com/items/video_book?filter[category][_eq]=mathematics&limit=5') fetch('https://management.beanstalkedu.com/items/video_book?filter[category][_eq]=mathematics&limit=5')
.then(resp => resp.json()) .then(resp => resp.json())
.then(videobooks => { .then(videobooks => {
this.vbfmath=videobooks.data this.vbfmath=videobooks.data

8
src/components/Video-world.vue
View File

@ -25,7 +25,7 @@
<div @click="showYtModal(videobooks.youtube_id)"> <div @click="showYtModal(videobooks.youtube_id)">
<div class="grid place-items-center"> <div class="grid place-items-center">
<div class="relative rounded-tl-xl rounded-br-xl bg-gray-200 rotate-6"> <div class="relative rounded-tl-xl rounded-br-xl bg-gray-200 rotate-6">
<img class="w-96 relative -rotate-6 rounded-tl-xl rounded-br-xl cursor-pointer" v-if="videobooks.img" :src="'https://curriculum-app-api.beanstalkedu.com/assets/'+ videobooks.img" alt=""/> <img class="w-96 relative -rotate-6 rounded-tl-xl rounded-br-xl cursor-pointer" v-if="videobooks.img" :src="'https://management.beanstalkedu.com/assets/'+ videobooks.img" alt=""/>
<img class="absolute inset-24 lg:inset-16 left-36 lg:left-24 w-16 cursor-pointer" src="/img/svg/play.svg" alt=""> <img class="absolute inset-24 lg:inset-16 left-36 lg:left-24 w-16 cursor-pointer" src="/img/svg/play.svg" alt="">
</div> </div>
<h1 class="text-center pt-4 w-fit font-20px">{{videobooks.title}}</h1> <h1 class="text-center pt-4 w-fit font-20px">{{videobooks.title}}</h1>
@ -45,7 +45,7 @@
<div v-for="videobooks in wbfworld" :key="wbfworld.id" class="grid"> <div v-for="videobooks in wbfworld" :key="wbfworld.id" class="grid">
<div class="grid place-items-center"> <div class="grid place-items-center">
<div class="flex rounded-tl-xl rounded-br-xl bg-gray-200 rotate-6"> <div class="flex rounded-tl-xl rounded-br-xl bg-gray-200 rotate-6">
<img class="-rotate-6 rounded-tl-xl rounded-br-xl" v-if="videobooks.img" :src="'https://curriculum-app-api.beanstalkedu.com/assets/'+ videobooks.img" alt=""/> <img class="-rotate-6 rounded-tl-xl rounded-br-xl" v-if="videobooks.img" :src="'https://management.beanstalkedu.com/assets/'+ videobooks.img" alt=""/>
<img class="absolute inset-24 lg:inset-16 left-36 lg:left-24 w-16" src="/img/svg/play.svg" alt=""/> <img class="absolute inset-24 lg:inset-16 left-36 lg:left-24 w-16" src="/img/svg/play.svg" alt=""/>
</div> </div>
<h1 class="text-center pt-4 w-fit">{{videobooks.title}}</h1> <h1 class="text-center pt-4 w-fit">{{videobooks.title}}</h1>
@ -152,13 +152,13 @@ export default {
} }
}, },
mounted: function () { mounted: function () {
fetch('https://curriculum-app-api.beanstalkedu.com/items/video_book?filter[category][_eq]=world') fetch('https://management.beanstalkedu.com/items/video_book?filter[category][_eq]=world')
.then(resp => resp.json()) .then(resp => resp.json())
.then(videobooks => { .then(videobooks => {
this.vbworld=videobooks.data this.vbworld=videobooks.data
// console.log(this.vbworld) // console.log(this.vbworld)
}) })
fetch('https://curriculum-app-api.beanstalkedu.com/items/video_book?filter[category][_eq]=world&limit=5') fetch('https://management.beanstalkedu.com/items/video_book?filter[category][_eq]=world&limit=5')
.then(resp => resp.json()) .then(resp => resp.json())
.then(videobooks => { .then(videobooks => {
this.wbfworld=videobooks.data this.wbfworld=videobooks.data

14
src/components/Videos.vue
View File

@ -58,7 +58,7 @@
<div @click="showYtModal(videobooks.youtube_id)"> <div @click="showYtModal(videobooks.youtube_id)">
<div class="grid place-items-center"> <div class="grid place-items-center">
<div class=" relative bg-gray-200 -rotate-6 rounded-tl-xl rounded-br-xl"> <div class=" relative bg-gray-200 -rotate-6 rounded-tl-xl rounded-br-xl">
<img class="w-96 rotate-6 rounded-tl-xl rounded-br-xl shadow-xl" v-if="videobooks.img" :src="'https://curriculum-app-api.beanstalkedu.com/assets/'+ videobooks.img" alt=""/> <img class="w-96 rotate-6 rounded-tl-xl rounded-br-xl shadow-xl" v-if="videobooks.img" :src="'https://management.beanstalkedu.com/assets/'+ videobooks.img" alt=""/>
<img class="absolute inset-24 lg:inset-16 left-36 lg:left-24 w-16 rotate-6" src="/img/svg/play.svg" alt=""> <img class="absolute inset-24 lg:inset-16 left-36 lg:left-24 w-16 rotate-6" src="/img/svg/play.svg" alt="">
</div> </div>
<h1 class="pt-4 w-fit font-20px">{{videobooks.title}}</h1> <h1 class="pt-4 w-fit font-20px">{{videobooks.title}}</h1>
@ -85,7 +85,7 @@
<div @click="showYtModal(videobooks.youtube_id)"> <div @click="showYtModal(videobooks.youtube_id)">
<div class="grid place-items-center"> <div class="grid place-items-center">
<div class=" relative bg-gray-200 -rotate-6 rounded-tl-xl rounded-br-xl"> <div class=" relative bg-gray-200 -rotate-6 rounded-tl-xl rounded-br-xl">
<img class="w-96 rotate-6 rounded-tl-xl rounded-br-xl shadow-xl" v-if="videobooks.img" :src="'https://curriculum-app-api.beanstalkedu.com/assets/'+ videobooks.img" alt=""/> <img class="w-96 rotate-6 rounded-tl-xl rounded-br-xl shadow-xl" v-if="videobooks.img" :src="'https://management.beanstalkedu.com/assets/'+ videobooks.img" alt=""/>
<img class="absolute inset-24 lg:inset-16 left-36 lg:left-24 w-16 rotate-6" src="/img/svg/play.svg" alt=""> <img class="absolute inset-24 lg:inset-16 left-36 lg:left-24 w-16 rotate-6" src="/img/svg/play.svg" alt="">
</div> </div>
<h1 class="pt-4 w-fit font-20px">{{videobooks.title}}</h1> <h1 class="pt-4 w-fit font-20px">{{videobooks.title}}</h1>
@ -112,7 +112,7 @@
<div @click="showYtModal(videobooks.youtube_id)"> <div @click="showYtModal(videobooks.youtube_id)">
<div class="grid place-items-center"> <div class="grid place-items-center">
<div class=" relative bg-gray-200 -rotate-6 rounded-tl-xl rounded-br-xl"> <div class=" relative bg-gray-200 -rotate-6 rounded-tl-xl rounded-br-xl">
<img class="w-96 rotate-6 rounded-tl-xl rounded-br-xl shadow-xl" v-if="videobooks.img" :src="'https://curriculum-app-api.beanstalkedu.com/assets/'+ videobooks.img" alt=""/> <img class="w-96 rotate-6 rounded-tl-xl rounded-br-xl shadow-xl" v-if="videobooks.img" :src="'https://management.beanstalkedu.com/assets/'+ videobooks.img" alt=""/>
<img class="absolute inset-24 lg:inset-16 left-36 lg:left-24 w-16 rotate-6" src="/img/svg/play.svg" alt=""> <img class="absolute inset-24 lg:inset-16 left-36 lg:left-24 w-16 rotate-6" src="/img/svg/play.svg" alt="">
</div> </div>
<h1 class="pt-4 w-fit font-20px">{{videobooks.title}}</h1> <h1 class="pt-4 w-fit font-20px">{{videobooks.title}}</h1>
@ -148,7 +148,7 @@
<div v-for="worksheet in videobooks" :key="videobooks.id" class="grid"> <div v-for="worksheet in videobooks" :key="videobooks.id" class="grid">
<div class="grid place-items-center"> <div class="grid place-items-center">
<div class="bg-gray-200 w-56 h-72 relative -rotate-6 rounded-tl-xl rounded-br-xl shadow-xl"> <div class="bg-gray-200 w-56 h-72 relative -rotate-6 rounded-tl-xl rounded-br-xl shadow-xl">
<img class="w-56 h-72 rotate-6 relative" v-if="worksheet.img" :src="'https://curriculum-app-api.beanstalkedu.com/assets/'+ worksheet.img" alt=""/> <img class="w-56 h-72 rotate-6 relative" v-if="worksheet.img" :src="'https://management.beanstalkedu.com/assets/'+ worksheet.img" alt=""/>
</div> </div>
<h1 class="text-center pt-8 ">{{ worksheet.title}}</h1> <h1 class="text-center pt-8 ">{{ worksheet.title}}</h1>
<button class=" bg-blue-700 p-1 text-white pl-4 pr-4 rounded-tl-lg rounded-br-lg ml-6 mt-8"><img class="w-5 pr-1 inline" src="/img/download.png" alt="">Download</button> <button class=" bg-blue-700 p-1 text-white pl-4 pr-4 rounded-tl-lg rounded-br-lg ml-6 mt-8"><img class="w-5 pr-1 inline" src="/img/download.png" alt="">Download</button>
@ -222,19 +222,19 @@ export default {
// this.selected = event.target.value; // this.selected = event.target.value;
}, },
getVideos(age=2){ getVideos(age=2){
fetch('https://curriculum-app-api.beanstalkedu.com/items/video_book?filter[category][_eq]=literacy') fetch('https://management.beanstalkedu.com/items/video_book?filter[category][_eq]=literacy')
.then(resp => resp.json()) .then(resp => resp.json())
.then(videobooks => { .then(videobooks => {
this.vbliteracy=videobooks.data.reverse().slice(0, 3) this.vbliteracy=videobooks.data.reverse().slice(0, 3)
console.log(this.vbliteracy) console.log(this.vbliteracy)
}) })
fetch('https://curriculum-app-api.beanstalkedu.com/items/video_book?filter[category][_eq]=mathematics') fetch('https://management.beanstalkedu.com/items/video_book?filter[category][_eq]=mathematics')
.then(resp => resp.json()) .then(resp => resp.json())
.then(videobooks => { .then(videobooks => {
this.vbmath=videobooks.data.reverse().slice(0, 3) this.vbmath=videobooks.data.reverse().slice(0, 3)
// console.log(this.vbmath) // console.log(this.vbmath)
}) })
fetch('https://curriculum-app-api.beanstalkedu.com/items/video_book?filter[category][_eq]=world') fetch('https://management.beanstalkedu.com/items/video_book?filter[category][_eq]=world')
.then(resp => resp.json()) .then(resp => resp.json())
.then(videobooks => { .then(videobooks => {
this.vbworld=videobooks.data.reverse().slice(0, 3) this.vbworld=videobooks.data.reverse().slice(0, 3)

6
src/components/Weeklyplan.vue
View File

@ -31,7 +31,7 @@
<!-- <div class="grid h-80 w-64 border-4 place-items-center"> <!-- <div class="grid h-80 w-64 border-4 place-items-center">
<a href=""><img class="" src="/img/svg/plus.svg" alt=""> <a href=""><img class="" src="/img/svg/plus.svg" alt="">
<h1 class="text-center">Add New Plan</h1></a></div> --> <h1 class="text-center">Add New Plan</h1></a></div> -->
<div class="grid gap-4"><img class="w-96 h-6/6 cursor-pointer" v-if="lessonplan.lesson_icon" :src="'https://curriculum-app-api.beanstalkedu.com/assets/'+ lessonplan.lesson_icon" alt=""/></div> <div class="grid gap-4"><img class="w-96 h-6/6 cursor-pointer" v-if="lessonplan.lesson_icon" :src="'https://management.beanstalkedu.com/assets/'+ lessonplan.lesson_icon" alt=""/></div>
</div> </div>
<!-- <div class="grid h-72 w-64 border-4"><img class="h-80 w-64" src="/img/lessonplan.jpg" alt=""/></div> <!-- <div class="grid h-72 w-64 border-4"><img class="h-80 w-64" src="/img/lessonplan.jpg" alt=""/></div>
<div class="grid h-72 w-64 border-4"><img class="h-80 w-64" src="/img/lessonplan.jpg" alt=""/></div> --> <div class="grid h-72 w-64 border-4"><img class="h-80 w-64" src="/img/lessonplan.jpg" alt=""/></div> -->
@ -44,7 +44,7 @@
<div class="modal-content"> <div class="modal-content">
<span @click="hideLpModal" class="close text-4xl font-bold cursor-pointer text-gray-200 border-2 rounded-full p-1">X</span> <span @click="hideLpModal" class="close text-4xl font-bold cursor-pointer text-gray-200 border-2 rounded-full p-1">X</span>
<div> <div>
<img width="540" :src="'https://curriculum-app-api.beanstalkedu.com/assets/'+ file" alt=""/> <img width="540" :src="'https://management.beanstalkedu.com/assets/'+ file" alt=""/>
</div> </div>
</div> </div>
</div> </div>
@ -83,7 +83,7 @@ export default {
} }
}, },
mounted: function () { mounted: function () {
fetch('https://curriculum-app-api.beanstalkedu.com/items/lesson_plan?filter[plan][_eq]=weekly') fetch('https://management.beanstalkedu.com/items/lesson_plan?filter[plan][_eq]=weekly')
.then(resp => resp.json()) .then(resp => resp.json())
.then(data => { .then(data => {
this.weeklyplan=data.data this.weeklyplan=data.data

10
src/components/Worksheets-literacy.vue
View File

@ -33,10 +33,10 @@
<div v-for="worksheet in wsLiteracy" :key="wsLiteracy.id" class="grid"> <div v-for="worksheet in wsLiteracy" :key="wsLiteracy.id" class="grid">
<div class="grid place-items-center"> <div class="grid place-items-center">
<div class="bg-gray-200 w-56 h-72 relative -rotate-6 rounded-tl-xl rounded-br-xl shadow-xl"> <div class="bg-gray-200 w-56 h-72 relative -rotate-6 rounded-tl-xl rounded-br-xl shadow-xl">
<img class="w-56 h-72 rotate-6 relative" v-if="worksheet.img" :src="'https://curriculum-app-api.beanstalkedu.com/assets/'+ worksheet.img" alt=""/> <img class="w-56 h-72 rotate-6 relative" v-if="worksheet.img" :src="'https://management.beanstalkedu.com/assets/'+ worksheet.img" alt=""/>
</div> </div>
<h1 class="text-center pt-8 w-fit">{{worksheet.title}}</h1> <h1 class="text-center pt-8 w-fit">{{worksheet.title}}</h1>
<!-- <a :href="'https://curriculum-app-api.beanstalkedu.com/assets/'+ worksheet.file+'?download'" class="bg-blue-700 p-1 text-white pl-4 pr-4 rounded-tl-lg rounded-br-lg ml-6 mt-8"><img class="w-5 pr-1 inline" src="/img/download.png" alt="">Download</a> --> <!-- <a :href="'https://management.beanstalkedu.com/assets/'+ worksheet.file+'?download'" class="bg-blue-700 p-1 text-white pl-4 pr-4 rounded-tl-lg rounded-br-lg ml-6 mt-8"><img class="w-5 pr-1 inline" src="/img/download.png" alt="">Download</a> -->
</div> </div>
</div> </div>
@ -52,7 +52,7 @@
<div v-for="worksheet in wsfLiteracy" :key="wsfLiteracy.id" class="grid"> <div v-for="worksheet in wsfLiteracy" :key="wsfLiteracy.id" class="grid">
<div class="grid place-items-center"> <div class="grid place-items-center">
<div class="bg-gray-200 w-56 h-72 relative -rotate-6 rounded-tl-xl rounded-br-xl shadow-xl"> <div class="bg-gray-200 w-56 h-72 relative -rotate-6 rounded-tl-xl rounded-br-xl shadow-xl">
<img class="w-56 h-72 rotate-6 relative" v-if="worksheet.img" :src="'https://curriculum-app-api.beanstalkedu.com/assets/'+ worksheet.img" alt=""/> <img class="w-56 h-72 rotate-6 relative" v-if="worksheet.img" :src="'https://management.beanstalkedu.com/assets/'+ worksheet.img" alt=""/>
</div> </div>
<h1 class="text-center pt-8 w-fit">{{worksheet.title}}</h1> <h1 class="text-center pt-8 w-fit">{{worksheet.title}}</h1>
<button class="bg-blue-700 p-1 text-white pl-4 pr-4 rounded-tl-lg rounded-br-lg ml-6 mt-8 "><img class="w-5 pr-1 inline" src="/img/download.png" alt="">Download</button> <button class="bg-blue-700 p-1 text-white pl-4 pr-4 rounded-tl-lg rounded-br-lg ml-6 mt-8 "><img class="w-5 pr-1 inline" src="/img/download.png" alt="">Download</button>
@ -131,13 +131,13 @@ export default {
// this.selected = event.target.value; // this.selected = event.target.value;
}, },
getWorksheets(age=2){ getWorksheets(age=2){
fetch('https://curriculum-app-api.beanstalkedu.com/items/worksheet_menu?filter[age][_eq]='+age+'&filter[Category][_eq]=literacy') fetch('https://management.beanstalkedu.com/items/worksheet_menu?filter[age][_eq]='+age+'&filter[Category][_eq]=literacy')
.then(resp => resp.json()) .then(resp => resp.json())
.then(worksheets => { .then(worksheets => {
this.wsLiteracy=worksheets.data.reverse().slice(0, 4) this.wsLiteracy=worksheets.data.reverse().slice(0, 4)
// console.log(this.wsLiteracy) // console.log(this.wsLiteracy)
}) })
fetch('https://curriculum-app-api.beanstalkedu.com/items/worksheet_menu?filter[age][_eq]='+age+'&filter[Category][_eq]=literacy') fetch('https://management.beanstalkedu.com/items/worksheet_menu?filter[age][_eq]='+age+'&filter[Category][_eq]=literacy')
.then(resp => resp.json()) .then(resp => resp.json())
.then(worksheets => { .then(worksheets => {
this.wsfLiteracy=worksheets.data.reverse().slice(4, 16) this.wsfLiteracy=worksheets.data.reverse().slice(4, 16)

10
src/components/Worksheets-mathematics.vue
View File

@ -33,10 +33,10 @@
<div v-for="worksheet in wsmath" :key="wsmath.id" class="grid"> <div v-for="worksheet in wsmath" :key="wsmath.id" class="grid">
<div class="grid place-items-center"> <div class="grid place-items-center">
<div class="bg-gray-200 w-56 h-72 relative -rotate-6 rounded-tl-xl rounded-br-xl shadow-xl"> <div class="bg-gray-200 w-56 h-72 relative -rotate-6 rounded-tl-xl rounded-br-xl shadow-xl">
<img class="w-56 h-72 rotate-6 relative" v-if="worksheet.img" :src="'https://curriculum-app-api.beanstalkedu.com/assets/'+ worksheet.img" alt=""/> <img class="w-56 h-72 rotate-6 relative" v-if="worksheet.img" :src="'https://management.beanstalkedu.com/assets/'+ worksheet.img" alt=""/>
</div> </div>
<h1 class="text-center pt-8 w-fit">{{worksheet.title}}</h1> <h1 class="text-center pt-8 w-fit">{{worksheet.title}}</h1>
<a :href="'https://curriculum-app-api.beanstalkedu.com/assets/'+ worksheet.file+'?download'" class="bg-blue-700 p-1 text-white pl-4 pr-4 rounded-tl-lg rounded-br-lg ml-6 mt-8"><img class="w-5 pr-1 inline" src="/img/download.png" alt="">Download</a> <a :href="'https://management.beanstalkedu.com/assets/'+ worksheet.file+'?download'" class="bg-blue-700 p-1 text-white pl-4 pr-4 rounded-tl-lg rounded-br-lg ml-6 mt-8"><img class="w-5 pr-1 inline" src="/img/download.png" alt="">Download</a>
</div> </div>
</div> </div>
@ -52,7 +52,7 @@
<div v-for="worksheet in wsfmath" :key="wsfmath.id" class="grid"> <div v-for="worksheet in wsfmath" :key="wsfmath.id" class="grid">
<div class="grid place-items-center"> <div class="grid place-items-center">
<div class="bg-gray-200 w-56 h-72 relative -rotate-6 rounded-tl-xl rounded-br-xl shadow-xl"> <div class="bg-gray-200 w-56 h-72 relative -rotate-6 rounded-tl-xl rounded-br-xl shadow-xl">
<img class="w-56 h-72 rotate-6 relative" v-if="worksheet.img" :src="'https://curriculum-app-api.beanstalkedu.com/assets/'+ worksheet.img" alt=""/> <img class="w-56 h-72 rotate-6 relative" v-if="worksheet.img" :src="'https://management.beanstalkedu.com/assets/'+ worksheet.img" alt=""/>
</div> </div>
<h1 class="text-center pt-8 w-fit">{{worksheet.title}}</h1> <h1 class="text-center pt-8 w-fit">{{worksheet.title}}</h1>
<button class="bg-blue-700 p-1 text-white pl-4 pr-4 rounded-tl-lg rounded-br-lg ml-6 mt-8 "><img class="w-5 pr-1 inline" src="/img/download.png" alt="">Download</button> <button class="bg-blue-700 p-1 text-white pl-4 pr-4 rounded-tl-lg rounded-br-lg ml-6 mt-8 "><img class="w-5 pr-1 inline" src="/img/download.png" alt="">Download</button>
@ -135,13 +135,13 @@ export default {
// this.selected = event.target.value; // this.selected = event.target.value;
}, },
getWorksheets(age=2){ getWorksheets(age=2){
fetch('https://curriculum-app-api.beanstalkedu.com/items/worksheet_menu?filter[age][_eq]='+age+'&filter[Category][_eq]=mathematics') fetch('https://management.beanstalkedu.com/items/worksheet_menu?filter[age][_eq]='+age+'&filter[Category][_eq]=mathematics')
.then(resp => resp.json()) .then(resp => resp.json())
.then(worksheets => { .then(worksheets => {
this.wsmath=worksheets.data.reverse().slice(0, 4) this.wsmath=worksheets.data.reverse().slice(0, 4)
// console.log(this.wsLiteracy) // console.log(this.wsLiteracy)
}) })
fetch('https://curriculum-app-api.beanstalkedu.com/items/worksheet_menu?filter[age][_eq]='+age+'&filter[Category][_eq]=mathematics') fetch('https://management.beanstalkedu.com/items/worksheet_menu?filter[age][_eq]='+age+'&filter[Category][_eq]=mathematics')
.then(resp => resp.json()) .then(resp => resp.json())
.then(worksheets => { .then(worksheets => {
this.wsfmath=worksheets.data.reverse().slice(4, 16) this.wsfmath=worksheets.data.reverse().slice(4, 16)

10
src/components/Worksheets-world.vue
View File

@ -33,10 +33,10 @@
<div v-for="worksheet in wsWorld" :key="wsWorld.id" class="grid"> <div v-for="worksheet in wsWorld" :key="wsWorld.id" class="grid">
<div class="grid place-items-center"> <div class="grid place-items-center">
<div class="bg-gray-200 w-56 h-72 relative -rotate-6 rounded-tl-xl rounded-br-xl shadow-xl"> <div class="bg-gray-200 w-56 h-72 relative -rotate-6 rounded-tl-xl rounded-br-xl shadow-xl">
<img class="w-56 h-72 rotate-6 relative" v-if="worksheet.img" :src="'https://curriculum-app-api.beanstalkedu.com/assets/'+ worksheet.img" alt=""/> <img class="w-56 h-72 rotate-6 relative" v-if="worksheet.img" :src="'https://management.beanstalkedu.com/assets/'+ worksheet.img" alt=""/>
</div> </div>
<h1 class="text-center pt-8 w-fit">{{worksheet.title}}</h1> <h1 class="text-center pt-8 w-fit">{{worksheet.title}}</h1>
<a :href="'https://curriculum-app-api.beanstalkedu.com/assets/'+ worksheet.file+'?download'" class="bg-blue-700 p-1 text-white pl-4 pr-4 rounded-tl-lg rounded-br-lg ml-6 mt-8"><img class="w-5 pr-1 inline" src="/img/download.png" alt="">Download</a> <a :href="'https://management.beanstalkedu.com/assets/'+ worksheet.file+'?download'" class="bg-blue-700 p-1 text-white pl-4 pr-4 rounded-tl-lg rounded-br-lg ml-6 mt-8"><img class="w-5 pr-1 inline" src="/img/download.png" alt="">Download</a>
</div> </div>
</div> </div>
@ -52,7 +52,7 @@
<div v-for="worksheet in wsfWorld" :key="wsfWorld.id" class="grid"> <div v-for="worksheet in wsfWorld" :key="wsfWorld.id" class="grid">
<div class="grid place-items-center"> <div class="grid place-items-center">
<div class="bg-gray-200 w-56 h-72 relative -rotate-6 rounded-tl-xl rounded-br-xl shadow-xl"> <div class="bg-gray-200 w-56 h-72 relative -rotate-6 rounded-tl-xl rounded-br-xl shadow-xl">
<img class="w-56 h-72 rotate-6 relative" v-if="worksheet.img" :src="'https://curriculum-app-api.beanstalkedu.com/assets/'+ worksheet.img" alt=""/> <img class="w-56 h-72 rotate-6 relative" v-if="worksheet.img" :src="'https://management.beanstalkedu.com/assets/'+ worksheet.img" alt=""/>
</div> </div>
<h1 class="text-center pt-8 w-fit">{{worksheet.title}}</h1> <h1 class="text-center pt-8 w-fit">{{worksheet.title}}</h1>
<button class="bg-blue-700 p-1 text-white pl-4 pr-4 rounded-tl-lg rounded-br-lg ml-6 mt-8 "><img class="w-5 pr-1 inline" src="/img/download.png" alt="">Download</button> <button class="bg-blue-700 p-1 text-white pl-4 pr-4 rounded-tl-lg rounded-br-lg ml-6 mt-8 "><img class="w-5 pr-1 inline" src="/img/download.png" alt="">Download</button>
@ -133,13 +133,13 @@ export default {
// this.selected = event.target.value; // this.selected = event.target.value;
}, },
getWorksheets(age=2){ getWorksheets(age=2){
fetch('https://curriculum-app-api.beanstalkedu.com/items/worksheet_menu?filter[age][_eq]='+age+'&filter[Category][_eq]=world') fetch('https://management.beanstalkedu.com/items/worksheet_menu?filter[age][_eq]='+age+'&filter[Category][_eq]=world')
.then(resp => resp.json()) .then(resp => resp.json())
.then(worksheets => { .then(worksheets => {
this.wsWorld=worksheets.data.reverse().slice(0, 4) this.wsWorld=worksheets.data.reverse().slice(0, 4)
// console.log(this.wsLiteracy) // console.log(this.wsLiteracy)
}) })
fetch('https://curriculum-app-api.beanstalkedu.com/items/worksheet_menu?filter[age][_eq]='+age+'&filter[Category][_eq]=world') fetch('https://management.beanstalkedu.com/items/worksheet_menu?filter[age][_eq]='+age+'&filter[Category][_eq]=world')
.then(resp => resp.json()) .then(resp => resp.json())
.then(worksheets => { .then(worksheets => {
this.wsfWorld=worksheets.data.reverse().slice(4, 16) this.wsfWorld=worksheets.data.reverse().slice(4, 16)

22
src/components/Worksheets.vue
View File

@ -61,10 +61,10 @@
<div v-for="worksheet in wsLiteracy" :key="wsLiteracy.id" class="grid"> <div v-for="worksheet in wsLiteracy" :key="wsLiteracy.id" class="grid">
<div class="grid place-items-center"> <div class="grid place-items-center">
<div class="bg-gray-200 w-56 h-72 relative -rotate-6 rounded-tl-xl rounded-br-xl shadow-xl"> <div class="bg-gray-200 w-56 h-72 relative -rotate-6 rounded-tl-xl rounded-br-xl shadow-xl">
<img class="w-56 h-72 rotate-6 relative" v-if="worksheet.img" :src="'https://curriculum-app-api.beanstalkedu.com/assets/'+ worksheet.img" alt=""/> <img class="w-56 h-72 rotate-6 relative" v-if="worksheet.img" :src="'https://management.beanstalkedu.com/assets/'+ worksheet.img" alt=""/>
</div> </div>
<h1 class="text-center pt-8 w-fit font-20px">{{worksheet.title}}</h1> <h1 class="text-center pt-8 w-fit font-20px">{{worksheet.title}}</h1>
<a :href="'https://curriculum-app-api.beanstalkedu.com/assets/'+ worksheet.file+'?download'" class="bg-blue-700 p-1 text-white pl-4 pr-4 rounded-tl-lg rounded-br-lg ml-6 mt-8"><img class="w-5 h-4 pr-1 inline" src="/img/download.png" alt="">Download</a> <a :href="'https://management.beanstalkedu.com/assets/'+ worksheet.file+'?download'" class="bg-blue-700 p-1 text-white pl-4 pr-4 rounded-tl-lg rounded-br-lg ml-6 mt-8"><img class="w-5 h-4 pr-1 inline" src="/img/download.png" alt="">Download</a>
</div> </div>
</div> </div>
<div class="grid"> <div class="grid">
@ -94,10 +94,10 @@
<div v-for="worksheet in wsMath" :key="wsMath.id" class="grid"> <div v-for="worksheet in wsMath" :key="wsMath.id" class="grid">
<div class="grid place-items-center"> <div class="grid place-items-center">
<div class="bg-gray-200 w-56 h-72 relative -rotate-6 rounded-tl-xl rounded-br-xl shadow-xl"> <div class="bg-gray-200 w-56 h-72 relative -rotate-6 rounded-tl-xl rounded-br-xl shadow-xl">
<img class="w-56 h-72 rotate-6 relative" v-if="worksheet.img" :src="'https://curriculum-app-api.beanstalkedu.com/assets/'+ worksheet.img" alt=""/> <img class="w-56 h-72 rotate-6 relative" v-if="worksheet.img" :src="'https://management.beanstalkedu.com/assets/'+ worksheet.img" alt=""/>
</div> </div>
<h1 class="text-center pt-8 w-fit font-20px">{{ worksheet.title}}</h1> <h1 class="text-center pt-8 w-fit font-20px">{{ worksheet.title}}</h1>
<a :href="'https://curriculum-app-api.beanstalkedu.com/assets/'+ worksheet.file+'?download'" class=" bg-blue-700 p-1 text-white pl-4 pr-4 rounded-tl-lg rounded-br-lg ml-6 mt-8"><img class="w-5 h-4 pr-1 inline" src="/img/download.png" alt="">Download</a> <a :href="'https://management.beanstalkedu.com/assets/'+ worksheet.file+'?download'" class=" bg-blue-700 p-1 text-white pl-4 pr-4 rounded-tl-lg rounded-br-lg ml-6 mt-8"><img class="w-5 h-4 pr-1 inline" src="/img/download.png" alt="">Download</a>
</div> </div>
</div> </div>
<div class="grid"> <div class="grid">
@ -119,10 +119,10 @@
<div v-for="worksheet in wsWorld" :key="wsWorld.id" class="grid"> <div v-for="worksheet in wsWorld" :key="wsWorld.id" class="grid">
<div class="grid place-items-center"> <div class="grid place-items-center">
<div class="bg-gray-200 w-56 h-72 relative -rotate-6 rounded-tl-xl rounded-br-xl shadow-xl"> <div class="bg-gray-200 w-56 h-72 relative -rotate-6 rounded-tl-xl rounded-br-xl shadow-xl">
<img class="w-56 h-72 rotate-6 relative" v-if="worksheet.img" :src="'https://curriculum-app-api.beanstalkedu.com/assets/'+ worksheet.img" alt=""/> <img class="w-56 h-72 rotate-6 relative" v-if="worksheet.img" :src="'https://management.beanstalkedu.com/assets/'+ worksheet.img" alt=""/>
</div> </div>
<h1 class="text-center pt-8 w-fit">{{ worksheet.title}}</h1> <h1 class="text-center pt-8 w-fit">{{ worksheet.title}}</h1>
<a :href="'https://curriculum-app-api.beanstalkedu.com/assets/'+ worksheet.file+'?download'" class=" bg-blue-700 p-1 text-white pl-4 pr-4 rounded-tl-lg rounded-br-lg ml-6 mt-8"><img class="w-5 h-4 pr-1 inline" src="/img/download.png" alt="">Download</a> <a :href="'https://management.beanstalkedu.com/assets/'+ worksheet.file+'?download'" class=" bg-blue-700 p-1 text-white pl-4 pr-4 rounded-tl-lg rounded-br-lg ml-6 mt-8"><img class="w-5 h-4 pr-1 inline" src="/img/download.png" alt="">Download</a>
</div> </div>
</div> </div>
<div class="grid"> <div class="grid">
@ -144,7 +144,7 @@
<div v-for="worksheet in worksheets" :key="worksheets.id" class="grid"> <div v-for="worksheet in worksheets" :key="worksheets.id" class="grid">
<div class="grid place-items-center"> <div class="grid place-items-center">
<div class="bg-gray-200 w-56 h-72 relative -rotate-6 rounded-tl-xl rounded-br-xl shadow-xl"> <div class="bg-gray-200 w-56 h-72 relative -rotate-6 rounded-tl-xl rounded-br-xl shadow-xl">
<img class="w-56 h-72 rotate-6 relative" v-if="worksheet.img" :src="'https://curriculum-app-api.beanstalkedu.com/assets/'+ worksheet.img" alt=""/> <img class="w-56 h-72 rotate-6 relative" v-if="worksheet.img" :src="'https://management.beanstalkedu.com/assets/'+ worksheet.img" alt=""/>
</div> </div>
<h1 class="text-center pt-8 ">{{ worksheet.title}}</h1> <h1 class="text-center pt-8 ">{{ worksheet.title}}</h1>
<button class=" bg-blue-700 p-1 text-white pl-4 pr-4 rounded-tl-lg rounded-br-lg ml-6 mt-8"><img class="w-5 pr-1 inline" src="/img/download.png" alt="">Download</button> <button class=" bg-blue-700 p-1 text-white pl-4 pr-4 rounded-tl-lg rounded-br-lg ml-6 mt-8"><img class="w-5 pr-1 inline" src="/img/download.png" alt="">Download</button>
@ -198,19 +198,19 @@ export default {
// this.selected = event.target.value; // this.selected = event.target.value;
}, },
getWorksheets(age=2){ getWorksheets(age=2){
fetch('https://curriculum-app-api.beanstalkedu.com/items/worksheet_menu?filter[age][_eq]='+age+'&filter[Category][_eq]=literacy') fetch('https://management.beanstalkedu.com/items/worksheet_menu?filter[age][_eq]='+age+'&filter[Category][_eq]=literacy')
.then(resp => resp.json()) .then(resp => resp.json())
.then(worksheets => { .then(worksheets => {
this.wsLiteracy=worksheets.data.reverse().slice(0, 3) this.wsLiteracy=worksheets.data.reverse().slice(0, 3)
// console.log(this.wsLiteracy) // console.log(this.wsLiteracy)
}) })
fetch('https://curriculum-app-api.beanstalkedu.com/items/worksheet_menu?filter[age][_eq]='+age+'&filter[Category][_eq]=mathematics') fetch('https://management.beanstalkedu.com/items/worksheet_menu?filter[age][_eq]='+age+'&filter[Category][_eq]=mathematics')
.then(resp => resp.json()) .then(resp => resp.json())
.then(worksheets => { .then(worksheets => {
this.wsMath=worksheets.data.reverse().slice(0, 3) this.wsMath=worksheets.data.reverse().slice(0, 3)
// console.log(this.wsMath) // console.log(this.wsMath)
}) })
fetch('https://curriculum-app-api.beanstalkedu.com/items/worksheet_menu?filter[age][_eq]='+age+'&filter[Category][_eq]=world') fetch('https://management.beanstalkedu.com/items/worksheet_menu?filter[age][_eq]='+age+'&filter[Category][_eq]=world')
.then(resp => resp.json()) .then(resp => resp.json())
.then(worksheets => { .then(worksheets => {
this.wsWorld=worksheets.data.reverse().slice(0, 3) this.wsWorld=worksheets.data.reverse().slice(0, 3)
@ -223,7 +223,7 @@ export default {
// console.log(this.faqWorksheets) // console.log(this.faqWorksheets)
}) })
// fetch('https://curriculum-app-api.beanstalkedu.com/items/worksheet_menu?limit=3') // fetch('https://management.beanstalkedu.com/items/worksheet_menu?limit=3')
// .then(resp => resp.json()) // .then(resp => resp.json())
// .then(worksheets => { // .then(worksheets => {
// this.worksheets=worksheets.data // this.worksheets=worksheets.data

6
src/pages/blog/[id].astro
View File

@ -29,7 +29,7 @@ import Footer from "../../components/Footer.vue";
<Layout title={data.data[idx].title} <Layout title={data.data[idx].title}
metaTitle={data.data[idx].meta} metaTitle={data.data[idx].meta}
description={data.data[idx].meta_description} description={data.data[idx].meta_description}
ogImg={'https://curriculum-app-api.beanstalkedu.com/assets/'+data.data[idx].img+'/'+data.data[idx].slug+'.jpg?width=1200&quality=50'} ogImg={'https://management.beanstalkedu.com/assets/'+data.data[idx].img+'/'+data.data[idx].slug+'.jpg?width=1200&quality=50'}
schema={data.data[idx].schema} > schema={data.data[idx].schema} >
<Menu/> <Menu/>
<main> <main>
@ -42,9 +42,9 @@ import Footer from "../../components/Footer.vue";
<!-- <p>{{ page[0].meta }}</p> --> <!-- <p>{{ page[0].meta }}</p> -->
<figure class=" p-4 xl:pl-20 2xl:pl-32"> <figure class=" p-4 xl:pl-20 2xl:pl-32">
<h1 class="text-3xl lg:text-4xl font-semibold text-color-1 py-4">{data.data[idx].title}</h1> <h1 class="text-3xl lg:text-4xl font-semibold text-color-1 py-4">{data.data[idx].title}</h1>
<!-- <img class="w-full" v-if="page[0].img" :src="'https://curriculum-app-api.beanstalkedu.com/assets/'+page[0].img" alt="" style="width:100%;"> --> <!-- <img class="w-full" v-if="page[0].img" :src="'https://management.beanstalkedu.com/assets/'+page[0].img" alt="" style="width:100%;"> -->
<!-- <img src="" alt="">{data.data[idx].img} --> <!-- <img src="" alt="">{data.data[idx].img} -->
<img src={ 'https://curriculum-app-api.beanstalkedu.com/assets/'+data.data[idx].img} alt="image description" style="width:100%;"/> <img src={ 'https://management.beanstalkedu.com/assets/'+data.data[idx].img} alt="image description" style="width:100%;"/>
<div class="pt-6 space-y-4"> <div class="pt-6 space-y-4">
<blockquote> <blockquote>
</blockquote> </blockquote>

2
src/pages/index.astro
View File

@ -10,7 +10,7 @@ import ModalIndexThemes from "../components/ModalIndexThemes.vue";
import ModalIndexEventIdeas from "../components/ModalIndexEventIdeas.vue"; import ModalIndexEventIdeas from "../components/ModalIndexEventIdeas.vue";
import ModalIndexVideos from "../components/ModalIndexVideos.vue"; import ModalIndexVideos from "../components/ModalIndexVideos.vue";
const faqResp = await fetch('https://curriculum-app-api.beanstalkedu.com/items/FAQ?filter[slug][_eq]=home&filter[property][_eq]=teenybeans_curriculum'); const faqResp = await fetch('https://management.beanstalkedu.com/items/FAQ?filter[slug][_eq]=home&filter[property][_eq]=teenybeans_curriculum');
const faqRespJson = await faqResp.json(); const faqRespJson = await faqResp.json();
const faqRespData = faqRespJson.data; const faqRespData = faqRespJson.data;
import Footer from "../components/Footer.vue"; import Footer from "../components/Footer.vue";

30
src/pages/occasion/index.astro
View File

@ -2,21 +2,21 @@
import Layout from "../../layouts/Layout.astro"; import Layout from "../../layouts/Layout.astro";
import Menu from "../../components/Menu.astro"; import Menu from "../../components/Menu.astro";
const response = await fetch('https://curriculum-app-api.beanstalkedu.com/items/occassion?filter[status][_eq]=published'); const response = await fetch('https://management.beanstalkedu.com/items/occassion?filter[status][_eq]=published');
const data = await response.json(); const data = await response.json();
const occassion = data.data; const occassion = data.data;
const thisOccasionID = data.data[0].id; const thisOccasionID = data.data[0].id;
const blogResp = await fetch('https://curriculum-app-api.beanstalkedu.com/items/blog?filter[category][_eq]=occassions&filter[property][_eq]=teenybeans_curriculum'); const blogResp = await fetch('https://management.beanstalkedu.com/items/blog?filter[category][_eq]=occassions&filter[property][_eq]=teenybeans_curriculum');
const blogRespJson = await blogResp.json(); const blogRespJson = await blogResp.json();
const blogRespData = blogRespJson.data.reverse().slice(0, 3); const blogRespData = blogRespJson.data.reverse().slice(0, 3);
const csResp = await fetch('https://curriculum-app-api.beanstalkedu.com/items/occassion_celebration_stories?filter[occassion_key][_in]=' + thisOccasionID); const csResp = await fetch('https://management.beanstalkedu.com/items/occassion_celebration_stories?filter[occassion_key][_in]=' + thisOccasionID);
const csRespJson = await csResp.json(); const csRespJson = await csResp.json();
const csRespData = csRespJson.data.reverse().slice(0, 4); const csRespData = csRespJson.data.reverse().slice(0, 4);
const wkstResp = await fetch('https://curriculum-app-api.beanstalkedu.com/items/occassion_worksheets?filter[occassion_key][_in]=' + thisOccasionID); const wkstResp = await fetch('https://management.beanstalkedu.com/items/occassion_worksheets?filter[occassion_key][_in]=' + thisOccasionID);
const wkstRespJson = await wkstResp.json(); const wkstRespJson = await wkstResp.json();
const wkstRespData = wkstRespJson.data.reverse().slice(0, 3); const wkstRespData = wkstRespJson.data.reverse().slice(0, 3);
const wkstRespData2 = wkstRespJson.data[3]; const wkstRespData2 = wkstRespJson.data[3];
@ -24,15 +24,15 @@ const wkstRespData2 = wkstRespJson.data[3];
import OccassionVideo from "../../components/OccassionVideo.vue"; import OccassionVideo from "../../components/OccassionVideo.vue";
import OccasionAudioBook from "../../components/OccasionAudioBook.vue"; import OccasionAudioBook from "../../components/OccasionAudioBook.vue";
const ytResp = await fetch('https://curriculum-app-api.beanstalkedu.com/items/occassion_youtube_videos?filter[occassion_key][_in]=' + thisOccasionID); const ytResp = await fetch('https://management.beanstalkedu.com/items/occassion_youtube_videos?filter[occassion_key][_in]=' + thisOccasionID);
const ytRespJson = await ytResp.json(); const ytRespJson = await ytResp.json();
const ytRespData = ytRespJson.data; const ytRespData = ytRespJson.data;
const cbsResp = await fetch('https://curriculum-app-api.beanstalkedu.com/items/blog?filter[category][_eq]=celebration_stories&filter[property][_eq]=teenybeans_curriculum'); const cbsResp = await fetch('https://management.beanstalkedu.com/items/blog?filter[category][_eq]=celebration_stories&filter[property][_eq]=teenybeans_curriculum');
const cbsRespJson = await cbsResp.json(); const cbsRespJson = await cbsResp.json();
const cbsRespData = cbsRespJson.data.reverse().slice(0, 3); const cbsRespData = cbsRespJson.data.reverse().slice(0, 3);
const faqResp = await fetch('https://curriculum-app-api.beanstalkedu.com/items/FAQ?filter[slug][_eq]=occassion&filter[property][_eq]=teenybeans_curriculum'); const faqResp = await fetch('https://management.beanstalkedu.com/items/FAQ?filter[slug][_eq]=occassion&filter[property][_eq]=teenybeans_curriculum');
const faqRespJson = await faqResp.json(); const faqRespJson = await faqResp.json();
const faqRespData = faqRespJson.data; const faqRespData = faqRespJson.data;
@ -42,7 +42,7 @@ import Footer from "../../components/Footer.vue";
<Layout title="" <Layout title=""
metaTitle="Fun and Memorable Preschool Celebration Ideas and Activities " metaTitle="Fun and Memorable Preschool Celebration Ideas and Activities "
description="Children adore parties and celebrations. Use our digital and engaging resources to educate your preschoolers with these Preschool celebration ideas." description="Children adore parties and celebrations. Use our digital and engaging resources to educate your preschoolers with these Preschool celebration ideas."
ogImg={'https://curriculum-app-api.beanstalkedu.com/assets/'+data.data[0].occassion+'/'+occassion[0].occassion_slug +'.jpg?width=1200&quality=50'} ogImg={'https://management.beanstalkedu.com/assets/'+data.data[0].occassion+'/'+occassion[0].occassion_slug +'.jpg?width=1200&quality=50'}
schema=""> schema="">
<Menu/> <Menu/>
<main> <main>
@ -57,7 +57,7 @@ import Footer from "../../components/Footer.vue";
</div> </div>
</div> </div>
<div class="flex w-fit justify-center place-items-center"> <div class="flex w-fit justify-center place-items-center">
<img class="w-fit h-fit" src={'https://curriculum-app-api.beanstalkedu.com/assets/'+data.data[0].occassion} alt={occassion[0].occassion_text }> <img class="w-fit h-fit" src={'https://management.beanstalkedu.com/assets/'+data.data[0].occassion} alt={occassion[0].occassion_text }>
</div> </div>
</div> </div>
</section> <!-- hero section Ends" --> </section> <!-- hero section Ends" -->
@ -68,7 +68,7 @@ import Footer from "../../components/Footer.vue";
{blogRespData.map((data: { title: string | undefined; date: string | undefined; slug: string | undefined; img: string | undefined; }) => {blogRespData.map((data: { title: string | undefined; date: string | undefined; slug: string | undefined; img: string | undefined; }) =>
<div class="grid w-fit" > <div class="grid w-fit" >
<img class="w-full rounded-tl-3xl rounded-br-3xl px-4" src={'https://curriculum-app-api.beanstalkedu.com/assets/'+data.img} style="width:100%; height: 205px;" alt="" > <img class="w-full rounded-tl-3xl rounded-br-3xl px-4" src={'https://management.beanstalkedu.com/assets/'+data.img} style="width:100%; height: 205px;" alt="" >
<div class="flex bg-yellow-200 absolute mt-32 lg:mt-36 ml-8 text-lg leading-tight w-14 h-14 font-semibold text-blue-700 rounded-full place-items-center text-center p-1">{ data.date}</div> <div class="flex bg-yellow-200 absolute mt-32 lg:mt-36 ml-8 text-lg leading-tight w-14 h-14 font-semibold text-blue-700 rounded-full place-items-center text-center p-1">{ data.date}</div>
<h2 class="text-color-1 text-3xl font-semibold pt-4 px-4 line-clamp-2 ">{ data.title}</h2> <h2 class="text-color-1 text-3xl font-semibold pt-4 px-4 line-clamp-2 ">{ data.title}</h2>
<div class="text-justify line-clamp-3 font-20px text-color-2 px-4 line-clamp-4" set:html="data.meta_description"></div> <div class="text-justify line-clamp-3 font-20px text-color-2 px-4 line-clamp-4" set:html="data.meta_description"></div>
@ -89,9 +89,9 @@ import Footer from "../../components/Footer.vue";
<div v-if="worksheets" class="grid place-items-center grid-cols-1 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 mt-0"> <div v-if="worksheets" class="grid place-items-center grid-cols-1 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 mt-0">
{wkstRespData.map((data: { occassion_worksheets_img: string | undefined; file: string | undefined; }) => {wkstRespData.map((data: { occassion_worksheets_img: string | undefined; file: string | undefined; }) =>
<div class="flex relative p-4"> <div class="flex relative p-4">
<img src={'https://curriculum-app-api.beanstalkedu.com/assets/'+data.occassion_worksheets_img} alt="" class="w-80 shadow-2xl rounded-tl-lg rounded-br-lg" /> <img src={'https://management.beanstalkedu.com/assets/'+data.occassion_worksheets_img} alt="" class="w-80 shadow-2xl rounded-tl-lg rounded-br-lg" />
<div class="absolute bottom-10 left-28"> <div class="absolute bottom-10 left-28">
<a href={'https://curriculum-app-api.beanstalkedu.com/assets/'+ data.file+'?download'}> <a href={'https://management.beanstalkedu.com/assets/'+ data.file+'?download'}>
<h3 class="text-center inline-block px-6 py-2.5 bg-blue-500 text-white font-medium text-xs leading-tight rounded shadow-md hover:bg-blue-400 hover:shadow-lg focus:bg-blue-600 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-blue-800 active:shadow-lg transition duration-150 ease-in-out"> Download </h3> <h3 class="text-center inline-block px-6 py-2.5 bg-blue-500 text-white font-medium text-xs leading-tight rounded shadow-md hover:bg-blue-400 hover:shadow-lg focus:bg-blue-600 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-blue-800 active:shadow-lg transition duration-150 ease-in-out"> Download </h3>
</a> </a>
</div> </div>
@ -100,7 +100,7 @@ import Footer from "../../components/Footer.vue";
<a href="/plan"> <a href="/plan">
<div class="p-4"> <div class="p-4">
<div class="flex relative"> <div class="flex relative">
<img v-if="wkst.occassion_worksheets_img" src={'https://curriculum-app-api.beanstalkedu.com/assets/'+ wkstRespData2.occassion_worksheets_img} alt="" class="w-80 shadow-2xl rounded-tl-lg rounded-br-lg" /> <img v-if="wkst.occassion_worksheets_img" src={'https://management.beanstalkedu.com/assets/'+ wkstRespData2.occassion_worksheets_img} alt="" class="w-80 shadow-2xl rounded-tl-lg rounded-br-lg" />
<div class="absolute top-40 left-24"> <div class="absolute top-40 left-24">
<h3 class="text-center inline-block px-6 py-2.5 bg-amber-500 text-white font-medium text-xs leading-tight rounded shadow-md hover:bg-amber-400 hover:shadow-lg focus:bg-amber-600 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-blue-800 active:shadow-lg transition duration-150 ease-in-out"> + Subscribe </h3> <h3 class="text-center inline-block px-6 py-2.5 bg-amber-500 text-white font-medium text-xs leading-tight rounded shadow-md hover:bg-amber-400 hover:shadow-lg focus:bg-amber-600 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-blue-800 active:shadow-lg transition duration-150 ease-in-out"> + Subscribe </h3>
<h3 class=""> &nbsp;To download <br> more resources</h3> <h3 class=""> &nbsp;To download <br> more resources</h3>
@ -121,7 +121,7 @@ import Footer from "../../components/Footer.vue";
{cbsRespData.map((data: { title: string | undefined; date: string | undefined; slug: string | undefined; img: string | undefined; }) => {cbsRespData.map((data: { title: string | undefined; date: string | undefined; slug: string | undefined; img: string | undefined; }) =>
<div class="grid w-fit" > <div class="grid w-fit" >
<img class="w-full rounded-tl-3xl rounded-br-3xl px-4" src={'https://curriculum-app-api.beanstalkedu.com/assets/'+data.img} style="width:100%; height: 205px;" alt="" > <img class="w-full rounded-tl-3xl rounded-br-3xl px-4" src={'https://management.beanstalkedu.com/assets/'+data.img} style="width:100%; height: 205px;" alt="" >
<div class="flex bg-yellow-200 absolute mt-32 lg:mt-36 ml-8 text-lg leading-tight w-14 h-14 font-semibold text-blue-700 rounded-full place-items-center text-center p-1">{ data.date}</div> <div class="flex bg-yellow-200 absolute mt-32 lg:mt-36 ml-8 text-lg leading-tight w-14 h-14 font-semibold text-blue-700 rounded-full place-items-center text-center p-1">{ data.date}</div>
<h2 class="text-color-1 text-3xl font-semibold pt-4 px-4 line-clamp-2 ">{ data.title}</h2> <h2 class="text-color-1 text-3xl font-semibold pt-4 px-4 line-clamp-2 ">{ data.title}</h2>
<div class="text-justify line-clamp-3 font-20px text-color-2 px-4 line-clamp-4" set:html="data.meta_description"></div> <div class="text-justify line-clamp-3 font-20px text-color-2 px-4 line-clamp-4" set:html="data.meta_description"></div>
@ -144,7 +144,7 @@ import Footer from "../../components/Footer.vue";
<div class="p-2"> <div class="p-2">
<a href={'https://www.youtube.com/watch?v='+data.youtube_id}> <a href={'https://www.youtube.com/watch?v='+data.youtube_id}>
<div> <div>
<img class="rounded-tl-xl rounded-br-xl" src={'https://curriculum-app-api.beanstalkedu.com/assets/'+ data.youtube_thumbnail} alt=""> <img class="rounded-tl-xl rounded-br-xl" src={'https://management.beanstalkedu.com/assets/'+ data.youtube_thumbnail} alt="">
<div class="text-center text-xl line-clamp-1 text-color-2 pt-4" >{data.about_the_video}</div> <div class="text-center text-xl line-clamp-1 text-color-2 pt-4" >{data.about_the_video}</div>
</div> </div>
</a> </a>

32
src/pages/themes/[id].astro
View File

@ -12,17 +12,17 @@ export async function getStaticPaths() {
} }
const { id } = Astro.params; const { id } = Astro.params;
const response = await fetch('https://curriculum-app-api.beanstalkedu.com/items/themes?filter[theme_slug][_eq]='+id); const response = await fetch('https://management.beanstalkedu.com/items/themes?filter[theme_slug][_eq]='+id);
const data = await response.json(); const data = await response.json();
const themes = data.data; const themes = data.data;
const thisThemesID = data.data[0].id; const thisThemesID = data.data[0].id;
const tciResp = await fetch('https://curriculum-app-api.beanstalkedu.com/items/theme_celebration_ideas?filter[theme_key][_in]=' + thisThemesID ); const tciResp = await fetch('https://management.beanstalkedu.com/items/theme_celebration_ideas?filter[theme_key][_in]=' + thisThemesID );
const tciRespJson = await tciResp.json(); const tciRespJson = await tciResp.json();
const tciRespData = tciRespJson.data.reverse().slice(0, 4); const tciRespData = tciRespJson.data.reverse().slice(0, 4);
const twsResp = await fetch('https://curriculum-app-api.beanstalkedu.com/items/theme_workshets?filter[theme_key][_in]=' + thisThemesID); const twsResp = await fetch('https://management.beanstalkedu.com/items/theme_workshets?filter[theme_key][_in]=' + thisThemesID);
const twsRespJson = await twsResp.json(); const twsRespJson = await twsResp.json();
const twsRespData = twsRespJson.data.reverse().slice(0, 3); const twsRespData = twsRespJson.data.reverse().slice(0, 3);
const twsRespData2 = twsRespJson.data[3]; const twsRespData2 = twsRespJson.data[3];
@ -30,17 +30,17 @@ const twsRespData2 = twsRespJson.data[3];
import ThemesVideos from "../../components/ThemesVideos.vue"; import ThemesVideos from "../../components/ThemesVideos.vue";
import ThemesAudioBook from "../../components/ThemesAudioBook.vue"; import ThemesAudioBook from "../../components/ThemesAudioBook.vue";
const tcsResp = await fetch('https://curriculum-app-api.beanstalkedu.com/items/theme_celebration_stories?filter[theme_key][_in]=' + thisThemesID); const tcsResp = await fetch('https://management.beanstalkedu.com/items/theme_celebration_stories?filter[theme_key][_in]=' + thisThemesID);
const tcsRespJson = await tcsResp.json(); const tcsRespJson = await tcsResp.json();
const tcsRespData = tcsRespJson.data.reverse().slice(0, 4); const tcsRespData = tcsRespJson.data.reverse().slice(0, 4);
import SubmitCelebration from "../../components/SubmitCelebration.vue"; import SubmitCelebration from "../../components/SubmitCelebration.vue";
const ytvResp = await fetch('https://curriculum-app-api.beanstalkedu.com/items/theme_youtube_videos?filter[theme_key][_in]=' + thisThemesID); const ytvResp = await fetch('https://management.beanstalkedu.com/items/theme_youtube_videos?filter[theme_key][_in]=' + thisThemesID);
const ytvRespJson = await ytvResp.json(); const ytvRespJson = await ytvResp.json();
const ytvRespData = ytvRespJson.data.reverse(); const ytvRespData = ytvRespJson.data.reverse();
const allthemesResp = await fetch('https://curriculum-app-api.beanstalkedu.com/items/themes?limit=3&filter[id][_neq]=' + thisThemesID); const allthemesResp = await fetch('https://management.beanstalkedu.com/items/themes?limit=3&filter[id][_neq]=' + thisThemesID);
const allthemesRespJson = await allthemesResp.json(); const allthemesRespJson = await allthemesResp.json();
const allthemesRespData = allthemesRespJson.data; const allthemesRespData = allthemesRespJson.data;
@ -53,7 +53,7 @@ import Footer from "../../components/Footer.vue";
<Layout title="" <Layout title=""
metaTitle="Best Preschool Themes for making Learning fun and worthwhile" metaTitle="Best Preschool Themes for making Learning fun and worthwhile"
description="The most popular preschool themes around the world. Choose the best theme for your preschooler or preschool class from a variety of options." description="The most popular preschool themes around the world. Choose the best theme for your preschooler or preschool class from a variety of options."
ogImg={'https://curriculum-app-api.beanstalkedu.com/assets/'+themes[0].theme_hero_img} ogImg={'https://management.beanstalkedu.com/assets/'+themes[0].theme_hero_img}
schema="" > schema="" >
<Menu clint:visible/> <Menu clint:visible/>
<main> <main>
@ -69,7 +69,7 @@ import Footer from "../../components/Footer.vue";
</div> </div>
<div class="flex w-fit justify-center place-items-center"> <div class="flex w-fit justify-center place-items-center">
<!-- <img class="w-full h-fit drop-shadow-2xl rounded-3xl py-4 cursor-none" src="/img/occassion1.png" alt=""> --> <!-- <img class="w-full h-fit drop-shadow-2xl rounded-3xl py-4 cursor-none" src="/img/occassion1.png" alt=""> -->
<img class="w-fit h-fit" src={'https://curriculum-app-api.beanstalkedu.com/assets/'+themes[0].theme_hero_img} alt={themes[0].theme_title}> <img class="w-fit h-fit" src={'https://management.beanstalkedu.com/assets/'+themes[0].theme_hero_img} alt={themes[0].theme_title}>
</div> </div>
</div> </div>
</section> </section>
@ -80,13 +80,13 @@ import Footer from "../../components/Footer.vue";
<div v-if="ideas" class="grid place-items-center grid-cols-1 md:grid-cols-2 xl:grid-cols-3 2xl:grid-cols-4 "> <div v-if="ideas" class="grid place-items-center grid-cols-1 md:grid-cols-2 xl:grid-cols-3 2xl:grid-cols-4 ">
{tciRespData.map((data: { celebration_ideas_img: string | undefined; celebration_ideas_title: string | undefined; celebration_ideas_body_text: string | undefined; title: string | undefined; }) => {tciRespData.map((data: { celebration_ideas_img: string | undefined; celebration_ideas_title: string | undefined; celebration_ideas_body_text: string | undefined; title: string | undefined; }) =>
<div class="flex relative"> <div class="flex relative">
<img v-if="ida.celebration_ideas_img" src={'https://curriculum-app-api.beanstalkedu.com/assets/'+data.celebration_ideas_img} alt="" class="pt-4 rounded-tl-xl rounded-br-xl shadow-xl" /> <img v-if="ida.celebration_ideas_img" src={'https://management.beanstalkedu.com/assets/'+data.celebration_ideas_img} alt="" class="pt-4 rounded-tl-xl rounded-br-xl shadow-xl" />
<div class="absolute top-10 left-8 text-2xl text-color-1 font-semibold">{data.celebration_ideas_title} <div class="absolute top-10 left-8 text-2xl text-color-1 font-semibold">{data.celebration_ideas_title}
</div> </div>
<div class="absolute top-16 py-3 left-8 text-xl text-color-2">{data.celebration_ideas_body_text} <div class="absolute top-16 py-3 left-8 text-xl text-color-2">{data.celebration_ideas_body_text}
</div> </div>
<div class="absolute bottom-10 left-32 md:left-28"> <div class="absolute bottom-10 left-32 md:left-28">
<a href={'https://curriculum-app-api.beanstalkedu.com/assets/'+data.celebration_ideas_img+'?download'}> <a href={'https://management.beanstalkedu.com/assets/'+data.celebration_ideas_img+'?download'}>
<h3 class="text-center inline-block px-5 py-2.5 bg-blue-500 text-white font-medium text-base leading-tight rounded shadow-md hover:bg-blue-400 hover:shadow-lg focus:bg-blue-600 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-blue-800 active:shadow-lg transition duration-150 ease-in-out"> View Now </h3> <h3 class="text-center inline-block px-5 py-2.5 bg-blue-500 text-white font-medium text-base leading-tight rounded shadow-md hover:bg-blue-400 hover:shadow-lg focus:bg-blue-600 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-blue-800 active:shadow-lg transition duration-150 ease-in-out"> View Now </h3>
</a> </a>
</div> </div>
@ -101,9 +101,9 @@ import Footer from "../../components/Footer.vue";
<div class="grid place-items-center grid-cols-1 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 mt-6"> <div class="grid place-items-center grid-cols-1 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 mt-6">
{twsRespData.map((data: { title: string | undefined; theme_worksheets_img: string | undefined; file: string | undefined; }) => {twsRespData.map((data: { title: string | undefined; theme_worksheets_img: string | undefined; file: string | undefined; }) =>
<div class="flex relative p-4"> <div class="flex relative p-4">
<img src={'https://curriculum-app-api.beanstalkedu.com/assets/'+data.theme_worksheets_img} alt="" class="w-80 shadow-2xl rounded-tl-lg rounded-br-lg" /> <img src={'https://management.beanstalkedu.com/assets/'+data.theme_worksheets_img} alt="" class="w-80 shadow-2xl rounded-tl-lg rounded-br-lg" />
<div class="absolute bottom-10 left-20"> <div class="absolute bottom-10 left-20">
<a href={'https://curriculum-app-api.beanstalkedu.com/assets/'+data.file+'?download'}> <a href={'https://management.beanstalkedu.com/assets/'+data.file+'?download'}>
<h3 class="text-center inline-block px-6 py-2.5 bg-blue-500 text-white font-medium text-base leading-tight rounded shadow-md hover:bg-blue-400 hover:shadow-lg focus:bg-blue-600 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-blue-800 active:shadow-lg transition duration-150 ease-in-out"> Download </h3> <h3 class="text-center inline-block px-6 py-2.5 bg-blue-500 text-white font-medium text-base leading-tight rounded shadow-md hover:bg-blue-400 hover:shadow-lg focus:bg-blue-600 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-blue-800 active:shadow-lg transition duration-150 ease-in-out"> Download </h3>
</a> </a>
</div> </div>
@ -113,7 +113,7 @@ import Footer from "../../components/Footer.vue";
<a href="/worksheets"> <a href="/worksheets">
<div class="p-4"> <div class="p-4">
<div class="flex relative"> <div class="flex relative">
<img v-if="wkst.theme_worksheets_img" src={'https://curriculum-app-api.beanstalkedu.com/assets/'+twsRespData2.theme_worksheets_img} alt="" class="w-80 shadow-2xl rounded-tl-lg rounded-br-lg" /> <img v-if="wkst.theme_worksheets_img" src={'https://management.beanstalkedu.com/assets/'+twsRespData2.theme_worksheets_img} alt="" class="w-80 shadow-2xl rounded-tl-lg rounded-br-lg" />
<div class="absolute top-40 left-20"> <div class="absolute top-40 left-20">
<h3 class="text-center inline-block px-6 py-2.5 bg-amber-500 text-white font-medium text-base leading-tight rounded shadow-md hover:bg-amber-400 hover:shadow-lg focus:bg-amber-600 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-blue-800 active:shadow-lg transition duration-150 ease-in-out"> + Subscribe </h3> <h3 class="text-center inline-block px-6 py-2.5 bg-amber-500 text-white font-medium text-base leading-tight rounded shadow-md hover:bg-amber-400 hover:shadow-lg focus:bg-amber-600 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-blue-800 active:shadow-lg transition duration-150 ease-in-out"> + Subscribe </h3>
<h3 class="-ml-2 absolute left-8 text-center"> &nbsp;To download <br> more resources</h3> <h3 class="-ml-2 absolute left-8 text-center"> &nbsp;To download <br> more resources</h3>
@ -132,7 +132,7 @@ import Footer from "../../components/Footer.vue";
<div class="grid place-items-center grid-cols-1 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 py-10 px-4 gap-12"> <div class="grid place-items-center grid-cols-1 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 py-10 px-4 gap-12">
{tcsRespData.map((data) => {tcsRespData.map((data) =>
<div class="flex bg-gray-200 rotate-6 rounded-tl-lg rounded-br-lg"> <div class="flex bg-gray-200 rotate-6 rounded-tl-lg rounded-br-lg">
<div class="flex -rotate-6 relative"><img src={'https://curriculum-app-api.beanstalkedu.com/assets/'+data.img} alt="" class="rounded-tl-lg rounded-br-lg" /> <div class="flex -rotate-6 relative"><img src={'https://management.beanstalkedu.com/assets/'+data.img} alt="" class="rounded-tl-lg rounded-br-lg" />
<div class="flex absolute bg-white p-2 rounded-md m-4 justify-center text-sm md:text-xl">{data.title}</div> <div class="flex absolute bg-white p-2 rounded-md m-4 justify-center text-sm md:text-xl">{data.title}</div>
<p class="absolute inset-x-0 bottom-6 text-blue-100 text-justify p-3 font-semibold rounded-br-lg line-clamp-4">{data.text}</p> <p class="absolute inset-x-0 bottom-6 text-blue-100 text-justify p-3 font-semibold rounded-br-lg line-clamp-4">{data.text}</p>
<span class="absolute inset-x-0 bottom-0 bg-gradient-to-t from-white text-justify p-3 "><a href="" class="text-blue-700 hover:font-extrabold"> <br> Read Full Storry &#62;&#62; </a></span> <span class="absolute inset-x-0 bottom-0 bg-gradient-to-t from-white text-justify p-3 "><a href="" class="text-blue-700 hover:font-extrabold"> <br> Read Full Storry &#62;&#62; </a></span>
@ -151,7 +151,7 @@ import Footer from "../../components/Footer.vue";
<div class="p-2"> <div class="p-2">
<a href={'https://www.youtube.com/watch?v='+data.youtube_id}> <a href={'https://www.youtube.com/watch?v='+data.youtube_id}>
<div> <div>
<img class="rounded-tl-xl rounded-br-xl" src={'https://curriculum-app-api.beanstalkedu.com/assets/'+data.youtube_thumbnail} alt=""> <img class="rounded-tl-xl rounded-br-xl" src={'https://management.beanstalkedu.com/assets/'+data.youtube_thumbnail} alt="">
<div class="text-center text-lg ">{data.about_the_video}</div> <div class="text-center text-lg ">{data.about_the_video}</div>
</div> </div>
</a> </a>
@ -166,7 +166,7 @@ import Footer from "../../components/Footer.vue";
{allthemesRespData.map((data: { theme_slug: string | undefined; theme_icon: string | undefined; }) => {allthemesRespData.map((data: { theme_slug: string | undefined; theme_icon: string | undefined; }) =>
<div class="grid"> <div class="grid">
<a href={'/themes/'+ data.theme_slug}> <a href={'/themes/'+ data.theme_slug}>
<img class="rounded-lg shadow-2xl" src={'https://curriculum-app-api.beanstalkedu.com/assets/' + data.theme_icon} alt=""/> <img class="rounded-lg shadow-2xl" src={'https://management.beanstalkedu.com/assets/' + data.theme_icon} alt=""/>
</a> </a>
</div> </div>
)} )}

32
src/pages/themes/index.astro
View File

@ -2,17 +2,17 @@
import Layout from "../../layouts/Layout.astro"; import Layout from "../../layouts/Layout.astro";
import Menu from "../../components/Menu.astro"; import Menu from "../../components/Menu.astro";
const response = await fetch('https://curriculum-app-api.beanstalkedu.com/items/themes?filter[status][_eq]=published'); const response = await fetch('https://management.beanstalkedu.com/items/themes?filter[status][_eq]=published');
const data = await response.json(); const data = await response.json();
const themes = data.data; const themes = data.data;
const thisThemesID = data.data[0].id; const thisThemesID = data.data[0].id;
const tciResp = await fetch('https://curriculum-app-api.beanstalkedu.com/items/theme_celebration_ideas?filter[theme_key][_in]=' + thisThemesID ); const tciResp = await fetch('https://management.beanstalkedu.com/items/theme_celebration_ideas?filter[theme_key][_in]=' + thisThemesID );
const tciRespJson = await tciResp.json(); const tciRespJson = await tciResp.json();
const tciRespData = tciRespJson.data.reverse().slice(0, 4); const tciRespData = tciRespJson.data.reverse().slice(0, 4);
const twsResp = await fetch('https://curriculum-app-api.beanstalkedu.com/items/theme_workshets?filter[theme_key][_in]=' + thisThemesID); const twsResp = await fetch('https://management.beanstalkedu.com/items/theme_workshets?filter[theme_key][_in]=' + thisThemesID);
const twsRespJson = await twsResp.json(); const twsRespJson = await twsResp.json();
const twsRespData = twsRespJson.data.reverse().slice(0, 3); const twsRespData = twsRespJson.data.reverse().slice(0, 3);
const twsRespData2 = twsRespJson.data[3]; const twsRespData2 = twsRespJson.data[3];
@ -20,17 +20,17 @@ const twsRespData2 = twsRespJson.data[3];
import ThemesVideos from "../../components/ThemesVideos.vue"; import ThemesVideos from "../../components/ThemesVideos.vue";
import ThemesAudioBook from "../../components/ThemesAudioBook.vue"; import ThemesAudioBook from "../../components/ThemesAudioBook.vue";
const tcsResp = await fetch('https://curriculum-app-api.beanstalkedu.com/items/theme_celebration_stories?filter[theme_key][_in]=' + thisThemesID); const tcsResp = await fetch('https://management.beanstalkedu.com/items/theme_celebration_stories?filter[theme_key][_in]=' + thisThemesID);
const tcsRespJson = await tcsResp.json(); const tcsRespJson = await tcsResp.json();
const tcsRespData = tcsRespJson.data.reverse().slice(0, 4); const tcsRespData = tcsRespJson.data.reverse().slice(0, 4);
import SubmitCelebration from "../../components/SubmitCelebration.vue"; import SubmitCelebration from "../../components/SubmitCelebration.vue";
const ytvResp = await fetch('https://curriculum-app-api.beanstalkedu.com/items/theme_youtube_videos?filter[theme_key][_in]=' + thisThemesID); const ytvResp = await fetch('https://management.beanstalkedu.com/items/theme_youtube_videos?filter[theme_key][_in]=' + thisThemesID);
const ytvRespJson = await ytvResp.json(); const ytvRespJson = await ytvResp.json();
const ytvRespData = ytvRespJson.data.reverse(); const ytvRespData = ytvRespJson.data.reverse();
const allthemesResp = await fetch('https://curriculum-app-api.beanstalkedu.com/items/themes?filter[status][_eq]=draft&limit=3'); const allthemesResp = await fetch('https://management.beanstalkedu.com/items/themes?filter[status][_eq]=draft&limit=3');
const allthemesRespJson = await allthemesResp.json(); const allthemesRespJson = await allthemesResp.json();
const allthemesRespData = allthemesRespJson.data; const allthemesRespData = allthemesRespJson.data;
@ -43,7 +43,7 @@ import Footer from "../../components/Footer.vue";
<Layout title="" <Layout title=""
metaTitle="Best Preschool Themes for making Learning fun and worthwhile" metaTitle="Best Preschool Themes for making Learning fun and worthwhile"
description="The most popular preschool themes around the world. Choose the best theme for your preschooler or preschool class from a variety of options." description="The most popular preschool themes around the world. Choose the best theme for your preschooler or preschool class from a variety of options."
ogImg={'https://curriculum-app-api.beanstalkedu.com/assets/'+themes[0].theme_hero_img} ogImg={'https://management.beanstalkedu.com/assets/'+themes[0].theme_hero_img}
schema="" > schema="" >
<Menu clint:visible/> <Menu clint:visible/>
<main> <main>
@ -59,7 +59,7 @@ import Footer from "../../components/Footer.vue";
</div> </div>
<div class="flex w-fit justify-center place-items-center"> <div class="flex w-fit justify-center place-items-center">
<!-- <img class="w-full h-fit drop-shadow-2xl rounded-3xl py-4 cursor-none" src="/img/occassion1.png" alt=""> --> <!-- <img class="w-full h-fit drop-shadow-2xl rounded-3xl py-4 cursor-none" src="/img/occassion1.png" alt=""> -->
<img class="w-fit h-fit" src={'https://curriculum-app-api.beanstalkedu.com/assets/'+themes[0].theme_hero_img} alt={themes[0].theme_title}> <img class="w-fit h-fit" src={'https://management.beanstalkedu.com/assets/'+themes[0].theme_hero_img} alt={themes[0].theme_title}>
</div> </div>
</div> </div>
</section> </section>
@ -70,13 +70,13 @@ import Footer from "../../components/Footer.vue";
<div v-if="ideas" class="grid place-items-center grid-cols-1 md:grid-cols-2 xl:grid-cols-3 2xl:grid-cols-4 "> <div v-if="ideas" class="grid place-items-center grid-cols-1 md:grid-cols-2 xl:grid-cols-3 2xl:grid-cols-4 ">
{tciRespData.map((data: { celebration_ideas_img: string | undefined; celebration_ideas_title: string | undefined; celebration_ideas_body_text: string | undefined; title: string | undefined; }) => {tciRespData.map((data: { celebration_ideas_img: string | undefined; celebration_ideas_title: string | undefined; celebration_ideas_body_text: string | undefined; title: string | undefined; }) =>
<div class="flex relative"> <div class="flex relative">
<img v-if="ida.celebration_ideas_img" src={'https://curriculum-app-api.beanstalkedu.com/assets/'+data.celebration_ideas_img} alt="" class="pt-4 rounded-tl-xl rounded-br-xl shadow-xl" /> <img v-if="ida.celebration_ideas_img" src={'https://management.beanstalkedu.com/assets/'+data.celebration_ideas_img} alt="" class="pt-4 rounded-tl-xl rounded-br-xl shadow-xl" />
<div class="absolute top-10 left-8 text-2xl text-color-1 font-semibold">{data.celebration_ideas_title} <div class="absolute top-10 left-8 text-2xl text-color-1 font-semibold">{data.celebration_ideas_title}
</div> </div>
<div class="absolute top-16 py-3 left-8 text-xl text-color-2">{data.celebration_ideas_body_text} <div class="absolute top-16 py-3 left-8 text-xl text-color-2">{data.celebration_ideas_body_text}
</div> </div>
<div class="absolute bottom-10 left-32 md:left-28"> <div class="absolute bottom-10 left-32 md:left-28">
<a href={'https://curriculum-app-api.beanstalkedu.com/assets/'+data.celebration_ideas_img+'?download'}> <a href={'https://management.beanstalkedu.com/assets/'+data.celebration_ideas_img+'?download'}>
<h3 class="text-center inline-block px-5 py-2.5 bg-blue-500 text-white font-medium text-base leading-tight rounded shadow-md hover:bg-blue-400 hover:shadow-lg focus:bg-blue-600 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-blue-800 active:shadow-lg transition duration-150 ease-in-out"> View Now </h3> <h3 class="text-center inline-block px-5 py-2.5 bg-blue-500 text-white font-medium text-base leading-tight rounded shadow-md hover:bg-blue-400 hover:shadow-lg focus:bg-blue-600 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-blue-800 active:shadow-lg transition duration-150 ease-in-out"> View Now </h3>
</a> </a>
</div> </div>
@ -91,9 +91,9 @@ import Footer from "../../components/Footer.vue";
<div class="grid place-items-center grid-cols-1 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 mt-6"> <div class="grid place-items-center grid-cols-1 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 mt-6">
{twsRespData.map((data: { title: string | undefined; theme_worksheets_img: string | undefined; file: string | undefined; }) => {twsRespData.map((data: { title: string | undefined; theme_worksheets_img: string | undefined; file: string | undefined; }) =>
<div class="flex relative p-4"> <div class="flex relative p-4">
<img src={'https://curriculum-app-api.beanstalkedu.com/assets/'+data.theme_worksheets_img} alt="" class="w-80 shadow-2xl rounded-tl-lg rounded-br-lg" /> <img src={'https://management.beanstalkedu.com/assets/'+data.theme_worksheets_img} alt="" class="w-80 shadow-2xl rounded-tl-lg rounded-br-lg" />
<div class="absolute bottom-10 left-20"> <div class="absolute bottom-10 left-20">
<a href={'https://curriculum-app-api.beanstalkedu.com/assets/'+data.file+'?download'}> <a href={'https://management.beanstalkedu.com/assets/'+data.file+'?download'}>
<h3 class="text-center inline-block px-6 py-2.5 bg-blue-500 text-white font-medium text-base leading-tight rounded shadow-md hover:bg-blue-400 hover:shadow-lg focus:bg-blue-600 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-blue-800 active:shadow-lg transition duration-150 ease-in-out"> Download </h3> <h3 class="text-center inline-block px-6 py-2.5 bg-blue-500 text-white font-medium text-base leading-tight rounded shadow-md hover:bg-blue-400 hover:shadow-lg focus:bg-blue-600 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-blue-800 active:shadow-lg transition duration-150 ease-in-out"> Download </h3>
</a> </a>
</div> </div>
@ -103,7 +103,7 @@ import Footer from "../../components/Footer.vue";
<a href="/worksheets"> <a href="/worksheets">
<div class="p-4"> <div class="p-4">
<div class="flex relative"> <div class="flex relative">
<img v-if="wkst.theme_worksheets_img" src={'https://curriculum-app-api.beanstalkedu.com/assets/'+twsRespData2.theme_worksheets_img} alt="" class="w-80 shadow-2xl rounded-tl-lg rounded-br-lg" /> <img v-if="wkst.theme_worksheets_img" src={'https://management.beanstalkedu.com/assets/'+twsRespData2.theme_worksheets_img} alt="" class="w-80 shadow-2xl rounded-tl-lg rounded-br-lg" />
<div class="absolute top-40 left-20"> <div class="absolute top-40 left-20">
<h3 class="text-center inline-block px-6 py-2.5 bg-amber-500 text-white font-medium text-base leading-tight rounded shadow-md hover:bg-amber-400 hover:shadow-lg focus:bg-amber-600 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-blue-800 active:shadow-lg transition duration-150 ease-in-out"> + Subscribe </h3> <h3 class="text-center inline-block px-6 py-2.5 bg-amber-500 text-white font-medium text-base leading-tight rounded shadow-md hover:bg-amber-400 hover:shadow-lg focus:bg-amber-600 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-blue-800 active:shadow-lg transition duration-150 ease-in-out"> + Subscribe </h3>
<h3 class="-ml-2 absolute left-8 text-center"> &nbsp;To download <br> more resources</h3> <h3 class="-ml-2 absolute left-8 text-center"> &nbsp;To download <br> more resources</h3>
@ -122,7 +122,7 @@ import Footer from "../../components/Footer.vue";
<div class="grid place-items-center grid-cols-1 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 py-10 px-4 gap-12"> <div class="grid place-items-center grid-cols-1 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 py-10 px-4 gap-12">
{tcsRespData.map((data) => {tcsRespData.map((data) =>
<div class="flex bg-gray-200 rotate-6 rounded-tl-lg rounded-br-lg"> <div class="flex bg-gray-200 rotate-6 rounded-tl-lg rounded-br-lg">
<div class="flex -rotate-6 relative"><img src={'https://curriculum-app-api.beanstalkedu.com/assets/'+data.img} alt="" class="rounded-tl-lg rounded-br-lg" /> <div class="flex -rotate-6 relative"><img src={'https://management.beanstalkedu.com/assets/'+data.img} alt="" class="rounded-tl-lg rounded-br-lg" />
<div class="flex absolute bg-white p-2 rounded-md m-4 justify-center text-sm md:text-xl">{data.title}</div> <div class="flex absolute bg-white p-2 rounded-md m-4 justify-center text-sm md:text-xl">{data.title}</div>
<p class="absolute inset-x-0 bottom-6 text-blue-100 text-justify p-3 font-semibold rounded-br-lg line-clamp-4">{data.text}</p> <p class="absolute inset-x-0 bottom-6 text-blue-100 text-justify p-3 font-semibold rounded-br-lg line-clamp-4">{data.text}</p>
<span class="absolute inset-x-0 bottom-0 bg-gradient-to-t from-white text-justify p-3 "><a href="" class="text-blue-700 hover:font-extrabold"> <br> Read Full Storry &#62;&#62; </a></span> <span class="absolute inset-x-0 bottom-0 bg-gradient-to-t from-white text-justify p-3 "><a href="" class="text-blue-700 hover:font-extrabold"> <br> Read Full Storry &#62;&#62; </a></span>
@ -141,7 +141,7 @@ import Footer from "../../components/Footer.vue";
<div class="p-2"> <div class="p-2">
<a href={'https://www.youtube.com/watch?v='+data.youtube_id}> <a href={'https://www.youtube.com/watch?v='+data.youtube_id}>
<div> <div>
<img class="rounded-tl-xl rounded-br-xl" src={'https://curriculum-app-api.beanstalkedu.com/assets/'+data.youtube_thumbnail} alt=""> <img class="rounded-tl-xl rounded-br-xl" src={'https://management.beanstalkedu.com/assets/'+data.youtube_thumbnail} alt="">
<div class="text-center text-lg ">{data.about_the_video}</div> <div class="text-center text-lg ">{data.about_the_video}</div>
</div> </div>
</a> </a>
@ -156,7 +156,7 @@ import Footer from "../../components/Footer.vue";
{allthemesRespData.map((data: { theme_slug: string | undefined; theme_icon: string | undefined; }) => {allthemesRespData.map((data: { theme_slug: string | undefined; theme_icon: string | undefined; }) =>
<div class="grid"> <div class="grid">
<a href={'/themes/'+ data.theme_slug}> <a href={'/themes/'+ data.theme_slug}>
<img class="rounded-lg shadow-2xl" src={'https://curriculum-app-api.beanstalkedu.com/assets/' + data.theme_icon} alt=""/> <img class="rounded-lg shadow-2xl" src={'https://management.beanstalkedu.com/assets/' + data.theme_icon} alt=""/>
</a> </a>
</div> </div>
)} )}