41 lines
		
	
	
		
			1012 B
		
	
	
	
		
			Vue
		
	
	
			
		
		
	
	
			41 lines
		
	
	
		
			1012 B
		
	
	
	
		
			Vue
		
	
	
| <template>
 | |
|   <el-pagination
 | |
|     size="small"
 | |
|     :current-page="pagination.currentPage || 1"
 | |
|     :page-size="pagination.pageSize || 10"
 | |
|     layout="total, sizes, prev, pager, next, jumper"
 | |
|     :total="pagination.total || 0"
 | |
|     @update:current-page="handleCurrentChange"
 | |
|     @update:page-size="handleSizeChange"
 | |
|   />
 | |
| </template>
 | |
| 
 | |
| <script setup>
 | |
| import { ElPagination } from "element-plus";
 | |
| import "element-plus/es/components/pagination/style/css";
 | |
| 
 | |
| defineOptions({
 | |
|   name: "AppPagination",
 | |
| });
 | |
| const emits = defineEmits(["get-data"]);
 | |
| const pagination = defineModel("pagination", { type: Object, required: true });
 | |
| const handleCurrentChange = (val) => {
 | |
|   pagination.value = {
 | |
|     currentPage: val,
 | |
|     pageSize: pagination.value.pageSize,
 | |
|     total: pagination.value.total,
 | |
|   };
 | |
|   emits("get-data");
 | |
| };
 | |
| const handleSizeChange = (val) => {
 | |
|   pagination.value = {
 | |
|     currentPage: 1,
 | |
|     pageSize: val,
 | |
|     total: pagination.value.total,
 | |
|   };
 | |
|   emits("get-data");
 | |
| };
 | |
| </script>
 | |
| 
 | |
| <style scoped lang="scss"></style>
 |