商品详情和确认下单页面新增多规格展示

This commit is contained in:
2022-07-07 09:53:07 +08:00
parent 7c755dc9e9
commit 6cdf4f21ef
4 changed files with 1560 additions and 1471 deletions

View File

@@ -19,7 +19,10 @@
<block v-for="(item, index) in goodsInfo" :key="index"> <block v-for="(item, index) in goodsInfo" :key="index">
<view class="goods-item"> <view class="goods-item">
<image class="order-cover" :src="item.items[0].cover" mode="aspectFill"></image> <image class="order-cover" :src="item.items[0].cover" mode="aspectFill"></image>
<view class="order-title">{{item.items[0].title}}</view> <view class="order-title">
<view class="title"> {{item.items[0].title}}</view>
<view class="subtitle" v-if="item.items[0] && item.items[0].value"> {{item.items[0].value}} </view>
</view>
<view class="order-count"> <view class="order-count">
<view class="order-price">{{item.items[0].price}}<text class="type">DT积分</text></view> <view class="order-price">{{item.items[0].price}}<text class="type">DT积分</text></view>
</view> </view>
@@ -214,12 +217,19 @@
height: 128rpx; height: 128rpx;
} }
.order-title{ .order-title{
@extend .ellipsis;
text-align: left;
flex: 1; flex: 1;
padding-left: $margin; padding-left: $margin;
font-size: 28rpx; // line-height: 40rpx;
line-height: 40rpx; .title{
font-size: 28rpx;
@extend .ellipsis;
text-align: left;
}
.subtitle{
font-size: 26rpx;
color: #666;
padding-top: 10rpx;
}
} }
.order-count{ .order-count{
text-align: right; text-align: right;

View File

@@ -23,6 +23,9 @@
</view> </view>
<view class="sales" v-if="goods.skus">库存量{{goods.skus[0].stock}}</view> <view class="sales" v-if="goods.skus">库存量{{goods.skus[0].stock}}</view>
</view> </view>
<view class="unit" v-if="goods.skus && goods.skus[0].unit !== ''">
规格 : {{goods.skus[0].unit}}
</view>
<!-- 店铺信息 --> <!-- 店铺信息 -->
<view class="shopInfo" @click="toShop(goods.shop.shop_id)" v-if="goods.shop"> <view class="shopInfo" @click="toShop(goods.shop.shop_id)" v-if="goods.shop">
@@ -74,6 +77,7 @@
methods:{ methods:{
getGoods(){ getGoods(){
goods(this.$Route.query.id).then(res => { goods(this.$Route.query.id).then(res => {
console.log(res);
this.goods = res this.goods = res
}) })
}, },
@@ -200,7 +204,13 @@
color: $text-gray; color: $text-gray;
} }
} }
.imgs{ .unit{
padding: 30rpx;
font-size: $title-size-m;
color: #333;
border-top:solid 20rpx #f9f9f9;
}
.imgs{
image{ image{
vertical-align: top; vertical-align: top;
width: 100%; width: 100%;

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long