Limit tab to 7 tabs

layouts/default.vue

@@ -177,6 +177,8 @@ import ThemeSwitch from "@/components/common/ThemeSwitch";
 import AdminMenu from "@/components/common/AdminMenu";
 import FadeLoader from "vue-spinner/src/FadeLoader.vue";
 import ChangePswdPop from "~/components/common/modal/ChangePswdPop";
+import { notification } from 'ant-design-vue';
+
 
 export default {
   components: {
@@ -233,6 +235,7 @@ export default {
       drawer: (state) => state.drawer,
       userInfo: (state) => state.userInfo,
       pageData: "pageData",
+      openTabList: (state) => state.openTabList 
     }),
     activeTabs() {
       if (this.routerTabInstance) {
@@ -275,6 +278,11 @@ export default {
 				var _this = this;
 				const nv = newVal[0];
 				const ov = oldVal[0];
+        // Check open tab at menu
+        if (this.openTabList.length > 7 && !this.openTabList.some(tab => tab.to === to.fullPath)) {
+          return;
+        }
+        
 				if (nv !== ov) {
 					if (!nv) {
 						// 중복클릭 시 발생 상황 기존 값을 다시 넣어줌
@@ -395,6 +403,24 @@ export default {
 
     this.$router.beforeEach((to, from, next) => {
       _this.isLoading = true;
+     
+      const tabList = this.openTabList;
+      const targetPrgmId = to.query.prgmId;
+      const currentPrgmId = from.query.prgmId;
+
+      const isTabAlreadyOpen = tabList.includes(targetPrgmId);
+      const isSamePage = to.fullPath === from.fullPath || targetPrgmId === currentPrgmId;
+
+      if (tabList.length >= 7 && !isTabAlreadyOpen && !isSamePage) {  
+        notification.error({
+          message: 'Error',
+          description: '탭을 7개 이상 열 수 없습니다.',
+        });
+        next(false);
+        return;
+      }
+
+
       // console.log('$router.beforeEach...');
       // console.log('state : ', _this.$store.state)
       // console.log('activeActionCnt : ', _this.$store.state.activeActionCnt)

store/index.js

@@ -136,6 +136,10 @@ export const state = () => Object.assign({}, INIT_STATE);
 export const mutations = {
 	// 활성화 페이지 메뉴정보 set
 	setActiveMenuInfo(state, payload) {
+		const isTabAlreadyOpen = state.openTabList.includes(payload.prgmId);
+		if(state.openTabList.length >= 7 && !isTabAlreadyOpen) {
+			return;
+		} 
 		// console.log("=======================================================");
 		// console.log(
 		//   ">>>>>>>>>> ",