111

src/consts.js

@@ -1,6 +1,7 @@
 import BASE_CONSTS from '@/basic/consts'
 
 export default {
-  ...BASE_CONSTS
+  ...BASE_CONSTS,
   // 自定义变量
+  PAGE_SIZE: 10 // 分页条数
 }

src/hooks/useAutoTable.js

@@ -2,23 +2,16 @@ import { useState, useEffect } from "react"
 
 const useAutoTable = (collapsed) => {
   // console.log(collapsed)
-  const needSubtractHeight = 48 + 48 + 48 + 64 // 需要被裁掉的高度
+  const needSubtractHeight = 48 + 48 + 48 + 64 + 24 // 需要被裁掉的高度
   const needSubtractWidth = (collapsed ? 208 : 48) + 48 + 48 + 48// 需要被裁掉的高度
 
-  // const needSubtractLength = {
-  //   // header: 48  main: (margin: 24) card: (padding: 24) table-hedaer: 64
-  //   height: 48 + 48 + 48 + 64, // 需要被裁掉的高度
-  //   // collapsed ? 48 : 208 , main: (margin: 24) card: (padding: 24) card-body(padding: 24)
-  //   width: (collapsed ? 208 : 48) + 48 + 48 + 48
-  // }
-
 
   const [scroll, setScroll] = useState({ x: 0, y: 0 })
 
   useEffect(() => {
-    setScroll({ ...scroll, x: document.body.clientWidth - needSubtractWidth, y: document.body.clientWidth - needSubtractHeight })
+    setScroll({ ...scroll, x: document.body.clientWidth - needSubtractWidth, y: document.body.clientHeight - needSubtractHeight })
     window.addEventListener('resize', () => {
-      setScroll({ ...scroll, x: document.body.clientWidth - needSubtractWidth, y: document.body.clientWidth - needSubtractHeight })
+      setScroll({ ...scroll, x: document.body.clientWidth - needSubtractWidth, y: document.body.clientHeight - needSubtractHeight })
     })
     return () => {
       window.removeEventListener('resize', () => { })

src/pages/Customer/Contact/index.jsx

@@ -6,9 +6,11 @@ import { connect } from 'dva'
 import React, { useEffect, useState } from 'react'
 import SvgIcon from '@/components/SvgIcon'
 import useAutoTable from '@/hooks/useAutoTable'
+import consts from '@/basic/consts'
 
 const Contact = props => {
   const [x, y] = useAutoTable(props.collapsed)
+  // index.jsx:12 1320 747
   // let tag = Array.from(tag);
   const [visible, setVisible] = useState(false)
 
@@ -262,14 +264,15 @@ const Contact = props => {
       show: false
     }
   })
+  const initData = (page, size) => {
+    const { dispatch } = props
+    dispatch({
+      type: 'contact/fetch',
+      payload: { page, size }
+    }) // 派发出这个action就会调用contact中的fetch函数，然后就会请求数据
+  }
   useEffect(() => {
     // props.getlist();
-    const initData = () => {
-      const { dispatch } = props
-      dispatch({
-        type: 'contact/fetch'
-      }) // 派发出这个action就会调用contact中的fetch函数，然后就会请求数据
-    }
     initData()
   }, [])
 
@@ -277,11 +280,14 @@ const Contact = props => {
     // <PageHeaderWrapper></PageHeaderWrapper>
     <div>
       <ProTable
-        className="auto-scroll-y"
         size="middle"
         columns={columns}
-        // dataSource={contanctlist}
-        // pagination={{ pageSize: 8 }}
+        dataSource={list.data}
+        pagination={{
+          pageSize: consts.PAGE_SIZE,
+          total: list.total,
+          onChange: (page, size) => initData(page, size)
+        }}
         search={false}
         options={{
           search: true

src/services/contact.js

@@ -1,5 +1,5 @@
 import request from '@/basic/utils/request'
 
-export async function queryContact(){
-    return request('/api/client/list')// 请求/api/contact 端口数据的函数 queryContact
+export async function queryContact(payload) {
+    return request('/api/client/list', payload)// 请求/api/contact 端口数据的函数 queryContact
 }