cashier_admin_app/pagesCreateOrder/confirm-order/rotatingTables.vue

<template>
	<view style="padding: 20rpx;">
		<view class="uni-padding-wrap uni-common-mt">
			<uni-segmented-control :current="datas.current" :values=" ['转桌', '并桌']" style-type="button"
				active-color="#007aff" @clickItem="onClickItem" />
		</view>
		<view class="u-m-t-48">
			请选择其他桌：
		</view>
		<view class="uni-list">
			<radio-group @change="radioChange">
				<label class="uni-list-cell uni-list-cell-pd" v-for="(item, index) in datas.tableList" :key="index">
					<view class="u-m-t-48 u-m-b-48" v-if="item.status=='using'">
						<radio :value="item" /> {{item.name}}
					</view>
				</label>
			</radio-group>
		</view>

		<view class="uni-list" v-if="datas.current==0">
			<view class="u-m-t-48">
				请选择需要转桌的菜品：
			</view>
			<checkbox-group @change="checkboxChange">
				<label class="uni-list-cell uni-list-cell-pd" v-for="(item,index) in datas.item" :key="index">
					<view class="u-flex u-m-t-48 u-m-b-48" style="justify-content: space-between;align-items: center;">
						<view class="u-flex">
							<checkbox :value="item.id" />
							<image class="img" v-if="item.coverImg" :src="item.coverImg" mode=""></image>
							&nbsp;&nbsp;
							{{item.name}}
						</view>
						<view class="">
							<view class=" u-relative">
								<template v-if="item.isGift">
									<text class="line-th color-999">￥{{formatPrice(item.salePrice*item.number) }}</text>
									<view class="u-absolute" style="right: 0;bottom: 100%;">
										<text class="font-bold">￥0</text>
									</view>
								</template>
								<template v-else>
									<template v-if="isVip&&item.memberPrice&&item.memberPrice*1!=item.salePrice*1">
										<text
											class="line-th color-999">￥{{formatPrice(item.salePrice*item.number) }}</text>
										<view class="u-absolute" style="right: 0;bottom: 100%;">
											<text
												class="font-bold">￥{{formatPrice(item.memberPrice*item.number) }}</text>
										</view>
									</template>
									<template v-else>
										<view class="font-bold">
											<text>￥</text>
											<text class="">{{formatPrice(item.salePrice*item.number) }}</text>
										</view>
									</template>

								</template>
							</view>
							<view class="color-999 u-text-right u-font-24 u-m-t-12">×{{item.number}}</view>
						</view>
						<!-- <text class="  color-999">￥{{formatPrice(item.salePrice*item.number) }}</text> -->
					</view>
				</label>
			</checkbox-group>
		</view>

		<my-button shape="circle" @tap="confirm">确定</my-button>
	</view>
</template>

<script setup>
	import {
		reactive,
		defineProps
	} from 'vue';
	import {
		onLoad,
	} from '@dcloudio/uni-app';
	import go from '@/commons/utils/go.js';
	import {
		$table,
		tableswitch
	} from '@/http/yskApi/table.js'
	let datas = reactive({
		current: 0,
		item: "",
		// 桌台列表
		tableList: [],
		// 并桌选中
		selecttableList: '',
		// 转桌数据
		changeTable: []
	})
	const props = defineProps({
		item: {
			type: Array
		},
	})
	onLoad((opt) => {
		// console.log(JSON.parse(opt.item) ,'调试1')
		gettableList()
		datas.item = JSON.parse(opt.item)
	})

	async function confirm() {
		console.log(datas.selecttableList, 'debug')
		console.log(datas.item, 'debug2')
		// 是否选择其他桌
		if (datas.selecttableList) {
			if (datas.current == 0) {
				// 转桌是否选择菜品
				if (datas.changeTable.length) {
					let res = await tableswitch({
						masterId: datas.item[0].masterId,
						useType: datas.item[0].useType,
						cartIds: datas.changeTable,
						currentTableId: datas.item[0].tableId,
						targetTableId: datas.selecttableList.tableId
					})
					if (res) {
						go.back()
					}
				}
			} else {
				let res = await tableswitch({
					masterId: datas.item[0].masterId,
					useType: datas.item[0].useType,
					isFull: true,
					currentTableId: datas.item[0].tableId,
					targetTableId: datas.selecttableList.tableId
				})
				if (res) {
					go.back()
				}
			}
		}
	}

	function radioChange(d) {
		datas.selecttableList = d.detail.value
	}
	// 切换转/并桌
	function onClickItem(e) {
		if (datas.current !== e.currentIndex) {
			datas.current = e.currentIndex
		}
	}
	// 获取桌台
	async function gettableList() {
		const res = await $table.get({
			page: 1,
			size: 999
		})
		datas.tableList = res.content
	}

	function formatPrice(n) {
		return Number(n).toFixed(2)
	}

	function checkboxChange(e) {
		datas.changeTable = e.detail.value
	}
</script>

<style scoped lang="scss">
	.goods {
		// padding-bottom: 30rpx;
		border-bottom: 1px dashed #E5E5E5;

		.item {}
	}

	.img {
		width: 84rpx;
		height: 84rpx;
		border-radius: 8rpx 8rpx 8rpx 8rpx;
	}
</style>