SwtTt29
/
Mini-Program
2
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

优化商品详情页货源描述布局和样式

pull/19/head
Trae AI 1 month ago
parent
237cddff2f
commit
b05c0ed025
2 changed files with 16 additions and 11 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 25
      pages/goods-detail/goods-detail.wxml
  2. 2
      project.private.config.json

25
pages/goods-detail/goods-detail.wxml
View File

@ -72,18 +72,23 @@
<!-- 商品基本信息 -->
<view class="goods-info">
<view style="display: flex; align-items: center; justify-content: space-between; margin-bottom: 10rpx;">
<view style="display: flex; align-items: center; flex: 1;">
<view wx:if="{{goodsDetail.status === 'sold_out'}}" style="display: inline-block; margin-right: 10rpx; font-size: 18rpx; color: #fff; background: linear-gradient(135deg, #8c8c8c 0%, #a6a6a6 100%); padding: 4rpx 10rpx; border-radius: 15rpx; vertical-align: middle; backdrop-filter: blur(10rpx); border: 1rpx solid rgba(255, 255, 255, 0.3); box-shadow: 0 4rpx 12rpx rgba(0, 0, 0, 0.15), inset 0 1rpx 0 rgba(255, 255, 255, 0.5); text-shadow: 0 1rpx 2rpx rgba(0, 0, 0, 0.2); font-weight: bold; margin-top: -20rpx;">售空</view>
<view wx:elif="{{goodsDetail.supplyStatus}}" style="display: inline-block; margin-right: 10rpx; font-size: 18rpx; color: #fff; background: rgba(218, 165, 32, 0.8); padding: 4rpx 10rpx; border-radius: 15rpx; vertical-align: middle; backdrop-filter: blur(10rpx); border: 1rpx solid rgba(255, 255, 255, 0.3); box-shadow: 0 4rpx 12rpx rgba(0, 0, 0, 0.15), inset 0 1rpx 0 rgba(255, 255, 255, 0.5); text-shadow: 0 1rpx 2rpx rgba(0, 0, 0, 0.2); font-weight: bold; margin-top: -20rpx;">{{goodsDetail.supplyStatus}}</view>
<text class="goods-name">{{goodsDetail.name}}</text>
<span style="vertical-align: middle; font-size: 20rpx; color: white; background: linear-gradient(135deg, #4a90e2 0%, #2b66f0 50%, #1a4bbd 100%); padding: 4rpx 8rpx; clip-path: polygon(50% 0%, 70% 10%, 100% 30%, 100% 70%, 70% 90%, 50% 100%, 30% 90%, 0% 70%, 0% 30%, 30% 10%); margin-left: 8rpx; box-shadow: 0 2rpx 4rpx rgba(0, 0, 0, 0.3), inset 0 1rpx 2rpx rgba(255, 255, 255, 0.5); text-shadow: 0 1rpx 2rpx rgba(0, 0, 0, 0.5); font-weight: bold; margin-top: -20rpx;">V</span>
</view>
<view style="display: flex; align-items: flex-start;">
<view class="source-type-badge" style="display: flex; align-items: center; justify-content: center; margin-right: 10rpx;">
<text style="color: {{goodsDetail.sourceTypeColor}}; font-weight: bold;">{{goodsDetail.sourceType || '暂无'}}</text>
<view style="display: flex; flex-direction: column; margin-bottom: 10rpx;">
<view style="display: flex; align-items: center; justify-content: space-between; margin-bottom: 8rpx;">
<view style="display: flex; align-items: center; flex: 1;">
<view wx:if="{{goodsDetail.status === 'sold_out'}}" style="display: inline-block; margin-right: 10rpx; font-size: 18rpx; color: #fff; background: linear-gradient(135deg, #8c8c8c 0%, #a6a6a6 100%); padding: 4rpx 10rpx; border-radius: 15rpx; vertical-align: middle; backdrop-filter: blur(10rpx); border: 1rpx solid rgba(255, 255, 255, 0.3); box-shadow: 0 4rpx 12rpx rgba(0, 0, 0, 0.15), inset 0 1rpx 0 rgba(255, 255, 255, 0.5); text-shadow: 0 1rpx 2rpx rgba(0, 0, 0, 0.2); font-weight: bold; margin-top: -20rpx;">售空</view>
<view wx:elif="{{goodsDetail.supplyStatus}}" style="display: inline-block; margin-right: 10rpx; font-size: 18rpx; color: #fff; background: rgba(218, 165, 32, 0.8); padding: 4rpx 10rpx; border-radius: 15rpx; vertical-align: middle; backdrop-filter: blur(10rpx); border: 1rpx solid rgba(255, 255, 255, 0.3); box-shadow: 0 4rpx 12rpx rgba(0, 0, 0, 0.15), inset 0 1rpx 0 rgba(255, 255, 255, 0.5); text-shadow: 0 1rpx 2rpx rgba(0, 0, 0, 0.2); font-weight: bold; margin-top: -20rpx;">{{goodsDetail.supplyStatus}}</view>
<text class="goods-name">{{goodsDetail.name}}</text>
<span style="vertical-align: middle; font-size: 20rpx; color: white; background: linear-gradient(135deg, #4a90e2 0%, #2b66f0 50%, #1a4bbd 100%); padding: 4rpx 8rpx; clip-path: polygon(50% 0%, 70% 10%, 100% 30%, 100% 70%, 70% 90%, 50% 100%, 30% 90%, 0% 70%, 0% 30%, 30% 10%); margin-left: 8rpx; box-shadow: 0 2rpx 4rpx rgba(0, 0, 0, 0.3), inset 0 1rpx 2rpx rgba(255, 255, 255, 0.5); text-shadow: 0 1rpx 2rpx rgba(0, 0, 0, 0.5); font-weight: bold; margin-top: -20rpx;">V</span>
</view>
<view style="display: flex; align-items: flex-start;">
<view class="source-type-badge" style="display: flex; align-items: center; justify-content: center; margin-right: 10rpx;">
<text style="color: {{goodsDetail.sourceTypeColor}}; font-weight: bold;">{{goodsDetail.sourceType || '暂无'}}</text>
</view>
</view>
</view>
<view class="source-description" style="padding: 8rpx 16rpx; background: #f5f5f5; border-radius: 8rpx; font-size: 28rpx; color: #333; margin-top: 4rpx;">
{{goodsDetail.description || '暂无描述'}}
</view>
</view>
<view class="goods-price" style="position: relative; display: flex; align-items: center; justify-content: space-between;">
<view style="display: flex; align-items: center;">

2
project.private.config.json
View File

@ -1,6 +1,6 @@
{
"libVersion": "3.10.3",
"projectname": "xcx22",
"projectname": "Mini-Program",
"setting": {
"urlCheck": false,
"coverView": true,

Write Preview
Loading…
Cancel
Save