compdfkit_web_viewer/packages/webview/src/components/PageMode/PageMode.vue

<template>
  <Button :class="{ active: isOpen }" @click="changePageViewStatus" :title="$t('header.viewSetting')">
    <Pageset />
  </Button>
</template>

<script setup>
import { computed } from 'vue'
import { useViewerStore } from '@/stores/modules/viewer'

const useViewer = useViewerStore()
const isOpen = computed(() => useViewer.isElementOpen('pageModePanel'))
const toolMode = computed(() => useViewer.getToolMode)

const changePageViewStatus = () => {
  if (isOpen.value) {
    useViewer.closeElement('pageModePanel')
    toolMode.value === 'separation' && useViewer.openElement('colorSeparationPanel')
  } else {
    useViewer.openElement('pageModePanel')
    useViewer.closeElement('contentEditorPanel')
    toolMode.value === 'separation' && useViewer.closeElement('colorSeparationPanel')
  }
}
</script>