企业🤖AI Agent构建引擎,智能编排和调试,一键部署,支持私有化部署方案 广告
表单组件通过addWidgets方法传入组件配置数组批量创建。 ~~~ return TBuilder('form',$this) ->addTabGroup('基本信息') ->addWidgets([ //=======================常规form组件======================== // 配置格式: array('','',[[],'']); ['title|text','标题|用于后台显示的配置标题'], ['sort|number','排序|用于分组显示的顺序', ['tip'=>'测试:用于分组显示的顺序'] ], ['icon_class|text','图标类名', ['icon'=>'fa fa-angle-right'] ], ['url|text','链接|U函数解析的URL或者外链'], ['pid|select','上级菜单|所属的上级菜单',[M('Menu')->getTreeMenus(), 'id|title_show']], ['group|text','分组|用于左侧分组二级菜单'], ['cover_id|images', '封面图片'], ['cover_ids|cropper', '封面图片2', ['pic_num'=>2,'pic_wh'=>'100*200'] ], ['tip|text','说明|菜单详细说明'], ['birthday|date', '天'], ['birthday1|datetime', '时'], ['birthday2|dateyear', '年'], ['birthday3|datemonth', '月'], ['tags|tags', '标签',], ['id|hidden'], ['type2|checkbox','多选|多选测试',[config('CONFIG_TYPE_LIST')]], ['type3|radio','单选|单选测试',[config('yes_no')]], ['is_open|switch','配置类型|系统会根据不同类型解析配置值'], ['content|kindeditor', '内容'], //=======================扩展form组件======================== // 配置格式: array('widget_type'=>'','attr'=>'val') ['widget_type'=>'html','content'=>'<p>自定义显示内容</p>'], ['widget_type'=>'title_line','icon_class'=>'iconfont icon-jiexi3','title'=>'分组名称'] ]) ->addTabGroup('访问授权')->addWidgets([ ['menu_auth|tree_checkbox', '访问授权',[$mune_list,'id|title'] ], ]) ->fetch(); ~~~ 每个组件可由四项配置参数,分别对应如下: > /* * 配置值数组: * 参数1:字段名|字段类型|附加样式及属性 * 字段名 * * 字段类型 * val * input * text * number * password * color * radio * images * cropper * checkbox * hidden * select * switch * tree_checkbox * kindeditor * * 附加样式及属性 * .class1,.class2,#id1,attr:attr_val,attr2:attr_val2 * * 例:name|text|.class1,.class2,#id1,attr:attr_val,attr2:attr_val2 * * * * 参数2:字段名称|字段描述 * 参数3:可选数据数组 * 索引数组传值: * 参数1:列表数据数组 * 参数2:列表数组中使用的键值名称 * 关联数组传值: * 【函数处理区】 input * func 对字段处理的函数名称,参数为当前值 * func_param 当存在对字段处理的函数时,此值为为该函数的第二个参数 * config_name 配置参数名。当func为c_name时且func_param未传值,此值可替代func_param。 * 当type为field且可编辑时,此为编辑选择数据源。 * * 【当组件为选项时,对应索引数组传值的参数1和参数2】 select * listdata 列表数据数组 * key_relevance 列表数组中使用的键值名称 * 【更多复杂(扩展)配置】 input * icon 组件展示存在图标的 * tip 组件的tip提示内容 * * 【图片/文件上传】 * limit_num 可上传图片数量(默认1个) * enabled_edit 图片是否可编辑(删除或替换) * ext 指定文件格式,不传不限制 * 【图片裁切】 * pic_wh 指定图片宽高 * pic_ratio 指定图片宽高比 * * 参数4:值 */ 参数1可由三项组成,第三项可传入多个以.开头的为类类型值,以#开头的为id属性值,其余的为自定义属性的键值 ### 字段属性 ~~~ ->addWidgets([ ['report_download|number','报告下载包|考生考试pdf报告下载',[],10], ['short_message_number|number|disabled:true','短信包',[],0], ]) ~~~ ![](https://box.kancloud.cn/a141dddb3cc414a5b3eb34a772cd0230_916x108.png) ### 二级数组支持 ~~~ ->addWidgets([ ['expand_config[free_invite_read_num]|number', '邀请访问免费'], ]) ~~~ ### 富文本组件 kindeditor ~~~ ->addWidgets([ ['description|kindeditor', '详情'], ]) ~~~ ![](https://box.kancloud.cn/d3f621c287db80f678480023cec70e97_1068x440.png) editormd ~~~ ->addWidgets([ ['description|editormd', '详情'], ]) ~~~ ![](https://box.kancloud.cn/ba4c0a1166bb6fcec3da696bb918a1c6_1076x442.png) 展开显示 ~~~ ->addTabGroup('文章详情') ->addWidgets([ ['description|editormd', '详情',['full_show'=>true]], ]) ~~~ ![](https://box.kancloud.cn/044a1d97add3d6b31e995fa42ee75512_1154x489.png)