122 lines
3.4 KiB
Vue
122 lines
3.4 KiB
Vue
<template>
|
||
<view style="background-color: #F7F7F7;">
|
||
<u-swiper :list="goodsItem.cover" height="750rpx" indicator indicatorMode="line" circular></u-swiper>
|
||
<view>
|
||
<view style="height: 30rpx;"></view>
|
||
<view style="background-color: #ffffff;padding: 30rpx;border-radius: 16rpx;">
|
||
<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.sales }}</view>
|
||
<view style="width: 80rpx;"></view>
|
||
<view>库存：{{ goodsItem.stock }}</view>
|
||
|
||
<view style="width: 80rpx;"></view>
|
||
<view v-if="goodsItem.integral">赠送积分：{{ goodsItem.integral }}</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view style="height:20rpx;"></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: 100rpx;"></view>
|
||
<view
|
||
style="position: fixed;bottom: 0rpx; box-shadow: 2px 2px 2px 2px black;height: 102rpx;width: 750rpx;background-color: #ffffff;">
|
||
<view class="u-flex u-flex-y-center u-flex-between" style="padding: 0 50rpx;height: 102rpx;">
|
||
<button open-type="contact" class="xkl-clear-btn">
|
||
<view class="u-flex u-flex-x-center">
|
||
<u-icon name="/static/img/service.png" size="40rpx"></u-icon>
|
||
</view>
|
||
<view style="color: #232323;font-size: 28rpx;text-align: center;">客服</view>
|
||
</button>
|
||
<view @click="toauth()">
|
||
<button class="xkl-clear-btn" style="width: 236rpx;height: 70rpx;line-height: 70rpx;font-size: 28rpx;background: #FFFFFF;border-radius: 8rpx 8rpx 8rpx 8rpx;
|
||
opacity: 1;
|
||
border: 2rpx solid #707070;">立即下单</button>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
import {
|
||
API_URL,
|
||
STATIC_URL
|
||
} from '@/env'
|
||
let self;
|
||
export default {
|
||
data() {
|
||
return {
|
||
show: false,
|
||
goodsItem: {
|
||
id: '',
|
||
cover: [],
|
||
original_price: '',
|
||
current_price: '',
|
||
pre_price: '',
|
||
integral: '',
|
||
sales: '',
|
||
stock: '',
|
||
note: ''
|
||
},
|
||
num: 1
|
||
}
|
||
},
|
||
onLoad(option) {
|
||
self = this;
|
||
},
|
||
onShow() {
|
||
self.getGoodsItem();
|
||
},
|
||
methods: {
|
||
toauth() {
|
||
var ua = window.navigator.userAgent.toLowerCase();
|
||
if (ua.match(/micromessenger/i) == 'micromessenger') {
|
||
location.href =
|
||
`${API_URL}/shop/v10/auth/wxoauth?path=${`/pages/order/pre?id=${self.goodsItem.id}&num=${self.num}`}`;
|
||
return true;
|
||
} else {
|
||
uni.navigateTo({
|
||
url: `/pages/order/pre?id=${self.goodsItem.id}&num=${self.num}`
|
||
})
|
||
}
|
||
return
|
||
},
|
||
open() {
|
||
// console.log('open');
|
||
},
|
||
close() {
|
||
self.show = false
|
||
// console.log('close');
|
||
},
|
||
getGoodsItem() {
|
||
self.$http.get('/shop/v10/goods/item', {
|
||
type: 1
|
||
}).then(({
|
||
data,
|
||
success
|
||
}) => {
|
||
if (success) {
|
||
self.goodsItem = data;
|
||
}
|
||
})
|
||
},
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style lang="scss">
|
||
|
||
</style> |