orion/FileCodeBoxFronted
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix:s3协议点击下载链接问题

Browse Source
This commit is contained in:
Lan
2025-03-30 22:19:43 +08:00
parent 5ca36a51d5
commit 77d68001b5
2 changed files with 64 additions and 82 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/views/RetrievewFileView.vue
+8 -1
View File
@@ -182,7 +182,7 @@
</button> </button>
</div> </div>
<div v-else> <div v-else>
<a :href="`${baseUrl}${selectedRecord.downloadUrl}`" target="_blank" rel="noopener noreferrer" <a :href="getDownloadUrl(selectedRecord)" target="_blank" rel="noopener noreferrer"
class="px-4 py-2 bg-indigo-600 text-white rounded-lg hover:bg-indigo-700 transition duration-300"> class="px-4 py-2 bg-indigo-600 text-white rounded-lg hover:bg-indigo-700 transition duration-300">
点击下载 点击下载
</a> </a>
@@ -317,6 +317,13 @@ watch(code, (newVal) => {
} }
}) })
const getDownloadUrl = (record) => {
if (record.downloadUrl.startsWith('http')) {
return record.downloadUrl
} else {
return `${baseUrl}${record.downloadUrl}`
}
}
// 在其他代码后添加复制功能 // 在其他代码后添加复制功能
const copyContent = async () => { const copyContent = async () => {
if (selectedRecord.value && selectedRecord.value.content) { if (selectedRecord.value && selectedRecord.value.content) {
src/views/SendFileView.vue
+51 -76
View File
@@ -94,100 +94,69 @@
过期时间 过期时间
</label> </label>
<div class="relative flex-grow group"> <div class="relative flex-grow group">
<div <div :class="[
:class="[ 'relative h-11 rounded-xl border transition-all duration-300',
'relative h-11 rounded-xl border transition-all duration-300', isDarkMode
isDarkMode ? 'bg-gray-800/50 border-gray-700/50 group-hover:border-gray-600'
? 'bg-gray-800/50 border-gray-700/50 group-hover:border-gray-600' : 'bg-white border-gray-200 group-hover:border-gray-300'
: 'bg-white border-gray-200 group-hover:border-gray-300' ]">
]"
>
<template v-if="expirationMethod !== 'forever'"> <template v-if="expirationMethod !== 'forever'">
<input <input v-model="expirationValue" type="number" :placeholder="getPlaceholder()" min="1" :class="[
v-model="expirationValue" 'w-full h-full px-4 pr-32 rounded-xl placeholder-gray-400 transition-all duration-300',
type="number" 'focus:outline-none focus:ring-2 focus:ring-offset-0',
:placeholder="getPlaceholder()" '[appearance:textfield] [&::-webkit-outer-spin-button]:appearance-none [&::-webkit-inner-spin-button]:appearance-none',
min="1" 'bg-transparent',
:class="[ isDarkMode
'w-full h-full px-4 pr-32 rounded-xl placeholder-gray-400 transition-all duration-300', ? 'text-gray-100 focus:ring-indigo-500/70 placeholder-gray-500'
'focus:outline-none focus:ring-2 focus:ring-offset-0', : 'text-gray-900 focus:ring-indigo-500/50 placeholder-gray-400'
'[appearance:textfield] [&::-webkit-outer-spin-button]:appearance-none [&::-webkit-inner-spin-button]:appearance-none', ]" />
'bg-transparent',
isDarkMode
? 'text-gray-100 focus:ring-indigo-500/70 placeholder-gray-500'
: 'text-gray-900 focus:ring-indigo-500/50 placeholder-gray-400'
]"
/>
<div class="absolute right-24 top-0 h-full flex flex-col border-l" <div class="absolute right-24 top-0 h-full flex flex-col border-l"
:class="[isDarkMode ? 'border-gray-700/50' : 'border-gray-200']"> :class="[isDarkMode ? 'border-gray-700/50' : 'border-gray-200']">
<button <button type="button" @click="incrementValue(1)"
type="button" class="flex-1 px-2 flex items-center justify-center transition-all duration-200" :class="[
@click="incrementValue(1)"
class="flex-1 px-2 flex items-center justify-center transition-all duration-200"
:class="[
isDarkMode isDarkMode
? 'hover:bg-gray-700/50 text-gray-400 hover:text-gray-200' ? 'hover:bg-gray-700/50 text-gray-400 hover:text-gray-200'
: 'hover:bg-gray-50 text-gray-500 hover:text-gray-700' : 'hover:bg-gray-50 text-gray-500 hover:text-gray-700'
]" ]">
>
<svg class="w-3 h-3" fill="none" viewBox="0 0 24 24" stroke="currentColor"> <svg class="w-3 h-3" fill="none" viewBox="0 0 24 24" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 15l7-7 7 7" /> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 15l7-7 7 7" />
</svg> </svg>
</button> </button>
<button <button type="button" @click="incrementValue(-1)"
type="button" class="flex-1 px-2 flex items-center justify-center transition-all duration-200" :class="[
@click="incrementValue(-1)"
class="flex-1 px-2 flex items-center justify-center transition-all duration-200"
:class="[
isDarkMode isDarkMode
? 'hover:bg-gray-700/50 text-gray-400 hover:text-gray-200' ? 'hover:bg-gray-700/50 text-gray-400 hover:text-gray-200'
: 'hover:bg-gray-50 text-gray-500 hover:text-gray-700' : 'hover:bg-gray-50 text-gray-500 hover:text-gray-700'
]" ]">
>
<svg class="w-3 h-3" fill="none" viewBox="0 0 24 24" stroke="currentColor"> <svg class="w-3 h-3" fill="none" viewBox="0 0 24 24" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7" /> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7" />
</svg> </svg>
</button> </button>
</div> </div>
</template> </template>
<select <select v-model="expirationMethod" :class="[
v-model="expirationMethod" 'absolute right-0 top-0 h-full appearance-none cursor-pointer',
:class="[ 'focus:outline-none focus:ring-2 focus:ring-offset-0',
'absolute right-0 top-0 h-full appearance-none cursor-pointer', expirationMethod === 'forever' ? 'w-full px-4' : 'w-24 pl-3 pr-8 border-l',
'focus:outline-none focus:ring-2 focus:ring-offset-0', isDarkMode
expirationMethod === 'forever' ? 'w-full px-4' : 'w-24 pl-3 pr-8 border-l', ? 'text-gray-100 border-gray-700/50 focus:ring-indigo-500/70 bg-gray-800/50'
: 'text-gray-900 border-gray-200 focus:ring-indigo-500/50 bg-white'
]">
<option v-for="item in config.expireStyle" :value="item" :key="item" :class="[
isDarkMode isDarkMode
? 'text-gray-100 border-gray-700/50 focus:ring-indigo-500/70 bg-gray-800/50' ? 'bg-gray-800 text-gray-100'
: 'text-gray-900 border-gray-200 focus:ring-indigo-500/50 bg-white' : 'bg-white text-gray-900'
]" ]">
>
<option
v-for="item in config.expireStyle"
:value="item"
:key="item"
:class="[
isDarkMode
? 'bg-gray-800 text-gray-100'
: 'bg-white text-gray-900'
]"
>
{{ getUnit(item) }} {{ getUnit(item) }}
</option> </option>
</select> </select>
<div <div class="absolute pointer-events-none" :class="[
class="absolute pointer-events-none" expirationMethod === 'forever' ? 'right-3' : 'right-2',
:class="[ 'top-1/2 -translate-y-1/2'
expirationMethod === 'forever' ? 'right-3' : 'right-2', ]">
'top-1/2 -translate-y-1/2' <svg class="w-4 h-4 transition-colors duration-300"
]" :class="[isDarkMode ? 'text-gray-400' : 'text-gray-500']" fill="none" stroke="currentColor"
> viewBox="0 0 24 24">
<svg
class="w-4 h-4 transition-colors duration-300"
:class="[isDarkMode ? 'text-gray-400' : 'text-gray-500']"
fill="none"
stroke="currentColor"
viewBox="0 0 24 24"
>
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7" /> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7" />
</svg> </svg>
</div> </div>
@@ -289,8 +258,11 @@
<!-- 记录详情弹窗 --> <!-- 记录详情弹窗 -->
<transition name="fade"> <transition name="fade">
<div v-if="selectedRecord" class="fixed inset-0 bg-black/60 backdrop-blur-sm flex items-center justify-center z-50 p-3 sm:p-4 overflow-y-auto"> <div v-if="selectedRecord"
<div class="w-full max-w-2xl rounded-2xl shadow-2xl transform transition-all duration-300 ease-out overflow-hidden" :class="[isDarkMode ? 'bg-gray-900 bg-opacity-70' : 'bg-white bg-opacity-95']"> class="fixed inset-0 bg-black/60 backdrop-blur-sm flex items-center justify-center z-50 p-3 sm:p-4 overflow-y-auto">
<div
class="w-full max-w-2xl rounded-2xl shadow-2xl transform transition-all duration-300 ease-out overflow-hidden"
:class="[isDarkMode ? 'bg-gray-900 bg-opacity-70' : 'bg-white bg-opacity-95']">
<!-- 顶部标题栏 --> <!-- 顶部标题栏 -->
<div class="px-4 sm:px-6 py-3 sm:py-4 border-b" :class="[isDarkMode ? 'border-gray-800' : 'border-gray-100']"> <div class="px-4 sm:px-6 py-3 sm:py-4 border-b" :class="[isDarkMode ? 'border-gray-800' : 'border-gray-100']">
<div class="flex items-center justify-between"> <div class="flex items-center justify-between">
@@ -315,7 +287,8 @@
:class="[isDarkMode ? 'text-indigo-400' : 'text-indigo-600']" /> :class="[isDarkMode ? 'text-indigo-400' : 'text-indigo-600']" />
</div> </div>
<div class="ml-3 sm:ml-4 min-w-0 flex-1"> <div class="ml-3 sm:ml-4 min-w-0 flex-1">
<h4 class="font-medium text-sm sm:text-base truncate" :class="[isDarkMode ? 'text-white' : 'text-gray-900']"> <h4 class="font-medium text-sm sm:text-base truncate"
:class="[isDarkMode ? 'text-white' : 'text-gray-900']">
{{ selectedRecord.filename }} {{ selectedRecord.filename }}
</h4> </h4>
<p class="text-xs sm:text-sm truncate" :class="[isDarkMode ? 'text-gray-400' : 'text-gray-500']"> <p class="text-xs sm:text-sm truncate" :class="[isDarkMode ? 'text-gray-400' : 'text-gray-500']">
@@ -353,7 +326,8 @@
<ClipboardCopyIcon class="w-4 h-4 sm:w-5 sm:h-5" /> <ClipboardCopyIcon class="w-4 h-4 sm:w-5 sm:h-5" />
</button> </button>
</div> </div>
<p class="text-2xl sm:text-3xl font-bold tracking-wider text-center break-all">{{ selectedRecord.retrieveCode }} <p class="text-2xl sm:text-3xl font-bold tracking-wider text-center break-all">{{
selectedRecord.retrieveCode }}
</p> </p>
</div> </div>
@@ -385,7 +359,8 @@
<QRCode :value="getQRCodeValue(selectedRecord)" :size="140" level="M" <QRCode :value="getQRCodeValue(selectedRecord)" :size="140" level="M"
class="sm:w-[160px] sm:h-[160px]" /> class="sm:w-[160px] sm:h-[160px]" />
</div> </div>
<p class="text-xs sm:text-sm truncate max-w-full" :class="[isDarkMode ? 'text-gray-400' : 'text-gray-500']"> <p class="text-xs sm:text-sm truncate max-w-full"
:class="[isDarkMode ? 'text-gray-400' : 'text-gray-500']">
扫描二维码快速取件 扫描二维码快速取件
</p> </p>
</div> </div>