zhanghuiqing
/
official_revision
1
0
포크 0
코드 이슈 0 풀 리퀘스트 0 릴리즈 0 위키 활동
소스 검색

去掉顶部菜单以及简单菜单

dev
X 4 년 전
부모
1a5502bc5d
커밋
553b023545
7개의 변경된 파일과 0개의 추가작업 그리고 2017개의 파일을 삭제
분할 보기
Diff Options
Show Stats Download Patch File Download Diff File
  1. +0
    -244
      src/layouts/SimpleMenu.vue
  2. +0
    -401
      src/layouts/TopMenu.vue
  3. +0
    -512
      src/router/index.js
  4. +0
    -4
      src/store/index.js
  5. +0
    -25
      src/store/side-menu.js
  6. +0
    -413
      src/store/simple-menu.js
  7. +0
    -418
      src/store/top-menu.js

+ 0
- 244
src/layouts/SimpleMenu.vue 파일 보기

@@ -1,244 +0,0 @@
<template>
<div>
<DarkModeSwitcher />
<MobileMenu />
<div class="flex">
<!-- BEGIN: Simple Menu -->
<nav class="side-nav side-nav--simple">
<!-- BEGIN: Logo -->
<router-link
:to="{ name: 'simple-menu-dashboard' }"
tag="a"
class="intro-x flex items-center pl-5 pt-4"
>
<img
alt="Midone Tailwind HTML Admin Template"
class="w-6"
src="@/assets/images/logo.svg"
/>
</router-link>
<!-- END: Logo -->
<div class="side-nav__devider my-6"></div>
<ul>
<!-- BEGIN: First Child -->
<template v-for="(menu, menuKey) in formattedMenu">
<li
v-if="menu == 'devider'"
:key="menuKey"
class="side-nav__devider my-6"
></li>
<li v-else :key="menuKey">
<Tippy
tag="a"
:content="menu.title"
:options="{
placement: 'left'
}"
href="javascript:;"
class="side-menu"
:class="{
'side-menu--active': menu.active,
'side-menu--open': menu.activeDropdown
}"
@click.native="linkTo(menu)"
>
<div class="side-menu__icon">
<component :is="menu.icon" />
</div>
<div class="side-menu__title">
{{ menu.title }}
<ChevronDownIcon
v-if="$h.isset(menu.subMenu)"
class="side-menu__sub-icon"
:class="{ 'transform rotate-180': menu.activeDropdown }"
/>
</div>
</Tippy>
<!-- BEGIN: Second Child -->
<transition @enter="enter" @leave="leave">
<ul v-if="$h.isset(menu.subMenu) && menu.activeDropdown">
<li
v-for="(subMenu, subMenuKey) in menu.subMenu"
:key="subMenuKey"
>
<Tippy
tag="a"
:content="subMenu.title"
:options="{
placement: 'left'
}"
href="javascript:;"
class="side-menu"
:class="{ 'side-menu--active': subMenu.active }"
@click.native="linkTo(subMenu)"
>
<div class="side-menu__icon">
<ActivityIcon />
</div>
<div class="side-menu__title">
{{ subMenu.title }}
<ChevronDownIcon
v-if="$h.isset(subMenu.subMenu)"
class="side-menu__sub-icon"
:class="{
'transform rotate-180': subMenu.activeDropdown
}"
/>
</div>
</Tippy>
<!-- BEGIN: Third Child -->
<transition @enter="enter" @leave="leave">
<ul
v-if="
$h.isset(subMenu.subMenu) && subMenu.activeDropdown
"
>
<li
v-for="(lastSubMenu,
lastSubMenuKey) in subMenu.subMenu"
:key="lastSubMenuKey"
>
<Tippy
tag="a"
:content="lastSubMenu.title"
:options="{
placement: 'left'
}"
href="javascript:;"
class="side-menu"
:class="{ 'side-menu--active': lastSubMenu.active }"
@click.native="linkTo(lastSubMenu)"
>
<div class="side-menu__icon">
<ZapIcon />
</div>
<div class="side-menu__title">
{{ lastSubMenu.title }}
</div>
</Tippy>
</li>
</ul>
</transition>
<!-- END: Third Child -->
</li>
</ul>
</transition>
<!-- END: Second Child -->
</li>
</template>
<!-- END: First Child -->
</ul>
</nav>
<!-- END: Simple Menu -->
<!-- BEGIN: Content -->
<div class="content">
<TopBar />
<router-view />
</div>
<!-- END: Content -->
</div>
</div>
</template>

<script>
import Velocity from "velocity-animate";
import TopBar from "@/components/TopBar";
import MobileMenu from "@/components/MobileMenu";
import DarkModeSwitcher from "@/components/DarkModeSwitcher";

export default {
components: {
DarkModeSwitcher,
MobileMenu,
TopBar
},
data() {
return {
formattedMenu: []
};
},
computed: {
simpleMenu() {
return this.nestedMenu(this.$store.state.simpleMenu.menu);
}
},
watch: {
$route() {
this.formattedMenu = this.$h.assign(this.simpleMenu);
}
},
mounted() {
cash("body")
.removeClass("login")
.addClass("app");
this.formattedMenu = this.$h.assign(this.simpleMenu);
},
methods: {
nestedMenu(menu) {
menu.forEach((item, key) => {
if (typeof item !== "string") {
menu[key].active =
(item.pageName == this.$route.name ||
(this.$h.isset(item.subMenu) &&
this.findActiveMenu(item.subMenu))) &&
!item.ignore;
}

if (this.$h.isset(item.subMenu)) {
menu[key].activeDropdown = this.findActiveMenu(item.subMenu);
menu[key] = {
...item,
...this.nestedMenu(item.subMenu)
};
}
});

return menu;
},
findActiveMenu(subMenu) {
let match = false;
subMenu.forEach(item => {
if (item.pageName == this.$route.name && !item.ignore) {
match = true;
} else if (!match && this.$h.isset(item.subMenu)) {
match = this.findActiveMenu(item.subMenu);
}
});
return match;
},
linkTo(menu) {
if (this.$h.isset(menu.subMenu)) {
menu.activeDropdown = !menu.activeDropdown;
} else {
this.$router.push({
name: menu.pageName
});
}
},
enter(el, done) {
Velocity(
el,
"slideDown",
{
duration: 300
},
{
complete: done
}
);
},
leave(el, done) {
Velocity(
el,
"slideUp",
{
duration: 300
},
{
complete: done
}
);
}
}
};
</script>

