91 lines
3.6 KiB
Vue
91 lines
3.6 KiB
Vue
<script setup>
|
|
import { Link, usePage } from '@inertiajs/vue3';
|
|
import { onMounted, defineProps, computed } from 'vue';
|
|
import { initFlowbite } from 'flowbite';
|
|
import { marked } from 'marked';
|
|
|
|
const { block, blockData, frontpage } = defineProps({
|
|
block: {
|
|
type: Object,
|
|
required: true,
|
|
},
|
|
blockData: {
|
|
type: Object,
|
|
default: () => ({})
|
|
},
|
|
frontpage: {
|
|
type: Boolean
|
|
}
|
|
});
|
|
|
|
onMounted(() => {
|
|
initFlowbite();
|
|
});
|
|
|
|
const page = usePage();
|
|
const userRoles = computed(() => page.props.userRoles);
|
|
|
|
/**
|
|
* Check if the user has the given role.
|
|
*
|
|
* @param string roleName
|
|
* @return boolean
|
|
*/
|
|
|
|
const hasRole = (roleName) => userRoles.value.includes(roleName);
|
|
|
|
/**
|
|
* Calculates the number of days until dd.mm.YYYY
|
|
*
|
|
* @param string date
|
|
* @return string
|
|
*/
|
|
|
|
const calculateDaysUntil = (dateStr) => {
|
|
const [day, month, year] = dateStr.split('.');
|
|
const targetDate = new Date(year, month - 1, day);
|
|
|
|
const today = new Date();
|
|
today.setHours(0, 0, 0, 0);
|
|
|
|
const differenceInMilliseconds = targetDate - today;
|
|
const differenceInDays = differenceInMilliseconds / (1000 * 60 * 60 * 24);
|
|
|
|
return Math.floor(differenceInDays);
|
|
};
|
|
</script>
|
|
|
|
<template>
|
|
<section :id="block.anchorName" class="relative block w-full h-screen overflow-hidden">
|
|
<div class="absolute inset-0 bg-cover" :style="{ backgroundImage: `url('${block.image}')` }"></div>
|
|
<div class="absolute inset-0 bg-black opacity-80"></div>
|
|
<div class="absolute p-12 w-full overflow-auto" style="top: 0; bottom: 0;">
|
|
<div class="flex-row justify-center items-center">
|
|
<h1 class="text-center text-white font-arctic text-2xl md:text-4xl">{{ block.title || 'Medlemskap' }}</h1>
|
|
</div>
|
|
|
|
<div class="mx-auto max-w-[1280px]">
|
|
<p v-if="block.showprices" class="mt-2 text-white">
|
|
Prisen for medlemskap er
|
|
{{ page.props.pageSettings['membership_fee'] }},- kr per år for voksne eller {{ page.props.pageSettings['membership_child_fee'] }}
|
|
for barn/ungdom under {{ page.props.pageSettings['membership_child_age_limit'] }} år. Du må være
|
|
{{ page.props.pageSettings['membership_age_limit'] }} år eller eldre for å bli medlem hos oss. Medlemskapet
|
|
varer i {{ page.props.pageSettings['membership_time_interval_months'] }} måneder
|
|
<span v-if="page.props.pageSettings['membership_annual']"> eller ut kalenderåret </span>
|
|
før det må fornyes. Betalinger kan gjøres på nettsiden via vipps <span v-if="page.props.pageSettings['module_stripe_payment']">eller bankkort</span> ved å besøke
|
|
<Link :href="route('page-builder.index')" class="text-amber-400 hover:text-amber-300 underline hover:no-underline">
|
|
din medlemsside
|
|
</Link>
|
|
.
|
|
</p>
|
|
<p v-if="$page.props.auth.user && block.showprices" class="mt-2 text-white">
|
|
<span class="font-semibold">Merk:</span> Priser og betingelser kan variere. Besøk medlemssiden for å se
|
|
dine spesifike betingelser.
|
|
</p>
|
|
<div class="mt-2 text-white memberShipBlock" v-html="marked(block.text)">
|
|
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
</template> |