feat: yaml editor

src/pages/llmodels/components/column-wrapper.tsx

@@ -1,50 +0,0 @@
-import useOverlayScroller from '@/hooks/use-overlay-scroller';
-import React from 'react';
-import '../style/column-wrapper.less';
-
-const ColumnWrapper: React.FC<any> = ({
-  children,
-  footer,
-  maxHeight,
-  paddingBottom = 50
-}) => {
-  const scroller = React.useRef<any>(null);
-  const { initialize } = useOverlayScroller({
-    options: {
-      scrollbars: {
-        autoHide: 'move'
-      }
-    }
-  });
-
-  React.useEffect(() => {
-    if (scroller.current) {
-      initialize(scroller.current);
-    }
-  }, []);
-
-  return (
-    <>
-      {footer ? (
-        <div className="column-wrapper-footer">
-          <div className="column-wrapper" ref={scroller} style={{ maxHeight }}>
-            <div
-              style={{
-                paddingBottom: paddingBottom
-              }}
-            >
-              {children}
-            </div>
-          </div>
-          {<div className="footer">{footer}</div>}
-        </div>
-      ) : (
-        <div className="column-wrapper" ref={scroller} style={{ maxHeight }}>
-          <div>{children}</div>
-        </div>
-      )}
-    </>
-  );
-};
-
-export default ColumnWrapper;

src/pages/llmodels/components/data-form.tsx

@@ -161,7 +161,6 @@ const DataForm: React.FC<DataFormProps> = forwardRef((props, ref) => {
         form={form}
         onFinish={handleOk}
         preserve={false}
-        style={{ padding: '16px 24px' }}
         clearOnDestroy={true}
         onValuesChange={handleOnValuesChange}
         scrollToFirstError={true}

src/pages/llmodels/components/deploy-builtin-modal.tsx

@@ -8,6 +8,7 @@ import { Button } from 'antd';
 import _ from 'lodash';
 import React, { useEffect, useMemo, useRef, useState } from 'react';
 import styled from 'styled-components';
+import ColumnWrapper from '../../_components/column-wrapper';
 import { queryCatalogItemSpec } from '../apis';
 import {
   defaultFormValues,
@@ -21,7 +22,6 @@ import { CatalogSpec, FormData, ListItem, SourceType } from '../config/types';
 import { generateGPUIds } from '../config/utils';
 import { useCheckCompatibility } from '../hooks';
 import useFormInitialValues from '../hooks/use-form-initial-values';
-import ColumnWrapper from './column-wrapper';
 import CompatibilityAlert from './compatible-alert';
 import DataForm from './data-form';
 

src/pages/llmodels/components/deploy-modal.tsx

@@ -7,6 +7,7 @@ import { Button } from 'antd';
 import _ from 'lodash';
 import { FC, useCallback, useEffect, useMemo, useRef, useState } from 'react';
 import styled from 'styled-components';
+import ColumnWrapper from '../../_components/column-wrapper';
 import { defaultFormValues, deployFormKeyMap, modelSourceMap } from '../config';
 import { backendOptionsMap } from '../config/backend-parameters';
 import { BackendOption, FormData, SourceType } from '../config/types';
@@ -17,7 +18,6 @@ import {
   useSelectModel
 } from '../hooks';
 import useCheckBackend from '../hooks/use-check-backend';
-import ColumnWrapper from './column-wrapper';
 import CompatibilityAlert from './compatible-alert';
 import DataForm from './data-form';
 import GGUFResult from './gguf-result';

src/pages/llmodels/components/table-list.tsx

@@ -13,7 +13,7 @@ import useTableRowSelection from '@/hooks/use-table-row-selection';
 import useTableSort from '@/hooks/use-table-sort';
 import { ListItem as WorkerListItem } from '@/pages/resources/config/types';
 import { handleBatchRequest } from '@/utils';
-import { DownOutlined, SyncOutlined } from '@ant-design/icons';
+import { DownOutlined, SearchOutlined, SyncOutlined } from '@ant-design/icons';
 import { PageContainer } from '@ant-design/pro-components';
 import { useIntl, useNavigate } from '@umijs/max';
 import { useMemoizedFn } from 'ahooks';
@@ -579,6 +579,11 @@ const Models: React.FC<ModelsProps> = ({
           left={
             <Space>
               <Input
+                prefix={
+                  <SearchOutlined
+                    style={{ color: 'var(--ant-color-text-placeholder)' }}
+                  ></SearchOutlined>
+                }
                 placeholder={intl.formatMessage({ id: 'common.filter.name' })}
                 style={{ width: 160 }}
                 size="large"

src/pages/llmodels/components/update-modal.tsx

@@ -4,6 +4,7 @@ import { useIntl } from '@umijs/max';
 import { Button, Modal } from 'antd';
 import _ from 'lodash';
 import React, { useEffect, useMemo, useRef } from 'react';
+import ColumnWrapper from '../../_components/column-wrapper';
 import {
   deployFormKeyMap,
   modelSourceMap,
@@ -14,7 +15,6 @@ import { backendOptionsMap } from '../config/backend-parameters';
 import { BackendOption, FormData } from '../config/types';
 import { generateGPUSelector } from '../config/utils';
 import { useCheckCompatibility } from '../hooks';
-import ColumnWrapper from './column-wrapper';
 import CompatibilityAlert from './compatible-alert';
 import DataForm from './data-form';