feat: 添加miaoDropHandler組件用於統一處理drop事件，格式化代碼

src/class/VirtualPage.ts

@@ -0,0 +1,60 @@
+import { shallowRef } from "vue";
+import VirtualDirectory, { VirtualFile } from "./VirtualDirectory";
+import generateId from "@/hooks/generateId";
+
+const getRandomWebSafeColor = (() => {
+	const webSafeColors = ["#009900", "#999900", "#009999", "#990099", "#0000ee"];
+	let counter = 0;
+	return () => {
+		const color = webSafeColors[counter % webSafeColors.length];
+		counter += 1;
+		return color;
+	};
+})();
+
+export default class VirtualPage {
+	constructor(component: any, initObjects: (VirtualDirectory | VirtualFile)[]) {
+		this.component = shallowRef(component);
+		this.currentObjects = initObjects;
+
+		this.visible = true;
+		this.uid = generateId();
+		this.refreshKey = Math.random();
+		this.color = getRandomWebSafeColor();
+	}
+	component: any;
+	// 是否可见
+	visible: boolean;
+	// 当前正在使用的文件或是文件夹
+	currentObjects: (VirtualDirectory | VirtualFile)[];
+	// 区分每一个页面的唯一id
+	uid: number;
+	// 当refreshKey改变时需要刷新页面，目前还没接入刷新
+	refreshKey: number;
+	// 为了区分，每个虚拟页面都会分配一个color，这个color会体现在tab上
+	color: string;
+	// 用于展示的title
+	_title?: string;
+
+	get title() {
+		if (this._title) {
+			return this._title;
+		}
+		return this.currentObjects[0].name;
+	}
+
+	setTitle(title: string) {
+		this._title = title;
+	}
+
+	// 切换显示状态
+	switchShow() {
+		this.visible = !this.visible;
+	}
+
+	// 刷新，不过好像没有用得到的时候吧
+	// 事实上也不应该用得到，因为更新应该是响应式的
+	refresh() {
+		this.refreshKey = Math.random();
+	}
+}