+ 0
- 401
src/layouts/TopMenu.vue 파일 보기

@@ -1,401 +0,0 @@
<template>
<div>
<DarkModeSwitcher />
<MobileMenu />
<!-- BEGIN: Top Bar -->
<div
class="border-b border-theme-24 -mt-10 md:-mt-5 -mx-3 sm:-mx-8 px-3 sm:px-8 pt-3 md:pt-0 mb-10"
>
<div class="top-bar-boxed flex items-center">
<!-- BEGIN: Logo -->
<router-link
:to="{ name: 'top-menu-dashboard' }"
tag="a"
class="-intro-x hidden md:flex"
>
<img
alt="Midone Tailwind HTML Admin Template"
class="w-6"
src="@/assets/images/logo.svg"
/>
<span class="text-white text-lg ml-3">
Mid<span class="font-medium">one</span>
</span>
</router-link>
<!-- END: Logo -->
<!-- BEGIN: Breadcrumb -->
<div class="-intro-x breadcrumb breadcrumb--light mr-auto">
<a href="" class="">Application</a>
<ChevronRightIcon class="breadcrumb__icon" />
<a href="" class="breadcrumb--active">Dashboard</a>
</div>
<!-- END: Breadcrumb -->
<!-- BEGIN: Search -->
<div class="intro-x relative mr-3 sm:mr-6">
<div class="search hidden sm:block">
<input
type="text"
class="search__input input dark:bg-dark-1 placeholder-theme-13"
placeholder="Search..."
@focus="showSearchDropdown"
@blur="hideSearchDropdown"
/>
<SearchIcon class="search__icon dark:text-gray-300" />
</div>
<a class="notification notification--light sm:hidden" href="">
<SearchIcon class="notification__icon dark:text-gray-300" />
</a>
<div class="search-result" :class="{ show: searchDropdown }">
<div class="search-result__content">
<div class="search-result__content__title">Pages</div>
<div class="mb-5">
<a href class="flex items-center">
<div
class="w-8 h-8 bg-theme-18 text-theme-9 flex items-center justify-center rounded-full"
>
<InboxIcon class="w-4 h-4" />
</div>
<div class="ml-3">Mail Settings</div>
</a>
<a href class="flex items-center mt-2">
<div
class="w-8 h-8 bg-theme-17 text-theme-11 flex items-center justify-center rounded-full"
>
<UsersIcon class="w-4 h-4" />
</div>
<div class="ml-3">Users & Permissions</div>
</a>
<a href class="flex items-center mt-2">
<div
class="w-8 h-8 bg-theme-14 text-theme-10 flex items-center justify-center rounded-full"
>
<CreditCardIcon class="w-4 h-4" />
</div>
<div class="ml-3">Transactions Report</div>
</a>
</div>
<div class="search-result__content__title">Users</div>
<div class="mb-5">
<a
v-for="(faker, fakerKey) in $_.take($f(), 4)"
:key="fakerKey"
href
class="flex items-center mt-2"
>
<div class="w-8 h-8 image-fit">
<img
alt="Midone Tailwind HTML Admin Template"
class="rounded-full"
:src="require(`@/assets/images/${faker.photos[0]}`)"
/>
</div>
<div class="ml-3">{{ faker.users[0].name }}</div>
<div
class="ml-auto w-48 truncate text-gray-600 text-xs text-right"
>
{{ faker.users[0].email }}
</div>
</a>
</div>
<div class="search-result__content__title">Products</div>
<a
v-for="(faker, fakerKey) in $_.take($f(), 4)"
:key="fakerKey"
href
class="flex items-center mt-2"
>
<div class="w-8 h-8 image-fit">
<img
alt="Midone Tailwind HTML Admin Template"
class="rounded-full"
:src="require(`@/assets/images/${faker.images[0]}`)"
/>
</div>
<div class="ml-3">{{ faker.products[0].name }}</div>
<div
class="ml-auto w-48 truncate text-gray-600 text-xs text-right"
>
{{ faker.products[0].category }}
</div>
</a>
</div>
</div>
</div>
<!-- END: Search -->
<!-- BEGIN: Notifications -->
<div class="intro-x dropdown relative mr-4 sm:mr-6">
<div
class="dropdown-toggle notification notification--light notification--bullet cursor-pointer"
>
<BellIcon class="notification__icon dark:text-gray-300" />
</div>
<div class="notification-content pt-2 dropdown-box">
<div
class="notification-content__box dropdown-box__content box dark:bg-dark-6"
>
<div class="notification-content__title">Notifications</div>
<div
v-for="(faker, fakerKey) in $_.take($f(), 5)"
:key="fakerKey"
class="cursor-pointer relative flex items-center"
:class="{ 'mt-5': fakerKey }"
>
<div class="w-12 h-12 flex-none image-fit mr-1">
<img
alt="Midone Tailwind HTML Admin Template"
class="rounded-full"
:src="require(`@/assets/images/${faker.photos[0]}`)"
/>
<div
class="w-3 h-3 bg-theme-9 absolute right-0 bottom-0 rounded-full border-2 border-white"
></div>
</div>
<div class="ml-2 overflow-hidden">
<div class="flex items-center">
<a href="javascript:;" class="font-medium truncate mr-5">
{{ faker.users[0].name }}
</a>
<div
class="text-xs text-gray-500 ml-auto whitespace-no-wrap"
>
{{ faker.times[0] }}
</div>
</div>
<div class="w-full truncate text-gray-600">
{{ faker.news[0].short_content }}
</div>
</div>
</div>
</div>
</div>
</div>
<!-- END: Notifications -->
<!-- BEGIN: Account Menu -->
<div class="intro-x dropdown w-8 h-8 relative">
<div
class="dropdown-toggle w-8 h-8 rounded-full overflow-hidden shadow-lg image-fit zoom-in scale-110"
>
<img
alt="Midone Tailwind HTML Admin Template"
:src="require(`@/assets/images/${$f()[9].photos[0]}`)"
/>
</div>
<div class="dropdown-box w-56">
<div
class="dropdown-box__content box bg-theme-38 dark:bg-dark-6 text-white"
>
<div class="p-4 border-b border-theme-40 dark:border-dark-3">
<div class="font-medium">{{ $f()[0].users[0].name }}</div>
<div class="text-xs text-theme-41 dark:text-gray-600">
{{ $f()[0].jobs[0] }}
</div>
</div>
<div class="p-2">
<a
href=""
class="flex items-center block p-2 transition duration-300 ease-in-out hover:bg-theme-1 dark:hover:bg-dark-3 rounded-md"
>
<UserIcon class="w-4 h-4 mr-2" /> Profile
</a>
<a
href=""
class="flex items-center block p-2 transition duration-300 ease-in-out hover:bg-theme-1 dark:hover:bg-dark-3 rounded-md"
>
<EditIcon class="w-4 h-4 mr-2" /> Add Account
</a>
<a
href=""
class="flex items-center block p-2 transition duration-300 ease-in-out hover:bg-theme-1 dark:hover:bg-dark-3 rounded-md"
>
<LockIcon class="w-4 h-4 mr-2" /> Reset Password
</a>
<a
href=""
class="flex items-center block p-2 transition duration-300 ease-in-out hover:bg-theme-1 dark:hover:bg-dark-3 rounded-md"
>
<HelpCircleIcon class="w-4 h-4 mr-2" />
Help
</a>
</div>
<div class="p-2 border-t border-theme-40 dark:border-dark-3">
<a
href=""
class="flex items-center block p-2 transition duration-300 ease-in-out hover:bg-theme-1 dark:hover:bg-dark-3 rounded-md"
>
<ToggleRightIcon class="w-4 h-4 mr-2" />
Logout
</a>
</div>
</div>
</div>
</div>
<!-- END: Account Menu -->
</div>
</div>
<!-- END: Top Bar -->
<!-- BEGIN: Top Menu -->
<nav class="top-nav">
<ul>
<!-- BEGIN: First Child -->
<template v-for="(menu, menuKey) in formattedMenu">
<li :key="menuKey">
<a
href="javascript:;"
class="top-menu"
:class="{
'top-menu--active': menu.active
}"
@click="linkTo(menu)"
>
<div class="top-menu__icon">
<component :is="menu.icon" />
</div>
<div class="top-menu__title">
{{ menu.title }}
<ChevronDownIcon
v-if="$h.isset(menu.subMenu)"
class="top-menu__sub-icon"
/>
</div>
</a>
<!-- BEGIN: Second Child -->
<ul v-if="$h.isset(menu.subMenu)">
<li
v-for="(subMenu, subMenuKey) in menu.subMenu"
:key="subMenuKey"
>
<a
href="javascript:;"
class="top-menu"
@click="linkTo(subMenu)"
>
<div class="top-menu__icon">
<ActivityIcon />
</div>
<div class="top-menu__title">
{{ subMenu.title }}
<ChevronDownIcon
v-if="$h.isset(subMenu.subMenu)"
class="top-menu__sub-icon"
/>
</div>
</a>
<!-- BEGIN: Third Child -->
<ul v-if="$h.isset(subMenu.subMenu)">
<li
v-for="(lastSubMenu, lastSubMenuKey) in subMenu.subMenu"
:key="lastSubMenuKey"
>
<a
href="javascript:;"
class="top-menu"
@click="linkTo(lastSubMenu)"
>
<div class="top-menu__icon">
<component :is="'zap-icon'" />
</div>
<div class="top-menu__title">
{{ lastSubMenu.title }}
</div>
</a>
</li>
</ul>
<!-- END: Third Child -->
</li>
</ul>
<!-- END: Second Child -->
</li>
</template>
<!-- END: First Child -->
</ul>
</nav>
<!-- END: Top Menu -->
<!-- BEGIN: Content -->
<div class="content">
<router-view />
</div>
<!-- END: Content -->
</div>
</template>

