feat: v.1.4.3

Author: Flex-7746

CHANGELOG.md

@@ -1,5 +1,11 @@
 # 更新日志
 
+## 1.4.3
+
+- 新增：图片查看，支持同级快速预览
+- 新增：PDF 阅读，支持索引跳转和缩放
+- 支持：兼容 arm 设备
+
 ## 1.4.2
 
 - 新增：支持在刷新目录和在目录下创建文件

backend/src/utils/type.js

@@ -1,6 +1,7 @@
 const mimeMap = {
   // 文本类型
   css: "text/css",
+  mjs: "text/javascript",
   js: "text/javascript",
   html: "text/html",
   htm: "text/html",

frontend/components.d.ts

@@ -30,7 +30,6 @@ declare module 'vue' {
     FileView: typeof import('./src/components/FileView.vue')['default']
     ImageView: typeof import('./src/components/ImageView.vue')['default']
     MonacoEditor: typeof import('./src/components/MonacoEditor.vue')['default']
-    PdfEditor: typeof import('./src/components/PdfEditor.vue')['default']
     PdfView: typeof import('./src/components/PdfView.vue')['default']
   }
 }
@@ -55,6 +54,5 @@ declare global {
   const FileView: typeof import('./src/components/FileView.vue')['default']
   const ImageView: typeof import('./src/components/ImageView.vue')['default']
   const MonacoEditor: typeof import('./src/components/MonacoEditor.vue')['default']
-  const PdfEditor: typeof import('./src/components/PdfEditor.vue')['default']
   const PdfView: typeof import('./src/components/PdfView.vue')['default']
 }

frontend/src/components/PdfView.vue

@@ -43,13 +43,15 @@
     </div>
 
     <div class="body">
-      <div class="left" v-show="left.outline">
+      <div class="left" v-show="left.outline" :style="{ width: `${left.width}px` }">
         <el-tree
           :data="outline"
           :props="{ children: 'items', label: 'title' }"
           :expand-on-click-node="false"
           @node-click="outlineClick"
         />
+
+        <ClickMove @move="(v) => changeLeftWidth(v.x)" />
       </div>
       <div class="right">
         <div class="pages" ref="views" @scroll="onScroll">
@@ -75,6 +77,8 @@ import { debounce } from 'lodash'
 import * as pdfjsLib from 'pdfjs-dist'
 import workerUrl from 'pdfjs-dist/build/pdf.worker.min.mjs?url'
 
+import ClickMove from '@/components/ClickMove.vue'
+
 import { getFullPath } from '@/utils/file'
 import type { TreeNodeData } from 'element-plus'
 
@@ -88,7 +92,7 @@ interface OutlineModel {
 
 const $props = defineProps<{ src: string }>()
 
-const left = ref({ outline: true })
+const left = ref({ outline: true, width: 240 })
 
 const pdf = ref<pdfjsLib.PDFDocumentProxy>()
 const params = ref({ dpr: 1, width: 0, height: 0 })
@@ -196,6 +200,16 @@ const outlineClick = async (data: TreeNodeData) => {
     changeCur(page + 1)
   }
 }
+
+const changeLeftWidth = (v: number) => {
+  const newVal = left.value.width + v
+
+  if (newVal > 500 || newVal < 200) {
+    return
+  }
+
+  left.value.width = newVal
+}
 </script>
 
 <style lang="scss" scoped>
@@ -235,7 +249,6 @@ const outlineClick = async (data: TreeNodeData) => {
 
     > .left {
       position: relative;
-      width: 300px;
       border-right: 1px solid var(--el-border-color);
 
       > .el-tree {
@@ -246,6 +259,20 @@ const outlineClick = async (data: TreeNodeData) => {
         width: 100%;
         overflow: auto;
       }
+
+      > .click-move {
+        position: absolute;
+        top: 0;
+        bottom: 0;
+        right: 0;
+        width: 7px;
+        transform: translateX(4px);
+        cursor: e-resize;
+
+        &:hover {
+          background-color: var(--el-text-color-placeholder);
+        }
+      }
     }
 
     > .right {

package.json

@@ -1,7 +1,7 @@
 {
   "name": "code.editor",
-  "version": "1.4.2",
-  "changelog": "<div>新增：目录管理，支持打开、切换目录，便于用户操作</div><div>新增：打开时展示历史记录，便于快速访问</div><div>新增：偏好设置中新增启动时询问、自动换行</div><div>新增：图片预览功能</div><div>修复：偏好设置恢复默认不生效的问题</div>",
+  "version": "1.4.3",
+  "changelog": "<div>新增：图片查看，支持同级快速预览</div><div>新增：PDF 阅读，支持索引跳转和缩放</div><div>新增：支持刷新目录和在目录下创建文件</div><div>新增：偏好设置-启动时询问，可在桌面图标访问时不询问开启</div>",
   "scripts": {
     "dev": "node src/app.js",
     "install": "npm i --prefix=backend && npm i --prefix=frontend",