<template>
	<view class="container">

		<!-- 底部按钮 -->
		<view class="footer">
			<!-- 查询区域 -->
			<view class="query-section">
				<u-radio-group v-model="form.searchType">
					<u-radio label="查订单" name="1" label-size="17" />
					<u-radio label="查物流" custom-style="margin-left:20px" name="2" label-size="17" />
				</u-radio-group>

				<view class="search-box">
					<u-input custom-style="width:100rpx" v-model="form.search" :placeholder="form.searchType == '1' ? '扫描/输入订单编号' : '扫描/输入物流单号'" border="surround"
						clearable placeholder-style="font-size:32rpx" :custom-style="{ 'font-size': '32rpx' }">
					</u-input>
					<u-button color="#c8c8c8" text="查询" @click="handleSearch" />
				</view>
			</view>

			<u-divider></u-divider>

			<view style="display: flex;">
				<u-button size="large" type="success" text="扫码" @click="handleScan" />
			</view>
		</view>
	</view>
</template>

<script setup>
	import {
		ref
	} from 'vue';
	import {
		onLoad
	} from '@dcloudio/uni-app'

	const form = ref({
		searchType: '2',
		search: ''
	});

	// 处理查询
	const handleSearch = () => {
		console.log('查询:', form.value.search);
		// TODO: 查询订单
		uni.$u.http.get('/app/orderinfo/getOrderInfoForCheck', {
			params: {
				...form.value
			}
		}).then(res => {
			if (res.code == 200) {
				uni.setStorageSync('orderDetail', res.data)
				uni.navigateTo({
					url: `/pages/index/detail/index?id=${res.data.orderId}`
				})
			} else {
				if (res.code == 500) {
					let text = form.value.search + '订单不存在'
					uni.$u.ttsModule.speak(text)
				} else {
					uni.$u.toast(res.msg)
					uni.$u.ttsModule.speak(res.msg)
				}
			}
		})
	};

	// 处理扫码
	const handleScan = () => {
		uni.scanCode({
			success: (res) => {
				form.value.search = res.result;
				handleSearch();
			}
		});
	}


	onLoad(() => {
		// #ifdef APP-PLUS
		uni.$u.useGlobalEvent((e) => {
			form.value.search = e.barcode
			handleSearch()
		})
		// #endif
	})
</script>

<style lang="scss" scoped>
	@import '../components/common.scss';
</style>