<template>
	<view class="warehouseEntry">
		<view>
			<view>
				<view> 账存数量 </view>
				<view> {{datas.item.stockNumber}} </view>
			</view>
			<view>
				
				<view> 实际数量 </view>
				<view> <input type="number" @change="datas.form.actualNumber=$utils.isNumber(datas.form.actualNumber)" v-model="datas.form.actualNumber" placeholder="输入数量" name="" id=""> </view>
			</view>
			<view>
				<view> 单价 </view>
				<view> {{datas.item.price}} </view>
			</view>
			<view>
				<view> 盈亏数量 </view>
				<view> {{profitNumber}} </view>
			</view>
			<view>
				<view> 总盈亏 </view>
				<view> {{profitPrice}} </view>
			</view>
		</view>
	</view>
	<view class="bottombutton">
		<up-button type="primary" style="background-color:  #318AFE;color: #fff;" @tap="toggle" :plain="true" text="保存"></up-button>
	</view>
</template>


<script setup>
	import { ref, computed, onMounted, reactive  } from 'vue';
	import { onLoad } from '@dcloudio/uni-app';
	import go from '@/commons/utils/go.js';
	
	import { stockCheck } from '@/http/api/cons.js';
	
	let datas = reactive({
		item: "",
		form: {}
	})
	onLoad((options) => {
		console.log(options)
		datas.item = JSON.parse(options.item)
		datas.form = {
			...datas.item,
			actualNumber: 0
		}
		console.log(datas.form)
	})
	
	/**
	 * 总盈亏
	 */
	let profitPrice = computed(() => {
		// 如果剩余数量为负数 
		// if (datas.form.stockNumber < 0) {
			// return (0 - datas.item.stockNumber) * datas.item.price
		// } else {
			return ((datas.form.actualNumber - datas.item.stockNumber) * datas.item.price).toFixed(2);
		// }
	})
	
	/**
	 * 盈亏数量
	 */
	let profitNumber = computed(() => {
		// if (datas.form.stockNumber < 0) {
			// return 0 - datas.item.stockNumber
		// } else {
			return datas.form.actualNumber - datas.item.stockNumber
		// }
	})

	let toggle = uni.$utils.debounce(()=> {
		stockCheck({
			...datas.form,
			actualNumber: datas.form.actualNumber,
			conId: datas.form.id,
			winLossNumber: profitNumber._value
		}).then(res => {
			// go.to('PAGES_SALES_CONSUMABLES')
			uni.showToast({
				title: '操作成功',
				icon: "none"
			})
			setTimeout(()=>{
				go.back()	
			},1000)
		})
	},1000)
	
</script>
<style>
	page {
		background-color: #f9f9f9;
	}
</style>
<style scoped lang="less">

	.warehouseEntry {
		width: 694rpx;
		height: 650rpx;
		background: #FFFFFF;
		border-radius: 18rpx 18rpx 18rpx 18rpx;
		margin: 32rpx;
		padding: 1rpx 24rpx;
		box-sizing: border-box;
		>view {
			>view {
				width: 646rpx;
				height: 84rpx;
				background: #fcfcfc;
				border: 2rpx solid #F9F9F9;
				margin-top: 32rpx;
				display: flex;
				align-items: center;

				>view:first-child {
					width: 190rpx;
					height: 84rpx;
					line-height: 84rpx;
					// text-align: left;
					padding-left: 24rpx;
					background: #F9F9F9;
					border-radius: 8rpx 0rpx 0rpx 8rpx;
					border: 2rpx solid #F9F9F9;
					font-family: Source Han Sans CN, Source Han Sans CN;
					font-weight: 400;
					font-size: 32rpx;
					color: #333333;
				}
			}
		}
	}

	.bottombutton {
		margin-top: 84rpx;
		padding: 0 24rpx;

		>button {
			width: 530rpx;
			height: 80rpx;
			border-radius: 56rpx 56rpx 56rpx 56rpx;
		}
	}
</style>