cgiacofei/TandoorRecipes
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

comonent in generic form trial

Browse Source 
# Conflicts:
#	vue/src/components/FoodEditor.vue
#	vue/src/components/Modals/GenericModalForm.vue
#	vue/src/utils/models.js
This commit is contained in:
vabene1111 2023-05-21 20:26:00 +02:00
parent f369b74c94
commit 3c3ecc5342
1 changed files with 46 additions and 28 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

22
vue/src/components/Modals/GenericModalForm.vue
View File

@ -1,6 +1,13 @@
<template>
<div>
<b-modal :id="'modal_' + id" @hidden="cancelAction">
<template v-if="form_component !== undefined">
<b-modal :id="'modal_' + id" @hidden="cancelAction" size="xl">
<component :is="form_component"></component>
</b-modal>
</template>
<template v-else>
<b-modal :id="'modal_' + id" @hidden="cancelAction" size="lg">
<template v-slot:modal-title>
<h4 class="d-inline">{{ form.title }}</h4>
<help-badge v-if="form.show_help" @show="show_help = true" @hide="show_help = false" :component="`GenericModal${form.title}`" />
@ -9,7 +16,7 @@
<p v-if="visibleCondition(f, 'instruction')">{{ f.label }}</p>
<lookup-input v-if="visibleCondition(f, 'lookup')" :form="f" :model="listModel(f.list)" @change="storeValue" :help="showHelp && f.help" />
<checkbox-input class="mb-3" v-if="visibleCondition(f, 'checkbox')" :label="f.label" :value="f.value" :field="f.field" :help="showHelp && f.help" />
<text-input v-if="visibleCondition(f, 'text')" :label="f.label" :value="f.value" :field="f.field" :placeholder="f.placeholder" :help="showHelp && f.help" :subtitle="f.subtitle" />
<text-input v-if="visibleCondition(f, 'text')" :label="f.label" :value="f.value" :field="f.field" :placeholder="f.placeholder" :help="showHelp && f.help" :subtitle="f.subtitle" :disabled="f.disabled"/>
<choice-input v-if="visibleCondition(f, 'choice')" :label="f.label" :value="f.value" :field="f.field" :options="f.options" :placeholder="f.placeholder" />
<emoji-input v-if="visibleCondition(f, 'emoji')" :label="f.label" :value="f.value" :field="f.field" @change="storeValue" />
<file-input v-if="visibleCondition(f, 'file')" :label="f.label" :value="f.value" :field="f.field" @change="storeValue" />
@ -29,6 +36,8 @@
</div>
</template>
</b-modal>
</template>
</div>
</template>
@ -116,6 +125,15 @@ export default {
return undefined
}
},
form_component() {
// TODO this leads webpack to create one .js file for each component in this folder because at runtime any one of them could be requested
// TODO this is not necessarily bad but maybe there are better options to do this
if (this.form.component !== undefined){
return () => import(/* webpackChunkName: "header-component" */ `@/components/${this.form.component}`)
}else{
return undefined
}
},
},
watch: {
show: function () {