From f760dbaf80c1e0e3b1bb4a033661a79edc4899d3 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E8=80=97=E5=AD=90?= Date: Thu, 24 Oct 2024 01:59:52 +0800 Subject: [PATCH] =?UTF-8?q?refactor:=20=E6=B6=88=E6=81=AF=E6=80=BB?= =?UTF-8?q?=E7=BA=BF?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- web/package.json | 1 + web/pnpm-lock.yaml | 8 ++++++ web/src/utils/common/naiveTools.ts | 2 ++ web/src/utils/event/index.ts | 35 -------------------------- web/src/utils/index.ts | 1 - web/src/views/file/CompressModal.vue | 3 +-- web/src/views/file/ListTable.vue | 15 ++++++----- web/src/views/file/PathInput.vue | 14 +++++------ web/src/views/file/PermissionModal.vue | 3 +-- web/src/views/file/SearchModal.vue | 3 +-- web/src/views/file/ToolBar.vue | 13 ++++------ web/src/views/file/UploadModal.vue | 3 +-- web/types/global.d.ts | 1 + 13 files changed, 35 insertions(+), 67 deletions(-) delete mode 100644 web/src/utils/event/index.ts diff --git a/web/package.json b/web/package.json index 9d42adb5..5d570714 100644 --- a/web/package.json +++ b/web/package.json @@ -38,6 +38,7 @@ "lodash-es": "^4.17.21", "luxon": "^3.5.0", "marked": "^14.1.2", + "mitt": "^3.0.1", "pinia": "^2.2.4", "pinia-plugin-persistedstate": "^4.1.1", "remove": "^0.1.5", diff --git a/web/pnpm-lock.yaml b/web/pnpm-lock.yaml index 6c576a97..baa4e3e4 100644 --- a/web/pnpm-lock.yaml +++ b/web/pnpm-lock.yaml @@ -62,6 +62,9 @@ importers: marked: specifier: ^14.1.2 version: 14.1.3 + mitt: + specifier: ^3.0.1 + version: 3.0.1 pinia: specifier: ^2.2.4 version: 2.2.4(typescript@5.6.3)(vue@3.5.12(typescript@5.6.3)) @@ -2431,6 +2434,9 @@ packages: resolution: {integrity: sha512-bAxsR8BVfj60DWXHE3u30oHzfl4G7khkSuPW+qvpd7jFRHm7dLxOjUk1EHACJ/hxLY8phGJ0YhYHZo7jil7Qdg==} engines: {node: '>= 8'} + mitt@3.0.1: + resolution: {integrity: sha512-vKivATfr97l2/QBCYAkXYDbrIWPM2IIKEl7YPhjCvKlG3kE2gm+uBo6nEXK3M5/Ffh/FLpKExzOQ3JJoJGFKBw==} + mkdirp@1.0.4: resolution: {integrity: sha512-vVqVZQyf3WLx2Shd0qJ9xuvqgAyKPLAiqITEtqW0oIUjzo3PePDd6fW9iFz30ef7Ysp/oiWqbhszeGWW2T6Gzw==} engines: {node: '>=10'} @@ -5889,6 +5895,8 @@ snapshots: minipass: 3.3.6 yallist: 4.0.0 + mitt@3.0.1: {} + mkdirp@1.0.4: {} mlly@1.7.2: diff --git a/web/src/utils/common/naiveTools.ts b/web/src/utils/common/naiveTools.ts index 1aa12dfc..44ee0151 100644 --- a/web/src/utils/common/naiveTools.ts +++ b/web/src/utils/common/naiveTools.ts @@ -1,4 +1,5 @@ import { useThemeStore } from '@/store' +import mitt from 'mitt' import * as NaiveUI from 'naive-ui' export async function setupNaiveDiscreteApi() { @@ -16,4 +17,5 @@ export async function setupNaiveDiscreteApi() { window.$notification = notification window.$message = message window.$dialog = dialog + window.$bus = mitt() } diff --git a/web/src/utils/event/index.ts b/web/src/utils/event/index.ts deleted file mode 100644 index 68051e44..00000000 --- a/web/src/utils/event/index.ts +++ /dev/null @@ -1,35 +0,0 @@ -import { reactive } from 'vue' - -type EventCallback = (payload: T) => void - -interface EventBusInterface { - events: Record - emit(event: string, data?: T): void - on(event: string, callback: EventCallback): void - off(event: string, callback: EventCallback): void -} - -const EventBus: EventBusInterface = reactive({ - events: {} as Record, - emit(event: string, data?: T): void { - if (this.events[event]) { - this.events[event].forEach((callback) => callback(data)) - } - }, - on(event: string, callback: EventCallback = () => {}): void { - if (!this.events[event]) { - this.events[event] = [] - } - this.events[event].push(callback) - }, - off(event: string, callback: EventCallback): void { - if (this.events[event]) { - const index = this.events[event].indexOf(callback) - if (index > -1) { - this.events[event].splice(index, 1) - } - } - } -}) - -export default EventBus diff --git a/web/src/utils/index.ts b/web/src/utils/index.ts index 28d297e6..9ae0b5ee 100644 --- a/web/src/utils/index.ts +++ b/web/src/utils/index.ts @@ -1,6 +1,5 @@ export * from './auth' export * from './common' -export * from './event' export * from './file' export * from './http' export * from './storage' diff --git a/web/src/views/file/CompressModal.vue b/web/src/views/file/CompressModal.vue index 288ee298..71c0732a 100644 --- a/web/src/views/file/CompressModal.vue +++ b/web/src/views/file/CompressModal.vue @@ -3,7 +3,6 @@ import { NButton, NInput } from 'naive-ui' import api from '@/api/panel/file' import { generateRandomString, getBase } from '@/utils' -import EventBus from '@/utils/event' const show = defineModel('show', { type: Boolean, required: true }) const path = defineModel('path', { type: String, required: true }) @@ -43,7 +42,7 @@ const handleArchive = async () => { }) message?.destroy() loading.value = false - EventBus.emit('file:refresh') + window.$bus.emit('file:refresh') } onMounted(() => { diff --git a/web/src/views/file/ListTable.vue b/web/src/views/file/ListTable.vue index 6cfb2ec6..92003548 100644 --- a/web/src/views/file/ListTable.vue +++ b/web/src/views/file/ListTable.vue @@ -6,7 +6,6 @@ import type { RowData } from 'naive-ui/es/data-table/src/interface' import file from '@/api/panel/file' import TheIcon from '@/components/custom/TheIcon.vue' -import EventBus from '@/utils/event' import { checkName, checkPath, getExt, getFilename, getIconByExt, isCompress } from '@/utils/file' import EditModal from '@/views/file/EditModal.vue' import type { Marked } from '@/views/file/types' @@ -233,7 +232,7 @@ const columns: DataTableColumns = [ onPositiveClick: () => { file.delete(row.full).then(() => { window.$message.success('删除成功') - EventBus.emit('file:refresh') + window.$bus.emit('file:refresh') }) }, onNegativeClick: () => {} @@ -389,7 +388,7 @@ const handleRename = () => { file.move(source, target).then(() => { window.$message.success('重命名成功') renameModal.value = false - EventBus.emit('file:refresh') + window.$bus.emit('file:refresh') }) } @@ -411,7 +410,7 @@ const handleUnCompress = () => { message?.destroy() window.$message.success('解压成功') unCompressModal.value = false - EventBus.emit('file:refresh') + window.$bus.emit('file:refresh') }) .catch(() => { message?.destroy() @@ -476,7 +475,7 @@ const handleSelect = (key: string) => { case 'delete': file.delete(selectedRow.value.full).then(() => { window.$message.success('删除成功') - EventBus.emit('file:refresh') + window.$bus.emit('file:refresh') }) break } @@ -517,15 +516,15 @@ onMounted(() => { path, () => { handlePageChange(1) - EventBus.emit('push-history', path.value) + window.$bus.emit('push-history', path.value) }, { immediate: true } ) - EventBus.on('file:refresh', handleRefresh) + window.$bus.on('file:refresh', handleRefresh) }) onUnmounted(() => { - EventBus.off('file:refresh', handleRefresh) + window.$bus.off('file:refresh', handleRefresh) }) diff --git a/web/src/views/file/PathInput.vue b/web/src/views/file/PathInput.vue index 93402025..69afe198 100644 --- a/web/src/views/file/PathInput.vue +++ b/web/src/views/file/PathInput.vue @@ -2,8 +2,8 @@ import type { InputInst } from 'naive-ui' import { onUnmounted } from 'vue' -import EventBus from '@/utils/event' import { checkPath } from '@/utils/file' +import SearchModal from '@/views/file/SearchModal.vue' const path = defineModel('path', { type: String, required: true }) const isInput = ref(false) @@ -13,7 +13,7 @@ const input = ref('www') const history: string[] = [] let current = -1 -const searchModal = ref(false) +const searchShow = ref(false) const search = ref({ keyword: '', sub: false @@ -38,7 +38,7 @@ const handleBlur = () => { } const handleRefresh = () => { - EventBus.emit('file:refresh') + window.$bus.emit('file:refresh') } const handleUp = () => { @@ -90,7 +90,7 @@ const handlePushHistory = (path: string) => { } const handleSearch = () => { - searchModal.value = true + searchShow.value = true } watch( @@ -102,11 +102,11 @@ watch( ) onMounted(() => { - EventBus.on('push-history', handlePushHistory) + window.$bus.on('push-history', handlePushHistory) }) onUnmounted(() => { - EventBus.off('push-history', handlePushHistory) + window.$bus.off('push-history', handlePushHistory) }) @@ -158,7 +158,7 @@ onUnmounted(() => { ('show', { type: Boolean, required: true }) const selected = defineModel('selected', { type: Array, required: true }) @@ -29,7 +28,7 @@ const handlePermission = async () => { window.$message.error(`修改 ${path} 失败`) }) } - EventBus.emit('file:refresh') + window.$bus.emit('file:refresh') } const calculateOctal = (permissions: string[]) => { diff --git a/web/src/views/file/SearchModal.vue b/web/src/views/file/SearchModal.vue index 574e80be..1fbb3eb2 100644 --- a/web/src/views/file/SearchModal.vue +++ b/web/src/views/file/SearchModal.vue @@ -1,6 +1,5 @@