增加审批组件

frontend/src/components/FormDesigner/Designer.tsx

@@ -354,10 +354,10 @@ const FormDesigner: React.FC<FormDesignerProps> = ({
           if (over.id === 'canvas' || over.id === 'canvas-bottom' || overData?.isBottom) {
             newFields.push(newField);
           } else {
-            // 如果拖到某个字段上，插入到该字段之后
+            // 如果拖到某个字段上，插入到该字段之前（修复拖拽插入位置bug）
             const overIndex = newFields.findIndex((f) => f.id === over.id);
             if (overIndex >= 0) {
-              newFields.splice(overIndex + 1, 0, newField); // 插入到目标字段之后
+              newFields.splice(overIndex, 0, newField); // 插入到目标字段之前
             } else {
               newFields.push(newField);
             }

frontend/src/components/FormDesigner/components/FieldRenderer.tsx

@@ -86,7 +86,20 @@ const FieldRenderer: React.FC<FieldRendererProps> = ({
 
   // 布局组件特殊处理
   if (field.type === 'divider') {
-    return <Divider>{field.label}</Divider>;
+    const showText = field.showText !== false; // 默认显示文字
+    const dividerText = field.dividerText || field.label || '分割线';
+    const dividerColor = field.dividerColor || 'rgba(5, 5, 5, 0.06)';
+    
+    return (
+      <Divider 
+        style={{ 
+          borderColor: dividerColor,
+          color: dividerColor,
+        }}
+      >
+        {showText ? dividerText : null}
+      </Divider>
+    );
   }
 
   if (field.type === 'text') {

frontend/src/components/FormDesigner/components/PropertyPanel.tsx

@@ -352,6 +352,20 @@ const PropertyPanel: React.FC<PropertyPanelProps> = ({
           </>
         )}
 
+        {selectedField.type === 'divider' && (
+          <>
+            <Form.Item label="显示文字" name="showText" valuePropName="checked">
+              <Switch />
+            </Form.Item>
+            <Form.Item label="分割线文字" name="dividerText">
+              <Input placeholder="请输入分割线文字" />
+            </Form.Item>
+            <Form.Item label="分割线颜色" name="dividerColor">
+              <Input type="color" style={{ width: '100%' }} />
+            </Form.Item>
+          </>
+        )}
+
         {selectedField.type === 'grid' && (
           <>
             <Divider style={{ margin: '16px 0' }} />

frontend/src/components/FormDesigner/config.ts

@@ -73,7 +73,11 @@ export const COMPONENT_LIST: ComponentMeta[] = [
     label: '分割线',
     icon: MinusOutlined,
     category: '布局字段',
-    defaultConfig: {},
+    defaultConfig: {
+      showText: true,      // 是否显示文字
+      dividerText: '分割线', // 分割线中间的文字
+      dividerColor: 'rgba(5, 5, 5, 0.06)', // 分割线颜色（默认为 Ant Design 的分割线颜色）
+    },
   },
   // 基础字段
   {

frontend/src/components/FormDesigner/types.ts

@@ -135,6 +135,9 @@ export interface FieldConfig {
   textAlign?: 'left' | 'center' | 'right'; // 文字对齐方式（用于 text 组件）
   fontSize?: number; // 文字大小（用于 text 组件）
   textColor?: string; // 文字颜色（用于 text 组件）
+  showText?: boolean; // 是否显示文字（用于 divider 组件）
+  dividerText?: string; // 分割线文字（用于 divider 组件）
+  dividerColor?: string; // 分割线颜色（用于 divider 组件）
   checkboxLayout?: 'horizontal' | 'vertical'; // 多选框布局方式（horizontal:行内，vertical:块级）
   columns?: number; // 栅格列数（用于 grid 组件）
   columnSpans?: number[]; // 栅格每列宽度（用于 grid 组件，如 [2, 18, 2]，总和不超过24）