<template>
	<view>
		<view class="serchs">
			<view class="leftbtn">
				<view class="ipt">
					<input type="text" placeholder="物料名称/物料编码/物料简拼" v-model="form.wlParamInfo" />
					<image src="/static/index/procurement/x.png" mode="aspectFill" v-if="form.wlParamInfo"
						@click="search(0)"></image>
				</view>
				<view @click="search" class="scr">
					检索
				</view>
				<view class="shx" @click="ification=true">
					<image src="/static/index/procurement/sx.png" mode="aspectFill"></image>
					筛选
				</view>
			</view>
			<view class="rightbtn">
				<view @click="open = 1">
					<image src="/static/index/procurement/del1.png" mode="aspectFill"></image>
					清空
				</view>
				<view @click="caigouclk">
					<image src="/static/index/procurement/procure01.png" mode="aspectFill"></image>
					采购
				</view>
				<view class="back" @click="uni.navigateBack()">
					<image src="/static/index/procurement/bk.png" mode="aspectFill"></image>
					返回
				</view>
			</view>
		</view>
		<carlist :InvoicingList="InvoicingList" :status="status" @delindex="opendelindex" @addcartory="addcartory"></carlist>
		
		<equiment :open="open==1"  @del="del()" @back="open = 0" :content="'是否清空购物车？'"></equiment>
		<equiment :open="open==2"  @del="delindex()" @back="open = 0" :content="'是否删除此物料？'"></equiment>
		
		<!-- 筛选 -->
		<view class="mengban" v-if="ification" @click="ification = false"></view>
		<classification @confirm="confirm" :show="ification" :typenum="1"></classification>
		<defaultr cont="暂无数据" v-if="status=='nomore'&&InvoicingList.length==0"></defaultr>
		
		<view class="mengban" v-if="addflag" @click="addflag = false"></view>
		<calculator :show="addflag"  :caigouobj="caigouobj"  @colse="addflag = false" @right="right"></calculator>
		<purorder :arrlist="caigouarr" :show="caigouflag" @cloe="caigouflag = false" @config="configr"></purorder>
	</view>
</template>

<script setup lang="ts">
	import { ref, onMounted, reactive, onBeforeUnmount, computed, nextTick, defineProps ,defineComponent} from 'vue';
	import { onShow, onLoad, onHide, onPageScroll } from "@dcloudio/uni-app"
	import {eddShoppingCartList, queryShoppingCartList, getGwcMaterialTreeData, queryNuInfoByNuId, updateKfstatus,deleteQgInfoById,emptiedQgInfo ,queryWlInfoByWlId,generatedPurchaseOrder,generatedPurchaseViewOrder } from './api/lunpan.js'
	import carlist from './components/carlist.vue';
	import equiment from './components/equiment.vue';
	import classification from './components/classification.vue'
	import defaultr from './components/default.vue'
	import calculator from './components/calculator.vue'
	import purorder from './components/purorder.vue'
	import config from '../../uni_modules/vk-uview-ui/libs/config/config.js';
	const addflag = ref(false)
	const ification = ref(false)
	const caigouobj = ref({})
	 const form = reactive({
	 	nuId: uni.getStorageSync('nuId'),
	 	pageNo: 1,
	 	pageSize: -1,
	 	categoryId: '',
	 	typeId: '',
	 	medicationId: '',
	 	wlParamInfo: '',
		suppliers:''
	 })
	 const InvoicingList = ref([])
	 const status = ref('loading')
	 const open = ref(0)
	 onLoad(()=>{
		 queryInvo()
	 })
	 const queryInvo = () => {
	 	queryShoppingCartList(form).then(res => { 
	 		res.result.records.forEach((item,i)=>{
	 			item.flag = true;
				item.zk = false;
				item.scrollleft = 0;
	 		})
	 		console.log(res.result.records)
	 		InvoicingList.value.push(...res.result.records);
	 		status.value = res.result.total == InvoicingList.value.length ? 'nomore' : 'loadmore';
			setout.value = (res.result.total == InvoicingList.value.length ? false : true)
	 	})
	 }
	 const search = (x : number) => {
	 	if (x === 0) { form.wlParamInfo = '' }
	 	form.pageNo = 1;
	 	InvoicingList.value = [];
	 	queryInvo();
	 }
	 
	 const addcartory =(e:any)=>{
	 	console.log(e)
	 	 caigouobj.value = e;
	 	 addflag.value = true;
	 }
	 const confirm =(e:any)=>{
	 	form.categoryId = e.categoryId;
	 	form.typeId = e.typeId;
	 	form.medicationId = e.medicationId;
	 	form.suppliers = e.suppliers;
	 	form.pageNo=1;
	 	InvoicingList.value = [];
	 	queryInvo();
	 	ification.value = false
	 }
	const configr=()=>{
		 caigouflag.value = false;
		 search(1)
	 }
	 let times = null;
	 const setout = ref(true)
	 const scrolltolower = (t:number) => {
	 		if (setout.value==false) { return }
	 		status.value = 'loading'
	 		setout.value = false;
	 		form.pageNo++;
	 		queryInvo()
	 	}
		const del=()=>{
			emptiedQgInfo().then(res=>{
				if(res.success){
					form.pageNo=1;
					InvoicingList.value = [];
					queryInvo()
				}
				open.value = 0;
				// uni.showToast({
				// 	icon:res.success?'success':'none',
				// 	title:res.message
				// })
			})
		}
		const delobj = ref({})
		const opendelindex=(v:any,i:number)=>{
			open.value = 2;
			v.index = i;
			delobj.value = v;
		}
		const delindex =()=>{
			let delstr = delobj.value.id;
			deleteQgInfoById(delstr).then(res=>{
				uni.showToast({
					icon:res.success?'success':'none',
					title:res.message
				})
				setTimeout(()=>{
					if(res.success){
						InvoicingList.value.splice(delobj.value.index,1);
						open.value = 0;
					}
				},800)
				
			})
		}
		const right = (n:number,nm:any,type:Object) => {
			connfig(nm,n,type)
		}
		const timers = ref(true)
		const connfig = (nm:any,num:Number,type:Object) =>{
			if(timers.value==false){return}
			timers.value=false;
			let dt = {
				nuId:form.nuId,
				purchaseQuantity:num,
				suppliersId:nm.id,
				suppliersName:nm.name,
				id:caigouobj.value.id,
				wlId:caigouobj.value.wlId,
				kcsl:caigouobj.value.kcsl,
				wlUnits:type.unit,
				referenceUnitPrice:type.price,
				dhbl:type.num
			}
			 
			console.log(dt)
			eddShoppingCartList(dt).then(res=>{
				uni.showToast({
					icon:res.success?'success':'none',
					title:res.message
				})
				setTimeout(()=>{
					timers.value=true;
					if(res.success){
						addflag.value = false;
						 form.pageNo=1;
						 InvoicingList.value = [];
						 queryInvo();
					}
				},700)
			})
		}
		const caigouflag = ref(false)
		const caigouarr = ref([])
		const caigouclk =()=>{
			let arr = [];
			InvoicingList.value.forEach(item=>{
				if(item.flag){
					arr.push(item)
				}
			})
			caigouarr.value = arr;
			if(arr.length==0){
				uni.showToast({
					title:'请选择物料!',
					icon:'none'
				})
				return
			}
			caigouflag.value = true;
		}
