Emirates Schools Establishment (2024)

`, props: ['card'], data: () => ({ startServiceLabel: '', ServiceDetailsLabl: "" }), methods: { generateURL(page) { let url = '' if (_spPageContextInfo.currentLanguage === 1025) { let SiteURL = '/Ar/EServices'; url = SiteURL + '/ServiceCards/Pages/' + page + '.aspx'; this.startServiceLabel = 'ابدأ الخدمة'; this.ServiceDetailsLabl = 'تفاصيل الخدمة'; } else { let SiteURL = '/En/EServices'; url = SiteURL + '/ServiceCards/Pages/' + page + '.aspx'; this.startServiceLabel = 'Start Service'; this.ServiceDetailsLabl = 'Service Details'; } return url; }, getTranslate(id) { if (_spPageContextInfo.currentLanguage === 1025) { switch (id) { case 'Registration': return 'التسجيل'; break; case 'Attestaition': return 'التصديقات'; break; case 'helpandsupport': return 'المساعدة والاستفسارات'; break; } } else { switch (id) { case 'Registration': return 'Registration'; break; case 'Attestaition': return 'Attestaition'; break; case 'helpandsupport': return 'Help and Support'; break; } } } } } const { createApp } = Vue createApp({ data() { return { HomeSliders: [], ServicesCategories: [], ServicCardsItems: {}, ServiceCatalogeLabels: {}, SiteURL: '', originData: {}, lang: "", pages: 0, currenPage: 1, dataPage: 0, NewsList: {}, NewsFirstItem: {}, PhotoAlbumesList: [], FirstAlbumes: {}, EventsList: [], MediaHubLabel: {}, acadmicCalendar: [], activeSlider: 0, selectedSliderImage: '', selectedBgColor: "#020202d1", selectedBTNBg: "#036173", selectedBTNColor: '#fff', selectedTitleFontSize: '20px', VideosList: [], selectedVideo: {}, cardList: [], pdfLink:"" } }, methods: { getServiceCatalogeLabels() { if (_spPageContextInfo.currentLanguage === 1025) { this.lang = 'AR'; this.ServiceCatalogeLabels = { "ServicesCataloge": "الخدمات", "All": "الكل", "MostUsedLbl": "الأكثر استخداماً", "Registration": "التسجيل", "Attestaition": "التصديقات", "HelpAndSupportLbl": "المساعدة والاستفسارات", "SearchPlaceHolder": "البحث في الخدمات", "searchTooltip": "عندما تختار خدمة من الخدمات سوف يتم تحويلك لصفحة تفاصيل الخدمة مباشرة", "noServices": "عذراً لا يوجد خدمات في التنصيف الذي قمت باختياره", "more": "المزيد", "acadmicCalendar": "التقويم الأكاديمي", "moreDetails": "دليل التقويم الأكاديمي" } this.MediaHubLabel = { "News": "الأخبار", "PhotoGallary": "الصور", "VideoGallary": "الفيديو", "Events": "الفعاليات", "Initiativescompetitions": "المبادرات والمنافسات", "ViewAll": "عرض الكل", "MediaCenter": "المركز الإعلامي", } } else { this.lang = 'EN'; this.ServiceCatalogeLabels = { "ServicesCataloge": "Services Cataloge", "All": "All", "MostUsedLbl": "Most Used", "Registration": "Registration", "Attestaition": "Attestaition", "HelpAndSupportLbl": "Help And Support", "SearchPlaceHolder": "Search in services", "searchTooltip": "When you select service it will be redirect to service detailes page", "noServices": "Sorry ! There is no services in selected Category", "more": "Read More", "acadmicCalendar": "Acadmic calendar", "moreDetails": "Acadmic calendar Guide" } this.MediaHubLabel = { "News": "News", "PhotoGallary": "Photo Gallary", "VideoGallary": " VideoGallary", "Events": "Events", "Initiativescompetitions": "Initiatives & competitions", "ViewAll": "View All", "MediaCenter": "Media Center" } } console.log(this.ServiceCatalogeLabels); }, async getHomePageSlider() { var res; res = await fetch(_spPageContextInfo.siteAbsoluteUrl + "/_api/lists/getbytitle('HomeSlider')/items?$filter=isPublish eq 1&$orderby= orderSlider asc", { // res = await fetch(_spPageContextInfo.siteAbsoluteUrl + "/_api/lists/getbytitle('HomeSlider')/items?&$orderby= orderSlider asc", { "method": "GET", "headers": { "Accept": "application/json;odata=verbose", } }); const finalRes = await res.json(); let data = finalRes.d.results; var list = []; for (var i = 0; i < data.length; i++) { if (this.lang == 'AR') { list.push({ Title: data[i].TitleAR, Link: data[i].LinkAR, image: data[i].ImageURLAR, publish: data[i].isPublish, description: data[i].descriptionAR, id: data[i].Id, moreTxt: data[i].moreLinkTextAR, bgColor: data[i].backgroundColorInfo, titleFontSize: data[i].titleFontSize, btnColor: data[i].btnColor, btnBG: data[i].btnBG }) } else { list.push({ Title: data[i].Title, Link: data[i].LinkEN, image: data[i].ImageURLEN, publish: data[i].isPublish, description: data[i].descriptionEN, id: data[i].Id, moreTxt: data[i].moreLinkTextEN, bgColor: data[i].backgroundColorInfo, titleFontSize: data[i].titleFontSize, btnColor: data[i].btnColor, btnBG: data[i].btnBG }) } } this.HomeSliders = list; this.selectedSliderImage = list[0].image this.selectedBgColor = list[0].bgColor; } , async getAcadmicCalender() { var res; res = await fetch(_spPageContextInfo.siteAbsoluteUrl + "/en/_api/lists/getbytitle('AcadmicCalendar')/items", { "method": "GET", "headers": { "Accept": "application/json;odata=verbose", } }); const finalRes = await res.json(); let data = finalRes.d.results; console.log(data); var list = []; for (var i = 0; i < data.length; i++) { if (this.lang == 'AR') { list.push({ Title: data[i].TitleAR, date: data[i].DateAR, image: data[i].Image, description: data[i].NoteAR, id: data[i].Id, linkPDF:data[i].pdflink }) } else { list.push({ Title: data[i].Title, date: data[i].DateEN, image: data[i].Image, description: data[i].NoteEN, id: data[i].Id, linkPDF:data[i].pdflink }); } } this.acadmicCalendar = list; this.pdfLink=this.acadmicCalendar[0].linkPDF; }, async getServiceCards() { var res; if (_spPageContextInfo.currentLanguage === 1025) { this.SiteURL = '/Ar/EServices'; res = await fetch(_spPageContextInfo.siteAbsoluteUrl + "/Ar/EServices/ServiceCards/_api/lists/getbytitle('CardsContent')/items?$select=*,ServiceCategory/Title&$expand=ServiceCategory&$filter=Publish eq 1", { "method": "GET", "headers": { "Accept": "application/json;odata=verbose", } }); } else { this.SiteURL = '/En/EServices'; res = await fetch(_spPageContextInfo.siteAbsoluteUrl + "/En/EServices/ServiceCards/_api/lists/getbytitle('CardsContent')/items?$select=*,ServiceCategory/Title&$expand=ServiceCategory&$filter=Publish eq 1", { "method": "GET", "headers": { "Accept": "application/json;odata=verbose", } }); } const finalRes = await res.json(); let data = finalRes.d.results; this.ServicCardsItems = data; this.originData = data; this.pages = Math.ceil(this.originData.length / 6); this.ServicesSearch(data, this.SiteURL) }, async getServiceCategoires() { var res; if (this.lang == 'AR') { res = await fetch(_spPageContextInfo.siteAbsoluteUrl + "/AR/EServices/ServiceCards/_api/lists/getbytitle('ServicesCategories')/items?$orderby=CategoryOrder asc", { "method": "GET", "headers": { "Accept": "application/json;odata=verbose", } }); } else { res = await fetch(_spPageContextInfo.siteAbsoluteUrl + "/EN/EServices/ServiceCards/_api/lists/getbytitle('ServicesCategories')/items?$orderby=CategoryOrder asc", { "method": "GET", "headers": { "Accept": "application/json;odata=verbose", } }); } const finalRes = await res.json(); let data = finalRes.d.results; let list = []; for (var i = 0; i < data.length; i++) { list.push({ Title: data[i].Title, Icon: data[i].CategoryIcon, Id: data[i].ID, }) } this.getServiceCategoires = list; }, renderServices(Id) { if (Id == 'All') { this.ServicCardsItems = this.originData; $('.services-categories-tabs .nav-link').removeClass('active'); $('#AllMain-tab').addClass('active'); } else if (Id == 'MostUsed') { this.ServicCardsItems = this.originData.filter(function (element) { return element.isMostUsed == true; MostUsed - tab }); $('.services-categories-tabs .nav-link').removeClass('active'); $('#MostUsed-tab').addClass('active'); } else { this.ServicCardsItems = this.originData.filter(function (element) { return element.ServiceCategoryId == Id; }); $('.services-categories-tabs .nav-link').removeClass('active'); $('#Category-' + Id).addClass('active'); } this.pages = Math.ceil(this.ServicCardsItems.length / 6) }, getPage(index) { index = index + 1; return Math.ceil(index / 6); }, generateURL(page) { let url = this.SiteURL + '/ServiceCards/Pages/' + page + '.aspx'; return url; }, ServicesSearch(data, siteUrl) { var cardList2 = [] for (var i = 0; i < data.length; i++) { cardList2.push({ 'label': data[i].ServiceTitle, 'value': data[i].ServiceTitle, 'url': data[i].Title }) this.cardList.push({ 'label': data[i].ServiceTitle, 'value': data[i].ServiceTitle, 'url': data[i].Title }) } $("#searchText").focus(function () { $('.services-search').addClass('active'); }); $("#searchText").blur(function () { $('.services-search').removeClass('active'); }); // $("#searchText").autocomplete({ // source: cardList, // select: function (event, service) { // let url = siteUrl + '/ServiceCards/Pages/' + service.item.url + '.aspx'; // console.log(url); // window.location.href = url // } // }) }, async getNewsList() { var res; if (_spPageContextInfo.currentLanguage === 1025) { this.SiteURL = '/Ar/EServices'; res = await fetch(_spPageContextInfo.siteAbsoluteUrl + "/Ar/MediaCenter/News/_api/lists/getbytitle('الصفحات')/items?$top=4&$orderby=ArticleStartDate desc&$select=Title,Comments,FileRef,ArticleStartDate,Thumbnail,Publish", { "method": "GET", "headers": { "Accept": "application/json;odata=verbose", } }); } else { this.SiteURL = '/En/EServices'; res = await fetch(_spPageContextInfo.siteAbsoluteUrl + "/En/MediaCenter/News/_api/lists/getbytitle('Pages')/items?$top=4&$orderby=ArticleStartDate desc&$select=Title,Comments,FileRef,ArticleStartDate,Thumbnail,Publish", { "method": "GET", "headers": { "Accept": "application/json;odata=verbose", } }); } const finalRes = await res.json(); let data = finalRes.d.results; this.NewsList = data; this.NewsFirstItem = data[0]; }, async getPhotoAlbums() { var res; res = await fetch(_spPageContextInfo.siteAbsoluteUrl + "/En/MediaCenter/_api/lists/getbytitle('PhotoAlbums')/items?$top=4&$orderby=Created desc&$select=Id,Title,TitleAR,Thumbnail,Date,AttachmentFiles&$expand=AttachmentFiles", { "method": "GET", "headers": { "Accept": "application/json;odata=verbose", } }); const finalRes = await res.json(); let data = finalRes.d.results; let list = []; for (var i = 0; i < data.length; i++) { let Title; if (this.lang == 'AR') { Title = data[i].TitleAR } else { Title = data[i].Title } let Thumb if (data[i].Thumbnail != null) { Thumb = data[i].Thumbnail; } else { Thumb = data[i].AttachmentFiles.results[0].ServerRelativeUrl; } list.push({ Id: data[i].Id, Title: Title, Thumbnail: Thumb, Date: data[i].Date, PhotosList: data[i].AttachmentFiles.results }) } console.log(list); this.PhotoAlbumesList = list; this.FirstAlbumes = list[0]; console.log(this.PhotoAlbumesList); }, async getVideoAlbums() { var res; res = await fetch(_spPageContextInfo.siteAbsoluteUrl + "/En/MediaCenter/_api/lists/getbytitle('VideoAlbums')/items?$top=4&$orderby=Created desc", { "method": "GET", "headers": { "Accept": "application/json;odata=verbose", } }); const finalRes = await res.json(); let data = finalRes.d.results; let list = []; for (var i = 0; i < data.length; i++) { let Title; let Thumb; let caption = ""; if (this.lang == 'AR') { Title = data[i].TitleAR caption = data[i].videoCaption; Thumb = data[i].VideoThumb; } else { Title = data[i].Title; caption = data[i].videoCaptionEn Thumb = data[i].videoThumbEn; } list.push({ Id: data[i].Id, Title: Title, Thumbnail: Thumb, Date: data[i].PublishDate, videoLink: data[i].VideoLink, videoCaption: caption, }) } console.log(this.list) this.VideosList = list; this.selectedVideo = list[0]; }, async getEvents() { var res; res = await fetch(_spPageContextInfo.siteAbsoluteUrl + "/En/MediaCenter/_api/lists/getbytitle('Events')/items?$orderby=Created desc", { "method": "GET", "headers": { "Accept": "application/json;odata=verbose", } }); const finalRes = await res.json(); let data = finalRes.d.results; let list = []; for (var i = 0; i < data.length; i++) { if (this.lang == 'AR') { list.push({ Title: data[i].TitleAR, Location: data[i].LocationAR, Description: data[i].DescriptionAR, StartDate: data[i].EventDate, EndDate: data[i].EndDate }) } else { list.push({ Title: data[i].Title, Location: data[i].Location, Description: data[i].Description, StartDate: data[i].EventDate, EndDate: data[i].EndDate }) } } this.EventsList = list; }, showAlbume(PhotoList, Title) { let Album = []; for (var i = 0; i < PhotoList.length; i++) { Album.push({ "src": PhotoList[i].ServerRelativeUrl, "thumb": PhotoList[i].ServerRelativeUrl, 'subHtml': Title }) } $('#lgGalley').lightGallery({ dynamic: true, dynamicEl: Album }); $('#lgGalley').on('onCloseAfter.lg', function (event) { console.log('closed'); try { $('#lgGalley').data('lightGallery').destroy(true); } catch (ex) { }; }); } , getFormattedDate(date) { var options = { year: 'numeric', month: 'numeric', day: 'numeric' }; var newDate = new Date(date); return newDate.toLocaleDateString("en-GB", options); }, navSlider(type, slider) { if (type == 'next') { if (this.activeSlider < this.HomeSliders.length - 1) { this.activeSlider += 1; } else { this.activeSlider = 0; } } else if (type == 'prev') { if (this.activeSlider > 0) { this.activeSlider -= 1; } else { this.activeSlider = this.HomeSliders.length - 1; } } this.selectedSliderImage = this.HomeSliders[this.activeSlider].image; this.selectedBgColor = this.HomeSliders[this.activeSlider].bgColor; }, redirectToURL() { let srvlbl = $('#searchText').val() this.cardList.filter(function (element) { if (element.label == srvlbl) { let url = '' if (_spPageContextInfo.currentLanguage === 1025) { url = '/Ar/EServices/ServiceCards/Pages/' + element.url + '.aspx'; } else { url = '/En/EServices/ServiceCards/Pages/' + element.url + '.aspx'; } console.log(url); window.location.href = url } }); } }, mounted() { this.getServiceCatalogeLabels(); this.getHomePageSlider(); this.getServiceCategoires(); this.getServiceCards(); this.getNewsList(); this.getPhotoAlbums(); this.getEvents(); this.getAcadmicCalender(); // this.getVideoAlbums(); $('.carousel').carousel({ interval: 5000 }) }, updated() { $(window).on("load", function () { $('.loaderBlock').fadeOut('slow'); }); // var coverflow = $("#coverflow").flipster( // { // // 'coverflow' or 'carousel' or 'flat' or 'wheel' // scrollwheel: false, // buttons: true, // } // ); } }).component('Card', Card).mount('#HomeApp'); initServicesSettings(); function initServicesSettings() { if (_spPageContextInfo.currentLanguage === 1025) { HomeServicesSettings = { dateFormat: "DD/MM/YYYY", url: _spPageContextInfo.siteAbsoluteUrl + "/Ar", siteName: "Ar", language: "ar", }; } else { HomeServicesSettings = { dateFormat: "DD/MM/YYYY", url: _spPageContextInfo.siteAbsoluteUrl + "/En", siteName: "En", language: "en", }; } } });