feat(admin): migrate theme + api + utilities to vue 3 composition

parent 368493c3
......@@ -12,26 +12,26 @@
},
"dependencies": {
"@apollo/client": "3.6.8",
"@codemirror/autocomplete": "0.20.3",
"@codemirror/autocomplete": "6.0.2",
"@codemirror/basic-setup": "0.20.0",
"@codemirror/closebrackets": "0.19.2",
"@codemirror/commands": "0.20.0",
"@codemirror/commands": "6.0.0",
"@codemirror/comment": "0.19.1",
"@codemirror/fold": "0.19.4",
"@codemirror/gutter": "0.19.9",
"@codemirror/highlight": "0.19.8",
"@codemirror/history": "0.19.2",
"@codemirror/lang-css": "0.20.0",
"@codemirror/lang-html": "0.20.0",
"@codemirror/lang-javascript": "0.20.1",
"@codemirror/lang-json": "0.20.0",
"@codemirror/lang-markdown": "0.20.1",
"@codemirror/lang-css": "6.0.0",
"@codemirror/lang-html": "6.0.0",
"@codemirror/lang-javascript": "6.0.0",
"@codemirror/lang-json": "6.0.0",
"@codemirror/lang-markdown": "6.0.0",
"@codemirror/matchbrackets": "0.19.4",
"@codemirror/search": "0.20.1",
"@codemirror/state": "0.20.1",
"@codemirror/search": "6.0.0",
"@codemirror/state": "6.0.1",
"@codemirror/tooltip": "0.19.16",
"@codemirror/view": "0.20.7",
"@lezer/common": "0.16.1",
"@codemirror/view": "6.0.1",
"@lezer/common": "1.0.0",
"@quasar/extras": "1.14.0",
"@tiptap/core": "2.0.0-beta.176",
"@tiptap/extension-code-block": "2.0.0-beta.37",
......@@ -61,6 +61,7 @@
"apollo-upload-client": "17.0.0",
"browser-fs-access": "0.29.6",
"clipboard": "2.0.11",
"codemirror": "6.0.0",
"filesize": "9.0.9",
"filesize-parser": "1.5.0",
"graphql": "16.5.0",
......@@ -71,12 +72,12 @@
"luxon": "2.4.0",
"pinia": "2.0.14",
"pug": "3.0.2",
"quasar": "2.7.2",
"quasar": "2.7.3",
"tippy.js": "6.3.7",
"uuid": "8.3.2",
"v-network-graph": "0.5.19",
"vue": "3.2.37",
"vue-codemirror": "5.1.0",
"vue-codemirror": "6.0.0",
"vue-i18n": "9.1.10",
"vue-router": "4.0.16",
"vuedraggable": "4.1.0",
......
......@@ -178,7 +178,6 @@ defineEmits([
const { dialogRef, onDialogHide, onDialogOK, onDialogCancel } = useDialogPluginComponent()
const $q = useQuasar()
defineExpose({ $q })
// I18N
......
......@@ -510,7 +510,6 @@ import UtilCodeEditor from './UtilCodeEditor.vue'
// QUASAR
const $q = useQuasar()
defineExpose({ $q })
// STORES
......
......@@ -12,7 +12,6 @@ import { EditorState } from '@codemirror/state'
import { defaultKeymap, history, historyKeymap, indentWithTab } from '@codemirror/commands'
import { defaultHighlightStyle, syntaxHighlighting } from '@codemirror/language'
import { ref, shallowRef, onBeforeMount, onMounted, watch } from 'vue'
import { json } from '@codemirror/lang-json'
// PROPS
......
......@@ -218,7 +218,6 @@ defineEmits([
const { dialogRef, onDialogHide, onDialogOK, onDialogCancel } = useDialogPluginComponent()
const $q = useQuasar()
defineExpose({ $q })
// I18N
......
......@@ -203,7 +203,6 @@ const overlays = {
// QUASAR
const $q = useQuasar()
defineExpose({ $q })
// STORES
......
......@@ -4,14 +4,14 @@ q-page.admin-utilities
.col-auto
img.admin-icon.animated.fadeInLeft(src='/_assets/icons/fluent-swiss-army-knife.svg')
.col.q-pl-md
.text-h5.text-primary.animated.fadeInLeft {{ $t('admin.utilities.title') }}
.text-subtitle1.text-grey.animated.fadeInLeft.wait-p2s {{ $t('admin.utilities.subtitle') }}
.text-h5.text-primary.animated.fadeInLeft {{ t('admin.utilities.title') }}
.text-subtitle1.text-grey.animated.fadeInLeft.wait-p2s {{ t('admin.utilities.subtitle') }}
.col-auto
q-btn.q-mr-sm.acrylic-btn(
icon='las la-question-circle'
flat
color='grey'
href='https://docs.requarks.io/admin/utilities'
href='https://docs.js.wiki/admin/utilities'
target='_blank'
type='a'
)
......@@ -22,38 +22,31 @@ q-page.admin-utilities
q-item
blueprint-icon(icon='matches', :hue-rotate='45')
q-item-section
q-item-label {{$t(`admin.utilities.invalidAuthCertificates`)}}
q-item-label(caption) {{$t(`admin.utilities.invalidAuthCertificatesHint`)}}
q-item-label {{t(`admin.utilities.invalidAuthCertificates`)}}
q-item-label(caption) {{t(`admin.utilities.invalidAuthCertificatesHint`)}}
q-item-section(side)
q-btn.acrylic-btn(
flat
icon='las la-arrow-circle-right'
color='primary'
@click=''
:label='$t(`common.actions.proceed`)'
:label='t(`common.actions.proceed`)'
)
q-item
blueprint-icon(icon='historical', :hue-rotate='45')
q-item-section
q-item-label {{$t(`admin.utilities.purgeHistory`)}}
q-item-label(caption) {{$t(`admin.utilities.purgeHistoryHint`)}}
q-item-label {{t(`admin.utilities.purgeHistory`)}}
q-item-label(caption) {{t(`admin.utilities.purgeHistoryHint`)}}
q-item-section(side)
q-select(
outlined
:label='$t(`admin.utilities.purgeHistoryTimeframe`)'
v-model='purgeHistoryTimeframe'
:label='t(`admin.utilities.purgeHistoryTimeframe`)'
v-model='state.purgeHistoryTimeframe'
style='min-width: 175px;'
emit-value
map-options
dense
:options=`[
{ value: '24h', label: $t('admin.utitilies.purgeHistoryToday') },
{ value: '1m', label: $tc('admin.utitilies.purgeHistoryMonth', 1, { count: 1 }) },
{ value: '3m', label: $tc('admin.utitilies.purgeHistoryMonth', 3, { count: 3 }) },
{ value: '6m', label: $tc('admin.utitilies.purgeHistoryMonth', 6, { count: 6 }) },
{ value: '1y', label: $tc('admin.utitilies.purgeHistoryYear', 1, { count: 1 }) },
{ value: '2y', label: $tc('admin.utitilies.purgeHistoryYear', 2, { count: 2 }) }
]`
:options='purgeHistoryTimeframes'
)
q-separator.q-ml-sm(vertical)
q-item-section(side)
......@@ -62,20 +55,46 @@ q-page.admin-utilities
icon='las la-arrow-circle-right'
color='primary'
@click=''
:label='$t(`common.actions.proceed`)'
:label='t(`common.actions.proceed`)'
)
</template>
<script>
<script setup>
import { computed, reactive } from 'vue'
import { useMeta, useQuasar } from 'quasar'
import { useI18n } from 'vue-i18n'
export default {
data () {
return {
purgeHistoryTimeframe: '1y'
}
}
}
// QUASAR
const $q = useQuasar()
// STORES / ROUTERS / i18n
const { t } = useI18n()
// META
useMeta({
title: t('admin.utilities.title')
})
// DATA
const state = reactive({
purgeHistoryTimeframe: '1y'
})
// COMPUTED
const purgeHistoryTimeframes = computed(() => ([
{ value: '24h', label: t('admin.utitilies.purgeHistoryToday') },
{ value: '1m', label: t('admin.utitilies.purgeHistoryMonth', 1, { count: 1 }) },
{ value: '3m', label: t('admin.utitilies.purgeHistoryMonth', 3, { count: 3 }) },
{ value: '6m', label: t('admin.utitilies.purgeHistoryMonth', 6, { count: 6 }) },
{ value: '1y', label: t('admin.utitilies.purgeHistoryYear', 1, { count: 1 }) },
{ value: '2y', label: t('admin.utitilies.purgeHistoryYear', 2, { count: 2 }) }
]))
</script>
<style lang='scss'>
......
......@@ -36,20 +36,20 @@ const routes = [
{ path: ':siteid/locale', component: () => import('../pages/AdminLocale.vue') },
{ path: ':siteid/login', component: () => import('../pages/AdminLogin.vue') },
// { path: ':siteid/navigation', component: () => import('../pages/AdminNavigation.vue') },
{ path: ':siteid/storage/:id?', component: () => import('../pages/AdminStorage.vue') },
// { path: ':siteid/rendering', component: () => import('../pages/AdminRendering.vue') },
// { path: ':siteid/theme', component: () => import('../pages/AdminTheme.vue') },
{ path: ':siteid/storage/:id?', component: () => import('../pages/AdminStorage.vue') },
{ path: ':siteid/theme', component: () => import('../pages/AdminTheme.vue') },
// -> Users
// { path: 'auth', component: () => import('../pages/AdminAuth.vue') },
{ path: 'groups/:id?/:section?', component: () => import('../pages/AdminGroups.vue') },
{ path: 'users/:id?/:section?', component: () => import('../pages/AdminUsers.vue') },
// -> System
// { path: 'api', component: () => import('../pages/AdminApi.vue') },
{ path: 'api', component: () => import('../pages/AdminApi.vue') },
{ path: 'extensions', component: () => import('../pages/AdminExtensions.vue') },
{ path: 'mail', component: () => import('../pages/AdminMail.vue') },
{ path: 'security', component: () => import('../pages/AdminSecurity.vue') },
{ path: 'system', component: () => import('../pages/AdminSystem.vue') },
// { path: 'utilities', component: () => import('../pages/AdminUtilities.vue') },
{ path: 'utilities', component: () => import('../pages/AdminUtilities.vue') },
{ path: 'webhooks', component: () => import('../pages/AdminWebhooks.vue') },
{ path: 'flags', component: () => import('../pages/AdminFlags.vue') }
]
......
This diff was suppressed by a .gitattributes entry.
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment