md2ui 1.0.18 → 1.0.20

package/src/utils/imageConverter.js

@@ -0,0 +1,129 @@
+/**
+ * 图片格式转换工具（共享模块）
+ * 提供 imgToPngBlob / svgToPngBlob 方法
+ * 供 useMarkdown.js 和 ImageZoom.vue 共用
+ */
+
+/**
+ * 将图片 URL 转为 PNG blob（兼容同源和跨域）
+ * 策略1：fetch 获取 → 策略2：crossOrigin Image → 策略3：无 crossOrigin 直接画
+ */
+export async function imgToPngBlob(src) {
+  try {
+    const resp = await fetch(src)
+    const blob = await resp.blob()
+    if (blob.type === 'image/png') return blob
+    return blobToCanvasPng(blob)
+  } catch {
+    try {
+      return await loadImageToBlob(src, true)
+    } catch {
+      return loadImageToBlob(src, false)
+    }
+  }
+}
+
+/**
+ * 加载图片到 canvas 并转 PNG blob
+ * @param {string} src - 图片地址
+ * @param {boolean} useCors - 是否设置 crossOrigin
+ */
+function loadImageToBlob(src, useCors) {
+  return new Promise((resolve, reject) => {
+    const image = new Image()
+    if (useCors) image.crossOrigin = 'anonymous'
+    image.onload = () => {
+      try {
+        const canvas = document.createElement('canvas')
+        canvas.width = image.naturalWidth
+        canvas.height = image.naturalHeight
+        canvas.getContext('2d').drawImage(image, 0, 0)
+        canvas.toBlob(b => b ? resolve(b) : reject(new Error('toBlob null')), 'image/png')
+      } catch (e) { reject(e) }
+    }
+    image.onerror = () => reject(new Error('图片加载失败'))
+    image.src = src
+  })
+}
+
+/**
+ * 将任意图片 blob 通过 canvas 转为 PNG blob
+ */
+function blobToCanvasPng(srcBlob, scale = 1) {
+  return new Promise((resolve, reject) => {
+    const url = URL.createObjectURL(srcBlob)
+    const image = new Image()
+    image.onload = () => {
+      const canvas = document.createElement('canvas')
+      canvas.width = image.naturalWidth * scale
+      canvas.height = image.naturalHeight * scale
+      const ctx = canvas.getContext('2d')
+      if (scale !== 1) ctx.scale(scale, scale)
+      ctx.drawImage(image, 0, 0)
+      URL.revokeObjectURL(url)
+      canvas.toBlob(b => resolve(b), 'image/png')
+    }
+    image.onerror = () => { URL.revokeObjectURL(url); reject(new Error('图片加载失败')) }
+    image.src = url
+  })
+}
+
+/**
+ * SVG 转 PNG blob（处理 foreignObject 导致的 tainted canvas 问题）
+ * @param {SVGElement} svgEl - SVG DOM 元素
+ * @param {number} scale - 缩放倍数，默认 2
+ */
+export function svgToPngBlob(svgEl, scale = 2) {
+  return new Promise((resolve, reject) => {
+    const clone = svgEl.cloneNode(true)
+    // 从 viewBox 或属性中获取 SVG 实际尺寸
+    const viewBox = clone.getAttribute('viewBox')
+    let svgWidth, svgHeight
+    if (viewBox) {
+      const parts = viewBox.split(/[\s,]+/)
+      svgWidth = parseFloat(parts[2])
+      svgHeight = parseFloat(parts[3])
+    }
+    if (!svgWidth || !svgHeight) {
+      svgWidth = parseFloat(clone.getAttribute('width')) || svgEl.getBoundingClientRect().width || 800
+      svgHeight = parseFloat(clone.getAttribute('height')) || svgEl.getBoundingClientRect().height || 600
+    }
+    // 显式设置 width/height，确保 Image 加载时尺寸正确
+    clone.setAttribute('width', svgWidth)
+    clone.setAttribute('height', svgHeight)
+    // 将 foreignObject 替换为 text 元素，避免 canvas 被污染
+    clone.querySelectorAll('foreignObject').forEach(fo => {
+      const text = fo.textContent.trim()
+      const x = fo.getAttribute('x') || '0'
+      const y = fo.getAttribute('y') || '0'
+      const width = fo.getAttribute('width') || '100'
+      const height = fo.getAttribute('height') || '20'
+      const textEl = document.createElementNS('http://www.w3.org/2000/svg', 'text')
+      textEl.setAttribute('x', String(parseFloat(x) + parseFloat(width) / 2))
+      textEl.setAttribute('y', String(parseFloat(y) + parseFloat(height) / 2 + 5))
+      textEl.setAttribute('text-anchor', 'middle')
+      textEl.setAttribute('font-size', '14')
+      textEl.setAttribute('fill', '#455a64')
+      textEl.textContent = text
+      fo.parentNode.replaceChild(textEl, fo)
+    })
+    const svgData = new XMLSerializer().serializeToString(clone)
+    const svgBlob = new Blob([svgData], { type: 'image/svg+xml;charset=utf-8' })
+    const url = URL.createObjectURL(svgBlob)
+    const image = new Image()
+    image.onload = () => {
+      const w = svgWidth * scale
+      const h = svgHeight * scale
+      const canvas = document.createElement('canvas')
+      canvas.width = w
+      canvas.height = h
+      const ctx = canvas.getContext('2d')
+      ctx.scale(scale, scale)
+      ctx.drawImage(image, 0, 0, svgWidth, svgHeight)
+      URL.revokeObjectURL(url)
+      canvas.toBlob(b => b ? resolve(b) : reject(new Error('toBlob null')), 'image/png')
+    }
+    image.onerror = () => { URL.revokeObjectURL(url); reject(new Error('SVG加载失败')) }
+    image.src = url
+  })
+}

