zoukankan      html  css  js  c++  java
  • JEECG 上传插件升级-代码生成器

    前言:

        现有的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>
  • 相关阅读:
    How to configure security of ActiveMQ ?
    CentOS 搭建 nginx + tomcat
    25个 Git 进阶技巧
    写给Git初学者的7个建议
    my links
    Shell scripts to Create a local dir base on the time.
    81For全栈技术网
    一款可视化的在线制作H5
    在线制作h5
    在线制作h5——上帝的礼物
  • 原文地址:https://www.cnblogs.com/Jeely/p/11309990.html
Copyright © 2011-2022 走看看