前台参考网址：http://www.bcty365.com/content-146-3263-1.html
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
<title></title>
<script type="text/javascript" src="js/jquery.js"></script>
<script src="js/mui.min.js"></script>
<link href="css/mui.min.css" rel="stylesheet" />
<script src="js/app.js"></script>
<script>
var flag=0,cnt=0;
var swt;
// 扩展API加载完毕后调用onPlusReady回调函数
document.addEventListener( "plusready", onPlusReady, false );
var r = null;
// 扩展API加载完毕，现在可以正常调用扩展API
function onPlusReady() {
// 获取设备默认的摄像头对象
var cmr = plus.camera.getCamera();
//alert( "Camera supperted image resolutions: " + cmr.supportedImageResolutions );
}
// 拍照
function captureImage(){
var cmr = plus.camera.getCamera();
cmr.captureImage( function( path ){
//保存图片路径
alert( "Capture image success: " + path );
},
function( error ) {
alert( "Capture image failed: " + error.message );
},
{resolution:res,format:fmt}
);
}
var files = [];
function showActionSheet() {
var bts = [
// {
// title: "拍照"
// },
{
title: "从相册选择"
}];
plus.nativeUI.actionSheet({
cancel: "取消",
buttons: bts
},
function(e) {
//if(e.index == 1) {
//getImage();
//} else if(e.index == 2) {
galleryImgs();
//}
}
);
}
//相册选取
function galleryImgs() {
files = [];
index = 1;
plus.gallery.pick(function(e) {
document.getElementsByClassName("mui-progressbar mui-progressbar-infinite")[0].style.display="block";
document.getElementById("itemlist").style.display="block";
document.getElementById("itemlist").innerHTML="";
cnt=0;
plus.nativeUI.showWaiting('图片压缩加载中，请勿关闭');
for(var i = 0; i < e.files.length; i++) {
var dstname = "_doc/" + getUid() + ".jpg"; //设置压缩后图片的路径
compressImage(e.files[i], dstname);
// $("#bimg").attr("src", dstname);
//cutImg();
appendfile(dstname);
//mui('#picture').popover('toggle');
}
var bval=$("#bimg").text();
bval=bval.substr(0,bval.length-1);
$("#bimg").text(bval+e.files.length);
$("#bimg").show();
}, function(e) {
//outSet( "取消选择图片" );
}, {
filter: "image",
multiple: true
});
}
//添加文件
var index = 1;
function appendfile(p) {
files.push({
name: "uploadkey" + index, //这个值服务器会用到，作为file的key
path: p
});
index++;
}
//拍照
function getImage() {
// var cmr = plus.camera.getCamera();
// cmr.captureImage(function(p) {
// plus.io.resolveLocalFileSystemURL(p, function(entry) {
// var localurl = entry.toLocalURL(); //
// // $("#bimg").attr("src", localurl);
// var dstname = "_doc/" + getUid() + ".jpg"; //设置压缩后图片的路径
// compressImage(localurl, dstname);
// //$("#report").html('<img src="/static/css/default/img/default.jpg" data-original="' + localurl + '">');
// //cutImg();
// mui('#picture').popover('toggle');
// });
// });
}
// 产生一个随机数
function getUid() {
return Math.floor(Math.random() * 100000000 + 10000000).toString();
}
//压缩图片，这个比较变态的方法，无法return
function compressImage(src, dstname) {
//var dstname="_downloads/"+getUid()+".jpg";
var itemlist = document.getElementById("itemlist");
plus.zip.compressImage({
src: src,
dst: dstname,
overwrite: true,
quality: 20
},
function(event) {
//console.log("Compress success:"+event.target);
fname = dstname;
filepath = event.target;
//$("#bimg").attr("src", event.target);
// return event.target;
//var temp = '<li class="mui-table-view-cell mui-media"><a href="javascript:;"><img class="mui-media-object mui-pull-left" src="' +
//event.target + '" onclick="showimg();"><div class="mui-media-body"><p class="mui-ellipsis"></p></div></a></li>';
var temp ='<li class="mui-table-view-cell mui-media mui-col-xs-4"><a href="#">'+
'<img class="mui-media-object" src="'+event.target+'"></a></li>';
itemlist.innerHTML += temp;
cnt++;
},
function(error) {
console.log(error);
return src;
//alert("Compress error!");
});
}
var blag=false;
setInterval(function comeover(){
if(cnt==files.length){
plus.nativeUI.closeWaiting();
document.getElementsByClassName("mui-progressbar mui-progressbar-infinite")[0].style.display="none";
blag=true;
}
},2000)
// 创建上传任务
function createUpload() {
if (cnt !=files.length)
{
mui.alert('图片压缩未完成请稍后...','提示');
return;
}
var wt = plus.nativeUI.showWaiting('图片上传中，请勿关闭');
var url = app.geturlstr()+"uploadingimages.ashx?action=appupload";
var task = plus.uploader.createUpload(url, {
method: "POST",
blocksize: 0,//204800,
priority: 100
},
function(t, status) {
//console.log('test');
if(t.responseText.substring(0, 1) == "0") {
if (flag<=3)
{
wt.close();
createUpload();
flag++;
}
else
{
wt.close();
alert(t.responseText.substring(1, t.responseText.length));
}
} else {
// 上传完成
if(status == 200) {
$("#bimg").hide();
$("#bimg").text("您选择的图片总数: ");
$("#device").val("");
$("input[type='radio']").removeAttr("checked");
index = 1;
files = [];
wt.close();
plus.uploader.clear();
document.getElementById("itemlist").innerHTML="";
alert("文件上传成功");
} else {
wt.close();
plus.uploader.clear();
alert("文件上传失败: " + status);
}
}
}
);
var device = $("#device").val().trim();
var mold = $("input[type='radio']:checked").val();
var bval=$("#bimg").text().substr($("#bimg").text().length-1,1);
if(bval==" " || bval==undefined || bval==null){
wt.close();
mui.toast("照片不能为空");
}
else{
if(device.length < 1 || mold==undefined || mold.length < 1) {
wt.close();
mui.toast("机号或类型不能为空");
} else {
var state = app.getState();
task.addData("device",device);
task.addData("mold",mold);
task.addData("account", state.account);
task.addData("token", state.token);
task.addData("version", app.getversion());
for(var i = 0; i < files.length; i++) {
var fff = files[i];
task.addFile(fff.path, { key: fff.name });
}
task.start();
}
}
}
</script>
</head>
<body>
<header class="mui-bar mui-bar-nav">
<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
<h1 class="mui-title">图片上传</h1>
</header>
<div class="mui-content">
<form class="mui-input-group">
<div class="mui-input-row">
<label style="23%">机号：</label>
<input style="77%" id='device' type="text" class="mui-input-clear mui-input" placeholder="请输入物料名称">
</div>
</form>
<form class="mui-radio">
<h5 class="mui-content-padded">类型：</h5>
<div class="mui-card">
<div class="mui-input-row mui-radio mui-left">
<label>主机</label>
<input name="radio1" type="radio" value="A">
</div>
<div class="mui-input-row mui-radio mui-left">
<label>附件</label>
<input name="radio1" type="radio" value="B">
</div>
</div>
</form>
<button id="btnselect" name="file" type="button" class="mui-btn mui-btn-primary" onclick="showActionSheet();">图片选择</button>
<button id="btnsave" type="button" class="mui-btn mui-btn-primary" onclick="createUpload();">确定上传</button>
<br/>
<div id="report" style="text-align: center; margin-top: 10px;">
<h5>一次上传照片数请控制在30张以内</h5>
<h5 id="bimg" hidden="hidden">您选择的图片总数: </h5>
</div>
<div class="mui-content" style="background-color:#fff;margin-top:15px;">
<p class="mui-progressbar mui-progressbar-infinite" style="display: none;"></p>
<ul class="mui-table-view mui-grid-view" id="itemlist" style="display: none;">
</ul>
</div>
</div>
</body>
</html>
后台-----------------------------------------
void UploadImage(HttpContext context)
{
try
{
int id = 0;
string saccount, stoken, sitemid, sversion, device, mold, msg=string.Empty;
ArrayList sqlStringlist = new ArrayList();
//LogHelper.WriteInfoLog(typeof(uploadingimages), "test");
saccount = context.Request["account"];
stoken = context.Request["token"];
sitemid = context.Request["itemid"];
sversion = context.Request["version"];
device = context.Request.Form["device"] != "" ? context.Request.Form["device"] : "";//机号
mold = context.Request.Form["mold"] != "" ? context.Request.Form["mold"] : "";//类型
device = device.ToUpper().Trim();
//LogHelper.WriteInfoLog(typeof(uploadingimages), string.Format("device={0},mold={1}", device, mold));
//int ifg = appBll.CheckUser(saccount, stoken, "uploadimage");
decimal dclientversion = decimal.Parse(sversion);//客户端版本号
decimal dversion = decimal.Parse("1.02");//服务端版本号
if (dversion <= dclientversion)//版本符合要求
{
// if (ifg == 2)
//{
// msg = "0长时间未登录,请退出重新登录后操作";
//}
//else if (ifg == 0)
//{
// msg = "0人员登录异常";
//}
// else if (ifg == 3)
// {
// msg = "0你未被授权";
// }
// else
// {
//判断机号是否存在
string sql = string.Format("select count(*) from ds1.ima_file where ima01='{0}' ", device);
int ima = Convert.ToInt32(OraSqlHelper.returnval(sql));
if (ima==0)
{
msg = "0不存在此机号";
}
else
{
//判断上传的图片是否已存在表中
sql = string.Format("select filename from qc_file where jh='{0}' and kinds='{1}' order by id desc", device, mold);
string fileName = SqlHelper.returnval(sql);
if (!string.IsNullOrEmpty(fileName))
{
fileName = fileName.Replace(device, "");
fileName = fileName.Replace("-" + mold + "-", "");
fileName = fileName.Replace(".jpg", "");
id = Convert.ToInt32(fileName);
}
id += 1;
int count = context.Request.Files.Count;
LogHelper.WriteInfoLog(typeof(uploadingimages), count.ToString());
for (int i = 0; i < count; i++)
{
int l = context.Request.Files["uploadkey" + (i + 1)].ContentLength;
}
for (int i = 0; i < count; i++)
{
int l = context.Request.Files["uploadkey" + (i + 1)].ContentLength;
//LogHelper.WriteInfoLog(typeof(uploadingimages), l.ToString());
byte[] buffer = new byte[l];
System.IO.Stream s = context.Request.Files["uploadkey" + (i + 1)].InputStream;
System.Drawing.Bitmap image = new System.Drawing.Bitmap(s);
string imagname = string.Format("{0}-{1}-{2}.jpg", device, mold, id++);
string path = "F:/qcimage/" + DateTime.Now.ToString("yyyyMM") + "/";
string patha = DateTime.Now.ToString("yyyyMM") + "/";
if (!System.IO.Directory.Exists(path))
{
System.IO.Directory.CreateDirectory(path);
}
image.Save(path + imagname);
sql = string.Format("insert into qc_file values('{0}','{1}','{2}','{3}','{4}',getdate()) ", device, mold, imagname, patha, saccount);
sqlStringlist.Add(sql);
}
int ii = SqlHelper.ExecuteSqlTran(sqlStringlist);
if (ii == 0)
{
msg = "0上传文件失败";
}
//LogHelper.WriteInfoLog(typeof(uploadingimages), "over" + ii.ToString());
// }
}
}
else
{
msg = "0版本过低不能操作,请先升级后操作";
}
context.Response.Write(msg);
}
catch (Exception ex)
{
context.Response.Write("0上传文件失败");
LogHelper.WriteErrorLog(typeof(uploadingimages), ex);
}
}