sean/manja_ui_dev
1
0
Fork 0
Code Issues Pull Requests Actions 2 Packages Projects Releases Wiki Activity

refactor: update examples

Browse Source
This commit is contained in:
Łukasz Holeczek
2021-08-26 17:41:07 +02:00
parent 4bd77fc24d b61206112f
commit c7f687982d
96 changed files with 12979 additions and 593 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/AppHeader.vue
+89 -40
View File
@@ -1,52 +1,101 @@
<template>
<CHeader position="sticky" class="mb-4">
<CHeaderToggler class="ms-md-3" @click="$store.commit('toggleSidebar')">
<CIcon name="cil-menu" size="lg" />
</CHeaderToggler>
<CHeaderBrand class="mx-auto d-lg-none" to="/">
<CIcon name="logo" height="48" alt="Logo" />
</CHeaderBrand>
<CHeaderNav class="d-md-down-none me-auto">
<CNavItem>
<CNavLink
href="/dashboard"
<CContainer fluid>
<CHeaderToggler class="ps-1" @click="$store.commit('toggleSidebar')">
<CIcon icon="cil-menu" size="lg" />
</CHeaderToggler>
<CHeaderBrand class="mx-auto d-lg-none" to="/">
<CIcon name="logo" height="48" alt="Logo" />
</CHeaderBrand>
<CHeaderNav class="d-md-down-none me-auto">
<CNavItem>
<CNavLink href="/dashboard"> Dashboard </CNavLink>
</CNavItem>
<CNavItem>
<CNavLink href="#">Users</CNavLink>
</CNavItem>
<CNavItem>
<CNavLink href="#">Settings</CNavLink>
</CNavItem>
</CHeaderNav>
<CHeaderNav class="me-4">
<CNavItem class="d-md-down-none mx-2">
<CNavLink>
<CIcon icon="cil-bell" size="lg" />
</CNavLink>
</CNavItem>
<CNavItem class="d-md-down-none mx-2">
<CNavLink>
<CIcon icon="cil-list" size="lg" />
</CNavLink>
</CNavItem>
<CNavItem class="d-md-down-none mx-2">
<CNavLink>
<CIcon icon="cil-envelope-open" size="lg" />
</CNavLink>
</CNavItem>
<AppHeaderDropdownAccnt />
</CHeaderNav>
</CContainer>
<CHeaderDivider />
<CContainer fluid>
<CBreadcrumb class="d-md-down-none me-auto mb-0">
<CBreadcrumbItem
v-for="item in currentRoute"
:href="item.to"
:active="item.to === '' ? true : false"
>
Dashboard
</CNavLink>
</CNavItem>
<CNavItem>
<CNavLink href="#">Users</CNavLink>
</CNavItem>
<CNavItem>
<CNavLink href="#">Settings</CNavLink>
</CNavItem>
</CHeaderNav>
<CHeaderNav class="me-4">
<CNavItem class="d-md-down-none mx-2">
<CNavLink>
<CIcon name="cil-bell" size="lg" />
</CNavLink>
</CNavItem>
<CNavItem class="d-md-down-none mx-2">
<CNavLink>
<CIcon name="cil-list" />
</CNavLink>
</CNavItem>
<CNavItem class="d-md-down-none mx-2">
<CNavLink>
<CIcon name="cil-envelope-open" />
</CNavLink>
</CNavItem>
<!-- <TheHeaderDropdownAccnt/> -->
</CHeaderNav>
{{ item.name }}
</CBreadcrumbItem>
</CBreadcrumb>
</CContainer>
</CHeader>
</template>
<script>
// import TheHeaderDropdownAccnt from './TheHeaderDropdownAccnt'
import AppHeaderDropdownAccnt from "./AppHeaderDropdownAccnt";
import router from "../router";
export default {
name: "AppHeader",
components: {},
components: {
AppHeaderDropdownAccnt,
},
data: function () {
return {
currentRoute: [],
};
},
methods: {
upperCaseFirstChar: function (string) {
return string.substr(0, 1).toUpperCase() + string.substr(1);
},
makeCurrentRoute: function () {
let result = [];
let path = router.currentRoute._value.path;
let temp = path.split("/");
let to = "";
if (temp.length <= 2) {
result.push({ to: "", name: router.currentRoute._value.name });
} else {
for (let i = 1; i < temp.length - 1; i++) {
for (let j = 1; j <= i; j++) {
to += `/${temp[j]}`;
}
result.push({ to: to, name: this.upperCaseFirstChar(temp[i]) });
}
result.push({ to: "", name: router.currentRoute._value.name });
}
return result;
},
},
watch: {
$route(to, from) {
this.currentRoute = this.makeCurrentRoute();
},
},
mounted: function () {
this.currentRoute = this.makeCurrentRoute();
},
};
</script>