052 - 관리자 메뉴 구성

src/components/layout/MemberMenu.vue

@@ -1,5 +1,21 @@
 <template>
   <div>
+		<v-list v-if="isAdmin" dense class="mt-n6">
+			<v-subheader>관리자 메뉴</v-subheader>
+			<v-list-item
+				v-for="item in admMenus"
+				:key="item.title"
+				dense
+				:to="item.to"
+			>
+				<v-list-item-icon>
+					<v-icon>{{item.icon}}</v-icon>
+				</v-list-item-icon>
+				<v-list-item-content>
+					<v-list-item-title>{{item.title}}</v-list-item-title>
+				</v-list-item-content>
+			</v-list-item>
+		</v-list>
     <v-card-actions>
       <v-btn color="primary" @click="$emit('open')" block>회원정보수정</v-btn>
     </v-card-actions>
@@ -10,13 +26,22 @@
 </template>
 
 <script>
-import { mapActions, mapState } from "vuex";
+import { mapActions, mapGetters, mapState } from "vuex";
 export default {
   name: "MemberMenu",
+	data() {
+		return {
+			admMenus : [
+				{title : '설정 관리', icon:'mdi-cog', to:'/adm/config'},
+				{title : '회원 관리', icon:'mdi-account-cog', to:'/adm/member'},
+			]
+		}
+	},
 	computed : {
 		...mapState({
 			member : state => state.user.member,
-		})
+		}),
+		...mapGetters('user', ['isAdmin'])
 	},
   methods: {
     ...mapActions("user", ["signOut"]),

src/router/routes.js

@@ -26,6 +26,11 @@ const routes = [
 		name: 'NoAuthModifyPassword',
 		component: () => import(/* webpackChunkName: "modifyPassword" */ '../views/member/ModifyPassword.vue')
 	},
+	{
+		path: '/adm/config',
+		name: 'AdmConfig',
+		component: () => import(/* webpackChunkName: "AdmConfig" */ '../views/admin/Config.vue')
+	},
 	{
 		path: '*',
 		name: 'Error',

src/store/modules/user.js

@@ -1,9 +1,10 @@
 import Vue from "vue";
 import qs from 'qs';
+import { LV } from '../../../util/level';
 
 export const state = () => ({
-	member : null,
-	token : null,
+	member: null,
+	token: null,
 });
 
 export const mutations = {
@@ -14,17 +15,24 @@ export const mutations = {
 		state.token = token;
 	}
 };
-export const getters = {};
+export const getters = {
+	isAdmin(state) {
+		return state.member && state.member.mb_level >= LV.ADMIN;
+	},
+	isSuper(state) {
+		return state.member && state.member.mb_level >= LV.SUPER;
+	}
+};
 export const actions = {
-	async initUser({commit}) {
-		const {$axios} = Vue.prototype;
+	async initUser({ commit }) {
+		const { $axios } = Vue.prototype;
 		const data = await $axios.get('api/member/auth');
-		if(data) {
+		if (data) {
 			commit('SET_MEMBER', data.member);
 			commit('SET_TOKEN', data.token);
 		}
 	},
-	async duplicateCheck(ctx, {field, value}) {
+	async duplicateCheck(ctx, { field, value }) {
 		const { $axios } = Vue.prototype;
 		const data = await $axios.get(`/api/member/duplicateCheck/${field}/${value}`);
 		return data;
@@ -34,16 +42,16 @@ export const actions = {
 		const data = await $axios.post('/api/member', form);
 		return data;
 	},
-	async signInLocal({commit}, form) {
+	async signInLocal({ commit }, form) {
 		const { $axios } = Vue.prototype;
 		const data = await $axios.post('/api/member/loginLocal', form);
-		if(data) {
+		if (data) {
 			commit('SET_MEMBER', data.member);
 			commit('SET_TOKEN', data.token);
 		}
 		return !!data;
 	},
-	async signOut({commit, state}) {
+	async signOut({ commit, state }) {
 		const { $axios } = Vue.prototype;
 		const mb_name = state.member.mb_name;
 		const data = await $axios.get('/api/member/signOut');
@@ -52,31 +60,31 @@ export const actions = {
 		return mb_name;
 	},
 	async findIdLocal(ctx, form) {
-		const {$axios} = Vue.prototype;
+		const { $axios } = Vue.prototype;
 		const query = qs.stringify(form);
 		const data = await $axios.get(`/api/member/findId?${query}`);
 		return data;
 	},
 	async findPwLocal(ctx, form) {
-		const {$axios} = Vue.prototype;
+		const { $axios } = Vue.prototype;
 		const query = qs.stringify(form);
 		const data = await $axios.get(`/api/member/findPw?${query}`);
 		return data;
 	},
 	async modifyPassword(ctx, form) {
-		const {$axios} = Vue.prototype;
+		const { $axios } = Vue.prototype;
 		const data = await $axios.patch(`/api/member/modifyPassword`, form);
 		return data;
 	},
 	async checkPassword(ctx, form) {
-		const {$axios} = Vue.prototype;
+		const { $axios } = Vue.prototype;
 		const data = await $axios.post(`/api/member/checkPassword`, form);
 		return data;
 	},
-	async updateMember({commit}, form) {
-		const {$axios} = Vue.prototype;
+	async updateMember({ commit }, form) {
+		const { $axios } = Vue.prototype;
 		const data = await $axios.patch(`/api/member`, form);
-		if(data) {
+		if (data) {
 			commit('SET_MEMBER', data);
 		}
 		return !!data;

src/views/admin/Config.vue

@@ -0,0 +1,15 @@
+<template>
+	<div>
+		Config.vue
+	</div>
+</template>
+
+<script>
+export default {
+	name : 'AdmConfig'
+}
+</script>
+
+<style>
+
+</style>