<script>
import TopBar from "@/components/TopBar";
import MobileMenu from "@/components/MobileMenu";
import DarkModeSwitcher from "@/components/DarkModeSwitcher";

export default {
components: {
DarkModeSwitcher,
MobileMenu,
TopBar
},
data() {
return {
formattedMenu: [],
searchDropdown: false
};
},
computed: {
topMenu() {
return this.nestedMenu(this.$store.state.topMenu.menu);
}
},
watch: {
$route() {
this.formattedMenu = this.$h.assign(this.topMenu);
}
},
mounted() {
cash("body")
.removeClass("login")
.addClass("app");
this.formattedMenu = this.$h.assign(this.topMenu);
},
methods: {
showSearchDropdown() {
this.searchDropdown = true;
},
hideSearchDropdown() {
this.searchDropdown = false;
},
nestedMenu(menu) {
menu.forEach((item, key) => {
if (typeof item !== "string") {
menu[key].active =
(item.pageName == this.$route.name ||
(this.$h.isset(item.subMenu) &&
this.findActiveMenu(item.subMenu))) &&
!item.ignore;
}

if (this.$h.isset(item.subMenu)) {
menu[key] = {
...item,
...this.nestedMenu(item.subMenu)
};
}
});

return menu;
},
findActiveMenu(subMenu) {
let match = false;
subMenu.forEach(item => {
if (item.pageName == this.$route.name && !item.ignore) {
match = true;
} else if (!match && this.$h.isset(item.subMenu)) {
match = this.findActiveMenu(item.subMenu);
}
});
return match;
},
linkTo(menu) {
if (!this.$h.isset(menu.subMenu)) {
this.$router.push({
name: menu.pageName
});
}
}
}
};
</script>

