update effict, version check

src/components/FeedbackItem.vue

@@ -40,15 +40,47 @@ defineProps<{
       </NTooltip>
     </template>
     <template #header-extra>
-      <NTag v-if="item.type == FeedbackType.Opinion" :bordered="false" size="small" type="info" :color="{ color: '#5f877d', textColor: 'white' }"> 建议 </NTag>
-      <NTag v-else-if="item.type == FeedbackType.Bug" :bordered="false" size="small" type="info" :color="{ color: '#875f5f', textColor: 'white' }"> Bug </NTag>
-      <NTag v-else-if="item.type == FeedbackType.FunctionRequest" :bordered="false" size="small" type="info" :color="{ color: '#5f6887', textColor: 'white' }"> 功能 </NTag>
-      <NTag v-else-if="item.type == FeedbackType.Other" :bordered="false" size="small" type="info" :color="{ color: '#595557', textColor: 'white' }"> 其他 </NTag>
+      <NTag
+        v-if="item.type == FeedbackType.Opinion"
+        :bordered="false"
+        size="small"
+        type="info"
+        :color="{ color: '#5f877d', textColor: 'white' }"
+      >
+        建议
+      </NTag>
+      <NTag
+        v-else-if="item.type == FeedbackType.Bug"
+        :bordered="false"
+        size="small"
+        type="info"
+        :color="{ color: '#875f5f', textColor: 'white' }"
+      >
+        Bug
+      </NTag>
+      <NTag
+        v-else-if="item.type == FeedbackType.FunctionRequest"
+        :bordered="false"
+        size="small"
+        type="info"
+        :color="{ color: '#5f6887', textColor: 'white' }"
+      >
+        功能
+      </NTag>
+      <NTag
+        v-else-if="item.type == FeedbackType.Other"
+        :bordered="false"
+        size="small"
+        type="info"
+        :color="{ color: '#595557', textColor: 'white' }"
+      >
+        其他
+      </NTag>
     </template>
     {{ item.message }}
     <template v-if="item.replyMessage" #footer>
       <NDivider style="margin: 0px 0 10px 0" />
-      <NSpace align="center">
+      <NSpace align="center" :wrap="false">
         <div :style="`border-radius: 4px; background-color: #75c37f; width: 10px; height: 15px`"></div>
         <NText>
           {{ item.replyMessage }}

src/main.ts

@@ -1,7 +1,7 @@
 import { QueryGetAPI } from '@/api/query'
 import { BASE_API, apiFail } from '@/data/constants'
 import EasySpeech from 'easy-speech'
-import { NText, createDiscreteApi } from 'naive-ui'
+import { NButton, NFlex, NText, createDiscreteApi } from 'naive-ui'
 import { createPinia } from 'pinia'
 import { createApp, h } from 'vue'
 import App from './App.vue'
@@ -16,6 +16,8 @@ const app = createApp(App)
 app.use(router).use(pinia).mount('#app')
 
 let currentVersion: string
+let isHaveNewVersion = false
+
 const { notification } = createDiscreteApi(['notification'])
 QueryGetAPI<string>(BASE_API() + 'vtsuru/version')
   .then((version) => {
@@ -35,6 +37,34 @@ QueryGetAPI<string>(BASE_API() + 'vtsuru/version')
           duration: 5000,
           meta: () => h(NText, { depth: 3 }, () => currentVersion),
         })
+      } else {
+        setInterval(() => {
+          if (isHaveNewVersion) {
+            return
+          }
+          QueryGetAPI<string>(BASE_API() + 'vtsuru/version').then((keepCheckData) => {
+            if (keepCheckData.code == 200 && keepCheckData.data != currentVersion) {
+              isHaveNewVersion = true
+              currentVersion = version.data
+              localStorage.setItem('Version', currentVersion)
+
+              const n = notification.info({
+                title: '发现新的版本更新',
+                content: '是否现在刷新?',
+                meta: () => h(NText, { depth: 3 }, () => currentVersion),
+                action: () =>
+                  h(NFlex, null, () => [
+                    h(
+                      NButton,
+                      { text: true, type: 'primary', onClick: () => location.reload(), size: 'small' },
+                      { default: () => '刷新' },
+                    ),
+                    h(NButton, { text: true, onClick: () => n.destroy(), size: 'small' }, { default: () => '稍后' }),
+                  ]),
+              })
+            }
+          })
+        }, 60 * 1000)
       }
     }
   })

src/views/IndexView.vue

@@ -11,7 +11,7 @@ import {
 } from '@vicons/fluent'
 import { AnalyticsSharp, Calendar, Chatbox, ListCircle, MusicalNote } from '@vicons/ionicons5'
 import { useWindowSize } from '@vueuse/core'
-import { NButton, NDivider, NGradientText, NGrid, NGridItem, NIcon, NSpace, NText } from 'naive-ui'
+import { NButton, NDivider, NEllipsis, NGradientText, NGrid, NGridItem, NIcon, NSpace, NText } from 'naive-ui'
 
 const { width } = useWindowSize()
 
@@ -73,7 +73,7 @@ const functions = [
   },
   {
     name: '视频征集',
-    desc: '创建用来收集视频链接的页面, 可以从动态爬取, 也可以提前对视频进行筛选',
+    desc: '创建用来收集视频链接的页面, 可以从动态爬取(画饼), 也可以提前对视频进行筛选',
     icon: VideoAdd20Filled,
   },
   {
@@ -140,9 +140,11 @@ const iconColor = 'white'
       <NDivider style="width: 90vw" />
       <NGrid cols="1 s:2 m:3 l:4 xl:5 2xl:5" x-gap="50" y-gap="50" style="max-width: 80vw" responsive="screen">
         <NGridItem v-for="item in functions" :key="item.name">
-          <NSpace align="end">
+          <NSpace align="end" :wrap="false">
             <NIcon :component="item.icon" :color="iconColor" size="20" />
+            <NEllipsis>
               <NText class="index-feature header"> {{ item.name }} </NText>
+            </NEllipsis>
           </NSpace>
           <NText class="index-feature content"> {{ item.desc }} </NText>
         </NGridItem>