<@f.code> <#noparse> //输入框组件标签:<@f.input/> //参数: 1. name 控件name 必输 2. id 控件id 不是必输 如果不输则与name名称一样 3. value 控件值 不是必输 默认"" 4. type 控件类型 不是必输 默认 text 多增加 date 5. dataFormat 时间格式化 不是必输 格式化 6. dataType 默认 "date" 时间控件显示类型 date 年月日 year 年 month 年月 datetime 详细时间 6. required 控件在from 不是必输 默认false 表单中是否必输 true为表单中必输 7. class 输入框控件样式 不是必输 默认form-control 8. placeholder 控件输入框提示内容 不是必输 默认"" 9. butClass 控件后面追加图标 不是必输 默认"" 10.helpTip 帮助提示 不是必输 默认"" 11.readonly 控件是否可以编辑 不是必输 默认"" 12.maxlength 控件输入最大长度 不是必输 默认 "" //栗子 🌰 <@f.input name="username" butClass="fa fa-envelope-open" placeholder="请输入登录账号" required=true helpTip="登录账号数字加字母组合,至少3位"/> //表单隐藏域标签:<@f.hidden/> //参数: 1. name 控件name 必输 2. id 控件id 不是必输 如果不输则与name名称一样 3. value 控件值 不是必输 默认"" 4. type 控件类型 不是必输 默认 hidden 5. refresh 隐藏域在from 表单中能否被重置按钮清空 不是必输 默认 true //栗子 🌰 <@f.hidden name="id"/>

<@f.code> <#noparse> //多行文本组件标签: <@f.textarea/> //参数: 1. name 控件name 必输 2. id 控件id 不是必输 如果不输则与name名称一样 3. class 控件样式 不是必输 默认 "form-control" 4. value 控制值 不是必输 默认 "" 5. required 控件在from 不是必输 默认 false 表单中是否必输 true为表单中必输 6. readOnly 控件是否可以修改 不是必输 默认 false 7. rows 控件多行 不是必输 默认 5 //栗子 🌰 <@f.textarea name="text" rows="6"/>

<@f.code> <#noparse> //libs["ueditor"] //百度富文本组件标签:<@f.ueditor/> //参数: 1. name 控件name 必输 2. id 控件id 不是必输 如果不输则与name名称一样 3. bizType 用于关联文件数据库 4. bizId 用于关联文件数据库，管理物理文件 5. value 控件值 不是必输 默认"" 6. readonly 控件是否可以编辑 不是必输 默认 false 7. maxlength 最大输入长度默认不限 不是必输 8. height 控件高度 不是必输 默认"300" 9. type = "html" 获取数据类型 html (整个html的内容), content (内容), txt(纯文本), plaintxt (带格式的纯文本) 10. toolbars="all" 默认工具栏显示所有, text 显示文字信息 //回调函数 //webuploaderRefresh(id,html); //栗子 🌰 <@f.ueditor name="noticeContent" value="${noticeContent?html} /> //bizType和bizId 如果需要富文件上传的文件，被系统数库记录，请使用两个参数与实体类 //由于新增实体时没有id(bizId) 因此需要在打面新增页面前产生id到端，${exampleTest.id} 提交前产生id <@f.ueditor name="remark" value="${(exampleTest.remark?html)?default('')}" height=200 type="content" bizType="example_test" bizId="${exampleTest.id}" />

<@f.code> <#noparse> //附件组件标签:<@f.imageclip/> //参数: 1. name 控件name 必输 id = "" <#-- 控件ID 如果不传则与name一致--> value ="" imageDefault = "${ctxStatic}/static/img/user2-160x160.jpg" <#-- 默认显示--> boxTitle = "" <#-- 弹出框 标题--> tipHelp = "修改图片" ratio = "1/1" <#-- 图片裁剪比例--> viewMode = 0 <#-- 显示模式 0 允许图片无限缩小 1不允许图片缩小到图片本身大小以下--> isClear = true <#-- 是否有清除按钮--> width = 120 <#-- 图片显示宽度--> height = 120 <#-- 图片显示高度--> //栗子 🌰 --- //后台使用：创建或删除物理文件和关联 // 创建 ：exampleTest.setAvatar(FileUploadUtils.saveImgBase64(exampleTest.getAvatar(), "example_test_avatar", exampleTest.getId())); // 在 service 中保存后增加关联关系 //需先生成ID exampleTest.setId(new Sequence().nextId()); //设置avatar url 径路 //图片剪切数据转换 exampleTest.setAvatar(FileUploadUtils.saveImgBase64(exampleTest.getAvatar(), "example_test_avatar", exampleTest.getId())); if(this.save(exampleTest)){ ... ... return true; } // 在 service 中保存后删除关联关系和物理文件 //删除： FileUploadUtils.me().removeFileUpload(id,"example_test_avatar");

