From 25f0924ac4dcce46cb14856b88ced3b0b6289cab Mon Sep 17 00:00:00 2001
From: zhengyiming <540361168@qq.com>
Date: 星期四, 25 十二月 2025 07:41:55 +0800
Subject: [PATCH] fix: 甲方小程序
---
packages/components/src/Sku/Sku.vue | 34 ++++++++++++++++++++++++++++++++--
1 files changed, 32 insertions(+), 2 deletions(-)
diff --git a/packages/components/src/Sku/Sku.vue b/packages/components/src/Sku/Sku.vue
index 51d1786..ad7f6f5 100644
--- a/packages/components/src/Sku/Sku.vue
+++ b/packages/components/src/Sku/Sku.vue
@@ -9,15 +9,20 @@
<template #sku-header-price>
<div class="pro-sku-header">
<div class="pro-sku-header-title">{{ goods.name }}</div>
- <nut-price :price="goods.price" />
+ <div class="pro-sku-header-spec">{{ currentSpecName }}</div>
+ <nut-price :price="goods.price" size="large" />
</div>
</template>
+ <template #sku-header-extra>
+ <div></div>
+ </template>
</nut-sku>
</template>
<script setup lang="ts">
import { toThousand } from '@12333/utils';
-import { Goods, SkuItem } from './sku';
+import { Goods, SkuItem, SkuUtils } from './sku';
+import { computed } from 'vue';
defineOptions({
name: 'Sku',
@@ -44,6 +49,14 @@
price: toThousand(sku.price),
};
};
+
+const currentSpecName = computed(() => {
+ const spec = SkuUtils.getCurrentActiveSpec(props.sku);
+ if (spec) {
+ return spec.name ?? '';
+ }
+ return '';
+});
</script>
<style lang="scss">
@@ -53,6 +66,23 @@
.pro-sku-header {
flex: 1;
min-height: 0;
+ display: flex;
+ flex-direction: column;
+ justify-content: space-between;
+
+ .pro-sku-header-title {
+ color: boleGetCssVar('text-color', 'primary');
+ }
+
+ .pro-sku-header-spec {
+ color: boleGetCssVar('text-color', 'secondary');
+ font-size: 26px;
+ }
+ }
+
+ .nut-sku-content {
+ width: 100%;
+ box-sizing: border-box;
}
}
</style>
--
Gitblit v1.10.0