From 007291a2d9302d49e2fd3eee7a30b50be51f86de Mon Sep 17 00:00:00 2001 From: Lan Date: Mon, 25 Nov 2024 18:30:14 +0800 Subject: [PATCH] fix:some bug --- src/App.vue | 8 -- src/components/send/FileDetailsModal.vue | 11 +- src/layout/AdminLayout/AdminLayout.vue | 33 ++++++ src/utils/api.ts | 3 +- src/utils/clipboard.ts | 81 ++++++++++++++ src/utils/convert.ts | 10 ++ src/views/SendFileView.vue | 44 +++----- src/views/manage/DashboardView.vue | 2 +- src/views/manage/FileManageView.vue | 2 +- src/views/manage/SystemSettingsView.vue | 132 +++++++++++++++++------ 10 files changed, 239 insertions(+), 87 deletions(-) create mode 100644 src/utils/clipboard.ts create mode 100644 src/utils/convert.ts diff --git a/src/App.vue b/src/App.vue index b0b2b8e..79650ff 100644 --- a/src/App.vue +++ b/src/App.vue @@ -100,14 +100,6 @@ provide('isLoading', isLoading) transition: background-color 0.5s ease; } -.light { - @apply bg-gradient-to-br from-blue-50 via-indigo-50 to-white; -} - -.dark { - @apply bg-gradient-to-br from-gray-900 via-indigo-900 to-black; -} - .fade-enter-active, .fade-leave-active { transition: opacity 0.3s ease; diff --git a/src/components/send/FileDetailsModal.vue b/src/components/send/FileDetailsModal.vue index 3df2ed8..d88dabb 100644 --- a/src/components/send/FileDetailsModal.vue +++ b/src/components/send/FileDetailsModal.vue @@ -98,7 +98,7 @@ diff --git a/src/layout/AdminLayout/AdminLayout.vue b/src/layout/AdminLayout/AdminLayout.vue index a9b4040..2b12828 100644 --- a/src/layout/AdminLayout/AdminLayout.vue +++ b/src/layout/AdminLayout/AdminLayout.vue @@ -236,4 +236,37 @@ input:checked + .slider { transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 300ms; } + +.custom-scrollbar { + &::-webkit-scrollbar { + width: 8px; + } + + &::-webkit-scrollbar-track { + background: transparent; + } + + &::-webkit-scrollbar-thumb { + background-color: #cbd5e0; + border-radius: 4px; + + &:hover { + background-color: #a0aec0; + } + } + + /* 适配暗黑模式 */ + :deep(.dark &::-webkit-scrollbar-thumb) { + background-color: #4a5568; + + &:hover { + background-color: #2d3748; + } + } +} + +/* 确保内容区域不会被截断 */ +.space-y-6 { + margin-bottom: 5rem; +} diff --git a/src/utils/api.ts b/src/utils/api.ts index 5aa6f78..8469250 100644 --- a/src/utils/api.ts +++ b/src/utils/api.ts @@ -1,5 +1,4 @@ import axios from 'axios' -import { useRouter } from 'vue-router' // 从环境变量中获取 API 基础 URL const baseURL = @@ -13,7 +12,7 @@ const sanitizedBaseURL = typeof baseURL === 'string' ? baseURL : '' // 创建 axios 实例 const api = axios.create({ baseURL: sanitizedBaseURL, - timeout: 10000, // 请求超时时间 + timeout: 1000000000000000, // 请求超时时间 headers: { 'Content-Type': 'application/json' } diff --git a/src/utils/clipboard.ts b/src/utils/clipboard.ts new file mode 100644 index 0000000..8e8fbf7 --- /dev/null +++ b/src/utils/clipboard.ts @@ -0,0 +1,81 @@ +/** + * 剪贴板工具函数 + */ + +import { useAlertStore } from '@/stores/alertStore' + +interface CopyOptions { + successMsg?: string + errorMsg?: string + showMsg?: boolean +} + +/** + * 复制文本到剪贴板 + * @param text 要复制的文本 + * @param options 配置选项 + * @returns Promise 是否复制成功 + */ +export const copyToClipboard = async ( + text: string, + options: CopyOptions = {} +): Promise => { + const { successMsg = '复制成功', errorMsg = '复制失败，请手动复制', showMsg = true } = options + + const alertStore = useAlertStore() + + try { + // 优先使用 Clipboard API + if (navigator.clipboard && navigator.clipboard.writeText) { + await navigator.clipboard.writeText(text) + if (showMsg) alertStore.showAlert(successMsg, 'success') + return true + } + + // 后备方案：使用传统的复制方法 + const textarea = document.createElement('textarea') + textarea.value = text + textarea.style.position = 'fixed' + textarea.style.opacity = '0' + document.body.appendChild(textarea) + textarea.select() + const success = document.execCommand('copy') + document.body.removeChild(textarea) + + if (success) { + if (showMsg) alertStore.showAlert(successMsg, 'success') + return true + } else { + throw new Error('execCommand copy failed') + } + } catch (err) { + console.error('复制失败:', err) + if (showMsg) alertStore.showAlert(errorMsg, 'error') + return false + } +} + +/** + * 生成并复制取件链接 + * @param code 取件码 + * @returns Promise 是否复制成功 + */ +export const copyRetrieveLink = async (code: string): Promise => { + const link = `${window.location.origin}/#/?code=${code}` + return copyToClipboard(link, { + successMsg: '取件链接已复制到剪贴板', + errorMsg: '复制失败，请手动复制取件链接' + }) +} + +/** + * 复制取件码 + * @param code 取件码 + * @returns Promise 是否复制成功 + */ +export const copyRetrieveCode = async (code: string): Promise => { + return copyToClipboard(code, { + successMsg: '取件码已复制到剪贴板', + errorMsg: '复制失败，请手动复制取件码' + }) +} diff --git a/src/utils/convert.ts b/src/utils/convert.ts new file mode 100644 index 0000000..6853bd8 --- /dev/null +++ b/src/utils/convert.ts @@ -0,0 +1,10 @@ +// 存储单位转换 +export const getStorageUnit = (value: number) => { + if (value >= 1024 * 1024 * 1024) { + return Math.round(value / (1024 * 1024 * 1024)) + 'GB' + } else if (value >= 1024 * 1024) { + return Math.round(value / (1024 * 1024)) + 'MB' + } else { + return Math.round(value / 1024) + 'KB' + } +} diff --git a/src/views/SendFileView.vue b/src/views/SendFileView.vue index c6faf1b..b82d920 100644 --- a/src/views/SendFileView.vue +++ b/src/views/SendFileView.vue @@ -92,7 +92,7 @@

- 支持各种常见格式，最大20MB + 支持各种常见格式，最大{{ getStorageUnit(config.uploadSize) }}

@@ -128,11 +128,9 @@ : 'bg-white text-gray-900 border border-gray-300' ]" > - - - - - +
@@ -414,6 +412,11 @@ import QRCode from 'qrcode.vue' import SparkMD5 from 'spark-md5' import { useFileDataStore } from '../stores/fileData' import api from '@/utils/api' +import { copyRetrieveLink, copyRetrieveCode } from '@/utils/clipboard' +import { getStorageUnit } from '@/utils/convert' + +const config: any = JSON.parse(localStorage.getItem('config') || '{}') +console.log(config) const router = useRouter() const isDarkMode = inject('isDarkMode') @@ -549,8 +552,8 @@ const mergeChunks = async (fileHash: string, totalChunks: number) => { console.log(`请求合并文件切片, fileHash: ${fileHash}, totalChunks: ${totalChunks}`) } -const getPlaceholder = () => { - switch (expirationMethod.value) { +const getPlaceholder = (value: string = expirationMethod.value) => { + switch (value) { case 'day': return '输入天数' case 'hour': @@ -566,8 +569,8 @@ const getPlaceholder = () => { } } -const getUnit = () => { - switch (expirationMethod.value) { +const getUnit = (value: string = expirationMethod.value) => { + switch (value) { case 'day': return '天' case 'hour': @@ -703,27 +706,6 @@ const getQRCodeValue = (record: any) => { return `${baseUrl}/?code=${record.retrieveCode}` } -const copyRetrieveCode = async (code: string) => { - try { - await navigator.clipboard.writeText(code) - alertStore.showAlert('取件码已复制到剪贴板', 'success') - } catch (err) { - console.error('无法复制取件码: ', err) - alertStore.showAlert('复制失败,请手动复制取件码', 'error') - } -} - -const copyRetrieveLink = async (code: string) => { - const link = `${baseUrl}/?code=${code}` - try { - await navigator.clipboard.writeText(link) - alertStore.showAlert('取件链接已复制到剪贴板', 'success') - } catch (err) { - console.error('无法复制取件链接: ', err) - alertStore.showAlert('复制失败,请动复制取件链接', 'error') - } -} - // 使用 onMounted 钩子延迟加载一些非关键资源或初始化 onMounted(() => { // 这里可以放置一些非立即需要的初始化代码 diff --git a/src/views/manage/DashboardView.vue b/src/views/manage/DashboardView.vue index 9f5f9fb..1b37e11 100644 --- a/src/views/manage/DashboardView.vue +++ b/src/views/manage/DashboardView.vue @@ -1,5 +1,5 @@