<@f.code> <#noparse> //下拉框组件标签: <@f.select/> //参数: 1. name 控件name 必输 2. id 控件id 不是必输 如果不输则与name名称一样 3. class 控件样式 不是必输 默认 "form-control" 4. value 控制值 不是必输 默认 "" 5. required 控件在from 不是必输 默认 false 表单中是否必输 true为表单中必输 6. readOnly 控件是否可以修改 不是必输 默认 false 7. butClass 控件后面追加图标 不是必输 默认"" 8. helpTip 帮助提示 不是必输 默认"" 9. dictType 字典类型，从数据从字典里获取 不是必输 默认"" 10.items 列表数据，可接受对象集合后台传入 不是必输 11.itemLabel 指定列表数据中的什么属性名作为option的标签名 不是必输 12.itemValue 指定列表数据中的什么属性名作为option的value值 不是必输 13.status 检测状态 不是必输 14.multiple 是否多选 不是必输 默认 "false" 单选 15.blankValue 是否默认有个空白选择项目 不是必输 默认"false" 16.blankLabel 空白选择默认值 不是必输 默认"" 17.placeholder 默认输入框提示 不是必输 默认 "请输入" //此组件页面会有回调事件: //回调方法参数: id 回调控件的id,用于区分控件名称,若你的页面有多个下拉框组件 event 回调控件的事件 change data 回调控件的数据 selectCallback(id,event,data); * 如果你需要此回调页面添加此函数 不需要则忽略 //从字典获取栗子 🌰: <@f.select name="status" dictType="sys_normal_disable" blankValue="" blankLabel="所有"/> //从后台传入值栗子 🌰: <@f.select name="roleIdList" multiple = true value="${selectRoles}" items=roles itemLabel="roleName" itemValue="id" required=true/>

<@f.code> <#noparse> //单选按钮组件标签: <@f.radio/> //参数: 1. name 控件name 必输 2. id 控件id 不是必输 如果不输则与name名称一样 3. class 控件样式 不是必输 默认 "radio-box" 4. value 控制值 不是必输 默认 "" 5. required 控件在from 不是必输 默认 false 表单中是否必输 true为表单中必输 6. readOnly 控件是否可以修改 不是必输 默认 false 7. helpTip 帮助提示 不是必输 默认"" 8. dictType 字典类型，从字典里获取 //控件回调事件: //回传参数 id 控件名称, data 回传对象, event 回传事件 redioCallback(id,data,event) * 如果你需要此回调页面添加此函数 不需要则忽略 //栗子 🌰 <@f.radio name="type" dictType="sys_menu_type"/> //多选按钮组件标签: <@f.checkbox/> //参数: 1. name 控件name 必输 2. id 控件id 不是必输 如果不输则与name名称一样 3. class 控件样式 不是必输 默认 "radio-box" 4. value 控制值 不是必输 默认 "" 5. required 控件在from 不是必输 默认 false 表单中是否必输 true为表单中必输 6. status 检测状态 不是必输 默认 status 7. dictType 字典类型，从字典里获取 不是必输 默认"" 8. helpTip 帮助提示 不是必输 默认"" 9.items 列表数据，可接受对象集合后台传入 不是必输 10.itemLabel 指定列表数据中的什么属性名作为option 的标签名 不是必输 11.itemValue 指定列表数据中的什么属性名作为option 的value值 不是必输 //栗子 🌰 <@f.checkbox name="postType" dictType="sys_post_type" required=true/>

