Form password customization (#286)

* feat: add seo, cover, logo and description to password protected forms

* add seo meta to password protected form

* fix: unused method and fixed form button color error

---------

Co-authored-by: Julien Nahum <julien@nahum.net>
This commit is contained in:
Favour Olayinka 2024-01-29 21:26:01 +01:00 committed by GitHub
parent 000b65d4db
commit e4531ac918
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 12 additions and 6 deletions

View File

@ -77,16 +77,22 @@ class FormResource extends JsonResource
return [ return [
'id' => $this->id, 'id' => $this->id,
'title' => $this->title, 'title' => $this->title,
'description' => $this->description,
'slug' => $this->slug, 'slug' => $this->slug,
'custom_code' => $this->custom_code, 'custom_code' => $this->custom_code,
'dark_mode' => $this->dark_mode, 'dark_mode' => $this->dark_mode,
'transparent_background' => $this->transparent_background, 'transparent_background' => $this->transparent_background,
'color' => $this->color, 'color' => $this->color,
'theme' => $this->theme,
'is_password_protected' => true, 'is_password_protected' => true,
'has_password' => $this->has_password, 'has_password' => $this->has_password,
'width' => 'centered', 'width' => 'centered',
'no_branding' => $this->no_branding, 'no_branding' => $this->no_branding,
'properties' => [] 'properties' => [],
'logo_picture' => $this->logo_picture,
'seo_meta' => $this->seo_meta,
'cover_picture' => $this->cover_picture,
]; ];
} }

View File

@ -1,6 +1,8 @@
<template> <template>
<div v-if="form" class="open-complete-form"> <div v-if="form" class="open-complete-form">
<h1 v-if="!isHideTitle" class="mb-4 px-2" :class="{'mt-4':isEmbedPopup}" v-text="form.title" /> <h1 v-if="!isHideTitle" class="mb-4 px-2" :class="{'mt-4':isEmbedPopup}" v-text="form.title" />
<div v-if="form.description" v-html="form.description"
class="form-description mb-4 text-gray-700 dark:text-gray-300 whitespace-pre-wrap px-2"/>
<div v-if="isPublicFormPage && form.is_password_protected"> <div v-if="isPublicFormPage && form.is_password_protected">
<p class="form-description mb-4 text-gray-700 dark:text-gray-300 px-2"> <p class="form-description mb-4 text-gray-700 dark:text-gray-300 px-2">
@ -8,13 +10,13 @@
</p> </p>
<div class="form-group flex flex-wrap w-full"> <div class="form-group flex flex-wrap w-full">
<div class="relative mb-3 w-full px-2"> <div class="relative mb-3 w-full px-2">
<text-input :form="passwordForm" name="password" native-type="password" label="Password" /> <text-input :theme="theme" :form="passwordForm" name="password" native-type="password" label="Password" />
</div> </div>
</div> </div>
<div class="flex flex-wrap justify-center w-full text-center"> <div class="flex flex-wrap justify-center w-full text-center">
<v-button @click="passwordEntered"> <open-form-button :theme="theme" :color="form.color" class="my-4" @click="passwordEntered">
Submit Submit
</v-button> </open-form-button>
</div> </div>
</div> </div>
@ -62,8 +64,6 @@
mode="out-in" mode="out-in"
> >
<div v-if="!submitted" key="form"> <div v-if="!submitted" key="form">
<div v-if="form.description" v-html="form.description"
class="form-description mb-4 text-gray-700 dark:text-gray-300 whitespace-pre-wrap px-2"/>
<open-form v-if="form" <open-form v-if="form"
:form="form" :form="form"
:loading="loading" :loading="loading"