<template>
    <header class="admin-header pd15">
        <div class="flex justify-between align-center no-gutters">
            <div class="logo gd-2">
                <router-link :to="{path : '/invest/adm/main.page'}">ADMINISTRATOR</router-link>
            </div>
            <div class="gd-10">
                <nav>
                    <ul class="admin-main-menu flex justify-between align-center">
                        <li v-for="(menu, idx) in menuList" :key="idx" @click="subMenuShow(menu)"
                            :class="{ 'cursor': true, 'main-active': checkMenu == menu.menuId }">
                            {{ menu.menuNm }}
                        </li>
                    </ul>
                </nav>
            </div>
        </div>
    </header>
</template>

<script>
import store from "../../views/pages/AppStore";
import queryParams from '../../resources/js/queryParams';
import { defaultSearchParams } from '../../resources/js/defaultSearchParams';
import { findBySysMenu } from '../../resources/api/menu';

export default {
    mixins: [queryParams],
    components: {

    },
    data() {
        return {
            checkMenu: null,
            resetSearch: { ...defaultSearchParams },
            menuList: [],
        }
    },
    created() {
        this.findAll();
        this.menuCheck();
    },
    methods: {
        menuCheck() {
            const menu = store.state.menu;
            if(menu != null && menu != '' && menu != undefined) {
                this.checkMenu = menu.menuId;
            }
        },
        // 목록 조회
        async findAll() {
            try {
                const params = {
                    roles : store.state.roles.map(auth => auth.authority),
                    menuType : store.state.userType
                };
                const res = await findBySysMenu(params);
                if(res.status == 200) {
                    this.menuList = res.data.data.menuList;
                }
            } catch(error) {
                alert('에러가 발생했습니다.\n관리자에게 문의하세요.');
            }
        },
        async subMenuShow(menu) {
            this.saveQueryParams('queryParams', this.resetSearch); // 검색조건 초기화
            this.$store.commit('setMenu', menu);
        },

    },
    watch: {
        '$store.state.menu': function (newValue, oldValue) {
            if(newValue == null || newValue == '' || newValue == undefined) {
                this.checkMenu = null;
            } else {
                this.checkMenu = newValue.menuId;
            }
        },

    },
    computed: {

    },
    mounted() {

    }
}
</script>