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.
 
 

565 lines
21 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 v-if="focusExhibitionlist1.length>0 || focusExhibitionlist2.length>0" :focusExhibitionlist1="focusExhibitionlist1" :focusExhibitionlist2="focusExhibitionlist2"></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: '/service?taiwan=taiwan'
},
{
id: 'banner_2',
image: require('/assets/img/banner/banner_2.png'),
url: 'https://www.eurotran.com/TE/service.html?Id=cc92b3d8-f689-4461-8441-409eecf332cc'
},
{
id: 'banner_5',
image: require('/assets/img/banner/banner_5.png'),
url: 'https://docs.google.com/forms/d/e/1FAIpQLSeKj0NWt1KWBiQxFXDv4n5qdAiDTfB9VOUqv_x9N97XGhZGxw/viewform'
}
],
advertisementList: [{
image: require('/assets/img/Frame.jpg'),
url: '/exhibition/2a3e37c2-195c-4ab6-8ee8-663f0b00451d'
},{
image: require('/assets/img/Frame.jpg'),
url: '/exhibition/2a3e37c2-195c-4ab6-8ee8-663f0b00451d'
},{
image: require('/assets/img/Frame.jpg'),
url: '/exhibition/2a3e37c2-195c-4ab6-8ee8-663f0b00451d'
}
],
focusExhibitionlist1: [],
focusExhibitionlist2: [],
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: 'NTD',
},{
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: 'NTD',
},{
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: 'NTD',
},{
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: 'NTD',
}],
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,
},
async created() {
// this.getBanner();
await this.getBaseInfo();
await this.getCategories();
await this.getLocations();
await this.getPopular();
await this.getCategoryExhibition1();
await this.getCategoryExhibition2();
await this.getPopularCountry();
await this.getPopularCategory();
// 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.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)
// );
// },
async getBaseInfo(){
await 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)
);
},
async getPopularCountry() {
await this.$axios
.get(`/trending/api/Exhibition/PopularCountry?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].CountryName;
target.id = data[i].CountryID;
target.url = "/exhibition?country=" + data[i].CountryID;
arr.push(target);
}
this.countries = arr;
}
}
})
.catch((error) =>
console.log(error)
);
},
async getCategories() {
await 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)
);
},
async getLocations() {
await 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)
);
},
async getPopular() {
await 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.cards = arr;
}
}
})
.catch((error) =>
console.log(error)
);
},
async getCategoryExhibition1() {
await this.$axios
.get(`/trending/api/Exhibition/CategoryExhibition?Lang=${this.$i18n.localeProperties["langQuery"]}&IncludeCountryIDs=['995384cd-f908-48ad-96a9-0e150e9b0eac']&ExcludeCountryIDs`)
.then((response) => {
if(response && response.data && response.data.DATA && response.data.DATA.rel){
let data = response.data.DATA.rel
if(data.length>0){
this.focusExhibitionlist1 = data;
// 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)
);
},
async getCategoryExhibition2() {
await this.$axios
.get(`/trending/api/Exhibition/CategoryExhibition?Lang=${this.$i18n.localeProperties["langQuery"]}&IncludeCountryIDs&ExcludeCountryIDs=['995384cd-f908-48ad-96a9-0e150e9b0eac']`)
.then((response) => {
if(response && response.data && response.data.DATA && response.data.DATA.rel){
let data = response.data.DATA.rel
if(data.length>0){
this.focusExhibitionlist2 = data;
// 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)
);
},
async getPopularCategory() {
await this.$axios
.get(`/trending/api/Exhibition/PopularCategory?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].CategoryName;
target.id = data[i].CategoryID;
target.url = "/exhibition?category=" + data[i].CategoryID;
arr.push(target);
}
this.categories = arr;
}
}
})
.catch((error) =>
console.log(error)
);
},
}
};
</script>
<style lang="scss" scoped>
</style>