<template>
	<view class="app-container">
		<uni-nav-bar dark :fixed="true" shadow background-color="#007AFF" status-bar left-icon="left" left-text="返回"
					title="移位单" @clickLeft="handleBack" />
		<view class="scan-header">
			<uni-forms-item  name="stockCode" label="单号" labelAlign="right" 
					style="margin-bottom: 0px; padding: 0px 15px 0px 15px;" >
				<uni-easyinput type="text" :inputBorder="true" v-model="stockCode"
					:clearable="false" ></uni-easyinput>
			</uni-forms-item>
			<uni-forms-item name="dateRange" label="日期" labelAlign="right" 
					style="margin-bottom: 0px; padding: 0px 15px 0px 15px;" >
				<uni-datetime-picker v-model="dateRange" type="daterange"/>
			</uni-forms-item>
			<view class="button-group">
				<button type="default" size="mini" @click="setDateRange(-30, 0)">30天</button>
				<button type="default" size="mini" @click="setDateRange(-1, -1)">昨日</button>
				<button type="default" size="mini" @click="setDateRange(0, 0)">今日</button>
				<button type="warn" size="mini" @click="examine">审核</button>
				<button type="primary" size="mini" @click="getList">查询</button>
			</view>
		</view>
		<scroll-view class="mxpop_scroll" scroll-y="true">
			<!-- <uni-section class="mb-10" :title="sectionTitle"  type="line"> -->
				<view class="uni-list" style="margin-bottom: 60px;">
					<slot v-for="(item, index) in listData">
						<view class="uni-list-cell"
							hover-class="uni-list-cell-hover"
							:class="{ 'selected': rkid === item.id }" 
						    :key="index" @click="goProDetail(item, index, $event)"
						>
							<view style="display: flex;">
								<view class="detailList">单据：{{ item.stockCode }}|{{ item.wmsStockMoves.rowNumber }} {{ item.stockDate }}</view>
							</view>
							<view style="display: flex;">
								<view class="detailList">调出：{{ item.warehouseNameOut }}&emsp;调入：{{ item.warehouseNameIn }}</view>
							</view>
							<view style="display: flex;">
									<view class="detailList">物料：{{item.wmsStockMoves.materialName}}&emsp;规格：{{item.wmsStockMoves.materialSpecification}}</view>
							</view>
							<view style="display: flex;">
								<view class="detailList">标签：{{item.wmsStockMoves.labelCode}}&emsp;数量：{{ item.wmsStockMoves.stockQty }}{{ item.wmsStockMoves.unitName }}</view>
							</view>
						</view>
						 <view class="s-line" /> 
					</slot>
				</view>
			<!-- </uni-section> -->
		</scroll-view>
	</view>
</template>
 	
<script>
	
	import { auditListStockMove, checkStatus } from '@/api/wms/stockMove.js'
	import storage from '@/utils/storage'
	
	export default {
		onLoad(option) {},
		onUnload(){},
		data() {
			return {
				// 筛选
				stockCode: "",
				dateRange: ['', ''],
				
				listData: "", // 数据list
				rkid: "", // 当前选中数据
			}
		},
		created(){
		  this.setDateRange(-1, 0)
		},
		methods: {
			getList() {
				let that = this;
				let queryParams = {
					stockCode: that.stockCode,
					status: 1,
					params: { "beginTime": this.dateRange[0],"endTime": this.dateRange[1] },
					//extendCode04: 无法传审核人id需要换接口
				}
        auditListStockMove(queryParams).then(res => {
					if(res.code === 200){
						const newData = res.rows.map((item) => {
							// 在每个对象中插入新变量  
							item['selected'] = false;
							// 返回修改后的对象  
							return item;  
						});  
						this.listData = newData;
					}
				});
			},
			examine(){//审核
				let queryParams = [];
				if(this.rkid != ""){
					queryParams.push(this.rkid);
				}else{
					return true;
				}
				
				uni.showModal({
					title: '审核',
					content: '确认审核吗？',
					success: (res) => {
						if (res.confirm) {
							checkStatus(queryParams).then(res => {
								if(res.code === 200){
									this.getList();
								}
							});
						}
					}
				});
				
			},
			goProDetail(item, index, event){ //选中行
				try{
					if( this.rkid == item.id ){
						this.rkid = "";
					}else{
						this.rkid = item.id;
					}
				}catch{
					this.rkid = "";
				}
			},
			setDateRange(start, end){ // 赋值日期期间
				let date1 = this.getYesterdayDate(start);
				let date2 = this.getYesterdayDate(end);
				this.dateRange = [date1, date2];
				this.getList();
			},
			getYesterdayDate(num) {// 获取当前日期
				let today = new Date();
				// 计算日期
				let yesterday = new Date(today);
				yesterday.setDate(yesterday.getDate() + parseInt(num));
				// 将日期格式化为YYYY-MM-DD格式的字符串
				let formattedDate = `${yesterday.getFullYear()}-${('0' + (yesterday.getMonth() + 1)).slice(-2)}-${('0' + yesterday.getDate()).slice(-2)}`;
				return formattedDate;
			},
			handleBack(){
				uni.showModal({
					title: '提示',
					content: '确认返回?',
					success: function (res) {
						if (res.confirm) {
							//用户点击确定;
							uni.navigateBack();
						} else if (res.cancel) {
							//用户点击取消;
						}
					}
				});
			},
		}
	}
</script>
 
<style>
	page{
		height: 100%;
	}
	
	.app-container{
		height: 100vh;
		display: flex; 
		flex-direction: column;
		overflow: hidden;
		background: white;
	}
	.scan-header{
		position: fixed;
		/* #ifndef APP-PLUS */
			top: 45px;
		/* #endif */
		/* #ifdef APP-PLUS */
			top: 80px;
		/* #endif */
		width: 100%;
		background-color: white;
		z-index: 999;
	}
	
	.scroll-Y {
		/* height: 100%; */
		/* #ifndef APP-PLUS */
			margin-top: 44px;
			height: calc(100vh - 135px); 
		/* #endif */
		/* #ifdef APP-PLUS */
			margin-top: 54px;
			height: calc(100vh - 175px); 
		/* #endif */
		
	}
	
	::v-deep .uni-forms-item{
		margin-bottom: 5px !important;
	}
	
	.detailList {
		margin-left: 4px;
		color: #333333;
		font-size: 13px;
		height: auto;
		line-height: 26px;
		width: 100vw;
	}
	
	.s-line{
		top: 0;
		right: 0;
		left: 0;
		height: 1px;
		margin-top: 5px;
		-webkit-transform: scaleY(0.5);
		transform: scaleY(0.5);
		background-color: #e5e5e5;
		z-index: 1;
	}
	
	.selected {
	  background-color: #f8edb8;
	}
	
	.uni-list-cell {
		flex-direction: column;
		// margin-top: 10px;
		// background-color: white;
		padding: 8px 12px;
	}
	
	.mxpop_scroll{
		height: calc(100vh - 125px);
		margin-top: 130px;
	}
	
	/* 按钮行 */
	.button-group {
		margin-top: 5px;
		display: flex;
		justify-content: space-around;
	}
	
</style>
