fix: table colunms fallback

arextest · Nov 12, 2024 · 29e6352 · 29e6352
1 parent 3ac0e08
commit 29e6352
Show file tree

Hide file tree

Showing 3 changed files with 11 additions and 6 deletions.
diff --git a/packages/arex/src/components/MenuSelect.tsx b/packages/arex/src/components/MenuSelect.tsx
@@ -35,6 +35,9 @@ const MenuList = styled(Menu, {
 }>`
   border: none !important;
   background: transparent !important;
+  .ant-menu-title-content {
+    width: 100%;
+  }
   .ant-menu-item {
     color: ${(props) => props.theme.colorTextSecondary}!important;
     padding-left: 8px;

diff --git a/packages/arex/src/menus/Replay.tsx b/packages/arex/src/menus/Replay.tsx
@@ -70,8 +70,8 @@ const MenuItem = styled((props: MenuItemProps) => {
     </SpaceBetweenWrapper>
   );
 })`
+  width: 100%;
   .menu-item-heart {
-    padding-right: 8px;
     .menu-item-heart-outlined {
       opacity: 0;
       transition: opacity ease 0.3s;

diff --git a/packages/arex/src/panes/AppSetting/CompareConfigNew/ConfigInfoTable.tsx b/packages/arex/src/panes/AppSetting/CompareConfigNew/ConfigInfoTable.tsx
@@ -58,17 +58,19 @@ export default function ConfigInfoTable<T extends ComparisonConfigInfo>(
     fallback?: ReactNode | ((record: T) => ReactNode),
   ): ColumnType<T> => ({
     filterDropdown: ({ setSelectedKeys, selectedKeys, confirm, clearFilters }) => (
-      <div style={{ padding: 12 }}>
+      <div style={{ padding: '12px' }}>
         <Input
+          allowClear
+          size='small'
           ref={searchInput}
           placeholder={`Search ${dataIndex.toString()}`}
           value={selectedKeys[0]}
           onChange={(e) => setSelectedKeys(e.target.value ? [e.target.value] : [])}
           onPressEnter={() => handleSearch(selectedKeys as string[], confirm, dataIndex.toString())}
-          style={{ marginBottom: 8, display: 'block' }}
+          style={{ width: '160px' }}
         />
 
-        <div style={{ display: 'flex', justifyContent: 'space-between', marginTop: '12px' }}>
+        <div style={{ display: 'flex', justifyContent: 'space-between', marginTop: '8px' }}>
           <Button
             size='small'
             onClick={() => {
@@ -80,11 +82,11 @@ export default function ConfigInfoTable<T extends ComparisonConfigInfo>(
                   draft[dataIndex as string] = '';
                 }
               });
+              handleSearch([''], confirm, dataIndex.toString());
             }}
           >
             {t('common:reset')}
           </Button>
-
           <Button
             size='small'
             type='primary'
@@ -108,7 +110,7 @@ export default function ConfigInfoTable<T extends ComparisonConfigInfo>(
         ? String(record[dataIndex])?.toLowerCase().includes(value.toString().toLowerCase())
         : false,
     onFilterDropdownOpenChange: (open: boolean) => {
-      open && setTimeout(() => searchInput.current?.select(), 100);
+      open && setTimeout(() => searchInput.current?.focus(), 100);
     },
     render: (text: string | null, record) => {
       const columnsSearchValue = search?.[dataIndex as string];