package/vite-plugin-doc-api.js

@@ -0,0 +1,369 @@
+import fs from 'fs'
+import path from 'path'
+import crypto from 'crypto'
+
+/**
+ * Vite 插件：文档 API（统一使用 /@user-docs-* 路由前缀）
+ *
+ * 路由：
+ * - GET  /@user-docs-list     返回文档树 + ETag
+ * - GET  /@user-docs/xxx      返回文件内容（md / 图片等）
+ * - POST /@upload-image       上传图片
+ * - POST /api/save            保存文件内容
+ * - POST /api/create          创建文件或文件夹
+ * - POST /api/delete          删除文件或文件夹
+ * - POST /api/rename          重命名
+ * - POST /api/reorder         批量重编号
+ * - POST /api/move            移动文件/文件夹
+ */
+export default function docApiPlugin(docsDir = '.') {
+  const resolvedDocsDir = path.resolve(docsDir)
+
+  // 计算内容的 ETag
+  function etag(content) {
+    return '"' + crypto.createHash('md5').update(content).digest('hex') + '"'
+  }
+
+  // 安全路径验证：使用 path.relative 防止路径遍历
+  function safePath(filePath) {
+    const fullPath = path.resolve(resolvedDocsDir, filePath)
+    const relative = path.relative(resolvedDocsDir, fullPath)
+    if (relative.startsWith('..') || path.isAbsolute(relative)) {
+      return null // 路径越界
+    }
+    return fullPath
+  }
+
+  // 解析 POST 请求的 JSON body
+  function parseJsonBody(req) {
+    return new Promise((resolve, reject) => {
+      let body = ''
+      req.on('data', chunk => { body += chunk })
+      req.on('end', () => {
+        try { resolve(JSON.parse(body)) }
+        catch (e) { reject(e) }
+      })
+      req.on('error', reject)
+    })
+  }
+
+  // 递归扫描 .md 文件，返回树结构（与 CLI 模式 scanDocs 一致）
+  function scanDocs(dir, basePath = '', level = 0) {
+    const items = []
+    if (!fs.existsSync(dir)) return items
+    const entries = fs.readdirSync(dir, { withFileTypes: true })
+      .filter(e => !e.name.startsWith('.') && e.name !== 'node_modules')
+      .sort((a, b) => a.name.localeCompare(b.name, 'zh-CN'))
+
+    for (const entry of entries) {
+      const fullPath = path.join(dir, entry.name)
+      const relativePath = basePath ? `${basePath}/${entry.name}` : entry.name
+
+      if (entry.isDirectory()) {
+        const children = scanDocs(fullPath, relativePath, level + 1)
+        if (children.length > 0) {
+          const match = entry.name.match(/^(\d+)-(.+)$/)
+          items.push({
+            key: relativePath,
+            label: match ? match[2] : entry.name,
+            order: match ? parseInt(match[1]) : 999,
+            type: 'folder',
+            level,
+            expanded: false,
+            children
+          })
+        }
+      } else if (entry.name.endsWith('.md')) {
+        const match = entry.name.match(/^(\d+)-(.+)\.md$/)
+        const label = match ? match[2] : entry.name.replace(/\.md$/, '')
+        items.push({
+          key: relativePath.replace(/\.md$/, ''),
+          label,
+          order: match ? parseInt(match[1]) : 999,
+          type: 'file',
+          level,
+          path: `/@user-docs/${relativePath}`
+        })
+      }
+    }
+
+    items.sort((a, b) => a.order - b.order)
+    return items
+  }
+
+  // MIME 类型映射
+  const mimeMap = {
+    md: 'text/plain; charset=utf-8',
+    png: 'image/png',
+    jpg: 'image/jpeg',
+    jpeg: 'image/jpeg',
+    gif: 'image/gif',
+    webp: 'image/webp',
+    svg: 'image/svg+xml',
+    bmp: 'image/bmp',
+  }
+
+  return {
+    name: 'vite-plugin-doc-api',
+    configureServer(server) {
+      // 统一中间件
+      server.middlewares.use((req, res, next) => {
+        // GET /@user-docs-list — 返回文档树 + ETag
+        if (req.url === '/@user-docs-list' && req.method === 'GET') {
+          const docs = scanDocs(resolvedDocsDir)
+          const body = JSON.stringify(docs)
+          const tag = etag(body)
+          if (req.headers['if-none-match'] === tag) {
+            res.statusCode = 304; res.end(); return
+          }
+          res.setHeader('Content-Type', 'application/json; charset=utf-8')
+          res.setHeader('ETag', tag)
+          res.end(body)
+          return
+        }
+
+        // GET /@user-docs/xxx — 返回文件内容（md / 图片等）
+        if (req.url?.startsWith('/@user-docs/') && req.method === 'GET') {
+          const filePath = safePath(decodeURIComponent(req.url.replace('/@user-docs/', '')))
+          if (!filePath) {
+            res.statusCode = 403; res.end('禁止访问'); return
+          }
+          if (!fs.existsSync(filePath)) {
+            res.statusCode = 404; res.end('文件不存在'); return
+          }
+          const extName = filePath.split('.').pop().toLowerCase()
+          const contentType = mimeMap[extName] || 'application/octet-stream'
+          res.setHeader('Content-Type', contentType)
+          // 附带最后修改时间
+          const stat = fs.statSync(filePath)
+          res.setHeader('X-Last-Modified', stat.mtime.toISOString())
+          // 文本文件支持 ETag
+          if (contentType.startsWith('text/')) {
+            const content = fs.readFileSync(filePath, 'utf-8')
+            const tag = etag(content)
+            if (req.headers['if-none-match'] === tag) {
+              res.statusCode = 304; res.end(); return
+            }
+            res.setHeader('ETag', tag)
+            res.end(content)
+          } else {
+            res.end(fs.readFileSync(filePath))
+          }
+          return
+        }
+
+        // POST /@upload-image — 上传图片
+        if (req.url === '/@upload-image' && req.method === 'POST') {
+          const chunks = []
+          req.on('data', chunk => chunks.push(chunk))
+          req.on('end', () => {
+            try {
+              const body = Buffer.concat(chunks)
+              const docPath = decodeURIComponent(req.headers['x-doc-path'] || '')
+              const fileName = decodeURIComponent(req.headers['x-file-name'] || `img-${Date.now()}.png`)
+
+              if (!docPath) {
+                res.statusCode = 400; res.end('缺少文档路径'); return
+              }
+
+              const docDir = path.dirname(path.resolve(resolvedDocsDir, docPath))
+              const relative = path.relative(resolvedDocsDir, docDir)
+              if (relative.startsWith('..') || path.isAbsolute(relative)) {
+                res.statusCode = 403; res.end('禁止访问'); return
+              }
+
+              const assetsDir = path.join(docDir, 'assets')
+              fs.mkdirSync(assetsDir, { recursive: true })
+
+              const ext = path.extname(fileName) || '.png'
+              const baseName = `img-${Date.now()}`
+              const targetName = `${baseName}${ext}`
+              const targetPath = path.join(assetsDir, targetName)
+
+              fs.writeFileSync(targetPath, body)
+
+              // 返回 /@user-docs/ 前缀的路径
+              const docDirRel = path.dirname(docPath)
+              const encodedDir = docDirRel && docDirRel !== '.'
+                ? docDirRel.split('/').map(encodeURIComponent).join('/')
+                : ''
+              const imageUrl = encodedDir
+                ? `/@user-docs/${encodedDir}/assets/${targetName}`
+                : `/@user-docs/assets/${targetName}`
+
+              res.setHeader('Content-Type', 'application/json; charset=utf-8')
+              res.end(JSON.stringify({ url: imageUrl }))
+            } catch (e) {
+              res.statusCode = 500; res.end(e.message)
+            }
+          })
+          return
+        }
+
+        next()
+      })
+
+      // POST /api/create — 创建文件或文件夹
+      server.middlewares.use('/api/create', async (req, res) => {
+        if (req.method !== 'POST') { res.statusCode = 405; res.end(); return }
+        try {
+          const { path: filePath, type } = await parseJsonBody(req)
+          if (!filePath) {
+            res.statusCode = 400; res.end('缺少 path'); return
+          }
+          const fullPath = safePath(filePath)
+          if (!fullPath) {
+            res.statusCode = 403; res.end('禁止访问'); return
+          }
+          if (fs.existsSync(fullPath)) {
+            res.statusCode = 409; res.end('已存在同名文件或文件夹'); return
+          }
+          if (type === 'folder') {
+            fs.mkdirSync(fullPath, { recursive: true })
+          } else {
+            fs.mkdirSync(path.dirname(fullPath), { recursive: true })
+            fs.writeFileSync(fullPath, '', 'utf-8')
+          }
+          res.setHeader('Content-Type', 'application/json')
+          res.end(JSON.stringify({ ok: true }))
+        } catch (e) {
+          res.statusCode = 500; res.end(e.message)
+        }
+      })
+
+      // POST /api/delete — 删除文件或文件夹
+      server.middlewares.use('/api/delete', async (req, res) => {
+        if (req.method !== 'POST') { res.statusCode = 405; res.end(); return }
+        try {
+          const { path: filePath } = await parseJsonBody(req)
+          if (!filePath) {
+            res.statusCode = 400; res.end('缺少 path'); return
+          }
+          const fullPath = safePath(filePath)
+          if (!fullPath) {
+            res.statusCode = 403; res.end('禁止访问'); return
+          }
+          if (!fs.existsSync(fullPath)) {
+            res.statusCode = 404; res.end('文件不存在'); return
+          }
+          fs.rmSync(fullPath, { recursive: true, force: true })
+          res.setHeader('Content-Type', 'application/json')
+          res.end(JSON.stringify({ ok: true }))
+        } catch (e) {
+          res.statusCode = 500; res.end(e.message)
+        }
+      })
+
+      // POST /api/rename — 重命名文件或文件夹
+      server.middlewares.use('/api/rename', async (req, res) => {
+        if (req.method !== 'POST') { res.statusCode = 405; res.end(); return }
+        try {
+          const { oldPath, newPath } = await parseJsonBody(req)
+          if (!oldPath || !newPath) {
+            res.statusCode = 400; res.end('缺少 oldPath 或 newPath'); return
+          }
+          const fullOld = safePath(oldPath)
+          const fullNew = safePath(newPath)
+          if (!fullOld || !fullNew) {
+            res.statusCode = 403; res.end('禁止访问'); return
+          }
+          if (!fs.existsSync(fullOld)) {
+            res.statusCode = 404; res.end('源文件不存在'); return
+          }
+          if (fs.existsSync(fullNew)) {
+            res.statusCode = 409; res.end('目标名称已存在'); return
+          }
+          fs.mkdirSync(path.dirname(fullNew), { recursive: true })
+          fs.renameSync(fullOld, fullNew)
+          res.setHeader('Content-Type', 'application/json')
+          res.end(JSON.stringify({ ok: true }))
+        } catch (e) {
+          res.statusCode = 500; res.end(e.message)
+        }
+      })
+
+      // POST /api/reorder — 批量重编号
+      server.middlewares.use('/api/reorder', async (req, res) => {
+        if (req.method !== 'POST') { res.statusCode = 405; res.end(); return }
+        try {
+          const { items } = await parseJsonBody(req)
+          if (!Array.isArray(items) || items.length === 0) {
+            res.statusCode = 400; res.end('缺少 items'); return
+          }
+          // 验证所有路径
+          for (const { oldPath, newPath } of items) {
+            if (!safePath(oldPath) || !safePath(newPath)) {
+              res.statusCode = 403; res.end('禁止访问'); return
+            }
+          }
+          // 先全部重命名为临时文件，再重命名为目标文件（避免冲突）
+          const tempMap = []
+          for (let i = 0; i < items.length; i++) {
+            const { oldPath } = items[i]
+            const fullOld = safePath(oldPath)
+            if (!fullOld || !fs.existsSync(fullOld)) continue
+            const tempName = fullOld + `.__reorder_tmp_${i}__`
+            fs.renameSync(fullOld, tempName)
+            tempMap.push({ temp: tempName, newPath: items[i].newPath })
+          }
+          for (const { temp, newPath: np } of tempMap) {
+            const fullNew = safePath(np)
+            if (!fullNew) continue
+            fs.mkdirSync(path.dirname(fullNew), { recursive: true })
+            fs.renameSync(temp, fullNew)
+          }
+          res.setHeader('Content-Type', 'application/json')
+          res.end(JSON.stringify({ ok: true }))
+        } catch (e) {
+          res.statusCode = 500; res.end(e.message)
+        }
+      })
+
+      // POST /api/move — 移动文件/文件夹
+      server.middlewares.use('/api/move', async (req, res) => {
+        if (req.method !== 'POST') { res.statusCode = 405; res.end(); return }
+        try {
+          const { oldPath, newPath } = await parseJsonBody(req)
+          if (!oldPath || !newPath) {
+            res.statusCode = 400; res.end('缺少 oldPath 或 newPath'); return
+          }
+          const fullOld = safePath(oldPath)
+          const fullNew = safePath(newPath)
+          if (!fullOld || !fullNew) {
+            res.statusCode = 403; res.end('禁止访问'); return
+          }
+          if (!fs.existsSync(fullOld)) {
+            res.statusCode = 404; res.end('源文件不存在'); return
+          }
+          fs.mkdirSync(path.dirname(fullNew), { recursive: true })
+          fs.renameSync(fullOld, fullNew)
+          res.setHeader('Content-Type', 'application/json')
+          res.end(JSON.stringify({ ok: true }))
+        } catch (e) {
+          res.statusCode = 500; res.end(e.message)
+        }
+      })
+
+      // POST /api/save — 保存文件内容
+      server.middlewares.use('/api/save', async (req, res) => {
+        if (req.method !== 'POST') { res.statusCode = 405; res.end(); return }
+        try {
+          const { path: filePath, content } = await parseJsonBody(req)
+          if (!filePath || content == null) {
+            res.statusCode = 400; res.end('缺少 path 或 content'); return
+          }
+          const fullPath = safePath(filePath)
+          if (!fullPath) {
+            res.statusCode = 403; res.end('禁止访问'); return
+          }
+          fs.mkdirSync(path.dirname(fullPath), { recursive: true })
+          fs.writeFileSync(fullPath, content, 'utf-8')
+          res.setHeader('Content-Type', 'application/json')
+          res.end(JSON.stringify({ ok: true }))
+        } catch (e) {
+          res.statusCode = 500; res.end(e.message)
+        }
+      })
+    }
+  }
+}

