v-container
v-row.justify-space-between
div
v-tabs(centered)
v-tab(v-for='page, i in sections' :key='i')
v-tab(@click.prevent="show=page" v-bind:class="[{onPage: show===page}, {offPage: show!==page}]")
span(v-if='options.icons && options.icons[page]')
v-icon {{options.icons[page]}}
span(v-if="$vuetify.breakpoint.mdAndUp") {{page}}
span(v-else) {{page}}
div(v-if='!options.autoupdate')
span(v-for='f in formats' style='padding-right: 50px; float: right font-size: 12px' :key='f')
a( href='#' @click="setFormat(f)")
b.text-xs(v-if='myFormat === f' style='font-size: 12px') {{f}}
span.text-xs(v-else style='font-size: 12px') {{f}}
br
hr
p
div(v-for='page, j in sections' :key='j')
v-card(v-show="show===page")
v-card-text
RecursiveList(
:title='title'
:list='split_list[page]'
:section='page'
:preset='preset'
:options='options'
:format='myFormat'
:access='access'
:onSelect='mySelect'
:onDeSelect='myDeSelect'
:onChange='myChange'
:saveOnChange='saveOnChange'
:onClick='onClick'
:remoteSelect='remoteSelect'
:remoteDeSelect='remoteDeSelect'
:debug='debug'
:saved='saved'
)
v-card(v-show='!show')
v-card-text
h4 List is divided into {{sections.length}} primary categories.
h4 Click on a category above to view / select within each
div(v-if='saveOnSubmit && editCount.total')
p
div(style='flex-direction: column')
v-btn.btn-primary(v-if='saveOnSubmit' @click='saveAll') {{saveOnSubmitButton}}
div(v-for='section, name in edits' :key='"Add" + name' style='text-align: left')
b(v-if='editCount[name] && editCount[name].Added')
i Added {{name}} [{{editCount[name].Added}}]:
span.text-success {{section.turnedOnName.join(', ')}};
div(v-for='section, name in edits' :key='"Rmv" +name' style='text-align: left')
b(v-if='editCount[name] && editCount[name].Removed')
i Removed {{name}} [{{editCount[name].Removed}}]:
span.text-warning {{section.turnedOffName.join(', ')}};
p
hr
div(v-if='debug')
h6 Sections: {{sections}}
h6 Current: {{current}}
h6 Preset: {{preset}}