Browse Source

上传

master
前端-胡立永 1 month ago
parent
commit
77e1611c3d
4 changed files with 148 additions and 12 deletions
  1. +64
    -5
      components/product/productItem.vue
  2. +1
    -4
      manifest.json
  3. +4
    -2
      pages/index/category.vue
  4. +79
    -1
      pages_order/product/productDetail.vue

+ 64
- 5
components/product/productItem.vue View File

@ -15,9 +15,8 @@
</view> </view>
<!-- 价格 --> <!-- 价格 -->
<view class="price">
<!-- <view class="price">
<view class="money"> <view class="money">
<!-- <text>{{ item.vipPrice }}</text> -->
<text>{{ getPriceByRole(item) }}</text> <text>{{ getPriceByRole(item) }}</text>
<text class="unit">/元每件</text> <text class="unit">/元每件</text>
</view> </view>
@ -29,6 +28,59 @@
<image v-if="userInfo.role == 3" :src="configList.vip_money_three" mode="aspectFill" <image v-if="userInfo.role == 3" :src="configList.vip_money_three" mode="aspectFill"
class="price-img"></image> class="price-img"></image>
</view> </view>
</view> -->
<view class="price">
<view class="money">
<text>{{ item.price }}</text>
<text class="unit">/元每件</text>
</view>
<view class="oldPrice">
<text>{{ item.oldPrice }}</text>
<text class="unit">/</text>
</view>
</view>
<!-- <view class="oldPrice">
<view class="money">
<text>{{ item.oldPrice }}</text>
<text class="unit">/元每件</text>
</view>
<view class="price-imgs">
</view>
</view> -->
<view class="price">
<view class="money">
<text>{{ item.goldPrice }}</text>
<text class="unit">/元每件</text>
</view>
<view class="price-imgs">
<image :src="configList.vip_money_one" mode="aspectFill"
class="price-img"></image>
</view>
</view>
<view class="price">
<view class="money">
<text>{{ item.silverPrice }}</text>
<text class="unit">/元每件</text>
</view>
<view class="price-imgs">
<image :src="configList.vip_money_two" mode="aspectFill" class="price-img">
</image>
</view>
</view>
<view class="price">
<view class="money">
<text>{{ item.diamondPrice }}</text>
<text class="unit">/元每件</text>
</view>
<view class="price-imgs">
<image :src="configList.vip_money_three" mode="aspectFill" class="price-img">
</image>
</view>
</view> </view>
<!-- 销量 --> <!-- 销量 -->
@ -67,7 +119,6 @@
}, },
data() { data() {
return { return {
} }
}, },
methods: { methods: {
@ -127,7 +178,9 @@
width: calc(100% - 180rpx); width: calc(100% - 180rpx);
box-sizing: border-box; box-sizing: border-box;
overflow: hidden; overflow: hidden;
display: flex;
flex-direction: column;
gap: 10rpx;
// //
.title { .title {
font-size: 28rpx; font-size: 28rpx;
@ -143,7 +196,7 @@
align-items: center; align-items: center;
color: #f40; color: #f40;
font-size: 26rpx; font-size: 26rpx;
align-items: flex-end;
.money { .money {
font-size: 30rpx; font-size: 30rpx;
@ -163,6 +216,11 @@
} }
} }
} }
.oldPrice{
color: #999;
font-size: 18rpx;
text-decoration: line-through;
}
// //
.sales-volume { .sales-volume {
@ -192,6 +250,7 @@
display: inline-block; display: inline-block;
padding: 10rpx 20rpx; padding: 10rpx 20rpx;
border-radius: 10rpx; border-radius: 10rpx;
width: fit-content;
} }
} }
} }

+ 1
- 4
manifest.json View File

@ -58,14 +58,11 @@
}, },
"usingComponents" : true, "usingComponents" : true,
"permission" : { "permission" : {
"scope.userLocation" : {
"desc" : "你的位置信息将用于小程序位置接口的效果展示"
},
"scope.userFuzzyLocation" : { "scope.userFuzzyLocation" : {
"desc" : "你的位置信息将用于小程序位置接口的效果展示" "desc" : "你的位置信息将用于小程序位置接口的效果展示"
} }
}, },
"requiredPrivateInfos" : [ "chooseLocation", "getLocation" ]
"requiredPrivateInfos" : [ "chooseLocation" ]
}, },
"mp-alipay" : { "mp-alipay" : {
"usingComponents" : true "usingComponents" : true


+ 4
- 2
pages/index/category.vue View File

@ -15,9 +15,11 @@
<!-- 分类商品列表 --> <!-- 分类商品列表 -->
<view class="category"> <view class="category">
<uv-vtabs :list="category"
<uv-vtabs
:list="category"
:current="current" :current="current"
keyName="title" @change="change">
keyName="title"
@change="change">
<view class="list"> <view class="list">
<uv-vtabs-item> <uv-vtabs-item>
<productItem v-for="(item, index) in list" :key="index" :item="item" <productItem v-for="(item, index) in list" :key="index" :item="item"


+ 79
- 1
pages_order/product/productDetail.vue View File

@ -13,6 +13,50 @@
<view class="title"> <view class="title">
{{ productDetail.title }} {{ productDetail.title }}
</view> </view>
<view class="price">
<view class="money">
<text>{{ productDetail.price }}</text>
<text class="unit">/元每件</text>
</view>
<view class="oldPrice">
<text>{{ productDetail.oldPrice }}</text>
<text class="unit">/</text>
</view>
</view>
<view class="price">
<view class="money">
<text>{{ productDetail.goldPrice }}</text>
<text class="unit">/元每件</text>
</view>
<view class="price-imgs">
<image :src="configList.vip_money_one" mode="aspectFill"
class="price-img"></image>
</view>
</view>
<view class="price">
<view class="money">
<text>{{ productDetail.silverPrice }}</text>
<text class="unit">/元每件</text>
</view>
<view class="price-imgs">
<image :src="configList.vip_money_two" mode="aspectFill" class="price-img">
</image>
</view>
</view>
<view class="price">
<view class="money">
<text>{{ productDetail.diamondPrice }}</text>
<text class="unit">/元每件</text>
</view>
<view class="price-imgs">
<image :src="configList.vip_money_three" mode="aspectFill" class="price-img">
</image>
</view>
</view>
</view> </view>
<!-- 服务 --> <!-- 服务 -->
@ -125,7 +169,9 @@
.info { .info {
padding: 20rpx; padding: 20rpx;
background-color: #fff; background-color: #fff;
display: flex;
flex-direction: column;
gap: 14rpx;
.title { .title {
font-size: 36rpx; font-size: 36rpx;
font-weight: 900; font-weight: 900;
@ -161,6 +207,38 @@
text-align: right; text-align: right;
} }
} }
//
.price {
display: flex;
align-items: center;
color: #f40;
font-size: 30rpx;
align-items: flex-end;
.money {
font-size: 30rpx;
.unit {
font-size: 24rpx;
}
}
.price-imgs {
display: flex;
flex-wrap: wrap;
.price-img {
width: 80rpx;
height: 30rpx;
margin-left: 10rpx;
}
}
}
.oldPrice{
color: #999;
font-size: 24rpx;
text-decoration: line-through;
}
// //
.item-line { .item-line {


Loading…
Cancel
Save