package/vite.config.js

@@ -1,13 +1,18 @@
 import { defineConfig } from 'vite'
 import vue from '@vitejs/plugin-vue'
 import { config } from './src/config.js'
+import docApiPlugin from './vite-plugin-doc-api.js'
 
 export default defineConfig({
-  plugins: [vue()],
+  plugins: [vue(), docApiPlugin('public/docs')],
   server: {
     port: config.defaultPort
   },
   optimizeDeps: {
-    include: ['vue', 'marked', 'mermaid']
+    include: [
+      'vue',
+      'marked',
+      'mermaid',
+    ],
   }
 })

package/public/docs/02-Mermaid/345/233/276/350/241/250.md

@@ -1,102 +0,0 @@
-# Mermaid 图表
-
-md2ui 内置了 Mermaid 支持，可以直接在 Markdown 中绘制各类图表。
-
-## 流程图
-
-```mermaid
-flowchart TD
-    A[开始] --> B{是否有文档?}
-    B -->|是| C[解析 Markdown]
-    B -->|否| D[显示空状态]
-    C --> E[渲染 HTML]
-    E --> F[展示页面]
-    D --> F
-    F --> G[结束]
-```
-
-## 时序图
-
-```mermaid
-sequenceDiagram
-    participant U as 用户
-    participant B as 浏览器
-    participant S as 服务器
-    
-    U->>B: 点击文档链接
-    B->>S: 请求 Markdown 文件
-    S-->>B: 返回文件内容
-    B->>B: 解析并渲染
-    B-->>U: 显示文档页面
-```
-
-## 类图
-
-```mermaid
-classDiagram
-    class Document {
-        +String title
-        +String content
-        +Date createdAt
-        +render()
-    }
-    
-    class Folder {
-        +String name
-        +Document[] documents
-        +Folder[] subfolders
-        +expand()
-        +collapse()
-    }
-    
-    class Navigator {
-        +Folder root
-        +Document current
-        +navigate(path)
-    }
-    
-    Folder "1" *-- "*" Document
-    Folder "1" *-- "*" Folder
-    Navigator --> Folder
-    Navigator --> Document
-```
-
-## 状态图
-
-```mermaid
-stateDiagram-v2
-    [*] --> 空闲
-    空闲 --> 加载中: 请求文档
-    加载中 --> 已加载: 加载成功
-    加载中 --> 错误: 加载失败
-    已加载 --> 空闲: 切换文档
-    错误 --> 空闲: 重试
-```
-
-## 甘特图
-
-```mermaid
-gantt
-    title 项目开发计划
-    dateFormat  YYYY-MM-DD
-    section 基础功能
-    Markdown 渲染     :done, a1, 2024-01-01, 7d
-    目录导航          :done, a2, after a1, 5d
-    section 增强功能
-    Mermaid 支持      :done, b1, after a2, 3d
-    代码高亮          :done, b2, after b1, 2d
-    section 优化
-    性能优化          :active, c1, after b2, 5d
-    响应式适配        :c2, after c1, 3d
-```
-
-## 饼图
-
-```mermaid
-pie title 技术栈占比
-    "Vue 3" : 40
-    "Vite" : 20
-    "Marked" : 15
-    "Mermaid" : 15
-    "其他" : 10
-```