<@f.code> <#noparse> //图标选择组件标签: <@f.iconselect/> //参数: 1. name 控件name 必输 2. id 控件id 不是必输 如果不输则与name名称一样 3. class 控件样式 不是必输 默认 "radio-box" 4. value 控制值 不是必输 默认 "" 5. required 控件在from 不是必输 默认 false 表单中是否必输 true为表单中必输 6. readOnly 控件是否可以修改 不是必输 默认 false 7. helpTip 帮助提示 不是必输 默认"" 8. width 弹出窗口宽 不是必输 9. height 弹出窗口高 不是必输 10.isClear 弹出窗体是否有清除按钮 不是必输 11.boxTitle 弹出窗体title 不是必输 //控件回调事件: //回传参数 id 控件名称, data 回传对象, event 回传事件 iconCallback(id,event,index, layero, icon) * 如果你需要此回调页面添加此函数 不需要则忽略 //栗子 🌰 <@f.iconselect name="icon" placeholder="选择图标"/> //switch开关组件标签: <@f.switch/> //参数: 1. name 控件name 必输 2. id 控件id 不是必输 如果不输则与name名称一样 3. value 控制值 不是必输 默认 "" //栗子 🌰 <@f.switch name="status" value="0"/>

<@f.code> <#noparse> //树选择组件标签:<@f.treeselect/> //参数: 1. name 控件name 必输 2. id 控件id 不是必输 如果不输则与name名称一样 3. value 控件值 不是必输 默认"" 4. boxTitle 弹出窗体标题 默认"" 5. width 弹出窗口宽 不是必输 默认"380" 6. height 弹出窗口高 不是必输 默认"" 7. labelValue 页面显示值 不是必输 默认"" 8. checked 树是否多选 不是必输 默认"false" 9. radioType 当checked=false 单选时 控制同级单选互斥还是整个树互斥 all 整个树互斥 level, checked=true 多选此值无效 10.required 控件在from 不是必输 默认false 表单中是否必输 true为表单中必输 11.readonly 控件是否可以编辑 不是必输 默认"" 12.correlationId 控件关联ID 不是必输 13.correlationValue 控件关联值 不是必输 14.expandLevel 是否展开树 默认 false 15.isParentIds 单选是否需要获取树的父节点集合 false 16.parenName 单选父节点集合Name 默认 "parentIds" 17.parenIdsValue 所有父节点集合默认值 18.isSelectParent 是否只能选中叶子节点 false 19.isInput 是否允许手动label框输入 默认 "false" 20.isClear 弹出是否出现清除按钮 默认 "true" 21.placeholder 输入提示 默认 请输入值 22.helpTip 帮助提示 默认 "" //回调函数 //treeCallback(id, event, index, layero, nodes); //栗子 🌰 <@f.treeselect name="compId" boxTitle="请选择归属机构" url="sys/comp/treeData" expandLevel=true placeholder="请选择上级机构"/> //关联 <@f.treeselect name="deptId" boxTitle="请选择归属部门" url="sys/dept/selectZtree" value="${user.deptId?default('')}" labelValue="${user.deptName?default('')}" correlationId="compId" isSelectParent=true placeholder="请选择归属部门"/>

<@f.code> <#noparse> //弹出选择标签(适用于大数据):<@f.tableselect/> //参数: 1. name 控件name 必输 2. id 控件id 不是必输 如果不输则与name名称一样 3. boxTitle 弹窗标题 4. tableInfo 显示表格列信息 必输 tableInfo 说明：字段为JS数组对象 与表格$.table columns 含义相似 { field:'表格字段标签',title:'列表头名称',query:'此列是否做查询',dict:'表格列字典转换' } 5. placeholder 提示值 6. width="1200" 弹出宽度 7. height="" 高度 8. value="" 值 9. labelValue="" 显示值 10. labelName="" <#--标签名称 --> 11. required=false <#-- 是否必输--> 12. readonly 控件是否可以编辑 不是必输 默认"false" 13. checked=true <#-- true多选 false 单选 默认多选 --> 14. class = "form-control" <#-- 输入框样式--> 15. butClass = "fa fa-fw fa-address-card-o" 16. isClear = true <#-- 弹出是否出现清除按钮--> 17. url = "sys/user/list" <#-- 访问数据URL--> 18. keyId = "id" <#--表示获取数据id字段名称 --> 19. keyName = "name" <#--表示显示名称 --> //回调函数 //tableCallback(id, event, index, layero, nodes); //栗子 🌰 <@f.tableselect name="selectuser" boxTitle="多选用户信息" tableInfo = "[{field:'username',title:'账号'},{field:'name',title:'姓名',query: true},{field:'compName',title:'归属公司'}, {field:'deptName',title:'归属机构'},{field:'email',title:'邮箱'},{field:'mobile',title:'手机号码'}, {field:'status',title:'状态',dict:'sys_user_show_hide'},{field:'createTime',title:'创建时间'}]" placeholder="表格弹出式页面，实用于大数据，搜索选择，" />

