feat(optional): 首页显示组件可选

src/pages/Config.vue

@@ -60,6 +60,25 @@
 					/>
 				</template>
 			</v-list-item>
+			<v-list-item>
+				<template v-slot:prepend>
+					<v-icon>mdi-view-dashboard</v-icon>
+				</template>
+				<v-select
+					v-model="showHome"
+					:items="homeStore.getShowItem()"
+					label="首页显示组件"
+					multiple
+					chips
+				></v-select>
+				<template v-slot:append>
+					<v-btn @click="submitHome" class="card-btn">
+						<template v-slot:prepend>
+							<img src="../assets/icons/circle-check.svg" alt="check" />提交
+						</template>
+					</v-btn>
+				</template>
+			</v-list-item>
 			<v-list-subheader inset class="config-header">路径</v-list-subheader>
 			<v-divider inset class="border-opacity-75" />
 			<v-list-item prepend-icon="mdi-folder">
@@ -82,6 +101,7 @@ import TLoading from "../components/t-loading.vue";
 import { dialog, fs, app } from "@tauri-apps/api";
 // store
 import useAppStore from "../store/modules/app";
+import useHomeStore from "../store/modules/home";
 import useAchievementsStore from "../store/modules/achievements";
 // utils
 import { WriteTGData } from "../utils/TGIndex";
@@ -90,6 +110,7 @@ import { getDataList } from "../data/init";
 
 // Store
 const appStore = useAppStore();
+const homeStore = useHomeStore();
 const achievementsStore = useAchievementsStore();
 
 // About
@@ -97,6 +118,9 @@ const loading = ref(true);
 const versionApp = ref("");
 const versionTauri = ref("");
 
+// data
+const showHome = ref(homeStore.getShowValue());
+
 // load version
 onMounted(async () => {
 	versionApp.value = await app.getVersion();
@@ -151,11 +175,26 @@ async function deleteTemp() {
 		await dialog.message("临时数据已删除!");
 	}
 }
+
+// 修改首页显示
+async function submitHome() {
+	// 获取已选
+	const show = showHome.value;
+	if (show.length < 1) {
+		await dialog.message("请至少选择一个!");
+		return;
+	}
+	// 设置
+	await homeStore.setShowValue(show);
+	await dialog.message("已修改!");
+}
+
 // 恢复默认配置
 async function setDefaultConfig() {
 	const res = await dialog.confirm("确定要初始化数据吗?");
 	if (res) {
 		await appStore.init();
+		await homeStore.init();
 		await achievementsStore.init();
 		dialog.message("已恢复默认配置!").then(() => {
 			window.location.reload();

src/pages/Home.vue

@@ -1,7 +1,7 @@
 <template>
-	<t-pool />
+	<t-pool v-show="homeStore.pool.show" />
-	<t-position />
+	<t-position v-show="homeStore.position.show" />
-	<t-calendar />
+	<t-calendar v-show="homeStore.calendar.show" />
 </template>
 
 <script lang="ts" setup>
@@ -9,4 +9,8 @@
 import TPool from "../components/t-pool.vue";
 import TPosition from "../components/t-position.vue";
 import TCalendar from "../components/t-calendar.vue";
+// store
+import useHomeStore from "../store/modules/home";
+
+const homeStore = useHomeStore();
 </script>

src/store/modules/app.ts

@@ -24,7 +24,7 @@ const useAppStore = defineStore({
 			// 侧边栏设置
 			sidebar: {
 				// 是否折叠
-				collapse: false,
+				collapse: true,
 				// 是否显示
 				submenu: {
 					database: false,
@@ -55,7 +55,7 @@ const useAppStore = defineStore({
 		async check() {
 			if (this.sidebar === undefined) {
 				this.sidebar = {
-					collapse: false,
+					collapse: true,
 					submenu: {
 						database: false,
 					},

src/store/modules/home.ts

@@ -0,0 +1,56 @@
+/**
+ * @file store modules home.ts
+ * @description Home store module
+ * @author BTMuli<bt-muli@outlook.com>
+ * @since Alpha v0.1.1
+ */
+
+import { defineStore } from "pinia";
+
+const useHomeStore = defineStore({
+	id: "home",
+	state: () => {
+		return {
+			calendar: {
+				show: true,
+				order: 3,
+			},
+			pool: {
+				show: true,
+				order: 1,
+			},
+			position: {
+				show: true,
+				order: 2,
+			},
+		};
+	},
+	actions: {
+		async init() {
+			this.calendar.show = true;
+			this.calendar.order = 3;
+			this.pool.show = true;
+			this.pool.order = 1;
+			this.position.show = true;
+			this.position.order = 2;
+		},
+		getShowItem() {
+			return ["素材日历", "限时祈愿", "近期活动"];
+		},
+		getShowValue() {
+			let showValue = [];
+			if (this.calendar.show) showValue.push("素材日历");
+			if (this.pool.show) showValue.push("限时祈愿");
+			if (this.position.show) showValue.push("近期活动");
+			return showValue;
+		},
+		setShowValue(value: string[]) {
+			this.calendar.show = value.includes("素材日历");
+			this.pool.show = value.includes("限时祈愿");
+			this.position.show = value.includes("近期活动");
+		},
+	},
+	persist: true,
+});
+
+export default useHomeStore;