[enh] VisibleIf on sections

This commit is contained in:
ljf 2021-08-31 17:38:25 +02:00
parent 93ad401c7d
commit c9fb63603e

View file

@ -6,6 +6,9 @@
:key="id_" :key="id_"
:title="name" :title="name"
> >
<template #title>
<icon iname="wrench" /> {{ name }}
</template>
<card-form <card-form
:key="id_" :key="id_"
:title="name" icon="wrench" title-tag="h2" :title="name" icon="wrench" title-tag="h2"
@ -16,17 +19,19 @@
<div class="alert alert-info" v-html="help" /> <div class="alert alert-info" v-html="help" />
</template> </template>
<div v-for="section in sections" :key="section.id" class="mb-5"> <template v-for="section in sections">
<b-card-title v-if="section.name" title-tag="h3"> <div :key="section.id" class="mb-5" v-if="isVisible(section.visibleIf)">
{{ section.name }} <small v-if="section.help">{{ section.help }}</small> <b-card-title v-if="section.name" title-tag="h3">
</b-card-title> {{ section.name }} <small v-if="section.help">{{ section.help }}</small>
<template v-for="(field, fname) in section.fields"> </b-card-title>
<form-field :key="fname" v-model="forms[id_][fname]" <template v-for="(field, fname) in section.fields">
:validation="$v.forms[id_][fname]" <form-field :key="fname" v-model="forms[id_][fname]"
v-if="isVisible(field.visibleIf)" v-bind="field" :validation="$v.forms[id_][fname]"
/> v-if="isVisible(field.visibleIf)" v-bind="field"
</template> />
</div> </template>
</div>
</template>
</card-form> </card-form>
</b-tab> </b-tab>
</b-tabs> </b-tabs>
@ -102,14 +107,15 @@ export default {
forms[id] = {} forms[id] = {}
validations_[id] = {} validations_[id] = {}
errors_[id] = {} errors_[id] = {}
for (const { name, help, options } of sections) { for (const { name, help, visibleIf, options } of sections) {
const section_ = { name } const section_ = { name, visibleIf }
if (help) section_.help = formatI18nField(help) if (help) section_.help = formatI18nField(help)
const { form, fields, validations, errors } = formatYunoHostArguments(options) const { form, fields, validations, errors } = formatYunoHostArguments(options)
Object.assign(forms[id], form) Object.assign(forms[id], form)
Object.assign(validations_[id], validations) Object.assign(validations_[id], validations)
Object.assign(errors_[id], errors) Object.assign(errors_[id], errors)
panel_.sections.push({ name, fields }) section_.fields = fields
panel_.sections.push(section_)
} }
panels_.push(panel_) panels_.push(panel_)
} }