feat: 更新时间显示组件和相关设置

- 在多个组件中引入 NTime 和 NTooltip 以优化时间显示
- 修改 ActionHistoryViewer.vue 和 CheckInSettings.vue 中的时间渲染逻辑
- 在 CheckInRankingView.vue 中实现时间的相对显示和格式化
- 修复商品页加载问题
This commit is contained in:
2025-05-02 06:37:18 +08:00
parent 4bcb966bdc
commit 4ac793f155
5 changed files with 38 additions and 10 deletions

View File

@@ -36,11 +36,15 @@ const columns = [
width: 180,
sorter: (a: HistoryItem, b: HistoryItem) => a.timestamp - b.timestamp,
render: (row: HistoryItem) => {
return h(NTime, {
time: new Date(row.timestamp),
format: 'yyyy-MM-dd HH:mm:ss'
return h(NTooltip, {
}, {
trigger: () => h(NTime, {
time: row.timestamp,
type: 'relative'
}),
default: () => new Date(row.timestamp).toLocaleString()
});
}
},
},
{
title: '操作名称',

View File

@@ -43,7 +43,10 @@
</NFormItem>
<template v-if="serverSetting.enableCheckIn">
<NFormItem label="签到命令">
<NFormItem
label="签到命令"
required
>
<NInputGroup>
<NInput
:value="serverSetting.checkInKeyword"
@@ -386,7 +389,7 @@ import { CHECKIN_API_URL } from '@/data/constants';
import { GuidUtils } from '@/Utils';
import { Info24Filled } from '@vicons/fluent';
import type { DataTableColumns } from 'naive-ui';
import { NAlert, NButton, NCard, NDataTable, NDivider, NEmpty, NForm, NFormItem, NIcon, NInput, NInputGroup, NInputNumber, NPopconfirm, NSelect, NSpace, NSpin, NSwitch, NTabPane, NTabs, NText } from 'naive-ui';
import { NAlert, NButton, NCard, NDataTable, NDivider, NEmpty, NForm, NFormItem, NIcon, NInput, NInputGroup, NInputNumber, NPopconfirm, NSelect, NSpace, NSpin, NSwitch, NTabPane, NTabs, NText, NTime, NTooltip } from 'naive-ui';
import { computed, h, onMounted, ref, watch } from 'vue';
import AutoActionEditor from '../AutoActionEditor.vue';
import TemplateHelper from '../TemplateHelper.vue';
@@ -574,7 +577,14 @@ const rankingColumns: DataTableColumns<CheckInRankingInfo> = [
title: '最近签到时间',
key: 'lastCheckInTime',
render(row: CheckInRankingInfo) {
return h('span', {}, new Date(row.lastCheckInTime).toLocaleString());
return h(NTooltip, {
}, {
trigger: () => h(NTime, {
time: row.lastCheckInTime,
type: 'relative'
}),
default: () => new Date(row.lastCheckInTime).toLocaleString()
});
},
sorter: 'default'
},

1
src/components.d.ts vendored
View File

@@ -36,6 +36,7 @@ declare module 'vue' {
NSpace: typeof import('naive-ui')['NSpace']
NTag: typeof import('naive-ui')['NTag']
NText: typeof import('naive-ui')['NText']
NTime: typeof import('naive-ui')['NTime']
PointGoodsItem: typeof import('./components/manage/PointGoodsItem.vue')['default']
PointHistoryCard: typeof import('./components/manage/PointHistoryCard.vue')['default']
PointOrderCard: typeof import('./components/manage/PointOrderCard.vue')['default']

View File

@@ -52,7 +52,7 @@ import PointUserManage from './PointUserManage.vue'
const message = useMessage()
const accountInfo = useAccount()
const dialog = useDialog()
const useBiliAuth = useBiliAuth()
const biliAuth = useBiliAuth()
const formRef = ref()
const isUpdating = ref(false)
const isAllowedPrivacyPolicy = ref(false)
@@ -70,7 +70,7 @@ const hash = computed({
})
// 商品数据及模型
const goods = ref<ResponsePointGoodModel[]>(await useBiliAuth.GetGoods(accountInfo.value?.id, message))
const goods = ref<ResponsePointGoodModel[]>(await biliAuth.GetGoods(accountInfo.value?.id, message))
const defaultGoodsModel = {
goods: {
type: GoodsTypes.Virtual,

View File

@@ -131,7 +131,19 @@
<!-- 签到时间列 -->
<div class="col-time">
{{ formatDate(item.lastCheckInTime) }}
<NTooltip>
<template #trigger>
<NTime
:time="item.lastCheckInTime"
type="relative"
/>
</template>
<template #default>
<NTime
:time="item.lastCheckInTime"
/>
</template>
</NTooltip>
</div>
</div>
</div>
@@ -180,6 +192,7 @@ import {
NSelect,
NSpace,
NSpin,
NTooltip,
} from 'naive-ui';
import { computed, onMounted, ref } from 'vue';