<template>
	<view class="default-box-padding bg-fff border-r-12 u-m-t-20">
		<view class="u-flex u-row-between">
			<view>订单状态</view>
			<view>{{returnStatus(data.status)}}</view>
		</view>
		<view class="u-flex u-row-between u-m-t-20">
			<view>订单类型</view>
			<view>{{returnUseType(data.useType)}}</view>
		</view>
		<view class="u-flex u-row-between u-m-t-20">
			<view>桌位号</view>
			<view>{{table.name||data.tableName}}</view>
		</view>
		<view class="u-flex u-row-between u-m-t-20">
			<view>就餐人数</view>
			<view>{{seatFee.number||''}}</view>
		</view>
		<view class="u-flex u-row-between u-m-t-20">
			<view>支付方式</view>
			<view>{{data.payType||''}}</view>
		</view>
		<view class="u-flex u-row-between u-m-t-20">
			<view>预约时间</view>
			<view></view>
		</view>
		<view class="u-flex u-row-between u-m-t-20">
			<view>下单时间</view>
			<view><up-text v-if="data.createdAt" mode="date" :text="data.createdAt"></up-text></view>
		</view>
		<view class="u-flex u-row-between u-m-t-20">
			<view>订单编号</view>
			<view>{{data.orderNo}}</view>
		</view>
		<view class="u-flex u-row-between u-m-t-20">
			<view>商家备注</view>
			<my-button plain shape="circle" :width="160" :height="60">编辑</my-button>
		</view>
	</view>
</template>

<script setup>
	import orderEnum from '@/commons/orderEnum.js'
	const props = defineProps({
		data: {
			type: Object,
			default: () => {}
		},
		table: {
			type: Object,
			default: () => {}
		},
		seatFee: {
			type: Object,
			default: () => {
				totalNumber: 0
			}
		}
	})

	function returnStatus(status) {
		const item = orderEnum.status.find(v => v.key == status)
		return item ? item.label : ''
	}

	function returnUseType(useType) {
		if (!useType) {
			return ''
		}
		return useType == "takeout" ? '堂食' : '自取';
	}
</script>

<style lang="scss" scoped>
</style>