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.
53 lines
1.6 KiB
53 lines
1.6 KiB
<script setup>
|
|
const route=useRoute();
|
|
|
|
const activityData = computed(() => res.value.data);
|
|
// 取得活動資料
|
|
const { data: res } = await useMyFetch('/social/getActivity', "GET", {id: route.params.id})
|
|
|
|
onMounted(() => {
|
|
Fancybox.bind("[data-fancybox]");
|
|
});
|
|
|
|
</script>
|
|
|
|
<template>
|
|
<div>
|
|
<div class="main social">
|
|
<section class="section">
|
|
<div class="container">
|
|
<div class="row">
|
|
<div class="col-12">
|
|
<div class="toolbar">
|
|
<div class="tTitle">公司活動</div>
|
|
</div>
|
|
<div class="content">
|
|
<div class="block">
|
|
<div class="bName mb-4">{{ activityData.title }}</div>
|
|
<div class="row">
|
|
<div class="col-12 col-md-6 col-lg-4 col-xl-3" v-for="(item,index) in activityData.imageList" :key="index">
|
|
<a :href="'https://prodio.zltest.com.tw'+item.url" class="card" data-fancybox="gallery" data-caption="Caption #1">
|
|
<div class="card-body">
|
|
<div class="imgCnt lg"><img :src="'https://prodio.zltest.com.tw'+item.url" alt=""></div>
|
|
</div>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
<div class="d-flex justify-content-end">
|
|
<a class="backBtn" @click="$router.back()" >back</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
</div>
|
|
|
|
</div>
|
|
</template>
|
|
|
|
<style lang="less">
|
|
|
|
</style>
|