feat: 修复图片url, 开始弹幕机编写

This commit is contained in:
2025-04-13 21:59:47 +08:00
parent 2a022e0448
commit c13fcb90c8
27 changed files with 2331 additions and 915 deletions

View File

@@ -1,19 +1,26 @@
<script setup lang="ts">
import { GoodsTypes, ResponsePointGoodModel } from '@/api/api-models'
import { FILE_BASE_URL, IMGUR_URL } from '@/data/constants'
import { NAlert, NCard, NEllipsis, NEmpty, NFlex, NIcon, NImage, NTag, NText } from 'naive-ui'
import { VehicleShip20Filled } from '@vicons/fluent'
import { GoodsTypes, ResponsePointGoodModel } from '@/api/api-models';
import { FILE_BASE_URL, IMGUR_URL } from '@/data/constants';
import { NAlert, NCard, NEllipsis, NEmpty, NFlex, NIcon, NImage, NTag, NText } from 'naive-ui';
import { VehicleShip20Filled } from '@vicons/fluent';
const props = defineProps<{
goods: ResponsePointGoodModel | undefined
contentStyle?: string | undefined
}>()
const emptyCover = IMGUR_URL + 'None.png'
const props = defineProps<{
goods: ResponsePointGoodModel | undefined;
contentStyle?: string | undefined;
}>();
const emptyCover = IMGUR_URL + 'None.png';
</script>
<template>
<NEmpty v-if="!goods" description="已失效" />
<NCard v-else embedded :style="props.contentStyle">
<NEmpty
v-if="!goods"
description="已失效"
/>
<NCard
v-else
embedded
:style="props.contentStyle"
>
<template #cover>
<NImage
:src="goods.cover ? FILE_BASE_URL + goods.cover : emptyCover"
@@ -27,19 +34,41 @@ const emptyCover = IMGUR_URL + 'None.png'
<template #header-extra>
<NFlex justify="space-between">
<NFlex>
<NText depth="3"> 库存: </NText>
<NText depth="3">
库存:
</NText>
<NText v-if="goods.count && goods.count > 0">
{{ goods.count }}
</NText>
<NText v-else-if="goods.count == 0" style="color: #5f5f5f;"> </NText>
<NText v-else> </NText>
<NText
v-else-if="goods.count == 0"
style="color: #5f5f5f;"
>
</NText>
<NText v-else>
</NText>
</NFlex>
</NFlex>
</template>
<template #header>
<NFlex align="center" :size="5">
<NTag v-if="goods.count == 0" size="small" type="error" :bordered="false"> 已售完 </NTag>
<NTag size="small" :bordered="goods.type != GoodsTypes.Physical">
<NFlex
align="center"
:size="5"
>
<NTag
v-if="goods.count == 0"
size="small"
type="error"
:bordered="false"
>
已售完
</NTag>
<NTag
size="small"
:bordered="goods.type != GoodsTypes.Physical"
>
{{ goods.type == GoodsTypes.Physical ? '实物' : '虚拟' }}
</NTag>
<NEllipsis>
@@ -49,22 +78,36 @@ const emptyCover = IMGUR_URL + 'None.png'
</template>
<NFlex vertical>
<NEllipsis :line-clamp="2">
<NText :depth="goods.description ? 1 : 3" :italic="!goods.description">
<NText
:depth="goods.description ? 1 : 3"
:italic="!goods.description"
>
{{ goods.description ? goods.description : '暂无描述' }}
</NText>
</NEllipsis>
<NFlex>
<NTag v-if="goods.allowGuardLevel > 0" size="tiny" :color="{ color: '#5f5f5f', textColor: 'gold' }">
<NTag
v-if="goods.allowGuardLevel > 0"
size="tiny"
:color="{ color: '#5f5f5f', textColor: 'gold' }"
>
<template #icon>
<NIcon :component="VehicleShip20Filled" />
</template>
仅限舰长
</NTag>
<NTag v-for="tag in goods.tags" :key="tag" :bordered="false" size="tiny">{{ tag }}</NTag>
<NTag
v-for="tag in goods.tags"
:key="tag"
:bordered="false"
size="tiny"
>
{{ tag }}
</NTag>
</NFlex>
</NFlex>
<template #footer>
<slot name="footer"></slot>
<slot name="footer" />
</template>
</NCard>
</template>