<template>
	<view>
		<up-popup :show="show" mode="center" @close="show=flase" :close-on-click-overlay="true">
			<view class="box">
				<view class="u-flex u-row-between">
					<text class="u-font-32 font-bold">修改数量</text>
					<up-icon name="close" @click="show=false"></up-icon>
				</view>
				<view class="form-box">
					<up-form label-position="left" label-width="auto">
						<up-form-item label="数量" required>
							<up-number-box inputWidth="200rpx" :step="1" 
							:integer="integer"
							v-model="number"></up-number-box>
						</up-form-item>
					</up-form>
				</view>
				<view class="u-m-t-12 u-flex gap-20">
					<view class="u-flex-1">
						<my-button type="default" @click="show=false">取消</my-button>
					</view>
					<view class="u-flex-1">
						<my-button type="primary" @click="confirm">确认</my-button>
					</view>
				</view>
			</view>
		</up-popup>
	</view>
</template>

<script setup>
	import {
		watch,ref, computed
	} from 'vue';

	const show = defineModel(false)
	const props = defineProps({
		min: {
			type: Number,
			default: 0
		},
		max: {
			type: Number,
			default: 9999
		},
		goods: {
			type: Object,
			default: ()=>{number:0}
		}
	})
	
	
	const integer=computed(()=>{
		if(!props.goods){
			return true
		}
		if(props.goods.product_type=="weight"){
			return false
		}
		return true
	})
	
	const number = ref(0)
	
	const emits=defineEmits('confirm')
	function confirm(){
		emits('confirm',{
			goods:props.goods,
			num:number.value
		})
		show.value=false
	}

	watch(() => show.value, (newval) => {
		if (newval) {
			number.value = props.goods.number||0
		} else {
			number.value = 0
		}
	})
</script>

<style lang="scss" scoped>
	.box {
		width: 690rpx;
		border-radius: 16rpx;
		padding: 32rpx 28rpx;
	}

	.form-box {
		padding: 20rpx;
	}
</style>