component_props 配置规范

通用属性

所有组件类型都支持的属性：

属性	类型	必填	默认值	说明
tag	string	✅	-	组件类型标识，决定渲染哪个组件
name	string	✅	-	组件名称
label	string	✅	-	字段标签（显示名称）
default	any	❌	-	默认值
placeholder	string	❌	"请输入"	占位符文本
required	boolean	❌	false	是否必填
disabled	boolean	❌	false	是否隐藏字段
disabled_show	boolean	❌	false	隐藏时是否显示闭眼图标
readonly	boolean	❌	false	是否只读
note	string	❌	-	提示文本（支持HTML）

选项类组件属性

Radio、Checkbox、Picker 等组件额外支持：

属性	类型	说明
options	Option[]	选项列表数组
direction	string	排列方向：vertical（垂直）/ horizontal（水平）
align	string	文本对齐：left / center / right

Option 结构

interface Option {
  title: string                  // 显示文本
  value: any                     // 选项值
  checked?: boolean              // 默认选中
  disabled?: boolean             // 禁用状态
  color?: string                 // 选项颜色
  background_color?: string      // 背景色

  // 描述信息
  desc_text?: string             // 描述文本
  desc_type?: string             // "text" 或 "url"
  desc_url?: string              // 描述链接
  desc_btn_name?: string         // 描述按钮名称

  // 补充信息
  is_input?: boolean             // 是否需要补充信息输入
  input_required?: boolean       // 补充信息是否必填
  input_placeholder?: string     // 补充信息占位符
  affix?: string                 // 补充信息值
}

文本输入类属性

input / textarea / number

属性	类型	说明
align	string	文本对齐方式
is_camera_scan	boolean	是否启用微信扫一扫
camera_scan_type	string	扫码类型：ALL_CODE / QR_CODE / BAR_CODE
is_edit_camera_scan_result	boolean	是否允许编辑扫码结果

上传类属性

image_uploader

属性	类型	默认值	说明
max_count	number	9	最大上传数量
max_size	number	10	最大文件大小（MB）
image_type	string	"jpg/..."	允许的图片类型

返回值结构:

{
  key: "image_uploader",
  filed_name: "field_1",
  value: [
    { url: "https://...", name: "image.jpg" }
  ]
}

file_uploader

与 image_uploader 类似，用于普通文件上传。

日期时间类属性

date / time / datetime / calendar

属性	类型	说明
min_date	Date/Date[]	最小可选日期
max_date	Date/Date[]	最大可选日期
formatter	Function	格式化函数

预约控件属性

appointment

复杂配置结构:

{
  tag: "appointment",
  label: "预约时间",
  appointment_title: "选择入寺时间",
  options: [
    {
      title: "03月27日",           // 日期标题
      placeholder: "剩余余量 9878", // 提示信息
      disabled: false,             // 是否禁用该日期
      columns: [                   // 时间段列表
        {
          checked: false,
          disabled: false,
          value: "1",
          text: "16:00-17:30 余1399"
        }
      ]
    }
  ]
}

规则控件属性

rule / multi_rule

属性	类型	说明
desc_text	string	规则内容（支持 \n 换行）
desc_type	string	text（弹窗）或 url（跳转）
desc_url	string	规则详情链接
desc_btn_name	string	按钮名称，如"查看详情"

组集合控件属性

group

{
  tag: "group",
  label: "物品详情",
  field_groups: [
    {
      tag: "input",
      label: "物品描述",
      field_name: "field_10",
      group_field_name: "field_4",  // 所属组字段
      // ... 其他属性
    }
  ]
}

评分控件属性

rate

属性	类型	说明
x_score	number	显示分值（会显示在标签旁）

表格控件属性

table_editor

属性	类型	说明
default	string/html	默认表格内容（HTML格式）

特殊功能属性

微信扫码

仅 input 类型支持：

{
  tag: "input",
  is_camera_scan: true,
  camera_scan_type: "ALL_CODE"  // ALL_CODE | QR_CODE | BAR_CODE
}

补充信息

Radio、Checkbox 支持选择后输入补充信息：

options: [
  {
    title: "其他",
    value: "other",
    is_input: true,              // 启用补充输入
    input_required: true,        // 补充信息必填
    input_placeholder: "请输入补充信息",
    affix: ""                    // 补充信息值
  }
]

显示隐藏控制

通过规则动态控制字段显示/隐藏：

{
  tag: "input",
  disabled: false  // true=隐藏，false=显示
}

样式属性

对齐方式

{
  align: "left"    // left | center | right
}

颜色

选项类组件支持单独配置颜色：

options: [
  {
    title: "重要",
    value: "important",
    color: "#ff0000",            // 文字颜色
    background_color: "#fff0f0"  // 背景色
  }
]

数据提交格式

普通字段

{
  key: "field_1",
  value: "用户输入的值"
}

选项类字段（Radio）

{
  key: "field_1",
  value: "选项值",
  affix: "补充信息: xxx",  // 如果有补充信息
  type: "radio"
}

选项类字段（Checkbox）

{
  key: "field_1",
  value: ["值1", "值2"],  // 数组
  type: "checkbox"
}

图片上传

{
  key: "field_1",
  filed_name: "field_1",
  value: [
    { url: "https://...", name: "image.jpg" }
  ],
  type: "image_uploader"
}