<template>
	<view class="warehousingDtl">
		<view class="header-banner">
			<view @click="headerNavType = 1" :class="headerNavType == 1 ? 'active' : ''">
				面料
			</view>
			<view  @click="headerNavType = 2" :class="headerNavType == 2 ? 'active' : ''">
				墨水
			</view>
		</view>
		<commons-select-time @change="timeInit" v-model="req"></commons-select-time>
		<view  v-if="headerNavType == 2">
			<view class="commons-title">
				<view class="">
					领料详情
				</view>
			</view>
			<view style="margin: 0 30rpx;font-size: 12rpx;">
				<uni-table border stripe emptyText="暂无更多数据">
					<!-- 表头行 -->
					<uni-tr>
						<uni-th width="90rpx" align="left"></uni-th>
						<uni-th width="150rpx" align="left">件</uni-th>
						<uni-th width="150rpx" align="left">公斤</uni-th>
						<uni-th width="150rpx" align="left">金额</uni-th>
					</uni-tr>
					<!-- 表格数据行 -->
					<uni-tr>
						<uni-td><view class="pa-bg-2">合计</view>1</uni-td>
						<uni-td><view class="pa-bg-2">{{selectInkEWDetailsData.total}}</view></uni-td>
						<uni-td><view class="pa-bg-2">{{selectInkEWDetailsData.amountQuantity}}</view></uni-td>
						<uni-td><view class="pa-bg-2">{{selectInkEWDetailsData.amountTotal}}</view></uni-td>
					</uni-tr>
					<uni-tr v-for="(i,index) in selectInkEWDetailsData.details" :key="index">
						<uni-td>{{i.nickName}}</uni-td>
						<uni-td>{{i.count}}</uni-td>
						<uni-td>{{i.changeNum}}</uni-td>
						<uni-td>{{i.amount}}</uni-td>
					</uni-tr>
				</uni-table>
			</view>
		</view>
		<view v-if="headerNavType == 1">
			<view class="commons-title">
				<view class="">
					领料详情
				</view>
				<view>
					<uni-data-checkbox v-model="companyType" :localdata="companyList" />
				</view>
			</view>
			<view style="margin: 0 30rpx;font-size: 24rpx;">
				<uni-table border stripe emptyText="暂无更多数据" >
					<!-- 表头行 -->
					<uni-tr>
						<uni-th width="90rpx" align="left"></uni-th>
						<uni-th  v-if="companyType == 3" width="150rpx" align="left">排班</uni-th>
						<uni-th width="150rpx" align="left">领料</uni-th>
						<uni-th v-if="companyType == 3" width="150rpx" align="left">产出比</uni-th>
					</uni-tr>
					<uni-tr v-for="(i,index) in totalData" :key="index">
						<uni-td>
							<view :class="i.type == 1 ? 'pa-bg-2' : i.type == 2 ? 'pa-bg' : 'pa-bg-3'">{{i.realName}}</view>
							<span v-if="i.type == 1 || i.type == 2">1</span>
						</uni-td>
						<uni-td  v-if="companyType == 3">
							<view :class="i.type == 1 ? 'pa-bg-2' : i.type == 2 ? 'pa-bg' : 'pa-bg-3'">{{companyType == 3? i.planArea*1 : '-'}}</view>
						</uni-td>
						<uni-td v-if="companyType == 1">
							<view :class="i.type == 1 ? 'pa-bg-2' : i.type == 2 ? 'pa-bg' : ''">{{i.pcs}}</view>
						</uni-td>
						<uni-th v-if="companyType == 0" align="left">
							<view :class="i.type == 1 ? 'pa-bg-2' : i.type == 2 ? 'pa-bg' : ''">{{i.amount}}</view>
						</uni-th>
						<uni-th v-if="companyType == 2" align="left">
							<view :class="i.type == 1 ? 'pa-bg-2' : i.type == 2 ? 'pa-bg' : ''">{{i.quantity}}</view>
						</uni-th>
						<uni-td v-if="companyType == 3">
							<view :class="i.type == 1 ? 'pa-bg-2' : i.type == 2 ? 'pa-bg' : ''">{{i.area}}</view>
						</uni-td>
						<uni-td v-if="companyType == 3">
							<view :class="i.type == 1 ? 'pa-bg-2' : i.type == 2 ? 'pa-bg' : ''">{{i.outputRatio * 1}}%</view>
						</uni-td>
					</uni-tr>
					<!-- <uni-tr v-for="(i,index) in totalData" :key="index">
						<uni-td>{{i.realName}}</uni-td>
						<uni-td>{{i.pcs}}</uni-td>
						<uni-td>{{i.quantity}}</uni-td>
						<uni-td>{{i.planArea}}</uni-td>
						<uni-td>{{i.outputRatio}}%</uni-td>
					</uni-tr> -->
				</uni-table>
			</view>
		</view>
	</view>
</template>

<script>
	import commonsSelectTime from '../../components/commons-select-time/index.vue'
	import {
	    getInfo
	} from "@/util/api.js";
	export default {
		components:{
			commonsSelectTime
		},
		data() {
			return {
				companyType:3,
				companyList:[
					{
						text:"金额",
						value:0
					},
					{
						text:"件",
						value:1
					},
					{
						text:"米",
						value:2
					},
					{
						text:"平方",
						value:3
					},
				],
				warehouseList:[{
					text:"全部",
					value:'0'
				},
				{
					text:"一楼",
					value:'1'
				},{
					text:"四楼",
					value:'2'
				}],
				req:{
					type: 0,
					time: [],
					beginTime: null,
					endTime: null,
				},
				headerNavType:1,
				totalData:[],
				selectInkEWDetailsData:[],
				
			}
		},
		onLoad(option) {
			console.log(option.type)
			if(option.type == 2){
				this.headerNavType = 2
			}
			const v = this
			v.timeInit()
		},
		methods: {
			timeInit(){
				const v = this
				v.getSelectInkEWDetails()
				v.getSelectFabricWDetails()
			},
			toRouter(url){
				
				uni.navigateTo({
					url: '/pages' + url
				})
			},
			getSelectFabricWDetails(){
				const v = this
				v.$post('/applet/selectFabricEWDetails',{type:v.req.type,beginTime:v.req.beginTime,endTime:v.req.endTime}).then(res=>{
					v.totalData = res.data
					console.log(v.totalData)
				})
			},
			getSelectInkEWDetails(){
				const v = this
				v.$post('/applet/selectInkEWDetails',v.req).then(res=>{
					v.selectInkEWDetailsData = res.data
				})
			},
			
			
			
		},
	}
</script>

<style lang="less">
	
	.uni-data-checklist{
		margin-top: 10rpx;
		padding:16rpx 10rpx;
	}
	.uni-table-td{
		font-size: 24rpx!important;
	}
	.uni-data-checklist .checklist-group .checklist-box{
		margin-right: 20rpx!important;
	}
	.warehousingDtl {
		background-color: #f1f1f1;
		min-height: 100vh;
		color: #333;
		.header-banner {
			display: flex;
			justify-content: center;
			border-bottom: 1px solid #dcdcdc;
			
			view {
				width: 40%;
				text-align: center;
				height: 100rpx;
				line-height: 100rpx;
				color: #333;
				margin: 0 5%;
			}

			.active {
				color: #487CFF;
				border-bottom: 2px solid #487CFF;
			}
		}

		
	}
</style>
