<template>
	<view class="sales-list-component">
		<scroll-view class="sales-list-con" :style="{height: scrollH+'upx'}" scroll-y @scrolltolower="onreachBottom">
			<view class="sales-list-main">
				<view class="sales-list-item" v-for="(item, index) in listData" :key="item.id" @click="getDetail(item)">
					<view class="list-item-tit">
						<u-section :title="item.buyerName" :sub-title="item.billStatusDictValue" :line-color="$config('primaryColor')"></u-section>
					</view>
					<view class="list-item-con">
						<view class="list-item-line flex align_center justify_between">
							<view>
								<view style="display: inline-block;margin-right: 6upx;">{{item.salesBillNo}}</view>
								<u-tag v-if="item.oosFlag==1" text="急件" :bg-color="$config('errorColor')" mode="dark" shape="circle" size="mini" style="margin-right: 6upx;vertical-align: text-top;" />
								<u-tag v-if="item.salesBillSourceDictValue" :text="item.salesBillSourceDictValue" :bg-color="$config('primaryColor')" mode="dark" shape="circle" size="mini" style="vertical-align: text-top;" />
							</view>
							<view class="color_6 font_13">{{item.createDate || '--'}}</view>
						</view>
						<view class="list-item-line flex align_center justify_between">
							<view>总款数:<text>{{toThousands(item.totalCategory||0)}}</text></view>
							<view>总数量:<text>{{toThousands(item.totalQty||0)}}</text></view>
							<view>总售价:<text>¥{{toThousands(item.totalAmount||0, 2)}}</text></view>
						</view>
						<view class="list-item-line flex align_center justify_between">
							<view class="flex_1">财务状态:<text>{{item.financialStatusDictValue||'--'}}</text></view>
							<view class="flex_1">收款方式:<text>{{item.settleStyleEntity&&item.settleStyleEntity.name||'--'}}</text></view>
						</view>
					</view>
					<!-- <view class="button-box">
						<u-button @click="handleFun('audit', item)" size="mini" :hair-line="false" shape="circle" plain type="primary" hover-class="none" v-if="item.billStatus == 'WAIT_AUDIT'">审核</u-button>
						<u-button @click="handleFun('out', item)" size="mini" :hair-line="false" shape="circle" plain type="primary" hover-class="none" v-if="item.billStatus == 'WAIT_OUT_WAREHOUSE'">出库</u-button>
						<u-button @click="handleEdit(item)" size="mini" :hair-line="false" shape="circle" plain type="primary" hover-class="none" v-if="(item.salesBillSource == 'SATELLITE' || item.salesBillSource == 'SALES' || item.salesBillSource == 'TEMPORARY_DISPATCHING') && (item.billStatus == 'WAIT_AUDIT' || item.billStatus == 'WAIT_SUBMIT' || item.billStatus == 'AUDIT_REJECT')">编辑</u-button>
						<u-button @click="handleFun('del', item)" size="mini" :hair-line="false" shape="circle" plain type="error" hover-class="none" v-if="((item.salesBillSource == 'SATELLITE' || item.salesBillSource == 'SALES' || item.salesBillSource == 'TEMPORARY_DISPATCHING') && item.billStatus != 'FINISH')">删除</u-button>
						<u-button @click="handleEdit(item)" size="mini" :hair-line="false" shape="circle" plain type="primary" hover-class="none" v-if="item.salesBillSource == 'PURCHASE' && (item.billStatus == 'WAIT_AUDIT' || item.billStatus == 'SUPERIOR_CHANGE')">改单</u-button>
						<u-button @click="handleFun('cancel', item)" size="mini" :hair-line="false" shape="circle" plain type="primary" hover-class="none" v-if="item.salesBillSource == 'PURCHASE' && (item.billStatus == 'WAIT_AUDIT' || item.billStatus == 'SUPERIOR_CHANGE')">取消</u-button>
					</view> -->
				</view>
				<view v-if="listData && listData.length == 0">
					<u-empty :text="noDataText" mode="list" :img-width="200" :margin-top="30"></u-empty>
				</view>
				<view style="padding-bottom: 20upx;">
					<u-loadmore v-if="totalNum>listData.length || status=='loading'" :status="status" />
				</view>
			</view>
		</scroll-view>
		<!-- 审核弹框 -->
		<common-modal :openModal="auditModal" content="请点击下方按钮确认操作" confirmText="审核通过" cancelText="审核不通过" :isClose="true" @confirm="handleAudit('WAIT_OUT_WAREHOUSE')" @cancel="handleAudit('AUDIT_REJECT')" @close="auditModal=false" />
		<!-- 出库弹框 -->
		<common-modal :openModal="outModal" content="确认要出库吗?" @confirm="handleOut" @close="outModal=false" />
		<!-- 删除/取消弹框 -->
		<common-modal :openModal="delModal" :content="delText" @confirm="handleDel" @close="delModal=false" />
	</view>
