fix: 修正二级弹窗拖拽预览偏移量问题

packages/app/src/components/modal/index.module.css

@@ -124,6 +124,7 @@
 }
 
 .page-dialog {
+  position: relative;
   display: flex;
   flex-direction: column;
   width: 100%;
@@ -133,6 +134,9 @@
 }
 
 .page-dialog-close {
+  position: absolute;
+  top: 0;
+  right: 0;
   display: flex;
   align-items: center;
   justify-content: flex-end;

packages/app/src/components/table/header-th/index.tsx

@@ -7,9 +7,10 @@ import {useSortable} from '@dnd-kit/sortable';
 type Props = {
   header: Header<Record<string, any>, unknown>;
   useDiv?: boolean;
+  isSecondLevel?: boolean;
 };
 
-const HeaderTh: FC<Props> = function ({header, useDiv}) {
+const HeaderTh: FC<Props> = function ({header, useDiv, isSecondLevel}) {
   const {fixed, disabledSort} = header.column.columnDef.meta as {
     fixed: boolean;
     disabledSort: boolean;
@@ -39,7 +40,9 @@ const HeaderTh: FC<Props> = function ({header, useDiv}) {
         ref={setNodeRef}
         {...attributes}
         {...listeners}
-        className={classNames(css.tableHeadTh)}
+        className={classNames(css.tableHeadTh, {
+          [css.previewTransform]: isSecondLevel,
+        })}
       >
         {header.isPlaceholder
           ? null

packages/app/src/components/table/index.module.css

@@ -39,6 +39,10 @@
   text-align: center;
 }
 
+.preview-transform {
+  transform: translate3d(-5vw, -5vh, 0) !important;
+}
+
 .table-head-th {
   position: relative;
   min-width: 0;
@@ -52,9 +56,12 @@
   background-color: #fafafa;
   border-inline-end: 1px solid #f0f0f0;
   border-bottom: 1px solid #f0f0f0;
-  border-start-start-radius: 8px;
   transition: background 0.2s ease;
 
+  &:first-child {
+    border-start-start-radius: 8px;
+  }
+
   &:last-child {
     border-start-end-radius: 8px;
   }

packages/app/src/components/table/index.tsx

@@ -36,6 +36,7 @@ type Props<T> = {
   'data-testid'?: string;
   pageSizeList?: string[];
   preloadKey?: string;
+  isSecondLevel?: boolean;
 };
 
 function Table<T extends Record<string, any>>(props: Props<T>): ReactElement {
@@ -47,6 +48,7 @@ function Table<T extends Record<string, any>>(props: Props<T>): ReactElement {
     count,
     pageSizeList = PAGE_SIZE_LIST,
     preloadKey,
+    isSecondLevel,
   } = props;
   const [{page, pageSize}, {onPageChange}] = usePage(pageContext);
   const [isSearching] = useTableSearchState(searchContext);
@@ -143,7 +145,13 @@ function Table<T extends Record<string, any>>(props: Props<T>): ReactElement {
               </tbody>
             </table>
             <DragOverlay>
-              {active ? <HeaderTh header={active} useDiv /> : null}
+              {active ? (
+                <HeaderTh
+                  header={active}
+                  useDiv
+                  isSecondLevel={isSecondLevel}
+                />
+              ) : null}
             </DragOverlay>
           </SortableContext>
         </DndContext>

packages/app/src/pages/container-scrap/table/index.tsx

@@ -79,6 +79,7 @@ const TableList: FC = function () {
         searchContext={searchContext}
         count={count}
         preloadKey={PRELOAD_KEY}
+        isSecondLevel
       />
     </Card>
   );

packages/app/src/pages/deliver-trace-sn/table/index.tsx

@@ -56,6 +56,7 @@ const TableList: FC = function () {
         searchContext={searchContext}
         data-testid='deliver_trace_sn_table'
         preloadKey={PRELOAD_KEY}
+        isSecondLevel
       />
     </Card>
   );

packages/app/src/pages/inventory-detail/table/index.tsx

@@ -84,6 +84,7 @@ const TableList: FC = function () {
         data-testid='inventory_detail_table'
         pageSizeList={MODAL_PAGE_SIZE_LIST}
         preloadKey={PRELAOD_KEY}
+        isSecondLevel
       />
     </Card>
   );

packages/app/src/pages/inventory-log/table/index.tsx

@@ -72,6 +72,7 @@ const TableList: FC = function () {
         data-testid='inventory_log_table'
         pageSizeList={MODAL_PAGE_SIZE_LIST}
         preloadKey={PRELAOD_KEY}
+        isSecondLevel
       />
     </Card>
   );

packages/app/src/pages/menu-id/table/index.tsx

@@ -40,6 +40,7 @@ const TableList: FC = function () {
           count={count}
           pageSizeList={MODAL_PAGE_SIZE_LIST}
           preloadKey={PRELOAD_KEY}
+          isSecondLevel
         />
       </Card>
       <MenuModal

packages/app/src/styles/modal.css

@@ -15,6 +15,7 @@
 .ReactModal__Content {
   position: static !important;
   padding: 0 !important;
+  overflow: hidden !important;
   border-radius: 10px;
   transition: transform 200ms ease-in-out !important;
   transform: translateY(30px);