🐛 fix(模块): 修复了一些 bug

config/config.ts

@@ -25,14 +25,14 @@ export default {
       key: '2',
       name: '关于',
       path: '/about',
-      redirect: '/about/m',
+      redirect: '',
       routes: [
         {
           id: 21,
           key: '2-1',
           name: '关于你',
           path: '/about/u',
-          redirect: '/about/u/1',
+          redirect: '',
           pid: 2,
           routes: [
             {
@@ -40,6 +40,7 @@ export default {
               key: '2-1-1',
               name: '关于你1',
               path: '/about/u/index',
+              component:"@/pages/about/u/index",
               redirect: '',
               pid: 21
             },
@@ -48,6 +49,7 @@ export default {
               key: '2-1-2',
               name: '关于你2',
               path: '/about/u/2',
+              component:"@/pages/about/u/$id",
               redirect: '',
               pid: 21
             }
@@ -59,6 +61,7 @@ export default {
           path: '/about/m',
           redirect: '',
           name: '(页面元素权限)关于我',
+          component:"@/pages/about/m",
           pid: 2
         },
         {
@@ -67,6 +70,7 @@ export default {
           path: '/about/um',
           redirect: '',
           name: '关于你和我',
+          component:"@/pages/about/um",
           pid: 2
         }
       ]
@@ -76,7 +80,7 @@ export default {
       key: '3',
       name: '教师',
       path: '/teacher',
-      redirect: '/teacher/u',
+      redirect: '',
       routes: [
         {
           id: 31,
@@ -84,6 +88,7 @@ export default {
           path: '/teacher/u',
           redirect: '',
           name: '(403)关于你教师',
+          component:"@/pages/teacher/u",
           pid: 3
         },
         {
@@ -92,6 +97,7 @@ export default {
           path: '/teacher/m',
           redirect: '',
           name: '关于我教师',
+          component:"@/pages/teacher/m",
           pid: 3
         },
         {
@@ -100,6 +106,7 @@ export default {
           path: '/teacher/um',
           redirect: '',
           name: '关于你和我教师',
+          component:"@/pages/teacher/um",
           pid: 3
         }
       ]

mock/user.ts

@@ -145,14 +145,14 @@ const userApi = {
           key: '2',
           name: '关于',
           path: '/about',
-          redirect: '/about/m',
+          redirect: '',
           children: [
             {
               id: 21,
               key: '2-1',
               name: '关于你',
               path: '/about/u',
-              redirect: '/about/u/1',
+              redirect: '',
               pid: 2,
               children: [
                 {
@@ -196,7 +196,7 @@ const userApi = {
           key: '3',
           name: '教师',
           path: '/teacher',
-          redirect: '/teacher/u',
+          redirect: '',
           children: [
             {
               id: 31,

src/assets/upMenu.svg

@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1705300526702" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="23980" width="128" height="128" xmlns:xlink="http://www.w3.org/1999/xlink"><path d="M128 128h768v16H128zM128 320h768v16H128zM128 496h768v16H128z" fill="#707070" p-id="23981"></path><path d="M128.008 508.32l10.323-10.324 387.643 387.642-10.324 10.324z" fill="#707070" p-id="23982"></path><path d="M885.72 498.022l10.324 10.323-387.643 387.643-10.323-10.323z" fill="#707070" p-id="23983"></path></svg>

src/layouts/index.tsx

@@ -13,6 +13,7 @@ import handleGetCurrentLocation from '@/utils/handleGetCurrentLocation';
 import { MenuDataItem, ProLayout } from '@ant-design/pro-components';
 import './index.less'
 import logo from '../assets/logo.svg';
+import upMenu from '@/assets/upMenu.svg'
 import Icon, { DoubleRightOutlined, SmileOutlined } from '@ant-design/icons';
 import { ProfileModelState } from '@/models/global';
 import React from 'react';
@@ -52,7 +53,6 @@ const BasicLayout: FC<{ user: UserModelState, global: ProfileModelState, dispatc
   const [collapsed, setCollapsed] = useState(false);
   const { pathname } = useLocation();
 
-
   const {
     dispatch,
     user: {
@@ -67,10 +67,9 @@ const BasicLayout: FC<{ user: UserModelState, global: ProfileModelState, dispatc
   console.log('props', props);
   console.log('pathname', pathname);
   const validMenuItem = indexValidMenuItemByPath[pathname];
+  console.log('validMenuItem', validMenuItem);
   // const selectedKeys = validMenuItem?.key;
-  const [activeKey, setActiveKey] = useState<string>(validMenuItem?.key || '/')
+  const [activeKey, setActiveKey] = useState<string>(validMenuItem?.path || '/')
-
-  
 
   //Menu中的selectedKeys和openKeys不是一回事:
   //openKeys:
@@ -229,6 +228,9 @@ const BasicLayout: FC<{ user: UserModelState, global: ProfileModelState, dispatc
     }
   ]
 
+  console.log('tabsRoutes', tabsRoutes);
+
+
   return (
     <LayoutWrapper>
       <ProLayout
@@ -310,8 +312,8 @@ const BasicLayout: FC<{ user: UserModelState, global: ProfileModelState, dispatc
               hideAdd
               type="editable-card"
               onChange={(value) => {
-                history.push(value)
+                // history.push(value)
-                setActiveKey(value)
+                // setActiveKey(value)
               }}
               activeKey={activeKey}
               onEdit={handleEdit}
@@ -352,7 +354,7 @@ const BasicLayout: FC<{ user: UserModelState, global: ProfileModelState, dispatc
                       e.preventDefault()
 
                     }}>
-                      <img style={{ width: '20px', height: '20px', cursor: 'pointer' }} />
+                      <img style={{ width: '20px', height: '20px', cursor: 'pointer' }} src={upMenu} />
                     </div>
                   </Dropdown >
                 </Tooltip>

src/pages/about/u/index.tsx

@@ -1,14 +1,169 @@
-import { PureComponent } from 'react';
+import { connect } from "umi";
+import React, { useRef, useState } from "react";
+import ProCard from "@ant-design/pro-card";
+import { MenuFoldOutlined } from "@ant-design/icons";
+import type { FormInstance } from "antd";
+import { Button, message, Space, Spin, Tree } from "antd";
+import useRequest from "@ahooksjs/use-request";
+import { getServerpartTree } from "@/services/options";
+import type { ActionType } from "@ant-design/pro-table";
+import ProTable from "@ant-design/pro-table";
 
-class Index extends PureComponent {
 
-  render() {
+const saleRankReport = (props: any) => {
+  const { currentUser } = props
+  const downloadBtnRef = useRef<any>()
+  const actionRef = useRef<ActionType>();
+  const formRef = useRef<FormInstance>();
+  const [reqDetailList, setReqDetailList] = useState<any>(); // 合计项数据源
+  const [printOut, setPrintOut] = useState<any>(); // 打印数据的内容
+  const [collapsible, setCollapsible] = useState<boolean>(false)
+  const [treeView, setTreeView] = useState<any>()
+  const [printIndex, setPrintIndex] = useState<number>(new Date().getTime())
 
-    return (
+
-      <div>/about/u</div>
+  // 树相关的属性和方法
-    );
+  const [selectedId, setSelectedId] = useState<string>()
+  // 导出的加载效果
+  const [showLoading, setShowLoading] = useState<boolean>(false)
+  // 是否显示打印的表格
+  const [showExportTable, setShowExportTable] = useState<boolean>(false)
+  // 查询的条件
+  const [searchParams, setSearchParams] = useState<any>()
+
+  const columns: any = []
+
+  const exportTable = (e) => {
+    e.stopPropagation();                                            // 防止Collapse组件收起
+    const main = document.getElementsByClassName(`saleReportHideBox${printIndex}`)[0]
+    const thead = main.querySelector('thead').cloneNode(true);  // 深克隆DOM节点
+    const tbody = main.querySelector('tbody').cloneNode(true);  // 深克隆DOM节点
+    const container = document.querySelector('#hiddenBox');
+
+    const tempTable = document.createElement('table');
+    tempTable.appendChild(thead);
+    tempTable.appendChild(tbody);
+
+    tempTable.setAttribute('id', 'table-to-xls-saleRankReport');                    // 给table添加id，值与按钮上的table字段对应
+
+    container.appendChild(tempTable);                                // 把创建的节点添加到页面容器中
+
+    setShowLoading(false)
+
+    downloadBtnRef.current.handleDownload();
+    setShowExportTable(false)
+    tempTable.remove() // 防止重复打印一个内容
   }
 
+
+  return (
+    <div ref={(el) => {
+      // 打印报表
+      if (!reqDetailList || reqDetailList.length === 0) return;
+      setPrintOut(el);
+    }} >
+
+      {
+        showLoading ?
+          <div
+            style={{
+              width: '100%',
+              height: '100%',
+              background: 'rgba(0,0,0,0.1)',
+              position: 'fixed',
+              zIndex: 5,
+              display: 'flex',
+              alignItems: 'center',
+              justifyContent: 'center'
+            }}
+          >
+            <div style={{
+              display: 'flex',
+              alignItems: 'center',
+              justifyContent: 'center',
+              padding: '15px 20px 10px',
+              background: '#fff',
+              borderRadius: '8px',
+              width: '200px'
+            }}>
+              <Spin />
+              <span style={{ marginLeft: '5px' }}>数据导出中...</span>
+            </div>
+          </div> : ''
+      }
+
+      <div className={`saleReportHideBox${printIndex}`} style={{ position: 'fixed', zIndex: -1, top: 0, left: 0 }}>
+        {
+          showExportTable && reqDetailList && reqDetailList.length > 0 ?
+            <ProTable
+              columns={columns}
+              dataSource={reqDetailList}
+              pagination={false}
+              expandable={{
+                defaultExpandAllRows: true
+              }}
+            /> : ''
+        }
+      </div>
+      <div id='hiddenBox' style={{ position: 'fixed', zIndex: -1, top: 0, left: 0 }} />
+
+      <div style={{ backgroundColor: '#fff', display: 'flex' }}>
+        <div style={{
+          width: !collapsible ? 'calc(100% - 300px)' : 'calc(100% - 60px)',
+          paddingTop: 0,
+          paddingBottom: 0,
+          paddingRight: 0
+        }}>
+          <ProTable
+            actionRef={actionRef}
+            formRef={formRef}
+            columns={columns}
+            bordered
+            expandable={{
+              expandRowByClick: true
+            }}
+            headerTitle={<span style={{ color: "#1890ff", fontSize: 14, fontWeight: 600 }}>单品销售排行统计</span>}
+            search={{ span: 6 }}
+            request={async (params) => {
+              if (!selectedId) {
+                return
+              }
+
+              setSearchParams(params)
+            }}
+            toolbar={{
+              actions: [
+                <span style={{ visibility: 'hidden' }}>
+
+                </span>,
+                <Button
+                  key="new"
+                  type="primary"
+                  onClick={(e) => {
+                    if (reqDetailList && reqDetailList.length > 0) {
+                      setShowLoading(true)
+                      setTimeout(() => {
+                        setShowExportTable(true)
+                        setTimeout(() => {
+                          exportTable(e)
+                        }, 100)
+                      }, 100)
+                    } else {
+                      message.error('暂无数据可导出！')
+                    }
+                  }}
+                >
+                  导出excel
+                </Button>
+              ]
+            }}
+          />
+        </div>
+      </div>
+    </div>
+  )
 }
 
-export default Index;
+export default connect(({ user }: ConnectState) => ({
+  currentUser: user.currentUser
+}))(saleRankReport);