feat: 更新积分历史和订单卡片组件

- 在 PointHistoryCard.vue 中优化积分来源标签显示逻辑
- 在 PointOrderCard.vue 中添加收货地址信息展示
- 修复开放平台弹幕排队无法加载的问题
This commit is contained in:
2025-05-01 14:43:29 +08:00
parent e3ee1bcc26
commit ffa3b09bc4
3 changed files with 1060 additions and 1024 deletions

View File

@@ -96,7 +96,7 @@ const historyColumn: DataTableColumns<ResponsePointHisrotyModel> = [
case PointFrom.Manual: case PointFrom.Manual:
return h( return h(
NTag, NTag,
{ type: 'success', bordered: false, size: 'small' }, { type: row.point > 0 ? 'success' : 'error', bordered: false, size: 'small' },
() => '主播' + (row.point > 0 ? '赠予' : '扣除'), () => '主播' + (row.point > 0 ? '赠予' : '扣除'),
) )
case PointFrom.Use: case PointFrom.Use:
@@ -194,22 +194,40 @@ const historyColumn: DataTableColumns<ResponsePointHisrotyModel> = [
<template> <template>
<!-- 无数据时显示提示 --> <!-- 无数据时显示提示 -->
<NEmpty v-if="!histories || histories.length === 0" description="暂无积分历史记录" /> <NEmpty
v-if="!histories || histories.length === 0"
description="暂无积分历史记录"
/>
<!-- 有数据时显示表格 --> <!-- 有数据时显示表格 -->
<NDataTable v-else :columns="historyColumn" :data="histories" :pagination="{ <NDataTable
v-else
:columns="historyColumn"
:data="histories"
:pagination="{
showSizePicker: true, showSizePicker: true,
pageSizes: [10, 25, 50, 100], pageSizes: [10, 25, 50, 100],
defaultPageSize: 10, defaultPageSize: 10,
size: 'small' size: 'small'
}" /> }"
/>
<!-- 商品详情模态框 --> <!-- 商品详情模态框 -->
<NModal v-model:show="showGoodsModal" preset="card" title="礼物详情 (快照)" style="max-width: 400px; height: auto"> <NModal
v-model:show="showGoodsModal"
preset="card"
title="礼物详情 (快照)"
style="max-width: 400px; height: auto"
>
<PointGoodsItem :goods="currentGoods" /> <PointGoodsItem :goods="currentGoods" />
<template v-if="currentGoods?.content"> <template v-if="currentGoods?.content">
<NDivider>礼物内容</NDivider> <NDivider>礼物内容</NDivider>
<NInput :value="currentGoods?.content" type="textarea" readonly placeholder="无内容" /> <NInput
:value="currentGoods?.content"
type="textarea"
readonly
placeholder="无内容"
/>
</template> </template>
</NModal> </NModal>
</template> </template>

View File

@@ -721,6 +721,16 @@ onMounted(() => {
</NSpace> </NSpace>
</NCard> </NCard>
<!-- 收货地址信息 -->
<template v-if="orderDetail.type === GoodsTypes.Physical">
<NDivider>收货地址</NDivider>
<NCard
size="small"
class="address-info-card"
>
<AddressDisplay :address="orderDetail.address" />
</NCard>
</template>
<!-- 快递信息 --> <!-- 快递信息 -->
<template v-if="orderDetail.status === PointOrderStatus.Shipped && orderDetail.instanceOf === 'owner' && orderDetail.type === GoodsTypes.Physical"> <template v-if="orderDetail.status === PointOrderStatus.Shipped && orderDetail.instanceOf === 'owner' && orderDetail.type === GoodsTypes.Physical">
@@ -939,6 +949,10 @@ onMounted(() => {
box-shadow: 0 2px 8px var(--n-box-shadow-color); box-shadow: 0 2px 8px var(--n-box-shadow-color);
} }
.address-info-card {
margin-bottom: 16px;
}
@media (max-width: 768px) { @media (max-width: 768px) {
.order-detail-modal { .order-detail-modal {
max-width: 95vw; max-width: 95vw;

View File

@@ -243,10 +243,6 @@
// 尝试添加队列 (处理弹幕、礼物事件) // 尝试添加队列 (处理弹幕、礼物事件)
async function add(danmaku: EventModel) { async function add(danmaku: EventModel) {
// 检查功能是否启用
if (!accountInfo.value?.settings.enableFunctions.includes(FunctionTypes.Queue)) {
return;
}
// 检查消息是否符合加入条件 // 检查消息是否符合加入条件
if (!checkMessage(danmaku)) { if (!checkMessage(danmaku)) {
return; return;
@@ -259,6 +255,10 @@
} }
if (accountInfo.value.id) { // 已登录,调用 API if (accountInfo.value.id) { // 已登录,调用 API
// 检查功能是否启用
if (!accountInfo.value?.settings.enableFunctions.includes(FunctionTypes.Queue)) {
return;
}
try { try {
const data = await QueryPostAPI<ResponseQueueModel>(QUEUE_API_URL + 'try-add', danmaku); const data = await QueryPostAPI<ResponseQueueModel>(QUEUE_API_URL + 'try-add', danmaku);
if (data.code == 200) { if (data.code == 200) {
@@ -1090,7 +1090,7 @@
<NCard style="margin-top: 10px;"> <NCard style="margin-top: 10px;">
<!-- 主内容区域 --> <!-- 主内容区域 -->
<NTabs <NTabs
v-if="!accountInfo || accountInfo.settings.enableFunctions.includes(FunctionTypes.Queue)" v-if="!accountInfo.id || accountInfo.settings.enableFunctions.includes(FunctionTypes.Queue)"
type="line" type="line"
animated animated
display-directive="show:lazy" display-directive="show:lazy"
@@ -1900,9 +1900,11 @@
0% { 0% {
box-shadow: 0 0 0 0px rgba(103, 194, 58, 0.7); box-shadow: 0 0 0 0px rgba(103, 194, 58, 0.7);
} }
70% { 70% {
box-shadow: 0 0 0 5px rgba(103, 194, 58, 0); box-shadow: 0 0 0 5px rgba(103, 194, 58, 0);
} }
100% { 100% {
box-shadow: 0 0 0 0px rgba(103, 194, 58, 0); box-shadow: 0 0 0 0px rgba(103, 194, 58, 0);
} }
@@ -1949,10 +1951,12 @@
transform: scale(1); transform: scale(1);
opacity: 0.7; opacity: 0.7;
} }
70% { 70% {
transform: scale(1.1); transform: scale(1.1);
opacity: 0; opacity: 0;
} }
100% { 100% {
transform: scale(1.1); transform: scale(1.1);
opacity: 0; opacity: 0;