From b8c6b52d6c023342a2f567c99aadcaad940b6710 Mon Sep 17 00:00:00 2001
From: Megghy <megghy@qq.com>
Date: Wed, 31 Jan 2024 17:20:23 +0800
Subject: [PATCH] update music obs component avatar

---
 src/api/api-models.ts                    |  22 +++-
 src/components/PointGoodItem.vue         |   0
 src/components/manage/PointGoodsItem.vue |   7 +-
 src/views/manage/PointManage.vue         | 160 ++++++++++++++---------
 src/views/manage/PointOrderManage.vue    |  28 ++++
 src/views/obs/MusicRequestOBS.vue        |   2 +-
 src/views/obs/QueueOBS.vue               |   9 ++
 7 files changed, 163 insertions(+), 65 deletions(-)
 delete mode 100644 src/components/PointGoodItem.vue
 create mode 100644 src/views/manage/PointOrderManage.vue

diff --git a/src/api/api-models.ts b/src/api/api-models.ts
index 67c69ea..feb8ebb 100644
--- a/src/api/api-models.ts
+++ b/src/api/api-models.ts
@@ -525,7 +525,7 @@ export interface ResponsePointGoodModel {
   content?: string
   count?: number
   price: number
-  tags: TagInfo[]
+  tags: string[]
   cover?: string
   images: string[]
   status: GoodsStatus
@@ -540,7 +540,7 @@ export interface PointGoodsModel {
   name: string
   count: number
   price: number
-  tags: TagInfo[]
+  tags: string[]
   cover?: ImageUploadModel
   status: GoodsStatus
   type: GoodsTypes
@@ -549,3 +549,21 @@ export interface PointGoodsModel {
   description: string
   content?: string
 }
+export interface AddressInfo {
+  province: string
+  city: string
+  district: string
+  address: string
+  phone: number
+  name: string
+}
+export interface BiliAuthModel {
+  id: number
+  userId: number
+  openId: string
+  address?: AddressInfo
+}
+export interface PointOrderModel{
+  id: number
+  
+}
diff --git a/src/components/PointGoodItem.vue b/src/components/PointGoodItem.vue
deleted file mode 100644
index e69de29..0000000
diff --git a/src/components/manage/PointGoodsItem.vue b/src/components/manage/PointGoodsItem.vue
index 62e5fa4..bd5871d 100644
--- a/src/components/manage/PointGoodsItem.vue
+++ b/src/components/manage/PointGoodsItem.vue
@@ -1,6 +1,6 @@
 <script setup lang="ts">
 import { ResponsePointGoodModel } from '@/api/api-models'
-import { NButton, NCard, NDropdown, NEllipsis, NFlex, NIcon, NImage, NPopselect, NText } from 'naive-ui'
+import { NButton, NCard, NDropdown, NEllipsis, NFlex, NIcon, NImage, NPopselect, NTag, NText } from 'naive-ui'
 import { FILE_BASE_URL, IMGUR_URL } from '@/data/constants'
 import { computed, ref } from 'vue'
 import { MoreHorizontal16Filled, MoreVertical16Filled } from '@vicons/fluent'
@@ -25,9 +25,12 @@ const emptyCover = IMGUR_URL + 'None.png'
       </NEllipsis>
     </template>
     <NFlex vertical>
-      <NText depth="3">
+      <NText depth="3" :italic="!goods.description">
         {{ goods.description }}
       </NText>
+      <NFlex>
+        <NTag v-for="tag in goods.tags" :key="tag" :bordered="false">{{ tag }}</NTag>
+      </NFlex>
       <NFlex justify="space-between">
         <NFlex>
           <NText> 库存: </NText>
diff --git a/src/views/manage/PointManage.vue b/src/views/manage/PointManage.vue
index 66b47ad..e18889a 100644
--- a/src/views/manage/PointManage.vue
+++ b/src/views/manage/PointManage.vue
@@ -39,26 +39,29 @@ import {
   NDropdown,
   NImage,
   useDialog,
+  NPopconfirm,
 } from 'naive-ui'
 import { computed, ref } from 'vue'
+import PointOrderManage from './PointOrderManage.vue'
 
 const message = useMessage()
 const accountInfo = useAccount()
 const dialog = useDialog()
 
 const goods = ref<ResponsePointGoodModel[]>(await getGoods())
-const currentGoodsModel = ref<PointGoodsModel>({
-  type: GoodsTypes.Virtual,
-  status: GoodsStatus.Normal,
-} as PointGoodsModel)
+const currentGoodsModel = ref<{ goods: PointGoodsModel; fileList: UploadFileInfo[] }>({
+  goods: {
+    type: GoodsTypes.Virtual,
+    status: GoodsStatus.Normal,
+  } as PointGoodsModel,
+  fileList: [],
+})
 
 const showAddGoodsModal = ref(false)
 
 const isAllowedPrivacyPolicy = ref(false)
 const isUpdating = ref(false)
 
-const fileList = ref<UploadFileInfo[]>([])
-
 const rules = {
   name: {
     required: true,
@@ -72,14 +75,14 @@ const rules = {
     required: true,
     message: '请输入虚拟礼物的具体内容',
     validator: (rule: FormItemRule, value: string) => {
-      return currentGoodsModel.value.type != GoodsTypes.Virtual || (value?.length ?? 0) > 0
+      return currentGoodsModel.value.goods.type != GoodsTypes.Virtual || (value?.length ?? 0) > 0
     },
   },
   privacy: {
     required: true,
     message: '需要阅读并同意本站隐私政策',
     validator: (rule: FormItemRule, value: boolean) => {
-      return (currentGoodsModel.value.type != GoodsTypes.Physical && currentGoodsModel.value.collectUrl != undefined) || isAllowedPrivacyPolicy.value
+      return (currentGoodsModel.value.goods.type != GoodsTypes.Physical && currentGoodsModel.value.goods.collectUrl != undefined) || isAllowedPrivacyPolicy.value
     },
   },
 }
@@ -90,7 +93,7 @@ const existTags = computed(() => {
     return []
   }
   //获取所有已存在商品的tags并去重
-  const tempSet = new Set<TagInfo>()
+  const tempSet = new Set<string>()
   for (let i = 0; i < goods.value.length; i++) {
     const goodsTags = goods.value[i].tags
     if (!goodsTags || goodsTags.length == 0) {
@@ -101,7 +104,7 @@ const existTags = computed(() => {
     }
   }
   return Array.from(tempSet).map((item) => {
-    return { label: item.name, value: item.name }
+    return { label: item, value: item }
   })
 })
 
@@ -156,15 +159,15 @@ async function updateGoods(e: MouseEvent) {
   await formRef.value
     .validate()
     .then(async () => {
-      if (fileList.value.length > 0) {
-        currentGoodsModel.value.cover = await getImageUploadModel(fileList.value)
+      if (currentGoodsModel.value.fileList.length > 0) {
+        currentGoodsModel.value.goods.cover = await getImageUploadModel(currentGoodsModel.value.fileList)
       }
-      await QueryPostAPI<ResponsePointGoodModel>(POINT_API_URL + 'update-goods', currentGoodsModel.value)
+      await QueryPostAPI<ResponsePointGoodModel>(POINT_API_URL + 'update-goods', currentGoodsModel.value.goods)
         .then((data) => {
           if (data.code == 200) {
             message.success('成功')
             showAddGoodsModal.value = false
-            currentGoodsModel.value = {} as PointGoodsModel
+            currentGoodsModel.value.goods = {} as PointGoodsModel
             if (goods.value.find((g) => g.id == data.data.id)) {
               goods.value[goods.value.findIndex((g) => g.id == data.data.id)] = data.data
             } else {
@@ -192,26 +195,67 @@ function OnFileListChange(files: UploadFileInfo[]) {
     var file = files[0]
     if ((file.file?.size ?? 0) > 10 * 1024 * 1024) {
       message.error('文件大小不能超过10MB')
-      fileList.value = []
+      currentGoodsModel.value.fileList = []
     }
   }
 }
 function onUpdateClick(item: ResponsePointGoodModel) {
   currentGoodsModel.value = {
-    ...item,
-    count: item.count ?? 0,
-    cover: undefined,
-  }
-  fileList.value = [
-    {
-      id: item.cover ?? 'cover',
-      thumbnailUrl: FILE_BASE_URL + item.cover,
-      name: '封面',
-      status: 'finished',
+    goods: {
+      ...item,
+      count: item.count ?? 0,
+      cover: undefined,
     },
-  ]
+    fileList: item.cover
+      ? [
+          {
+            id: item.cover ?? 'cover',
+            thumbnailUrl: FILE_BASE_URL + item.cover,
+            name: '封面',
+            status: 'finished',
+          },
+        ]
+      : [],
+  }
   showAddGoodsModal.value = true
 }
+//下架
+function onSetShelfClick(item: ResponsePointGoodModel, status: GoodsStatus) {
+  const d = dialog.warning({
+    title: '警告',
+    content: '你确定要下架这个礼物吗？',
+    positiveText: '确定',
+    negativeText: '取消',
+    onPositiveClick: async () => {
+      d.loading = true
+      const originStatus = item.status
+      item.status = status
+      try {
+        const data = await QueryGetAPI(POINT_API_URL + 'update-goods-status', {
+          id: item.id,
+          status: item.status,
+        })
+        if (data.code == 200) {
+          message.success('成功')
+          const index = goods.value.findIndex((g) => g.id == item.id)
+          if (index > -1) {
+            goods.value[index].status = status
+          }
+        } else {
+          message.error('失败: ' + data.message)
+          item.status = originStatus
+          console.error(data.message)
+        }
+      } catch (err) {
+        message.error('失败: ' + err)
+        item.status = originStatus
+        console.error(err)
+      } finally {
+        d.loading = false
+      }
+    },
+  })
+}
 function onDeleteClick(item: ResponsePointGoodModel) {
   const d = dialog.warning({
     title: '警告',
@@ -240,6 +284,7 @@ function onDeleteClick(item: ResponsePointGoodModel) {
     },
   })
 }
+function responseGoodsToModel(goods: ResponsePointGoodModel) {}
 </script>
 
 <template>
@@ -262,75 +307,70 @@ function onDeleteClick(item: ResponsePointGoodModel) {
       <NGrid cols="1 500:2 700:3 1000:4 1200:5" :x-gap="12" :y-gap="8">
         <NGridItem v-for="item in goods" :key="item.id">
           <PointGoodsItem :goods="item">
-            <template #header-extra>
-              <NDropdown :options="dropDownOptions" trigger="click" @select="(v) => dropDownActions[v].action(item)">
-                <NButton text style="font-size: 24px">
-                  <template #icon>
-                    <NIcon :component="MoreVertical16Filled" />
-                  </template>
-                </NButton>
-              </NDropdown>
+            <template #footer>
+              <NFlex>
+                <NButton type="info" size="small" @click="onUpdateClick(item)"> 修改 </NButton>
+                <NButton v-if="item.status != GoodsStatus.Discontinued" type="warning" size="small" @click="onSetShelfClick(item, GoodsStatus.Discontinued)"> 下架 </NButton>
+                <NButton v-else type="success" size="small" @click="onSetShelfClick(item, GoodsStatus.Normal)"> 上架 </NButton>
+                <NButton type="error" size="small" @click="onDeleteClick(item)"> 删除 </NButton>
+              </NFlex>
             </template>
           </PointGoodsItem>
         </NGridItem>
       </NGrid>
     </NTabPane>
-    <NTabPane name="orders" tab="订单">
-
-    </NTabPane>
-    <NTabPane name="users" tab="用户">
-
-    </NTabPane>
-    <NTabPane name="settings" tab="设置">
-      
+    <NTabPane name="orders" tab="订单" display-directive="show:lazy">
+      <PointOrderManage />
     </NTabPane>
+    <NTabPane name="users" tab="用户" display-directive="show:lazy"> </NTabPane>
+    <NTabPane name="settings" tab="设置" display-directive="show:lazy"> </NTabPane>
   </NTabs>
 
   <NModal v-model:show="showAddGoodsModal" preset="card" style="width: 600px; max-width: 90%" title="添加/修改礼物信息">
     <NScrollbar style="max-height: 80vh">
       <NForm ref="formRef" :model="currentGoodsModel" :rules="rules" style="width: 95%">
         <NFormItem path="name" label="名称" required>
-          <NInput v-model:value="currentGoodsModel.name" placeholder="必填, 礼物名称" />
+          <NInput v-model:value="currentGoodsModel.goods.name" placeholder="必填, 礼物名称" />
         </NFormItem>
         <NFormItem path="price" label="所需积分" required>
-          <NInputNumber v-model:value="currentGoodsModel.price" placeholder="必填, 兑换所需要的积分" min="0" />
+          <NInputNumber v-model:value="currentGoodsModel.goods.price" placeholder="必填, 兑换所需要的积分" min="0" />
         </NFormItem>
         <NFormItem path="count" label="库存">
-          <NCheckbox :checked="currentGoodsModel.count && currentGoodsModel.count < 0" @update:checked="(v) => (currentGoodsModel.count = v ? -1 : 100)"> 不限 </NCheckbox>
-          <NInputNumber v-if="currentGoodsModel.count > -1" v-model:value="currentGoodsModel.count" placeholder="可选, 礼物库存" style="max-width: 120px;"/>
+          <NCheckbox :checked="currentGoodsModel.goods.count && currentGoodsModel.goods.count < 0" @update:checked="(v) => (currentGoodsModel.goods.count = v ? -1 : 100)"> 不限 </NCheckbox>
+          <NInputNumber v-if="currentGoodsModel.goods.count > -1" v-model:value="currentGoodsModel.goods.count" placeholder="可选, 礼物库存" style="max-width: 120px" />
         </NFormItem>
         <NFormItem path="description" label="描述">
-          <NInput v-model:value="currentGoodsModel.description" placeholder="可选, 礼物描述" />
+          <NInput v-model:value="currentGoodsModel.goods.description" placeholder="可选, 礼物描述" maxlength="500" />
         </NFormItem>
         <NFormItem path="tags" label="标签">
-          <NSelect :value="currentGoodsModel.tags?.map((tag) => tag.name)" filterable multiple clearable tag placeholder="可选，输入后按回车添加" :options="existTags" />
+          <NSelect v-model:value="currentGoodsModel.goods.tags" filterable multiple clearable tag placeholder="可选，输入后按回车添加" :options="existTags" />
         </NFormItem>
         <NFormItem path="cover" label="封面">
-          <NFlex v-if="currentGoodsModel.cover">
+          <NFlex v-if="currentGoodsModel.goods.cover">
             <NText>当前封面: </NText>
-            <NImage :src="FILE_BASE_URL + currentGoodsModel.cover" height="50" object-fit="cover" />
+            <NImage :src="FILE_BASE_URL + currentGoodsModel.goods.cover" height="50" object-fit="cover" />
           </NFlex>
           <NUpload
             :max="1"
             accept=".png,.jpg,.jpeg,.gif,.svg,.webp,.ico,.bmp,.tif,.tiff,.jfif,.jpe,.jp,.psd,."
             list-type="image-card"
             :default-upload="false"
-            v-model:file-list="fileList"
+            v-model:file-list="currentGoodsModel.fileList"
             @update:file-list="OnFileListChange"
           >
-            + {{ currentGoodsModel.cover ? '更换' : '上传' }}封面
+            + {{ currentGoodsModel.goods.cover ? '更换' : '上传' }}封面
           </NUpload>
         </NFormItem>
         <NFormItem path="type" label="类型">
-          <NRadioGroup v-model:value="currentGoodsModel.type">
+          <NRadioGroup v-model:value="currentGoodsModel.goods.type">
             <NRadioButton :value="GoodsTypes.Virtual">虚拟礼物</NRadioButton>
             <NRadioButton :value="GoodsTypes.Physical">实体礼物</NRadioButton>
           </NRadioGroup>
         </NFormItem>
-        <template v-if="currentGoodsModel.type == GoodsTypes.Physical">
+        <template v-if="currentGoodsModel.goods.type == GoodsTypes.Physical">
           <NFormItem path="collectUrl" label="收货地址">
             <NFlex vertical>
-              <NRadioGroup :value="currentGoodsModel.collectUrl == undefined ? 0 : 1" @update:value="(v) => (currentGoodsModel.collectUrl = v == 1 ? '' : undefined)">
+              <NRadioGroup :value="currentGoodsModel.goods.collectUrl == undefined ? 0 : 1" @update:value="(v) => (currentGoodsModel.goods.collectUrl = v == 1 ? '' : undefined)">
                 <NRadioButton :value="0">通过本站收集收货地址</NRadioButton>
                 <NRadioButton :value="1">
                   使用站外链接收集地址
@@ -344,12 +384,12 @@ function onDeleteClick(item: ResponsePointGoodModel) {
               </NRadioGroup>
             </NFlex>
           </NFormItem>
-          <template v-if="currentGoodsModel.collectUrl != undefined">
+          <template v-if="currentGoodsModel.goods.collectUrl != undefined">
             <NFormItem path="url" label="收集链接">
-              <NInput v-model:value="currentGoodsModel.collectUrl" placeholder="用于给用户填写自己收货地址的表格的分享链接" />
+              <NInput v-model:value="currentGoodsModel.goods.collectUrl" placeholder="用于给用户填写自己收货地址的表格的分享链接" maxlength="300" />
             </NFormItem>
             <NFormItem label="内嵌收集链接">
-              <NCheckbox v-model:checked="currentGoodsModel.embedCollectUrl"> 尝试将收集链接嵌入到网页中 </NCheckbox>
+              <NCheckbox v-model:checked="currentGoodsModel.goods.embedCollectUrl"> 尝试将收集链接嵌入到网页中 </NCheckbox>
             </NFormItem>
           </template>
           <template v-else>
@@ -369,10 +409,10 @@ function onDeleteClick(item: ResponsePointGoodModel) {
                 虚拟礼物的具体内容, 网盘链接什么之类的
               </NTooltip>
             </template>
-            <NInput v-model:value="currentGoodsModel.content" type="textarea" placeholder="写这里咯" maxlength="10000" show-count clearable />
+            <NInput v-model:value="currentGoodsModel.goods.content" type="textarea" placeholder="写这里咯" maxlength="10000" show-count clearable />
           </NFormItem>
         </template>
-        <NButton @click="updateGoods" type="primary" :loading="isUpdating"> 添加 </NButton>
+        <NButton @click="updateGoods" type="primary" :loading="isUpdating"> {{ currentGoodsModel.goods.id ? '修改' : '创建' }} </NButton>
       </NForm>
     </NScrollbar>
   </NModal>
diff --git a/src/views/manage/PointOrderManage.vue b/src/views/manage/PointOrderManage.vue
new file mode 100644
index 0000000..439215f
--- /dev/null
+++ b/src/views/manage/PointOrderManage.vue
@@ -0,0 +1,28 @@
+<script setup lang="ts">
+import { PointOrderModel } from '@/api/api-models'
+import { QueryGetAPI } from '@/api/query'
+import { POINT_API_URL } from '@/data/constants'
+import { useMessage } from 'naive-ui'
+import { ref } from 'vue'
+
+const message = useMessage()
+
+const orders = ref<PointOrderModel[]>(await getOrders())
+
+async function getOrders() {
+  try {
+    const data = await QueryGetAPI<PointOrderModel[]>(POINT_API_URL + 'get-orders')
+    if (data.code == 200) {
+      return data.data
+    } else {
+      message.error('获取订单失败: ' + data.message)
+    }
+  } catch (err) {
+    console.log(err)
+    message.error('获取订单失败: ' + err)
+  }
+  return []
+}
+</script>
+
+<template></template>
diff --git a/src/views/obs/MusicRequestOBS.vue b/src/views/obs/MusicRequestOBS.vue
index 501511e..ceadd4e 100644
--- a/src/views/obs/MusicRequestOBS.vue
+++ b/src/views/obs/MusicRequestOBS.vue
@@ -77,7 +77,7 @@ onUnmounted(() => {
     <div class="music-request-singing-container" :playing="originSongs.playing ? 'true' : 'false'" :from="originSongs.playing?.music.from ?? -1">
       <div class="music-request-singing-prefix"></div>
       <template v-if="originSongs.playing">
-        <img class="music-request-singing-avatar" :src="AVATAR_URL + originSongs.playing.from?.uid" referrerpolicy="no-referrer" />
+        <img class="music-request-singing-avatar" :src="originSongs.playing.music.cover ?? AVATAR_URL + originSongs.playing.from?.uid" referrerpolicy="no-referrer" />
         <p class="music-request-singing-song-name">{{ originSongs.playing.music.name }}</p>
         <p class="music-request-singing-name">{{ originSongs.playing.from?.name }}</p>
       </template>
diff --git a/src/views/obs/QueueOBS.vue b/src/views/obs/QueueOBS.vue
index c3bee1f..c3efe08 100644
--- a/src/views/obs/QueueOBS.vue
+++ b/src/views/obs/QueueOBS.vue
@@ -341,6 +341,15 @@ onUnmounted(() => {
   color: rgba(204, 204, 204, 0.993);
   font-size: 12px;
 }
+.queue-list-item-index[index='1'] {
+  color: #ebc34c;
+}
+.queue-list-item-index[index='2'] {
+  color: #c0c0c0;
+}
+.queue-list-item-index[index='3'] {
+  color: #b87333;
+}
 .queue-list-item-level {
   text-align: center;
   height: 18px;