%PDF-
%PDF-
Mini Shell
Mini Shell
<template>
<div class="md:px-8">
<section class="page-header relative mb-8 md:pb-20 px-8 flex flex-col items-center justify-center text-center bg-orange">
<img class="relative z-20 mb-8"
src="~assets/images/logo-white-small.svg" alt="Takeaseat" />
<h1 class="font-bold text-4xl md:text-5xl lg:text-7xl mb-8">Partnerships</h1>
<div class="relative z-20">
<a class="btn btn-primary" href="#register-interest">Register Interest</a>
</div>
<div class="page-header-bg z-10 absolute bottom-0 left-0 w-full h-full bg-no-repeat"></div>
</section>
<section class="bg-gray py-20 px-8 mb-8">
<div class="max-w-5xl mx-auto w-full">
<header class="text-center mb-8 max-w-3xl mx-auto w-full">
<h1 class="text-5xl font-bold mb-8">The challenge...</h1>
<div class="max-w-xl mx-auto w-full">
<p class="text-lg">For organisations to succeed in the current and post pandemic market, employee mental health has to be a priority. Poor mental health negatively impacts:</p>
</div>
</header>
<div class="flex flex-wrap items-center justify-center mb-10">
<div v-for="(effect, key) in effects"
v-bind:key="key"
class="flex items-center mx-3">
<svg class="w-8 h-8 mr-1 text-black" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12l2 2 4-4M7.835 4.697a3.42 3.42 0 001.946-.806 3.42 3.42 0 014.438 0 3.42 3.42 0 001.946.806 3.42 3.42 0 013.138 3.138 3.42 3.42 0 00.806 1.946 3.42 3.42 0 010 4.438 3.42 3.42 0 00-.806 1.946 3.42 3.42 0 01-3.138 3.138 3.42 3.42 0 00-1.946.806 3.42 3.42 0 01-4.438 0 3.42 3.42 0 00-1.946-.806 3.42 3.42 0 01-3.138-3.138 3.42 3.42 0 00-.806-1.946 3.42 3.42 0 010-4.438 3.42 3.42 0 00.806-1.946 3.42 3.42 0 013.138-3.138z" />
</svg>
<span class="text-lg">{{ effect.text }}</span>
</div>
</div>
<div class="grid grid-cols-1 md:grid-cols-3 gap-x-16 gap-y-10 mb-6">
<div class="text-sm leading-6">
<div class="flex items-end mb-6">
<h2 class="text-3xl font-medium">55%</h2>
</div>
<p class="text-lg mb-4">In 2019/20 stress, depression or anxiety accounted for 55% of all working days lost</p>
<p class="italic">HSE.Gov report 2020</p>
</div>
<div class="text-sm leading-6">
<div class="flex items-end mb-6">
<h2 class="text-3xl font-medium">£3,353</h2>
</div>
<p class="text-lg mb-4">Estimated cost of poor mental health on the private sector per employee</p>
<p class="italic">Deloitte: research - January 2020</p>
</div>
<div class="text-sm leading-6">
<div class="flex items-end mb-6">
<h2 class="text-3xl font-medium">1:4</h2>
</div>
<p class="text-lg mb-4">Number of people who will suffer with poor mental health in any given year</p>
<p class="italic">Deloitte: research - January 2020</p>
</div>
</div>
<div class="flex flex-col items-center justify-center">
<p class="text-lg my-8">What can you do?</p>
<a class="btn btn-primary" href="#register-interest">Talk to us</a>
</div>
</div>
</section>
<section class="bg-gray py-20 px-8 mb-8">
<div class="max-w-5xl mx-auto w-full">
<header class="text-center mb-12">
<h1 class="text-5xl font-bold mb-8">The Benefits</h1>
<div class="max-w-3xl mx-auto w-full">
<p class="text-lg mb-6">"Workplace counselling contributes to “significant improvements on most attitude-to-work factors: opportunity for control, skill use, job demand, clarity, feeling valued, interpersonal contact, competence, work spill-over, adequacy of pay and job satisfaction”. To put it another way, counselling leads to happier, more positive and secure employees."</p>
<p class="italic">2012 Cambridge University study</p>
</div>
</header>
<div class="grid grid-cols-1 md:grid-cols-2 gap-x-16 gap-y-10 mb-6">
<div class="text-sm leading-6">
<div class="flex items-end mb-6">
<h2 class="text-3xl font-medium">Reduced absence</h2>
</div>
<p class="text-lg">Ensuring employees stay in work for longer and come back quicker.</p>
</div>
<div class="text-sm leading-6">
<div class="flex items-end mb-6">
<h2 class="text-3xl font-medium">Profitability</h2>
</div>
<p class="text-lg">Not only reduce the cost of absence, presenteeism and churn but improve productivity from a more engaged, happy workforce.</p>
</div>
<div class="text-sm leading-6">
<div class="flex items-end mb-6">
<h2 class="text-3xl font-medium">Engagement</h2>
</div>
<p class="text-lg">Findings by Gallup show that highly engaged teams show 21% greater profitability - Those teams who score in the top 20% in engagement realise a 41% reduction in absenteeism, and 59% less turnover.</p>
</div>
<div class="text-sm leading-6">
<div class="flex items-end mb-6">
<h2 class="text-3xl font-medium">Retention</h2>
</div>
<p class="text-lg">Every time you lose an employee it costs you six to nine months’ salary on average? By creating a supportive culture, you can gain momentum to grow retain and recruit the best talent.</p>
</div>
</div>
<div class="flex flex-col items-center justify-center">
<p class="text-lg my-8">Speak to a specialist about nurturing your company mental health</p>
<a class="btn btn-primary" href="#register-interest">Talk to us</a>
</div>
</div>
</section>
<div class="grid grid-cols-1 lg:grid-cols-3 px-6 md:px-0 gap-10 mb-8">
<div class="box-one flex flex-col justify-between bg-blue-light bg-no-repeat bg-bottom p-8 py-10">
<div>
<div class="flex flex-col justify-center items-center sm:grid sm:grid-cols-2 mb-6">
<h2 class="order-2 sm:order-1 mt-3 sm:mt-0 text-3xl font-bold text-center sm:text-left">Therapy</h2>
<div class="order-1 sm:order-2 flex items-center justify-end">
<img src="~/assets/images/icons/icon-check.svg" alt="Therapy" />
</div>
</div>
<p class="leading-6 mb-6">Ten sessions with a qualified Integrative therapist. Giving staff time to gain skills in emotional intelligence, mental wellbeing and increased self esteem</p>
</div>
</div>
<div class="box-two flex flex-col justify-between bg-yellow bg-no-repeat bg-bottom p-8 py-10">
<div>
<div class="flex flex-col justify-center items-center sm:grid sm:grid-cols-2 mb-6">
<h2 class="order-2 sm:order-1 mt-3 sm:mt-0 text-3xl font-bold text-center sm:text-left">Workshops</h2>
<div class="order-1 sm:order-2 flex items-center justify-end">
<img src="~/assets/images/icons/icon-chat.svg" alt="Workshops" />
</div>
</div>
<p class="leading-6 mb-6">Online workshops to create a framework to access your resilience, understanding what it means to you and a toolkit to be proactive with your resilience</p>
</div>
</div>
<div class="box-three flex flex-col justify-between bg-gray bg-no-repeat bg-bottom p-8 py-10">
<div>
<div class="flex flex-col justify-center items-center sm:grid sm:grid-cols-2 mb-6">
<h2 class="order-2 sm:order-1 mt-3 sm:mt-0 text-3xl font-bold text-center sm:text-left">Leadership</h2>
<div class="order-1 sm:order-2 flex items-center justify-end">
<img src="~/assets/images/icons/icon-handshake.svg" alt="Leadership" />
</div>
</div>
<p class="leading-6 mb-6">Leadership training to create a culture of awareness and openness. Learn how to communicate with staff and improve employee relationships.</p>
</div>
</div>
</div>
<section class="bg-yellow text-center py-20 px-8 mb-8">
<div class="max-w-5xl mx-auto w-full">
<header class="text-center mb-8 max-w-3xl mx-auto w-full">
<h1 class="text-5xl font-bold mb-8">Why Us?</h1>
</header>
<p class="my-3 text-lg">Take a Seat is a brand for <strong class="font-bold">Innovators</strong></p>
<p class="my-3 text-lg">For employers who recognise that to grow their business it starts with their most valuable resource, people.</p>
<p class="my-3 text-lg">Creating a culture of support and development where investing in people means they are invested in you</p>
<p class="my-3 text-lg">Start Investing in your people for as little as £95 per session. Contact us below to get started</p>
<p class="text-lg mt-8 font-bold">Let's talk about your strategy</p>
</div>
</section>
<section v-if="success == false"
id="register-interest" class="bg-gray py-20 px-8 mb-8">
<div class="max-w-xl mx-auto w-full">
<header class="text-center mb-10">
<h2 class="text-2xl md:text-4xl font-bold">Register your interest</h2>
</header>
</div>
<div class="mx-auto w-full max-w-xl">
<span class="block mb-6 bg-red p-3 text-center text-sm text-white rounded-lg"
v-if="error">{{ error }}</span>
<ValidationObserver ref="form">
<form @submit.prevent="signup" role="form" method="POST">
<div class="grid grid-cols-1 md:grid-cols-2 gap-x-4">
<t-input-group label="First Name">
<ValidationProvider rules="required" v-slot="{ errors }">
<t-input v-model="form.firstname" name="firstname" id="firstname" />
<span class="text-red text-xs px-2 mt-3" v-if="errors[0]">{{ errors[0] }}</span>
</ValidationProvider>
</t-input-group>
<t-input-group label="Last Name">
<ValidationProvider rules="required" v-slot="{ errors }">
<t-input v-model="form.lastname" name="lastname" id="lastname" />
<span class="text-red text-xs px-2 mt-3" v-if="errors[0]">{{ errors[0] }}</span>
</ValidationProvider>
</t-input-group>
</div>
<t-input-group label="Email">
<ValidationProvider name="Email" rules="required|email" v-slot="{ errors }">
<t-input v-model="form.email" name="email" id="email" />
<span class="text-red text-xs px-2 mt-3" v-if="errors[0]">{{ errors[0] }}</span>
</ValidationProvider>
</t-input-group>
<t-input-group label="Phone">
<t-input v-model="form.phone" name="phone" id="phone" />
</t-input-group>
<ValidationProvider name="Consent" rules="required" v-slot="{ errors }">
<label class="flex items-center px-3 mb-3">
<t-checkbox
v-model="form.consent"
name="constent" />
<span class="block text-sm pl-2.5">I agree to allow Take a seat to store and process my personal data.</span>
</label>
<span class="text-red text-xs px-2 mt-3" v-if="errors[0]">{{ errors[0] }}</span>
</ValidationProvider>
<label class="flex items-center px-3 mb-6">
<t-checkbox
v-model="form.communications"
name="constent" />
<span class="block text-sm pl-2.5">I agree to receive marketing communications from Take a seat.</span>
</label>
<div class="flex items-center justify-center">
<button class="relative z-20 block px-6 py-3 text-center bg-black border border-black text-white font-medium rounded-full hover:bg-white hover:text-black hover:shadow-lg focus:ring-none focus:outline-none transition ease-in-out duration-200"
type="submit">
<span v-if="working == false">Submit</span>
<span
class="flex items-center justify-center"
v-else>
<svg class="animate-spin -ml-1 mr-3 h-5 w-5 text-current" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24">
<circle class="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" stroke-width="4"></circle>
<path class="opacity-75" fill="currentColor" d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"></path>
</svg>
<span>Hold on tight!</span>
</span>
</button>
</div>
</form>
</ValidationObserver>
</div>
</section>
<section v-else
id="register-interest" class="bg-gray py-20 px-8 mb-8">
<div class="mx-auto w-full max-w-xl text-center success-message">
<div v-html="message.inlineMessage"></div>
</div>
</section>
</div>
</template>
<script>
export default {
head () {
return {
titleTemplate: 'Partnerships | %s',
}
},
data() {
return {
effects: [
{ text: 'Productivity' },
{ text: 'Churn' },
{ text: 'Engagement' },
{ text: 'Absence' },
{ text: 'Overall culture' }
],
working: false,
portal_id: '6337642',
form_guid: 'e7755638-df09-4484-8f50-6e5be7855eef',
success: false,
error: '',
message: '',
form: {
firstname: '',
lastname: '',
email: '',
phone: '',
consent: true,
communications: true
}
}
},
methods: {
async signup() {
this.$refs.form.validate().then(success => {
if (!success) {
return;
}
let hubspotutk = document.cookie.split('; ')
.find(row => row.startsWith('hubspotutk='))
.split('=')[1];
const contactObject = {
"fields": [
{
"name": "counsellor",
"value": "Partnership"
},
{
"name": "email",
"value": this.form.email
},
{
"name": "firstname",
"value": this.form.firstname
},
{
"name": "lastname",
"value": this.form.lastname
},
{
"name": "phone",
"value": this.form.phone
}
],
"context": {
"hutk": hubspotutk,
"pageUri": "https://www.takeaseat.co.uk/partnerships",
"pageName": "Takeaseat Partnerships Landing Page"
},
"legalConsentOptions": {
"consent": { // Include this object when GDPR options are enabled
"consentToProcess": this.form.consent,
"text": "I agree to allow Take a seat to store and process my personal data.",
"communications": [
{
"value": this.form.communications,
"subscriptionTypeId": 999,
"text": "I agree to receive marketing communications from Take a seat."
}
]
}
}
};
this.error = '';
this.working = true;
this.$axios.post('https://api.hsforms.com/submissions/v3/integration/submit/'+this.portal_id+'/'+this.form_guid, contactObject)
.then((response) => {
if(response.status == 200) {
this.success = true;
this.message = response.data;
}
}).catch(error => {
this.working = false;
if (error.response && error.response.status === 400) {
this.error = 'Oops, something went wrong, please check your information and try again.';
}
})
})
}
}
}
</script>
<style scoped>
.page-header {
min-height: 350px;
height: 70vh;
}
.page-header-bg {
background-image: url('~assets/images/pageheader-bg.svg');
background-position: bottom center;
background-size: calc(100% + 2px) auto;
border-bottom: 100px solid rgba(255, 255, 255, 0.3);
}
.box-one,
.box-two,
.box-three {
background-image: url('~assets/images/pageheader-bg.svg');
background-size: auto 33%;
}
.box-one {
background-position: bottom left;
}
.box-two {
background-position: bottom center;
}
.box-three {
background-position: bottom right;
}
</style>
Zerion Mini Shell 1.0