Vue3的el-tablle组件的搜索功能和页签功能

//这里是日期搜索
<el-form :model="historyForm" label-width="auto" style="max-width: 600px"><el-form-item label="日期："><el-date-picker @input="$forceUpdate()" v-model="valueTimeStart" type="datetime" />&nbsp;&nbsp;&nbsp;-&nbsp;&nbsp;&nbsp;<el-date-picker @input="$forceUpdate()" v-model="valueTimeEnd" type="datetime" /><el-button @click="search">搜索</el-button></el-form-item></el-form>//这里是页签
<el-pagination  :background="true" :current-page.sync="pageInfo.current" :page-size="pageInfo.size"layout="total,sizes, prev, pager, next, jumper, slot" :total="pageInfo.total" @size-change="handleSizeChange"@current-change="handleCurrentChange" style="margin-top:20px;"><el-button style="margin-left: 5px" type="primary" @click="handleCurrentChange(pageInfo.current)">跳转</el-button></el-pagination>

//这个是定义日期和默认日期的
let valueTimeStart = ref(moment(new Date()).startOf('day').format('YYYY-MM-DD HH:mm:ss'))
let valueTimeEnd = ref(moment(new Date()).endOf('day').format('YYYY-MM-DD HH:mm:ss'))let pageInfo = ref({current: 1, //当前第几页size: 10, //一页多少条total: 0 //总条数
})//下面是切换条/页数   和  当前页的改动代码
async function handleSizeChange(val) {pageInfo.value.size = valawait getData()console.log('多少条/页', val)
}async function handleCurrentChange(val) {pageInfo.value.current = valawait getData()console.log('当前页', val)
}//调接口要做的事情，要把total改一下async function getData() {startTime = moment(valueTimeStart.value).format('yyyy-MM-DD HH:mm:ss')endTime = moment(valueTimeEnd.value).format('yyyy-MM-DD HH:mm:ss')console.log('开始', startTime)console.log('结束', endTime)let res = await getPdfHistory(startTime, endTime, pageInfo.value.current, pageInfo.value.size)tableData.value = (res.data as any).datapageInfo.value.total = (res.data as any).totalDataCount}