<template>
	<view class="bill-list-component">
		<view class="chooseList u-flex" v-for="(item,index) in listData" :key="item.bizSn">
			<view class="checkbox" v-show="showCheck"><u-checkbox v-model="item.checked" :name="item.bizSn" @change="checkChange" size="40" shape="circle"></u-checkbox></view>
			<view class="choose_r" @click="jumpPage('/pages/sales/salesDetail?salesBillId='+item.bizSn)" >
				<view class="u-flex u-row-between">
					<view class="billInfo u-flex">
						<text>{{item.bizDate.substr(0,10)}}</text>
						<view v-if="item.bizStatusDictValue">{{item.bizStatusDictValue}}</view>
						<view v-if="item.bizSourceTypeDictValue && item.bizSourceTypeDictValue!='自建'">{{item.bizSourceTypeDictValue}}</view>
						<view v-if="item.distributionFlag && item.distributionFlag == 1">铺货</view>	
					</view>
					<view class="billOrder">{{item.bizNo}}</view>
				</view>
				<view class="rigth_b u-flex u-row-between">
					<view>应收:¥{{toThousands(item.bizAmount||0,2)}}</view>
					<view>已收:¥{{toThousands(item.settledAmount ||0,2)}}</view>
					<view>
						待收:
						<text>¥{{toThousands(item.unsettleAmount||0,2)}}</text>
					</view>
				</view>
			</view>
		</view>
		<view v-if="listData&&listData.length==0" @click="jumpPage('/pages/test')" style="padding-top:100rpx;">
			<u-empty :src="`/static/${$config('themePath')}/def_no_data@3x.png`" icon-size="180" :text="noDataText" mode="list"></u-empty>
		</view>
	</view>
</template>

<script>
	import { toThousands } from '@/libs/tools.js'
export default {
	props: {
		list: {
			type: Array,
			default: () => {
				return [];
			}
		},
		showCheck:{
			type: Boolean,
			default:false
		}
	},
	data() {
		return {
			listData:this.list,
			noDataText:'暂无数据',
			toThousands
		};
	},
	methods: {
		setData(list){
			this.listData = list?list:[]
		},
		checkChange(e){
			const row = this.listData.find(item => item.bizSn == e.name)
			if(row){
				row.checked = !row.checked
				this.listData.splice()
			}
			// 判断是否全选
			const isAllNoChecked = this.listData.filter(item => !item.checked)
			this.$emit('allChecked',isAllNoChecked.length == 0,row)
		},
		// 获取所有数据
		getAllData(){
			return this.listData
		},
		// 全选
		allSelect(val){
			this.listData.map(item => {
				item.checked = val
			})
			this.listData.splice()
		},
		jumpPage(url){
			uni.navigateTo({
				url
			})
		}
	}
};
</script>

<style lang="scss" scoped>
.bill-list-component {
	height: 100%;
	.chooseList {
		padding: 30rpx 20rpx;
		border-bottom: 1rpx solid #e4e7ed;
		&:last-child {
			border-bottom: 0rpx solid #e4e7ed;
		}
		.checkbox {
			width: 74rpx;
		}
		.choose_r {
			flex: 1;
			.billInfo {
				text {
					font-weight: 600;
				}
				view {
					padding: 4rpx 10rpx;
					text-align: center;
					border-radius: 30rpx;
					border: 1rpx solid #e4e7ed;
					margin-left: 10rpx;
					font-size: 0.7rem;
					color: #666;
				}
			}
			.billOrder {
				font-size: 0.8rem;
				color: #666;
			}
			.rigth_b {
				color: #666;
				font-size: 0.8rem;
				margin-top: 20rpx;
				view {
					&:last-child {
						color: #333;
						text {
							color: #f0ad4e;
						}
					}
				}
			}
		}
	}
}
</style>