<template>
    <view class="common-page" style="padding: 0;" @click="playGlobalSound">
        <PageScroll requestStr="/app/orderinfo/getOrderListByUserInfo" @updateList="updateList" ref="scrollRef"
            :otherParams="otherParams" :immediate="false">
            <u-sticky :customNavHeight="0">
                <view class="search-area">
                    <u-search placeholder="请输入发件人姓名或电话" :searchIconSize="18" bgColor="#f6f7f6" @search="handleSearch"
                        v-model="otherParams.search" custom-style="font-size:32rpx" placeholder-style="font-size:32rpx"
                        :clearabled="true" :focus="false" :showAction="false" :height="36"></u-search>
                </view>
            </u-sticky>

            <view class="list-con" v-if="dataList.length">
                <OrderItem v-for="cell in dataList" :key="cell.id" :item="cell" class="mt-20">
                </OrderItem>
            </view>
        </PageScroll>
    </view>
</template>

<script setup>
import {
    reactive
} from 'vue';
import PageScroll from '@/components/pageScroll/index.vue'
import OrderItem from '@/pages/my/components/orderItem.vue';
import {
    ref
} from 'vue';
import {
    onLoad
} from '@dcloudio/uni-app'

//点击全局音效
function playGlobalSound(){
    uni.$u.playClickSound()
}

const otherParams = ref({
    search: '',
})
const scrollRef = ref(null)
const refreshList = () => {
    scrollRef.value?.resetUpScroll()
}

let dataList = ref([])
const updateList = (data, page) => {
    dataList.value = data

    if (!isSearch.value) return 
    if (data.length > 0) {
        uni.$u.ttsModule.speak('查询到' + data.length + '条数据')
    } else {
        uni.$u.ttsModule.speak('未查询到数据')
    }
    isSearch.value = false
}
const isSearch = ref(false)
const handleSearch = () => {
    isSearch.value = true
    refreshList()
}
</script>
<style lang="scss">
.search-area {
    padding: 24rpx;
    background-color: #ffffff;
    z-index: 9;
}
</style>