You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
400 lines
14 KiB
400 lines
14 KiB
<template>
|
|
<div class="home-view">
|
|
<Hero :slogan="slogan" :subslogan="subslogan" :populars="populars" :servicesSearchs="servicesSearchs"
|
|
:servicesLocations="servicesLocations" :exhibitionsSearchs="exhibitionsSearchs"
|
|
:exhibitionsLocations="exhibitionsLocations" :exhibitionsCategories="exhibitionsCategories" :banner="banner"
|
|
:serviceKeywords="serviceKeywords" :exhibitionsKeywords="exhibitionsKeywords" />
|
|
<centerMode :list="ads" v-if="ads.length"></centerMode>
|
|
<!-- <AdBanner :item="apiData.ads" /> -->
|
|
<section class="tw-px-[30px] xl:tw-px-[60px] tw-mt-[50px] md:tw-mt-[70px] xl:tw-max-w-[1366px] xl:tw-mx-auto">
|
|
<h2 class="t18 tw-font-medium tw-text-primary-default tw-mb-[28px] md:tw-float-left md:t24 xl:t28">
|
|
{{ $t("Highlight Exhibitions") }}
|
|
</h2>
|
|
<newHighlightExhibitions></newHighlightExhibitions>
|
|
</section>
|
|
<section class="tw-pl-[30px] xl:tw-px-[60px] tw-mt-[50px] md:tw-mt-[70px] xl:tw-max-w-[1366px] xl:tw-mx-auto"
|
|
v-show="services.length > 0">
|
|
<h2 class="t18 tw-font-medium tw-text-primary-default tw-mb-[8px] md:t24 xl:tw-float-left xl:t28">
|
|
{{ $t("Trending Services") }}
|
|
</h2>
|
|
<TrendingService :services="services" />
|
|
</section>
|
|
<section class="tw-px-[30px] xl:tw-px-[60px] tw-mt-[50px] md:tw-mt-[70px] xl:tw-max-w-[1366px] xl:tw-mx-auto">
|
|
<h2 class="t18 tw-font-medium tw-text-primary-default tw-mb-[24px] md:t24 xl:t28" v-show="themes.length > 0">
|
|
{{ $t("Featured Exhibition Themes") }}
|
|
</h2>
|
|
<FeaturedExhibitonThemes :themes="themes" :title="themesTitle" />
|
|
</section>
|
|
|
|
<section class="tw-pl-[30px] xl:tw-px-[60px] tw-mt-[50px] md:tw-mt-[70px] xl:tw-max-w-[1366px] xl:tw-mx-auto">
|
|
<h2 class="t18 tw-font-medium tw-text-primary-default tw-mb-[24px] md:t24 xl:t28">
|
|
{{ $t("Trending Destination Services") }}
|
|
</h2>
|
|
<TrendingDestinationServices :themes="serviceThemes" :title="serviceThemesTitle">
|
|
</TrendingDestinationServices>
|
|
</section>
|
|
<OtherInfo />
|
|
<section class="tw-px-[30px] tw-mt-[50px] md:tw-mt-[95px] xl:tw-px-[60px] xl:tw-max-w-[1366px] xl:tw-mx-auto">
|
|
<h2 class="t18 tw-font-medium tw-text-primary-default tw-mt-[25px] md:t24 xl:t28">
|
|
{{ $t("Partnership") }}
|
|
</h2>
|
|
<Partnership v-if="partnershiplist.length > 0" :partnershiplist="partnershiplist"></Partnership>
|
|
</section>
|
|
<BottomInfo :collections="collections" />
|
|
<CookieUnderModal />
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import Hero from "@/components/home/Hero";
|
|
// import AdBanner from "@/components/home/AdBanner";
|
|
import centerMode from "@/components/swiper/centerMode";
|
|
import newHighlightExhibitions from "@/components/home/newHighlightExhibitions.vue";
|
|
import TrendingService from "@/components/home/TrendingService";
|
|
import FeaturedExhibitonThemes from "@/components/home/FeaturedExhibitonThemes";
|
|
import TrendingDestinationServices from "@/components/home/TrendingDestinationServices";
|
|
import OtherInfo from "@/components/home/OtherInfo";
|
|
import Partnership from "@/components/home/Partnership";
|
|
import BottomInfo from "@/components/home/BottomInfo";
|
|
import CookieUnderModal from "@/components/home/CookieUnderModal";
|
|
import jwt_decode from "jwt-decode";
|
|
import { getData } from "~/utils/assist";
|
|
import { onMounted } from "vue";
|
|
|
|
export default {
|
|
data() {
|
|
return {
|
|
title: '1',
|
|
apiUrl: process.env.SERVICE_CONSOLE,
|
|
slogan: 'A Better Event Journey',
|
|
subslogan: 'Start your journey from ShowEasy, Make Your Show Easy！',
|
|
populars: {
|
|
search: ['Fastener','Automation','Computer','Sports','Medical'],
|
|
service: ['Fastener','Automation','Computer','Sports','Medical']
|
|
},
|
|
servicesSearchs: [],
|
|
servicesLocations: ['Taiwan','USA','Germany','Japan'],
|
|
serviceKeywords: [],
|
|
exhibitionsSearchs: ['Food Equipment','Machine Tool','Food Equipment','Machine Tool'],
|
|
exhibitionsLocations: [],
|
|
exhibitionsCategories: [{ subcategory: [], },],
|
|
exhibitionsKeywords: [],
|
|
banner: require('/assets/img/ExhibitionBanner.jpeg'),
|
|
ads: [{
|
|
image: require('/assets/img/thems/Frame33.png')
|
|
},{
|
|
image: require('/assets/img/thems/Frame33.png')
|
|
},{
|
|
image: require('/assets/img/thems/Frame33.png')
|
|
}],
|
|
services: [{
|
|
id: '1',
|
|
name: 'VISA Application (Vietnam)',
|
|
price: '35',
|
|
region: 0,
|
|
country: 0,
|
|
subcategory: 'VISA',
|
|
rating: '5.4',
|
|
reviews: '344',
|
|
preview_image: require('~/assets/img/bookingInfoTest.png'),
|
|
payment_currency: 'USD',
|
|
},{
|
|
id: '1',
|
|
name: 'VISA Application (Vietnam)',
|
|
price: '35',
|
|
region: 0,
|
|
country: 0,
|
|
subcategory: 'VISA',
|
|
rating: '5.4',
|
|
reviews: '344',
|
|
preview_image: require('~/assets/img/bookingInfoTest.png'),
|
|
payment_currency: 'USD',
|
|
},{
|
|
id: '1',
|
|
name: 'VISA Application (Vietnam)',
|
|
price: '35',
|
|
region: 0,
|
|
country: 0,
|
|
subcategory: 'VISA',
|
|
rating: '5.4',
|
|
reviews: '344',
|
|
preview_image: require('~/assets/img/bookingInfoTest.png'),
|
|
payment_currency: 'USD',
|
|
},{
|
|
id: '1',
|
|
name: 'VISA Application (Vietnam)',
|
|
price: '35',
|
|
region: 0,
|
|
country: 0,
|
|
subcategory: 'VISA',
|
|
rating: '5.4',
|
|
reviews: '344',
|
|
preview_image: require('~/assets/img/bookingInfoTest.png'),
|
|
payment_currency: 'USD',
|
|
}],
|
|
themes: [{
|
|
name: '',
|
|
url: '/',
|
|
image: require('~/assets/img/thems/Exhibiton-Themes-01.png')
|
|
},{
|
|
name: '',
|
|
url: '/',
|
|
image: require('/assets/img/thems/Exhibiton-Themes-02.png')
|
|
},{
|
|
name: '',
|
|
url: '/',
|
|
image: require('/assets/img/thems/Exhibiton-Themes-03.png')
|
|
},{
|
|
name: '',
|
|
url: '/',
|
|
image: require('/assets/img/thems/Exhibiton-Themes-04.png')
|
|
}],
|
|
themesTitle: '',
|
|
serviceThemes: [{
|
|
name: '',
|
|
image: require('/assets/img/thems/Frame33.png')
|
|
},{
|
|
name: '',
|
|
image: require('/assets/img/thems/Frame34.png')
|
|
},{
|
|
name: '',
|
|
image: require('/assets/img/thems/Frame35.png')
|
|
},{
|
|
name: '',
|
|
image: require('/assets/img/thems/Frame36.png')
|
|
},{
|
|
name: '',
|
|
image: require('/assets/img/thems/Frame37.png')
|
|
}],
|
|
serviceThemesTitle: '',
|
|
collections: [],
|
|
partnershiplist: [{
|
|
image: require('/assets/img/thems/pti01.png')
|
|
},{
|
|
image: require('/assets/img/thems/pti02.png')
|
|
},{
|
|
image: require('/assets/img/thems/pti03.png')
|
|
},{
|
|
image: require('/assets/img/thems/pti04.png')
|
|
},{
|
|
image: require('/assets/img/thems/pti05.png')
|
|
},{
|
|
image: require('/assets/img/thems/pti06.png')
|
|
}],
|
|
};
|
|
},
|
|
props: ["langChange"],
|
|
name: "IndexPage",
|
|
auth: false,
|
|
head: {
|
|
title: "ShowEasy-we make your show easy!",
|
|
},
|
|
components: {
|
|
Hero,
|
|
// AdBanner,
|
|
centerMode,
|
|
newHighlightExhibitions,
|
|
TrendingService,
|
|
FeaturedExhibitonThemes,
|
|
TrendingDestinationServices,
|
|
OtherInfo,
|
|
Partnership,
|
|
BottomInfo,
|
|
CookieUnderModal,
|
|
},
|
|
async created() {
|
|
// await this.getAds();
|
|
// await this.getBanner();
|
|
// await this.getSlogans();
|
|
// await this.getPopulars();
|
|
// await this.getServiceKeywords();
|
|
// await this.getExhibitionsKeywords();
|
|
// await this.getServiceHistory();
|
|
// await this.getExhibitionsHistory();
|
|
// await this.getServiceLocations();
|
|
// await this.getExhibitionsLocations();
|
|
// await this.getExhibitionsCategories();
|
|
// await this.getExhibitionsCollections();
|
|
// await this.getServices();
|
|
// await this.getExhibitionsTheme();
|
|
// await this.getServiceTheme();
|
|
// await this.getPartnership();
|
|
// if (this.$auth.loggedIn) {
|
|
// this.$store.dispatch("updatePicture");
|
|
// }
|
|
},
|
|
watch: {
|
|
currency: {
|
|
handler: async function () {
|
|
// await this.getServices();
|
|
},
|
|
},
|
|
},
|
|
computed: {
|
|
currency() {
|
|
return this.$store.getters.getCurrency;
|
|
},
|
|
},
|
|
methods: {
|
|
// async getSlogans() {
|
|
// await this.$axios
|
|
// .get(`/trending/slogans?lang=${this.$i18n.localeProperties["langQuery"]}`)
|
|
// .then((response) => {
|
|
// this.slogan = response.data.slogan;
|
|
// this.subslogan = response.data.subslogan;
|
|
// })
|
|
// .catch((error) => console.log(error));
|
|
// },
|
|
// async getPopulars() {
|
|
// await this.$axios
|
|
// .get(`/trending/search/popular?lang=${this.$i18n.localeProperties["langQuery"]}`)
|
|
// .then((response) => {
|
|
// this.populars = response.data;
|
|
// })
|
|
// .catch((error) => console.log(error));
|
|
// },
|
|
// async getBanner() {
|
|
// await this.$axios
|
|
// .get(`/trending/banner?lang=${this.$i18n.localeProperties["langQuery"]}`)
|
|
// .then((response) => {
|
|
// this.banner = response.data.banner;
|
|
// })
|
|
// .catch((error) => console.log(error));
|
|
// },
|
|
// async getAds() {
|
|
// await this.$axios
|
|
// .get(`/trending/ads?lang=${this.$i18n.localeProperties["langQuery"]}`)
|
|
// .then((response) => {
|
|
// this.ads = response.data.ads;
|
|
// })
|
|
// .catch((error) => console.log(error));
|
|
// },
|
|
// async getExhibitionsTheme() {
|
|
// await this.$axios
|
|
// .get(`/trending/themes/exhibitions?lang=${this.$i18n.localeProperties["langQuery"]}`)
|
|
// .then((response) => {
|
|
// this.themes = response.data.themes;
|
|
// this.themesTitle = response.data.title;
|
|
// })
|
|
// .catch((error) => console.log(error));
|
|
// },
|
|
// async getServiceTheme() {
|
|
// await this.$axios
|
|
// .get(`/trending/themes/services?lang=${this.$i18n.localeProperties["langQuery"]}`)
|
|
// .then((response) => {
|
|
// this.serviceThemes = response.data.themes;
|
|
// this.serviceThemesTitle = response.data.title;
|
|
// })
|
|
// .catch((error) => console.log(error));
|
|
// },
|
|
// async getServiceHistory() {
|
|
// await this.$axios
|
|
// .get(`/trending/services/search/history?lang=${this.$i18n.localeProperties["langQuery"]}`)
|
|
// .then((response) => {
|
|
// this.servicesSearchs = response.data.searches;
|
|
// })
|
|
// .catch((error) => console.log(error));
|
|
// },
|
|
// async getExhibitionsHistory() {
|
|
// await this.$axios
|
|
// .get(`/trending/exhibitions/search/history?lang=${this.$i18n.localeProperties["langQuery"]}`)
|
|
// .then((response) => {
|
|
// this.exhibitionsSearchs = response.data.searches;
|
|
// })
|
|
// .catch((error) => console.log(error));
|
|
// },
|
|
// async getServiceLocations() {
|
|
// await this.$axios
|
|
// .get(`/trending/services/locations?lang=${this.$i18n.localeProperties["langQuery"]}`)
|
|
// .then((response) => {
|
|
// this.servicesLocations = response.data.locations;
|
|
// })
|
|
// .catch((error) => console.log(error));
|
|
// },
|
|
// async getExhibitionsLocations() {
|
|
// await this.$axios
|
|
// .get(`/trending/exhibitions/locations?lang=${this.$i18n.localeProperties["langQuery"]}`)
|
|
// .then((response) => {
|
|
// this.exhibitionsLocations = response.data.locations;
|
|
// })
|
|
// .catch((error) => console.log(error));
|
|
// },
|
|
// async getExhibitionsCategories() {
|
|
// await this.$axios
|
|
// .get(
|
|
// `/t/exhibitions/categories?lang=${this.$i18n.localeProperties["langQuery"]}&sort=true`
|
|
// )
|
|
// .then((result) => {
|
|
// this.exhibitionsCategories = result.data.sort_results;
|
|
// this.exhibitionsCategories = this.exhibitionsCategories.map(
|
|
// (item) => {
|
|
// item.subcategories_list = item.subcategories_list.map(
|
|
// (children) => {
|
|
// return {
|
|
// id: children.subcategory_id,
|
|
// title: children.subcategory_name,
|
|
// key: children.subcategory_name,
|
|
// type: "subcategory",
|
|
// };
|
|
// }
|
|
// );
|
|
// return {
|
|
// id: item.categories_id,
|
|
// title: item.category_name,
|
|
// key: item.category_name,
|
|
// type: "category",
|
|
// subcategory: item.subcategories_list,
|
|
// };
|
|
// }
|
|
// );
|
|
// })
|
|
// .catch((err) => {
|
|
// console.log(err);
|
|
// });
|
|
// },
|
|
// async getExhibitionsCollections() {
|
|
// await this.$axios
|
|
// .get(`/trending/exhibitions/collections?lang=${this.$i18n.localeProperties["langQuery"]}`)
|
|
// .then((response) => {
|
|
// this.collections = response.data.collections;
|
|
// })
|
|
// .catch((error) => console.log(error));
|
|
// },
|
|
// async getServiceKeywords() {
|
|
// await this.$axios
|
|
// .get(`/trending/services/keywords?lang=${this.$i18n.localeProperties["langQuery"]}`)
|
|
// .then((response) => {
|
|
// this.serviceKeywords = response.data.keywords;
|
|
// })
|
|
// .catch((error) => console.log(error));
|
|
// },
|
|
// async getExhibitionsKeywords() {
|
|
// await this.$axios
|
|
// .get(`/trending/exhibitions/keywords?lang=${this.$i18n.localeProperties["langQuery"]}`)
|
|
// .then((response) => {
|
|
// this.exhibitionsKeywords = response.data.keywords;
|
|
// })
|
|
// .catch((error) => console.log(error));
|
|
// },
|
|
// async getServices() {
|
|
// // await this.$axios
|
|
// // .get(`${this.apiUrl}/user-services/list?lang_code=${this.$i18n.localeProperties["langQuery"]}¤cy=${this.currency}`)
|
|
// // .then((response) => {
|
|
// // this.services = response.data.sort((a, b) => b.view_counts - a.view_counts);
|
|
// // })
|
|
// // .catch((error) => console.log(error));
|
|
// },
|
|
// async getPartnership() {
|
|
// await this.$axios
|
|
// .get(`/trending/partnerships?lang=${this.$i18n.localeProperties["langQuery"]}`)
|
|
// .then((response) => {
|
|
// this.partnershiplist = response.data.partnerships;
|
|
// })
|
|
// .catch((error) => console.log(error));
|
|
// },
|
|
}
|
|
};
|
|
</script>
|
|
<style lang="scss" scoped>
|
|
|
|
</style>
|