<@f.code> <#noparse> //libs["ueditor"] //百度富文本组件标签:<@f.ueditor/> //参数: 1. name 控件name 必输 2. id 控件id 不是必输 如果不输则与name名称一样 3. bizType 用于关联文件数据库 4. bizId 用于关联文件数据库，管理物理文件 5. value 控件值 不是必输 默认"" 6. readonly 控件是否可以编辑 不是必输 默认"false" 7. maxlength 最大输入长度默认不限 不是必输 8. height 控件高度 不是必输 默认"300" 9. type = "html" 获取数据类型 html (整个html的内容), content (内容), txt(纯文本), plaintxt (带格式的纯文本) //回调函数 //webuploaderRefresh(id,html); //栗子 🌰 <@f.ueditor name="noticeContent" value="${noticeContent?html} /> //bizType和bizId 如果需要富文件上传的文件，被系统数库记录，请使用两个参数与实体类 //由于新增实体时没有id(bizId) 因此需要在打面新增页面前产生id到端，${exampleTest.id} 提交前产生id <@f.ueditor name="remark" value="${(exampleTest.remark?html)?default('')}" height=200 type="content" bizType="example_test" bizId="${exampleTest.id}" />

<@f.code> <#noparse> //附件组件标签:<@f.fileupload/> //参数: 1. name 控件name 必输 name id = "" bizId = "" 业务ID 用于关联实体 bizType = "" 业务类型 用于关联实体 uploadType = "all" 上传文件类型 image:图片 uploadUrl = "sys/comm/upload" 上传路径， 如果修改需要自己行完成controller fileListUrl = "sys/comm/fileList" 回显查询路径 如果修改需要自己行完成controller downloadUrl = "sys/comm/download" 文件下载路径 如果修改需要自己行完成controller isLazy = true preview = "" maxUploadNum = "300" 最大上传文件数据 //栗子 🌰 --- bizId 业务实体ID ,bizType 业务实体类型(一般使用，表名_文件类型号)：以便多关联附件 // 上传图片： <@f.fileupload name="upload_file" bizId="${exampleTest.id}" bizType="example_test_file" isLazy=true preview="true" uploadType="image"/> // 文件样式上传： <@f.fileupload name="upload_file" bizId="${exampleTest.id}" bizType="example_test_file" isLazy=true preview="true" uploadType="all"/> //后台使用：创建或删除物理文件和关联 // 创建 ：FileUploadUtils.saveFileUpload(pkId,"example_test_img"); // 在 service 中保存后增加关联关系 if(this.save(exampleTest)){ //更新关联附件信息 Long pkId = exampleTest.getId(); FileUploadUtils.saveFileUpload(pkId,"example_test_img"); return true; } // 在 service 中保存后删除关联关系和物理文件 //删除： FileUploadUtils.me().removeFileUpload(id,"example_test_img");

<@f.code> <#noparse> //树表格标签:<@table id="bootstrap-tree-table"/> //参数: 1. id 控件id 必输 2. 与普通表格一样支持上面功能按钮. 例如: <@table id="bootstrap-tree-table"> <@ctx.i18n text = "展开/折叠"/> JS.函数参数简单说明: url: 数据请求url id: 控制对象ID height: 设置表格高度 rootIdValue: 树根节点 id sortName: 排序字段 sortOrder: 默认升序 async: 是否为异步分页加载数据 toolbar: 工具栏名称 striped: false, pageSize: 一页条数 pageList: 分页数据库 asynUrl: 异步点击请求url $.treeTable.init(options); 普通树表实例请看- 机构、公司 业务 异步分页树实例请看- 行政区域 业务