package/public/docs/03-/350/277/233/351/230/266/346/214/207/345/215/227/01-/347/233/256/345/275/225/347/273/223/346/236/204.md

@@ -1,55 +0,0 @@
-# 目录结构
-
-了解 md2ui 的项目结构，有助于你进行定制开发。
-
-## 项目结构
-
-```
-md2ui/
-├── public/                 # 静态资源
-│   ├── README.md          # 首页内容
-│   ├── logo.svg           # 网站图标
-│   └── docs/              # 文档目录
-├── src/
-│   ├── api/               # API 接口
-│   │   └── docs.js        # 文档列表获取
-│   ├── components/        # Vue 组件
-│   │   ├── Logo.vue       # Logo 组件
-│   │   ├── TreeNode.vue   # 树形节点
-│   │   ├── TableOfContents.vue  # 目录组件
-│   │   └── ImageZoom.vue  # 图片放大
-│   ├── composables/       # 组合式函数
-│   │   ├── useMarkdown.js # Markdown 渲染
-│   │   ├── useScroll.js   # 滚动处理
-│   │   └── useResize.js   # 拖拽调整
-│   ├── App.vue            # 主组件
-│   ├── main.js            # 入口文件
-│   └── style.css          # 全局样式
-├── index.html             # HTML 模板
-├── vite.config.js         # Vite 配置
-└── package.json           # 项目配置
-```
-
-## 核心模块说明
-
-### api/docs.js
-
-负责扫描 `public/docs/` 目录，构建文档树结构。
-
-### composables/useMarkdown.js
-
-封装 Markdown 解析逻辑，包括：
-- 使用 marked 解析 Markdown
-- 提取标题生成目录
-- 处理 Mermaid 代码块
-
-### composables/useScroll.js
-
-处理滚动相关逻辑：
-- 计算阅读进度
-- 高亮当前章节
-- 返回顶部功能
-
-### composables/useResize.js
-
-实现拖拽调整宽度功能。