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