diff --git a/src/hooks/useState.ts b/src/hooks/useState.ts index d9a253f..46d4e60 100644 --- a/src/hooks/useState.ts +++ b/src/hooks/useState.ts @@ -1,6 +1,5 @@ import { ref, computed } from 'vue' -// import type { ListCloudBoxesType } from '~/typs/clouds' -// import type { SideMenuItemType } from '~/typs/cmpnts' +import type { SideMenuItemType, UiPanelsType } from '~/typs/cmpnts' const reqError = ref({ defs: '', lang: '', data: '', gql: '', api: '' }) @@ -9,38 +8,120 @@ const isSidebarOpen = ref(false) const toggleSidebar = () => { isSidebarOpen.value = !isSidebarOpen.value } +const showModal = ref(false) + +const isAsidePanelOpen = ref(false) + +const sideSettingButton = ref(false) + +const isSettingsPanelOpen = ref(false) + +const isSearchPanelOpen = ref(false) +const usideSettingButton = ref(false) + +const isNotificationsPanelOpen = ref(false) + +const useSettings = ref(false) + +const useSearch = ref(false) + +const search = ref('') + const bcPath = ref('') +const navTitle = ref({ + text: '', + textclick: null as null | Function, + title: '', + cmpnt: '', + ops: [] as any[], + btntype: '', + cllbck: null as null | Function, +}) +const dfltNavTitle = () => { + navTitle.value = { + text: '', + textclick: null as null | Function, + title: '', + cmpnt: '', + ops: [] as any[], + btntype: '', + cllbck: null as null | Function, + } +} +// '#fa-book/biomagnetismo/microorganismos/virus' + +const bookCllbck = ref() +const bookSelec = (data: string) => { + if (data === '#') { + bcPath.value = '' + dfltNavTitle() + } + else { + if (bookCllbck.value) + bookCllbck.value(data) + // else ... + } +} +const sidebarMenuItems = ref([] as SideMenuItemType[]) + +const checkin = ref(false) +const connection = ref({ + state: '', +}) + const tsksrvcs = 'tsksrvcs' const appsrvcs = 'appsrvcs' const srvcstatus = 'srvcstatus' -const menu_items = ref([ - { id: tsksrvcs, title: 'Tasks', active: false, link: '#' }, - { id: appsrvcs, title: 'Applications', active: false, link: '#' }, - { id: srvcstatus, title: 'Services Status', active: false, link: '#' }, -]) +// const menu_items = ref([ +// { id: tsksrvcs, title: 'Tasks', active: false, link: '#' }, +// { id: appsrvcs, title: 'Applications', active: false, link: '#' }, +// { id: srvcstatus, title: 'Informations', active: false, link: '#' }, +// ]) -const showModal = ref(false) +const side_menu_click = ref() +const app_home_click = ref() -const checkin = ref(false) -const connection = ref({ - state: '', -}) +const backdrop_blur = ref(14) +const back_opacity = ref(60) +const panels = ref({} as UiPanelsType) + +const show_profile = ref(false) export default function useState() { return { - tsksrvcs, - appsrvcs, - srvcstatus, - menu_items, - reqError, + reqError, currentMapKey, isSidebarOpen, toggleSidebar, - bcPath, - showModal, + isAsidePanelOpen, + isSettingsPanelOpen, + isSearchPanelOpen, + isNotificationsPanelOpen, + useSettings, + usideSettingButton, + sideSettingButton, + bcPath, + bookSelec, + bookCllbck, + navTitle, + dfltNavTitle, checkin, connection, + sidebarMenuItems, + showModal, + tsksrvcs, + appsrvcs, + srvcstatus, + // menu_items, + side_menu_click, + app_home_click, + useSearch, + search, + back_opacity, + backdrop_blur, + panels, + show_profile, } } diff --git a/src/hooks/utils.ts b/src/hooks/utils.ts index c54ab11..8811ac5 100644 --- a/src/hooks/utils.ts +++ b/src/hooks/utils.ts @@ -163,12 +163,10 @@ export const load_data = async(data_path: RequestInfo, ato: number, timeout = 20 // return `error no auth for ${data_path}` try { + const headers = token !== "" ? { Authorization: `Bearer ${token}`} : {} + // 'content-type': 'application/json', const res = await self.fetch(data_path, { - headers: { - Authorization: `Bearer ${token}`, - // 'content-type': 'application/json', - }, - + headers }) // setTimeout(async() => { let dataloaded = {} diff --git a/src/layouts/AppLayout.vue b/src/layouts/AppLayout.vue index 939379f..8695fc8 100644 --- a/src/layouts/AppLayout.vue +++ b/src/layouts/AppLayout.vue @@ -1,7 +1,224 @@ - + + diff --git a/src/main.ts b/src/main.ts index b6bb402..5f681d2 100644 --- a/src/main.ts +++ b/src/main.ts @@ -8,6 +8,9 @@ import 'virtual:windi-utilities.css' // windicss devtools support (dev only) import 'virtual:windi-devtools' +import VueAnimXYZ from '@animxyz/vue' // import AnimXZY vue package +import '@animxyz/core' + // register vue composition api globally import { createApp } from 'vue' // import { createRouter, createWebHistory } from 'vue-router' @@ -24,6 +27,7 @@ import 'a17t' import { messages } from './modules/i18n' // import GuestLayout from '~/layouts/GuestLayout.vue' import AppLayout from '~/layouts/AppLayout.vue' +import SimpleLayout from '~/layouts/SimpleLayout.vue' const app = createApp(App) @@ -43,11 +47,13 @@ const head = createHead() // history: createWebHistory(), // routes, // }) +app.use(VueAnimXYZ) app.use(store) app.use(i18n) app.use(routes) // app.use(router) app.use(head) app.component('AppLayout', AppLayout) +app.component('SimpleLayout', SimpleLayout) // app.component('GuestLayout', GuestLayout) app.mount('#app') diff --git a/src/router.ts b/src/router.ts index 9825928..1eea5fc 100644 --- a/src/router.ts +++ b/src/router.ts @@ -14,9 +14,11 @@ import useState from '~/hooks/useState' import store from '~/store' import Home from '~/views/Home.vue' +import About from '~/views/about.md' // import Register from '~/views/auth/Register.vue' import Login from '~/views/Login.vue' import Logout from '~/views/Logout.vue' +import Profile from '~/components/Profile.vue' import { verify_auth, check_credentials } from '~/hooks/utils' // import { @@ -68,7 +70,18 @@ const check_auth = async(to: any, _from: any, next: any) => { const auth = localStorage.getItem('auth') || '' const check_url = `${window.ROOT_LOCATION || location.origin}/checkin` const login_url = `${location.origin}/ui/login` + const login_route = '/login' const mapkey = to.meta.uimapkey || 'ui' + const map_route_to = () => { + if (to.meta.requireAuth) { + return login_route + } + if (to.meta.pubLayout) { + to.meta.layout = to.meta.pubLayout + to.meta.useNav = !to.meta.useNav + } + return + } if (auth !== '') { const defs = store.state.app_defs.main.get(mapkey) if (defs && defs.checkin && useState().checkin.value) { @@ -81,10 +94,16 @@ const check_auth = async(to: any, _from: any, next: any) => { // TODO redirect to a connection error page or consider PWA offline mode if (res && res.defs) next() - else next('/login') + else { + const route=map_route_to() + next(route) + } } } - else { next('/login') } + else { + const route=map_route_to() + next(route) + } } const get_defs = async(mapkey: string) => { @@ -123,13 +142,16 @@ const routes: RouteRecordRaw[] = [ name: 'Home', component: Home, meta: { - requireAuth: true, + requireAuth: false, layout: 'AppLayout', + ctx: 'home', +// useNav: false, +// pubLayout: 'SimpleLayout', mapkey: 'kloud', uiMapkey: 'ui', rooturl, }, - // beforeEnter: check_auth, + beforeEnter: check_auth, // (_to: any, _from: any, next: any) => { // req_lang(lang_url, () => next()) // }, @@ -146,6 +168,28 @@ const routes: RouteRecordRaw[] = [ component: Logout, meta: { layout: 'empty', rooturl, use_logo: true }, }, + { + path: '/about', + name: 'About', + meta: { + layout: 'AppLayout', + ctx: 'about', + rooturl, + use_loog: true, + }, + component: About, + }, + { + path: '/profile', + name: 'Profile', + meta: { + layout: 'AppLayout', + ctx: 'profile', + rooturl, + use_loog: true, + }, + component: Profile, + }, // { // path: '/auth/register', // name: 'Register',