diff --git a/src/components/Export/ExportBtnNew/index.jsx b/src/components/Export/ExportBtnNew/index.jsx index 767fb6a..b1cf3f7 100644 --- a/src/components/Export/ExportBtnNew/index.jsx +++ b/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; } - startExport(min, max, exportType == "hasImg" ? 1 : 0) + 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) - startExport((pn - 1) * (length || page_size) + 1, pn * (length || page_size) , exportType == "hasImg" ? 1 : 0) + 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) { ); + + + useImperativeHandle(ref, () => ({ + handleCancel, + handleError + })); + return (
{ @@ -458,6 +483,6 @@ function ExportBtn(props) {
); -} +}) export default ExportBtn; diff --git a/src/components/TableModule/index.jsx b/src/components/TableModule/index.jsx index 6055344..63041fa 100644 --- a/src/components/TableModule/index.jsx +++ b/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,81 +845,89 @@ const TableModule = forwardRef((props, ref) => { }); } - const exportBtn = (filename) => { - let form = { - ...searchForm.getFieldsValue(), - ...pageData, - ...otherData, - export: filename, - }; - if (timeFlag) { - form = { - ...form, - timeType: timeGroup.timeType, - start_time: moment(timeGroup.timeRanges.start_time).format( - "YYYY-MM-DD HH:mm:ss" - ), - end_time: moment(timeGroup.timeRanges.end_time).format( - "YYYY-MM-DD HH:mm:ss" - ), + const exportBtn = (filename, start, end) => { + return new Promise((resolved, rejected) => { + let form = { + ...searchForm.getFieldsValue(), + ...pageData, + ...otherData, + export: filename, + start: start, + end: end }; - } - if (form.time) { - form = { - ...form, - time: moment(form.time).format('YYYY-MM-DD') + if (timeFlag) { + form = { + ...form, + timeType: timeGroup.timeType, + start_time: moment(timeGroup.timeRanges.start_time).format( + "YYYY-MM-DD HH:mm:ss" + ), + end_time: moment(timeGroup.timeRanges.end_time).format( + "YYYY-MM-DD HH:mm:ss" + ), + }; } - } - if (areaName !== null) form[areaName] = areaSelectedList; - if (form.start_time !== void 0 && form.end_time !== void 0) { - form.start_time = moment(form.start_time).format("YYYY-MM-DD HH:mm:ss"); - form.end_time = moment(form.end_time).format("YYYY-MM-DD HH:mm:ss"); - if (exportUrl == "/api/ope/record/recharge_export") { //特殊情况，用户信息的充值记录导出 - form.startTime = moment(form.start_time).format("YYYY-MM-DD HH:mm:ss"); - form.endTime = moment(form.end_time).format("YYYY-MM-DD HH:mm:ss"); + if (form.time) { + form = { + ...form, + time: moment(form.time).format('YYYY-MM-DD') + } } - if (exportUrl == "/api/fin/order_search/arrears_order_update_list_export") { //特殊情况，财务管理-停车订单查询-订单修改记录 - form.deal_time_end = moment(form.deal_time_end).format("YYYY-MM-DD HH:mm:ss"); - form.deal_time_start = moment(form.deal_time_start).format("YYYY-MM-DD HH:mm:ss"); + if (areaName !== null) form[areaName] = areaSelectedList; + if (form.start_time !== void 0 && form.end_time !== void 0) { + form.start_time = moment(form.start_time).format("YYYY-MM-DD HH:mm:ss"); + form.end_time = moment(form.end_time).format("YYYY-MM-DD HH:mm:ss"); + if (exportUrl == "/api/ope/record/recharge_export") { //特殊情况，用户信息的充值记录导出 + form.startTime = moment(form.start_time).format("YYYY-MM-DD HH:mm:ss"); + form.endTime = moment(form.end_time).format("YYYY-MM-DD HH:mm:ss"); + } + if (exportUrl == "/api/fin/order_search/arrears_order_update_list_export") { //特殊情况，财务管理-停车订单查询-订单修改记录 + form.deal_time_end = moment(form.deal_time_end).format("YYYY-MM-DD HH:mm:ss"); + form.deal_time_start = moment(form.deal_time_start).format("YYYY-MM-DD HH:mm:ss"); + } } - } - if (exportUrl == "/api/fin/order_search/parking_card_order_list" || exportUrl == "/api/fin/order_search/staggered_parking_order_list") { //特殊情况，商品订单查询导出 - form = { - ...form, - export: 1, - export_file_name: filename, + if (exportUrl == "/api/fin/order_search/parking_card_order_list" || exportUrl == "/api/fin/order_search/staggered_parking_order_list") { //特殊情况，商品订单查询导出 + form = { + ...form, + export: 1, + export_file_name: filename, + } } - } - if (tableData.length != 0) { - exportAjax({ - url: exportUrl, - type: "post", - data: { ...form, ...export_other }, - }) - .then((res) => { - if (res.status === 20000) { - const link = document.createElement("a"); - link.href = res.data.url || res.data.export_url; - link.target = "_blank"; // 打开新页面 - link.click(); - setTipModal({ - ...tipModal, visible: false, - filename: - pagename + - (new Date().getMonth() + 1).toString().padStart(2, "0") + - new Date().getDate(), - }); - tipForm.setFieldsValue({ filename: pagename + (new Date().getMonth() + 1).toString().padStart(2, "0") + new Date().getDate(), }) - } else { - message.error(res.message); - } + if (tableData.length != 0) { + exportAjax({ + url: exportUrl, + type: "post", + data: { ...form, ...export_other }, }) - .catch((err) => { - console.error(err); - }); - } else { - message.error('该页面无数据，无法导出') - } + .then((res) => { + if (res.status === 20000) { + const link = document.createElement("a"); + link.href = res.data.url || res.data.export_url; + link.target = "_blank"; // 打开新页面 + link.click(); + setTipModal({ + ...tipModal, visible: false, + filename: + pagename + + (new Date().getMonth() + 1).toString().padStart(2, "0") + + 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 && ( - + // + total ? ( + 导出} + modalType="noImg" + ref={exportRef} + totalRecords={total} + exportUrl={exportUrl} + imgno={false} + postdata={{ + formData: pageData + }} + isTableModule={true} + onOk={handleExport} + /> + ) : <> )}
diff --git a/src/pages/InRoadMgm/BusinessMgm/SpecialRecord/loadable.jsx b/src/pages/InRoadMgm/BusinessMgm/SpecialRecord/loadable.jsx index e1aa4c0..97e6618 100644 --- a/src/pages/InRoadMgm/BusinessMgm/SpecialRecord/loadable.jsx +++ b/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 = () => { - let data = { - ...formData, - export_name: '白名单导出' - } - ajax.specialExport(data).then(res => { - window.open(res.data.url) + const exportData = (start, end) => { + return new Promise((resolved, rejected) => { + let data = { + ...formData, + 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) { <>
共检索到{resultData.total_records}条结果 - {formData.tab === '1' ? - : '' - } + {formData.tab === '1' ? ( + // + 导出} + modalType="noImg" + ref={exportRef} + totalRecords={resultData.total_records} + imgno={false} + postdata={{ + formData: formData + }} + isTableModule={true} + onOk={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(() => {
共检索到{resultData.total_records}条结果 -
导出
+ {/*
导出
*/} + 导出} + modalType="noImg" + ref={exportRef} + totalRecords={resultData.total_records} + imgno={false} + postdata={{ + formData: formData + }} + isTableModule={true} + onOk={handleExport} + />
{ - let data = { - ...formData - } - ajax.getFaultReportExport(data).then(res => { - window.open(res.data.export_url) + const getExportData = (start, end) => { + return new Promise((resolved, rejected) => { + let data = { + ...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) {
共检索到{resultData.total_records}条结果 - + */} + 导出} + modalType="noImg" + ref={exportRef} + totalRecords={resultData.total_records} + imgno={false} + postdata={{ + formData: formData + }} + isTableModule={true} + onOk={handleExport} + />
{ setFormData({ ...formData, road_name: v.target.value }) @@ -61,12 +62,26 @@ function patrolStatistics(props) { }) } //导出 - const getExportData = () => { - let data = { - ...formData - } - ajax.getBerthWarningListExport(data).then(res => { - window.open(res.data.export_url) + const getExportData = (start, end) => { + return new Promise((resolved, rejected) => { + let data = { + ...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) {
共检索到{resultData.total_records}条结果 - + */} + 导出} + modalType="noImg" + ref={exportRef} + totalRecords={resultData.total_records} + imgno={false} + postdata={{ + formData: formData + }} + isTableModule={true} + onOk={handleExport} + />
{ setFormData({ ...formData, pdaManagerName: v.target.value }) @@ -323,12 +324,19 @@ function WorkerAttendance (props) { getData({...data, pn: 1}) } //导出 - const exportData = () => { - let data = { - ...formData - } - ajax.attendanceExport(data).then(res => { - window.open(res.data.url) + const exportData = (start, end) => { + return new Promise((resolved, rejected) => { + let data = { + ...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) {
共检索到{resultData.total_records}条结果
- + */} + 导出} + modalType="noImg" + ref={exportRef} + totalRecords={resultData.total_records || 0} + imgno={false} + isTableModule={true} + onOk={handleExport} + />
{ - let data = { - ...formData - } - ajax.scheduleExport(data).then(res => { - window.open(res.data.url) + const exportData = (start, end) => { + return new Promise((resolved, rejected) => { + let data = { + ...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) {
共检索到{resultData.total_records}条结果 - + */} + 导出} + modalType="noImg" + ref={exportRef} + totalRecords={resultData.total_records || 0} + imgno={false} + isTableModule={true} + onOk={handleExport} + />
diff --git a/src/pages/InRoadMgm/PersonMgm/Performance/SalesStat/loadable.jsx b/src/pages/InRoadMgm/PersonMgm/Performance/SalesStat/loadable.jsx index 3bc685b..ff3a1e8 100644 --- a/src/pages/InRoadMgm/PersonMgm/Performance/SalesStat/loadable.jsx +++ b/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({})
共检索到{resultData.total_records}条结果 - + */} + 导出} + modalType="noImg" + ref={exportRef} + totalRecords={resultData.total_records || 0} + imgno={false} + isTableModule={true} + postdata={{ + formData: formData + }} + onOk={handleExport} + />
{ - let data = { - ...formData - } - ajax.statExport(data).then(res => { - window.open(res.data.url) + const exportData = (start, end) => { + return new Promise((resolved, rejected) => { + let data = { + ...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) {
共检索到{resultData.total_records}条结果 - + */} + 导出} + modalType="noImg" + ref={exportRef} + totalRecords={resultData.total_records || 0} + imgno={false} + postdata={{ + formData: formData + }} + isTableModule={true} + onOk={handleExport} + />
diff --git a/src/pages/InRoadMgm/PersonMgm/ReportMsg/loadable.jsx b/src/pages/InRoadMgm/PersonMgm/ReportMsg/loadable.jsx index 640245a..46f82f2 100644 --- a/src/pages/InRoadMgm/PersonMgm/ReportMsg/loadable.jsx +++ b/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 = () => { - let data = { - ...formData - } - ajax.getReportExport(data).then(res => { - window.open(res.data.url) + const getExportData = (start, end) => { + return new Promise((resolved, rejected) => { + let data = { + ...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) {
共检索到{resultData.total_records}条结果 - + */} + 导出} + modalType="noImg" + ref={exportRef} + totalRecords={resultData.total_records || 0} + imgno={false} + postdata={{ + formData: formData + }} + isTableModule={true} + onOk={handleExport} + />
{ - if (res.status === 20000) { - const link = document.createElement("a"); - link.href = res.data.export_url; - link.target = "_blank"; // 打开新页面 - link.click(); - } - }) - .catch((err) => { - console.warn(err); - }); + function exportData(start, end) { + return new Promise((resolved, rejected) => { + let result = searchForm.getFieldsValue(); + result.area = area; + ajax + .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() { - + */} + 导出} + modalType="noImg" + ref={exportRef} + totalRecords={resultData.total_records || 0} + exportUrl={"/api/bpm/road/export"} + imgno={false} + isTableModule={true} + onOk={handleExport} + />