chore: redesign file page icon #90
This commit is contained in:
@@ -4,7 +4,7 @@ import { useRoute, useRouter } from 'vue-router'
|
|||||||
import { Button } from '@/components/ui/button'
|
import { Button } from '@/components/ui/button'
|
||||||
import { Dialog, DialogContent } from '@/components/ui/dialog'
|
import { Dialog, DialogContent } from '@/components/ui/dialog'
|
||||||
import XTerminal from '@/components/XTerminal.vue'
|
import XTerminal from '@/components/XTerminal.vue'
|
||||||
import { Save, Play, Pencil, Eye, X, Download, Trash2 } from 'lucide-vue-next'
|
import { Save, Play, FilePen, TextCursorInput, Eye, X, Download, Trash2 } from 'lucide-vue-next'
|
||||||
import { api, type FileNode, type MiseLanguage } from '@/api'
|
import { api, type FileNode, type MiseLanguage } from '@/api'
|
||||||
import { toast } from 'vue-sonner'
|
import { toast } from 'vue-sonner'
|
||||||
import { PATHS, FILE_RUNNERS } from '@/constants'
|
import { PATHS, FILE_RUNNERS } from '@/constants'
|
||||||
@@ -481,7 +481,7 @@ onUnmounted(() => {
|
|||||||
</span>
|
</span>
|
||||||
<div v-if="selectedPath" class="flex gap-1 shrink-0">
|
<div v-if="selectedPath" class="flex gap-1 shrink-0">
|
||||||
<Button variant="ghost" size="sm" class="h-6 text-xs gap-1 px-2" @click="dialogsRef?.openRename(selectedPath)">
|
<Button variant="ghost" size="sm" class="h-6 text-xs gap-1 px-2" @click="dialogsRef?.openRename(selectedPath)">
|
||||||
<Pencil class="h-3 w-3" /> <span class="hidden sm:inline">重命名</span>
|
<TextCursorInput class="h-3 w-3" /> <span class="hidden sm:inline">重命名</span>
|
||||||
</Button>
|
</Button>
|
||||||
<Button variant="ghost" size="sm" class="h-6 text-xs gap-1 px-2 hover:bg-destructive/10 transition-colors" @click="dialogsRef?.openDelete(selectedPath)">
|
<Button variant="ghost" size="sm" class="h-6 text-xs gap-1 px-2 hover:bg-destructive/10 transition-colors" @click="dialogsRef?.openDelete(selectedPath)">
|
||||||
<Trash2 class="h-3 w-3" /> <span class="hidden sm:inline">删除</span>
|
<Trash2 class="h-3 w-3" /> <span class="hidden sm:inline">删除</span>
|
||||||
@@ -492,7 +492,7 @@ onUnmounted(() => {
|
|||||||
<Download class="h-3 w-3" /> <span class="hidden sm:inline">下载</span>
|
<Download class="h-3 w-3" /> <span class="hidden sm:inline">下载</span>
|
||||||
</Button>
|
</Button>
|
||||||
<Button v-if="!isEditMode" variant="ghost" size="sm" class="h-6 text-xs gap-1 px-2" @click="isEditMode = true">
|
<Button v-if="!isEditMode" variant="ghost" size="sm" class="h-6 text-xs gap-1 px-2" @click="isEditMode = true">
|
||||||
<Pencil class="h-3 w-3" /> <span class="hidden sm:inline">编辑</span>
|
<FilePen class="h-3 w-3" /> <span class="hidden sm:inline">编辑</span>
|
||||||
</Button>
|
</Button>
|
||||||
<template v-else>
|
<template v-else>
|
||||||
<Button variant="ghost" size="sm" class="h-6 text-xs gap-1 px-2" @click="isEditMode = false; fileContent = originalContent">
|
<Button variant="ghost" size="sm" class="h-6 text-xs gap-1 px-2" @click="isEditMode = false; fileContent = originalContent">
|
||||||
|
|||||||
@@ -1,7 +1,7 @@
|
|||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { ref, computed } from 'vue'
|
import { ref, computed } from 'vue'
|
||||||
import { Button } from '@/components/ui/button'
|
import { Button } from '@/components/ui/button'
|
||||||
import { RefreshCw, FolderUp, Upload, Plus, AlertCircle } from 'lucide-vue-next'
|
import { RefreshCw, FileUp, FileArchive, Plus, AlertCircle } from 'lucide-vue-next'
|
||||||
import FileTreeNode from '@/components/FileTreeNode.vue'
|
import FileTreeNode from '@/components/FileTreeNode.vue'
|
||||||
import BaihuDialog from '@/components/ui/BaihuDialog.vue'
|
import BaihuDialog from '@/components/ui/BaihuDialog.vue'
|
||||||
import { type FileNode } from '@/api'
|
import { type FileNode } from '@/api'
|
||||||
@@ -71,12 +71,18 @@ const currentTargetDir = computed(() => {
|
|||||||
|
|
||||||
function triggerArchiveUpload(targetDir = '') {
|
function triggerArchiveUpload(targetDir = '') {
|
||||||
uploadTargetDir.value = targetDir
|
uploadTargetDir.value = targetDir
|
||||||
if (archiveInputRef.value) archiveInputRef.value.click()
|
if (archiveInputRef.value) {
|
||||||
|
archiveInputRef.value.value = ''
|
||||||
|
archiveInputRef.value.click()
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
function triggerFilesUpload(targetDir = '') {
|
function triggerFilesUpload(targetDir = '') {
|
||||||
uploadTargetDir.value = targetDir
|
uploadTargetDir.value = targetDir
|
||||||
if (filesInputRef.value) filesInputRef.value.click()
|
if (filesInputRef.value) {
|
||||||
|
filesInputRef.value.value = ''
|
||||||
|
filesInputRef.value.click()
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
function handleArchiveUpload(e: Event) {
|
function handleArchiveUpload(e: Event) {
|
||||||
@@ -93,31 +99,31 @@ function handleArchiveUpload(e: Event) {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
input.value = ''
|
|
||||||
}
|
}
|
||||||
|
|
||||||
function handleFilesUpload(e: Event) {
|
function handleFilesUpload(e: Event) {
|
||||||
const input = e.target as HTMLInputElement
|
const input = e.target as HTMLInputElement
|
||||||
const files = input.files
|
const fileList = input.files
|
||||||
if (files && files.length > 0) {
|
if (fileList && fileList.length > 0) {
|
||||||
|
const files: File[] = []
|
||||||
|
const paths: string[] = []
|
||||||
|
for (let i = 0; i < fileList.length; i++) {
|
||||||
|
const f = fileList.item(i)
|
||||||
|
if (f) {
|
||||||
|
files.push(f)
|
||||||
|
paths.push((f as any).webkitRelativePath || f.name)
|
||||||
|
}
|
||||||
|
}
|
||||||
const dirName = uploadTargetDir.value || '根目录'
|
const dirName = uploadTargetDir.value || '根目录'
|
||||||
confirmUpload.value = {
|
confirmUpload.value = {
|
||||||
show: true,
|
show: true,
|
||||||
title: '确认上传文件',
|
title: '确认上传文件',
|
||||||
message: `即将把 ${files.length} 个文件/文件夹上传到目录 [ ${dirName} ]。确认上传吗?`,
|
message: `即将把 ${files.length} 个文件/文件夹上传到目录 [ ${dirName} ]。确认上传吗?`,
|
||||||
onConfirm: () => {
|
onConfirm: () => {
|
||||||
const paths: string[] = []
|
emit('uploadFiles', files as unknown as FileList, paths, uploadTargetDir.value)
|
||||||
for (let i = 0; i < files.length; i++) {
|
|
||||||
const f = files.item(i)
|
|
||||||
if (f) {
|
|
||||||
paths.push((f as any).webkitRelativePath || f.name)
|
|
||||||
}
|
|
||||||
}
|
|
||||||
emit('uploadFiles', files, paths, uploadTargetDir.value)
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
input.value = ''
|
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
@@ -129,11 +135,11 @@ function handleFilesUpload(e: Event) {
|
|||||||
<Button variant="ghost" size="icon" class="h-6 w-6" @click="emit('refresh')" :disabled="isRefreshing" title="刷新">
|
<Button variant="ghost" size="icon" class="h-6 w-6" @click="emit('refresh')" :disabled="isRefreshing" title="刷新">
|
||||||
<RefreshCw class="h-3 w-3" :class="{ 'animate-spin': isRefreshing }" />
|
<RefreshCw class="h-3 w-3" :class="{ 'animate-spin': isRefreshing }" />
|
||||||
</Button>
|
</Button>
|
||||||
<Button variant="ghost" size="icon" class="h-6 w-6" @click="triggerFilesUpload(currentTargetDir)" :title="currentTargetDir ? `上传到: ${currentTargetDir}` : '上传到根目录'">
|
<Button variant="ghost" size="icon" class="h-6 w-6" @click="triggerFilesUpload(currentTargetDir)" :title="currentTargetDir ? `上传文件到: ${currentTargetDir}` : '上传文件到根目录'">
|
||||||
<FolderUp class="h-3 w-3" />
|
<FileUp class="h-3 w-3" />
|
||||||
</Button>
|
</Button>
|
||||||
<Button variant="ghost" size="icon" class="h-6 w-6" @click="triggerArchiveUpload(currentTargetDir)" :title="currentTargetDir ? `导入压缩包到: ${currentTargetDir}` : '导入压缩包到根目录'">
|
<Button variant="ghost" size="icon" class="h-6 w-6" @click="triggerArchiveUpload(currentTargetDir)" :title="currentTargetDir ? `导入压缩包到: ${currentTargetDir}` : '导入压缩包到根目录'">
|
||||||
<Upload class="h-3 w-3" />
|
<FileArchive class="h-3 w-3" />
|
||||||
</Button>
|
</Button>
|
||||||
<Button variant="ghost" size="icon" class="h-6 w-6" @click="emit('create', currentTargetDir)" :title="currentTargetDir ? `在 ${currentTargetDir} 中新建` : '在根目录新建'">
|
<Button variant="ghost" size="icon" class="h-6 w-6" @click="emit('create', currentTargetDir)" :title="currentTargetDir ? `在 ${currentTargetDir} 中新建` : '在根目录新建'">
|
||||||
<Plus class="h-3 w-3" />
|
<Plus class="h-3 w-3" />
|
||||||
|
|||||||
Reference in New Issue
Block a user