<template>
	<view>
		<u-popup :show="show" @close="close" mode="center" round="20rpx" :closeable="true">
			<view style="width: 600rpx;height: 60vh;background: #FFF;border-radius: 20rpx;overflow: hidden;overflow-y: scroll;">
				<view v-if="goods && goods.id > 0">
					<pageBanner :goods="goods"></pageBanner>
					<pageInfo :goods="goods"></pageInfo>
					<view class="Pbox" style="margin-top: 20rpx;">
						<pageDetail v-if="goods" class="mb" :goods="goods"></pageDetail>
					</view>
				</view>
				<view v-else style="display: flex;align-items: center;justify-content: center;height: 100%;">
					<u-loading-icon></u-loading-icon>
				</view>
			</view>
		</u-popup>
	</view>
</template>

<script>
	import pageBanner from "./page-banner";
	import pageInfo from "./page-info.vue";
	import pageDetail from "./page-detail";
	export default {
		props: {
			goods_id: {
				type: Number,
				default: 0
			}
		},
		components: {
			pageBanner,
			pageInfo,
			pageDetail
		},
		data() {
			return {
				goods: null,
				show: true
			}
		},
		watch: {
			
		},
		computed: {
			
		},
		created() {
			this.getGoods()
		},
		methods: {
			close() {
				this.$emit('close')
			},
			// 选择规格
			async getGoods() {
				this.goods = {};
				const res = await this.$api.common.goodsInfo({
					id: this.goods_id
				});
				if (res.code == 0) {
					this.goods = res.data
				} else {
					uni.showToast({
						icon: 'none',
						title: res.msg
					})
				}
				
			},
		}
	}
</script>

<style scoped lang="scss">
	
</style>