Переглянути джерело

update: 字体配置;无header时更新面板高度

wzl 3 місяців тому
батько
коміт
06a2bad00d

+ 2 - 1
.gitignore

@@ -3,4 +3,5 @@ node_modules
 .pnpm-debug.log
 dist
 lib
-components.d.ts
+components.d.ts
+fonts

+ 9 - 9
packages/webview/src/components/App/index.vue

@@ -1,16 +1,16 @@
 <template>
   <div id="outerContainer" class="app" :class="{ dark: themeMode === 'Dark' }">
-    <Header v-if="!isDisabled" />
+    <Header v-if="!isHeaderDisabled" />
     <div class="content">
-      <LeftPanel />
-      <DocumentContainer :isDisabled="isDisabled" />
+      <LeftPanel :isHeaderDisabled="isHeaderDisabled" />
+      <DocumentContainer :isHeaderDisabled="isHeaderDisabled" />
       <CompareDocumentContainer />
       <DocumentEditorContainer v-if="toolMode === 'document'" :Sortable="Sortable" />
-      <RightPanel />
-      <RightPanelPageMode />
-      <StampPanel />
-      <LinkPanel />
-      <ContentEditorPanel />
+      <RightPanel :isHeaderDisabled="isHeaderDisabled" />
+      <RightPanelPageMode :isHeaderDisabled="isHeaderDisabled" />
+      <StampPanel :isHeaderDisabled="isHeaderDisabled" />
+      <LinkPanel :isHeaderDisabled="isHeaderDisabled" />
+      <ContentEditorPanel :isHeaderDisabled="isHeaderDisabled" />
     </div>
     <div class="mask" :class="{ active: downloading || downloadError !== '' }">
       <div v-show="downloading" class="loading"><Loading /></div>
@@ -58,7 +58,7 @@
     useViewer.setDisabledElements('header')
   }
 
-  const isDisabled = computed(() => useViewer.getDisabledElements('header'))
+  const isHeaderDisabled = computed(() => useViewer.getDisabledElements('header'))
 
   window.instance.changeFile = () => {
     const openFileInput = document.getElementById("fileInput")

+ 2 - 1
packages/webview/src/components/ContentEditorPanel/ContentEditorPanel.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="editor-panel" id="editorPanel" :class="{ closed: !isOpen }">
+  <div class="editor-panel" id="editorPanel" :class="{ closed: !isOpen }" :style="{ height: isHeaderDisabled ? '100%' : 'calc(100% - 88px)'}">
     <div class="title">{{ type === 'text' ? $t('editorPanel.textProp') : $t('editorPanel.imageProp') }}</div>
 
     <!-- 文本编辑 -->
@@ -147,6 +147,7 @@
   import core from '@/core'
   import { areColorsSimilar } from '@/helpers/utils'
 
+  const { isHeaderDisabled } = defineProps(['isHeaderDisabled'])
   const useViewer = useViewerStore()
   const instance = getCurrentInstance().appContext.app.config.globalProperties
   const $t = instance.$t

Різницю між файлами не показано, бо вона завелика
+ 5 - 4
packages/webview/src/components/DocumentContainer/DocumentContainer.vue


+ 4 - 3
packages/webview/src/components/LeftPanel/LeftPanel.vue

@@ -2,9 +2,9 @@
   <div
     class="left-panel"
     id="leftPanel"
-    :class="{
-      closed: !isOpen
-    }">
+    :class="{ closed: !isOpen }"
+    :style="{ height: isHeaderDisabled ? '100%' : 'calc(100% - 44px)'}"
+    >
     <div class="sidebar-tabs-header">
       <LeftPanelTabs :activePanelTab="activePanelTab" />
     </div>
@@ -40,6 +40,7 @@
   import { useViewerStore } from '@/stores/modules/viewer'
   import { useDocumentStore } from '@/stores/modules/document'
 
+  const { isHeaderDisabled } = defineProps(['isHeaderDisabled'])
   const useViewer = useViewerStore()
   const useDocument = useDocumentStore()
 

+ 2 - 1
packages/webview/src/components/LinkPanel/LinkPanel.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="link-panel" :class="{ closed: !isOpen }" id="linkPanel">
+  <div class="link-panel" :class="{ closed: !isOpen }" id="linkPanel" :style="{ height: isHeaderDisabled ? '100%' : 'calc(100% - 88px)'}">
     <div class="sidebar-title">{{ $t('linkPanel.linkTo') }}</div>
     <div class="sidebar-tabs-header">
       <Button
@@ -58,6 +58,7 @@
   import { useDocumentStore } from '@/stores/modules/document'
   import core from '@/core'
 
+  const { isHeaderDisabled } = defineProps(['isHeaderDisabled'])
   const useViewer = useViewerStore()
   const useDocument = useDocumentStore()
 

+ 4 - 3
packages/webview/src/components/RightPanel/RightPanel.vue

@@ -1,9 +1,9 @@
 <template>
   <div
     class="right-panel"
-    :class="{
-      closed: !isOpen
-    }">
+    :class="{ closed: !isOpen }"
+    :style="{ height: isHeaderDisabled ? '100%' : 'calc(100% - 88px)'}"
+    >
     <div class="sidebar-title">{{ title }}</div>
     <div class="sidebar-tabs-header">
       <RightPanelTabs :activePanelTab="activePanelTab" />
@@ -241,6 +241,7 @@
   import core from '@/core'
   import { areColorsSimilar } from '@/helpers/utils'
 
+  const { isHeaderDisabled } = defineProps(['isHeaderDisabled'])
   const useViewer = useViewerStore()
   const useDocument = useDocumentStore()
 

+ 4 - 3
packages/webview/src/components/RightPanelPageMode/RightPanelPageMode.vue

@@ -1,9 +1,9 @@
 <template>
   <div
     class="right-panel-page"
-    :class="{
-      closed: !isOpen
-    }">
+    :class="{ closed: !isOpen }"
+    :style="{ height: isHeaderDisabled ? '100%' : 'calc(100% - 44px)'}"
+    >
     <div class="sidebar-title">{{ $t('header.viewSetting') }}</div>
     <div class="mode-container">
       <div class="mode-item">
@@ -42,6 +42,7 @@
   import { useDocumentStore } from '@/stores/modules/document'
   import core from '@/core'
 
+  const { isHeaderDisabled } = defineProps(['isHeaderDisabled'])
   const useViewer = useViewerStore()
   const useDocument = useDocumentStore()
   const isOpen = computed(() => useViewer.isElementOpen('pageModePanel'))

+ 2 - 1
packages/webview/src/components/StampPanel/StampPanel.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="stamp-panel" :class="{ closed: !isOpen }">
+  <div class="stamp-panel" :class="{ closed: !isOpen }" :style="{ height: isHeaderDisabled ? '100%' : 'calc(100% - 88px)'}">
     <div class="sidebar-title">{{ $t('header.stamp') }}</div>
     <div class="sidebar-tabs-header">
       <Button
@@ -72,6 +72,7 @@
   import core from '@/core'
   const { switchTool, switchAnnotationEditorMode } = core
 
+  const { isHeaderDisabled } = defineProps(['isHeaderDisabled'])
   const useViewer = useViewerStore()
   const useDocument = useDocumentStore()