v-dialog(
v-model='isShown'
max-width='850px'
overlay-color='blue darken-4'
overlay-opacity='.7'
)
v-card.page-selector
.dialog-header.is-blue
v-icon.mr-3(color='white') mdi-page-next-outline
.body-1(v-if='mode === `create`') Select New Page Location
.body-1(v-else-if='mode === `move`') Move / Rename Page Location
.body-1(v-else-if='mode === `select`') Select a Page
v-spacer
v-progress-circular(
indeterminate
color='white'
:size='20'
:width='2'
v-show='searchLoading'
)
.d-flex
v-flex.grey(xs5, :class='darkMode ? `darken-4` : `lighten-3`')
v-toolbar(color='grey darken-3', dark, dense, flat)
.body-2 Virtual Folders
v-spacer
v-btn(icon, tile, href='https://docs.requarks.io/guide/pages#folders', target='_blank')
v-icon mdi-help-box
div(style='height:400px;')
vue-scroll(:ops='scrollStyle')
v-treeview(
:key='`pageTree-` + treeViewCacheId'
:active.sync='currentNode'
:open.sync='openNodes'
:items='tree'
:load-children='fetchFolders'
dense
expand-icon='mdi-menu-down-outline'
item-id='path'
item-text='title'
activatable
hoverable
)
template(slot='prepend', slot-scope='{ item, open, leaf }')
v-icon mdi-{{ open ? 'folder-open' : 'folder' }}
v-flex(xs7)
v-toolbar(color='blue darken-2', dark, dense, flat)
.body-2 Pages
//- v-spacer
//- v-btn(icon, tile, disabled): v-icon mdi-content-save-move-outline
//- v-btn(icon, tile, disabled): v-icon mdi-trash-can-outline
div(v-if='currentPages.length > 0', style='height:400px;')
vue-scroll(:ops='scrollStyle')
v-list.py-0(dense)
v-list-item-group(
v-model='currentPage'
color='primary'
)
template(v-for='(page, idx) of currentPages')
v-list-item(:key='`page-` + page.id', :value='page.path')
v-list-item-icon: v-icon mdi-text-box
v-list-item-title {{page.title}}
v-divider(v-if='idx < pages.length - 1')
v-alert.animated.fadeIn(
v-else
text
color='orange'
prominent
icon='mdi-alert'
)
.body-2 This folder is empty.
v-card-actions.grey.pa-2(:class='darkMode ? `darken-2` : `lighten-1`')
v-select(
solo
dark
flat
background-color='grey darken-3-d2'
hide-details
single-line
:items='namespaces'
style='flex: 0 0 100px; border-radius: 4px 0 0 4px;'
v-model='currentLocale'
)
v-text-field(
ref='pathIpt'
solo
hide-details
prefix='/'
v-model='currentPath'
flat
clearable
style='border-radius: 0 4px 4px 0;'
)
v-card-chin
v-spacer
v-btn(text, @click='close') Cancel
v-btn.px-4(color='primary', @click='open', :disabled='!isValidPath')
v-icon(left) mdi-check
span Select