v4 initial commit

2021-08-02 23:57:02 +02:00
parent 9d65013c0f
commit 79559ae334
225 changed files with 13242 additions and 32434 deletions
@@ -0,0 +1,18 @@
+<template>
+  <CFooter>
+    <div>
+      <a href="https://coreui.io" target="_blank">CoreUI</a>
+      <span class="ml-1">&copy; {{new Date().getFullYear()}} creativeLabs.</span>
+    </div>
+    <div class="mfs-auto">
+      <span class="mr-1" target="_blank">Powered by</span>
+      <a href="https://coreui.io/vue">CoreUI for Vue</a>
+    </div>
+  </CFooter>
+</template>
+
+<script>
+export default {
+  name: "AppFooter",
+};
+</script>
@@ -0,0 +1,52 @@
+<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"
+        >
+          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>
+  </CHeader>
+</template>
+
+<script>
+// import TheHeaderDropdownAccnt from './TheHeaderDropdownAccnt'
+
+export default {
+  name: "AppHeader",
+  components: {},
+};
+</script>
@@ -0,0 +1,30 @@
+<template>
+  <CSidebar position="fixed" selfHiding="md">
+    <CSidebarBrand>
+      <CIcon
+        customClasses="sidebar-brand-full"
+        name="logo"
+        size="custom-size"
+        :height="35"
+        viewBox="0 0 556 134" />
+      <CIcon
+        customClasses="sidebar-brand-narrow"
+        name="logo"
+        size="custom-size"
+        :height="35"
+        viewBox="0 0 110 134"
+    /></CSidebarBrand>
+
+    <AppSidebarNav />
+  </CSidebar>
+</template>
+
+<script>
+import { AppSidebarNav } from "./AppSidebarNav";
+export default {
+  name: "AppSidebar",
+  components: {
+    AppSidebarNav,
+  },
+};
+</script>
@@ -0,0 +1,89 @@
+import { defineComponent, h, resolveComponent } from "vue";
+import { RouterLink } from "vue-router";
+
+import { CSidebarNav, CNavItem, CNavGroup, CNavTitle } from "@coreui/vue";
+import nav from "@/_nav.js";
+
+const AppSidebarNav = defineComponent({
+  name: "AppSidebarNav",
+  components: {
+    CNavItem,
+    CNavGroup,
+    CNavTitle,
+  },
+  setup() {
+    const singleItem = (item) =>
+      item.to
+        ? h(
+            RouterLink,
+            {
+              to: item.to,
+              custom: true,
+            },
+            {
+              default: (props) =>
+                h(
+                  resolveComponent(item._name),
+                  {
+                    active: props.isActive,
+                    href: props.href,
+                    icon: "cil-speedometer",
+                    onClick: () => props.navigate(),
+                  },
+                  [
+                    item.icon &&
+                      h(resolveComponent("CIcon"), {
+                        customClasses: "nav-icon",
+                        name: item.icon,
+                      }),
+                    item.name,
+                    item.badge &&
+                    h(resolveComponent("CBadge"), {
+                      class: 'ms-auto',
+                      color: item.badge.color,
+                    }, item.badge.text),
+                  ]
+                ),
+            }
+          )
+        : h(resolveComponent(item._name), {}, item.name);
+
+    const group = (item) =>
+      h(
+        RouterLink,
+        {
+          to: item.route,
+          custom: true,
+        },
+        {
+          default: (props) =>
+            h(
+              resolveComponent("CNavGroup"),
+              {
+                visible: props.isActive
+              },
+              {
+                togglerContent: () => [
+                  h(resolveComponent("CIcon"), {
+                    customClasses: "nav-icon",
+                    name: item.icon,
+                  }),
+                  item.name,
+                ],
+                default: () => item.children.map((child) => singleItem(child)),
+              }
+            ),
+        }
+      );
+
+    return () =>
+      h(
+        CSidebarNav,
+        {},
+        nav.map((item) =>
+          typeof item.children === "undefined" ? singleItem(item) : group(item)
+        )
+      );
+  },
+});
+export { AppSidebarNav };
@@ -0,0 +1,43 @@
+<template>
+  <div class="example">
+    <CNav variant="tabs">
+      <CNavItem>
+        <CNavLink href="#" active>
+          <CIcon name="cil-media-play" class="me-2" />
+        </CNavLink>
+      </CNavItem>
+      <CNavItem>
+        <CNavLink :href="href" target="_blank">
+          <CIcon name="cil-code" class="me-2" />
+          Code
+        </CNavLink>
+      </CNavItem>
+    </CNav>
+    <CTabContent class="rounded-bottom">
+      <CTabPane class="p-3 preview" visible>
+        <slot></slot>
+      </CTabPane>
+    </CTabContent>
+  </div>
+</template>
+
+<script>
+import packageJson from "../../package.json";
+export default {
+  name: "Example",
+  props: {
+    href: {
+      type: String,
+      default: undefined,
+      required: false,
+    },
+  },
+  setup(props) {
+    const href = `https://coreui.io/vue/docs/${packageJson.config.coreui_library_short_version}/${props.href}`;
+
+    return {
+      href,
+    };
+  },
+};
+</script>