+ 0
- 512
src/router/index.js 파일 보기

@@ -264,518 +264,6 @@ const routes = [
}
]
},
{
path: "/simple-menu",
component: () => import('@/layouts/SimpleMenu'),
children: [
{
path: "/",
name: "simple-menu-dashboard",
component: () => import('@/views/Dashboard')
},
{
path: "inbox",
name: "simple-menu-inbox",
component: () => import('@/views/Inbox')
},
{
path: "file-manager",
name: "simple-menu-file-manager",
component: () => import('@/views/FileManager')
},
{
path: "point-of-sale",
name: "simple-menu-point-of-sale",
component: () => import('@/views/PointOfSale')
},
{
path: "chat",
name: "simple-menu-chat",
component: () => import('@/views/Chat')
},
{
path: "post",
name: "simple-menu-post",
component: () => import('@/views/Post')
},
{
path: "crud-data-list",
name: "simple-menu-crud-data-list",
component: () => import('@/views/CrudDataList')
},
{
path: "crud-form",
name: "simple-menu-crud-form",
component: () => import('@/views/CrudForm')
},
{
path: "users-layout-1",
name: "simple-menu-users-layout-1",
component: () => import('@/views/UsersLayout1')
},
{
path: "users-layout-2",
name: "simple-menu-users-layout-2",
component: () => import('@/views/UsersLayout2')
},
{
path: "users-layout-3",
name: "simple-menu-users-layout-3",
component: () => import('@/views/UsersLayout3')
},
{
path: "profile-overview-1",
name: "simple-menu-profile-overview-1",
component: () => import('@/views/ProfileOverview1')
},
{
path: "profile-overview-2",
name: "simple-menu-profile-overview-2",
component: () => import('@/views/ProfileOverview2')
},
{
path: "profile-overview-3",
name: "simple-menu-profile-overview-3",
component: () => import('@/views/ProfileOverview3')
},
{
path: "wizard-layout-1",
name: "simple-menu-wizard-layout-1",
component: () => import('@/views/WizardLayout1')
},
{
path: "wizard-layout-2",
name: "simple-menu-wizard-layout-2",
component: () => import('@/views/WizardLayout2')
},
{
path: "wizard-layout-3",
name: "simple-menu-wizard-layout-3",
component: () => import('@/views/WizardLayout3')
},
{
path: "blog-layout-1",
name: "simple-menu-blog-layout-1",
component: () => import('@/views/BlogLayout1')
},
{
path: "blog-layout-2",
name: "simple-menu-blog-layout-2",
component: () => import('@/views/BlogLayout2')
},
{
path: "blog-layout-3",
name: "simple-menu-blog-layout-3",
component: () => import('@/views/BlogLayout3')
},
{
path: "pricing-layout-1",
name: "simple-menu-pricing-layout-1",
component: () => import('@/views/PricingLayout1')
},
{
path: "pricing-layout-2",
name: "simple-menu-pricing-layout-2",
component: () => import('@/views/PricingLayout2')
},
{
path: "invoice-layout-1",
name: "simple-menu-invoice-layout-1",
component: () => import('@/views/InvoiceLayout1')
},
{
path: "invoice-layout-2",
name: "simple-menu-invoice-layout-2",
component: () => import('@/views/InvoiceLayout2')
},
{
path: "faq-layout-1",
name: "simple-menu-faq-layout-1",
component: () => import('@/views/FaqLayout1')
},
{
path: "faq-layout-2",
name: "simple-menu-faq-layout-2",
component: () => import('@/views/FaqLayout2')
},
{
path: "faq-layout-3",
name: "simple-menu-faq-layout-3",
component: () => import('@/views/FaqLayout3')
},
{
path: "update-profile",
name: "simple-menu-update-profile",
component: () => import('@/views/UpdateProfile')
},
{
path: "change-password",
name: "simple-menu-change-password",
component: () => import('@/views/ChangePassword')
},
{
path: "regular-table",
name: "simple-menu-regular-table",
component: () => import('@/views/RegularTable')
},
{
path: "tabulator",
name: "simple-menu-tabulator",
component: () => import('@/views/Tabulator')
},
{
path: "accordion",
name: "simple-menu-accordion",
component: () => import('@/views/Accordion')
},
{
path: "button",
name: "simple-menu-button",
component: () => import('@/views/Button')
},
{
path: "modal",
name: "simple-menu-modal",
component: () => import('@/views/Modal')
},
{
path: "alert",
name: "simple-menu-alert",
component: () => import('@/views/Alert')
},
{
path: "progress-bar",
name: "simple-menu-progress-bar",
component: () => import('@/views/ProgressBar')
},
{
path: "tooltip",
name: "simple-menu-tooltip",
component: () => import('@/views/Tooltip')
},
{
path: "dropdown",
name: "simple-menu-dropdown",
component: () => import('@/views/Dropdown')
},
{
path: "toast",
name: "simple-menu-toast",
component: () => import('@/views/Toast')
},
{
path: "typography",
name: "simple-menu-typography",
component: () => import('@/views/Typography')
},
{
path: "icon",
name: "simple-menu-icon",
component: () => import('@/views/Icon')
},
{
path: "loading-icon",
name: "simple-menu-loading-icon",
component: () => import('@/views/LoadingIcon')
},
{
path: "regular-form",
name: "simple-menu-regular-form",
component: () => import('@/views/RegularForm')
},
{
path: "datepicker",
name: "simple-menu-datepicker",
component: () => import('@/views/Datepicker')
},
{
path: "file-upload",
name: "simple-menu-file-upload",
component: () => import('@/views/FileUpload')
},
{
path: "wysiwyg-editor",
name: "simple-menu-wysiwyg-editor",
component: () => import('@/views/WysiwygEditor')
},
{
path: "validation",
name: "simple-menu-validation",
component: () => import('@/views/Validation')
},
{
path: "chart",
name: "simple-menu-chart",
component: () => import('@/views/Chart')
},
{
path: "slider",
name: "simple-menu-slider",
component: () => import('@/views/Slider')
},
{
path: "image-zoom",
name: "simple-menu-image-zoom",
component: () => import('@/views/ImageZoom')
}
]
},
{
path: "/top-menu",
component: () => import('@/layouts/TopMenu'),
children: [
{
path: "/",
name: "top-menu-dashboard",
component: () => import('@/views/Dashboard')
},
{
path: "inbox",
name: "top-menu-inbox",
component: () => import('@/views/Inbox')
},
{
path: "file-manager",
name: "top-menu-file-manager",
component: () => import('@/views/FileManager')
},
{
path: "point-of-sale",
name: "top-menu-point-of-sale",
component: () => import('@/views/PointOfSale')
},
{
path: "chat",
name: "top-menu-chat",
component: () => import('@/views/Chat')
},
{
path: "post",
name: "top-menu-post",
component: () => import('@/views/Post')
},
{
path: "crud-data-list",
name: "top-menu-crud-data-list",
component: () => import('@/views/CrudDataList')
},
{
path: "crud-form",
name: "top-menu-crud-form",
component: () => import('@/views/CrudForm')
},
{
path: "users-layout-1",
name: "top-menu-users-layout-1",
component: () => import('@/views/UsersLayout1')
},
{
path: "users-layout-2",
name: "top-menu-users-layout-2",
component: () => import('@/views/UsersLayout2')
},
{
path: "users-layout-3",
name: "top-menu-users-layout-3",
component: () => import('@/views/UsersLayout3')
},
{
path: "profile-overview-1",
name: "top-menu-profile-overview-1",
component: () => import('@/views/ProfileOverview1')
},
{
path: "profile-overview-2",
name: "top-menu-profile-overview-2",
component: () => import('@/views/ProfileOverview2')
},
{
path: "profile-overview-3",
name: "top-menu-profile-overview-3",
component: () => import('@/views/ProfileOverview3')
},
{
path: "wizard-layout-1",
name: "top-menu-wizard-layout-1",
component: () => import('@/views/WizardLayout1')
},
{
path: "wizard-layout-2",
name: "top-menu-wizard-layout-2",
component: () => import('@/views/WizardLayout2')
},
{
path: "wizard-layout-3",
name: "top-menu-wizard-layout-3",
component: () => import('@/views/WizardLayout3')
},
{
path: "blog-layout-1",
name: "top-menu-blog-layout-1",
component: () => import('@/views/BlogLayout1')
},
{
path: "blog-layout-2",
name: "top-menu-blog-layout-2",
component: () => import('@/views/BlogLayout2')
},
{
path: "blog-layout-3",
name: "top-menu-blog-layout-3",
component: () => import('@/views/BlogLayout3')
},
{
path: "pricing-layout-1",
name: "top-menu-pricing-layout-1",
component: () => import('@/views/PricingLayout1')
},
{
path: "pricing-layout-2",
name: "top-menu-pricing-layout-2",
component: () => import('@/views/PricingLayout2')
},
{
path: "invoice-layout-1",
name: "top-menu-invoice-layout-1",
component: () => import('@/views/InvoiceLayout1')
},
{
path: "invoice-layout-2",
name: "top-menu-invoice-layout-2",
component: () => import('@/views/InvoiceLayout2')
},
{
path: "faq-layout-1",
name: "top-menu-faq-layout-1",
component: () => import('@/views/FaqLayout1')
},
{
path: "faq-layout-2",
name: "top-menu-faq-layout-2",
component: () => import('@/views/FaqLayout2')
},
{
path: "faq-layout-3",
name: "top-menu-faq-layout-3",
component: () => import('@/views/FaqLayout3')
},
{
path: "update-profile",
name: "top-menu-update-profile",
component: () => import('@/views/UpdateProfile')
},
{
path: "change-password",
name: "top-menu-change-password",
component: () => import('@/views/ChangePassword')
},
{
path: "regular-table",
name: "top-menu-regular-table",
component: () => import('@/views/RegularTable')
},
{
path: "tabulator",
name: "top-menu-tabulator",
component: () => import('@/views/Tabulator')
},
{
path: "accordion",
name: "top-menu-accordion",
component: () => import('@/views/Accordion')
},
{
path: "button",
name: "top-menu-button",
component: () => import('@/views/Button')
},
{
path: "modal",
name: "top-menu-modal",
component: () => import('@/views/Modal')
},
{
path: "alert",
name: "top-menu-alert",
component: () => import('@/views/Alert')
},
{
path: "progress-bar",
name: "top-menu-progress-bar",
component: () => import('@/views/ProgressBar')
},
{
path: "tooltip",
name: "top-menu-tooltip",
component: () => import('@/views/Tooltip')
},
{
path: "dropdown",
name: "top-menu-dropdown",
component: () => import('@/views/Dropdown')
},
{
path: "toast",
name: "top-menu-toast",
component: () => import('@/views/Toast')
},
{
path: "typography",
name: "top-menu-typography",
component: () => import('@/views/Typography')
},
{
path: "icon",
name: "top-menu-icon",
component: () => import('@/views/Icon')
},
{
path: "loading-icon",
name: "top-menu-loading-icon",
component: () => import('@/views/LoadingIcon')
},
{
path: "regular-form",
name: "top-menu-regular-form",
component: () => import('@/views/RegularForm')
},
{
path: "datepicker",
name: "top-menu-datepicker",
component: () => import('@/views/Datepicker')
},
{
path: "file-upload",
name: "top-menu-file-upload",
component: () => import('@/views/FileUpload')
},
{
path: "wysiwyg-editor",
name: "top-menu-wysiwyg-editor",
component: () => import('@/views/WysiwygEditor')
},
{
path: "validation",
name: "top-menu-validation",
component: () => import('@/views/Validation')
},
{
path: "chart",
name: "top-menu-chart",
component: () => import('@/views/Chart')
},
{
path: "slider",
name: "top-menu-slider",
component: () => import('@/views/Slider')
},
{
path: "image-zoom",
name: "top-menu-image-zoom",
component: () => import('@/views/ImageZoom')
}
]
},
{
path: "/login",
name: "login",


+ 0
- 4
src/store/index.js 파일 보기

@@ -2,8 +2,6 @@ import Vue from "vue";
import Vuex from "vuex";
import main from "./main";
import sideMenu from "./side-menu";
import simpleMenu from "./simple-menu";
import topMenu from "./top-menu";

Vue.use(Vuex);

@@ -11,7 +9,5 @@ export default new Vuex.Store({
modules: {
main: main,
sideMenu: sideMenu,
simpleMenu: simpleMenu,
topMenu: topMenu
}
});

+ 0
- 25
src/store/side-menu.js 파일 보기

@@ -6,31 +6,6 @@ const state = () => {
pageName: "side-menu-dashboard",
title: "Dashboard"
},
{
icon: "BoxIcon",
pageName: "side-menu-menu-layout",
title: "Menu Layout",
subMenu: [
{
icon: "",
pageName: "side-menu-dashboard",
title: "Side Menu",
ignore: true
},
{
icon: "",
pageName: "simple-menu-dashboard",
title: "Simple Menu",
ignore: true
},
{
icon: "",
pageName: "top-menu-dashboard",
title: "Top Menu",
ignore: true
}
]
},
{
icon: "InboxIcon",
pageName: "side-menu-inbox",


+ 0
- 413
src/store/simple-menu.js 파일 보기

@@ -1,413 +0,0 @@
const state = () => {
return {
menu: [
{
icon: "HomeIcon",
pageName: "simple-menu-dashboard",
title: "Dashboard"
},
{
icon: "BoxIcon",
pageName: "simple-menu-menu-layout",
title: "Menu Layout",
subMenu: [
{
icon: "",
pageName: "side-menu-dashboard",
title: "Side Menu",
ignore: true
},
{
icon: "",
pageName: "simple-menu-dashboard",
title: "Simple Menu",
ignore: true
},
{
icon: "",
pageName: "top-menu-dashboard",
title: "Top Menu",
ignore: true
}
]
},
{
icon: "InboxIcon",
pageName: "simple-menu-inbox",
title: "Inbox"
},
{
icon: "HardDriveIcon",
pageName: "simple-menu-file-manager",
title: "File Manager"
},
{
icon: "CreditCardIcon",
pageName: "simple-menu-point-of-sale",
title: "Point of Sale"
},
{
icon: "MessageSquareIcon",
pageName: "simple-menu-chat",
title: "Chat"
},
{
icon: "FileTextIcon",
pageName: "simple-menu-post",
title: "Post"
},
"devider",
{
icon: "EditIcon",
pageName: "simple-menu-crud",
title: "Crud",
subMenu: [
{
icon: "",
pageName: "simple-menu-crud-data-list",
title: "Data List"
},
{
icon: "",
pageName: "simple-menu-crud-form",
title: "Form"
}
]
},
{
icon: "UsersIcon",
pageName: "simple-menu-users",
title: "Users",
subMenu: [
{
icon: "",
pageName: "simple-menu-users-layout-1",
title: "Layout 1"
},
{
icon: "",
pageName: "simple-menu-users-layout-2",
title: "Layout 2"
},
{
icon: "",
pageName: "simple-menu-users-layout-3",
title: "Layout 3"
}
]
},
{
icon: "TrelloIcon",
pageName: "simple-menu-profile",
title: "Profile",
subMenu: [
{
icon: "",
pageName: "simple-menu-profile-overview-1",
title: "Overview 1"
},
{
icon: "",
pageName: "simple-menu-profile-overview-2",
title: "Overview 2"
},
{
icon: "",
pageName: "simple-menu-profile-overview-3",
title: "Overview 3"
}
]
},
{
icon: "LayoutIcon",
pageName: "simple-menu-layout",
title: "Pages",
subMenu: [
{
icon: "",
pageName: "simple-menu-wizards",
title: "Wizards",
subMenu: [
{
icon: "",
pageName: "simple-menu-wizard-layout-1",
title: "Layout 1"
},
{
icon: "",
pageName: "simple-menu-wizard-layout-2",
title: "Layout 2"
},
{
icon: "",
pageName: "simple-menu-wizard-layout-3",
title: "Layout 3"
}
]
},
{
icon: "",
pageName: "simple-menu-blog",
title: "Blog",
subMenu: [
{
icon: "",
pageName: "simple-menu-blog-layout-1",
title: "Layout 1"
},
{
icon: "",
pageName: "simple-menu-blog-layout-2",
title: "Layout 2"
},
{
icon: "",
pageName: "simple-menu-blog-layout-3",
title: "Layout 3"
}
]
},
{
icon: "",
pageName: "simple-menu-pricing",
title: "Pricing",
subMenu: [
{
icon: "",
pageName: "simple-menu-pricing-layout-1",
title: "Layout 1"
},
{
icon: "",
pageName: "simple-menu-pricing-layout-2",
title: "Layout 2"
}
]
},
{
icon: "",
pageName: "simple-menu-invoice",
title: "Invoice",
subMenu: [
{
icon: "",
pageName: "simple-menu-invoice-layout-1",
title: "Layout 1"
},
{
icon: "",
pageName: "simple-menu-invoice-layout-2",
title: "Layout 2"
}
]
},
{
icon: "",
pageName: "simple-menu-faq",
title: "FAQ",
subMenu: [
{
icon: "",
pageName: "simple-menu-faq-layout-1",
title: "Layout 1"
},
{
icon: "",
pageName: "simple-menu-faq-layout-2",
title: "Layout 2"
},
{
icon: "",
pageName: "simple-menu-faq-layout-3",
title: "Layout 3"
}
]
},
{
icon: "",
pageName: "login",
title: "Login"
},
{
icon: "",
pageName: "register",
title: "Register"
},
{
icon: "",
pageName: "error-page",
title: "Error Page"
},
{
icon: "",
pageName: "simple-menu-update-profile",
title: "Update profile"
},
{
icon: "",
pageName: "simple-menu-change-password",
title: "Change Password"
}
]
},
"devider",
{
icon: "InboxIcon",
pageName: "simple-menu-components",
title: "Components",
subMenu: [
{
icon: "",
pageName: "simple-menu-grid",
title: "Grid",
subMenu: [
{
icon: "",
pageName: "simple-menu-regular-table",
title: "Regular Table"
},
{
icon: "",
pageName: "simple-menu-tabulator",
title: "Tabulator"
}
]
},
{
icon: "",
pageName: "simple-menu-accordion",
title: "Accordion"
},
{
icon: "",
pageName: "simple-menu-button",
title: "Button"
},
{
icon: "",
pageName: "simple-menu-modal",
title: "Modal"
},
{
icon: "",
pageName: "simple-menu-alert",
title: "Alert"
},
{
icon: "",
pageName: "simple-menu-progress-bar",
title: "Progress Bar"
},
{
icon: "",
pageName: "simple-menu-tooltip",
title: "Tooltip"
},
{
icon: "",
pageName: "simple-menu-dropdown",
title: "Dropdown"
},
{
icon: "",
pageName: "simple-menu-toast",
title: "Toast"
},
{
icon: "",
pageName: "simple-menu-typography",
title: "Typography"
},
{
icon: "",
pageName: "simple-menu-icon",
title: "Icon"
},
{
icon: "",
pageName: "simple-menu-loading-icon",
title: "Loading Icon"
}
]
},
{
icon: "SidebarIcon",
pageName: "simple-menu-forms",
title: "Forms",
subMenu: [
{
icon: "",
pageName: "simple-menu-regular-form",
title: "Regular Form"
},
{
icon: "",
pageName: "simple-menu-datepicker",
title: "Datepicker"
},
{
icon: "",
pageName: "simple-menu-tail-select",
title: "Tail Select"
},
{
icon: "",
pageName: "simple-menu-file-upload",
title: "File Upload"
},
{
icon: "",
pageName: "simple-menu-wysiwyg-editor",
title: "Wysiwyg Editor"
},
{
icon: "",
pageName: "simple-menu-validation",
title: "Validation"
}
]
},
{
icon: "HardDriveIcon",
pageName: "simple-menu-widgets",
title: "Widgets",
subMenu: [
{
icon: "",
pageName: "simple-menu-chart",
title: "Chart"
},
{
icon: "",
pageName: "simple-menu-slider",
title: "Slider"
},
{
icon: "",
pageName: "simple-menu-image-zoom",
title: "Image Zoom"
}
]
}
]
};
};

// getters
const getters = {
menu: state => state.menu
};

// actions
const actions = {};

// mutations
const mutations = {};

export default {
namespaced: true,
state,
getters,
actions,
mutations
};

+ 0
- 418
src/store/top-menu.js 파일 보기

@@ -1,418 +0,0 @@
const state = () => {
return {
menu: [
{
icon: "HomeIcon",
pageName: "top-menu-dashboard",
title: "Dashboard"
},
{
icon: "BoxIcon",
pageName: "top-menu-menu-layout",
title: "Menu Layout",
subMenu: [
{
icon: "",
pageName: "side-menu-dashboard",
title: "Side Menu",
ignore: true
},
{
icon: "",
pageName: "simple-menu-dashboard",
title: "Simple Menu",
ignore: true
},
{
icon: "",
pageName: "top-menu-dashboard",
title: "Top Menu",
ignore: true
}
]
},
{
icon: "ActivityIcon",
pageName: "top-menu-apps",
title: "Apps",
subMenu: [
{
icon: "UsersIcon",
pageName: "top-menu-users",
title: "Users",
subMenu: [
{
icon: "",
pageName: "top-menu-users-layout-1",
title: "Layout 1"
},
{
icon: "",
pageName: "top-menu-users-layout-2",
title: "Layout 2"
},
{
icon: "",
pageName: "top-menu-users-layout-3",
title: "Layout 3"
}
]
},
{
icon: "TrelloIcon",
pageName: "top-menu-profile",
title: "Profile",
subMenu: [
{
icon: "",
pageName: "top-menu-profile-overview-1",
title: "Overview 1"
},
{
icon: "",
pageName: "top-menu-profile-overview-2",
title: "Overview 2"
},
{
icon: "",
pageName: "top-menu-profile-overview-3",
title: "Overview 3"
}
]
},
{
icon: "InboxIcon",
pageName: "top-menu-inbox",
title: "Inbox"
},
{
icon: "FolderIcon",
pageName: "top-menu-file-manager",
title: "File Manager"
},
{
icon: "CreditCardIcon",
pageName: "top-menu-point-of-sale",
title: "Point of Sale"
},
{
icon: "MessageSquareIcon",
pageName: "top-menu-chat",
title: "Chat"
},
{
icon: "FileTextIcon",
pageName: "top-menu-post",
title: "Post"
},
{
icon: "EditIcon",
pageName: "top-menu-crud",
title: "Crud",
subMenu: [
{
icon: "",
pageName: "top-menu-crud-data-list",
title: "Data List"
},
{
icon: "",
pageName: "top-menu-crud-form",
title: "Form"
}
]
}
]
},
{
icon: "LayoutIcon",
pageName: "top-menu-layout",
title: "Pages",
subMenu: [
{
icon: "",
pageName: "top-menu-wizards",
title: "Wizards",
subMenu: [
{
icon: "",
pageName: "top-menu-wizard-layout-1",
title: "Layout 1"
},
{
icon: "",
pageName: "top-menu-wizard-layout-2",
title: "Layout 2"
},
{
icon: "",
pageName: "top-menu-wizard-layout-3",
title: "Layout 3"
}
]
},
{
icon: "",
pageName: "top-menu-blog",
title: "Blog",
subMenu: [
{
icon: "",
pageName: "top-menu-blog-layout-1",
title: "Layout 1"
},
{
icon: "",
pageName: "top-menu-blog-layout-2",
title: "Layout 2"
},
{
icon: "",
pageName: "top-menu-blog-layout-3",
title: "Layout 3"
}
]
},
{
icon: "",
pageName: "top-menu-pricing",
title: "Pricing",
subMenu: [
{
icon: "",
pageName: "top-menu-pricing-layout-1",
title: "Layout 1"
},
{
icon: "",
pageName: "top-menu-pricing-layout-2",
title: "Layout 2"
}
]
},
{
icon: "",
pageName: "top-menu-invoice",
title: "Invoice",
subMenu: [
{
icon: "",
pageName: "top-menu-invoice-layout-1",
title: "Layout 1"
},
{
icon: "",
pageName: "top-menu-invoice-layout-2",
title: "Layout 2"
}
]
},
{
icon: "",
pageName: "top-menu-faq",
title: "FAQ",
subMenu: [
{
icon: "",
pageName: "top-menu-faq-layout-1",
title: "Layout 1"
},
{
icon: "",
pageName: "top-menu-faq-layout-2",
title: "Layout 2"
},
{
icon: "",
pageName: "top-menu-faq-layout-3",
title: "Layout 3"
}
]
},
{
icon: "",
pageName: "login",
title: "Login"
},
{
icon: "",
pageName: "register",
title: "Register"
},
{
icon: "",
pageName: "error-page",
title: "Error Page"
},
{
icon: "",
pageName: "top-menu-update-profile",
title: "Update profile"
},
{
icon: "",
pageName: "top-menu-change-password",
title: "Change Password"
}
]
},
{
icon: "InboxIcon",
pageName: "top-menu-components",
title: "Components",
subMenu: [
{
icon: "",
pageName: "top-menu-grid",
title: "Grid",
subMenu: [
{
icon: "",
pageName: "top-menu-regular-table",
title: "Regular Table"
},
{
icon: "",
pageName: "top-menu-tabulator",
title: "Tabulator"
}
]
},
{
icon: "",
pageName: "top-menu-accordion",
title: "Accordion"
},
{
icon: "",
pageName: "top-menu-button",
title: "Button"
},
{
icon: "",
pageName: "top-menu-modal",
title: "Modal"
},
{
icon: "",
pageName: "top-menu-alert",
title: "Alert"
},
{
icon: "",
pageName: "top-menu-progress-bar",
title: "Progress Bar"
},
{
icon: "",
pageName: "top-menu-tooltip",
title: "Tooltip"
},
{
icon: "",
pageName: "top-menu-dropdown",
title: "Dropdown"
},
{
icon: "",
pageName: "top-menu-toast",
title: "Toast"
},
{
icon: "",
pageName: "top-menu-typography",
title: "Typography"
},
{
icon: "",
pageName: "top-menu-icon",
title: "Icon"
},
{
icon: "",
pageName: "top-menu-loading-icon",
title: "Loading Icon"
}
]
},
{
icon: "SidebarIcon",
pageName: "top-menu-forms",
title: "Forms",
subMenu: [
{
icon: "",
pageName: "top-menu-regular-form",
title: "Regular Form"
},
{
icon: "",
pageName: "top-menu-datepicker",
title: "Datepicker"
},
{
icon: "",
pageName: "top-menu-tail-select",
title: "Tail Select"
},
{
icon: "",
pageName: "top-menu-file-upload",
title: "File Upload"
},
{
icon: "",
pageName: "top-menu-wysiwyg-editor",
title: "Wysiwyg Editor"
},
{
icon: "",
pageName: "top-menu-validation",
title: "Validation"
}
]
},
{
icon: "HardDriveIcon",
pageName: "top-menu-widgets",
title: "Widgets",
subMenu: [
{
icon: "",
pageName: "top-menu-chart",
title: "Chart"
},
{
icon: "",
pageName: "top-menu-slider",
title: "Slider"
},
{
icon: "",
pageName: "top-menu-image-zoom",
title: "Image Zoom"
}
]
}
]
};
};

// getters
const getters = {
menu: state => state.menu
};

// actions
const actions = {};

// mutations
const mutations = {};

export default {
namespaced: true,
state,
getters,
actions,
mutations
};

쓰기 미리보기
불러오는 중...
취소
저장