Files
houyi-uniapp/pages/goods/detail.vue
PC-202306242200\Administrator 85b89ccea7 first commit
2026-03-28 23:27:25 +08:00

98 lines
2.6 KiB
Vue
Raw Permalink Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
<template>
<view style="background-color: #F7F7F7;">
<u-swiper :list="goodsItem.cover" height="750rpx" indicator indicatorMode="line" circular></u-swiper>
<view style="height: 20rpx;"></view>
<view style="background-color: #ffffff;padding: 30rpx;border-radius: 10rpx;">
<view class="u-flex u-flex-y-center">
<view style="color: #FF1A1A; font-size: 40rpx;font-weight: 800;">{{goodsItem.current_price}}
</view>
<view style="width: 50rpx;"></view>
<view v-if="goodsItem.original_price > goodsItem.current_price"
style="color: #CCCCCC;font-size: 30rpx;text-decoration: line-through;">
{{goodsItem.original_price}}</view>
</view>
<view style="height: 20rpx;"></view>
<view style="color: #232323; font-size: 30rpx;font-weight: 800;">{{ goodsItem.name }}</view>
<view style="height: 20rpx;"></view>
<view class="u-flex" style="color: #666666;font-size: 26rpx;">
<view>库存{{ goodsItem.stock }}</view>
<view style="width: 80rpx;"></view>
<view>销量{{ goodsItem.sales }}</view>
</view>
</view>
<u-divider text="商品详情"></u-divider>
<image v-for="(img,index) in goodsItem.detail" :key="index" :src="img" style="width:750rpx;" mode="widthFix">
</image>
<view style="height: 180rpx;"></view>
<view
style="position: fixed;bottom: 0rpx;width: 750rpx;height:150rpx;background-color: #ffffff;">
<!-- <view class="u-flex u-flex-y-center" style="padding: 0 50rpx;height: 102rpx;">
<view>
<view class="u-flex u-flex-x-center">
<u-icon name="/static/icon/service.png" size="40rpx"></u-icon>
</view>
<view style="color: #232323;font-size: 28rpx;text-align: center;">客服</view>
</view>
</view> -->
<navigator :url="`/pages/order/pre?id=${goodsItem.id}`">
<u-button type="primary">立即下单</u-button>
</navigator>
</view>
</view>
</template>
<script>
let self;
export default {
data() {
return {
show: false,
goodsItem: {
id: '',
cover: [],
original_price: '',
current_price: '',
pre_price: '',
integral: '',
sales: '',
stock: '',
note: ''
}
}
},
onLoad(option) {
self = this;
if (option && option.id) {
self.goodsItem.id = option.id;
} else {
uni.navigateBack();
}
self.getGoodsItem();
},
methods: {
open() {
// console.log('open');
},
close() {
self.show = false
// console.log('close');
},
getGoodsItem() {
self.$http.get('/shop/v10/goods/item', {
id: self.goodsItem.id
}).then(({
data
}) => {
self.goodsItem = data;
})
},
}
}
</script>
<style lang="scss">
</style>