Merge branch 'dev' of http://192.168.1.41:3000/outaozhen/cldV2react into dev

src/components/Table/src/hooks/useTableScroll.ts

@@ -26,8 +26,10 @@ export function useTableScroll(
     if (!headEl) return
     // Table height from bottom
     const { bottomIncludeBody } = getViewportOffset(headEl)
+    const tableContainerEl: HTMLElement = tableElRef.current?.querySelector('.ant-table-container')
+    if (!tableContainerEl) return
 
-    const paddingHeight = 24
+    let paddingHeight = 24
 
     let paginationHeight = 0
     if (dataSource && dataSource?.length) {
@@ -47,7 +49,20 @@ export function useTableScroll(
               break
           }
         }
+      } else {
+        // 针对没有分页器的情况，对ant-table-container进行样式调整
+        // TODO: .ant-table-container margin-bottom 16px + border 1px
+        paddingHeight += 17
+
+        tableContainerEl!.style.borderRadius = '2px'
+        tableContainerEl!.style.marginBottom = '16px'
+        tableContainerEl!.style.borderBottom = '1px solid #f0f0f0'
       }
+    } else if (tableContainerEl?.getAttribute('style')) {
+      // TODO: 在已经设置过style的情况下才要取消掉style
+      // tableContainerEl!.removeAttribute('style')
+      tableContainerEl!.style.borderBottom = 'none'
+      paddingHeight += 16
     }
 
     let headerHeight = 0
@@ -72,10 +87,8 @@ export function useTableScroll(
 
     if (!dataSource?.length) {
       // TODO:针对无数据的情况下，特别设置tboody
-      const tbodyEl: HTMLElement = tableElRef.current
-        ?.querySelector('.ant-table-container')
-        ?.querySelector('.ant-table-tbody')
-      const el = tableElRef.current?.querySelector('.ant-table-container')?.querySelector('table')
+      const tbodyEl: HTMLElement = tableContainerEl?.querySelector('.ant-table-tbody')
+      const el = tableContainerEl?.querySelector('table')
       let hasScrollBar = el?.style.width !== '100%'
 
       if (el?.style.width !== '100%') {
@@ -92,8 +105,7 @@ export function useTableScroll(
       tbodyEl && (tbodyEl!.style.height = notDataHeight)
       return
     }
-    const tbodyEl: HTMLElement =
-      tableElRef.current?.querySelector('.ant-table-container')?.children[1]
+    const tbodyEl: HTMLElement = tableContainerEl?.children[1]
     tbodyEl && (tbodyEl!.style.height = `${height}px`)
   }
 

src/components/Table/src/index.less

@@ -8,4 +8,8 @@
   :global(.ant-card-body) {
     padding: 24px 24px 0 24px;
   }
+
+  :global(.ant-table-summary > tr > th, .ant-table-summary > tr > td) {
+    border-bottom: none;
+  }
 }

src/pages/Statistic/Product/InvoiceAggregate/index.jsx

@@ -74,14 +74,14 @@ const InvoiceAggregate = () => {
   }
   return (
     <div className="flex flex-col">
-      {!isMobile() && (
+      {!isMobile() ? (
         <div className="flex flex-row justify-between mb-4">
           <div className="card-transition bg-white w-full">
             {/* {pieData.pieLeft ? <Pie {...leftConfig} /> : null} */}
             {state.list?.length ? <Column {...columnConfig} /> : null}
           </div>
         </div>
-      )}
+      ) : null}
 
       <BasicTable
         manualRequest

src/pages/Statistic/Product/SoftwareUsage/index.jsx

@@ -120,7 +120,7 @@ const Usage = () => {
 
   return (
     <div className="flex flex-col">
-      {!isMobile() && (
+      {!isMobile() ? (
         <div className="flex flex-row justify-between mb-4">
           <div className="card-transition  w-1/2 bg-white mr-2">
             {pieData.pieLeft ? <Pie {...leftConfig} /> : null}
@@ -129,7 +129,7 @@ const Usage = () => {
             {pieData.pieRight ? <Pie {...rightConfig} /> : null}
           </div>
         </div>
-      )}
+      ) : null}
 
       <BasicTable
         manualRequest

src/pages/Statistic/components/OptionSelect.tsx

@@ -15,7 +15,7 @@ type OptionSelectProps = {
 const OptionSelect: React.FC<OptionSelectProps> = ({ onChange }) => {
   const [state, setState] = useState({
     optionType: opMap.STAFF,
-    opIds: null,
+    opIds: [],
     department: [],
     staff: []
   })
@@ -44,16 +44,19 @@ const OptionSelect: React.FC<OptionSelectProps> = ({ onChange }) => {
   )
   return (
     <div>
-      <Select
-        defaultValue="staff"
-        options={[
-          { label: '按部门', value: 'department' },
-          { label: '按员工', value: 'staff' }
-        ]}
-        onChange={val => setState({ ...state, optionType: val })}
-      />
+      <span className="mr-2">
+        <Select
+          defaultValue="staff"
+          options={[
+            { label: '按部门', value: 'department' },
+            { label: '按员工', value: 'staff' }
+          ]}
+          onChange={val => setState({ ...state, optionType: val, opIds: [] })}
+        />
+      </span>
       {state.optionType === opMap.STAFF ? (
         <TreeSelect
+          value={state.opIds}
           className="min-w-180px"
           defaultOpen
           treeCheckable
@@ -64,6 +67,7 @@ const OptionSelect: React.FC<OptionSelectProps> = ({ onChange }) => {
         />
       ) : (
         <TreeSelect
+          value={state.opIds}
           className="min-w-180px"
           defaultOpen
           treeData={state.department}