From 010309ce169bb1b2759b56f99264f43c4f565055 Mon Sep 17 00:00:00 2001 From: Megghy Date: Mon, 5 May 2025 04:10:16 +0800 Subject: [PATCH] =?UTF-8?q?feat:=20=E6=9B=B4=E6=96=B0=E7=BB=84=E4=BB=B6?= =?UTF-8?q?=E5=92=8CAPI=E6=A8=A1=E5=9E=8B=EF=BC=8C=E4=BC=98=E5=8C=96?= =?UTF-8?q?=E7=94=A8=E6=88=B7=E4=BD=93=E9=AA=8C?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 在api-models.ts中将goodsId字段更改为goods，以更好地表示商品信息 - 在多个组件中添加NEllipsis组件以优化文本显示 - 在AddressDisplay.vue中调整模板格式，提升可读性 - 在PointOrderCard.vue中更新订单信息的显示逻辑 - 在PointOrderManage.vue中添加批量更新订单状态的功能 --- .cursorrules | 11 +- src/api/api-models.ts | 2 +- src/components.d.ts | 2 + src/components/manage/AddressDisplay.vue | 63 +++- src/components/manage/PointGoodsItem.vue | 1 + src/components/manage/PointOrderCard.vue | 38 +-- src/views/BiliAuthView.vue | 326 +++++++++++--------- src/views/manage/point/PointOrderManage.vue | 151 +++++++-- 8 files changed, 394 insertions(+), 200 deletions(-) diff --git a/.cursorrules b/.cursorrules index e0371d6..c19918b 100644 --- a/.cursorrules +++ b/.cursorrules @@ -16,4 +16,13 @@ - `views/`: 页面视图组件 - `open_live/`: 直播相关视图，包括点歌系统 - `obs/`: OBS相关视图组件 -- `public/`: 公共静态资源 \ No newline at end of file +- `public/`: 公共静态资源 + +## 项目使用的库 + +- @vueuse/core: 提供了一系列的 Vue 3 的实用函数 +- @vicons/fluent: 图标 +- naive-ui: 组件库 +- pinia: 状态管理 +- vue-router: 路由 +- vue-echarts: 图表 diff --git a/src/api/api-models.ts b/src/api/api-models.ts index f9cc960..4bdd17d 100644 --- a/src/api/api-models.ts +++ b/src/api/api-models.ts @@ -772,7 +772,7 @@ export interface ResponsePointOrder2OwnerModel { type: GoodsTypes customer: BiliAuthModel address?: AddressInfo - goodsId: number + goods: ResponsePointGoodModel count: number createAt: number updateAt: number diff --git a/src/components.d.ts b/src/components.d.ts index 74e9605..5c3037f 100644 --- a/src/components.d.ts +++ b/src/components.d.ts @@ -22,6 +22,7 @@ declare module 'vue' { NAvatar: typeof import('naive-ui')['NAvatar'] NButton: typeof import('naive-ui')['NButton'] NCard: typeof import('naive-ui')['NCard'] + NEllipsis: typeof import('naive-ui')['NEllipsis'] NEmpty: typeof import('naive-ui')['NEmpty'] NFlex: typeof import('naive-ui')['NFlex'] NFormItemGi: typeof import('naive-ui')['NFormItemGi'] @@ -29,6 +30,7 @@ declare module 'vue' { NIcon: typeof import('naive-ui')['NIcon'] NImage: typeof import('naive-ui')['NImage'] NInputGroupLabel: typeof import('naive-ui')['NInputGroupLabel'] + NModal: typeof import('naive-ui')['NModal'] NPopconfirm: typeof import('naive-ui')['NPopconfirm'] NScrollbar: typeof import('naive-ui')['NScrollbar'] NSpace: typeof import('naive-ui')['NSpace'] diff --git a/src/components/manage/AddressDisplay.vue b/src/components/manage/AddressDisplay.vue index 933d7e7..63cb91b 100644 --- a/src/components/manage/AddressDisplay.vue +++ b/src/components/manage/AddressDisplay.vue @@ -15,33 +15,72 @@ const { height } = useElementSize(elementRef.value) diff --git a/src/components/manage/PointGoodsItem.vue b/src/components/manage/PointGoodsItem.vue index 9a17829..87a96e2 100644 --- a/src/components/manage/PointGoodsItem.vue +++ b/src/components/manage/PointGoodsItem.vue @@ -7,6 +7,7 @@ import { NCard, NEllipsis, NEmpty, NFlex, NIcon, NImage, NTag, NText } from 'nai const props = defineProps<{ goods: ResponsePointGoodModel | undefined; contentStyle?: string | undefined; + size?: 'small' | 'default'; }>(); // 默认封面图片 diff --git a/src/components/manage/PointOrderCard.vue b/src/components/manage/PointOrderCard.vue index 4a16900..c044590 100644 --- a/src/components/manage/PointOrderCard.vue +++ b/src/components/manage/PointOrderCard.vue @@ -2,9 +2,8 @@ import { GoodsTypes, PointOrderStatus, - ResponsePointGoodModel, ResponsePointOrder2OwnerModel, - ResponsePointOrder2UserModel, + ResponsePointOrder2UserModel } from '@/api/api-models' import { QueryPostAPI } from '@/api/query' import { POINT_API_URL } from '@/data/constants' @@ -12,10 +11,13 @@ import { Info24Filled } from '@vicons/fluent' import { DataTableColumns, DataTableRowKey, + NAlert, NAutoComplete, NButton, + NCard, NDataTable, NDivider, + NEllipsis, NEmpty, NFlex, NIcon, @@ -24,6 +26,7 @@ import { NInputGroupLabel, NModal, NScrollbar, + NSpace, NStep, NSteps, NTag, @@ -32,9 +35,6 @@ import { NTooltip, useDialog, useMessage, - NCard, - NSpace, - NAlert, } from 'naive-ui' import { computed, h, onMounted, ref, watch } from 'vue' import AddressDisplay from './AddressDisplay.vue' @@ -45,10 +45,10 @@ type OrderType = ResponsePointOrder2UserModel | ResponsePointOrder2OwnerModel const props = defineProps<{ order: ResponsePointOrder2UserModel[] | ResponsePointOrder2OwnerModel[] type: 'user' | 'owner' - goods?: ResponsePointGoodModel[] loading?: boolean }>() + const message = useMessage() const dialog = useDialog() const emit = defineEmits(['selectedItem']) @@ -71,11 +71,7 @@ const orderAsOwner = computed(() => props.order as ResponsePointOrder2OwnerModel const currentGoods = computed(() => { if (!orderDetail.value) return null - if (props.type === 'user') { - return (orderDetail.value as ResponsePointOrder2UserModel).goods - } else { - return props.goods?.find((g) => g.id === (orderDetail.value as ResponsePointOrder2OwnerModel).goodsId) - } + return orderDetail.value.goods }) const expressOptions = computed(() => { @@ -143,6 +139,7 @@ const orderColumn: DataTableColumns = [ }, { title: '订单号', + minWidth: 70, key: 'id', }, { @@ -173,11 +170,9 @@ const orderColumn: DataTableColumns = [ { title: '礼物名', key: 'giftName', + minWidth: 150, render: (row: OrderType) => { - if (row.instanceOf === 'user') { - return (row as ResponsePointOrder2UserModel).goods.name - } - return props.goods?.find((g) => g.id === row.goodsId)?.name || '未知礼物' + return row.goods?.name }, }, { @@ -249,9 +244,7 @@ const orderColumn: DataTableColumns = [ key: 'address', minWidth: 250, render: (row: OrderType) => { - const goodsCollectUrl = row.instanceOf === 'user' - ? (row as ResponsePointOrder2UserModel).goods.collectUrl - : props.goods?.find((g) => g.id === row.goodsId)?.collectUrl + const goodsCollectUrl = row.goods.collectUrl if (row.type === GoodsTypes.Physical) { return goodsCollectUrl @@ -262,7 +255,7 @@ const orderColumn: DataTableColumns = [ text: true, type: 'info' }, () => h(NText, { italic: true }, () => '通过站外链接收集')) - : h(AddressDisplay, { address: row.address }) + : h(AddressDisplay, { address: row.address, size: 'small' }) } else { return h(NText, { depth: 3, italic: true }, () => '无需发货') } @@ -277,7 +270,7 @@ const orderColumn: DataTableColumns = [ if (row.trackingNumber) { return h(NFlex, { align: 'center', gap: 8 }, () => [ h(NTag, { size: 'tiny', bordered: false }, () => row.expressCompany), - h(NText, { depth: 3 }, () => row.trackingNumber), + h(NEllipsis, { style: { maxWidth: '100px' } }, () => h(NText, { depth: 3 }, () => row.trackingNumber)), ]) } return h(NText, { depth: 3, italic: true }, () => '尚未发货') @@ -728,7 +721,10 @@ onMounted(() => { size="small" class="address-info-card" > - + diff --git a/src/views/BiliAuthView.vue b/src/views/BiliAuthView.vue index 43c33ae..5180670 100644 --- a/src/views/BiliAuthView.vue +++ b/src/views/BiliAuthView.vue @@ -2,7 +2,7 @@ import { QueryGetAPI } from '@/api/query' import { BILI_AUTH_API_URL, CURRENT_HOST } from '@/data/constants' import { useBiliAuth } from '@/store/useBiliAuth' -import { useStorage } from '@vueuse/core' +import { useStorage, useBreakpoints as useVueUseBreakpoints, breakpointsTailwind } from '@vueuse/core' import { NAlert, NButton, @@ -17,7 +17,7 @@ import { NStep, NSteps, NText, - useMessage + useMessage, } from 'naive-ui' import { v4 as uuidv4 } from 'uuid' import { computed, onMounted, ref } from 'vue' @@ -30,6 +30,8 @@ type AuthStartModel = { } const message = useMessage() +const breakpoints = useVueUseBreakpoints(breakpointsTailwind) +const isSmallScreen = breakpoints.smaller('sm') const guidKey = useStorage('Bili.Auth.Key', uuidv4()) const currentToken = useStorage('Bili.Auth.Selected', null) @@ -97,11 +99,15 @@ function checkTimeLeft() { } } function copyCode() { - if (navigator.clipboard) { - navigator.clipboard.writeText(startModel.value?.code ?? '') - message.success('已复制认证码到剪切板') + const textToCopy = currentStep.value === 2 + ? `${CURRENT_HOST}bili-user?auth=${currentToken.value}` + : startModel.value?.code ?? '' + + if (navigator.clipboard && textToCopy) { + navigator.clipboard.writeText(textToCopy) + message.success(currentStep.value === 2 ? '已复制登陆链接到剪切板' : '已复制认证码到剪切板') } else { - message.warning('当前环境不支持自动复制, 请手动选择并复制') + message.warning('无法复制内容, 请手动选择并复制') } } @@ -119,20 +125,25 @@ onMounted(async () => { - + { description="现在就已经通过了认证!" /> - + diff --git a/src/views/manage/point/PointOrderManage.vue b/src/views/manage/point/PointOrderManage.vue index 968625b..44cb620 100644 --- a/src/views/manage/point/PointOrderManage.vue +++ b/src/views/manage/point/PointOrderManage.vue @@ -1,6 +1,6 @@