手机压缩 上传照片/删除照片

//  生成识别码
        var dates = new Date();
        var tIdentifier = dates.getTime();
        var identifier = String(tIdentifier) + parseInt(Math.random() * 10000000);
        console.log("识别码" + identifier);

        var headKey = identifier + "1";

        var urls = URL + '/customer/api/mobile/uploadFile'; //上传接口
        var urldel = URL + '/customer/api/mobile/deleteImage'; //删除接口

        //上传图片
        var apply_pic = function() {
            //拍照
            function captureImage(id, url, headKey, otherKey, otherVal, imagePath) {
                var cmr = plus.camera.getCamera();
                var res = cmr.supportedImageResolutions[0];
                var fmt = cmr.supportedImageFormats[0];
                cmr.captureImage(function(path) {
                    plus.io.resolveLocalFileSystemURL(path, function(p) {
                        var localUrl = p.toLocalURL();
                        console.log(localUrl);
                        var has = h(id).find("img").length;
                        var wt = plus.nativeUI.showWaiting();
                        plus.zip.compressImage({//压缩
                                src: localUrl,
                                dst: "_doc/" + localUrl,
                                overwrite: true,
                            },
                            function(imgUrl) {
                                console.log(imgUrl)
                                var task = plus.uploader.createUpload(url, {
                                        method: "POST",
                                        async: false
                                    },
                                    function(t, status) { //上传完成
                                        console.log(status);
                                        console.log('t=' + JSON.stringify(t));
                                        console.log('t.responseText', t.responseText);
                                        if(status == 200) {
                                            mui.toast("上传成功")
                                            var back = (t.responseText.split('Results(')[1]);
                                            back = back.substring(0, back.length - 1);
                                            console.log('back(拍照)--->'+back);
                                            back = JSON.parse(back);

                                            var html = "";
                                            html += '<li data-fileId="' + back.data.reason +
                                                '" class="image-item imagelistjs pictureList mui-pull-left">';
                                            html += '    <img id="picBig" data-preview-src="" data-preview-group="1" src=' + imgUrl.target + '/>';
                                            html += '    <span class="del mui-icon mui-icon-closeempty mui-btn-danger" onclick="deleteImg(this)">';
                                            html += '    </span>';
                                            html += '</li>';
                                            $("#F_CKJLB").before(html);

                                        } else {
                                            mui.toast("上传失败")
                                        }
                                        wt.close();
                                    });

                                task.addData(otherKey, otherVal);

                                task.addFile(imgUrl.target, {
                                    key: headKey
                                });

                                task.start();
                            },
                            function(e) {
                                wt.close();
                                mui.toast(JSON.stringify(e));
                            });
                    });
                }, function(error) {
                    mui.toast("Capture image failed: " + error.message);
                }, {
                    resolution: res,
                    format: fmt
                });
            }
            //点击上传图片
            function addPic(id, url, headKey, otherKey, otherVal, imagePath) {
                h(id).tap(function() {
                    var actionbuttons = [{
                        title: "拍照",
                        color: "#1296db"
                    }, {
                        title: "从相册选择",
                        color: "#1296db"
                    }];
                    var actionstyle = {
                        cancel: "取消",
                        buttons: actionbuttons
                    };
                    plus.nativeUI.actionSheet(actionstyle, function(e) {
                        var index = e.index;
                        switch(index) {
                            case 1: //拍照
                                captureImage(id, url, headKey, otherKey, otherVal, imagePath);
                                break;
                            case 2: //相册
                                plus.gallery.pick(
                                    function(path) {

                                        var wt = plus.nativeUI.showWaiting();
                                        var has = h(id).find("img").length;

                                        plus.zip.compressImage({//压缩
                                                src: path,
                                                dst: "_doc/" + path,
                                                overwrite: true,
                                            },
                                            function(imgUrl) {
                                                //上传头像到服务器
                                                var task = plus.uploader.createUpload(url, {
                                                        method: "POST",
                                                        async: false
                                                    },
                                                    function(t, status) { //上传完成
                                                        console.log('status=' + status);
                                                        console.log('t=' + JSON.stringify(t));
                                                        console.log('t.responseText=' + t.responseText);

                                                        if(status == 200) {
                                                            mui.toast("上传成功")
                                                            var back = t.responseText.split('Results(')[1];
                                                            console.log('back(相册)--->' + back);
                                                            back = back.substring(0, back.length - 1);
                                                            back = JSON.parse(back);

                                                            var html = "";
                                                            html += '<li data-fileId="' + back.data.reason +
                                                                '"  class="image-item imagelistjs pictureList mui-pull-left">';
                                                            html += '    <img class="picBigjs" data-preview-src="" data-preview-group="1" src=' + imgUrl.target + '/>';
                                                            html += '    <span class="del mui-icon mui-icon-closeempty mui-btn-danger" onclick="deleteImg(this)">';
                                                            html += '    </span>';
                                                            html += '</li>';
                                                            $("#F_CKJLB").before(html); //页面展示已上传的图片

                                                        } else {
                                                            mui.toast("上传失败");
                                                        }
                                                        wt.close();
                                                    });

                                                task.addData(otherKey, otherVal);

                                                task.addFile(imgUrl.target, {
                                                    key: headKey
                                                });

                                                task.start();
                                            },
                                            function(e) {
                                                mui.toast(JSON.stringify(e))
                                            });

                                    },
                                    function(e) {}, {
                                        filter: "image",
                                        system: false
                                    });
                        }
                    })
                });
            }
            return {
                captureImage: captureImage,
                addPic: addPic,
                init: function() {
                    addPic('#F_CKJLB', urls, headKey, "randomId", identifier, "");
                }
            }
        }();

        apply_pic.init();

        function deleteImg(obj) {
            var fileId = $(obj).parents('li.imagelistjs').attr('data-fileId');
            console.log('fileId=' + fileId);
            $.ajax({
                url: urldel,
                data: {
                    "fileId": fileId
                },
                dataType: 'jsonp', //服务器返回json格式数据
                type: 'get', //HTTP请求类型
                timeout: 10000, //超时时间设置为10秒;
                jsonpCallback: "Results",
                success: function(back) {
                    console.log('删除图片' + JSON.stringify(back));
                    if(back.code == '0') {
                        mui.toast("删除成功!");
                        $(obj).parents('li.imagelistjs').remove();
                    } else {
                        mui.toast("删除失败!")
                    }
                },
                error: function(xhr, type, errorThrown) {
                    //异常处理;
                    mui.toast("系统连接错误")
                    console.log(xhr);
                    console.log(type);
                    console.log(errorThrown);
                }
            });
        }

效果图:

这里写图片描述

这里写图片描述

这里写图片描述

猜你喜欢

转载自blog.csdn.net/stone10086/article/details/79698448
今日推荐