add video-collect display, improve index layout

src/views/IndexView.vue

@@ -120,8 +120,21 @@ const iconColor = 'white'
           </NGradientText>
           <NText style="font-size: 1.5em; font-weight: 500; color: white"> 一个给主播提供便利功能的网站 😊 </NText>
           <span></span>
-          <NSpace justify="center">
-            <NButton type="primary" size="large" @click="$router.push({ name: 'manage-index' })"> 开始使用 </NButton>
+          <NSpace justify="center" align="center">
+            <NSpace align="center">
+              <NSpace vertical justify="end">
+                <NText style="font-size: medium" italic> 我是主播 </NText>
+                <NButton type="primary" size="small" @click="$router.push({ name: 'manage-index' })">
+                  开始使用
+                </NButton>
+              </NSpace>
+              <NSpace vertical>
+                <NText style="font-size: medium" italic> 我是观众 </NText>
+                <NButton type="primary" size="small" secondary @click="$router.push({ name: 'bili-user' })" bordered>
+                  用户主页
+                </NButton>
+              </NSpace>
+            </NSpace>
             <NButton size="large" @click="$router.push('/user/Megghy')"> 展示 </NButton>
             <NButton
               size="large"

src/views/VideoCollectPublic.vue

@@ -92,7 +92,7 @@ onUnmounted(() => {
             <NText depth="3" style="font-size: 14px">{{ table.owner?.name }}</NText>
           </NButton>
         </template>
-        <VideoCollectInfoCard :item="table" />
+        <VideoCollectInfoCard :item="table" :canClick="false" from="user" />
         <NDivider />
         <NAlert v-if="table.isFinish" type="error" title="该征集表已截止" />
         <NSpace v-else vertical>

src/views/ViewerLayout.vue

@@ -7,7 +7,7 @@ import { useUser } from '@/api/user'
 import RegisterAndLogin from '@/components/RegisterAndLogin.vue'
 import { FETCH_API } from '@/data/constants'
 import { useAuthStore } from '@/store/useAuthStore'
-import { BookCoins20Filled, CalendarClock24Filled } from '@vicons/fluent'
+import { BookCoins20Filled, CalendarClock24Filled, VideoAdd20Filled } from '@vicons/fluent'
 import { Chatbox, Home, Moon, MusicalNote, Sunny } from '@vicons/ionicons5'
 import { useElementSize, useStorage } from '@vueuse/core'
 import {
@@ -145,6 +145,21 @@ onMounted(async () => {
       key: 'user-questionBox',
       icon: renderIcon(Chatbox),
     },
+    {
+      label: () =>
+        h(
+          RouterLink,
+          {
+            to: {
+              name: 'user-video-collect',
+            },
+          },
+          { default: () => '视频征集' },
+        ),
+      show: (userInfo.value?.extra?.enableFunctions.indexOf(FunctionTypes.VideoCollect) ?? -1) > -1,
+      key: 'user-video-collect',
+      icon: renderIcon(VideoAdd20Filled),
+    },
     {
       label: () =>
         h(

src/views/manage/VideoCollectDetailView.vue

@@ -387,7 +387,7 @@ onActivated(async () => {
       </NPopconfirm>
     </template>
   </NSpace>
-  <VideoCollectInfoCard :item="videoDetail.table" style="width: 100%; max-width: 90vw">
+  <VideoCollectInfoCard :item="videoDetail.table" style="width: 100%; max-width: 90vw" from="owner">
     <template v-if="width > 1000" #header-extra>
       <NSpace>
         <NButton type="success" size="small" @click="shareModalVisiable = true"> 分享 </NButton>

src/views/manage/VideoCollectManageView.vue

@@ -1,11 +1,12 @@
 <script setup lang="ts">
-import { useAccount } from '@/api/account'
-import { VideoCollectTable } from '@/api/api-models'
+import { UpdateFunctionEnable, useAccount } from '@/api/account'
+import { FunctionTypes, VideoCollectTable } from '@/api/api-models'
 import { QueryGetAPI, QueryPostAPI } from '@/api/query'
 import VideoCollectInfoCard from '@/components/VideoCollectInfoCard.vue'
 import { VIDEO_COLLECT_API_URL } from '@/data/constants'
 import {
   FormRules,
+  NAlert,
   NButton,
   NDatePicker,
   NDivider,
@@ -19,6 +20,7 @@ import {
   NModal,
   NSpace,
   NSpin,
+  NSwitch,
   NText,
   useMessage,
 } from 'naive-ui'
@@ -125,6 +127,14 @@ function createTable() {
 </script>
 
 <template>
+  <NAlert type="info" v-if="accountInfo.id">
+    在个人主页展示进行中的征集表
+    <NSwitch
+      :value="accountInfo.settings.enableFunctions.includes(FunctionTypes.VideoCollect)"
+      @update:value="UpdateFunctionEnable(FunctionTypes.VideoCollect)"
+    />
+  </NAlert>
+  <NDivider />
   <NSpace>
     <NButton @click="createModalVisible = true" type="primary"> 新建征集表 </NButton>
   </NSpace>
@@ -132,9 +142,9 @@ function createTable() {
   <NSpin :show="isLoading">
     <NSpace justify="center">
       <NEmpty v-if="videoTables.length == 0" />
-      <NList v-else>
-        <NListItem v-for="item in videoTables" :key="item.id">
-          <VideoCollectInfoCard :item="item" canClick style="width: 500px; max-width: 70vw" />
+      <NList v-else bordered>
+        <NListItem v-for="item in videoTables" :key="item.id" style="padding: 0">
+          <VideoCollectInfoCard :item="item" canClick style="width: 500px; max-width: 70vw" from="owner" />
         </NListItem>
       </NList>
     </NSpace>

src/views/open_live/LiveRequest.vue

@@ -180,7 +180,7 @@ const filterSongNameContains = ref(false)
 const filterName = ref('')
 const filterNameContains = ref(false)
 
-const defaultPrefix = useStorage('Settings.SongRequest.DefaultPrefix', '点歌')
+const defaultPrefix = useStorage('Settings.SongRequest.DefaultPrefix', '点播')
 const configCanEdit = computed(() => {
   return accountInfo.value != null && accountInfo.value != undefined
 })

src/views/view/VideoCollectView.vue

@@ -1,15 +1,53 @@
 <script lang="ts" setup>
-import { UserInfo } from '@/api/api-models'
+import { UserInfo, VideoCollectTable } from '@/api/api-models'
+import { QueryGetAPI } from '@/api/query'
+import VideoCollectInfoCard from '@/components/VideoCollectInfoCard.vue'
+import { VIDEO_COLLECT_API_URL } from '@/data/constants'
+import { NEmpty, NFlex, NList, NListItem, NSpin, useMessage } from 'naive-ui'
+import { ref } from 'vue'
 
 const props = defineProps<{
   // eslint-disable-next-line @typescript-eslint/no-explicit-any
   biliInfo: any | undefined
-  userInfo: UserInfo | undefined
+  userInfo: UserInfo
   template?: string | undefined
 }>()
 
+const isLoading = ref(true)
+const message = useMessage()
+
+const videoTables = ref<VideoCollectTable[]>(await get())
+async function get() {
+  try {
+    isLoading.value = true
+    const data = await QueryGetAPI<VideoCollectTable[]>(VIDEO_COLLECT_API_URL + 'get-active', {
+      id: props.userInfo.id,
+    })
+    if (data.code == 200) {
+      //videoTables.value = data.data
+      return data.data
+    } else {
+      message.error('获取失败: ' + data.message)
+      return []
+    }
+  } catch (err) {
+    message.error('获取失败')
+    return []
+  } finally {
+    isLoading.value = false
+  }
+}
 </script>
 
 <template>
-  1
-</template>
+  <NSpin :show="isLoading">
+    <NFlex justify="center">
+      <NEmpty v-if="videoTables.length == 0" description="没有正在进行的征集表" />
+      <NList v-else>
+        <NListItem v-for="item in videoTables" :key="item.id">
+          <VideoCollectInfoCard :item="item" canClick style="width: 500px; max-width: 70vw" from="user" />
+        </NListItem>
+      </NList>
+    </NFlex>
+  </NSpin>
+</template>