feat: tailwindcss

This commit is contained in:
xingyu4j
2025-11-06 19:13:35 +08:00
parent 1aaae15706
commit 3483dceab3
5 changed files with 38 additions and 49 deletions

View File

@@ -165,18 +165,15 @@ onMounted(() => {
>
<!-- 添加渐变背景层 -->
<div
class="pointer-events-none absolute left-0 right-0 top-0 h-[50px] bg-gradient-to-b from-[#eefaff] to-transparent"
class="from-muted pointer-events-none absolute left-0 right-0 top-0 h-12 bg-gradient-to-b to-transparent"
></div>
<div class="relative p-4">
<!-- 标题区域 -->
<div class="mb-3 flex items-center">
<div class="mr-2.5 flex items-center">
<IconifyIcon
icon="ep:cpu"
class="text-[18px] text-[#0070ff]"
/>
<IconifyIcon icon="ep:cpu" class="text-primary text-lg" />
</div>
<div class="font-600 flex-1 text-[16px]">{{ item.name }}</div>
<div class="flex-1 text-base font-bold">{{ item.name }}</div>
<!-- 标识符 -->
<div class="mr-2 inline-flex items-center">
<Tag size="small" color="blue">
@@ -198,22 +195,22 @@ onMounted(() => {
>
<IconifyIcon
icon="ep:data-line"
class="text-[18px] text-[#0070ff]"
class="text-primary text-lg"
/>
</div>
</div>
<!-- 信息区域 -->
<div class="text-[14px]">
<div class="text-sm">
<div class="mb-2.5 last:mb-0">
<span class="mr-2.5 text-[#717c8e]">属性值</span>
<span class="font-600 text-[#0b1d30]">
<span class="text-muted-foreground mr-2.5">属性值</span>
<span class="text-foreground font-bold">
{{ formatValueWithUnit(item) }}
</span>
</div>
<div class="mb-2.5 last:mb-0">
<span class="mr-2.5 text-[#717c8e]">更新时间</span>
<span class="text-[12px] text-[#0b1d30]">
<span class="text-muted-foreground mr-2.5">更新时间</span>
<span class="text-foreground text-sm">
{{ item.updateTime ? formatDate(item.updateTime) : '-' }}
</span>
</div>

View File

@@ -102,7 +102,7 @@ defineExpose({
<template>
<div class="product-card-view">
<!-- 产品卡片列表 -->
<div v-loading="loading" class="min-h-[400px]">
<div v-loading="loading" class="min-h-96">
<Row v-if="list.length > 0" :gutter="[16, 16]">
<Col
v-for="item in list"
@@ -119,7 +119,7 @@ defineExpose({
<div class="product-icon">
<IconifyIcon
:icon="item.icon || 'ant-design:inbox-outlined'"
class="text-[32px]"
class="text-3xl"
/>
</div>
<div class="ml-3 min-w-0 flex-1">
@@ -162,7 +162,7 @@ defineExpose({
<div class="product-3d-icon">
<IconifyIcon
icon="ant-design:box-plot-outlined"
class="text-[80px]"
class="text-2xl"
/>
</div>
</div>
@@ -201,11 +201,11 @@ defineExpose({
size="small"
danger
disabled
class="action-btn action-btn-delete !w-[32px]"
class="action-btn action-btn-delete !w-8"
>
<IconifyIcon
icon="ant-design:delete-outlined"
class="text-[14px]"
class="text-sm"
/>
</Button>
</Tooltip>
@@ -217,11 +217,11 @@ defineExpose({
<Button
size="small"
danger
class="action-btn action-btn-delete !w-[32px]"
class="action-btn action-btn-delete !w-8"
>
<IconifyIcon
icon="ant-design:delete-outlined"
class="text-[14px]"
class="text-sm"
/>
</Button>
</Popconfirm>