优化订单报表

src/pages/order/order-market-report/index.jsx

@@ -561,6 +561,8 @@ export default function Index() {
                             onSelect={(value, node) => {
                                 if (node.type === 2 || node === 3) {
                                     setCurrentOrg(node);
+                                } else {
+                                    setCurrentOrg("");
                                 }
                             }}
                             placeholder="请选择组织架构"

src/pages/order/order-report/index.jsx

@@ -1,12 +1,13 @@
 import React, { useState, useEffect } from 'react';
 import { PageContainer } from '@ant-design/pro-layout';
-import { Button, Card, DatePicker, Table, message, Pagination, Space, Tag, Spin } from 'antd';
+import { Button, Card, DatePicker, Table, message, Pagination, Space, Tag, Spin, TreeSelect } from 'antd';
 import styles from './index.less';
 const { RangePicker } = DatePicker;
 import orderReportAPI from "./service";
 import moment from 'moment';
 import { history } from "umi";
-import { CheckCircleOutlined, CloseCircleOutlined } from '@ant-design/icons';
+import { CheckCircleOutlined, CloseCircleOutlined, DownloadOutlined } from '@ant-design/icons';
+import ExportJsonExcel from "js-export-excel"
 
 const columns = [
     {
@@ -112,6 +113,9 @@ export default function Index() {
     const [pageSize, setPageSize] = useState(10);
     const [total, setTotal] = useState(0);
     const [showLoading, setShowLoading] = useState(false);
+    const [currentOrg, setCurrentOrg] = useState('');
+    const [orgTree, setOrgTree] = useState([]);
+
 
     const [timeRange, setTimeRange] = useState([
         moment(moment(new Date(Date.now() - 24 * 60 * 60 * 1000 * 7)).format('YYYY-MM-DD 00:00:00')),
@@ -123,13 +127,20 @@ export default function Index() {
     }, [current, pageSize]);
 
 
+    useEffect(() => {
+        onGetOrgTree();
+    }, []);
+
 
     //获取订单列表
     const onQueryOrderReportList = async () => {
         const jsonData = {
+            startTime: timeRange[0],
+            endTime: timeRange[1],
             current,
             pageSize
         }
+        currentOrg.key && (jsonData.shopId = currentOrg.key);
         setShowLoading(true);
         const response = await orderReportAPI.getOrderReportList(jsonData);
         setShowLoading(false);
@@ -147,19 +158,112 @@ export default function Index() {
         setPageSize(pageSize);
     }
 
+    //获取组织树
+    const onGetOrgTree = async () => {
+        setShowLoading(true);
+        const response = await orderReportAPI.getOrgTree();
+        setShowLoading(false);
+        if (response.statusCode === 200) {
+            const originTree = response.data;
+            onSetOrgTreeStatus(originTree);
+            setOrgTree(originTree);
+        } else {
+            message.error(response.errors || '获取组织树出错');
+        }
+    }
+
+    //设置组织树不可选择状态
+    const onSetOrgTreeStatus = (originTree) => {
+        originTree.forEach(treeItem => {
+            if (treeItem.children && treeItem.children.length > 0) {
+                onSetOrgTreeStatus(treeItem.children);
+            } else {
+                if (treeItem.type === 2 || treeItem.type === 3) {
+                    treeItem.disabled = false;
+                } else {
+                    treeItem.disabled = true;
+                }
+            }
+        });
+    }
+
+    //下载Excel
+    const onDownloadExcel = async () => {
+        const jsonData = {
+            startTime: timeRange[0],
+            endTime: timeRange[1],
+        }
+        currentOrg.key && (jsonData.shopId = currentOrg.key);
+        setShowLoading(true);
+        const response = await orderReportAPI.orderReportExport(jsonData);
+        setShowLoading(false);
+        if (response.statusCode === 200) {
+            let option = {};  //option代表的就是excel文件
+            const date = new Date();
+            const excelName = "订单报表-" + date.toLocaleString().replaceAll('\/', '-');
+            option.fileName = excelName;  //excel文件名称
+            const sheetHeader = [];
+            Object.keys(response.data[0]).forEach(item => {
+                sheetHeader.push(item);
+            });
+            option.datas = [
+                {
+                    sheetData: response.data,            //excel文件中的数据源
+                    sheetName: excelName,       //excel文件中sheet页名称
+                    sheetFilter: sheetHeader,   //excel文件中需显示的列数据
+                    sheetHeader: ['ID', '取餐号', '用户Id', '优惠合集', '订单号（本系统）',
+                        '交易号', '店铺ID', '店铺名字', '商品总价','优惠金额', '实付金额', 
+                        '创建时间', '支付金额异常',
+                        '订单支付时间异常', '订单异常', '售后金额异常', '售后时间异常', '售后订单异常'
+                    ]    //excel文件中每列的表头名称
+                }
+            ]
+            let toExcel = new ExportJsonExcel(option);  //生成excel文件
+            toExcel.saveExcel();
+        } else {
+            message.error(response.errors || '导出失败');
+        }
+    }
+
     return (
         <PageContainer>
             {showLoading ? <LoadingCard></LoadingCard> : null}
             <Card className={styles['data-search-card']}>
                 <div className={styles['data-search-box']}>
-                    <RangePicker className={styles['my-range-picker']} value={timeRange} onChange={(date, dateStrings) => {
-                        let tempDate = [
-                            moment(moment(new Date(dateStrings[0])).format('YYYY-MM-DD 00:00:00')),
-                            moment(moment(new Date(dateStrings[1])).format('YYYY-MM-DD 23:59:59')),
-                        ]
-                        setTimeRange(tempDate);
-                    }} />
+                    <div className={styles['data-search-left']}>
+                        <RangePicker className={styles['my-range-picker']} value={timeRange} onChange={(date, dateStrings) => {
+                            let tempDate = [
+                                moment(moment(new Date(dateStrings[0])).format('YYYY-MM-DD 00:00:00')),
+                                moment(moment(new Date(dateStrings[1])).format('YYYY-MM-DD 23:59:59')),
+                            ]
+                            setTimeRange(tempDate);
+                        }} />
+                        <TreeSelect
+                            style={{
+                                width: '300px',
+                                marginLeft: '50px'
+                            }}
+                            dropdownStyle={{
+                                maxHeight: 400,
+                                overflow: 'auto',
+                            }}
+                            treeData={orgTree}
+                            onSelect={(value, node) => {
+                                console.log('node>>>', node);
+                                if (node.type === 2 || node === 3) {
+                                    setCurrentOrg(node);
+                                } else {
+                                    setCurrentOrg("");
+                                }
+                            }}
+                            placeholder="请选择组织架构"
+                            treeDefaultExpandAll
+                        />
+                    </div>
                     <div className={styles['data-search-btns']}>
+                        <Button type="primary" icon={<DownloadOutlined />} size='middle' onClick={onDownloadExcel}>
+                            下载
+                        </Button>
                         <Button className={styles['search-btn-item']}>重置</Button>
                         <Button className={styles['search-btn-item']} type="primary" onClick={onQueryOrderReportList}>查询</Button>
                     </div>

src/pages/order/order-report/service.js

@@ -6,5 +6,20 @@ export default {
             method: 'Post',
             data: data,
         });
+    },
+
+    //获取组织架构
+    getOrgTree() {
+        return request(`/kitchen/api/report-statistics/org-tree`, {
+            method: 'GET',
+        });
+    },
+
+    //下载报表
+    orderReportExport(data) {
+        return request(`/kitchen/api/report-statistics/order-report-export`, {
+            method: 'Post',
+            data: data,
+        });
     }
 };