封面图设置组件
名扬银河数字官网系统的后台单封面图设置组件文档:
一、组件名称:封面图设置组件。
二、组件作用:可快速在信息发布页面中构建设置一张规范化尺寸的信息封面图的功能模块。同时对接了表单提交处理流程。
三、使用范围:仅在所在的页面中有效,在同一页面中可放置多个此组件,请结合实际需要安排。
四、组件写法:[sys.faceimg #id @name {备注说明} width=封面图宽度 height=封面图高度 must=1 ]$bind.data数据查询组件的外部调用名.字段名$[/sys.faceimg]。
1、[sys.faceimg - 开头部分。
2、#id - 表示唯一名称码部分,用于定义该项在页面中的唯一性,id后名称只能使用英文字母、数字、下划线、短横线。比如:#anli_faceurl。
3、@name - 表示唯一中文名称部分,用于定义该项在当前页面中的唯一中文名称,应尽量简洁化,须8个字以内。以@号开头,@后名称只能使用中文、字母、数字、下划线、短横线。比如:@封面图片。
4、{备注说明} - 表示该项的备注说明:以{开头,以}结尾,在其间为备注说明内容,备注内容只能使用中文、字母、数字、下划线、短横线、中文特殊符号。比如:{请上传一张图片进行设置封面图}。如果不需要备注说明,请去掉{...}
5、width=:表示封面图的标准尺寸宽度要求,整数,必须设置项;建议宽度在100~750之间。如:width=300 表示封面图设置要求为宽300px的图片。
6、height=:表示封面图的标准尺寸高度要求,整数,必须设置项;建议高度在100~750之间。如:height=200 表示封面图设置要求为高200px的图片。
7、must=1 - 表示此项为必选项,如果不是必选项,请去掉must=1
8、前段闭合符:]。
9、$bind.data数据查询组件的外部调用名.字段名$:用于修改数据记录时初始化绑定旧值使用。比如:修改成功案例时,绑定初始化值为所改那一条案例运用数据查询组件[data....]...[/data]的外部调用名anliinfo,获得的案例封面图片信息使用$bind.anliinfo.al_faceurl$。
10、结尾:[/sys.faceimg]
五、封面图设置组件应用实例:
1、对实例中修改案例信息时,封面图设置组件初始化绑定旧案例的“封面图片”的实例。
2、在管理后台案例发布页的页面代码中, 使用[req=eid=int]先定义一个用于获取当前需要修改的那一条案例的编号;
3、页面代码中判断如果获取到的eid参数值大于0,则表示当前是需要准备修改案例信息,初始化加载案例编号eid值所对应的一条案例的数据内容。使用[data...]...[/data]数据查询组件。[data...]查询组件外部的数据调用名称为anliinfo。
[if={$req.eid$}d{0}=int]
[data=anli_list]
[0]
[out=anliinfo]
[num=1]
[get]
[col=al_title][col=al_flag][col=al_con][col=al_des][col=al_faceurl][col=al_icp_pic]
[/get]
[where]
[col=al_id][way]=[/way][val]$req.eid$[/val][/col]
[col=al_isdel][way]=[/way][val]0[/val][/col]
[/where]
[/0]
[/data]
[/if]
4、在管理后台的后台页面代码的案例发布页的页面代码中放置:[sys.faceimg #anli_faceurl @封面图片 {请上传一张图片进行设置封面图} width=686 height=320 must=1 ]$bind.anliinfo.al_faceurl$[/sys.faceimg]。
5、封面图片 - 封面图设置组件:#anli_faceurl:定义此表单参数项的id为anli_faceurl;@封面图片:定义此表单项的名称为封面图片;{请上传一张图片进行设置封面图} :定义表单项的提示信息为“请上传一张图片进行设置封面图 ”;width=686:封面图宽度为686px;height=320:封面图高度为320px;must=1:表示此表单项是必选项;$bind.anliinfo.al_faceurl$:表示初始化数据内容绑定使用[data...]...[/data]数据查询组件的外部调用名称anliinfo,获取字段al_faceurl的值。
6、将查询到的案例数据,初始化绑定到表示案例的封面图片信息的封面图设置组件中,绑定发布型组件的值,请使用$bind.数据外部调用名.字段名$方式:$bind.anliinfo.al_faceurl$。
7、实例的输出结果形式:包含有完整左侧名称显示、右侧封面图设置信息处理的表单项模块。其页面中呈现的css样式都定义在通用的/res/c/m.css中。管理后台案例发布页,加载初始化需要修改的案例信息时,封面图片的结果: