JEECG 上传插件升级-代码生成器

约定不等于承诺〃 2023-06-01 03:25 6阅读 0赞

> **前言：**
> 
>     现有的uploadify上传是基于swf的，随着H5的普及，flash即将退出历史舞台，JEECG本着与时俱进的原则，将全面升级JEECG系统中的上传功能,采用新式上传插件plupload,此插件上传支持多种模式html5,flash,silverlight,html4，可通过配置实现优先模式，对于新版主流浏览器均可采用H5，对于不支持H5的低版本IE浏览器可走flash模式。以下讲解JEECG代码生成器的升级。

## 升级步骤： ##

**1.下载升级文件**

链接：[https://pan.baidu.com/s/1wQ7xT83bglouprPN0Gu7qA][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/下,修改如下：

<table> 
 <tbody> 
  <tr> 
   <td> 
    <div>
      1 
    </div> 
    <div>
      2 
    </div> 
    <div>
      3 
    </div> 
    <div>
      4 
    </div> 
    <div>
      5 
    </div> 
    <div>
      6 
    </div> 
    <div>
      7 
    </div> </td> 
   <td> 
    <div> 
     <div> 
      <code>if</code>&nbsp; 
      <code>(oConvertUtils.isIn(</code> 
      <code>"uploadify"</code> 
      <code>, types)) { </code> 
     </div> 
     <div> 
      <code>&nbsp;&nbsp;&nbsp;&nbsp;</code> 
      <code>/*sb.append("&lt;link rel=\"stylesheet\" href=\""+basePath+"/plug-in/uploadify/css/uploadify.css\" type=\"text/css\"&gt;&lt;/link&gt;");</code> 
     </div> 
     <div> 
      <code>&nbsp;&nbsp;&nbsp;&nbsp;</code> 
      <code>sb.append("&lt;script type=\"text/javascript\" src=\""+basePath+"/plug-in/uploadify/jquery.uploadify-3.1.js\"&gt;&lt;/script&gt;");*/</code> 
     </div> 
     <div> 
      <code>&nbsp;&nbsp;&nbsp;&nbsp;</code> 
      <code>sb.append(</code> 
      <code>"&lt;link rel=\"stylesheet\" href=\""</code> 
      <code>+basePath+</code> 
      <code>"/plug-in/uploadify/css/uploadify.css\" type=\"text/css\"&gt;&lt;/link&gt;"</code> 
      <code>);</code> 
     </div> 
     <div> 
      <code>&nbsp;&nbsp;&nbsp;&nbsp;</code> 
      <code>sb.append(</code> 
      <code>"&lt;script type=\"text/javascript\" src=\""</code> 
      <code>+basePath+</code> 
      <code>"/plug-in/plupload/plupload.full.min.js\"&gt;&lt;/script&gt;"</code> 
      <code>);</code> 
     </div> 
     <div> 
      <code>&nbsp;&nbsp;&nbsp;&nbsp;</code> 
      <code>sb.append(</code> 
      <code>"&lt;script type=\"text/javascript\" src=\""</code> 
      <code>+basePath+</code> 
      <code>"/plug-in/tools/Map.js\"&gt;&lt;/script&gt;"</code> 
      <code>);</code> 
     </div> 
     <div> 
      <code>}</code> 
     </div> 
    </div> </td> 
  </tr> 
 </tbody> 
</table>

**7.【修改文件】**

修改src/main/webapp/WEB-INF/tld/easyui.tld文件，找到<name>upload</name>的标签，修改其配置<tag-class>为org.jeecgframework.tag.core.easyui.UploadPlTag,修改如下：

<table> 
 <tbody> 
  <tr> 
   <td> 
    <div>
      1 
    </div> 
    <div>
      2 
    </div> 
    <div>
      3 
    </div> 
    <div>
      4 
    </div> 
    <div>
      5 
    </div> 
    <div>
      6 
    </div> </td> 
   <td> 
    <div> 
     <div> 
      <code>&lt;tag&gt;</code> 
     </div> 
     <div> 
      <code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code> 
      <code>&lt;name&gt;upload&lt;/name&gt;</code> 
     </div> 
     <div> 
      <code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code> 
      <code>&lt;!-- &lt;tag-</code> 
      <code>class</code> 
      <code>&gt;org.jeecgframework.tag.core.easyui.UploadTag&lt;/tag-</code> 
      <code>class</code> 
      <code>&gt; --&gt;</code> 
     </div> 
     <div> 
      <code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code> 
      <code>&lt;tag-</code> 
      <code>class</code> 
      <code>&gt;org.jeecgframework.tag.core.easyui.UploadPlTag&lt;/tag-</code> 
      <code>class</code> 
      <code>&gt;</code> 
     </div> 
     <div> 
      <code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code> 
      <code>&lt;body-content&gt;JSP&lt;/body-content&gt;</code> 
     </div> 
     <div> 
      <code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code> 
      <code>&lt;description&gt;选项卡选项标签&lt;/description&gt;</code> 
     </div> 
    </div> </td> 
  </tr> 
 </tbody> 
</table>

**8.【修改文件】**

在src/main/resources/jeecg/下搜索 “jquery.uploadify-3.1.js” 若页面有，需要将此JS路径替换成plug-in/plupload/plupload.full.min.js，并且额外增加一个JS引入:

<table> 
 <tbody> 
  <tr> 
   <td> 
    <div>
      1 
    </div> </td> 
   <td> 
    <div> 
     <div> 
      <code>&lt;script type=</code> 
      <code>"text/javascript"</code>&nbsp; 
      <code>src=</code> 
      <code>"plug-in/tools/Map.js"</code> 
      <code>&gt;&lt;/script&gt;</code> 
     </div> 
    </div> </td> 
  </tr> 
 </tbody> 
</table>

例如：搜索到文件src/main/resources/jeecg/ext-template/table/onetomany/cgform\_jspTemplate\_add.ftl中有 “jquery.uploadify-3.1.js”代码如下：

<table> 
 <tbody> 
  <tr> 
   <td> 
    <div>
      1 
    </div> 
    <div>
      2 
    </div> 
    <div>
      3 
    </div> 
    <div>
      4 
    </div> 
    <div>
      5 
    </div> </td> 
   <td> 
    <div> 
     <div> 
      <code>&lt;t:base type=</code> 
      <code>"jquery,easyui,tools,DatePicker"</code> 
      <code>&gt;&lt;/t:base&gt;</code> 
     </div> 
     <div> 
      <code>&lt;#</code> 
      <code>if</code>&nbsp; 
      <code>callbackFlag ==&nbsp;</code> 
      <code>true</code> 
      <code>&gt;</code> 
     </div> 
     <div> 
      <code>&lt;link rel=</code> 
      <code>"stylesheet"</code>&nbsp; 
      <code>href=</code> 
      <code>"plug-in/uploadify/css/uploadify.css"</code>&nbsp; 
      <code>type=</code> 
      <code>"text/css"</code>&nbsp; 
      <code>/&gt;</code> 
     </div> 
     <div> 
      <code>&lt;script type=</code> 
      <code>"text/javascript"</code>&nbsp; 
      <code>src=</code> 
      <code>"plug-in/uploadify/jquery.uploadify-3.1.js"</code> 
      <code>&gt;&lt;/script&gt;</code> 
     </div> 
     <div> 
      <code>&lt;/#</code> 
      <code>if</code> 
      <code>&gt;</code> 
     </div> 
    </div> </td> 
  </tr> 
 </tbody> 
</table>

现需要将if判断内的JS替换掉，并且新增一个，改成如下代码即可：

<table> 
 <tbody> 
  <tr> 
   <td> 
    <div>
      1 
    </div> 
    <div>
      2 
    </div> 
    <div>
      3 
    </div> 
    <div>
      4 
    </div> 
    <div>
      5 
    </div> 
    <div>
      6 
    </div> </td> 
   <td> 
    <div> 
     <div> 
      <code>&lt;t:base type=</code> 
      <code>"jquery,easyui,tools,DatePicker"</code> 
      <code>&gt;&lt;/t:base&gt;</code> 
     </div> 
     <div> 
      <code>&nbsp;</code> 
      <code>&lt;#</code> 
      <code>if</code>&nbsp; 
      <code>callbackFlag ==&nbsp;</code> 
      <code>true</code> 
      <code>&gt;</code> 
     </div> 
     <div> 
      <code>&nbsp;</code> 
      <code>&lt;link rel=</code> 
      <code>"stylesheet"</code>&nbsp; 
      <code>href=</code> 
      <code>"plug-in/uploadify/css/uploadify.css"</code>&nbsp; 
      <code>type=</code> 
      <code>"text/css"</code>&nbsp; 
      <code>/&gt;</code> 
     </div> 
     <div> 
      <code>&nbsp;</code> 
      <code>&lt;script type=</code> 
      <code>"text/javascript"</code>&nbsp; 
      <code>src=</code> 
      <code>"plug-in/plupload/plupload.full.min.js"</code> 
      <code>&gt;&lt;/script&gt;</code> 
     </div> 
     <div> 
      <code>&nbsp;</code> 
      <code>&lt;script type=</code> 
      <code>"text/javascript"</code>&nbsp; 
      <code>src=</code> 
      <code>"plug-in/tools/Map.js"</code> 
      <code>&gt;&lt;/script&gt;</code> 
     </div> 
     <div> 
      <code>&nbsp;</code> 
      <code>&lt;/#</code> 
      <code>if</code> 
      <code>&gt;</code> 
     </div> 
    </div> </td> 
  </tr> 
 </tbody> 
</table>

也可以直接改成标签式的写法

<table> 
 <tbody> 
  <tr> 
   <td> 
    <div>
      1 
    </div> 
    <div>
      2 
    </div> 
    <div>
      3 
    </div> 
    <div>
      4 
    </div> </td> 
   <td> 
    <div> 
     <div> 
      <code>&lt;t:base type=</code> 
      <code>"jquery,easyui,tools,DatePicker"</code> 
      <code>&gt;&lt;/t:base&gt;</code> 
     </div> 
     <div> 
      <code>&lt;#</code> 
      <code>if</code>&nbsp; 
      <code>callbackFlag ==&nbsp;</code> 
      <code>true</code> 
      <code>&gt;</code> 
     </div> 
     <div> 
      <code>&lt;t:base type=</code> 
      <code>"uploadify"</code> 
      <code>&gt;&lt;/t:base&gt;</code> 
     </div> 
     <div> 
      <code>&lt;/#</code> 
      <code>if</code> 
      <code>&gt;</code> 
     </div> 
    </div> </td> 
  </tr> 
 </tbody> 
</table>

或者

<table> 
 <tbody> 
  <tr> 
   <td> 
    <div>
      1 
    </div> </td> 
   <td> 
    <div> 
     <div> 
      <code>&lt;t:base type=</code> 
      <code>"jquery,easyui,tools,DatePicker&lt;#if callbackFlag == true&gt;,uploadify&lt;/#if&gt;"</code> 
      <code>&gt;&lt;/t:base&gt;</code> 
     </div> 
    </div> </td> 
  </tr> 
 </tbody> 
</table>

转载于:https://www.cnblogs.com/Jeely/p/11309990.html

[https_pan.baidu.com_s_1wQ7xT83bglouprPN0Gu7qA]: https://pan.baidu.com/s/1wQ7xT83bglouprPN0Gu7qA