update function(queue, liverequest)

src/views/obs/LiveRequestOBS.vue

@@ -1,5 +1,11 @@
 <script setup lang="ts">
-import { Setting_LiveRequest, SongRequestFrom, SongRequestInfo, SongRequestStatus } from '@/api/api-models'
+import {
+  QueueSortType,
+  Setting_LiveRequest,
+  SongRequestFrom,
+  SongRequestInfo,
+  SongRequestStatus,
+} from '@/api/api-models'
 import { QueryGetAPI } from '@/api/query'
 import { AVATAR_URL, SONG_REQUEST_API_URL } from '@/data/constants'
 import { useElementSize } from '@vueuse/core'
@@ -7,6 +13,7 @@ import { computed, onMounted, onUnmounted, ref } from 'vue'
 import { useRoute } from 'vue-router'
 import { Vue3Marquee } from 'vue3-marquee'
 import { NCard, NDivider, NEmpty, NSpace, NText, useMessage } from 'naive-ui'
+import { List } from 'linqts'
 
 const props = defineProps<{
   id?: number
@@ -19,30 +26,45 @@ const currentId = computed(() => {
 })
 
 const listContainerRef = ref()
-const footerRef = ref()
-const footerListRef = ref()
 const { height, width } = useElementSize(listContainerRef)
-const footerSize = useElementSize(footerRef)
-const footerListSize = useElementSize(footerListRef)
 const itemHeight = 40
 
 const key = ref(Date.now())
 
 const originSongs = ref<SongRequestInfo[]>([])
 const songs = computed(() => {
+  let result = new List(originSongs.value)
+  switch (settings.value.sortType) {
+    case QueueSortType.TimeFirst: {
+      result = result.ThenBy((q) => q.createAt)
+      break
+    }
+    case QueueSortType.GuardFirst: {
+      result = result.OrderBy((q) => q.user?.guard_level).ThenBy((q) => q.createAt)
+      break
+    }
+    case QueueSortType.PaymentFist: {
+      result = result.OrderByDescending((q) => q.price ?? 0).ThenBy((q) => q.createAt)
+    }
+  }
   if (settings.value.isReverse) {
     // eslint-disable-next-line vue/no-side-effects-in-computed-properties
-    return originSongs.value.reverse()
+    return result.Reverse().ToArray()
   } else {
-    return originSongs.value
+    return result.ToArray()
   }
 })
+
+const isMoreThanContainer = computed(() => {
+  return songs.value.length * itemHeight > height.value
+})
+
 const settings = ref<Setting_LiveRequest>({} as Setting_LiveRequest)
 const singing = computed(() => {
-  return originSongs.value.find((s) => s.status == SongRequestStatus.Singing)
+  return songs.value.find((s) => s.status == SongRequestStatus.Singing)
 })
 const activeSongs = computed(() => {
-  return originSongs.value.filter((s) => s.status == SongRequestStatus.Waiting)
+  return songs.value.filter((s) => s.status == SongRequestStatus.Waiting)
 })
 
 async function get() {
@@ -59,9 +81,6 @@ async function get() {
   } catch (err) {}
   return {} as { songs: SongRequestInfo[]; setting: Setting_LiveRequest }
 }
-const isMoreThanContainer = computed(() => {
-  return originSongs.value.length * itemHeight > height.value
-})
 const allowGuardTypes = computed(() => {
   const types = []
   if (settings.value.needTidu) {
@@ -90,6 +109,8 @@ async function update() {
   }
 }
 
+const direction = ref<'normal' | 'reverse'>('normal')
+
 const visiable = ref(true)
 const active = ref(true)
 let timer: any
@@ -138,17 +159,17 @@ onUnmounted(() => {
       <div v-else class="live-request-processing-empty">暂无</div>
       <div class="live-request-processing-suffix"></div>
     </div>
-    <div class="live-request-content" ref="listContainerRef">
+    <div class="live-request-content"  ref="listContainerRef">
       <template v-if="activeSongs.length > 0">
         <Vue3Marquee
           class="live-request-list"
           :key="key"
           vertical
-          :pause="!isMoreThanContainer"
           :duration="20"
+          :pause="!isMoreThanContainer"
           :style="`height: ${height}px;width: ${width}px;`"
         >
-          <span
+          <div
             class="live-request-list-item"
             :from="song.from as number"
             :status="song.status as number"
@@ -172,7 +193,8 @@ onUnmounted(() => {
             >
               {{ `${song.user?.fans_medal_name} ${song.user?.fans_medal_level}` }}
             </div>
-          </span>
+          </div>
+          <NDivider v-if="isMoreThanContainer" class="live-request-footer-divider" style="margin: 10px 0 10px 0" />
         </Vue3Marquee>
       </template>
       <div v-else style="position: relative; top: 20%">
@@ -184,8 +206,8 @@ onUnmounted(() => {
         :key="key"
         ref="footerListRef"
         class="live-request-footer-marquee"
-        :pause="footerSize.width < footerListSize.width"
-        :duration="20"
+        :duration="10"
+        animate-on-overflow-only
       >
         <span class="live-request-tag" type="prefix">
           <div class="live-request-tag-key">前缀</div>
@@ -216,8 +238,8 @@ onUnmounted(() => {
                 : '无需'
             }}
           </div>
-        </span></Vue3Marquee
-      >
+        </span>
+      </Vue3Marquee>
     </div>
   </div>
 </template>
@@ -418,6 +440,22 @@ onUnmounted(() => {
 .live-request-tag-value {
   font-size: 14px;
 }
+.live-request-list-item-index[index='1'] {
+  background-color: #ebc34c;
+  color: white;
+  font-weight: bold;
+  text-shadow: 0 0 6px #ebc34c;
+}
+.live-request-list-item-index[index='2'] {
+  background-color: #c0c0c0;
+  color: white;
+  font-weight: bold;
+}
+.live-request-list-item-index[index='3'] {
+  background-color: #b87333;
+  color: white;
+  font-weight: bold;
+}
 @keyframes animated-border {
   0% {
     box-shadow: 0 0 0px #589580;

src/views/obs/QueueOBS.vue

@@ -115,12 +115,15 @@ onMounted(() => {
   timer = setInterval(update, 2000)
 
   //@ts-expect-error 这里获取不了
-  window.obsstudio.onVisibilityChange = function (visibility: boolean) {
-    visiable.value = visibility
-  }
-  //@ts-expect-error 这里获取不了
-  window.obsstudio.onActiveChange = function (a: boolean) {
-    active.value = a
+  if (window.obsstudio) {
+    //@ts-expect-error 这里获取不了
+    window.obsstudio.onVisibilityChange = function (visibility: boolean) {
+      visiable.value = visibility
+    }
+    //@ts-expect-error 这里获取不了
+    window.obsstudio.onActiveChange = function (a: boolean) {
+      active.value = a
+    }
   }
 })
 onUnmounted(() => {
@@ -186,6 +189,8 @@ onUnmounted(() => {
               }}
             </p>
           </span>
+
+        <NDivider v-if="isMoreThanContainer" class="queue-footer-divider" style="margin: 10px 0 10px 0" />
         </Vue3Marquee>
       </template>
       <div v-else style="position: relative; top: 20%">
@@ -241,8 +246,8 @@ onUnmounted(() => {
                 : '无需'
             }}
           </div>
-        </span></Vue3Marquee
-      >
+        </span>
+      </Vue3Marquee>
     </div>
   </div>
 </template>
@@ -399,14 +404,22 @@ onUnmounted(() => {
   color: rgba(204, 204, 204, 0.993);
   font-size: 12px;
 }
+
 .queue-list-item-index[index='1'] {
-  color: #ebc34c;
+  background-color: #ebc34c;
+  color: white;
+  font-weight: bold;
+  text-shadow: 0 0 6px #ebc34c;
 }
 .queue-list-item-index[index='2'] {
-  color: #c0c0c0;
+  background-color: #c0c0c0;
+  color: white;
+  font-weight: bold;
 }
 .queue-list-item-index[index='3'] {
-  color: #b87333;
+  background-color: #b87333;
+  color: white;
+  font-weight: bold;
 }
 .queue-list-item-level {
   text-align: center;

src/views/open_live/LiveRequest.vue

@@ -10,6 +10,8 @@ import {
   SongRequestInfo,
   SongRequestStatus,
   SongsInfo,
+  QueueGiftFilterType,
+  QueueSortType,
 } from '@/api/api-models'
 import { QueryGetAPI, QueryPostAPI, QueryPostAPIWithParams } from '@/api/query'
 import SongPlayer from '@/components/SongPlayer.vue'
@@ -50,6 +52,9 @@ import {
   NListItem,
   NModal,
   NPopconfirm,
+  NRadioButton,
+  NRadioGroup,
+  NSelect,
   NSpace,
   NSpin,
   NSwitch,
@@ -133,30 +138,44 @@ const props = defineProps<{
 const localActiveSongs = useStorage('SongRequest.ActiveSongs', [] as SongRequestInfo[])
 const originSongs = ref<SongRequestInfo[]>(await getAllSong())
 const songs = computed(() => {
-  const result = originSongs.value.filter((s) => {
+  let result = new List(originSongs.value).Where((s) => {
     if (filterName.value) {
       if (filterNameContains.value) {
-        if (!s.user?.name.toLowerCase().includes(filterName.value.toLowerCase())) {
+        if (!s?.user?.name.toLowerCase().includes(filterName.value.toLowerCase())) {
           return false
         }
-      } else if (s.user?.name.toLowerCase() !== filterName.value.toLowerCase()) {
+      } else if (s?.user?.name.toLowerCase() !== filterName.value.toLowerCase()) {
         return false
       }
     } else if (filterSongName.value) {
       if (filterSongNameContains.value) {
-        if (!s.songName.toLowerCase().includes(filterSongName.value.toLowerCase())) {
+        if (!s?.songName.toLowerCase().includes(filterSongName.value.toLowerCase())) {
           return false
         }
-      } else if (s.songName.toLowerCase() !== filterSongName.value.toLowerCase()) {
+      } else if (s?.songName.toLowerCase() !== filterSongName.value.toLowerCase()) {
         return false
       }
     }
     return true
   })
+  switch (settings.value.sortType) {
+    case QueueSortType.TimeFirst: {
+      result = result.ThenBy((q) => q.createAt)
+      break
+    }
+    case QueueSortType.GuardFirst: {
+      result = result.OrderBy((q) => q.user?.guard_level).ThenBy((q) => q.createAt)
+      break
+    }
+    case QueueSortType.PaymentFist: {
+      result = result.OrderByDescending((q) => q.price ?? 0).ThenBy((q) => q.createAt)
+    }
+  }
+  console.log(settings.value.sortType)
   if (configCanEdit.value ? settings.value.isReverse : isReverse.value) {
-    return result.reverse()
+    return result.Reverse().ToArray()
   } else {
-    return result
+    return result.ToArray()
   }
 })
 const activeSongs = computed(() => {
@@ -400,7 +419,7 @@ async function updateSettings() {
     await QueryPostAPI(SONG_REQUEST_API_URL + 'update-setting', settings.value)
       .then((data) => {
         if (data.code == 200) {
-          message.success('已保存')
+          //message.success('已保存')
         } else {
           message.error('保存失败: ' + data.message)
         }
@@ -490,7 +509,7 @@ const columns = [
     title: '来自',
     key: 'from',
     render(data) {
-      let fromType: 'info' | 'success' | 'default' | 'error'
+      let fromType: 'info' | 'success' | 'default' | 'error' = 'info'
       switch (data.from) {
         case SongRequestFrom.Danmaku: {
           fromType = 'info'
@@ -515,7 +534,10 @@ const columns = [
             return '弹幕'
           }
           case SongRequestFrom.SC: {
-            return 'SuperChat | ' + data.scPrice
+            return 'SuperChat | ' + data.price
+          }
+          case SongRequestFrom.Gift: {
+            return '礼物 | ' + data.price
           }
           case SongRequestFrom.Manual: {
             return '手动添加'
@@ -815,6 +837,16 @@ onUnmounted(() => {
               <NInput placeholder="手动添加" v-model:value="newSongName" />
               <NButton type="primary" @click="addSongManual"> 添加 </NButton>
             </NInputGroup>
+            <!-- <NRadioGroup
+              v-model:value="settings.sortType"
+              :disabled="!configCanEdit"
+              @update:value="updateSettings"
+              type="button"
+            >
+              <NRadioButton :value="QueueSortType.TimeFirst"> 加入时间优先 </NRadioButton>
+              <NRadioButton :value="QueueSortType.PaymentFist"> 付费价格优先 </NRadioButton>
+              <NRadioButton :value="QueueSortType.GuardFirst"> 舰长优先 (按等级) </NRadioButton>
+            </NRadioGroup> -->
             <NCheckbox v-if="configCanEdit" v-model:checked="settings.isReverse" @update:checked="updateSettings">
               倒序
             </NCheckbox>
@@ -893,9 +925,16 @@ onUnmounted(() => {
                   <NTag
                     v-if="song.from == SongRequestFrom.SC"
                     size="small"
-                    :color="{ textColor: 'white', color: GetSCColor(song.scPrice ?? 0) }"
+                    :color="{ textColor: 'white', color: GetSCColor(song.price ?? 0) }"
                   >
-                    SC | {{ song.scPrice }}
+                    SC | {{ song.price }}
+                  </NTag>
+                  <NTag
+                    v-if="song.from == SongRequestFrom.Gift"
+                    size="small"
+                    :color="{ textColor: 'white', color: GetSCColor(song.price ?? 0) }"
+                  >
+                    Gift | {{ song.price }}
                   </NTag>
                   <NTooltip>
                     <template #trigger>
@@ -1051,15 +1090,17 @@ onUnmounted(() => {
         <NSpin :show="isLoading">
           <NDivider> 规则 </NDivider>
           <NSpace vertical>
-            <NInputGroup style="width: 250px">
-              <NInputGroupLabel> 点播弹幕前缀 </NInputGroupLabel>
-              <template v-if="configCanEdit">
-                <NInput v-model:value="settings.orderPrefix" />
-                <NButton @click="updateSettings" type="primary">确定</NButton>
-              </template>
-              <NInput v-else v-model:value="defaultPrefix" />
-            </NInputGroup>
-
+            <NSpace align="center">
+              <NInputGroup style="width: 250px">
+                <NInputGroupLabel> 点播弹幕前缀 </NInputGroupLabel>
+                <template v-if="configCanEdit">
+                  <NInput v-model:value="settings.orderPrefix" />
+                  <NButton @click="updateSettings" type="primary">确定</NButton>
+                </template>
+                <NInput v-else v-model:value="defaultPrefix" />
+              </NInputGroup>
+              <NAlert v-if="settings.orderPrefix.includes(' ')" type="info"> 前缀包含空格 </NAlert>
+            </NSpace>
             <NInputGroup style="width: 250px">
               <NInputGroupLabel> 最大队列长度 </NInputGroupLabel>
               <NInputNumber v-model:value="settings.queueMaxSize" :disabled="!configCanEdit" />
@@ -1144,6 +1185,67 @@ onUnmounted(() => {
                 <NButton @click="updateSettings" type="info" :disabled="!configCanEdit">确定</NButton>
               </NInputGroup>
             </NSpace>
+
+            <!-- <NCheckbox v-model:checked="settings.allowGift" @update:checked="updateSettings" :disabled="!configCanEdit">
+              允许通过发送礼物加入队列
+            </NCheckbox>
+            <NSpace>
+              <template v-if="settings.allowGift">
+                <NAlert type="warning"> 赠送礼物后需要再次发送点播弹幕才能够加入 </NAlert>
+                <NInputGroup v-if="settings.allowGift" style="width: 250px">
+                  <NInputGroupLabel> 最低价格 </NInputGroupLabel>
+                  <NInputNumber v-model:value="settings.minGiftPrice" :disabled="!configCanEdit" />
+                  <NButton @click="updateSettings" type="info" :disabled="!configCanEdit">确定</NButton>
+                </NInputGroup>
+                <NSpace align="center">
+                  礼物名
+                  <NSelect
+                    style="width: 250px"
+                    v-model:value="settings.giftNames"
+                    :disabled="!configCanEdit"
+                    filterable
+                    multiple
+                    tag
+                    placeholder="礼物名称，按回车确认"
+                    :show-arrow="false"
+                    :show="false"
+                    @update:value="updateSettings"
+                  />
+                </NSpace>
+                <span>
+                  <NRadioGroup
+                    v-model:value="settings.giftFilterType"
+                    :disabled="!configCanEdit"
+                    @update:value="updateSettings"
+                  >
+                    <NRadioButton :value="QueueGiftFilterType.And"> 需同时满足礼物名和价格 </NRadioButton>
+                    <NRadioButton :value="QueueGiftFilterType.Or"> 礼物名/价格 二选一 </NRadioButton>
+                  </NRadioGroup>
+                </span>
+                <NCheckbox
+                  v-model:checked="settings.sendGiftIgnoreLimit"
+                  @update:checked="updateSettings"
+                  :disabled="!configCanEdit"
+                >
+                  赠送礼物后无视用户等级限制
+                </NCheckbox>
+              </template>
+              <NCheckbox
+                v-model:checked="settings.allowIncreasePaymentBySendGift"
+                @update:checked="updateSettings"
+                :disabled="!configCanEdit"
+              >
+                在队列中时允许继续发送礼物累计付费量 (仅限上方设定的礼物)
+              </NCheckbox>
+              <NCheckbox
+                v-if="settings.allowIncreasePaymentBySendGift"
+                v-model:checked="settings.allowIncreaseByAnyPayment"
+                @update:checked="updateSettings"
+                :disabled="!configCanEdit"
+              >
+                允许发送任意礼物来叠加付费量
+              </NCheckbox>
+            </NSpace> -->
             <NDivider> 点歌 </NDivider>
             <NSpace>
               <NCheckbox

src/views/open_live/OpenLiveIndex.vue

@@ -75,7 +75,7 @@ const accountInfo = useAccount()
   </NAlert>
   <NDivider> 还有更多 </NDivider>
   <NSpace justify="center" align="center" vertical>
-    动态抽奖、视频征集、歌单、棉花糖、日程表...
+    舰长积分、动态抽奖、视频征集、歌单、棉花糖、日程表...
     <p>
       详见
       <NButton text tag="a" href="/" target="_blank" type="primary"> VTsuru.live </NButton>

src/views/open_live/OpenQueue.vue

@@ -23,6 +23,7 @@ import {
   Dismiss16Filled,
   PeopleQueue24Filled,
   PresenceBlocked16Regular,
+  Info24Filled,
 } from '@vicons/fluent'
 import { ReloadCircleSharp } from '@vicons/ionicons5'
 import { useStorage } from '@vueuse/core'
@@ -97,6 +98,8 @@ const defaultSettings = {
   isReverse: false,
   showFanMadelInfo: true,
   showPayment: true,
+  sendGiftDirectJoin: true,
+  sendGiftIgnoreLimit: false,
 } as Setting_Queue
 const STATUS_MAP = {
   [QueueStatus.Waiting]: '等待中',
@@ -1071,7 +1074,7 @@ onUnmounted(() => {
                   @update:checked="updateSettings"
                   :disabled="!configCanEdit"
                 >
-                  只允许舰长
+                  允许舰长
                 </NCheckbox>
                 <NCheckbox
                   v-if="!settings.allowAllDanmaku"
@@ -1079,7 +1082,7 @@ onUnmounted(() => {
                   @update:checked="updateSettings"
                   :disabled="!configCanEdit"
                 >
-                  只允许提督
+                  允许提督
                 </NCheckbox>
                 <NCheckbox
                   v-if="!settings.allowAllDanmaku"
@@ -1087,7 +1090,7 @@ onUnmounted(() => {
                   @update:checked="updateSettings"
                   :disabled="!configCanEdit"
                 >
-                  只允许总督
+                  允许总督
                 </NCheckbox>
               </template>
             </NSpace>
@@ -1130,6 +1133,27 @@ onUnmounted(() => {
                     <NRadioButton :value="QueueGiftFilterType.Or"> 礼物名/价格 二选一 </NRadioButton>
                   </NRadioGroup>
                 </span>
+                <NCheckbox
+                  v-model:checked="settings.sendGiftDirectJoin"
+                  @update:checked="updateSettings"
+                  :disabled="!configCanEdit"
+                >
+                  赠送礼物后自动加入队列
+                  <NTooltip>
+                    <template #trigger>
+                      <NIcon :component="Info24Filled" />
+                    </template>
+                    否则需要手动再发送一次排队的弹幕
+                  </NTooltip>
+                </NCheckbox>
+
+                <NCheckbox
+                  v-model:checked="settings.sendGiftIgnoreLimit"
+                  @update:checked="updateSettings"
+                  :disabled="!configCanEdit"
+                >
+                  赠送礼物后无视用户等级限制
+                </NCheckbox>
               </template>
               <NCheckbox
                 v-model:checked="settings.allowIncreasePaymentBySendGift"