fix(): 路内，统一导出功能

src/components/Export/ExportBtnNew/index.jsx

@@ -1,4 +1,4 @@
-import React, { useState, useMemo, useEffect } from "react";
+import React, { useState, useMemo, useEffect, forwardRef, useImperativeHandle } from "react";
 import { Modal, Progress, Radio, Space, InputNumber, message, Button } from "antd";
 import {
   ExclamationCircleFilled,
@@ -13,7 +13,7 @@ import "./index.scss";
 
 
 // 无下载步骤版导出
-function ExportBtn(props) {
+const ExportBtn = forwardRef((props, ref) => {
 
   const {
     children,
@@ -25,6 +25,8 @@ function ExportBtn(props) {
     postdata = {}, // post 传参数  传参格式: {formData:(pn,page_size),other:{}}
     timeDelay = 300,
     pageName,
+    onOk = ()=>{},
+    isTableModule=false,
     imgno = true // 是否支持有图导出 true 含图和无图导出 false 只有无图导出
   } = props;
 
@@ -157,17 +159,28 @@ function ExportBtn(props) {
         message.error("分段范围超出限制");
         return false;
       }
+      if (isTableModule) {
+        onOk(min, max)
+      } else {
         startExport(min, max, exportType == "hasImg" ? 1 : 0)        
       }
+    }
     //当前页
     else if (checkedType == 1) {
       const { pn, length, page_size } = postdata.formData
-      console.log(postdata.formData)
+      if (isTableModule) {
+        onOk((pn - 1) * (length || page_size) + 1, pn * (length || page_size))
+      } else {
         startExport((pn - 1) * (length || page_size) + 1, pn * (length || page_size) , exportType == "hasImg" ? 1 : 0)
       }
+    }
     //全部
     else {
-      startExport(1, 1000000, exportType == "hasImg" ? 1 : 0)
+      if (isTableModule) {
+        onOk(1, totalRecords)
+      } else {
+        startExport(1, totalRecords, exportType == "hasImg" ? 1 : 0)
+      }
     }
     setBtnLoading(true);
   };
@@ -248,10 +261,15 @@ function ExportBtn(props) {
 
   // 关闭弹窗
   const handleCancel = () => {
+    setBtnLoading(false)
     setIsExportOpen(false);
     handleReset();
   };
 
+  const handleError = () => {
+    setInProcess("4")
+  }
+
   // 重置
   const handleReset = () => {
     setExportType(modalType);
@@ -310,6 +328,13 @@ function ExportBtn(props) {
       </Space>
     </div>
   );
+
+
+  useImperativeHandle(ref, () => ({
+    handleCancel,
+    handleError
+  }));
+
   return (
     <div className='root_gfkk'>
       <div onClick={() => {
@@ -458,6 +483,6 @@ function ExportBtn(props) {
       </Modal>
     </div>
   );
-}
+})
 
 export default ExportBtn;

src/components/TableModule/index.jsx

@@ -27,7 +27,7 @@ import ajax from "@/services";
 import exportAjax from "@/config/ajax";
 import moment from "moment";
 import { useSetState } from "ahooks";
-import { ResultFlow, ExportBtn, QuickMenu } from "@/components";
+import { ResultFlow, ExportBtnNew, QuickMenu } from "@/components";
 import "./index.scss";
 import { useSessionStorageState } from 'ahooks';
 import qs from 'qs';
@@ -71,6 +71,8 @@ const TableModule = forwardRef((props, ref) => {
     value: {}
   })
 
+  const exportRef = useRef(null)
+
   //console.log(locale);
   const [formData, setFormData] = useState()
   const [inputSelectGroup, setInputSelectGroup] = useState([])
@@ -843,12 +845,15 @@ const TableModule = forwardRef((props, ref) => {
     });
   }
 
-  const exportBtn = (filename) => {
+  const exportBtn = (filename, start, end) => {
+    return new Promise((resolved, rejected) => {
       let form = {
         ...searchForm.getFieldsValue(),
         ...pageData,
         ...otherData,
         export: filename,
+        start: start,
+        end: end
       };
       if (timeFlag) {
         form = {
@@ -908,16 +913,21 @@ const TableModule = forwardRef((props, ref) => {
                   new Date().getDate(),
               });
               tipForm.setFieldsValue({ filename: pagename + (new Date().getMonth() + 1).toString().padStart(2, "0") + new Date().getDate(), })
+              resolved()
             } else {
               message.error(res.message);
+              rejected(res.message)
             }
           })
           .catch((err) => {
             console.error(err);
+            rejected(err)
           });
       } else {
         message.error('该页面无数据，无法导出')
+        rejected('该页面无数据，无法导出')
       }
+    })
 
   };
   function handleOk() {
@@ -932,6 +942,14 @@ const TableModule = forwardRef((props, ref) => {
     fetch,
   }));
 
+  const handleExport = (start, end) => {
+    exportBtn(pagename + (new Date().getMonth() + 1).toString().padStart(2, "0") + new Date().getDate(), start, end).then(() => {
+      exportRef.current.handleCancel()
+    }).catch(msg => {
+      exportRef.current.handleError()
+    })
+  }
+
 
   useEffect(() => {
     fetch();
@@ -1002,12 +1020,27 @@ const TableModule = forwardRef((props, ref) => {
             {rightButtonGroup.map((item) => item)}
             {diyButton ? diyButton : null}
             {isExport && (
-              <Button
-                type="primary"
-                onClick={() => setTipModal({ ...tipModal, visible: true })}
-              >
-                导出
-              </Button>
+              // <Button
+              //   type="primary"
+              //   onClick={() => setTipModal({ ...tipModal, visible: true })}
+              // >
+              //   导出
+              // </Button>
+              total ? (
+                <ExportBtnNew
+                  children={<Button className="export-btn" size='medium' type="primary">导出</Button>}
+                  modalType="noImg"
+                  ref={exportRef}
+                  totalRecords={total}
+                  exportUrl={exportUrl}
+                  imgno={false}
+                  postdata={{
+                    formData: pageData
+                  }}
+                  isTableModule={true}
+                  onOk={handleExport}
+                />
+              ) : <></>
             )}
           </div>
         </div>

src/pages/InRoadMgm/BusinessMgm/SpecialRecord/loadable.jsx

@@ -1,5 +1,5 @@
 import React, { useState, useRef, useEffect } from "react";
-import { ExportBtn, ResultFlowResult } from "@/components"
+import { ExportBtnNew, ResultFlowResult } from "@/components"
 import { Select, Input, Button, Table, message, Pagination, Popover, Modal, Upload, Tabs, Image } from 'antd'
 import {
     pageSizeOptions
@@ -38,6 +38,7 @@ function CollectorWorkStat(props) {
     const [lastFormData, setLastFormData] = useState(formData)
     const [approveFormData, setApproveFormData] = useState(formData)
     const [deployFormData, setDeployFormData] = useState(formData)
+    const exportRef = useRef(null)
     const smallParameter = {
         pn: 1,
         size: Number(pageSizeOptions[0]),
@@ -917,13 +918,20 @@ function CollectorWorkStat(props) {
         })
     }
     //导出
-    const exportData = () => {
+    const exportData = (start, end) => {
+        return new Promise((resolved, rejected) => {
             let data = {
                 ...formData,
-            export_name: '白名单导出'
+                export_name: '白名单导出',
+                start: start,
+                end: end
             }
             ajax.specialExport(data).then(res => {
                 window.open(res.data.url)
+                resolved()
+            }).catch(err => {
+                rejected(err)
+            })
         })
     }
     // console.log(getImage);
@@ -1050,6 +1058,15 @@ function CollectorWorkStat(props) {
             })
         }
     }
+
+    const handleExport = (start, end) => {
+        exportData(start, end).then(() => {
+            exportRef.current.handleCancel()
+        }).catch(() => {
+            exportRef.current.handleError()
+        })
+    }
+
     useEffect(() => {
         if (getSearchPlate) {
             setGetCreatDataList({
@@ -1300,11 +1317,24 @@ function CollectorWorkStat(props) {
                                     <>
                                         <div className="result-info-row">
                                             <span className="font">共检索到<em>{resultData.total_records}</em>条结果</span>
-                                            {formData.tab === '1' ?
-                                                <Button type="primary" className="yisa-btn colorBtn" onClick={() => { exportData() }}>
-                                                    导出
-                                                </Button> : ''
-                                            }
+                                            {formData.tab === '1' ? (
+                                                // <Button type="primary" className="yisa-btn colorBtn" onClick={() => { exportData() }}>
+                                                //     导出
+                                                // </Button>
+                                                <ExportBtnNew
+                                                    children={<Button className="export-btn" size='medium' type="primary">导出</Button>}
+                                                    modalType="noImg"
+                                                    ref={exportRef}
+                                                    totalRecords={resultData.total_records}
+                                                    imgno={false}
+                                                    postdata={{
+                                                        formData: formData
+                                                    }}
+                                                    isTableModule={true}
+                                                    onOk={handleExport}
+                                                />
+                                            )
+                                            : '' }
                                             
                                         </div>
                                         <Table

src/pages/InRoadMgm/EquipmentMgm/EquipmentStatus/Device/index.jsx

@@ -1,5 +1,5 @@
 import React, { useState, useRef, useEffect } from "react";
-import { ResultFlowResult } from "@/components"
+import { ResultFlowResult, ExportBtnNew } from "@/components"
 import { Select, Input, Button, Table, message, Pagination, Popover, Modal, Col, Row, Form, Tabs } from 'antd'
 import {
   pageSizeOptions
@@ -36,6 +36,7 @@ function Road(props) {
       pn: 1,
       length: Number(pageSizeOptions[0]),  // 每页条数
   }
+  const exportRef = useRef(null)
   const [formData, setFormData] = useState(parameter)
   const [lastFormData, setLastFormData] = useState(formData)
   const lastFormDataRef = useRef(formData)
@@ -248,10 +249,13 @@ function Road(props) {
       getData({...parameter})
   }
 
-  const handleExport = () => {
-    ajax.deviceDimensionExport(formData).then(e => {
+  const handleExport = (start, end) => {
+    ajax.deviceDimensionExport({...form, start: start, end: end}).then(e => {
         if (e.status == 20000) {
             window.open(e.data.url)
+            exportRef.current.handleCancel()
+        } else {
+            exportRef.current.handleError()
         }
     })
   }
@@ -442,7 +446,19 @@ useEffect(() => {
             <div className="result">
                 <div className="result-title">
                     <span className="font">共检索到<em>{resultData.total_records}</em>条结果</span>
-                    <div className="export-btn" onClick={handleExport}>导出</div>
+                    {/* <div className="export-btn" onClick={handleExport}>导出</div> */}
+                    <ExportBtnNew
+                        children={<Button className="export-btn" size='medium' type="primary">导出</Button>}
+                        modalType="noImg"
+                        ref={exportRef}
+                        totalRecords={resultData.total_records}
+                        imgno={false}
+                        postdata={{
+                            formData: formData
+                        }}
+                        isTableModule={true}
+                        onOk={handleExport}
+                    />
                 </div>
                 <ResultFlowResult ajaxLoad={ajaxLoading} resultData={resultData.data ? resultData.data : []}>
                     <Table

src/pages/InRoadMgm/EquipmentOpe/faultReport/loadable.jsx

@@ -1,5 +1,5 @@
 import React, { useState, useRef, useEffect } from "react";
-import { ResultFlowResult, FormSliderPicker } from "@/components"
+import { ResultFlowResult, FormSliderPicker, ExportBtnNew } from "@/components"
 import { Select, Button, Input, Table, message, Pagination } from 'antd'
 import {
     pageSizeOptions
@@ -30,6 +30,7 @@ function faultReport(props) {
         pn: 1,
         page_size: Number(pageSizeOptions[0]),  // 每页条数
     }
+    const exportRef = useRef(null)
     const [formData, setFormData] = useState(parameter)
     const lastFormDataRef = useRef(formData)
     const [lastFormData, setLastFormData] = useState(formData)
@@ -61,14 +62,30 @@ function faultReport(props) {
         })
       }
     //导出
-    const getExportData = () => {
+    const getExportData = (start, end) => {
+        return new Promise((resolved, rejected) => {
             let data = {
-            ...formData
+                ...formData,
+                start: start,
+                end: end
             }
             ajax.getFaultReportExport(data).then(res => {
                 window.open(res.data.export_url)
+                resolved()
+            }).catch(err => {
+                rejected(err)
+            })
         })
     }
+
+    const handleExport = (start, end) => {
+        getExportData(start, end).then(() => {
+            exportRef.current.handleCancel()
+        }).catch(err => {
+            exportRef.current.handleError()
+        })
+    }
+
     //列表
     const handleColumns = (tab) => {
         let result = [...deployListColumns];
@@ -301,9 +318,21 @@ function faultReport(props) {
                 <div className="result">
                     <div className="result-info-row">
                         <span className="font">共检索到<em>{resultData.total_records}</em>条结果</span>
-                        <Button type="primary" className="yisa-btn colorBtn" onClick={() => { getExportData() }}>
+                        {/* <Button type="primary" className="yisa-btn colorBtn" onClick={() => { getExportData() }}>
                             导出
-                        </Button>
+                        </Button> */}
+                        <ExportBtnNew
+                            children={<Button className="export-btn" size='medium' type="primary">导出</Button>}
+                            modalType="noImg"
+                            ref={exportRef}
+                            totalRecords={resultData.total_records}
+                            imgno={false}
+                            postdata={{
+                                formData: formData
+                            }}
+                            isTableModule={true}
+                            onOk={handleExport}
+                        />
                     </div>
                     <ResultFlowResult ajaxLoad={ajaxLoading} resultData={resultData.data ? resultData.data : []}>
                         <Table

src/pages/InRoadMgm/EquipmentOpe/patrolStatistics/loadable.jsx

@@ -1,5 +1,5 @@
 import React, { useState, useRef, useEffect } from "react";
-import { ResultFlowResult, FormSliderPicker } from "@/components"
+import { ResultFlowResult, FormSliderPicker, ExportBtnNew } from "@/components"
 import { Select, Button, Input, Table, message, Pagination, Modal, Radio } from 'antd'
 import {
     pageSizeOptions
@@ -37,6 +37,7 @@ function patrolStatistics(props) {
     const lastFormDataRef = useRef(formData)
     const [lastFormData, setLastFormData] = useState(formData)
     const [deleteVisible, setDeleteVisible] = useState(false)
+    const exportRef = useRef(null)
     //物品型号
     const handleRoadName = (v) => {
         setFormData({ ...formData, road_name: v.target.value })
@@ -61,12 +62,26 @@ function patrolStatistics(props) {
         })
     }
     //导出
-    const getExportData = () => {
+    const getExportData = (start, end) => {
+        return new Promise((resolved, rejected) => {
             let data = {
-            ...formData
+                ...formData,
+                start: start,
+                end: end
             }
             ajax.getBerthWarningListExport(data).then(res => {
                 window.open(res.data.export_url)
+                resolved()
+            }).catch(err => {
+                rejected(err)
+            })
+        })
+    }
+    const handleExport = (start, end) => {
+        getExportData(start, end).then(() => {
+            exportRef.current.handleCancel()
+        }).catch(err => {
+            exportRef.current.handleError()
         })
     }
     //列表
@@ -323,9 +338,21 @@ function patrolStatistics(props) {
                 <div className="result">
                     <div className="result-info-row">
                         <span className="font">共检索到<em>{resultData.total_records}</em>条结果</span>
-                        <Button type="primary" className="yisa-btn colorBtn" onClick={() => { getExportData() }}>
+                        {/* <Button type="primary" className="yisa-btn colorBtn" onClick={() => { getExportData() }}>
                             导出
-                        </Button>
+                        </Button> */}
+                        <ExportBtnNew
+                            children={<Button className="export-btn" size='medium' type="primary">导出</Button>}
+                            modalType="noImg"
+                            ref={exportRef}
+                            totalRecords={resultData.total_records}
+                            imgno={false}
+                            postdata={{
+                                formData: formData
+                            }}
+                            isTableModule={true}
+                            onOk={handleExport}
+                        />
                     </div>
                     <ResultFlowResult ajaxLoad={ajaxLoading} resultData={resultData.data ? resultData.data : []}>
                         <Table

src/pages/InRoadMgm/PersonMgm/Attendance/WorkerAttendance/loadable.jsx

@@ -1,5 +1,5 @@
 import React, { useState, useRef, useEffect } from "react";
-import { Apimap, Marker, ExportBtn, ResultFlowResult } from "@/components"
+import { Apimap, Marker, ExportBtn, ResultFlowResult, ExportBtnNew } from "@/components"
 import { Select, Input, Button, Table, message, Pagination, DatePicker, Space, Modal, Switch } from 'antd'
 import {
     operator,
@@ -41,6 +41,7 @@ function WorkerAttendance (props) {
     })
     const [lastFormData, setLastFormData] = useState(formData)
     const [attendanceVisible, setAttendanceVisible] = useState(false)
+    const exportRef = useRef(null)
     //登录名
     const handleLoginName = (v) => {
         setFormData({ ...formData, pdaManagerName: v.target.value })
@@ -323,12 +324,19 @@ function WorkerAttendance (props) {
         getData({...data, pn: 1})
     }
     //导出
-    const exportData = () => {
+    const exportData = (start, end) => {
+        return new Promise((resolved, rejected) => {
             let data = {
-            ...formData
+                ...formData,
+                start: start,
+                end: end
             }
             ajax.attendanceExport(data).then(res => {
                 window.open(res.data.url)
+                resolved()
+            }).catch(err => {
+                rejected()
+            })
         })
     }
     const setType = (v) => {
@@ -360,6 +368,14 @@ function WorkerAttendance (props) {
         const tooEarly = current.isAfter(moment(), 'day'); // 今天之后
         return tooEarly || tooLate;
       };
+
+    const handleExport = (start, end) => {
+        exportData(start, end).then(() => {
+            exportRef.current.handleCancel()
+        }).catch(() => {
+            exportRef.current.handleError()
+        })
+    }
     useEffect(() => {
         getData()
         operationName()
@@ -465,9 +481,18 @@ function WorkerAttendance (props) {
                 <div className="result">
                     <div className="totalExport">
                         <div className="font">共检索到<em>{resultData.total_records}</em>条结果</div>
-                        <Button type="primary" className="yisa-btn colorBtn" onClick={() => { exportData() }}>
+                        {/* <Button type="primary" className="yisa-btn colorBtn" onClick={() => { exportData() }}>
                             导出
-                        </Button>
+                        </Button> */}
+                        <ExportBtnNew
+                            children={<Button className="yisa-btn colorBtn" size='medium' type="primary">导出</Button>}
+                            modalType="noImg"
+                            ref={exportRef}
+                            totalRecords={resultData.total_records || 0}
+                            imgno={false}
+                            isTableModule={true}
+                            onOk={handleExport}
+                        />
                     </div>
                     <ResultFlowResult ajaxLoad={ajaxLoading} resultData={resultData.data ? resultData.data : []}>
                         <Table

src/pages/InRoadMgm/PersonMgm/Attendance/WorkerSchedule/loadable.jsx

@@ -1,5 +1,5 @@
 import React, { useState, useRef, useEffect } from "react";
-import { ExportBtn, ResultFlowResult } from "@/components"
+import { ExportBtn, ResultFlowResult, ExportBtnNew } from "@/components"
 import { Select, Input, Button, Table, message, Pagination, Popover, Modal, Calendar } from 'antd'
 import {
     pageSizeOptions
@@ -12,6 +12,7 @@ import moment from 'moment';
 
 function WorkerSchedule(props) {
     const [ajaxLoading, setAjaxLoading] = useState(false)
+    const exportRef = useRef(null)
     const [resultData, setResultData] = useState({
         data: [],
         total_records: 0,
@@ -283,12 +284,19 @@ function WorkerSchedule(props) {
         return { editData, status };
     };
     //导出
-    const exportData = () => {
+    const exportData = (start, end) => {
+        return new Promise((resolved, rejected) => {
             let data = {
-            ...formData
+                ...formData,
+                start: start,
+                end: end
             }
             ajax.scheduleExport(data).then(res => {
                 window.open(res.data.url)
+                resolved()
+            }).catch(err => {
+                rejected()
+            })
         })
     }
     const changeEditTime = (value) => {
@@ -380,6 +388,13 @@ function WorkerSchedule(props) {
     const changeDate = (v) => {
         setGetDateTime(moment(v).format('YYYY-MM-DD'));
     }
+    const handleExport = (start, end) => {
+        exportData(start, end).then(() => {
+            exportRef.current.handleCancel()
+        }).catch(() => {
+            exportRef.current.handleError()
+        })
+    }
     useEffect(() => {
         getData()
 
@@ -447,9 +462,18 @@ function WorkerSchedule(props) {
                 <div className="result">
                     <div className="result-info-row">
                         <span className="font">共检索到<em>{resultData.total_records}</em>条结果</span>
-                        <Button type="primary" className="yisa-btn colorBtn" onClick={() => { exportData() }}>
+                        {/* <Button type="primary" className="yisa-btn colorBtn" onClick={() => { exportData() }}>
                                 导出
-                        </Button>
+                        </Button> */}
+                        <ExportBtnNew
+                            children={<Button className="yisa-btn colorBtn" size='medium' type="primary">导出</Button>}
+                            modalType="noImg"
+                            ref={exportRef}
+                            totalRecords={resultData.total_records || 0}
+                            imgno={false}
+                            isTableModule={true}
+                            onOk={handleExport}
+                        />
                     </div>
                     
                     <ResultFlowResult ajaxLoad={ajaxLoading} resultData={resultData.data ? resultData.data : []}>

src/pages/InRoadMgm/PersonMgm/Performance/SalesStat/loadable.jsx

@@ -1,5 +1,5 @@
 import React, { useState, useRef, useEffect } from "react";
-import { FormSliderPicker, ExportBtn, ResultFlowResult } from "@/components"
+import { FormSliderPicker, ExportBtnNew, ResultFlowResult } from "@/components"
 import { Input, Button, Table, message, Pagination, Modal } from 'antd'
 import {
   pageSizeOptions
@@ -35,6 +35,7 @@ function SalesStat(props) {
     start: '',
     end: ''
   })
+  const exportRef = useRef(null)
   const [formData, setFormData] = useState(parameter)
   const [lastFormData, setLastFormData] = useState(formData)
   const lastFormDataRef = useRef(formData)
@@ -284,10 +285,12 @@ function SalesStat(props) {
   const salesData = () => {
     setExportVisible(true)
   }
-  const exportNow = () => {
+  const exportNow = (start, end) => {
     let data = {
       ...formData,
-      export_type: ""
+      export_type: "",
+      start: start,
+      end: end
     }
     ajax.salesExport(data).then(res => {
       window.open(res.data.url)
@@ -305,6 +308,20 @@ function SalesStat(props) {
       setExportVisible(false)
     })
   }
+
+  const handleExport = (start, end, type) => {
+    if (type == 1) { // 导出当前页
+      exportNow()
+      exportRef.current.handleCancel()
+    } else if (type == 2) { // 导出所有
+      exportAll()
+      exportRef.current.handleCancel()
+    } else {
+      exportNow(start, end)
+      exportRef.current.handleCancel()
+    }
+  } 
+
   //查看详情
   const revenueModal = () => {
     setRevenueVisible(false)
@@ -362,9 +379,21 @@ const [getTextValue,setGetTextValue]=useState({})
         <div className="result">
           <div className="result-info-row">
             <span className="font">共检索到<em>{resultData.total_records}</em>条结果</span>
-            <Button type="primary" className="yisa-btn colorBtn" onClick={() => { salesData() }}>
+            {/* <Button type="primary" className="yisa-btn colorBtn" onClick={() => { salesData() }}>
               导出
-            </Button>
+            </Button> */}
+            <ExportBtnNew
+                children={<Button className="yisa-btn colorBtn" size='medium' type="primary">导出</Button>}
+                modalType="noImg"
+                ref={exportRef}
+                totalRecords={resultData.total_records || 0}
+                imgno={false}
+                isTableModule={true}
+                postdata={{
+                  formData: formData
+                }}
+                onOk={handleExport}
+            />
           </div>
           <ResultFlowResult ajaxLoad={ajaxLoading} resultData={resultData.data ? resultData.data : []}>
             <Table

src/pages/InRoadMgm/PersonMgm/Performance/WorkerStat/loadable.jsx

@@ -1,5 +1,5 @@
 import React, { useState, useRef, useEffect } from "react";
-import { FormSliderPicker, ExportBtn, ResultFlowResult } from "@/components"
+import { FormSliderPicker, ExportBtn, ResultFlowResult, ExportBtnNew } from "@/components"
 import { Select, Input, Button, Table, message, Pagination } from 'antd'
 import {
     pageSizeOptions
@@ -32,6 +32,7 @@ function WorkerStat(props) {
         pn: 1,
         page_size: Number(pageSizeOptions[0]),  // 每页条数
     }
+    const exportRef = useRef(null)
     const [formData, setFormData] = useState(parameter)
     const [lastFormData, setLastFormData] = useState(formData)
     const lastFormDataRef = useRef(formData)
@@ -140,12 +141,26 @@ function WorkerStat(props) {
         })
     }
     //导出
-    const exportData = () => {
+    const exportData = (start, end) => {
+        return new Promise((resolved, rejected) => {
             let data = {
-            ...formData
+                ...formData,
+                start: start,
+                end: end
             }
             ajax.statExport(data).then(res => {
                 window.open(res.data.url)
+                resolved()
+            }).catch(err => {
+                rejected()
+            })
+        })
+    }
+    const handleExport = (start, end) => {
+        exportData(start, end).then(() => {
+            exportRef.current.handleCancel()
+        }).catch(() => {
+            exportRef.current.handleError()
         })
     }
     useEffect(() => {
@@ -250,9 +265,21 @@ function WorkerStat(props) {
                 <div className="result">
                     <div className="result-info-row">
                         <span className="font">共检索到<em>{resultData.total_records}</em>条结果</span>
-                        <Button type="primary" className="yisa-btn colorBtn" onClick={() => { exportData() }}>
+                        {/* <Button type="primary" className="yisa-btn colorBtn" onClick={() => { exportData() }}>
                             导出
-                        </Button>
+                        </Button> */}
+                        <ExportBtnNew
+                            children={<Button className="yisa-btn colorBtn" size='medium' type="primary">导出</Button>}
+                            modalType="noImg"
+                            ref={exportRef}
+                            totalRecords={resultData.total_records || 0}
+                            imgno={false}
+                            postdata={{
+                                formData: formData
+                            }}
+                            isTableModule={true}
+                            onOk={handleExport}
+                        />
                     </div>
                     <ResultFlowResult ajaxLoad={ajaxLoading} resultData={resultData.data ? resultData.data : []}>
                         <Table dataSource={resultData.data} pagination={false} loading={ajaxLoading} className="yisa-table-scroll" scroll={{ y: "calc(100% - 109px)" }} >

src/pages/InRoadMgm/PersonMgm/ReportMsg/loadable.jsx

@@ -1,5 +1,5 @@
 import React, { useState, useRef, useEffect } from "react";
-import { ResultFlowResult, FormSliderPicker } from "@/components"
+import { ResultFlowResult, FormSliderPicker, ExportBtnNew } from "@/components"
 import { Select, Button, Input, Table, message, Pagination,Image } from 'antd'
 import {
     pageSizeOptions
@@ -29,6 +29,7 @@ function ReportMsg(props) {
         pn: 1,
         page_size: Number(pageSizeOptions[0]),  // 每页条数
     }
+    const exportRef = useRef(null)
     const [formData, setFormData] = useState(parameter)
     const lastFormDataRef = useRef(formData)
     const [lastFormData, setLastFormData] = useState(formData)
@@ -56,14 +57,30 @@ function ReportMsg(props) {
         })
     }
     //导出
-    const getExportData = () => {
+    const getExportData = (start, end) => {
+        return new Promise((resolved, rejected) => {
             let data = {
-            ...formData
+                ...formData,
+                start: start,
+                end: end
             }
             ajax.getReportExport(data).then(res => {
                 window.open(res.data.url)
+                resolved()
+            }).catch(err => {
+                rejected(err)
+            })
         })
     }
+
+    const handleExport = (start, end) => {
+        getExportData(start, end).then(() => {
+            exportRef.current.handleCancel()
+        }).catch(err => {
+            exportRef.current.handleError()
+        })
+    }
+
     //列表
     const handleColumns = (tab) => {
         let result = [...deployListColumns];
@@ -296,9 +313,21 @@ function ReportMsg(props) {
                 <div className="result">
                     <div className="result-info-row">
                         <span className="font">共检索到<em>{resultData.total_records}</em>条结果</span>
-                        <Button type="primary" className="yisa-btn colorBtn" onClick={() => { getExportData() }}>
+                        {/* <Button type="primary" className="yisa-btn colorBtn" onClick={() => { getExportData() }}>
                                 导出
-                            </Button>
+                            </Button> */}
+                        <ExportBtnNew
+                            children={<Button className="export-btn" size='medium' type="primary">导出</Button>}
+                            modalType="noImg"
+                            ref={exportRef}
+                            totalRecords={resultData.total_records || 0}
+                            imgno={false}
+                            postdata={{
+                                formData: formData
+                            }}
+                            isTableModule={true}
+                            onOk={handleExport}
+                            />
                     </div>
                     <ResultFlowResult ajaxLoad={ajaxLoading} resultData={resultData.data ? resultData.data : []}>
                         <Table

src/pages/InRoadMgm/RoadMgm/RoadConf/index.scss

@@ -71,6 +71,7 @@ $color-primary: var(--color-primary);
       flex-direction: row;
     }
     .operator-part {
+      display: flex;
       button {
         margin: 0 5px;
       }

src/pages/InRoadMgm/RoadMgm/RoadConf/loadable.jsx

@@ -19,7 +19,7 @@ import { dictionary, utils } from "@/config/common";
 import moment from "moment";
 import { useSetState, useSessionStorageState, useUpdateEffect } from "ahooks";
 import ajax from "@/services";
-import { ResultFlow } from "@/components";
+import { ResultFlow, ExportBtnNew } from "@/components";
 import "./index.scss";
 import ConfigRoad from "../ConfigRoad"
 import AuditModifyModal from "./AuditModifyModal";
@@ -29,6 +29,7 @@ import AuditModifyModal from "./AuditModifyModal";
 function RoadConf() {
   const navigate = useNavigate();
   const [searchForm] = Form.useForm();
+  const exportRef = useRef(null)
 
   const columns = [
     {
@@ -436,22 +437,26 @@ function RoadConf() {
     }
   }
   //导出
-  function exportData() {
+  function exportData(start, end) {
+    return new Promise((resolved, rejected) => {
       let result = searchForm.getFieldsValue();
       result.area = area;
       ajax
-      .exportRoadList(result)
+        .exportRoadList({...result, start: start, end: end})
         .then((res) => {
           if (res.status === 20000) {
             const link = document.createElement("a");
             link.href = res.data.export_url;
             link.target = "_blank"; // 打开新页面
             link.click();
+            resolved()
           }
         })
         .catch((err) => {
           console.warn(err);
+          rejected()
         });
+    })
   }
   const reastBtn = () => {
     searchForm.resetFields();
@@ -467,6 +472,14 @@ function RoadConf() {
       }
     })
   }
+
+  const handleExport = (start, end) => {
+    exportData(start, end).then(() => {
+      exportRef.current.handleCancel()
+    }).catch(() => {
+      exportRef.current.handleError()
+    })
+  }
   useEffect(() => {
     search();
   }, [pageData]);
@@ -499,9 +512,19 @@ function RoadConf() {
               <Button type="primary" onClick={addRoad}>
                 添加
               </Button>
-              <Button type="primary" onClick={exportData}>
+              {/* <Button type="primary" onClick={exportData}>
                 导出
-              </Button>
+              </Button> */}
+              <ExportBtnNew
+                children={<Button className="export-btn" size='medium' type="primary">导出</Button>}
+                modalType="noImg"
+                ref={exportRef}
+                totalRecords={resultData.total_records || 0}
+                exportUrl={"/api/bpm/road/export"}
+                imgno={false}
+                isTableModule={true}
+                onOk={handleExport}
+              />
               <Button
                 style={{ width: 116 }}
                 type="primary"