nelson.kai
/
ShowEasyFrontEnd
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

[WHAT] 展覽ID頁開發，展覽列表頁調整

Dev
berlin-tzen 2 years ago
parent
a68c60d71a
commit
7d7e20005e
2 changed files with 193 additions and 130 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 30
      FrontEnd/pages/exhibition/_id.vue
  2. 293
      FrontEnd/pages/exhibition/index.vue

30
FrontEnd/pages/exhibition/_id.vue
View File

@ -251,6 +251,7 @@ export default {
currStep: null,
fixBar: false,
fixBarList: [],
};
},
async created() {
@ -383,7 +384,7 @@ export default {
getExhibitionCard() {
this.exhibitionID = this.$route.params.id;
console.log(this.exhibitionID);
this.$axios
.get(
`/trending/api/Exhibition/Exhibition?Lang=${this.$i18n.localeProperties["langQuery"]}` +
@ -433,6 +434,8 @@ export default {
this.exhibition.categories = exhib.MainCategories;
this.exhibition.subcategories = exhib.SubCategories;
this.setSideBarList();
}
})
@ -451,6 +454,31 @@ export default {
image: require('/assets/img/thems/Frame33.png')
}]
},
setSideBarList() {
if (this.relatedservicelist.size > 0) {
this.fixBarList.push({ id: "relatedServices", title: "Related Services", show: true });
}
if (this.exhibition.videos.size > 0 || this.exhibition.gallery.size > 0) {
this.fixBarList.push({ id: "photoGallery", title: "Photo & Video Gallery", show: true });
}
if (this.exhibition.venues) {
this.fixBarList.push({ id: "venue", title: "Venue", show: true });
}
if (this.exhibition.profile) {
this.fixBarList.push({ id: "exhibitProfile", title: "Exhibit Profile", show: true });
}
if (this.exhibition.description) {
this.fixBarList.push({ id: "detailedDescription", title: "Detailed Description", show: true });
}
},
introCheck(entries, observer, isIntersecting) {
this.navControl.mobnav = !isIntersecting;

293
FrontEnd/pages/exhibition/index.vue
View File

@ -11,7 +11,7 @@
</section>
<section class="tw-grid tw-grid-cols-1 tw-gap-[30px] tw-auto-rows-min">
<div class="tw-max-h-min" v-if="$vuetify.breakpoint.xl">
<DateCard @update="updateDateFilter" :modalChecked="datesChecked" />
<DateCard @update="updateDateFilter" :modalChecked="selectedDates" />
</div>
<div v-if="$vuetify.breakpoint.xl">
<oneLevel :label="'Show Status'" :list="statuses" @update="updateStatusFilter"></oneLevel>
@ -36,16 +36,15 @@
</div>
</section> -->
<section class="">
<ExhibitionListCard v-for="(item, index) in exhibitionList" :key="index" :item="item"
></ExhibitionListCard>
<ExhibitionListCard v-for="(item, index) in exhibitionList" :key="index" :item="item"></ExhibitionListCard>
<div class="tw-mt-[34px] tw-flex tw-justify-end">
<pagination :pageLength="pageLength" @update="updatePage"></pagination>
</div>
</section>
<div v-if="!$vuetify.breakpoint.xl">
<ShowSidebarFilterModal :statusList="statuses" :locationList="locations" :categoryList="categories"
:statusChecked="statusesChecked" :locationChecked="locationChecked" :categoryChecked="categoryChecked"
:datesChecked="datesChecked" @updateCategoryFilter="updateCategoryFilter"
:statusChecked="selectedStatus" :locationChecked="locationChecked" :categoryChecked="categoryChecked"
:datesChecked="selectedDates" @updateCategoryFilter="updateCategoryFilter"
@updateLocationFilter="updateLocationFilter" @updateStatusFilter="updateStatusFilter"
@updateDateFilter="updateDateFilter"></ShowSidebarFilterModal>
</div>
@ -212,38 +211,33 @@ export default {
perPage: 10,
adList: [],
exhibitionList: [],
datesChecked: [],
statusesChecked: [],
categoryChecked: [],
locationChecked: [],
ratingChecked: [],
selectedStatusJson: "",
locations: [],
selectedDates: [],
selectedStatus: [],
statusMap: new Map(),
regionMap: new Map(),
countryMap: new Map(),
cityMap: new Map(),
selectedRegionJson: "",
selectedCountryJson: "",
selectedCityJson: "",
mainCategoryMap: new Map(),
subCategoryMap: new Map(),
selectedMainCategoryJson: "",
selectedSubCategoryJson: "",
selectedMainCategory: [],
selectedSubCategory: [],
selectedRegion: [],
selectedCountry: [],
selectedCity: [],
favoriteSet: new Set(),
categories: [],
unsortRegionList: [],
unsortCountryList: [],
unsortCityList: [],
unsortCategoryList: [],
unsortSubcategoryList: [],
categoryQueryFilter: "",
locationQueryFilter: "",
width: undefined,
@ -254,15 +248,17 @@ export default {
{ name: "ExhibitorCount", value: "exhibition.ExhibitorCount" },
{ name: "VisitorCount", value: "exhibition.VisitorCount" },
],
sortBy: "Show Dates",
sortBy: "ShowDate",
}),
async created() {
this.isPageLoading = true;
this.getAdList();
this.getStatusList();
this.getLocationList();
this.getCategoryList();
this.getFavorite();
this.getExhibitionCard();
// this.getQuery();
// await this.getUnsortLocationList();
// await this.getUnsortCategoryList();
// await this.getQuery();
@ -273,32 +269,32 @@ export default {
// });
// this.sortBy = "ShowEasy Recommended";
// }
let userSavedList = [];
if (this.$auth.loggedIn) {
// await this.$axios
// .get(
// `/member/users/${this.$auth.$storage.getUniversal("jwt").user_id
// }?jwt=${this.$auth.$storage.getUniversal("jwt").token}`
// )
// .then((res) => {
// userSavedList = res.data.UserExhibition;
// })
// .catch((err) => {
// console.log(err);
// });
// this.$store.dispatch("updatePicture");
// this.$nextTick(() => {
// this.$forceUpdate();
// });
}
userSavedList = userSavedList.map((item) => item.exhibition_id);
for (let i = 0; i < this.exhibitionList.length; i++) {
if (userSavedList.includes(this.exhibitionList[i].id)) {
this.exhibitionList[i].saved = true;
} else {
this.exhibitionList[i].saved = false;
}
}
// let userSavedList = [];
// if (this.$auth.loggedIn) {
// // await this.$axios
// // .get(
// // `/member/users/${this.$auth.$storage.getUniversal("jwt").user_id
// // }?jwt=${this.$auth.$storage.getUniversal("jwt").token}`
// // )
// // .then((res) => {
// // userSavedList = res.data.UserExhibition;
// // })
// // .catch((err) => {
// // console.log(err);
// // });
// // this.$store.dispatch("updatePicture");
// // this.$nextTick(() => {
// // this.$forceUpdate();
// // });
// }
// userSavedList = userSavedList.map((item) => item.exhibition_id);
// for (let i = 0; i < this.exhibitionList.length; i++) {
// if (userSavedList.includes(this.exhibitionList[i].id)) {
// this.exhibitionList[i].saved = true;
// } else {
// this.exhibitionList[i].saved = false;
// }
// }
if (process.client) {
this.width = window.innerWidth;
}
@ -307,32 +303,32 @@ export default {
});
},
async mounted() {
let userSavedList = [];
if (this.$auth.loggedIn) {
// await this.$axios
// .get(
// `/member/users/${this.$auth.$storage.getUniversal("jwt").user_id
// }?jwt=${this.$auth.$storage.getUniversal("jwt").token}`
// )
// .then((res) => {
// userSavedList = res.data.UserExhibition;
// })
// .catch((err) => {
// console.log(err);
// });
// this.$store.dispatch("updatePicture");
// this.$nextTick(() => {
// this.$forceUpdate();
// });
}
userSavedList = userSavedList.map((item) => item.exhibition_id);
for (let i = 0; i < this.exhibitionList.length; i++) {
if (userSavedList.includes(this.exhibitionList[i].id)) {
this.exhibitionList[i].saved = true;
} else {
this.exhibitionList[i].saved = false;
}
}
// let userSavedList = [];
// if (this.$auth.loggedIn) {
// // await this.$axios
// // .get(
// // `/member/users/${this.$auth.$storage.getUniversal("jwt").user_id
// // }?jwt=${this.$auth.$storage.getUniversal("jwt").token}`
// // )
// // .then((res) => {
// // userSavedList = res.data.UserExhibition;
// // })
// // .catch((err) => {
// // console.log(err);
// // });
// // this.$store.dispatch("updatePicture");
// // this.$nextTick(() => {
// // this.$forceUpdate();
// // });
// }
// userSavedList = userSavedList.map((item) => item.exhibition_id);
// for (let i = 0; i < this.exhibitionList.length; i++) {
// if (userSavedList.includes(this.exhibitionList[i].id)) {
// this.exhibitionList[i].saved = true;
// } else {
// this.exhibitionList[i].saved = false;
// }
// }
this.$nextTick(() => {
window.addEventListener("resize", this.onResize);
});
@ -359,9 +355,9 @@ export default {
},
$route() {
console.table(this.$route);
// console.table(this.$route);
this.getQuery();
// this.getQuery();
},
},
methods: {
@ -521,16 +517,35 @@ export default {
});
},
getExhibitionCard() {
let vm = this;
if (this.$route.query.category) {
vm.categoryQueryFilter = vm.$route.query.category;
this.selectedMainCategory.push(vm.$route.query.category);
}
if (this.$route.query.subcategory) {
vm.categoryQueryFilter = vm.$route.query.category;
this.selectedSubCategory.push(vm.$route.query.subcategory);
}
if (this.$route.query.country) {
vm.locationQueryFilter = vm.$route.query.country;
this.selectedCountry.push(vm.$route.query.country);
}
this.$axios
.get(
`/trending/api/Exhibition/Cards?Lang=${this.$i18n.localeProperties["langQuery"]}` +
`&RegionIDs=${this.selectedRegionJson}` +
`&CountryIDs=${this.selectedCountryJson}` +
`&CityIDs=${this.selectedCityJson}` +
`&MainCategoryIDs=${this.selectedMainCategoryJson}` +
`&SubCategoryIDs=${this.selectedSubCategoryJson}` +
`&Status=${this.selectedStatusJson}` +
`&Date=${JSON.stringify(this.datesChecked)}` +
`&RegionIDs=${JSON.stringify(this.selectedRegion)}` +
`&CountryIDs=${JSON.stringify(this.selectedCountry)}` +
`&CityIDs=${JSON.stringify(this.selectedCity)}` +
`&MainCategoryIDs=${JSON.stringify(this.selectedMainCategory)}` +
`&SubCategoryIDs=${JSON.stringify(this.selectedSubCategory)}` +
`&Status=${JSON.stringify(this.selectedStatus)}` +
`&Date=${JSON.stringify(this.selectedDates)}` +
`&Sort=${this.sortBy}`
)
.then((result) => {
@ -552,36 +567,36 @@ export default {
if (this.$auth.loggedIn) {
this.$axios
.get(
`/trending/api/Favorite/Favorites?Type=Exhibition`
)
.then((result) => {
.get(
`/trending/api/Favorite/Favorites?Type=Exhibition`
)
.then((result) => {
if (result.data.DATA.rel) {
if (result.data.DATA.rel) {
let favoriteList = [];
favoriteList = result.data.DATA.rel;
let favoriteList = [];
favoriteList = result.data.DATA.rel;
favoriteList.forEach(item => {
favoriteList.forEach(item => {
this.favoriteSet.add(item.ParentID);
this.favoriteSet.add(item.ParentID);
})
}
})
}
})
.catch((err) => {
console.log(err);
});
})
.catch((err) => {
console.log(err);
});
}
},
setFavorite() {
if(this.exhibitionList.length > 0 && this.$auth.loggedIn) {
if (this.exhibitionList.length > 0 && this.$auth.loggedIn) {
for(let i =0; i < this.exhibitionList.length; i++) {
for (let i = 0; i < this.exhibitionList.length; i++) {
if (this.favoriteSet.has(this.exhibitionList[i].ExhibitionID)) {
@ -599,91 +614,111 @@ export default {
this.sortBy = data;
this.getExhibitionCard();
},
updatePage(value) {
this.page = value;
},
updateCategoryFilter(value) {
var SelectedMainCategoryArray = [];
var SelectedSubCategoryArray = [];
this.selectedMainCategoryJson = "";
this.selectedSubCategoryJson = "";
this.selectedMainCategory = [];
this.selectedSubCategory = [];
value.forEach(key => {
if (this.mainCategoryMap.has(key)) {
SelectedMainCategoryArray.push(key);
this.selectedMainCategory.push(key);
}
if (this.subCategoryMap.has(key)) {
SelectedSubCategoryArray.push(key);
this.selectedSubCategory.push(key);
}
});
this.selectedMainCategoryJson = JSON.stringify(SelectedMainCategoryArray);
this.selectedSubCategoryJson = JSON.stringify(SelectedSubCategoryArray);
this.getExhibitionCard();
},
updateLocationFilter(value) {
var SelectedRegionArray = [];
var SelectedCountryArray = [];
var SelectedCityArray = [];
this.selectedRegionJson = "";
this.selectedCountryJson = "";
this.selectedCityJson = "";
this.selectedRegion = [];
this.selectedCountry = [];
this.selectedCity = [];
value.forEach(key => {
if (this.regionMap.has(key)) {
SelectedRegionArray.push(key);
this.selectedRegion.push(key);
}
if (this.countryMap.has(key)) {
SelectedCountryArray.push(key);
this.selectedCountry.push(key);
}
if (this.cityMap.has(key)) {
SelectedCityArray.push(key);
this.selectedCity.push(key);
}
});
this.selectedRegionJson = JSON.stringify(SelectedRegionArray);
this.selectedCountryJson = JSON.stringify(SelectedCountryArray);
this.selectedCityJson = JSON.stringify(SelectedCityArray);
this.getExhibitionCard();
},
updateStatusFilter(value) {
var SelectedStatusArray = [];
this.selectedStatusJson = "";
this.selectedStatus = [];
value.forEach(key => {
if (this.statusMap.has(key)) {
SelectedStatusArray.push(key);
this.selectedStatus.push(key);
}
});
this.selectedStatusJson = JSON.stringify(SelectedStatusArray);
this.getExhibitionCard();
},
updateDateFilter(value) {
this.datesChecked = value;
this.selectedDates = value;
this.getExhibitionCard();
},
async getQuery() {
let vm = this;
this.categoryQueryFilter = "";
this.locationQueryFilter = "";
// if (this.$route.query.hasOwnProperty("country") && this.countryNameList.length>0) {
// this.locationQueryFilter =
// this.countryNameList[Number(this.$route.query.country)];
// }
// if (this.$route.query.hasOwnProperty("city") && this.cityNameList.length>0) {
// this.locationQueryFilter =
// this.cityNameList[Number(this.$route.query.city)];
// }
// if (this.$route.query.hasOwnProperty("region")) {
// this.locationQueryFilter =
// this.regionNameList[Number(this.$route.query.region)];
// }
// if (this.$route.query.hasOwnProperty("category") && this.categoryNameList.length>0) {
// this.categoryQueryFilter =
// this.categoryNameList[Number(this.$route.query.category)];
// }
// if (this.$route.query.hasOwnProperty("subcategory")) {
// this.categoryQueryFilter =
// this.unsortSubcategoryList[Number(this.$route.query.subcategory)];
// }
if (vm.$route.query.hasOwnProperty("category")) {
vm.categoryQueryFilter = vm.$route.query.category;
}
if (vm.$route.query.hasOwnProperty("country")) {
vm.locationQueryFilter = vm.$route.query.country;
}
},
sortServiceList(data) {
switch (this.sortBy) {
case "ShowEasy Recommended":

Write Preview
Loading…
Cancel
Save