<template>
	<view class="flex-col justify-start relative page">
	  <view class="section"></view>
	  <view class="flex-col justify-start section_2 pos">
	    <view class="flex-row section_3" style="display: flex; align-items: center;">
	      <image
	        class="image"
	        src="https://ide.code.fun/api/image?token=67cf80c84ae84d001228feb1&name=4ff44c6bdf30d5c8585ab27127ca096f.png"
	      />
	      <input confirm-type="search" @confirm="search" class="ml-7" placeholder="搜索订单" style="width: 100%;" v-model="orderNumber"/>
	    </view>
	  </view>
	</view>
</template>

<script setup>
	import {ref} from 'vue'
	const orderNumber = ref('')
	const search = () => {
		if (orderNumber.value === null || orderNumber.value === undefined || orderNumber.value === '') {
			uni.showToast({
				title: '请输入订单号',
				icon: 'error'
			})
			return ;
		}
		uni.redirectTo({
			url: '../myOrderList/myOrderList?orderNumber=' + orderNumber.value
		})
	}
</script>

<style scoped lang="scss">
.ml-7 {
  margin-left: 13.13rpx;
}
.page {
  background-color: #ffffff;
  background-image: url('https://ide.code.fun/api/image?token=67cf80c84ae84d001228feb1&name=98c27c9593262699d4de87045e9a792c.png');
  background-size: 100% 100%;
  background-repeat: no-repeat;
  width: 100%;
  overflow-y: auto;
  overflow-x: hidden;
  height: 100%;
}
.section {
  background-image: url('https://ide.code.fun/api/image?token=67cf80c84ae84d001228feb1&name=98c27c9593262699d4de87045e9a792c.png');
  background-size: 100% 100%;
  background-repeat: no-repeat;
  width: 750rpx;
  height: 1571.25rpx;
}
.section_2 {
  padding: 33.75rpx 0 35.63rpx;
  background-color: #ffffff;
  box-shadow: 0rpx 3.75rpx 3.75rpx #00000040;
}
.pos {
  position: fixed;
  left: 0;
  right: 0;
  top: 0;
}
.section_3 {
  margin-left: 35.63rpx;
  margin-right: 35.63rpx;
  padding: 18.75rpx 24.38rpx;
  background-color: #f3f3f3;
  border-radius: 75rpx;
}
.image {
  width: 28.13rpx;
  height: 28.13rpx;
}
@import url(../../../common/css/global.css);
</style>
