修复流程设计里预览的表单效果

src/components/ProcessDesigner.tsx

@@ -136,7 +136,7 @@ import {
   FireOutlined as FireIconOutlined,
   ThunderboltOutlined as ThunderboltIconOutlined,
 } from '@ant-design/icons';
-import { Button, Input, Select, Checkbox, Tabs, Modal, Dropdown, Popover, message, Card, Alert, InputNumber, Radio, DatePicker, Form as AntdForm, Cascader, Upload, Switch, Tooltip } from 'antd';
+import { Button, Input, Select, Checkbox, Tabs, Modal, Dropdown, Popover, message, Card, Alert, InputNumber, Radio, DatePicker, TimePicker, Form as AntdForm, Cascader, Upload, Switch, Tooltip } from 'antd';
 import type { MenuProps } from 'antd';
 import { toast } from 'sonner';
 import { workflowDesignApi, WorkflowDesignVO } from '../api/WorkflowDesign';
@@ -4078,11 +4078,14 @@ export default function ProcessDesigner() {
         ]}
         width={960}
         style={{ top: 20 }}
-        styles={{ body: { maxHeight: 'calc(90vh - 120px)', overflowY: 'auto', overflowX: 'hidden' } }}
       >
-        <div className="p-4">
+        <div className="p-2">
           {(() => {
-            const formConfig = formPreviewDetailData.option?.formConfig || defaultFormConfig;
+            // 与表单管理一致：兼容 option.formConfig 或 option 即 formConfig 两种结构
+            const formConfig = {
+              ...defaultFormConfig,
+              ...(formPreviewDetailData.option?.formConfig || formPreviewDetailData.option || {}),
+            };
             const layoutColumns = formConfig.layoutColumns || 1;
             const gridStyle = layoutColumns > 1 ? {
               display: 'grid',
@@ -4181,6 +4184,11 @@ export default function ProcessDesigner() {
                         <Input.TextArea 
                           placeholder={typeof field.placeholder === 'string' ? field.placeholder : '请输入'} 
                           rows={4}
+                          allowClear={field.showClear}
+                          maxLength={field.maxLength}
+                          readOnly={field.readOnly}
+                          disabled={field.disabled}
+                          size={field.size || 'middle'}
                         />
                       </AntdForm.Item>
                     </div>
@@ -4196,7 +4204,14 @@ export default function ProcessDesigner() {
                         labelCol={itemLayout.labelCol}
                         wrapperCol={itemLayout.wrapperCol}
                       >
-                        <InputNumber style={{ width: '100%' }} placeholder={typeof field.placeholder === 'string' ? field.placeholder : '请输入'} />
+                        <InputNumber
+                          style={{ width: '100%' }}
+                          placeholder={typeof field.placeholder === 'string' ? field.placeholder : '请输入'}
+                          max={field.maxLength}
+                          readOnly={field.readOnly}
+                          disabled={field.disabled}
+                          size={field.size || 'middle'}
+                        />
                       </AntdForm.Item>
                     </div>
                   );
@@ -4211,7 +4226,12 @@ export default function ProcessDesigner() {
                         labelCol={itemLayout.labelCol}
                         wrapperCol={itemLayout.wrapperCol}
                       >
-                        <Select placeholder={typeof field.placeholder === 'string' ? field.placeholder : '请选择'}>
+                        <Select
+                          placeholder={typeof field.placeholder === 'string' ? field.placeholder : '请选择'}
+                          allowClear={field.showClear}
+                          disabled={field.disabled}
+                          size={field.size || 'middle'}
+                        >
                           {(field.options || []).map((opt: any, idx: number) => (
                             <Select.Option key={idx} value={opt.value}>{opt.label}</Select.Option>
                           ))}
@@ -4230,7 +4250,79 @@ export default function ProcessDesigner() {
                         labelCol={itemLayout.labelCol}
                         wrapperCol={itemLayout.wrapperCol}
                       >
-                        <DatePicker style={{ width: '100%' }} placeholder={typeof field.placeholder === 'string' ? field.placeholder : '请选择日期'} />
+                        <DatePicker
+                          style={{ width: '100%' }}
+                          placeholder={typeof field.placeholder === 'string' ? field.placeholder : '请选择日期'}
+                          allowClear={field.showClear}
+                          disabled={field.disabled}
+                          size={field.size || 'middle'}
+                        />
+                      </AntdForm.Item>
+                    </div>
+                  );
+                case 'daterange':
+                  return (
+                    <div key={field.id} style={spanStyle}>
+                      <AntdForm.Item
+                        label={(field.label || field.title || '') + (formConfig.labelSuffix || '')}
+                        name={field.name || field.field}
+                        required={field.required && !formConfig.hideRequiredMark}
+                        help={field.hint}
+                        labelCol={itemLayout.labelCol}
+                        wrapperCol={itemLayout.wrapperCol}
+                      >
+                        <DatePicker.RangePicker
+                          style={{ width: '100%' }}
+                          placeholder={Array.isArray(field.placeholder) ? field.placeholder : ['开始日期', '结束日期']}
+                          allowClear={field.showClear}
+                          disabled={field.disabled}
+                          size={field.size || 'middle'}
+                        />
+                      </AntdForm.Item>
+                    </div>
+                  );
+                case 'datetime':
+                  return (
+                    <div key={field.id} style={spanStyle}>
+                      <AntdForm.Item
+                        label={(field.label || field.title || '') + (formConfig.labelSuffix || '')}
+                        name={field.name || field.field}
+                        required={field.required && !formConfig.hideRequiredMark}
+                        help={field.hint}
+                        labelCol={itemLayout.labelCol}
+                        wrapperCol={itemLayout.wrapperCol}
+                      >
+                        <DatePicker
+                          style={{ width: '100%' }}
+                          placeholder={typeof field.placeholder === 'string' ? field.placeholder : '请选择日期时间'}
+                          showTime={{ format: 'HH:mm:ss' }}
+                          format="YYYY-MM-DD HH:mm:ss"
+                          allowClear={field.showClear}
+                          disabled={field.disabled}
+                          size={field.size || 'middle'}
+                        />
+                      </AntdForm.Item>
+                    </div>
+                  );
+                case 'timepicker':
+                  return (
+                    <div key={field.id} style={spanStyle}>
+                      <AntdForm.Item
+                        label={(field.label || field.title || '') + (formConfig.labelSuffix || '')}
+                        name={field.name || field.field}
+                        required={field.required && !formConfig.hideRequiredMark}
+                        help={field.hint}
+                        labelCol={itemLayout.labelCol}
+                        wrapperCol={itemLayout.wrapperCol}
+                      >
+                        <TimePicker
+                          style={{ width: '100%' }}
+                          placeholder={typeof field.placeholder === 'string' ? field.placeholder : '请选择时间'}
+                          format="HH:mm:ss"
+                          allowClear={field.showClear}
+                          disabled={field.disabled}
+                          size={field.size || 'middle'}
+                        />
                       </AntdForm.Item>
                     </div>
                   );
@@ -4244,7 +4336,7 @@ export default function ProcessDesigner() {
                         labelCol={itemLayout.labelCol}
                         wrapperCol={itemLayout.wrapperCol}
                       >
-                        <Switch />
+                        <Switch disabled={field.disabled} />
                       </AntdForm.Item>
                     </div>
                   );