import { CONTACT_PROMPT_MODAL_KEY , CREDENTIAL_EDIT_MODAL_KEY , DUPLICATE_MODAL_KEY , PERSONALIZATION_MODAL_KEY , TAGS_MANAGER_MODAL_KEY , VERSIONS_MODAL_KEY , WORKFLOW_OPEN_MODAL_KEY , CREDENTIAL_SELECT_MODAL_KEY , WORKFLOW_SETTINGS_MODAL_KEY , CREDENTIAL_LIST_MODAL_KEY , VALUE_SURVEY_MODAL_KEY } from '@/constants' ; import Vue from 'vue' ; import { ActionContext , Module } from 'vuex' ; import { IRootState , IUiState , } from '../Interface' ; const module = { namespaced : true , state : { modals : { [ CONTACT_PROMPT_MODAL_KEY ] : { open : false , } , [ CREDENTIAL_EDIT_MODAL_KEY ] : { open : false , mode : '' , activeId : null , } , [ CREDENTIAL_LIST_MODAL_KEY ] : { open : false , } , [ CREDENTIAL_SELECT_MODAL_KEY ] : { open : false , } , [ DUPLICATE_MODAL_KEY ] : { open : false , } , [ PERSONALIZATION_MODAL_KEY ] : { open : false , } , [ TAGS_MANAGER_MODAL_KEY ] : { open : false , } , [ WORKFLOW_OPEN_MODAL_KEY ] : { open : false , } , [ VALUE_SURVEY_MODAL_KEY ] : { open : false , } , [ VERSIONS_MODAL_KEY ] : { open : false , } , [ WORKFLOW_SETTINGS_MODAL_KEY ] : { open : false , } , } , modalStack : [ ] , sidebarMenuCollapsed : true , isPageLoading : true , } , getters : { isVersionsOpen : ( state ) => { return state . modals [ VERSIONS_MODAL_KEY ] . open ; } , isModalOpen : ( state ) => { return ( name ) => state . modals [ name ] . open ; } , isModalActive : ( state ) => { return ( name ) => state . modalStack . length > 0 && name === state . modalStack [ 0 ] ; } , getModalActiveId : ( state ) => { return ( name ) => state . modals [ name ] . activeId ; } , getModalMode : ( state ) => { return ( name ) => state . modals [ name ] . mode ; } , sidebarMenuCollapsed : ( state ) : boolean => state . sidebarMenuCollapsed , } , mutations : { setMode : ( state , params ) => { const { name , mode } = params ; Vue . set ( state . modals [ name ] , 'mode' , mode ) ; } , setActiveId : ( state , params ) => { const { name , id } = params ; Vue . set ( state . modals [ name ] , 'activeId' , id ) ; } , openModal : ( state , name ) => { Vue . set ( state . modals [ name ] , 'open' , true ) ; state . modalStack = [ name ] . concat ( state . modalStack ) ; } , closeTopModal : ( state ) => { const name = state . modalStack [ 0 ] ; Vue . set ( state . modals [ name ] , 'open' , false ) ; if ( state . modals . mode ) { Vue . set ( state . modals [ name ] , 'mode' , '' ) ; } if ( state . modals . activeId ) { Vue . set ( state . modals [ name ] , 'activeId' , '' ) ; } state . modalStack = state . modalStack . slice ( 1 ) ; } , toggleSidebarMenuCollapse : ( state ) => { state . sidebarMenuCollapsed = ! state . sidebarMenuCollapsed ; } , } , actions : { openModal : async ( context , modalKey ) => { context . commit ( 'openModal' , modalKey ) ; } , openExisitngCredential : async ( context , { id } ) => { context . commit ( 'setActiveId' , { name : CREDENTIAL_EDIT_MODAL_KEY , id } ) ; context . commit ( 'setMode' , { name : CREDENTIAL_EDIT_MODAL_KEY , mode : 'edit' } ) ; context . commit ( 'openModal' , CREDENTIAL_EDIT_MODAL_KEY ) ; } , openNewCredential : async ( context , { type } ) => { context . commit ( 'setActiveId' , { name : CREDENTIAL_EDIT_MODAL_KEY , id : type } ) ; context . commit ( 'setMode' , { name : CREDENTIAL_EDIT_MODAL_KEY , mode : 'new' } ) ; context . commit ( 'openModal' , CREDENTIAL_EDIT_MODAL_KEY ) ; } , } , } ; export default module ;