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

1

Browse Source
This commit is contained in:
Lan
2024-10-07 15:54:49 +08:00
parent 1a69c16030
commit a3782d2c1b
2 changed files with 63 additions and 50 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/views/RetrievewFileView.vue
+38 -28
View File
@@ -146,29 +146,30 @@
<div
v-for="record in records"
:key="record.id"
class="bg-opacity-50 rounded-lg p-4 flex justify-between items-center shadow-md hover:shadow-lg transition duration-300 transform hover:scale-102"
class="bg-opacity-50 rounded-lg p-4 flex items-center shadow-md hover:shadow-lg transition duration-300 transform hover:scale-102"
:class="[isDarkMode ? 'bg-gray-800 hover:bg-gray-700' : 'bg-gray-100 hover:bg-white']"
>
<div class="flex items-center space-x-4">
<div class="flex-shrink-0">
<FileIcon
class="w-10 h-10"
:class="[isDarkMode ? 'text-indigo-400' : 'text-indigo-600']"
/>
</div>
<div>
<p
class="font-medium text-lg"
:class="[isDarkMode ? 'text-white' : 'text-gray-800']"
>
{{ record.filename }}
</p>
<p class="text-sm" :class="[isDarkMode ? 'text-gray-400' : 'text-gray-600']">
{{ record.date }} · {{ record.size }}
</p>
</div>
<div class="flex-shrink-0 mr-4">
<FileIcon
class="w-10 h-10"
:class="[isDarkMode ? 'text-indigo-400' : 'text-indigo-600']"
/>
</div>
<div class="flex space-x-2">
<div class="flex-grow min-w-0 mr-4">
<p
class="font-medium text-lg truncate"
:class="[isDarkMode ? 'text-white' : 'text-gray-800']"
>
{{ record.filename }}
</p>
<p
class="text-sm truncate"
:class="[isDarkMode ? 'text-gray-400' : 'text-gray-600']"
>
{{ record.date }} · {{ record.size }}
</p>
</div>
<div class="flex-shrink-0 flex space-x-2">
<button
@click="viewDetails(record)"
class="p-2 rounded-full hover:bg-opacity-20 transition duration-300"
@@ -213,11 +214,11 @@
class="fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50"
>
<div
class="p-8 rounded-2xl max-w-md w-full mx-4 shadow-2xl transform transition-all duration-300 ease-out backdrop-filter backdrop-blur-lg bg-opacity-70"
class="p-8 rounded-2xl max-w-md w-full mx-4 shadow-2xl transform transition-all duration-300 ease-out backdrop-filter backdrop-blur-lg bg-opacity-70 overflow-hidden"
:class="[isDarkMode ? 'bg-gray-800' : 'bg-white']"
>
<h3
class="text-2xl font-bold mb-6"
class="text-2xl font-bold mb-6 truncate"
:class="[isDarkMode ? 'text-white' : 'text-gray-800']"
>
文件详情
@@ -225,28 +226,37 @@
<div class="space-y-4">
<div class="flex items-center">
<FileIcon
class="w-6 h-6 mr-3"
class="w-6 h-6 mr-3 flex-shrink-0"
:class="[isDarkMode ? 'text-indigo-400' : 'text-indigo-600']"
/>
<p :class="[isDarkMode ? 'text-gray-300' : 'text-gray-800']">
<p
:class="[isDarkMode ? 'text-gray-300' : 'text-gray-800']"
class="truncate flex-grow"
>
<span class="font-medium">文件名：</span>{{ selectedRecord.filename }}
</p>
</div>
<div class="flex items-center">
<CalendarIcon
class="w-6 h-6 mr-3"
class="w-6 h-6 mr-3 flex-shrink-0"
:class="[isDarkMode ? 'text-indigo-400' : 'text-indigo-600']"
/>
<p :class="[isDarkMode ? 'text-gray-300' : 'text-gray-800']">
<p
:class="[isDarkMode ? 'text-gray-300' : 'text-gray-800']"
class="truncate flex-grow"
>
<span class="font-medium">取件日期：</span>{{ selectedRecord.date }}
</p>
</div>
<div class="flex items-center">
<HardDriveIcon
class="w-6 h-6 mr-3"
class="w-6 h-6 mr-3 flex-shrink-0"
:class="[isDarkMode ? 'text-indigo-400' : 'text-indigo-600']"
/>
<p :class="[isDarkMode ? 'text-gray-300' : 'text-gray-800']">
<p
:class="[isDarkMode ? 'text-gray-300' : 'text-gray-800']"
class="truncate flex-grow"
>
<span class="font-medium">文件大小：</span>{{ selectedRecord.size }}
</p>
</div>
src/views/SendFileView.vue
+25 -22
View File
@@ -81,13 +81,15 @@
/>
<p
:class="[
'mt-4 text-sm transition-colors duration-300',
'mt-4 text-sm transition-colors duration-300 w-full text-center',
isDarkMode
? 'text-gray-400 group-hover:text-indigo-400'
: 'text-gray-600 group-hover:text-indigo-600'
]"
>
{{ selectedFile ? selectedFile.name : '点击或拖放文件到此处上传' }}
<span class="block truncate">
{{ selectedFile ? selectedFile.name : '点击或拖放文件到此处上传' }}
</span>
</p>
<p :class="['mt-2 text-xs', isDarkMode ? 'text-gray-500' : 'text-gray-400']">
支持各种常见格式，最大20MB
@@ -226,29 +228,30 @@
<div
v-for="record in sendRecords"
:key="record.id"
class="bg-opacity-50 rounded-lg p-4 flex justify-between items-center shadow-md hover:shadow-lg transition duration-300 transform hover:scale-102"
class="bg-opacity-50 rounded-lg p-4 flex items-center shadow-md hover:shadow-lg transition duration-300 transform hover:scale-102"
:class="[isDarkMode ? 'bg-gray-800 hover:bg-gray-700' : 'bg-gray-100 hover:bg-white']"
>
<div class="flex items-center space-x-4">
<div class="flex-shrink-0">
<FileIcon
class="w-10 h-10"
:class="[isDarkMode ? 'text-indigo-400' : 'text-indigo-600']"
/>
</div>
<div>
<p
class="font-medium text-lg"
:class="[isDarkMode ? 'text-white' : 'text-gray-800']"
>
{{ record.filename }}
</p>
<p class="text-sm" :class="[isDarkMode ? 'text-gray-400' : 'text-gray-600']">
{{ record.date }} · {{ record.size }}
</p>
</div>
<div class="flex-shrink-0 mr-4">
<FileIcon
class="w-10 h-10"
:class="[isDarkMode ? 'text-indigo-400' : 'text-indigo-600']"
/>
</div>
<div class="flex space-x-2">
<div class="flex-grow min-w-0 mr-4">
<p
class="font-medium text-lg truncate"
:class="[isDarkMode ? 'text-white' : 'text-gray-800']"
>
{{ record.filename }}
</p>
<p
class="text-sm truncate"
:class="[isDarkMode ? 'text-gray-400' : 'text-gray-600']"
>
{{ record.date }} · {{ record.size }}
</p>
</div>
<div class="flex-shrink-0 flex space-x-2">
<button
@click="copyRetrieveLink(record.retrieveCode)"
class="p-2 rounded-full hover:bg-opacity-20 transition duration-300"