feat:添加计数器功能并显示到主页面

src/App.vue

@@ -18,13 +18,15 @@ import { getAntdLocale } from './locales/index.ts'
 import { hideWindow, showWindow } from './plugins/window'
 import { useAppStore } from './stores/app'
 import { useCatStore } from './stores/cat'
+import { useCounterStore } from './stores/counter.ts'
 import { useGeneralStore } from './stores/general'
 import { useModelStore } from './stores/model'
 import { useShortcutStore } from './stores/shortcut.ts'
 
 const { generateColorVars } = useThemeVars()
 const appStore = useAppStore()
 const modelStore = useModelStore()
+const counterStore = useCounterStore()
 const catStore = useCatStore()
 const generalStore = useGeneralStore()
 const shortcutStore = useShortcutStore()
@@ -46,6 +48,8 @@ onMounted(async () => {
   await generalStore.init()
   await shortcutStore.$tauri.start()
   await restoreState()
+  await counterStore.init()
+  await counterStore.$tauri.start()
 })
 
 watch(() => generalStore.appearance.language, (value) => {

src/composables/useModel.ts

@@ -11,6 +11,7 @@ import { ref } from 'vue'
 import live2d from '../utils/live2d'
 
 import { useCatStore } from '@/stores/cat'
+import { useCounterStore } from '@/stores/counter'
 import { useModelStore } from '@/stores/model'
 import { getCursorMonitor } from '@/utils/monitor'
 
@@ -25,6 +26,7 @@ export function useModel() {
   const modelStore = useModelStore()
   const catStore = useCatStore()
   const modelSize = ref<ModelSize>()
+  const counterStore = useCounterStore()
 
   async function handleLoad() {
     try {
@@ -72,6 +74,8 @@ export function useModel() {
   }
 
   const handlePress = (key: string) => {
+    counterStore.addKeyPressCount()
+
     const path = modelStore.supportKeys[key]
 
     if (!path) return
@@ -105,6 +109,7 @@ export function useModel() {
     const id = key === 'Left' ? 'ParamMouseLeftDown' : 'ParamMouseRightDown'
 
     live2d.setParameterValue(id, pressed)
+    counterStore.addMouseClickCount(pressed)
   }
 
   async function handleMouseMove(cursorPoint: PhysicalPosition) {

src/pages/main/index.vue

@@ -8,6 +8,7 @@ import { exists, readDir } from '@tauri-apps/plugin-fs'
 import { useDebounceFn, useEventListener } from '@vueuse/core'
 import { round } from 'es-toolkit'
 import { nth } from 'es-toolkit/compat'
+import { storeToRefs } from 'pinia'
 import { onMounted, onUnmounted, ref, watch } from 'vue'
 
 import { useDevice } from '@/composables/useDevice'
@@ -17,6 +18,7 @@ import { useSharedMenu } from '@/composables/useSharedMenu'
 import { useWindowPosition } from '@/composables/useWindowPosition'
 import { hideWindow, setAlwaysOnTop, setTaskbarVisibility, showWindow } from '@/plugins/window'
 import { useCatStore } from '@/stores/cat'
+import { useCounterStore } from '@/stores/counter'
 import { useGeneralStore } from '@/stores/general.ts'
 import { useModelStore } from '@/stores/model'
 import { isImage } from '@/utils/is'
@@ -34,6 +36,7 @@ const resizing = ref(false)
 const backgroundImagePath = ref<string>()
 const { stickActive } = useGamepad()
 const { isMounted, setWindowPosition } = useWindowPosition()
+const { totalCount } = storeToRefs(useCounterStore())
 
 onMounted(startListening)
 
@@ -177,6 +180,10 @@ function handleMouseMove(event: MouseEvent) {
       :src="convertFileSrc(path)"
     >
 
+    <div class="text-sm">
+      {{ totalCount }}
+    </div>
+
     <div
       v-show="resizing"
       class="flex items-center justify-center bg-black"

src/stores/counter.ts

@@ -0,0 +1,42 @@
+import { defineStore } from 'pinia'
+import { computed, ref } from 'vue'
+
+export const useCounterStore = defineStore('counter', () => {
+  const keyPressCount = ref(0)
+  const mouseClickCount = ref(0)
+  const totalCount = computed(() => keyPressCount.value + mouseClickCount.value)
+
+  function addKeyPressCount() {
+    keyPressCount.value++
+  }
+
+  function addMouseClickCount(pressed = true) {
+    if (pressed) {
+      mouseClickCount.value++
+    }
+  }
+
+  async function getMouseClickCount() {
+    mouseClickCount.value = 0
+  }
+
+  async function getKeyPressCount() {
+    keyPressCount.value = 0
+  }
+
+  const init = async () => {
+    Promise.all([
+      getKeyPressCount(),
+      getMouseClickCount(),
+    ])
+  }
+
+  return {
+    init,
+    totalCount,
+    keyPressCount,
+    mouseClickCount,
+    addKeyPressCount,
+    addMouseClickCount,
+  }
+})