前言:
现有的uploadify上传是基于swf的,随着H5的普及,flash即将退出历史舞台,JEECG本着与时俱进的原则,将全面升级JEECG系统中的上传功能,采用新式上传插件plupload,此插件上传支持多种模式html5,flash,silverlight,html4,可通过配置实现优先模式,对于新版主流浏览器均可采用H5,对于不支持H5的低版本IE浏览器可走flash模式。以下讲解JEECG代码生成器的升级。
升级步骤:
1.下载升级文件
链接:https://pan.baidu.com/s/1wQ7xT83bglouprPN0Gu7qA 密码:ay6q
2.【新增文件】
增加JS/css,将plupload文件夹直接拷贝到src/main/webapp/plug-in/下
3.【修改文件】
拷贝Map.js至src/main/webapp/plug-in/tools/下,覆盖更新。
4.【新增文件】
拷贝UploadPlTag.java至src/main/java/org/jeecgframework/tag/core/easyui/下。
5.【新增文件】
拷贝plupload.ftl至src/main/java/org/jeecgframework/tag/ftl/下。
6.【修改文件】
拷贝BaseTag.java至src/main/java/org/jeecgframework/tag/core/easyui/下,修改如下:
1
2
3
4
5
6
7
|
if
(oConvertUtils.isIn(
"uploadify"
, types)) {
/*sb.append("<link rel=\"stylesheet\" href=\""+basePath+"/plug-in/uploadify/css/uploadify.css\" type=\"text/css\"></link>");
sb.append("<script type=\"text/javascript\" src=\""+basePath+"/plug-in/uploadify/jquery.uploadify-3.1.js\"></script>");*/
sb.append(
"<link rel=\"stylesheet\" href=\""
+basePath+
"/plug-in/uploadify/css/uploadify.css\" type=\"text/css\"></link>"
);
sb.append(
"<script type=\"text/javascript\" src=\""
+basePath+
"/plug-in/plupload/plupload.full.min.js\"></script>"
);
sb.append(
"<script type=\"text/javascript\" src=\""
+basePath+
"/plug-in/tools/Map.js\"></script>"
);
}
|
7.【修改文件】
修改src/main/webapp/WEB-INF/tld/easyui.tld文件,找到<name>upload</name>的标签,修改其配置<tag-class>为org.jeecgframework.tag.core.easyui.UploadPlTag,修改如下:
1
2
3
4
5
6
|
<tag>
<name>upload</name>
<!-- <tag-
class
>org.jeecgframework.tag.core.easyui.UploadTag</tag-
class
> -->
<tag-
class
>org.jeecgframework.tag.core.easyui.UploadPlTag</tag-
class
>
<body-content>JSP</body-content>
<description>选项卡选项标签</description>
|
8.【修改文件】
在src/main/resources/jeecg/下搜索 “jquery.uploadify-3.1.js” 若页面有,需要将此JS路径替换成plug-in/plupload/plupload.full.min.js,并且额外增加一个JS引入:
1
|
<script type=
"text/javascript"
src=
"plug-in/tools/Map.js"
></script>
|
例如:搜索到文件src/main/resources/jeecg/ext-template/table/onetomany/cgform_jspTemplate_add.ftl中有 “jquery.uploadify-3.1.js”代码如下:
1
2
3
4
5
|
<t:base type=
"jquery,easyui,tools,DatePicker"
></t:base>
<#
if
callbackFlag ==
true
>
<link rel=
"stylesheet"
href=
"plug-in/uploadify/css/uploadify.css"
type=
"text/css"
/>
<script type=
"text/javascript"
src=
"plug-in/uploadify/jquery.uploadify-3.1.js"
></script>
</#
if
>
|
现需要将if判断内的JS替换掉,并且新增一个,改成如下代码即可:
1
2
3
4
5
6
|
<t:base type=
"jquery,easyui,tools,DatePicker"
></t:base>
<#
if
callbackFlag ==
true
>
<link rel=
"stylesheet"
href=
"plug-in/uploadify/css/uploadify.css"
type=
"text/css"
/>
<script type=
"text/javascript"
src=
"plug-in/plupload/plupload.full.min.js"
></script>
<script type=
"text/javascript"
src=
"plug-in/tools/Map.js"
></script>
</#
if
>
|
也可以直接改成标签式的写法
1
2
3
4
|
<t:base type=
"jquery,easyui,tools,DatePicker"
></t:base>
<#
if
callbackFlag ==
true
>
<t:base type=
"uploadify"
></t:base>
</#
if
>
|
或者
1
|
<t:base type=
"jquery,easyui,tools,DatePicker<#if callbackFlag == true>,uploadify</#if>"
></t:base>
|