village-hall
/
opnform
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Code block (#21) 

Co-authored-by: Julien Nahum <jhumanj@MacBook-Pro-de-Julien.local>
This commit is contained in:
Chirag 2022-11-06 16:55:38 +05:30 committed by GitHub
parent 9c8aa16ddb
commit 8b6814c373
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
5 changed files with 26 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
app/Rules/FormPropertyLogicRule.php
View File

@ -490,7 +490,7 @@ class FormPropertyLogicRule implements Rule, DataAwareRule
if (is_array($conditions) && count($conditions) > 0) {
foreach($conditions as $val){
if (!in_array($val, static::ACTIONS_VALUES) ||
(in_array($this->field["type"], ['nf-text', 'nf-page-break', 'nf-divider', 'nf-image']) && !in_array($val, ['hide-block'])) ||
(in_array($this->field["type"], ['nf-text', 'nf-code', 'nf-page-break', 'nf-divider', 'nf-image']) && !in_array($val, ['hide-block'])) ||
(isset($this->field["hidden"]) && $this->field["hidden"] && !in_array($val, ['show-block', 'require-answer'])) ||
(isset($this->field["required"]) && $this->field["required"] && !in_array($val, ['make-it-optional', 'hide-block']))
) {

3
resources/js/components/open/forms/OpenForm.vue
View File

@ -12,6 +12,9 @@
<div v-if="field.type === 'nf-text' && field.content" :id="field.id" :key="field.id" class="nf-text w-full px-2 mb-3"
v-html="field.content"
/>
<div v-if="field.type === 'nf-code' && field.content" :id="field.id" :key="field.id" class="nf-code w-full px-2 mb-3"
v-html="field.content"
/>
<div v-if="field.type === 'nf-divider'" :id="field.id" :key="field.id" class="border-b my-4 w-full mx-2" />
<div v-if="field.type === 'nf-image' && (field.image_block || !isPublicFormPage)" :id="field.id" :key="field.id" class="my-4 w-full px-2">
<div v-if="!field.image_block" class="p-4 border border-dashed">

15
resources/js/components/open/forms/components/form-components/AddFormBlockModal.vue
View File

@ -196,6 +196,18 @@
</div>
<p class="w-full text-xs text-gray-500 uppercase text-center font-semibold mb-4">Image Block</p>
</div>
<!-- Code Block -->
<div
class="bg-gray-50 border hover:bg-gray-100 dark:bg-gray-900 rounded-md dark:hover:bg-gray-800 p-2 flex flex-col"
role="button" @click.prevent="addBlock('nf-code')"
>
<div class="mx-auto py-4">
<svg xmlns="http://www.w3.org/2000/svg" class="h-8 w-8 text-gray-500" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2">
<path stroke-linecap="round" stroke-linejoin="round" d="M17.25 6.75L22.5 12l-5.25 5.25m-10.5 0L1.5 12l5.25-5.25m7.5-3l-4.5 16.5" />
</svg>
</div>
<p class="w-full text-xs text-gray-500 uppercase text-center font-semibold mb-4">Code Block</p>
</div>
</div>
</modal>
@ -242,6 +254,7 @@ export default {
'nf-page-break': 'Page Break',
'nf-divider': 'Divider',
'nf-image': 'Image',
'nf-code': 'Code Block',
}
}
},
@ -292,6 +305,8 @@ export default {
} else if (data.type === 'nf-page-break') {
data.next_btn_text = 'Next'
data.previous_btn_text = 'Previous'
} else if (data.type === 'nf-code') {
data.content = '<div class="text-blue-500 italic">This is a code block.</div>'
}
return data
},

2
resources/js/components/open/forms/components/form-logic-components/FormBlockLogicEditor.vue
View File

@ -107,7 +107,7 @@ export default {
})
},
actionOptions() {
if (['nf-text', 'nf-page-break', 'nf-divider', 'nf-image'].includes(this.field.type)) {
if (['nf-text', 'nf-code', 'nf-page-break', 'nf-divider', 'nf-image'].includes(this.field.type)) {
return [{name: 'Hide Block', value: 'hide-block'}]
}

7
resources/js/components/open/forms/fields/FormBlockOptionsModal.vue
View File

@ -115,6 +115,10 @@
:form="field" label="Upload Image" :required="false"
/>
</div>
<div v-else-if="field.type == 'nf-code'" class="-mx-4 sm:-mx-6 p-5 border-b border-t">
<code-input name="content" class="mt-4 h-36" :form="field" label="Content"
help="You can add any html code, including iframes" />
</div>
<div v-else class="-mx-4 sm:-mx-6 p-5 border-b border-t">
<p>No settings found.</p>
</div>
@ -137,10 +141,11 @@
<script>
import ProTag from '../../../common/ProTag'
import FormBlockLogicEditor from '../components/form-logic-components/FormBlockLogicEditor'
import CodeInput from '../../../forms/CodeInput'
export default {
name: 'FormBlockOptionsModal',
components: {ProTag, FormBlockLogicEditor},
components: {ProTag, FormBlockLogicEditor, CodeInput},
props: {
field: {
type: Object,