<template>
	<div style="height:100%;">
		<div class="searchForm-header">
			<el-row>
				<el-form  label-width="100px" inline="">
					<el-form-item label="查询日期">
						 <el-date-picker
					      v-model="queryDate"
					      type="daterange"
					      size="small"
					      range-separator="至"
					      start-placeholder="开始日期"
					      end-placeholder="结束日期">
					    </el-date-picker>
					</el-form-item>
					<el-form-item label="">
						<el-button @click="handleSearch" size="small"  type="primary">查询</el-button>	
					</el-form-item>
					<el-form-item label="" style="">
							<el-upload class="upload-demo" action="" 
								 ref="upload" :limit="1" accept="application/vnd.openxmlformats-officedocument.spreadsheetml.sheet,application/vnd.ms-excel"
								 :auto-upload="false"  >
								 <el-button plain slot="trigger"  type="success" v-show="false" style= "margin-left: 5px" size="small">询单导入</el-button>
								<el-button   type="success" @click="handleExport" style="margin-left: 2px" size="small">导出记录</el-button>
							</el-upload>
					</el-form-item>
				</el-form>
			</el-row>
		</div>
		<div class="tabledata-grid">
			<el-table :data="tableData"  
					  lazy
					  :load="load" 
					  :tree-props="{children: 'children', hasChildren: 'hasChildren'}" 
					  v-loading="loading" 
					  height="100%" 
					  border 
					  row-key="id"
					  style="width: 97%;" >

				
				<el-table-column prop="id" label="ID" v-if="false" show-overflow-tooltip width="300px">
				</el-table-column>
				<el-table-column prop="customerName" label="客户名称" show-overflow-tooltip width="300px">
				</el-table-column>
				<el-table-column prop="prodNm" label="材料类型" width="100px" show-overflow-tooltip align="center">
				</el-table-column>
				<el-table-column prop="ordNo" label="订单号" width="200px" show-overflow-tooltip align="center">
				</el-table-column>
				<el-table-column prop="weight" label="出库重量" width="140px" show-overflow-tooltip align="center">
				</el-table-column>
				<el-table-column prop="price" label="价格" width="140px" show-overflow-tooltip align="center">
				</el-table-column>
			</el-table>
		</div>
	</div>
</template>

