feat(dev): 新建开发者页面，用于数据处理

src/components/t-sidebar.vue

@@ -51,7 +51,13 @@
 				<template v-slot:prepend>
 					<v-icon>mdi-cog-outline</v-icon>
 				</template>
-				<v-list-item-title v-show="!rail"> 设置 </v-list-item-title>
+				<v-list-item-title v-show="!rail" @click="getDev"> 设置 </v-list-item-title>
+			</v-list-item>
+			<v-list-item link href="/dev" v-show="showDev">
+				<template v-slot:prepend>
+					<v-icon>mdi-bug-outline</v-icon>
+				</template>
+				<v-list-item-title v-show="!rail"> 开发 </v-list-item-title>
 			</v-list-item>
 		</v-list>
 	</v-navigation-drawer>
@@ -61,6 +67,7 @@
 import { defineComponent } from "vue";
 import { useRouter } from "vue-router";
 import useAppStore from "../store/modules/app";
+import useDevStore from "../store/modules/dev";
 
 export default defineComponent({
 	name: "TSidebar",
@@ -68,6 +75,7 @@ export default defineComponent({
 		return {
 			rail: this.getRail(),
 			router: useRouter(),
+			showDev: this.getShowDev(),
 		};
 	},
 	methods: {
@@ -83,6 +91,15 @@ export default defineComponent({
 			appStore.sidebar.expand = !appStore.sidebar.expand;
 			this.rail = appStore.sidebar.expand;
 		},
+		getShowDev() {
+			const devStore = useDevStore();
+			return devStore.showDev;
+		},
+		getDev() {
+			const devStore = useDevStore();
+			devStore.addMagic();
+			this.showDev = devStore.showDev;
+		},
 	},
 });
 </script>

src/pages/Dev.vue

@@ -0,0 +1,11 @@
+<template></template>
+
+<script lang="ts">
+import { defineComponent } from "vue";
+
+export default defineComponent({
+	name: "Dev",
+});
+</script>
+
+<style lang="css"></style>

src/router/routes.ts

@@ -1,7 +1,11 @@
+// 信息展示
 import Home from "../pages/Home.vue";
 import News from "../pages/News.vue";
+// 数据交互
 import Achievements from "../pages/Achievements.vue";
+// 应用配置相关
 import Config from "../pages/Config.vue";
+import Dev from "../pages/Dev.vue";
 
 const routes = [
 	{
@@ -23,6 +27,11 @@ const routes = [
 		name: "咨讯",
 		component: News,
 	},
+	{
+		path: "/dev",
+		name: "开发者工具",
+		component: Dev,
+	},
 	{
 		path: "/config",
 		name: "设置",

src/store/modules/dev.ts

@@ -0,0 +1,28 @@
+import { defineStore } from "pinia";
+
+const useDevStore = defineStore({
+	id: "dev",
+	state() {
+		return {
+			showDev: false,
+			magicCount: 0,
+		};
+	},
+	actions: {
+		addMagic() {
+			if (!this.showDev) {
+				this.magicCount++;
+				if (this.magicCount >= 5) {
+					this.toggleDev();
+				}
+			}
+		},
+		toggleDev() {
+			this.showDev = !this.showDev;
+			this.magicCount = 0;
+		},
+	},
+	persist: false,
+});
+
+export default useDevStore;