<template>
	<v-card>
		<v-card-text>
			<!-- The banner message -->
			<v-text-field
				textarea
				:label="labels.bannerMessage"
				:name="`${ name }[message]`"
				v-model="options.message"
			/>
			<!-- The banner message for re-consent -->
			<v-text-field
				textarea
				:label="labels.reconsentBannerMessage"
				:name="`${ name }[reconsentMessage]`"
				v-model="options.reconsentMessage"
			/>
			<!-- Whether the banner is active or not -->
			<v-switch
				:hint="labels.whenBuilding"
				:label="activeLabel"
				v-model="options.active"
				persistent-hint
			/>
			<input type="hidden"
				:name="`${ name }[active]`"
				v-model="options.active"
			/>
		</v-card-text>
	</v-card>
</template>
<script>

	export default {

		name: 'Other',

		data() {
			return {
				labels  : window.GDPR_VISITOR_CONSENT_TEXT,
				options : window.GDPR_VISITOR_CONSENT_DATA.otherOptions,
				name    : window.GDPR_VISITOR_CONSENT_DATA.otherOptionsName,
			};
		},

		computed: {

			activeLabel() {
				if ( this.options.active ) {
					return this.labels.bannerActive;
				}
				return this.labels.bannerInactive;
			},

		},

	};

</script>