<script>
	import axios from '@/axios'
	import Export2Excel from '../../excel/Export2Excel.js'
	export default {
		components: {
			
		},
		data() {
			return {
				reduceUnitPrice: 0,
				reduceDialogVisible: false,
				loading: false,
				tableData: [],
				multipleSelection: [],
				
				invoiceCompany:'',
				queryDate:[]
			};
		},
		mounted() {

		},
		methods: {
			
			handleSearch() {
				this.getTableData()
			},
			getTableData() {
				this.loading = true
				var url = 'FinanceAccountDetail/queryRcvMoney.do'
				if(this.queryDate == null){
					this.queryDate = [false,false];
				}
				var param = {
					fromDate:(!this.queryDate[0]) ? "1970-01-01" : this.queryDate[0].Format("yyyy-MM-dd"),		//date类型
					toDate  :(!this.queryDate[1]) ? new Date().Format("yyyy-MM-dd") :this.queryDate[1].Format("yyyy-MM-dd"),
				}
				axios.get(url, param).then(response => {
					// alert(JSON.stringify(response))
					if (response.data.code == 0) {
						this.tableData = response.data.data
						for(var i = 0 ;i < this.tableData.length;i++){
							this.tableData[i]["hasChildren"] = true;
 						}
						this.totalRows = response.data.data.total
					} else {
						this.$message({
							type: 'error',
							message: '操作失败；' + response.data.msg,
						});
					}
					this.loading = false
				});

			},

			showReduce() {
				if (this.multipleSelection.length < 1) {
					this.$message({
						type: 'error',
						message: '至少选择一条记录！',
					});
					return
				}
				this.reduceDialogVisible = true
			},
			
			
			load(tree, treeNode, resolve){
				var customerName = tree.customerName;
				var url = 'FinanceAccountDetail/queryRcvMoneyBycustomer.do'
				if(this.queryDate == null){
					this.queryDate = [false,false];
				}
				var param = {
					customerName: customerName,
					fromDate:(!this.queryDate[0]) ? "1970-01-01" : this.queryDate[0].Format("yyyy-MM-dd"),		//date类型
					toDate  :(!this.queryDate[1]) ? new Date().Format("yyyy-MM-dd") :this.queryDate[1].Format("yyyy-MM-dd"),
				}
				axios.get(url, param).then(response => {
					if (response.data.code == 0) {
						  resolve(
				            response.data.data
				          )
					} else {
						this.$message({
							type: 'error',
							message: '操作失败；' + response.data.msg,
						});
					}
					this.loading = false
				});
			},
			handleExport(){
				// var imptData = [];
				// var url = 'FinanceAccountDetail/queryBycustomer.do'
				// var param = {
				// 	customerName: this.query.customerName,
				// 	accountFlag: this.query.accountFlag
				// }


				// axios.get(url, param).then(response => {
				// 	if (response.data.code == 0) {
				// 		var imptData = response.data.data;
				// 		if (imptData.length == 0) {
				// 			this.$alert('无法导出，选择条件无记录', '提示', {
				// 				confirmButtonText: '确定',
				// 				callback: action => {}
				// 			});
				// 		} else {

				// 			this.exportExcel(imptData)
				// 		}
				// 	} else {
				// 		this.$message({
				// 			type: 'error',
				// 			message: '操作失败；' + response.data.msg,
				// 		});
				// 	}

				// });
			},
			exportExcel(imptData) {
				// alert(JSON.stringify(imptData))
				// const header = ["客户名称"
				// 				,"结算类型"
				// 				,"货权转移次数"
				// 				,"仓储单价"
				// 				,"仓储价格"
				// 				,"过磅单价"
				// 				,"过磅价格"
				// 				,"优惠单价"
				// 				,"优惠价格"
				// 				,"总价"
				// 				,"结算标记"
				// 				,"仓库名称"
				// 				,"垛位"
				// 				,"层号"
				// 				,"品名"
				// 				,"规格型号"
				// 				,"钢种"
				// 				,"数量"
				// 				,"重量"
				// 				,"过磅重量"
				// 				,"钢板号"
				// 				,"收货地址"
				// 				,"备注"
				// 				,"操作人"
				// 				,"操作时间"
				// ] // 导出的表头名
				// const filterVal = [
				// 		"customerName"
				// 		,"recordType"
				// 		,"changeTime"
				// 		,"storageUnitPrice"
				// 		,"storagePrice"
				// 		,"weightUnitPrice"
				// 		,"weightPrice"
				// 		,"reduceUnitPrice"
				// 		,"reducePrice"
				// 		,"totalPrice"
				// 		,"accountFlag"
				// 		,"wareName"
				// 		,"stackName"
				// 		,"layer"
				// 		,"materialName"
				// 		,"model"
				// 		,"standard"
				// 		,"count"
				// 		,"weight"
				// 		,"suttle"
				// 		,"plateNo"
				// 		,"receiveAddress"
				// 		,"remark"
				// 		,"addUser"
				// 		,"addTime"
				// ]

				// for(var i=0;i<imptData.length;i++){
				// 	imptData[i]["addUserUserDesc"] = imptData[i].addUser.userDesc;
				// }
				// const list = imptData
				// const data = this.formatJson(filterVal, list)

				// const filename = '结算单' + (new Date()).toLocaleDateString();
				// Export2Excel.export_json_to_excel({
				// 	header,
				// 	data,
				// 	filename
				// })
			},
			formatJson(filterVal, jsonData) {
				return jsonData.map(v => filterVal.map(j => {
					return v[j]
				}))
			}
		},
	}
</script>

<style>
.searchForm-header{
		height: auto;
		margin-left: 10px;
	}
	.tabledata-grid{
		font-size: 20px;
		margin-left: 5px;
		height: calc(100% - 80px);

	}
</style>