</template>

<script>
	import commonModal from '@/pages/common/commonModal.vue'
	import { toThousands } from '@/libs/tools'
	import copyText from '@/pages/common/copyText.vue'
	import { salesList, salesWriteAudit, salesWriteStockOut, salesDel } from '@/api/sales'
	export default{
		components: { commonModal, copyText },
		props: {
			height: {  // 非滚动区域高度   upx
				type: String || Number,
				default: 300
			},
			params: {  // 列表查询条件
				type: Object,
				default: () => {
					return {}
				}
			}
		},
		data(){
			return{
				listData: [],
				pageNo: 1,
				pageSize: 10,
				totalNum: 0,
				status: 'loadmore',
				noDataText: '暂无数据',
				toThousands,
				auditModal: false,  // 审核弹框
				dataInfo: null,
				outModal: false,  // 出库弹框
				delModal: false,  // 删除/取消弹框
				delText: '确认要删除吗?',
				scrollH: 300
			}
		},
		mounted() {
			const _this = this
			uni.getSystemInfo({
				success: function (res) {
					const winH = res.windowHeight * 2
					_this.scrollH = winH - _this.height - 85
				}
			})
			this.getList()
		},
		methods:{
			// 列表
			getList(pageNo){
				const _this = this
				if (pageNo) {
					this.pageNo = pageNo
				}
				let params = {
					pageNo: this.pageNo,
					pageSize: this.pageSize
				}
				this.status = "loading"
				salesList(Object.assign(params, this.params)).then(res => {
					if (res.status == 200) {
						if(this.pageNo>1){
							this.listData = this.listData.concat(res.data.list || [])
						}else{
							this.listData = res.data.list || []
						}
						this.totalNum = res.data.count || 0
					} else {
						this.listData = []
						this.totalNum = 0
						this.noDataText = res.message
					}
					this.status = "loadmore"
				})
			},
			// scroll-view到底部加载更多
			onreachBottom() {
				if(this.listData.length < this.totalNum){
					this.pageNo += 1
					this.getList()
				}
			},
			// 查看详情
			getDetail(data){
				uni.navigateTo({ url: '/pages/sales/edit?pageType=detail&data='+JSON.stringify(data) })
			},
			// 编辑
			handleEdit(data){
				uni.navigateTo({ url: '/pages/sales/edit?pageType=edit&data='+JSON.stringify(data) })
			},
			// 操作
			handleFun(type, data){
				this.dataInfo = data
				if(type == 'audit'){  // 审核
					this.auditModal = true
				}else if(type == 'out'){  // 出库
					this.outModal = true
				}else if(type == 'del'){  // 删除
					this.delText = '确认要删除吗?'
					this.delModal = true
				}else if(type == 'cancel'){  // 取消
					this.delText = '确认要取消吗?'
					this.delModal = true
				}
			},
			// 审核通过或不通过
			handleAudit(billStatus){
				salesWriteAudit({
					id: this.dataInfo.id,
					billStatus: billStatus
				}).then(res => {
					if (res.status == 200) {
						this.toashMsg(res.message)
						this.getList(1)
						this.auditModal = false
					} else {
						this.auditModal = false
					}
				})
			},
			// 出库
			handleOut(){
				salesWriteStockOut({ salesBillSn: this.dataInfo.salesBillSn }).then(res => {
					if (res.status == 200) {
						this.toashMsg(res.message)
						this.getList(1)
						this.outModal = false
					} else {
						this.outModal = false
					}
				})
			},
			// 删除
			handleDel(){
				salesDel({ id: this.dataInfo.id }).then(res => {
					if (res.status == 200) {
						this.toashMsg(res.message)
						this.getList(1)
						this.delModal = false
					} else {
						this.delModal = false
					}
				})
			}
		}
	}
</script>

<style lang="scss">
	.sales-list-component{
		.color_6{
			color: #666;
		}
		.font_13{
			font-size: 26upx;
		}
		.sales-list-con{
			.sales-list-main{
				.sales-list-item{
					background: #ffffff;
					padding: 20upx;
					margin-bottom: 25upx;
					border-radius: 25upx;
					box-shadow: 1px 1px 3px #EEEEEE;
					.list-item-tit{
						padding-bottom: 18upx;
						padding-top: 10upx;
						border-bottom: 1px solid #e4e7ed;
						white-space: nowrap;
						overflow: hidden;
						text-overflow: ellipsis;
						.u-line{
							display: inline-block;
							width: 8upx;
							height: 40upx;
							background-color: red;
							vertical-align: bottom;
							margin: 0 20upx 0 10upx;
						}
					}
					.list-item-con{
						padding: 10upx 0;
						.list-item-line{
							padding: 8upx 0;
						}
						text{
							color: #666;
						}
					}
					.button-box{
						text-align: right;
						button{
							margin: 0 10upx;
						}
					}
				}
			}
		}
	}
</style>