上传用户logo功能-蒲公英云

上传用户logo功能

傷城~ 2022-01-29 09:21 383阅读 0赞

重要代码如下：

//用户权限的判断，不用管
 <c:set var="isShow" value="${sessionScope.userSession.type==0  || customer == null }" />
                                        <c:if test="${isShow == false && sessionScope.userSession.type!=1 }">
                                        //logo上传的路径
                                            <input name="filePath" type="hidden" id="filePath" value="${customerProperty.logo}"/>  //customerProperty是从一个后台controller调用service查询数据库的方法，查询出的集合值，通过jstl <c:forEach>标签遍历出来的var变量
                                        <div class="form-group">
                                            <label class="control-label col-md-3">LOGO
                                        </label>
                                        <div class="col-md-4">
                                        //这块儿做上传后的logo实时显示。
                                            <img src="${customerProperty.logo}"
                                                 id="showLogo" />
                                        </div>
                                    </div>
                                    <div class="form-group">
                                        <label class="control-label col-md-3">上传LOGO
                                        </label>
                                        <div class="col-md-4">
                                            <input type="file" class="form-control fileChange"
                                                   //onchange事件
                                                   onchange="saveCustomerPropertyLogo(this)" accept="image/png,image/jpg,image/jpeg,image/gif"    //用户可上传logo的文件类型限制
                                                   id="uploadFile" />
                                        </div>
                                    </div>
                                    </c:if>
 var res = null;
    /**
     *  上传logo   通过ajax往后台controller方法传值
     */
    function saveCustomerPropertyLogo(obj){
        var cid = $('input[name="id"]').val();
        var formData = new FormData();
        formData.append("cid",cid);                     //当前客户cid
        formData.append("file", $(obj).get(0).files[0]);  //当前客户所上传logo
            $.ajax({
                url: "customer/uploadLogo.smk",
                type: "POST",
                data: formData,
                async:false,
                processData: false,
                contentType: false,
                success: function (data) {
                    res = JSON.parse(data)
                    if( res.status == 200){
                      $('input[name="filePath"]').val(res.data);
                      $("#showLogo").attr('src',"upload/"+res.data)
                    }else{
                        msgModal("上传失败！！")
                    }
                    if (res.nologin === true) {
                        msgModal('登录超时,请点击确定重新登录', 'login/logout.smk');
                    }
                },
                error: function (data) {
                    alert("上传出错，请稍后再试(#^.^#)");
                }
            })
    }

后台controller方法

/**
     * 接收用户上传logo
     * @param uploadFile
     * @param cid
     * @return
     */
    @RequestMapping(value = "uploadLogo", method = RequestMethod.POST)
    public @ResponseBody
    ResponseResult uploadLogo(@RequestParam(value = "file") MultipartFile uploadFile,
                              @RequestParam(value = "cid") String cid) {
        ResponseResult responseResult = new ResponseResult();
        responseResult.setStatus(500);
        /* 获取上传logo类型 */
        String fileType = uploadFile.getContentType();
        String fileName = uploadFile.getOriginalFilename().substring(uploadFile.getOriginalFilename().indexOf("."),
                uploadFile.getOriginalFilename().length());
        /* 校验用户上传logo类型 */
        if (fileType.endsWith("png") || fileType.endsWith("jpg") || fileType.endsWith("jpeg") || fileType.endsWith("gif")) {
            /* 上传logo时间 */
            String curTime = BaseUtils.getNow(BaseUtils.getConfigValue("template.datetime_format_full"));
            /* logo保存地址 */
            String logoPath = "logoupload/" + cid + "/" + curTime + fileName;
            /* 文件下载地址 */
            String uploadBasePath = BaseUtils.getConfigValue("upload.base.path");
            /* 保存用户上传logo文件 */
            boolean saveStatus = BaseUtils.saveFile(uploadFile, uploadBasePath + logoPath);
            if (saveStatus) {
                responseResult.setStatus(200);
                responseResult.setData(logoPath);
            }
        }
        return responseResult;
    }