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.
520 lines
18 KiB
520 lines
18 KiB
<template>
|
|
<div class="home-view">
|
|
<Hero :slogan="slogan" :subslogan="subslogan" :populars="populars"
|
|
:exhibitionsSearchs="exhibitionsSearchs"
|
|
:exhibitionsLocations="exhibitionsLocations" :exhibitionsCategories="exhibitionsCategories" :banner="banner"
|
|
:exhibitionsKeywords="exhibitionsKeywords" />
|
|
<centerMode :list="ads" v-if="ads.length"></centerMode>
|
|
<!-- <AdBanner :item="apiData.ads" /> -->
|
|
<section class="tw-mt-[50px] md:tw-mt-[70px] xl:tw-max-w-[1366px] xl:tw-mx-auto">
|
|
<ChoiceReason :reasons="reasons"></ChoiceReason>
|
|
</section>
|
|
<section class="xl:tw-max-w-[1366px] xl:tw-mx-auto">
|
|
<FocusExhibition></FocusExhibition>
|
|
</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-mb-[28px] md:tw-float-left md:t24 xl:t28">
|
|
* 國外 {{ $t("Focus Exhibitions") }}
|
|
</h2>
|
|
<FocusExhibition2 v-if="focusExhibitionlist.length > 0" :focusExhibitionlist="focusExhibitionlist"></FocusExhibition2>
|
|
</section> -->
|
|
<section class="xl:tw-max-w-[1366px] xl:tw-mx-auto">
|
|
<ExhibitionStrategy v-if="strategyList.length > 0" :strategyList="strategyList"></ExhibitionStrategy>
|
|
</section>
|
|
<section class="xl:tw-max-w-[1366px] xl:tw-mx-auto">
|
|
<Advertisement v-if="advertisementList.length > 0" :advertisementList="advertisementList"></Advertisement>
|
|
</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-[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 :countries="countries" :cards="cards" :categories="categories"/>
|
|
<CookieUnderModal />
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import Hero from "@/components/home/Hero";
|
|
// import AdBanner from "@/components/home/AdBanner";
|
|
import centerMode from "@/components/swiper/centerMode";
|
|
import ChoiceReason from "@/components/home/ChoiceReason";
|
|
import FocusExhibition from "@/components/home/FocusExhibition";
|
|
// import FocusExhibition2 from "@/components/home/FocusExhibition2";
|
|
// 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 ExhibitionStrategy from "@/components/home/ExhibitionStrategy";
|
|
import Advertisement from "@/components/home/Advertisement";
|
|
// 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: '',
|
|
subslogan: '',
|
|
populars: {
|
|
search: [],
|
|
service: []
|
|
},
|
|
// servicesSearchs: [],
|
|
// servicesLocations: [],
|
|
// serviceKeywords: [],
|
|
exhibitionsSearchs: [],
|
|
exhibitionsLocations: [{
|
|
id: '1',
|
|
region: 'Taiwan',
|
|
countries: [{
|
|
id: '2',
|
|
country: 'USA',
|
|
cities: [{
|
|
id: '3',
|
|
city: 'Japan'
|
|
}]
|
|
}]
|
|
}],
|
|
exhibitionsCategories: [
|
|
],
|
|
exhibitionsKeywords: [],
|
|
banner: '',
|
|
ads: [
|
|
{
|
|
id: 'banner_1',
|
|
image: require('/assets/img/banner/banner_1.png'),
|
|
url: '/'
|
|
},
|
|
{
|
|
id: 'banner_2',
|
|
image: require('/assets/img//banner/banner_2.png'),
|
|
url: '/'
|
|
},
|
|
{
|
|
id: 'banner_3',
|
|
image: require('/assets/img//banner/banner_3.png'),
|
|
url: '/'
|
|
},
|
|
{
|
|
id: 'banner_4',
|
|
image: require('/assets/img//banner/banner_4.png'),
|
|
url: '/'
|
|
},
|
|
{
|
|
id: 'banner_5',
|
|
image: require('/assets/img//banner/banner_5.png'),
|
|
url: '/'
|
|
}
|
|
],
|
|
advertisementList: [{
|
|
image: require('/assets/img/Frame.jpg')
|
|
},{
|
|
image: require('/assets/img/Frame.jpg')
|
|
},{
|
|
image: require('/assets/img/Frame.jpg')
|
|
}
|
|
],
|
|
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',
|
|
}],
|
|
reasons:[{
|
|
name: '一站可查全球展會',
|
|
content: '全球上千場展覽，透過關鍵字或類別查詢，時間、地點、展館、主辦單位…等，資料為您備齊。',
|
|
url: 'javascript:void(0);',
|
|
image: require('~/assets/img/search-field.png')
|
|
},{
|
|
name: '網羅辦展所需服務',
|
|
content: '展品運輸、展館服務…等服務，我們一一為您網羅，ShowEasy 讓您線上查詢、預約，輕鬆管理您的訂單。',
|
|
url: 'javascript:void(0);',
|
|
image: require('~/assets/img/shopping-bag.png')
|
|
},{
|
|
name: '嚴選供應商品質保障',
|
|
content: 'ShowEasy 擁有嚴謹的供應商審核制度，憑藉展會業資深團隊深厚的經驗，為您所訂購的服務品質查核。',
|
|
url: 'javascript:void(0);',
|
|
image: require('~/assets/img/medal.png')
|
|
},{
|
|
name: '展會服務數位化',
|
|
content: 'ShowEasy 將展會產業鏈數位化，達到查找服務便利、訂購流程簡便、線上即時下單的效益。',
|
|
url: 'javascript:void(0);',
|
|
image: require('~/assets/img/mac-os.png')
|
|
}],
|
|
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: '',
|
|
countries: [
|
|
],
|
|
cards: [
|
|
],
|
|
categories: [
|
|
],
|
|
partnershiplist: [{
|
|
image: require('/assets/img/partnership/A_best_world.png')
|
|
},{
|
|
image: require('/assets/img/partnership/Brilliant.png')
|
|
},{
|
|
image: require('/assets/img/partnership/DJB_logo.jpg')
|
|
},{
|
|
image: require('/assets/img/partnership/euro_logo.png')
|
|
},{
|
|
image: require('/assets/img/partnership/fullon.jpg')
|
|
},{
|
|
image: require('/assets/img/partnership/hanselogo.png')
|
|
},{
|
|
image: require('/assets/img/partnership/nanrunglogo.png')
|
|
},{
|
|
image: require('/assets/img/partnership/PILATUS.png')
|
|
},{
|
|
image: require('/assets/img/partnership/Shilin_Flower_ArtLOGO.png')
|
|
},{
|
|
image: require('/assets/img/partnership/starpubliclogo.png')
|
|
},{
|
|
image: require('/assets/img/partnership/Tripool.png')
|
|
},{
|
|
image: require('/assets/img/partnership/Xinfeng_Logo.png')
|
|
}],
|
|
strategyList:[{
|
|
title: '海外參展大補帖 — 申請展覽補助',
|
|
url:'https://medium.com/showeasy/%E6%B5%B7%E5%A4%96%E5%8F%83%E5%B1%95%E5%A4%A7%E8%A3%9C%E5%B8%96-%E7%94%B3%E8%AB%8B%E5%B1%95%E8%A6%BD%E8%A3%9C%E5%8A%A9-2de6e9a4b6f9',
|
|
date: 'June 14, 2021',
|
|
content: '疫情的侵略，全世界會展產業都停滯，參展商也很難在收入銳減的的情況下參加國際展，但你知道嗎，其實有方法可以減少負擔的參與國際展覽呦',
|
|
},{
|
|
title: '【與誰同行?】 展覽選好了、報名好了 老闆該派誰去? 我們該怎麼準備呢?',
|
|
url:'https://medium.com/showeasy/%E8%88%87%E8%AA%B0%E5%90%8C%E8%A1%8C-%E5%B1%95%E8%A6%BD%E9%81%B8%E5%A5%BD%E4%BA%86-%E5%A0%B1%E5%90%8D%E5%A5%BD%E4%BA%86-%E8%80%81%E9%97%86%E8%A9%B2%E6%B4%BE%E8%AA%B0%E5%8E%BB-%E6%88%91%E5%80%91%E8%A9%B2%E6%80%8E%E9%BA%BC%E6%BA%96%E5%82%99%E5%91%A2-bc45769a06b',
|
|
date: 'June 14, 2021',
|
|
content: '講到「參展」，我們第一個會想到怎麼裝潢攤位、擺設商品，或者是怎麼將我們的展品運到展場。但是，你有想到其實工作人員的安排也是一件很重要的事嗎?',
|
|
},{
|
|
title: '如何挑選合適的攤位面積?',
|
|
url:'https://medium.com/showeasy/%E5%A6%82%E4%BD%95%E6%8C%91%E9%81%B8%E5%90%88%E9%81%A9%E7%9A%84%E6%94%A4%E4%BD%8D%E9%9D%A2%E7%A9%8D-43a9b027c35e',
|
|
date: 'June 14, 2021',
|
|
content: '臺灣是外銷出口大國，在各種行銷方法中，「參加國際展覽」是接觸海外買主、開發潛在客戶的重要渠道，但報名參展時，很多的製造商或品牌商對於自己的',
|
|
}
|
|
]
|
|
};
|
|
},
|
|
props: ["langChange"],
|
|
name: "IndexPage",
|
|
auth: false,
|
|
head: {
|
|
title: "ShowEasy-we make your show easy!",
|
|
},
|
|
components: {
|
|
Hero,
|
|
// AdBanner,
|
|
centerMode,
|
|
ChoiceReason,
|
|
FocusExhibition,
|
|
// newHighlightExhibitions,
|
|
// TrendingService,
|
|
// FeaturedExhibitonThemes,
|
|
// TrendingDestinationServices,
|
|
OtherInfo,
|
|
Partnership,
|
|
BottomInfo,
|
|
CookieUnderModal,
|
|
ExhibitionStrategy,
|
|
Advertisement,
|
|
},
|
|
created() {
|
|
// this.getBanner();
|
|
this.getBaseInfo();
|
|
this.getCountries();
|
|
// this.getCards();
|
|
this.getCategories();
|
|
this.getLocations();
|
|
this.getPopular();
|
|
// 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: function () {
|
|
// await this.getServices();
|
|
},
|
|
},
|
|
},
|
|
computed: {
|
|
currency() {
|
|
return this.$store.getters.getCurrency;
|
|
},
|
|
},
|
|
methods: {
|
|
// getBanner() {
|
|
// this.$axios
|
|
// .get(`/trending/api/index/banner?Lang=${this.$i18n.localeProperties["langQuery"]}`)
|
|
// .then((response) => {
|
|
// if(response && response.data && response.data.DATA && response.data.DATA.rel){
|
|
// let data = response.data.DATA.rel
|
|
// if(data.length>0){
|
|
// let arr = [];
|
|
// for(let i=0;i<data.length;i++){
|
|
// let target = {};
|
|
// target.image = data[i];
|
|
// arr.push(target);
|
|
// }
|
|
// this.ads = arr;
|
|
// }
|
|
// }
|
|
// })
|
|
// .catch((error) =>
|
|
// console.log(error)
|
|
// );
|
|
// },
|
|
getBaseInfo(){
|
|
this.$axios
|
|
.get(`/trending/api/index/baseInfo?Lang=${this.$i18n.localeProperties["langQuery"]}`)
|
|
.then((response) => {
|
|
if(response && response.data && response.data.DATA && response.data.DATA.rel){
|
|
let data = response.data.DATA.rel
|
|
if(data){
|
|
this.slogan = data.Slogan;
|
|
this.subslogan = data.SubSlogan;
|
|
this.banner = data.Image;
|
|
if(data.PopularSearchs){
|
|
if(data.PopularSearchs.indexOf(',') !=-1){
|
|
this.populars.search = data.PopularSearchs.split(',');
|
|
}else{
|
|
this.populars.search.push(data.PopularSearchs);
|
|
}
|
|
}
|
|
if(data.ProductNames){
|
|
if(data.ProductNames.indexOf(',') !=-1){
|
|
this.populars.service = data.ProductNames.split(',');
|
|
}else{
|
|
this.populars.service.push(data.ProductNames);
|
|
}
|
|
}
|
|
}
|
|
}
|
|
})
|
|
.catch((error) =>
|
|
console.log(error)
|
|
);
|
|
},
|
|
getCountries() {
|
|
this.$axios
|
|
.get(`/trending/api/location/countries?RegionID&Lang=${this.$i18n.localeProperties["langQuery"]}`)
|
|
.then((response) => {
|
|
if(response && response.data && response.data.DATA && response.data.DATA.rel){
|
|
let data = response.data.DATA.rel
|
|
if(data.length>0){
|
|
let arr = [];
|
|
for(let i=0;i<data.length;i++){
|
|
let target = {};
|
|
target.name = data[i].CountryName;
|
|
target.id = data[i].CountryID;
|
|
target.url = "/exhibition?country=" + data[i].CountryID;
|
|
arr.push(target);
|
|
}
|
|
this.countries = arr;
|
|
}
|
|
}
|
|
})
|
|
.catch((error) =>
|
|
console.log(error)
|
|
);
|
|
},
|
|
// getCards() {
|
|
// this.$axios
|
|
// .get(`/trending/api/Exhibition/Cards?Lang=${this.$i18n.localeProperties["langQuery"]}`)
|
|
// .then((response) => {
|
|
// if(response && response.data && response.data.DATA && response.data.DATA.rel){
|
|
// let data = response.data.DATA.rel
|
|
// if(data.length>0){
|
|
// let arr = [];
|
|
// for(let i=0;i<data.length;i++){
|
|
// let target = {};
|
|
// target.name = data[i].ExhibitionName;
|
|
// target.id = data[i].ExhibitionID;
|
|
// target.url = "/exhibition/" + data[i].ExhibitionID;
|
|
// arr.push(target);
|
|
// }
|
|
// this.cards = arr;
|
|
// }
|
|
// }
|
|
// })
|
|
// .catch((error) =>
|
|
// console.log(error)
|
|
// );
|
|
// },
|
|
getCategories() {
|
|
this.$axios
|
|
.get(`/trending/api/Exhibition/Categories?Lang=${this.$i18n.localeProperties["langQuery"]}`)
|
|
.then((response) => {
|
|
if(response && response.data && response.data.DATA && response.data.DATA.rel){
|
|
let data = response.data.DATA.rel
|
|
if(data.length>0){
|
|
this.exhibitionsCategories = data;
|
|
}
|
|
}
|
|
})
|
|
.catch((error) =>
|
|
console.log(error)
|
|
);
|
|
},
|
|
getLocations() {
|
|
this.$axios
|
|
.get(`/trending/api/Exhibition/Locations?Lang=${this.$i18n.localeProperties["langQuery"]}`)
|
|
.then((response) => {
|
|
if(response && response.data && response.data.DATA && response.data.DATA.rel){
|
|
let data = response.data.DATA.rel
|
|
if(data){
|
|
this.exhibitionsLocations = data;
|
|
}
|
|
}
|
|
})
|
|
.catch((error) =>
|
|
console.log(error)
|
|
);
|
|
},
|
|
getPopular() {
|
|
this.$axios
|
|
.get(`/trending/api/Exhibition/Popular?Lang=${this.$i18n.localeProperties["langQuery"]}&Count=10`)
|
|
.then((response) => {
|
|
if(response && response.data && response.data.DATA && response.data.DATA.rel){
|
|
let data = response.data.DATA.rel
|
|
if(data.length>0){
|
|
let arr = [];
|
|
for(let i=0;i<data.length;i++){
|
|
let target = {};
|
|
target.name = data[i].ExhibitionName;
|
|
target.id = data[i].ExhibitionID;
|
|
target.url = "/exhibition/" + data[i].ExhibitionID;
|
|
arr.push(target);
|
|
}
|
|
this.categories = arr;
|
|
}
|
|
}
|
|
})
|
|
.catch((error) =>
|
|
console.log(error)
|
|
);
|
|
},
|
|
}
|
|
};
|
|
</script>
|
|
<style lang="scss" scoped>
|
|
|
|
</style>
|