<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>