chore: preview field use switch

src/components/seal-form/config/components.ts

@@ -2,6 +2,7 @@ import { Checkbox } from 'antd';
 import SealInput from '../seal-input';
 import SealSelect from '../seal-select';
 import Slider from '../seal-slider';
+import Switch from '../seal-switch';
 
 const components: {
   InputNumber: typeof SealInput.Number;
@@ -10,13 +11,15 @@ const components: {
   TextArea: typeof SealInput.TextArea;
   Input: typeof SealInput.Input;
   Checkbox: typeof Checkbox;
+  Switch: typeof Switch;
 } = {
   InputNumber: SealInput.Number,
   Select: SealSelect,
   Slider: Slider as React.ComponentType<typeof Slider>,
   TextArea: SealInput.TextArea,
   Input: SealInput.Input,
-  Checkbox: Checkbox
+  Checkbox: Checkbox,
+  Switch: Switch
 };
 
 export default components;

src/components/seal-form/seal-switch.tsx

@@ -0,0 +1,71 @@
+import { Form, Switch, type SwitchProps } from 'antd';
+import React from 'react';
+import styled from 'styled-components';
+import LabelInfo from './components/label-info';
+import Wrapper from './wrapper';
+
+const Inner = styled.div`
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  width: 100%;
+  padding-inline: 14px;
+  .ant-switch {
+    margin-top: 0 !important;
+  }
+`;
+
+interface SealSwitchProps extends SwitchProps {
+  required?: boolean;
+  label?: React.ReactNode;
+  labelWidth?: number | string;
+  description?: string;
+  isInFormItems?: boolean;
+  checkStatus?: 'success' | 'error' | 'warning' | '';
+}
+
+const SealSlider: React.FC<SealSwitchProps> = (props) => {
+  const {
+    label,
+    value,
+    required,
+    description,
+    isInFormItems = true,
+    defaultValue,
+    checkStatus,
+    labelWidth,
+    ...rest
+  } = props;
+
+  let status = '';
+  if (isInFormItems) {
+    const statusData = Form?.Item?.useStatus?.();
+    status = statusData?.status || '';
+  }
+
+  const handleChange = (value: boolean, event: any) => {
+    props.onChange?.(value, event);
+  };
+
+  return (
+    <Wrapper
+      required={required}
+      status={checkStatus || status}
+      className="no-focus"
+    >
+      <Inner>
+        <LabelInfo label={label} description={description}></LabelInfo>
+        <Switch
+          {...rest}
+          size="small"
+          defaultValue={defaultValue}
+          style={{ marginBottom: 0, marginTop: 16, marginInline: 0 }}
+          value={value}
+          onChange={handleChange}
+        ></Switch>
+      </Inner>
+    </Wrapper>
+  );
+};
+
+export default SealSlider;

src/components/seal-form/wrapper/index.tsx

@@ -52,7 +52,7 @@ const WrapperBox = styled.div`
     border-color: var(--ant-input-hover-border-color);
     transition: all 0.2s ease;
   }
-  &:focus-within {
+  &:focus-within:not(.no-focus, .borderless) {
     border-color: var(--ant-input-active-border-color);
     box-shadow: var(--ant-input-active-shadow);
     outline: 0;

src/locales/zh-CN/models.ts

@@ -127,9 +127,9 @@ export default {
   'models.form.restart.onerror.tips': '当发生错误时，将自动尝试恢复',
   'models.form.check.params': '正在校验配置...',
   'models.form.check.passed': '兼容性检查通过',
-  'models.form.check.claims': '该模型大约需要 {vram} 显存和 {ram} 内存。',
-  'models.form.check.claims2': '该模型大约需要 {vram} 显存。',
-  'models.form.check.claims3': '该模型大约需要 {ram} 内存。',
+  'models.form.check.claims': '该模型大约需要分配 {vram} 显存和 {ram} 内存。',
+  'models.form.check.claims2': '该模型大约需要分配 {vram} 显存。',
+  'models.form.check.claims3': '该模型大约需要分配 {ram} 内存。',
   'models.form.update.tips': '更改仅在删除并重新创建实例后生效。',
   'models.table.download.progress': '下载进度',
   'models.table.button.apiAccessInfo': 'API 接入信息',

src/pages/playground/components/ground-images.tsx

@@ -145,13 +145,8 @@ const GroundImages: React.FC<MessageProps> = forwardRef((props, ref) => {
       chunk_size: 16 * 1024,
       chunk_results: true
     };
-    if (parameters.preview === 'preview') {
-      stream_options = {
-        preview: true
-      };
-    }
 
-    if (parameters.preview === 'preview_faster') {
+    if (parameters.preview) {
       stream_options = {
         preview_faster: true
       };

src/pages/playground/components/image-edit.tsx

@@ -170,13 +170,8 @@ const GroundImages: React.FC<MessageProps> = forwardRef((props, ref) => {
       stream_options_chunk_size: 16 * 1024,
       stream_options_chunk_result: true
     };
-    if (parameters.preview === 'preview') {
-      stream_options = {
-        stream_options_preview: true
-      };
-    }
 
-    if (parameters.preview === 'preview_faster') {
+    if (parameters.preview) {
       stream_options = {
         stream_options_preview_faster: true
       };

src/pages/playground/config/params-config.ts

@@ -423,6 +423,7 @@ export const ImageAdvancedParamsConfig: ParamsSchema[] = [
       isLocalized: true
     },
     attrs: {
+      scaleSize: true,
       trim: false,
       autoSize: { minRows: 2, maxRows: 2 }
     },
@@ -433,20 +434,12 @@ export const ImageAdvancedParamsConfig: ParamsSchema[] = [
     ]
   },
   {
-    type: 'Select',
+    type: 'Switch',
     name: 'preview',
-    options: [
-      { label: 'Faster', value: 'preview_faster' },
-      { label: 'Normal', value: 'preview' },
-      { label: 'common.options.none', value: null, locale: true }
-    ],
     label: {
       text: 'Preview',
       isLocalized: false
     },
-    attrs: {
-      allowNull: true
-    },
     rules: [
       {
         required: false

src/pages/playground/config/types.ts

@@ -29,7 +29,8 @@ type SchemaType =
   | 'Slider'
   | 'TextArea'
   | 'Checkbox'
-  | 'Textarea';
+  | 'Textarea'
+  | 'Switch';
 
 export interface ParamsSchema {
   type: SchemaType;