You cannot select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

83 lines
1.4 KiB
Vue

<template>
<view class="myTable">
<kevyloading v-if="loading" type="bsm-loader" color="#618af8" transparent></kevyloading>
<wd-table :data="list" :border="true">
<slot></slot>
</wd-table>
<wd-pagination v-model="query.page" :total="total" :page-size="query.pageSize" @change="handleChange" show-icon
show-message />
</view>
</template>
<script setup>
import { ref } from 'vue'
import kevyloading from "@/components/kevy-loading/kevy-loading";
const props = defineProps({
apiObj: {
type: Function,
default: () => (() => { })
},
params: {
type: Object,
default: () => ({})
}
})
const query = ref({
page: 1,
pageSize: 20
})
const loading = ref(false)
const total = ref(0)
const list = ref([])
const getData = async () => {
loading.value = true
const res = await props.apiObj({
...query.value,
...props.params
})
query.value.pageSize = res.data.pageSize
total.value = res.data.total
list.value = res.data.rows
loading.value = false
}
getData()
const upData = async (upParams = {}) => {
loading.value = true
query.value.page = 1
query.value.pageSize = 20
const res = await props.apiObj({
...query.value,
...props.params,
...upParams
})
query.value.pageSize = res.data.pageSize
total.value = res.data.total
list.value = res.data.rows
loading.value = false
}
function handleChange({ value }) {
query.value.page = value
getData()
}
defineExpose({
upData
})
</script>
<style lang="scss"></style>