<template>
  <div class="flex h-screen w-full bg-slate-950 overflow-hidden">
    <!-- 全局导航侧边栏 -->
    <GlobalSidebar />

    <!-- 主体区域 -->
    <main class="flex-1 flex overflow-hidden relative">
      <!-- 主页 -->
      <HomePage v-if="currentPage === 'home'" />

      <!-- 持久化布局面板 -->
      <template v-else>
        <!-- 左侧/中间配置侧边栏 -->
        <WriterPanel v-if="currentPage === 'writer'" />
        <AnalysisPanel v-else-if="currentPage === 'analysis'" />
        <ParadigmWriterPanel v-else-if="currentPage === 'paradigmWriter'" />
        <ComparePanel v-else-if="currentPage === 'compare'" />
        <ArticleRewritePanel v-else-if="currentPage === 'rewrite'" />
        <DiffAnnotationPanel v-else-if="currentPage === 'diffAnnotation'" />
        <DocumentsPanel 
          v-else-if="currentPage === 'documents'" 
          @toggle-version-panel="toggleVersionPanel"
          @document-selected="handleDocumentSelected"
        />
        <MaterialsPanel v-else-if="currentPage === 'materials'" />
        <SettingsPanel v-else-if="currentPage === 'settings'" />
        
        <!-- 右侧核心内容区（compare、rewrite 和 diffAnnotation 页面使用自己的内部布局） -->
        <MainContent v-if="currentPage !== 'compare' && currentPage !== 'rewrite' && currentPage !== 'diffAnnotation'" />
        
        <!-- 侧滑浮层面板 (仅文稿页) -->
        <DocumentVersionPanel
          v-if="currentPage === 'documents'"
          :visible="showVersionPanel"
          :document-id="selectedDocumentId"
          :current-content="selectedDocumentContent"
          @close="showVersionPanel = false"
          @restore="handleVersionRestore"
        />
      </template>
    </main>
  </div>
</template>

<script setup>
import { ref, computed } from 'vue'
import { useAppStore } from './stores/app'
import GlobalSidebar from './components/GlobalSidebar.vue'
import HomePage from './components/HomePage.vue'
import WriterPanel from './components/WriterPanel.vue'
import AnalysisPanel from './components/AnalysisPanel.vue'
import DocumentsPanel from './components/DocumentsPanel.vue'
import MaterialsPanel from './components/MaterialsPanel.vue'
import SettingsPanel from './components/SettingsPanel.vue'
import MainContent from './components/MainContent.vue'
import ComparePanel from './components/ComparePanel.vue'
import DocumentVersionPanel from './components/DocumentVersionPanel.vue'
import DiffAnnotationPanel from './components/DiffAnnotationPanel.vue'
import ArticleRewritePanel from './components/ArticleRewritePanel.vue'
import ParadigmWriterPanel from './components/ParadigmWriterPanel.vue'

const appStore = useAppStore()
const currentPage = computed(() => appStore.currentPage)

// 版本历史面板状态
const showVersionPanel = ref(false)
const selectedDocumentId = ref(null)
const selectedDocumentContent = ref('')

// 切换版本面板
const toggleVersionPanel = () => {
  showVersionPanel.value = !showVersionPanel.value
}

// 处理文稿选择
const handleDocumentSelected = (doc) => {
  selectedDocumentId.value = doc?.id || null
  selectedDocumentContent.value = doc?.content || ''
}

// 处理版本恢复
const handleVersionRestore = (content) => {
  selectedDocumentContent.value = content
  // 刷新 MainContent 显示
  if (appStore.currentDocument) {
    appStore.currentDocument.content = content
  }
}
</script>

