fix(style): compare sroll

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

@@ -219,10 +219,10 @@ const DataForm: React.FC<DataFormProps> = forwardRef((props, ref) => {
             filterOption
             defaultActiveFirstOption
             disabled={action === PageAction.EDIT}
+            options={ollamaModelOptions}
             label={intl.formatMessage({ id: 'model.form.ollama.model' })}
             placeholder={intl.formatMessage({ id: 'model.form.ollamaholder' })}
             required
-            options={ollamaModelOptions}
           ></SealAutoComplete>
         </Form.Item>
       </>

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

@@ -118,7 +118,7 @@ const AddModal: React.FC<AddModalProps> = (props) => {
       width={width}
       footer={false}
     >
-      <div style={{ display: 'flex' }}>
+      <div style={{ display: 'flex', height: '100%' }}>
         {SEARCH_SOURCE.includes(props.source) && (
           <>
             <div style={{ display: 'flex', flex: 1 }}>

src/pages/llmodels/components/gpu-card.tsx

@@ -6,30 +6,40 @@ import '../style/gpu-card.less';
 
 const GPUCard: React.FC<{
   data: any;
-}> = ({ data }) => {
+  header?: React.ReactNode;
+  info?: React.ReactNode;
+}> = ({ data, header, info }) => {
   const intl = useIntl();
   return (
     <div className="gpu-card">
       <div className="header">
-        {data.label}({data.worker_name})[
-        {intl.formatMessage({ id: 'resources.table.index' })}:{data.index}]
+        {header ?? (
+          <>
+            {data.label}({data.worker_name})[
+            {intl.formatMessage({ id: 'resources.table.index' })}:{data.index}]
+          </>
+        )}
       </div>
       <div className="info">
-        <span>
-          {intl.formatMessage({ id: 'resources.table.vram' })}(
-          {intl.formatMessage({ id: 'resources.table.used' })}/
-          {intl.formatMessage({ id: 'resources.table.total' })}):{' '}
-          <span>
-            {convertFileSize(data?.memory?.used || 0)} /{' '}
-            {convertFileSize(data?.memory?.total || 0)}
-          </span>
-        </span>
-        <span>
-          <span>
-            {intl.formatMessage({ id: 'resources.table.gpuutilization' })}:{' '}
-          </span>
-          {_.round(data?.memory?.utilization_rate || 0, 2)}%
-        </span>
+        {info ?? (
+          <>
+            <span>
+              {intl.formatMessage({ id: 'resources.table.vram' })}(
+              {intl.formatMessage({ id: 'resources.table.used' })}/
+              {intl.formatMessage({ id: 'resources.table.total' })}):{' '}
+              <span>
+                {convertFileSize(data?.memory?.used || 0)} /{' '}
+                {convertFileSize(data?.memory?.total || 0)}
+              </span>
+            </span>
+            <span>
+              <span>
+                {intl.formatMessage({ id: 'resources.table.gpuutilization' })}:{' '}
+              </span>
+              {_.round(data?.memory?.utilization_rate || 0, 2)}%
+            </span>
+          </>
+        )}
       </div>
     </div>
   );

src/pages/llmodels/components/model-card.tsx

@@ -111,6 +111,7 @@ const ModelCard: React.FC<{
   const getModelCardData = async () => {
     if (!props.selectedModel.name) {
       setModelData(null);
+      setReadmeText(null);
       return;
     }
     requestToken.current?.cancel?.();
@@ -191,7 +192,7 @@ const ModelCard: React.FC<{
       <div className="card-wrapper">
         {modelData ? (
           <div className="model-card-wrap">
-            <div className="flex-between flex-center">
+            <div className="flex-center">
               {modelData.config?.model_type && (
                 <Tag className="tag-item" color="gold">
                   <span style={{ opacity: 0.65 }}>