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.
114 lines
3.2 KiB
114 lines
3.2 KiB
<template>
|
|
<v-card
|
|
class="border-neutrals-dark2 border-radius-20 elevation-0 mx-5 my-sm-2 text-size-12"
|
|
width="388px"
|
|
height="165px"
|
|
>
|
|
<v-row>
|
|
<v-col cols="3">
|
|
<unicon
|
|
class="mt-5 ml-6"
|
|
width="14"
|
|
height="20"
|
|
name="bookmark"
|
|
fill="#F5CDA8"
|
|
/>
|
|
<v-img
|
|
class="mt-n2 ml-4"
|
|
:src="item.logo"
|
|
width="90px"
|
|
height="65px"
|
|
></v-img>
|
|
</v-col>
|
|
<v-col cols="9">
|
|
<span
|
|
v-if="item.isRecommend == false"
|
|
width="auto"
|
|
class="my-1 px-2 neutrals--text primary recommend-tag no-text-transform text-size-8 text-space-1 rounded-xl d-inline-block border-primary-light"
|
|
>
|
|
<unicon fill="#FEFEFE" name="award" width="8px" height="8px"></unicon>
|
|
{{ $t("recommend") }}
|
|
</span>
|
|
<span
|
|
v-if="Object.keys(item.status).length != 0"
|
|
class="my-1 px-2 neutrals primary--text recommend-tag no-text-transform text-size-8 text-space-1 elevation-0 rounded-xl d-inline-block border-primary-light"
|
|
>
|
|
{{ item.status ? item.status.name : "" }}
|
|
</span>
|
|
<div class="my-1">
|
|
<b>{{ item.name }}</b>
|
|
</div>
|
|
<div class="my-1text-size-10 neutrals--text text--darken-3">
|
|
{{ item.region ? item.region.name : "" }}．{{
|
|
item.city ? item.city.name : ""
|
|
}}．{{ item.country ? item.country.name : "" }}
|
|
</div>
|
|
<div>
|
|
<div>
|
|
<span
|
|
class="my-1 px-2 primary--text no-text-transform text-space-1 text-size-10 elevation-0 d-inline-block rounded-xl border-primary-nude"
|
|
v-for="(category, index) in item.categories"
|
|
:key="index"
|
|
>
|
|
{{ category.name ? category.name : "" }}
|
|
</span>
|
|
</div>
|
|
</div>
|
|
<div class="my-1">
|
|
<!-- {{ item.startdate ? item.startdate.replaceAll("-", ".") : "" }} -
|
|
{{ item.enddate ? item.enddate.replaceAll("-", ".") : "" }} -->
|
|
</div>
|
|
<div
|
|
class="my-1 neutrals--text text--darken-3"
|
|
v-html="
|
|
$t('Coming Soon in day', {
|
|
days:
|
|
'<b style=\'color: #ef5a5a\'>' +
|
|
dateCountDown(item.startdate) +
|
|
'</b>',
|
|
})
|
|
"
|
|
></div>
|
|
</v-col>
|
|
</v-row>
|
|
</v-card>
|
|
</template>
|
|
|
|
<script>
|
|
import { dateCountDown } from "~/utils/assist";
|
|
export default {
|
|
name: "ExhibitionYouMightLike",
|
|
methods: {
|
|
dateCountDown,
|
|
},
|
|
props: {
|
|
item: {
|
|
type: Object,
|
|
default: () => ({
|
|
name: "",
|
|
logo: "",
|
|
category: {},
|
|
status: [],
|
|
isRecommend: false,
|
|
startdate: "",
|
|
enddate: "",
|
|
region: {},
|
|
city: {},
|
|
country: {},
|
|
}),
|
|
},
|
|
},
|
|
};
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.border-primary-light {
|
|
border: 1px solid #f5cda8 !important;
|
|
}
|
|
.border-primary-nude {
|
|
border: 1px solid #f7ede4 !important;
|
|
}
|
|
.border-neutrals-dark2 {
|
|
border: 1px solid #e5e5e5 !important;
|
|
}
|
|
</style>
|