<template>
	<u-mask class="orderInfoModal" :show="isShow" :mask-click-able="false">
		<view class="order-info-con">
			<view class="order-info-main">
				<view>
					<text class="info-item-tit">销售单号：</text>
					<text class="info-item-txt">{{infoData && infoData.salesBillNo || '--'}}</text>
				</view>
				<view>
					<text class="info-item-tit">客户名称：</text>
					<text class="info-item-txt">{{infoData && infoData.buyerName || '--'}}</text>
				</view>
				<view>
					<text class="info-item-tit">客户地址：</text>
					<text class="info-item-txt" v-if="infoData && (infoData.shippingAddressProvinceName || infoData.shippingAddressCityName || infoData.shippingAddressCountyName || infoData.shippingAddress)">
						{{infoData.shippingAddressProvinceName || ''}}{{infoData.shippingAddressCityName || ''}}{{infoData.shippingAddressCountyName || ''}}{{infoData.shippingAddress || ''}}
					</text>
					<text class="info-item-txt" v-else>--</text>
				</view>
				<view>
					<text class="info-item-tit">联系电话：</text>
					<text class="info-item-txt">{{infoData && infoData.consigneeTel || '--'}}</text>
				</view>
				<view>
					<text class="info-item-tit">收款方式：</text>
					<text class="info-item-txt">{{infoData && infoData.settleStyleSnDictValue || '--'}}</text>
				</view>
				<view>
					<text class="info-item-tit">制单人：</text>
					<text class="info-item-txt">{{infoData && infoData.operatorName || '--'}}</text>
				</view>
				<view>
					<text class="info-item-tit">业务员：</text>
					<text class="info-item-txt">{{infoData && infoData.salesManName || '--'}}</text>
				</view>
				<view>
					<text class="info-item-tit">来源：</text>
					<text class="info-item-txt">{{infoData && infoData.salesBillSourceDictValue || '--'}}</text>
				</view>
				<view>
					<text class="info-item-tit">业务状态：</text>
					<text class="info-item-txt">{{infoData && infoData.billStatusDictValue || '--'}}</text>
				</view>
				<view>
					<text class="info-item-tit">财务状态：</text>
					<text class="info-item-txt">{{infoData && infoData.financialStatusDictValue || '--'}}</text>
				</view>
				<view>
					<text class="info-item-tit">备注：</text>
					<text class="info-item-txt">{{infoData && infoData.remarks || '--'}}</text>
				</view>
			</view>
			<view class="order-info-footer">
				<view class="button-cancel" @click="isShow=false">关闭</view>
			</view>
		</view>
	</u-mask>
</template>

<script>
	export default {
		props: {
			openModal: { //  弹框显示状态
				type: Boolean,
				default: false
			},
			infoData: {
				tyoe: Object,
				default: ()=>{
					return null
				}
			}
		},
		data() {
			return {
				isShow: this.openModal, //  是否打开弹框
			}
		},
		methods: {},
		watch: {
			//  父页面传过来的弹框状态
			openModal (newValue, oldValue) {
				this.isShow = newValue
			},
			//  重定义的弹框状态
			isShow (newValue, oldValue) {
			  if (!newValue) {
			    this.$emit('close')
			  }
			}
		}
	}
</script>

<style lang="scss" scoped>
	.orderInfoModal{
		width: 100%;
		height: 100%;
		.order-info-con{
			width: 78%;
			margin: 30% auto 0;
			background-color: #fff;
			border-radius: 24upx;
			.order-info-main{
				padding: 20upx 20upx;
				>view{
					padding: 10upx 0;
					border-bottom: 1upx solid #e4e7ed;
					.info-item-tit{
						color: #666;
						display: inline-block;
					}
				}
			}
			.order-info-footer{
				text-align: center;
				padding-bottom: 20upx;
			}
		}
	}
</style>
