mirror of https://github.com/requarks/wiki
134 lines
3.1 KiB
134 lines
3.1 KiB
<template lang='pug'>
|
|
q-page.admin-flags
|
|
.row.q-pa-md.items-center
|
|
.col-auto
|
|
img.admin-icon.animated.fadeInLeft(src='/_assets/icons/fluent-cashbook.svg')
|
|
.col.q-pl-md
|
|
.text-h5.text-primary.animated.fadeInLeft {{ t('admin.editors.title') }}
|
|
.text-subtitle1.text-grey.animated.fadeInLeft.wait-p2s {{ t('admin.editors.subtitle') }}
|
|
.col-auto
|
|
q-btn.q-mr-sm.acrylic-btn(
|
|
icon='las la-question-circle'
|
|
flat
|
|
color='grey'
|
|
:href='siteStore.docsBase + `/admin/editors`'
|
|
target='_blank'
|
|
type='a'
|
|
)
|
|
q-btn.q-mr-sm.acrylic-btn(
|
|
icon='las la-redo-alt'
|
|
flat
|
|
color='secondary'
|
|
:loading='loading > 0'
|
|
@click='load'
|
|
)
|
|
q-btn(
|
|
unelevated
|
|
icon='fa-solid fa-check'
|
|
:label='t(`common.actions.apply`)'
|
|
color='secondary'
|
|
@click='save'
|
|
:disabled='loading > 0'
|
|
)
|
|
q-separator(inset)
|
|
.q-pa-md.q-gutter-md
|
|
q-card.shadow-1
|
|
q-list(separator)
|
|
q-item(v-for='editor of editors', :key='editor.id')
|
|
blueprint-icon(:icon='editor.icon')
|
|
q-item-section
|
|
q-item-label: strong {{t(`admin.editors.` + editor.id + `Name`)}}
|
|
q-item-label.flex.items-center(caption)
|
|
span {{t(`admin.editors.` + editor.id + `Description`)}}
|
|
template(v-if='editor.config')
|
|
q-item-section(
|
|
side
|
|
)
|
|
q-btn(
|
|
icon='las la-cog'
|
|
:label='t(`admin.editors.configuration`)'
|
|
:color='$q.dark.isActive ? `blue-grey-3` : `blue-grey-8`'
|
|
outline
|
|
no-caps
|
|
padding='xs md'
|
|
)
|
|
q-separator.q-ml-md(vertical)
|
|
q-item-section(side)
|
|
q-toggle.q-pr-sm(
|
|
v-model='editor.isActive'
|
|
:color='editor.isDisabled ? `grey` : `primary`'
|
|
checked-icon='las la-check'
|
|
unchecked-icon='las la-times'
|
|
:label='t(`admin.sites.isActive`)'
|
|
:aria-label='t(`admin.sites.isActive`)'
|
|
:disabled='editor.isDisabled'
|
|
)
|
|
</template>
|
|
|
|
<script setup>
|
|
import { useMeta } from 'quasar'
|
|
import { useI18n } from 'vue-i18n'
|
|
import { defineAsyncComponent, onMounted, reactive, ref, watch } from 'vue'
|
|
|
|
import { useSiteStore } from 'src/stores/site'
|
|
|
|
// STORES
|
|
|
|
const siteStore = useSiteStore()
|
|
|
|
// I18N
|
|
|
|
const { t } = useI18n()
|
|
|
|
// META
|
|
|
|
useMeta({
|
|
title: t('admin.editors.title')
|
|
})
|
|
|
|
const loading = ref(false)
|
|
const editors = reactive([
|
|
{
|
|
id: 'wysiwyg',
|
|
icon: 'google-presentation',
|
|
isActive: true
|
|
},
|
|
{
|
|
id: 'markdown',
|
|
icon: 'markdown',
|
|
config: {},
|
|
isActive: true
|
|
},
|
|
{
|
|
id: 'channel',
|
|
icon: 'chat',
|
|
isActive: true
|
|
},
|
|
{
|
|
id: 'blog',
|
|
icon: 'typewriter-with-paper',
|
|
isActive: true,
|
|
isDisabled: true
|
|
},
|
|
{
|
|
id: 'api',
|
|
icon: 'api',
|
|
isActive: true,
|
|
isDisabled: true
|
|
},
|
|
{
|
|
id: 'redirect',
|
|
icon: 'advance',
|
|
isActive: true
|
|
}
|
|
])
|
|
|
|
const load = async () => {}
|
|
const save = () => {}
|
|
const refresh = () => {}
|
|
</script>
|
|
|
|
<style lang='scss'>
|
|
|
|
</style>
|