</script>

<style scoped lang="less">
.serchs {
		width:96vw;
		height: 3.3vw;
		border-radius: 1.6vw;
		display: flex;
		align-items: center;
		margin: 0.7vw 0 0;
		justify-content: space-between;
		.leftbtn{
			width: 64vw;
			height: 3.3vw;
			display: flex;
			align-items: center;
		}
		.rightbtn{
			width: 30vw;
			height: 3.3vw;
			display: flex;
			align-items: center;
			justify-content: flex-end;
			
			view{
				width: 8vw;
				height: 3.3vw;
				border-radius: 1.6vw;
				border: 1px solid #D9DADC;
				background: rgba(255, 255, 255, 0.9);
				border-radius: 1.65vw;
				font-weight: 400;
				font-size: 1.4vw;
				color: rgba(85, 85, 85, 1);
				display: flex;
				justify-content: center;
				align-items: center;
				margin-left:0.6vw;
				image {
					width: 1.5vw;
					height: 1.3vw;
					margin: 0 0.5vw;
				}
			}
		}
		.ipt {
			display: flex;
			align-items: center;
			width: 30vw;
			background: #E2E4E9;
			border-radius: 1.65vw;
			height: 3.3vw;
			
			image {
				width: 2.2vw;
				height: 2.2vw;
				margin:0 0.5vw;
			}

			input {
				width: 25vw;
				height: 3.3vw;
				font-size: 1.1vw;
				padding-left: 1.6vw;
				
			}
		}
		.back{
			width: 8vw;
			height: 3.3vw;
			border-radius: 1.6vw;
			border: 1px solid rgba(85, 85, 85, 0.5);
			background: rgba(255, 255, 255, 0.5);
			border-radius: 1.65vw;
			font-weight: 400;
			font-size: 1.4vw;
			color: rgba(85, 85, 85, 1);
			display: flex;
			justify-content: center;
			align-items: center;
			margin-left:0.6vw;
			image {
				width: 1.5vw;
				height: 1.3vw;
				margin: 0 0.5vw;
			}
			
		}
		.scr {
			border-radius: 1.65vw;
			font-weight: 400;
			font-size: 1.5vw;
			color: #1083F8;
			display: flex;
			justify-content: center;
			align-items: center;
			width: 8vw;
			height: 3.3vw;
			background: linear-gradient(-45deg, rgba(223, 244, 252, 1), rgba(204, 228, 249, 0.43));
			border: 1px solid #1083F8;
			margin: 0 1.2vw;
		}

		.shx {
			width: 8.2vw;
			height: 3.3vw;
			background: #FFFFFF;
			border-radius: 1.65vw;
			border: 1px solid #D9DADC;
			font-weight: 400;
			font-size: 1.4vw;
			color: #222;
			display: flex;
			justify-content: center;
			align-items: center;
			box-shadow: 0.5rpx 5rpx 5rpx #dadee1;

			image {
				width: 1.5vw;
				height: 1.3vw;
				margin: 0 0.5vw;
			}
		}
	}
	.guodu {
			transition: .4s;
			-webkit-transform-style: preserve-3d;
			-webkit-overflow-scrolling: touch;
		}
		.mengban {
			width: 100vw;
			height: 100vh;
			position: fixed;
			top: 0;
			left: 0;
			z-index: 90;
			background: RGBA(239, 240, 244, 0.55);
		}
</style>
<style>
	page {
		background: RGBA(239, 240, 244, 1);
		padding: 2vw;
		box-sizing: border-box;
	}
</style>