图片上传补充

master
sunke 5 years ago
parent 28969fd024
commit 021673f657

@ -98,8 +98,17 @@ class BoonController extends ThinkController {
} else {
$map['id'] = $_REQUEST['id'];
$data = D(self::model_name)->where($map)->find();
// if(!empty($data['cover'])) {
// $data['cover_data'] = explode(',', $data['cover']);
// }
if(!empty($data['cover'])) {
$data['cover_data'] = explode(',', $data['cover']);
$valueArr = explode(',', $data['cover']);
$str = '';
foreach ($valueArr as $key1 => $value1) {
$a = get_cover($value1, 'path');
$str .= $a.',';
}
$data['valuedata'] = rtrim($str, ',');
}
$this->assign('data',$data);

@ -100,8 +100,17 @@ class GuessController extends ThinkController {
} else {
$map['id'] = $_REQUEST['id'];
$data = D(self::model_name)->where($map)->find();
// if(!empty($data['icon'])) {
// $data['icon_data'] = explode(',', $data['icon']);
// }
if(!empty($data['icon'])) {
$data['icon_data'] = explode(',', $data['icon']);
$valueArr = explode(',', $data['icon']);
$str = '';
foreach ($valueArr as $key1 => $value1) {
$a = get_cover($value1, 'path');
$str .= $a.',';
}
$data['valuedata'] = rtrim($str, ',');
}
$this->assign('data',$data);

@ -79,8 +79,17 @@ class PointShopController extends ThinkController
}
} else {
$data = $model->getData($id);
// if(!empty($data['cover'])) {
// $data['cover_data'] = explode(',', $data['cover']);
// }
if(!empty($data['cover'])) {
$data['cover_data'] = explode(',', $data['cover']);
$valueArr = explode(',', $data['cover']);
$str = '';
foreach ($valueArr as $key1 => $value1) {
$a = get_cover($value1, 'path');
$str .= $a.',';
}
$data['valuedata'] = rtrim($str, ',');
}
$this->assign("data",$data);

@ -9,6 +9,8 @@
<script type="text/javascript" src="__STATIC__/uploadify/jquery.uploadify.min.js"></script>
<script src="__STATIC__/md5.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript" src="__STATIC__/webuploader/webuploader.js"></script>
<script type="text/javascript" src="__STATIC__/webuploader/webuploader.inc.js"></script>
<script type="text/javascript" src="__STATIC__/webuploader/webuploader.before.js"></script>
<link rel="stylesheet" href="__CSS__/select2.min.css" type="text/css" />
<style>
@ -138,7 +140,7 @@
<input type="hidden" name="cover" id="cover_id_cover" value=""/>
<div id="uploader-demo" >
<div id="cover">
<div class="webuploader-pick" style="line-height: 13px">上传图片</div></div>
<div class="webuploader-pick" style="line-height: 13px" onclick="documentUpload('cover','coverList',5,'{$data.cover}','{$data.valuedata}','icon_data','cover','{:U('File/uploadPicture',array('session_id'=>session_id(),'flag'=>true))}')">上传图片</div></div>
<div id="coverList" class="uploader-list" style="display: flex;"></div>
</div>
</span>
@ -466,269 +468,10 @@ uploader.on( 'uploadComplete', function(file) {
</script>
<script>
var userInfo = {userId:"kazaff", md5:""}; //用户会话信息
var chunkSize = 5000 * 1024; //分块大小
var uniqueFileName = null; //文件唯一标识符
var md5Mark = null;
var backEndUrl = "{:U('File/shard_upload',array('type'=>1,'session_id'=>session_id()))}";
WebUploader.Uploader.register({
"before-send-file" : "beforeSendFile",
"before-send" : "beforeSend",
"after-send-file" : "afterSendFile"
}, {
beforeSendFile: function(file){
//秒传验证
if (file['source']['ext'] === 'zip' || file['source']['ext'] === 'rar') {
var task = new $.Deferred();
var start = new Date().getTime();
(new WebUploader.Uploader()).md5File(file, 0, 10*1024*1024).progress(function(percentage){
//console.log(percentage);
}).then(function(val){
//console.log("总耗时: "+((new Date().getTime()) - start)/1000);
md5Mark = val;
userInfo.md5 = val;
$.ajax({
type: "POST"
, url: backEndUrl
, data: {status: "md5Check", md5: val}
, cache: false
, timeout: 1000 //todo 超时的话,只能认为该文件不曾上传过
, dataType: "json"
}).then(function(data, textStatus, jqXHR){
alert(data.chunk);
//console.log(data);
if(data.ifExist){ //若存在这返回失败给WebUploader表明该文件不需要上传
task.reject();
uploader.skipFile(file);
file.path = data.path;
}else{
task.resolve();
//拿到上传文件的唯一名称,用于断点续传
uniqueFileName = md5(''+userInfo.userId+file.name+file.type+file.lastModifiedDate+file.size);
}
}, function(jqXHR, textStatus, errorThrown){ //任何形式的验证失败,都触发重新上传
task.resolve();
//拿到上传文件的唯一名称,用于断点续传
uniqueFileName = md5(''+userInfo.userId+file.name+file.type+file.lastModifiedDate+file.size);
});
});
return $.when(task);
}
}
, beforeSend: function(block){
//分片验证是否已传过,用于断点续传
if (block['file']['source']['ext'] === 'zip' || block['file']['source']['ext'] === 'rar') {
var task = new $.Deferred();
$.ajax({
type: "POST"
, url: backEndUrl
, data: {
status: "chunkCheck"
, name: uniqueFileName
, chunkIndex: block.chunk
, size: block.end - block.start
}
, cache: false
, timeout: 1000 //todo 超时的话,只能认为该分片未上传过
, dataType: "json"
}).then(function(data, textStatus, jqXHR){
if(data.ifExist){ //若存在返回失败给WebUploader表明该分块不需要上传
task.reject();
}else{
task.resolve();
}
}, function(jqXHR, textStatus, errorThrown){ //任何形式的验证失败,都触发重新上传
task.resolve();
});
return $.when(task);
}
}
, afterSendFile: function(file){
if (file['source']['ext'] === 'zip' || file['source']['ext'] === 'rar') {
var chunksTotal = 0;
if((chunksTotal = Math.ceil(file.size/chunkSize)) > 1){
//合并请求
var task = new $.Deferred();
$.ajax({
type: "POST"
, url: backEndUrl
, data: {
status: "chunksMerge"
, name: uniqueFileName
, chunks: chunksTotal
, ext: file.ext
, md5: md5Mark
}
, cache: false
, dataType: "json"
}).then(function(data, textStatus, jqXHR){
//todo 检查响应是否正常
task.resolve();
file.path = data.path;
$("#file_name").val(data.name);
$("#file_url").val(data.path+'/'+data.name);
$("#file_size").val(file.size);
}, function(jqXHR, textStatus, errorThrown){
task.reject();
});
return $.when(task);
}else{
//UploadComlate(file);
}
}
}
});
</script>
<script>
var uploaderImgcover= WebUploader.create({
// 选完文件后,是否自动上传。
auto: true,
// swf文件路径
swf: '__STATIC__/webuploader/Uploader.swf',
server: "{:U('File/uploadPicture',array('session_id'=>session_id(),'flag'=>true))}",
// 选择文件的按钮。可选。
// 内部根据当前运行是创建可能是input元素也可能是flash.
pick: {
id:'#cover',
multiple:true
},
// dnd: false,
paste: document.body,
accept: {
title: '图片',
extensions: 'png,gif,jpg,jpeg,bmp',
mimeTypes: '.png,.gif,.jpg,.jpeg,.bmp',
},
// 不压缩image, 默认如果是jpeg文件上传前会压缩一把再上传
resize: false,
disableGlobalDnd: true,
fileNumLimit:1,
threads:5,
thumb:true,
compress:false,
prepareNextFile: true,
formData: function(){return $.extend(true, {}, userInfo);},
chunked:false,
duplicate: true
});
var imgcoverListData = [];
<?php if (!empty($config['cover_data'])) :?>
var html = '';
$('#coverList').css('margin-top','10px');
<?php foreach ($config['cover_data'] as $value) {?>
<?php $value = (int)$value;?>
imgcoverListData.push(<?=$value?>);
html += '<div id="' + <?=$value?> + '" class="item flooring_page_img_box" style="margin-right: 10px;">';
html += '<a href="javascript:;"><img src="<?=get_cover($value,"path")?>" style="width: 100px;height: 100px;cursor: move;"></a>';
html += '<h4 class="info" style="text-align: center;">';
html += '<a href="javascript:;" class="jsdelzip table_click" style="float:none;display:inline-block;" img-id="' + <?=$value?> + '">删除</a>';
html += '</h4>';
html += '<div class="progress progress-striped active" style="display: none;">';
html += '<div class="progress-bar" role="progressbar" style="width: 100%;">100%</div>';
html += '</div>';
html += '</div>';
<?php }?>
$('#coverList').html(html);
$('#coverList').children().children('h4').children('.jsdelzip').on('click', function() {
var thisId = $(this).attr('img-id');
$(this).parent().parent().remove();
$.each(imgcoverListData,function(index, item) {
if (thisId == item) {
imgcoverListData.splice(index,1);
return false;
}
});
setcoverVal();
});
<?php endif ;?>
// 当有文件被添加进队列的时候
var thisIndex = 0;
var imgcoverList = $("#coverList");
uploaderImgcover.on( 'fileQueued', function( file ) {
var html = '';
html += '<div id="' + file.id + '" class="item" style="margin-right: 10px;">';
html += '<a href="javascript:;"><img src="" style="width: 100px;height: 100px;cursor: move;"></a>';
html += '<h4 class="info">' + file.name + '</h4>';
html += '<p class="state">等待上传...</p>';
html += '</div>';
imgcoverList.append(html);
imgcoverList.css('margin-top','10px');
var img = imgcoverList.children('#'+file.id).find('img');
uploaderImgcover.makeThumb(file, function (error, src) {
if (error) {
return;
}
img.attr('src', src);
}, 300, 300);
});
// 文件上传过程中创建进度条实时显示。
uploaderImgcover.on( 'uploadProgress', function( file, percentage ) {
var $li = $( '#'+file.id ),
$percent = $li.find('.progress .progress-bar');
// 避免重复创建
if ( !$percent.length ) {
$percent = $('<div class="progress progress-striped active">' +
'<div class="progress-bar" role="progressbar" style="width: 0%">' +
'</div>' +
'</div>').appendTo( $li ).find('.progress-bar');
}
$li.find('p.state').text('上传中');
$percent.css( 'width', percentage * 100 + '%' );
$percent.text( (percentage * 100).toFixed(0) + '%' );
});
uploaderImgcover.on( 'uploadSuccess', function( file , response) {
imgcoverListData.push(Number(response.id));
console.log(imgcoverListData)
setcoverVal();
$( '#'+file.id ).find('p.state').text('已上传').fadeOut(800);
//alert(JSON.stringify(response));
$('#'+file.id).find('h4.info').append('<a href="javascript:;" class="jsdelzip table_click" style="float:none;display:inline-block;margin-left:10px;">删除</a>');
$('#'+file.id).find('.jsdelzip').on('click',function() {
uploaderImgcover.removeFile( file.id );
$('#'+file.id).remove();
$.each(imgcoverListData,function(index, item) {
if (response.id == item) {
imgcoverListData.splice(index,1);
return false;
}
});
setcoverVal();
console.log(imgcoverListData);
return false;
});
});
uploaderImgcover.on('uploadError', function(file) {
$( '#'+file.id ).find('p.state').text('上传出错');
});
uploaderImgcover.on( 'uploadComplete', function(file) {
$( '#'+file.id ).find('.progress').fadeOut();
});
function setcoverVal()
{
var cover = '';
$.each(imgcoverListData,function(index, item) {
cover += item + ',';
});
cover = cover.substring(0, cover.length - 1);
$("input[name=cover]").val(cover);
}
documentUpload('cover','coverList',5,'{$data.cover}','{$data.valuedata}','icon_data','cover','{:U('File/uploadPicture',array('session_id'=>session_id(),'flag'=>true))}')
</script>
</block>

@ -9,6 +9,8 @@
<script type="text/javascript" src="__STATIC__/uploadify/jquery.uploadify.min.js"></script>
<script src="__STATIC__/md5.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript" src="__STATIC__/webuploader/webuploader.js"></script>
<script type="text/javascript" src="__STATIC__/webuploader/webuploader.inc.js"></script>
<script type="text/javascript" src="__STATIC__/webuploader/webuploader.before.js"></script>
<link rel="stylesheet" href="__CSS__/select2.min.css" type="text/css" />
<style>
.select2-container--default .select2-selection--single .select2-selection__rendered {
@ -142,7 +144,7 @@
<input type="hidden" name="cover" id="cover_id_cover" value=""/>
<div id="uploader-demo" >
<div id="cover">
<div class="webuploader-pick" style="line-height: 13px">上传图片</div></div>
<div class="webuploader-pick" style="line-height: 13px" onclick="documentUpload('cover','coverList',5,'{$data.cover}','{$data.valuedata}','icon_data','cover','{:U('File/uploadPicture',array('session_id'=>session_id(),'flag'=>true))}')">上传图片</div></div>
<div id="coverList" class="uploader-list" style="display: flex;"></div>
</div>
@ -494,271 +496,10 @@ uploader.on( 'uploadComplete', function(file) {
</script>
<script>
var userInfo = {userId:"kazaff", md5:""}; //用户会话信息
var chunkSize = 5000 * 1024; //分块大小
var uniqueFileName = null; //文件唯一标识符
var md5Mark = null;
var backEndUrl = "{:U('File/shard_upload',array('type'=>1,'session_id'=>session_id()))}";
WebUploader.Uploader.register({
"before-send-file" : "beforeSendFile",
"before-send" : "beforeSend",
"after-send-file" : "afterSendFile"
}, {
beforeSendFile: function(file){
//秒传验证
if (file['source']['ext'] === 'zip' || file['source']['ext'] === 'rar') {
var task = new $.Deferred();
var start = new Date().getTime();
(new WebUploader.Uploader()).md5File(file, 0, 10*1024*1024).progress(function(percentage){
//console.log(percentage);
}).then(function(val){
//console.log("总耗时: "+((new Date().getTime()) - start)/1000);
md5Mark = val;
userInfo.md5 = val;
$.ajax({
type: "POST"
, url: backEndUrl
, data: {status: "md5Check", md5: val}
, cache: false
, timeout: 1000 //todo 超时的话,只能认为该文件不曾上传过
, dataType: "json"
}).then(function(data, textStatus, jqXHR){
alert(data.chunk);
//console.log(data);
if(data.ifExist){ //若存在这返回失败给WebUploader表明该文件不需要上传
task.reject();
uploader.skipFile(file);
file.path = data.path;
}else{
task.resolve();
//拿到上传文件的唯一名称,用于断点续传
uniqueFileName = md5(''+userInfo.userId+file.name+file.type+file.lastModifiedDate+file.size);
}
}, function(jqXHR, textStatus, errorThrown){ //任何形式的验证失败,都触发重新上传
task.resolve();
//拿到上传文件的唯一名称,用于断点续传
uniqueFileName = md5(''+userInfo.userId+file.name+file.type+file.lastModifiedDate+file.size);
});
});
return $.when(task);
}
}
, beforeSend: function(block){
//分片验证是否已传过,用于断点续传
if (block['file']['source']['ext'] === 'zip' || block['file']['source']['ext'] === 'rar') {
var task = new $.Deferred();
$.ajax({
type: "POST"
, url: backEndUrl
, data: {
status: "chunkCheck"
, name: uniqueFileName
, chunkIndex: block.chunk
, size: block.end - block.start
}
, cache: false
, timeout: 1000 //todo 超时的话,只能认为该分片未上传过
, dataType: "json"
}).then(function(data, textStatus, jqXHR){
if(data.ifExist){ //若存在返回失败给WebUploader表明该分块不需要上传
task.reject();
}else{
task.resolve();
}
}, function(jqXHR, textStatus, errorThrown){ //任何形式的验证失败,都触发重新上传
task.resolve();
});
return $.when(task);
}
}
, afterSendFile: function(file){
if (file['source']['ext'] === 'zip' || file['source']['ext'] === 'rar') {
var chunksTotal = 0;
if((chunksTotal = Math.ceil(file.size/chunkSize)) > 1){
//合并请求
var task = new $.Deferred();
$.ajax({
type: "POST"
, url: backEndUrl
, data: {
status: "chunksMerge"
, name: uniqueFileName
, chunks: chunksTotal
, ext: file.ext
, md5: md5Mark
}
, cache: false
, dataType: "json"
}).then(function(data, textStatus, jqXHR){
//todo 检查响应是否正常
task.resolve();
file.path = data.path;
$("#file_name").val(data.name);
$("#file_url").val(data.path+'/'+data.name);
$("#file_size").val(file.size);
}, function(jqXHR, textStatus, errorThrown){
task.reject();
});
return $.when(task);
}else{
//UploadComlate(file);
}
}
}
});
</script>
<script>
var uploaderImgcover= WebUploader.create({
// 选完文件后,是否自动上传。
auto: true,
// swf文件路径
swf: '__STATIC__/webuploader/Uploader.swf',
server: "{:U('File/uploadPicture',array('session_id'=>session_id(),'flag'=>true))}",
// 选择文件的按钮。可选。
// 内部根据当前运行是创建可能是input元素也可能是flash.
pick: {
id:'#cover',
multiple:true
},
// dnd: false,
paste: document.body,
accept: {
title: '图片',
extensions: 'png,gif,jpg,jpeg,bmp',
mimeTypes: '.png,.gif,.jpg,.jpeg,.bmp',
},
// 不压缩image, 默认如果是jpeg文件上传前会压缩一把再上传
resize: false,
disableGlobalDnd: true,
fileNumLimit:1,
threads:5,
thumb:true,
compress:false,
prepareNextFile: true,
formData: function(){return $.extend(true, {}, userInfo);},
chunked:false,
duplicate: true
});
var imgcoverListData = [];
<?php if (!empty($data['cover_data'])) :?>
var html = '';
$('#coverList').css('margin-top','10px');
<?php foreach ($data['cover_data'] as $value) {?>
<?php $value = (int)$value;?>
imgcoverListData.push(<?=$value?>);
html += '<div id="' + <?=$value?> + '" class="item flooring_page_img_box" style="margin-right: 10px;">';
html += '<a href="javascript:;"><img src="<?=get_cover($value,"path")?>" style="width: 100px;height: 100px;cursor: move;"></a>';
html += '<h4 class="info" style="text-align: center;">';
html += '<a href="javascript:;" class="jsdelzip table_click" style="float:none;display:inline-block;" img-id="' + <?=$value?> + '">删除</a>';
html += '</h4>';
html += '<div class="progress progress-striped active" style="display: none;">';
html += '<div class="progress-bar" role="progressbar" style="width: 100%;">100%</div>';
html += '</div>';
html += '</div>';
<?php }?>
$('#coverList').html(html);
$('#coverList').children().children('h4').children('.jsdelzip').on('click', function() {
var thisId = $(this).attr('img-id');
$(this).parent().parent().remove();
$.each(imgcoverListData,function(index, item) {
if (thisId == item) {
imgcoverListData.splice(index,1);
return false;
}
});
setcoverVal();
});
<?php endif ;?>
// 当有文件被添加进队列的时候
var thisIndex = 0;
var imgcoverList = $("#coverList");
uploaderImgcover.on( 'fileQueued', function( file ) {
var html = '';
html += '<div id="' + file.id + '" class="item" style="margin-right: 10px;">';
html += '<a href="javascript:;"><img src="" style="width: 100px;height: 100px;cursor: move;"></a>';
html += '<h4 class="info">' + file.name + '</h4>';
html += '<p class="state">等待上传...</p>';
html += '</div>';
imgcoverList.append(html);
imgcoverList.css('margin-top','10px');
var img = imgcoverList.children('#'+file.id).find('img');
uploaderImgcover.makeThumb(file, function (error, src) {
if (error) {
return;
}
img.attr('src', src);
}, 300, 300);
});
// 文件上传过程中创建进度条实时显示。
uploaderImgcover.on( 'uploadProgress', function( file, percentage ) {
var $li = $( '#'+file.id ),
$percent = $li.find('.progress .progress-bar');
// 避免重复创建
if ( !$percent.length ) {
$percent = $('<div class="progress progress-striped active">' +
'<div class="progress-bar" role="progressbar" style="width: 0%">' +
'</div>' +
'</div>').appendTo( $li ).find('.progress-bar');
}
$li.find('p.state').text('上传中');
$percent.css( 'width', percentage * 100 + '%' );
$percent.text( (percentage * 100).toFixed(0) + '%' );
});
uploaderImgcover.on( 'uploadSuccess', function( file , response) {
imgcoverListData.push(Number(response.id));
console.log(imgcoverListData)
setcoverVal();
$( '#'+file.id ).find('p.state').text('已上传').fadeOut(800);
//alert(JSON.stringify(response));
$('#'+file.id).find('h4.info').append('<a href="javascript:;" class="jsdelzip table_click" style="float:none;display:inline-block;margin-left:10px;">删除</a>');
$('#'+file.id).find('.jsdelzip').on('click',function() {
uploaderImgcover.removeFile( file.id );
$('#'+file.id).remove();
$.each(imgcoverListData,function(index, item) {
if (response.id == item) {
imgcoverListData.splice(index,1);
return false;
}
});
setcoverVal();
console.log(imgcoverListData);
return false;
});
});
uploaderImgcover.on('uploadError', function(file) {
$( '#'+file.id ).find('p.state').text('上传出错');
});
uploaderImgcover.on( 'uploadComplete', function(file) {
$( '#'+file.id ).find('.progress').fadeOut();
});
function setcoverVal()
{
var cover = '';
$.each(imgcoverListData,function(index, item) {
cover += item + ',';
});
cover = cover.substring(0, cover.length - 1);
$("input[name=cover]").val(cover);
}
<script>
documentUpload('cover','coverList',5,'{$data.cover}','{$data.valuedata}','icon_data','cover','{:U('File/uploadPicture',array('session_id'=>session_id(),'flag'=>true))}')
</script>
</block>

@ -9,6 +9,8 @@
<script type="text/javascript" src="__STATIC__/uploadify/jquery.uploadify.min.js"></script>
<script src="__STATIC__/md5.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript" src="__STATIC__/webuploader/webuploader.js"></script>
<script type="text/javascript" src="__STATIC__/webuploader/webuploader.inc.js"></script>
<script type="text/javascript" src="__STATIC__/webuploader/webuploader.before.js"></script>
<link rel="stylesheet" href="__CSS__/select2.min.css" type="text/css" />
<style>
@ -113,7 +115,7 @@
<input type="hidden" name="icon" id="cover_id_icon" value=""/>
<div id="uploader-demo" >
<div id="icon">
<div class="webuploader-pick" style="line-height: 13px">上传图片</div></div>
<div class="webuploader-pick" style="line-height:13px" onclick="documentUpload('icon','iconList',5,'{$data.icon}','{$data.valuedata}','icon_data','icon','{:U('File/uploadPicture',array('session_id'=>session_id(),'flag'=>true))}')">上传图片</div></div>
<div id="iconList" class="uploader-list" style="display: flex;"></div>
</div>
@ -163,531 +165,6 @@
<script type="text/javascript">
//导航高亮
highlight_subnav('{:U('Boon/lists')}');
$('#submit').click(function(){
$('#form').submit();
});
$(function(){
$('.date').datetimepicker({
format: 'yyyy-mm-dd hh:ii',
language:"zh-CN",
minView:0,startDate:new Date(),
autoclose:true
});
$('.time').datetimepicker({
format: 'yyyy-mm-dd hh:ii',
language:"zh-CN",
minView:0,startDate:new Date(),
autoclose:true
});
showTab();
});
$("#upload_picture_icon").uploadify({
"height" : 30,
"swf" : "__STATIC__/uploadify/uploadify.swf",
"fileObjName" : "download",
"buttonText" : "上传封面",
"uploader" : "{:U('File/uploadPicture',array('session_id'=>session_id(),'flag'=>true))}",
"width" : 120,
'removeTimeout' : 1,
'fileTypeExts' : '*.jpg; *.jpeg; *.png; *.gif;',
"onUploadSuccess" : upload_picture_icon,
'onFallback' : function() {
alert('未检测到兼容版本的Flash.');
}
});
function upload_picture_icon(file, data){
var data = $.parseJSON(data);
var src = '';
if(data.status){
$("#cover_id_icon").val(data.id);
src = data.url || '__ROOT__' + data.path;
$("#cover_id_icon").parent().find('.upload-img-box').html(
'<div class="upload-pre-item"><span class="placeholder-graphic placeholder-graphic_icon"><img src="' + src + '"/></span></div>'
);
} else {
updateAlert(data.info,'tip_error');
setTimeout(function(){
$('#top-alert').find('button').click();
$(that).removeClass('disabled').prop('disabled',false);
},1500);
}
}
var userInfo = {userId:"kazaff", md5:""}; //用户会话信息
var chunkSize = 5000 * 1024; //分块大小
var uniqueFileName = null; //文件唯一标识符
var md5Mark = null;
var backEndUrl = "{:U('File/shard_upload',array('type'=>1,'session_id'=>session_id()))}";
WebUploader.Uploader.register({
"before-send-file" : "beforeSendFile",
"before-send" : "beforeSend",
"after-send-file" : "afterSendFile"
}, {
beforeSendFile: function(file){
//秒传验证
var task = new $.Deferred();
var start = new Date().getTime();
(new WebUploader.Uploader()).md5File(file, 0, 10*1024*1024).progress(function(percentage){
//console.log(percentage);
}).then(function(val){
//console.log("总耗时: "+((new Date().getTime()) - start)/1000);
md5Mark = val;
userInfo.md5 = val;
$.ajax({
type: "POST"
, url: backEndUrl
, data: {status: "md5Check", md5: val}
, cache: false
, timeout: 1000 //todo 超时的话,只能认为该文件不曾上传过
, dataType: "json"
}).then(function(data, textStatus, jqXHR){
alert(data.chunk);
//console.log(data);
if(data.ifExist){ //若存在这返回失败给WebUploader表明该文件不需要上传
task.reject();
uploader.skipFile(file);
file.path = data.path;
}else{
task.resolve();
//拿到上传文件的唯一名称,用于断点续传
uniqueFileName = md5(''+userInfo.userId+file.name+file.type+file.lastModifiedDate+file.size);
}
}, function(jqXHR, textStatus, errorThrown){ //任何形式的验证失败,都触发重新上传
task.resolve();
//拿到上传文件的唯一名称,用于断点续传
uniqueFileName = md5(''+userInfo.userId+file.name+file.type+file.lastModifiedDate+file.size);
});
});
return $.when(task);
}
, beforeSend: function(block){
//分片验证是否已传过,用于断点续传
var task = new $.Deferred();
$.ajax({
type: "POST"
, url: backEndUrl
, data: {
status: "chunkCheck"
, name: uniqueFileName
, chunkIndex: block.chunk
, size: block.end - block.start
}
, cache: false
, timeout: 1000 //todo 超时的话,只能认为该分片未上传过
, dataType: "json"
}).then(function(data, textStatus, jqXHR){
if(data.ifExist){ //若存在返回失败给WebUploader表明该分块不需要上传
task.reject();
}else{
task.resolve();
}
}, function(jqXHR, textStatus, errorThrown){ //任何形式的验证失败,都触发重新上传
task.resolve();
});
return $.when(task);
}
, afterSendFile: function(file){
var chunksTotal = 0;
if((chunksTotal = Math.ceil(file.size/chunkSize)) > 1){
//合并请求
var task = new $.Deferred();
$.ajax({
type: "POST"
, url: backEndUrl
, data: {
status: "chunksMerge"
, name: uniqueFileName
, chunks: chunksTotal
, ext: file.ext
, md5: md5Mark
}
, cache: false
, dataType: "json"
}).then(function(data, textStatus, jqXHR){
//todo 检查响应是否正常
task.resolve();
file.path = data.path;
$("#file_name").val(data.name);
$("#file_url").val(data.path+'/'+data.name);
$("#file_size").val(file.size);
}, function(jqXHR, textStatus, errorThrown){
task.reject();
});
return $.when(task);
}else{
//UploadComlate(file);
}
}
});
var uploader = WebUploader.create({
// 选完文件后,是否自动上传。
auto: true,
// swf文件路径
swf: '__STATIC__/webuploader/Uploader.swf',
// 文件接收服务端。
server: backEndUrl,
// 选择文件的按钮。可选。
// 内部根据当前运行是创建可能是input元素也可能是flash.
pick: {id:'#picker'},
//dnd: "#theList",
paste: document.body,
accept: {
title: '压缩包',
extensions: 'gif,mp4',
mimeTypes: '*',
},
// 不压缩image, 默认如果是jpeg文件上传前会压缩一把再上传
resize: false,
disableGlobalDnd: true,
fileNumLimit:1,
threads:3,
compress: false,
prepareNextFile: true,
formData: function(){return $.extend(true, {}, userInfo);},
duplicate:true,
chunked:true,
chunkSize: 5*1000*1024,
duplicate: true
});
uploader.on('beforeFileQueued',function(file){
var mycars=new Array("gif","mp4");
if($.inArray(file.ext,mycars) == -1){
updateAlert('上传文件非法','tip_error');
setTimeout(function(){
$('#tip').find('.tipclose').click();
},1500);
return false;
}
//$.each(mycars,function(index,value){});
})
// 当有文件被添加进队列的时候
uploader.on( 'fileQueued', function( file ) {
$("#thelist").append( '<div id="' + file.id + '" class="item">' +
'<h4 class="info">' + file.name + '</h4>' +
'<p class="state">等待上传...</p>' +
'</div>' );
});
// 文件上传过程中创建进度条实时显示。
uploader.on( 'uploadProgress', function( file, percentage ) {
var $li = $( '#'+file.id ),
$percent = $li.find('.progress .progress-bar');
// 避免重复创建
if ( !$percent.length ) {
$percent = $('<div class="progress progress-striped active">' +
'<div class="progress-bar" role="progressbar" style="width: 0%">' +
'</div>' +
'</div>').appendTo( $li ).find('.progress-bar');
}
$li.find('p.state').text('上传中');
$percent.css( 'width', percentage * 100 + '%' );
$percent.text( (percentage * 100).toFixed(0) + '%' );
});
$('.jsdelzip').click(function() {
$("#file_url").val('');
$('#beforeupload').remove();
return false;
});
uploader.on( 'uploadSuccess', function( file , response) {
$( '#'+file.id ).find('p.state').text('已上传').fadeOut(800);
$('#'+file.id).find('h4.info').append('<a href="javascript:;" class="jsdelzip table_click" style="float:none;display:inline-block;margin-left:10px;">删除</a>');
$('#'+file.id).find('.jsdelzip').on('click',function() {
$("#file_url").val('');
uploader.removeFile( file.id );
$('#'+file.id).remove();
return false;
});
if(!response.chunk){
var url = response.path + "/" +response.name;
$("#file_url").val(url);
}
});
uploader.on( 'uploadError', function( file ) {
$( '#'+file.id ).find('p.state').text('上传出错');
});
uploader.on( 'uploadComplete', function(file) {
$( '#'+file.id ).find('.progress').fadeOut();
});
</script>
<script>
var userInfo = {userId:"kazaff", md5:""}; //用户会话信息
var chunkSize = 5000 * 1024; //分块大小
var uniqueFileName = null; //文件唯一标识符
var md5Mark = null;
var backEndUrl = "{:U('File/shard_upload',array('type'=>1,'session_id'=>session_id()))}";
WebUploader.Uploader.register({
"before-send-file" : "beforeSendFile",
"before-send" : "beforeSend",
"after-send-file" : "afterSendFile"
}, {
beforeSendFile: function(file){
//秒传验证
if (file['source']['ext'] === 'zip' || file['source']['ext'] === 'rar') {
var task = new $.Deferred();
var start = new Date().getTime();
(new WebUploader.Uploader()).md5File(file, 0, 10*1024*1024).progress(function(percentage){
//console.log(percentage);
}).then(function(val){
//console.log("总耗时: "+((new Date().getTime()) - start)/1000);
md5Mark = val;
userInfo.md5 = val;
$.ajax({
type: "POST"
, url: backEndUrl
, data: {status: "md5Check", md5: val}
, cache: false
, timeout: 1000 //todo 超时的话,只能认为该文件不曾上传过
, dataType: "json"
}).then(function(data, textStatus, jqXHR){
alert(data.chunk);
//console.log(data);
if(data.ifExist){ //若存在这返回失败给WebUploader表明该文件不需要上传
task.reject();
uploader.skipFile(file);
file.path = data.path;
}else{
task.resolve();
//拿到上传文件的唯一名称,用于断点续传
uniqueFileName = md5(''+userInfo.userId+file.name+file.type+file.lastModifiedDate+file.size);
}
}, function(jqXHR, textStatus, errorThrown){ //任何形式的验证失败,都触发重新上传
task.resolve();
//拿到上传文件的唯一名称,用于断点续传
uniqueFileName = md5(''+userInfo.userId+file.name+file.type+file.lastModifiedDate+file.size);
});
});
return $.when(task);
}
}
, beforeSend: function(block){
//分片验证是否已传过,用于断点续传
if (block['file']['source']['ext'] === 'zip' || block['file']['source']['ext'] === 'rar') {
var task = new $.Deferred();
$.ajax({
type: "POST"
, url: backEndUrl
, data: {
status: "chunkCheck"
, name: uniqueFileName
, chunkIndex: block.chunk
, size: block.end - block.start
}
, cache: false
, timeout: 1000 //todo 超时的话,只能认为该分片未上传过
, dataType: "json"
}).then(function(data, textStatus, jqXHR){
if(data.ifExist){ //若存在返回失败给WebUploader表明该分块不需要上传
task.reject();
}else{
task.resolve();
}
}, function(jqXHR, textStatus, errorThrown){ //任何形式的验证失败,都触发重新上传
task.resolve();
});
return $.when(task);
}
}
, afterSendFile: function(file){
if (file['source']['ext'] === 'zip' || file['source']['ext'] === 'rar') {
var chunksTotal = 0;
if((chunksTotal = Math.ceil(file.size/chunkSize)) > 1){
//合并请求
var task = new $.Deferred();
$.ajax({
type: "POST"
, url: backEndUrl
, data: {
status: "chunksMerge"
, name: uniqueFileName
, chunks: chunksTotal
, ext: file.ext
, md5: md5Mark
}
, cache: false
, dataType: "json"
}).then(function(data, textStatus, jqXHR){
//todo 检查响应是否正常
task.resolve();
file.path = data.path;
$("#file_name").val(data.name);
$("#file_url").val(data.path+'/'+data.name);
$("#file_size").val(file.size);
}, function(jqXHR, textStatus, errorThrown){
task.reject();
});
return $.when(task);
}else{
//UploadComlate(file);
}
}
}
});
</script>
<script>
var uploaderImgicon= WebUploader.create({
// 选完文件后,是否自动上传。
auto: true,
// swf文件路径
swf: '__STATIC__/webuploader/Uploader.swf',
server: "{:U('File/uploadPicture',array('session_id'=>session_id(),'flag'=>true))}",
// 选择文件的按钮。可选。
// 内部根据当前运行是创建可能是input元素也可能是flash.
pick: {
id:'#icon',
multiple:true
},
// dnd: false,
paste: document.body,
accept: {
title: '图片',
extensions: 'png,gif,jpg,jpeg,bmp',
mimeTypes: '.png,.gif,.jpg,.jpeg,.bmp',
},
// 不压缩image, 默认如果是jpeg文件上传前会压缩一把再上传
resize: false,
disableGlobalDnd: true,
fileNumLimit:1,
threads:5,
thumb:true,
compress:false,
prepareNextFile: true,
formData: function(){return $.extend(true, {}, userInfo);},
chunked:false,
duplicate: true
});
var imgiconListData = [];
<?php if (!empty($data['icon_data'])) :?>
var html = '';
$('#iconList').css('margin-top','10px');
<?php foreach ($data['icon_data'] as $value) {?>
<?php $value = (int)$value;?>
imgiconListData.push(<?=$value?>);
html += '<div id="' + <?=$value?> + '" class="item flooring_page_img_box" style="margin-right: 10px;">';
html += '<a href="javascript:;"><img src="<?=get_icon($value,"path")?>" style="width: 100px;height: 100px;cursor: move;"></a>';
html += '<h4 class="info" style="text-align: center;">';
html += '<a href="javascript:;" class="jsdelzip table_click" style="float:none;display:inline-block;" img-id="' + <?=$value?> + '">删除</a>';
html += '</h4>';
html += '<div class="progress progress-striped active" style="display: none;">';
html += '<div class="progress-bar" role="progressbar" style="width: 100%;">100%</div>';
html += '</div>';
html += '</div>';
<?php }?>
$('#iconList').html(html);
$('#iconList').children().children('h4').children('.jsdelzip').on('click', function() {
var thisId = $(this).attr('img-id');
$(this).parent().parent().remove();
$.each(imgiconListData,function(index, item) {
if (thisId == item) {
imgiconListData.splice(index,1);
return false;
}
});
seticonVal();
});
<?php endif ;?>
// 当有文件被添加进队列的时候
var thisIndex = 0;
var imgiconList = $("#iconList");
uploaderImgicon.on( 'fileQueued', function( file ) {
var html = '';
html += '<div id="' + file.id + '" class="item" style="margin-right: 10px;">';
html += '<a href="javascript:;"><img src="" style="width: 100px;height: 100px;cursor: move;"></a>';
html += '<h4 class="info">' + file.name + '</h4>';
html += '<p class="state">等待上传...</p>';
html += '</div>';
imgiconList.append(html);
imgiconList.css('margin-top','10px');
var img = imgiconList.children('#'+file.id).find('img');
uploaderImgicon.makeThumb(file, function (error, src) {
if (error) {
return;
}
img.attr('src', src);
}, 300, 300);
});
// 文件上传过程中创建进度条实时显示。
uploaderImgicon.on( 'uploadProgress', function( file, percentage ) {
var $li = $( '#'+file.id ),
$percent = $li.find('.progress .progress-bar');
// 避免重复创建
if ( !$percent.length ) {
$percent = $('<div class="progress progress-striped active">' +
'<div class="progress-bar" role="progressbar" style="width: 0%">' +
'</div>' +
'</div>').appendTo( $li ).find('.progress-bar');
}
$li.find('p.state').text('上传中');
$percent.css( 'width', percentage * 100 + '%' );
$percent.text( (percentage * 100).toFixed(0) + '%' );
});
uploaderImgicon.on( 'uploadSuccess', function( file , response) {
imgiconListData.push(Number(response.id));
console.log(imgiconListData)
seticonVal();
$( '#'+file.id ).find('p.state').text('已上传').fadeOut(800);
//alert(JSON.stringify(response));
$('#'+file.id).find('h4.info').append('<a href="javascript:;" class="jsdelzip table_click" style="float:none;display:inline-block;margin-left:10px;">删除</a>');
$('#'+file.id).find('.jsdelzip').on('click',function() {
uploaderImgicon.removeFile( file.id );
$('#'+file.id).remove();
$.each(imgiconListData,function(index, item) {
if (response.id == item) {
imgiconListData.splice(index,1);
return false;
}
});
seticonVal();
console.log(imgiconListData);
return false;
});
});
uploaderImgicon.on('uploadError', function(file) {
$( '#'+file.id ).find('p.state').text('上传出错');
});
uploaderImgicon.on( 'uploadComplete', function(file) {
$( '#'+file.id ).find('.progress').fadeOut();
});
function seticonVal()
{
var icon = '';
$.each(imgiconListData,function(index, item) {
icon += item + ',';
});
icon = icon.substring(0, icon.length - 1);
$("input[name=icon]").val(icon);
}
documentUpload('icon','iconList',5,'{$data.icon}','{$data.valuedata}','icon_data','icon','{:U('File/uploadPicture',array('session_id'=>session_id(),'flag'=>true))}')
</script>
</block>

@ -9,6 +9,8 @@
<script type="text/javascript" src="__STATIC__/uploadify/jquery.uploadify.min.js"></script>
<script src="__STATIC__/md5.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript" src="__STATIC__/webuploader/webuploader.js"></script>
<script type="text/javascript" src="__STATIC__/webuploader/webuploader.inc.js"></script>
<script type="text/javascript" src="__STATIC__/webuploader/webuploader.before.js"></script>
<link rel="stylesheet" href="__CSS__/select2.min.css" type="text/css" />
<style>
.select2-container--default .select2-selection--single .select2-selection__rendered {
@ -108,7 +110,7 @@
<input type="hidden" name="icon" id="cover_id_icon" value=""/>
<div id="uploader-demo" >
<div id="icon">
<div class="webuploader-pick" style="line-height:13px">上传图片</div></div>
<div class="webuploader-pick" style="line-height:13px" onclick="documentUpload('icon','iconList',5,'{$data.icon}','{$data.valuedata}','icon_data','icon','{:U('File/uploadPicture',array('session_id'=>session_id(),'flag'=>true))}')">上传图片</div></div>
<div id="iconList" class="uploader-list" style="display: flex;"></div>
</div>
@ -157,434 +159,9 @@
<script type="text/javascript" src="__STATIC__/datetimepicker/js/locales/bootstrap-datetimepicker.zh-CN.js" charset="UTF-8"></script>
<script type="text/javascript" src="__JS__/select2.min.js"></script>
<script type="text/javascript">
//导航高亮
highlight_subnav('{:U('Boon/lists')}');
Think.setValue("way", {$data.way|default = 1});
$('#submit').click(function(){
$('#form').submit();
});
$(function(){
$('.date').datetimepicker({
format: 'yyyy-mm-dd hh:ii',
language:"zh-CN",
minView:0,startDate:new Date(),
autoclose:true
});
$('.time').datetimepicker({
format: 'yyyy-mm-dd hh:ii',
language:"zh-CN",
minView:0,startDate:new Date(),
autoclose:true
});
showTab();
});
$("#upload_picture_icon").uploadify({
"height" : 30,
"swf" : "__STATIC__/uploadify/uploadify.swf",
"fileObjName" : "download",
"buttonText" : "上传封面",
"uploader" : "{:U('File/uploadPicture',array('session_id'=>session_id(),'flag'=>true))}",
"width" : 120,
'removeTimeout' : 1,
'fileTypeExts' : '*.jpg; *.jpeg; *.png; *.gif;',
"onUploadSuccess" : upload_picture_icon,
'onFallback' : function() {
alert('未检测到兼容版本的Flash.');
}
});
function upload_picture_icon(file, data){
var data = $.parseJSON(data);
var src = '';
if(data.status){
$("#cover_id_icon").val(data.id);
src = data.url || '__ROOT__' + data.path;
$("#cover_id_icon").parent().find('.upload-img-box').html(
'<div class="upload-pre-item"><span class="placeholder-graphic placeholder-graphic_icon"><img src="' + src + '"/></span></div>'
);
} else {
updateAlert(data.info,'tip_error');
setTimeout(function(){
$('#top-alert').find('button').click();
$(that).removeClass('disabled').prop('disabled',false);
},1500);
}
}
var userInfo = {userId:"kazaff", md5:""}; //用户会话信息
var chunkSize = 5000 * 1024; //分块大小
var uniqueFileName = null; //文件唯一标识符
var md5Mark = null;
var backEndUrl = "{:U('File/shard_upload',array('type'=>1,'session_id'=>session_id()))}";
WebUploader.Uploader.register({
"before-send-file" : "beforeSendFile",
"before-send" : "beforeSend",
"after-send-file" : "afterSendFile"
}, {
beforeSendFile: function(file){
//秒传验证
var task = new $.Deferred();
var start = new Date().getTime();
(new WebUploader.Uploader()).md5File(file, 0, 10*1024*1024).progress(function(percentage){
//console.log(percentage);
}).then(function(val){
//console.log("总耗时: "+((new Date().getTime()) - start)/1000);
md5Mark = val;
userInfo.md5 = val;
$.ajax({
type: "POST"
, url: backEndUrl
, data: {status: "md5Check", md5: val}
, cache: false
, timeout: 1000 //todo 超时的话,只能认为该文件不曾上传过
, dataType: "json"
}).then(function(data, textStatus, jqXHR){
alert(data.chunk);
//console.log(data);
if(data.ifExist){ //若存在这返回失败给WebUploader表明该文件不需要上传
task.reject();
uploader.skipFile(file);
file.path = data.path;
}else{
task.resolve();
//拿到上传文件的唯一名称,用于断点续传
uniqueFileName = md5(''+userInfo.userId+file.name+file.type+file.lastModifiedDate+file.size);
}
}, function(jqXHR, textStatus, errorThrown){ //任何形式的验证失败,都触发重新上传
task.resolve();
//拿到上传文件的唯一名称,用于断点续传
uniqueFileName = md5(''+userInfo.userId+file.name+file.type+file.lastModifiedDate+file.size);
});
});
return $.when(task);
}
, beforeSend: function(block){
//分片验证是否已传过,用于断点续传
var task = new $.Deferred();
$.ajax({
type: "POST"
, url: backEndUrl
, data: {
status: "chunkCheck"
, name: uniqueFileName
, chunkIndex: block.chunk
, size: block.end - block.start
}
, cache: false
, timeout: 1000 //todo 超时的话,只能认为该分片未上传过
, dataType: "json"
}).then(function(data, textStatus, jqXHR){
if(data.ifExist){ //若存在返回失败给WebUploader表明该分块不需要上传
task.reject();
}else{
task.resolve();
}
}, function(jqXHR, textStatus, errorThrown){ //任何形式的验证失败,都触发重新上传
task.resolve();
});
return $.when(task);
}
, afterSendFile: function(file){
var chunksTotal = 0;
if((chunksTotal = Math.ceil(file.size/chunkSize)) > 1){
//合并请求
var task = new $.Deferred();
$.ajax({
type: "POST"
, url: backEndUrl
, data: {
status: "chunksMerge"
, name: uniqueFileName
, chunks: chunksTotal
, ext: file.ext
, md5: md5Mark
}
, cache: false
, dataType: "json"
}).then(function(data, textStatus, jqXHR){
//todo 检查响应是否正常
task.resolve();
file.path = data.path;
$("#file_name").val(data.name);
$("#file_url").val(data.path+'/'+data.name);
$("#file_size").val(file.size);
}, function(jqXHR, textStatus, errorThrown){
task.reject();
});
return $.when(task);
}else{
//UploadComlate(file);
}
}
});
var uploader = WebUploader.create({
// 选完文件后,是否自动上传。
auto: true,
// swf文件路径
swf: '__STATIC__/webuploader/Uploader.swf',
// 文件接收服务端。
server: backEndUrl,
// 选择文件的按钮。可选。
// 内部根据当前运行是创建可能是input元素也可能是flash.
pick: {id:'#picker'},
//dnd: "#theList",
paste: document.body,
accept: {
title: '',
extensions: 'gif,mp4',
mimeTypes: '*',
},
// 不压缩image, 默认如果是jpeg文件上传前会压缩一把再上传
resize: false,
disableGlobalDnd: true,
fileNumLimit:1,
threads:3,
compress: false,
prepareNextFile: true,
formData: function(){return $.extend(true, {}, userInfo);},
duplicate:true,
chunked:true,
chunkSize: 5*1000*1024,
duplicate: true
});
uploader.on('beforeFileQueued',function(file){
var mycars=new Array("gif","mp4");
if($.inArray(file.ext,mycars) == -1){
updateAlert('上传文件非法','tip_error');
setTimeout(function(){
$('#tip').find('.tipclose').click();
},1500);
return false;
}
if(file.ext == 'gif' && file.size > 2*1024*1024) {
updateAlert('上传文件图片大小不得超出2M','tip_error');
setTimeout(function(){
$('#tip').find('.tipclose').click();
},1500);
return false;
}
if(file.ext == 'mp4' && file.size > 5*1024*1024) {
updateAlert('上传文件视频大小不得超出5M','tip_error');
setTimeout(function(){
$('#tip').find('.tipclose').click();
},1500);
return false;
}
//$.each(mycars,function(index,value){});
})
// 当有文件被添加进队列的时候
uploader.on( 'fileQueued', function( file ) {
$("#thelist").append( '<div id="' + file.id + '" class="item">' +
'<h4 class="info">' + file.name + '</h4>' +
'<p class="state">等待上传...</p>' +
'</div>' );
});
// 文件上传过程中创建进度条实时显示。
uploader.on( 'uploadProgress', function( file, percentage ) {
var $li = $( '#'+file.id ),
$percent = $li.find('.progress .progress-bar');
// 避免重复创建
if ( !$percent.length ) {
$percent = $('<div class="progress progress-striped active">' +
'<div class="progress-bar" role="progressbar" style="width: 0%">' +
'</div>' +
'</div>').appendTo( $li ).find('.progress-bar');
}
$li.find('p.state').text('上传中');
$percent.css( 'width', percentage * 100 + '%' );
$percent.text( (percentage * 100).toFixed(0) + '%' );
});
$('.jsdelzip').click(function() {
$("#file_url").val('');
$('#beforeupload').remove();
return false;
});
uploader.on( 'uploadSuccess', function( file , response) {
$( '#'+file.id ).find('p.state').text('已上传').fadeOut(800);
$('#'+file.id).find('h4.info').append('<a href="javascript:;" class="jsdelzip table_click" style="float:none;display:inline-block;margin-left:10px;">删除</a>');
$('#'+file.id).find('.jsdelzip').on('click',function() {
$("#file_url").val('');
uploader.removeFile( file.id );
$('#'+file.id).remove();
return false;
});
if(!response.chunk){
var url = response.path + "/" +response.name;
$("#file_url").val(url);
}
});
uploader.on( 'uploadError', function( file ) {
$( '#'+file.id ).find('p.state').text('上传出错');
});
uploader.on( 'uploadComplete', function(file) {
$( '#'+file.id ).find('.progress').fadeOut();
});
</script>
<script>
var uploaderImgicon= WebUploader.create({
// 选完文件后,是否自动上传。
auto: true,
// swf文件路径
swf: '__STATIC__/webuploader/Uploader.swf',
server: "{:U('File/uploadPicture',array('session_id'=>session_id(),'flag'=>true))}",
// 选择文件的按钮。可选。
// 内部根据当前运行是创建可能是input元素也可能是flash.
pick: {
id:'#icon',
multiple:true
},
// dnd: false,
paste: document.body,
accept: {
title: '图片',
extensions: 'png,gif,jpg,jpeg,bmp',
mimeTypes: '.png,.gif,.jpg,.jpeg,.bmp',
},
// 不压缩image, 默认如果是jpeg文件上传前会压缩一把再上传
resize: false,
disableGlobalDnd: true,
fileNumLimit:1,
threads:5,
thumb:true,
compress:false,
prepareNextFile: true,
formData: function(){return $.extend(true, {}, userInfo);},
chunked:false,
duplicate: true
});
var imgiconListData = [];
<?php if (!empty($data['icon_data'])) :?>
var html = '';
$('#iconList').css('margin-top','10px');
<?php foreach ($data['icon_data'] as $value) {?>
<?php $value = (int)$value;?>
imgiconListData.push(<?=$value?>);
html += '<div id="' + <?=$value?> + '" class="item flooring_page_img_box" style="margin-right: 10px;">';
html += '<a href="javascript:;"><img src="<?=get_cover($value,"path")?>" style="width: 100px;height: 100px;cursor: move;"></a>';
html += '<h4 class="info" style="text-align: center;">';
html += '<a href="javascript:;" class="jsdelzip table_click" style="float:none;display:inline-block;" img-id="' + <?=$value?> + '">删除</a>';
html += '</h4>';
html += '<div class="progress progress-striped active" style="display: none;">';
html += '<div class="progress-bar" role="progressbar" style="width: 100%;">100%</div>';
html += '</div>';
html += '</div>';
<?php }?>
$('#iconList').html(html);
$('#iconList').children().children('h4').children('.jsdelzip').on('click', function() {
var thisId = $(this).attr('img-id');
$(this).parent().parent().remove();
$.each(imgiconListData,function(index, item) {
if (thisId == item) {
imgiconListData.splice(index,1);
return false;
}
});
seticonVal();
});
<?php endif ;?>
// 当有文件被添加进队列的时候
var thisIndex = 0;
var imgiconList = $("#iconList");
uploaderImgicon.on( 'fileQueued', function( file ) {
var html = '';
html += '<div id="' + file.id + '" class="item" style="margin-right: 10px;">';
html += '<a href="javascript:;"><img src="" style="width: 100px;height: 100px;cursor: move;"></a>';
html += '<h4 class="info">' + file.name + '</h4>';
html += '<p class="state">等待上传...</p>';
html += '</div>';
imgiconList.append(html);
imgiconList.css('margin-top','10px');
var img = imgiconList.children('#'+file.id).find('img');
uploaderImgicon.makeThumb(file, function (error, src) {
if (error) {
return;
}
img.attr('src', src);
}, 300, 300);
});
// 文件上传过程中创建进度条实时显示。
uploaderImgicon.on( 'uploadProgress', function( file, percentage ) {
var $li = $( '#'+file.id ),
$percent = $li.find('.progress .progress-bar');
// 避免重复创建
if ( !$percent.length ) {
$percent = $('<div class="progress progress-striped active">' +
'<div class="progress-bar" role="progressbar" style="width: 0%">' +
'</div>' +
'</div>').appendTo( $li ).find('.progress-bar');
}
$li.find('p.state').text('上传中');
$percent.css( 'width', percentage * 100 + '%' );
$percent.text( (percentage * 100).toFixed(0) + '%' );
});
uploaderImgicon.on( 'uploadSuccess', function( file , response) {
imgiconListData.push(Number(response.id));
console.log(imgiconListData)
seticonVal();
$( '#'+file.id ).find('p.state').text('已上传').fadeOut(800);
//alert(JSON.stringify(response));
$('#'+file.id).find('h4.info').append('<a href="javascript:;" class="jsdelzip table_click" style="float:none;display:inline-block;margin-left:10px;">删除</a>');
$('#'+file.id).find('.jsdelzip').on('click',function() {
uploaderImgicon.removeFile( file.id );
$('#'+file.id).remove();
$.each(imgiconListData,function(index, item) {
if (response.id == item) {
imgiconListData.splice(index,1);
return false;
}
});
seticonVal();
console.log(imgiconListData);
return false;
});
});
uploaderImgicon.on('uploadError', function(file) {
$( '#'+file.id ).find('p.state').text('上传出错');
});
uploaderImgicon.on( 'uploadComplete', function(file) {
$( '#'+file.id ).find('.progress').fadeOut();
});
function seticonVal()
{
var icon = '';
$.each(imgiconListData,function(index, item) {
icon += item + ',';
});
icon = icon.substring(0, icon.length - 1);
$("input[name=icon]").val(icon);
}
documentUpload('icon','iconList',5,'{$data.icon}','{$data.valuedata}','icon_data','icon','{:U('File/uploadPicture',array('session_id'=>session_id(),'flag'=>true))}')
</script>
</block>

@ -7,7 +7,8 @@
<script src="__STATIC__/md5.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript" src="__STATIC__/uploadify/jquery.uploadify.min.js"></script>
<script type="text/javascript" src="__STATIC__/webuploader/webuploader.js"></script>
<script type="text/javascript" src="__STATIC__/webuploader/webuploader.inc.js"></script>
<script type="text/javascript" src="__STATIC__/webuploader/webuploader.before.js"></script>
<div class="cf main-place top_nav_list navtab_list">
{:W('Index/navigation',array('value'=>'PointType/lists','compare'=>'PointShop/lists'))}
<h3 class="page_title">新增积分商品</h3>
@ -50,7 +51,7 @@
<input type="hidden" name="cover" id="cover_id_cover" value=""/>
<div id="uploader-demo" >
<div id="cover">
<div class="webuploader-pick" style="line-height: 13px">上传图片</div></div>
<div class="webuploader-pick" style="line-height: 13px" onclick="documentUpload('cover','coverList',5,'{$data.cover}','{$data.valuedata}','icon_data','cover','{:U('File/uploadPicture',array('session_id'=>session_id(),'flag'=>true))}')">上传图片</div></div>
<div id="coverList" class="uploader-list" style="display: flex;"></div>
</div>
<span class="notice-text">552x374px</span>
@ -124,331 +125,7 @@
<block name="script">
<script type="text/javascript" src="__STATIC__/datetimepicker/js/bootstrap-datetimepicker.min.js"></script>
<script type="text/javascript">
//导航高亮
highlight_subnav("{:U('PointType/lists')}");
$('#submit').click(function(){
$('#form').submit();
});
$(function () {
good_type();
$(".good_type").click(function(){
good_type();
});
});
function good_type(){
var type = $(":input[name='good_type']:checked").val();
if(type == 1){
$(".good_key").hide();
$(".good_num").show();
}else{
$(".good_key").show();
$(".good_num").hide();
}
}
//上传游戏封面
/* 初始化上传插件 */
$("#upload_picture_cover").uploadify({
"height" : 30,
"swf" : "__STATIC__/uploadify/uploadify.swf",
"fileObjName" : "download",
"buttonText" : "上传封面",
"uploader" : "{:U('File/uploadPicture',array('session_id'=>session_id(),'flag'=>true))}",
"width" : 120,
'removeTimeout' : 1,
'fileTypeExts' : '*.jpg; *.jpeg; *.png; *.gif;',
"onUploadSuccess" : upload_picture_cover{$field.name},
'onFallback' : function() {
alert('未检测到兼容版本的Flash.');
}
});
function upload_picture_cover{$field.name}(file, data){
console.log(data);
var data = $.parseJSON(data);
var src = '';
if(data.status){
$("#cover_id_cover").val(data.id);
src = data.url || '__ROOT__' + data.path;
$("#cover_id_cover").parent().find('.upload-img-box').html(
'<div class="upload-pre-item"><img src="' + src + '"/></div>'
);
} else {
updateAlert(data.info);
setTimeout(function(){
$('#top-alert').find('button').click();
$("#upload_picture_cover").removeClass('disabled').prop('disabled',false);
},1500);
}
}
</script>
<script>
var userInfo = {userId:"kazaff", md5:""}; //用户会话信息
var chunkSize = 5000 * 1024; //分块大小
var uniqueFileName = null; //文件唯一标识符
var md5Mark = null;
var backEndUrl = "{:U('File/shard_upload',array('type'=>1,'session_id'=>session_id()))}";
WebUploader.Uploader.register({
"before-send-file" : "beforeSendFile",
"before-send" : "beforeSend",
"after-send-file" : "afterSendFile"
}, {
beforeSendFile: function(file){
//秒传验证
if (file['source']['ext'] === 'zip' || file['source']['ext'] === 'rar') {
var task = new $.Deferred();
var start = new Date().getTime();
(new WebUploader.Uploader()).md5File(file, 0, 10*1024*1024).progress(function(percentage){
//console.log(percentage);
}).then(function(val){
//console.log("总耗时: "+((new Date().getTime()) - start)/1000);
md5Mark = val;
userInfo.md5 = val;
$.ajax({
type: "POST"
, url: backEndUrl
, data: {status: "md5Check", md5: val}
, cache: false
, timeout: 1000 //todo 超时的话,只能认为该文件不曾上传过
, dataType: "json"
}).then(function(data, textStatus, jqXHR){
alert(data.chunk);
//console.log(data);
if(data.ifExist){ //若存在这返回失败给WebUploader表明该文件不需要上传
task.reject();
uploader.skipFile(file);
file.path = data.path;
}else{
task.resolve();
//拿到上传文件的唯一名称,用于断点续传
uniqueFileName = md5(''+userInfo.userId+file.name+file.type+file.lastModifiedDate+file.size);
}
}, function(jqXHR, textStatus, errorThrown){ //任何形式的验证失败,都触发重新上传
task.resolve();
//拿到上传文件的唯一名称,用于断点续传
uniqueFileName = md5(''+userInfo.userId+file.name+file.type+file.lastModifiedDate+file.size);
});
});
return $.when(task);
}
}
, beforeSend: function(block){
//分片验证是否已传过,用于断点续传
if (block['file']['source']['ext'] === 'zip' || block['file']['source']['ext'] === 'rar') {
var task = new $.Deferred();
$.ajax({
type: "POST"
, url: backEndUrl
, data: {
status: "chunkCheck"
, name: uniqueFileName
, chunkIndex: block.chunk
, size: block.end - block.start
}
, cache: false
, timeout: 1000 //todo 超时的话,只能认为该分片未上传过
, dataType: "json"
}).then(function(data, textStatus, jqXHR){
if(data.ifExist){ //若存在返回失败给WebUploader表明该分块不需要上传
task.reject();
}else{
task.resolve();
}
}, function(jqXHR, textStatus, errorThrown){ //任何形式的验证失败,都触发重新上传
task.resolve();
});
return $.when(task);
}
}
, afterSendFile: function(file){
if (file['source']['ext'] === 'zip' || file['source']['ext'] === 'rar') {
var chunksTotal = 0;
if((chunksTotal = Math.ceil(file.size/chunkSize)) > 1){
//合并请求
var task = new $.Deferred();
$.ajax({
type: "POST"
, url: backEndUrl
, data: {
status: "chunksMerge"
, name: uniqueFileName
, chunks: chunksTotal
, ext: file.ext
, md5: md5Mark
}
, cache: false
, dataType: "json"
}).then(function(data, textStatus, jqXHR){
//todo 检查响应是否正常
task.resolve();
file.path = data.path;
$("#file_name").val(data.name);
$("#file_url").val(data.path+'/'+data.name);
$("#file_size").val(file.size);
}, function(jqXHR, textStatus, errorThrown){
task.reject();
});
return $.when(task);
}else{
//UploadComlate(file);
}
}
}
});
</script>
<script>
var uploaderImgcover= WebUploader.create({
// 选完文件后,是否自动上传。
auto: true,
// swf文件路径
swf: '__STATIC__/webuploader/Uploader.swf',
server: "{:U('File/uploadPicture',array('session_id'=>session_id(),'flag'=>true))}",
// 选择文件的按钮。可选。
// 内部根据当前运行是创建可能是input元素也可能是flash.
pick: {
id:'#cover',
multiple:true
},
// dnd: false,
paste: document.body,
accept: {
title: '图片',
extensions: 'png,gif,jpg,jpeg,bmp',
mimeTypes: '.png,.gif,.jpg,.jpeg,.bmp',
},
// 不压缩image, 默认如果是jpeg文件上传前会压缩一把再上传
resize: false,
disableGlobalDnd: true,
fileNumLimit:1,
threads:5,
thumb:true,
compress:false,
prepareNextFile: true,
formData: function(){return $.extend(true, {}, userInfo);},
chunked:false,
duplicate: true
});
var imgcoverListData = [];
<?php if (!empty($config['cover_data'])) :?>
var html = '';
$('#coverList').css('margin-top','10px');
<?php foreach ($config['cover_data'] as $value) {?>
<?php $value = (int)$value;?>
imgcoverListData.push(<?=$value?>);
html += '<div id="' + <?=$value?> + '" class="item flooring_page_img_box" style="margin-right: 10px;">';
html += '<a href="javascript:;"><img src="<?=get_cover($value,"path")?>" style="width: 100px;height: 100px;cursor: move;"></a>';
html += '<h4 class="info" style="text-align: center;">';
html += '<a href="javascript:;" class="jsdelzip table_click" style="float:none;display:inline-block;" img-id="' + <?=$value?> + '">删除</a>';
html += '</h4>';
html += '<div class="progress progress-striped active" style="display: none;">';
html += '<div class="progress-bar" role="progressbar" style="width: 100%;">100%</div>';
html += '</div>';
html += '</div>';
<?php }?>
$('#coverList').html(html);
$('#coverList').children().children('h4').children('.jsdelzip').on('click', function() {
var thisId = $(this).attr('img-id');
$(this).parent().parent().remove();
$.each(imgcoverListData,function(index, item) {
if (thisId == item) {
imgcoverListData.splice(index,1);
return false;
}
});
setcoverVal();
});
<?php endif ;?>
// 当有文件被添加进队列的时候
var thisIndex = 0;
var imgcoverList = $("#coverList");
uploaderImgcover.on( 'fileQueued', function( file ) {
var html = '';
html += '<div id="' + file.id + '" class="item" style="margin-right: 10px;">';
html += '<a href="javascript:;"><img src="" style="width: 100px;height: 100px;cursor: move;"></a>';
html += '<h4 class="info">' + file.name + '</h4>';
html += '<p class="state">等待上传...</p>';
html += '</div>';
imgcoverList.append(html);
imgcoverList.css('margin-top','10px');
var img = imgcoverList.children('#'+file.id).find('img');
uploaderImgcover.makeThumb(file, function (error, src) {
if (error) {
return;
}
img.attr('src', src);
}, 300, 300);
});
// 文件上传过程中创建进度条实时显示。
uploaderImgcover.on( 'uploadProgress', function( file, percentage ) {
var $li = $( '#'+file.id ),
$percent = $li.find('.progress .progress-bar');
// 避免重复创建
if ( !$percent.length ) {
$percent = $('<div class="progress progress-striped active">' +
'<div class="progress-bar" role="progressbar" style="width: 0%">' +
'</div>' +
'</div>').appendTo( $li ).find('.progress-bar');
}
$li.find('p.state').text('上传中');
$percent.css( 'width', percentage * 100 + '%' );
$percent.text( (percentage * 100).toFixed(0) + '%' );
});
uploaderImgcover.on( 'uploadSuccess', function( file , response) {
imgcoverListData.push(Number(response.id));
console.log(imgcoverListData)
setcoverVal();
$( '#'+file.id ).find('p.state').text('已上传').fadeOut(800);
//alert(JSON.stringify(response));
$('#'+file.id).find('h4.info').append('<a href="javascript:;" class="jsdelzip table_click" style="float:none;display:inline-block;margin-left:10px;">删除</a>');
$('#'+file.id).find('.jsdelzip').on('click',function() {
uploaderImgcover.removeFile( file.id );
$('#'+file.id).remove();
$.each(imgcoverListData,function(index, item) {
if (response.id == item) {
imgcoverListData.splice(index,1);
return false;
}
});
setcoverVal();
console.log(imgcoverListData);
return false;
});
});
uploaderImgcover.on('uploadError', function(file) {
$( '#'+file.id ).find('p.state').text('上传出错');
});
uploaderImgcover.on( 'uploadComplete', function(file) {
$( '#'+file.id ).find('.progress').fadeOut();
});
function setcoverVal()
{
var cover = '';
$.each(imgcoverListData,function(index, item) {
cover += item + ',';
});
cover = cover.substring(0, cover.length - 1);
$("input[name=cover]").val(cover);
}
documentUpload('cover','coverList',5,'{$data.cover}','{$data.valuedata}','icon_data','cover','{:U('File/uploadPicture',array('session_id'=>session_id(),'flag'=>true))}')
</script>
</block>

@ -7,7 +7,8 @@
<script src="__STATIC__/md5.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript" src="__STATIC__/uploadify/jquery.uploadify.min.js"></script>
<script type="text/javascript" src="__STATIC__/webuploader/webuploader.js"></script>
<script type="text/javascript" src="__STATIC__/webuploader/webuploader.inc.js"></script>
<script type="text/javascript" src="__STATIC__/webuploader/webuploader.before.js"></script>
<div class="cf main-place top_nav_list navtab_list">
{:W('Index/navigation',array('value'=>'PointType/lists','compare'=>'PointShop/lists'))}
<h3 class="page_title">编辑积分商品</h3>
@ -50,10 +51,11 @@
<input type="hidden" name="cover" id="cover_id_cover" value=""/>
<div id="uploader-demo" >
<div id="cover">
<div class="webuploader-pick" style="line-height: 13px">上传图片</div></div>
<div class="webuploader-pick" style="line-height: 13px" onclick="documentUpload('cover','coverList',5,'{$data.cover}','{$data.valuedata}','icon_data','cover','{:U('File/uploadPicture',array('session_id'=>session_id(),'flag'=>true))}')">上传图片</div></div>
<div id="coverList" class="uploader-list" style="display: flex;"></div>
</div>
<span class="notice-text">552x374px</span>
</td>
</td>
</tr>
@ -186,271 +188,7 @@
}
}
</script>
<script>
var userInfo = {userId:"kazaff", md5:""}; //用户会话信息
var chunkSize = 5000 * 1024; //分块大小
var uniqueFileName = null; //文件唯一标识符
var md5Mark = null;
var backEndUrl = "{:U('File/shard_upload',array('type'=>1,'session_id'=>session_id()))}";
WebUploader.Uploader.register({
"before-send-file" : "beforeSendFile",
"before-send" : "beforeSend",
"after-send-file" : "afterSendFile"
}, {
beforeSendFile: function(file){
//秒传验证
if (file['source']['ext'] === 'zip' || file['source']['ext'] === 'rar') {
var task = new $.Deferred();
var start = new Date().getTime();
(new WebUploader.Uploader()).md5File(file, 0, 10*1024*1024).progress(function(percentage){
//console.log(percentage);
}).then(function(val){
//console.log("总耗时: "+((new Date().getTime()) - start)/1000);
md5Mark = val;
userInfo.md5 = val;
$.ajax({
type: "POST"
, url: backEndUrl
, data: {status: "md5Check", md5: val}
, cache: false
, timeout: 1000 //todo 超时的话,只能认为该文件不曾上传过
, dataType: "json"
}).then(function(data, textStatus, jqXHR){
alert(data.chunk);
//console.log(data);
if(data.ifExist){ //若存在这返回失败给WebUploader表明该文件不需要上传
task.reject();
uploader.skipFile(file);
file.path = data.path;
}else{
task.resolve();
//拿到上传文件的唯一名称,用于断点续传
uniqueFileName = md5(''+userInfo.userId+file.name+file.type+file.lastModifiedDate+file.size);
}
}, function(jqXHR, textStatus, errorThrown){ //任何形式的验证失败,都触发重新上传
task.resolve();
//拿到上传文件的唯一名称,用于断点续传
uniqueFileName = md5(''+userInfo.userId+file.name+file.type+file.lastModifiedDate+file.size);
});
});
return $.when(task);
}
}
, beforeSend: function(block){
//分片验证是否已传过,用于断点续传
if (block['file']['source']['ext'] === 'zip' || block['file']['source']['ext'] === 'rar') {
var task = new $.Deferred();
$.ajax({
type: "POST"
, url: backEndUrl
, data: {
status: "chunkCheck"
, name: uniqueFileName
, chunkIndex: block.chunk
, size: block.end - block.start
}
, cache: false
, timeout: 1000 //todo 超时的话,只能认为该分片未上传过
, dataType: "json"
}).then(function(data, textStatus, jqXHR){
if(data.ifExist){ //若存在返回失败给WebUploader表明该分块不需要上传
task.reject();
}else{
task.resolve();
}
}, function(jqXHR, textStatus, errorThrown){ //任何形式的验证失败,都触发重新上传
task.resolve();
});
return $.when(task);
}
}
, afterSendFile: function(file){
if (file['source']['ext'] === 'zip' || file['source']['ext'] === 'rar') {
var chunksTotal = 0;
if((chunksTotal = Math.ceil(file.size/chunkSize)) > 1){
//合并请求
var task = new $.Deferred();
$.ajax({
type: "POST"
, url: backEndUrl
, data: {
status: "chunksMerge"
, name: uniqueFileName
, chunks: chunksTotal
, ext: file.ext
, md5: md5Mark
}
, cache: false
, dataType: "json"
}).then(function(data, textStatus, jqXHR){
//todo 检查响应是否正常
task.resolve();
file.path = data.path;
$("#file_name").val(data.name);
$("#file_url").val(data.path+'/'+data.name);
$("#file_size").val(file.size);
}, function(jqXHR, textStatus, errorThrown){
task.reject();
});
return $.when(task);
}else{
//UploadComlate(file);
}
}
}
});
</script>
<script>
var uploaderImgcover= WebUploader.create({
// 选完文件后,是否自动上传。
auto: true,
// swf文件路径
swf: '__STATIC__/webuploader/Uploader.swf',
server: "{:U('File/uploadPicture',array('session_id'=>session_id(),'flag'=>true))}",
// 选择文件的按钮。可选。
// 内部根据当前运行是创建可能是input元素也可能是flash.
pick: {
id:'#cover',
multiple:true
},
// dnd: false,
paste: document.body,
accept: {
title: '图片',
extensions: 'png,gif,jpg,jpeg,bmp',
mimeTypes: '.png,.gif,.jpg,.jpeg,.bmp',
},
// 不压缩image, 默认如果是jpeg文件上传前会压缩一把再上传
resize: false,
disableGlobalDnd: true,
fileNumLimit:1,
threads:5,
thumb:true,
compress:false,
prepareNextFile: true,
formData: function(){return $.extend(true, {}, userInfo);},
chunked:false,
duplicate: true
});
var imgcoverListData = [];
<?php if (!empty($data['cover_data'])) :?>
var html = '';
$('#coverList').css('margin-top','10px');
<?php foreach ($data['cover_data'] as $value) {?>
<?php $value = (int)$value;?>
imgcoverListData.push(<?=$value?>);
html += '<div id="' + <?=$value?> + '" class="item flooring_page_img_box" style="margin-right: 10px;">';
html += '<a href="javascript:;"><img src="<?=get_cover($value,"path")?>" style="width: 100px;height: 100px;cursor: move;"></a>';
html += '<h4 class="info" style="text-align: center;">';
html += '<a href="javascript:;" class="jsdelzip table_click" style="float:none;display:inline-block;" img-id="' + <?=$value?> + '">删除</a>';
html += '</h4>';
html += '<div class="progress progress-striped active" style="display: none;">';
html += '<div class="progress-bar" role="progressbar" style="width: 100%;">100%</div>';
html += '</div>';
html += '</div>';
<?php }?>
$('#coverList').html(html);
$('#coverList').children().children('h4').children('.jsdelzip').on('click', function() {
var thisId = $(this).attr('img-id');
$(this).parent().parent().remove();
$.each(imgcoverListData,function(index, item) {
if (thisId == item) {
imgcoverListData.splice(index,1);
return false;
}
});
setcoverVal();
});
<?php endif ;?>
// 当有文件被添加进队列的时候
var thisIndex = 0;
var imgcoverList = $("#coverList");
uploaderImgcover.on( 'fileQueued', function( file ) {
var html = '';
html += '<div id="' + file.id + '" class="item" style="margin-right: 10px;">';
html += '<a href="javascript:;"><img src="" style="width: 100px;height: 100px;cursor: move;"></a>';
html += '<h4 class="info">' + file.name + '</h4>';
html += '<p class="state">等待上传...</p>';
html += '</div>';
imgcoverList.append(html);
imgcoverList.css('margin-top','10px');
var img = imgcoverList.children('#'+file.id).find('img');
uploaderImgcover.makeThumb(file, function (error, src) {
if (error) {
return;
}
img.attr('src', src);
}, 300, 300);
});
// 文件上传过程中创建进度条实时显示。
uploaderImgcover.on( 'uploadProgress', function( file, percentage ) {
var $li = $( '#'+file.id ),
$percent = $li.find('.progress .progress-bar');
// 避免重复创建
if ( !$percent.length ) {
$percent = $('<div class="progress progress-striped active">' +
'<div class="progress-bar" role="progressbar" style="width: 0%">' +
'</div>' +
'</div>').appendTo( $li ).find('.progress-bar');
}
$li.find('p.state').text('上传中');
$percent.css( 'width', percentage * 100 + '%' );
$percent.text( (percentage * 100).toFixed(0) + '%' );
});
uploaderImgcover.on( 'uploadSuccess', function( file , response) {
imgcoverListData.push(Number(response.id));
console.log(imgcoverListData)
setcoverVal();
$( '#'+file.id ).find('p.state').text('已上传').fadeOut(800);
//alert(JSON.stringify(response));
$('#'+file.id).find('h4.info').append('<a href="javascript:;" class="jsdelzip table_click" style="float:none;display:inline-block;margin-left:10px;">删除</a>');
$('#'+file.id).find('.jsdelzip').on('click',function() {
uploaderImgcover.removeFile( file.id );
$('#'+file.id).remove();
$.each(imgcoverListData,function(index, item) {
if (response.id == item) {
imgcoverListData.splice(index,1);
return false;
}
});
setcoverVal();
console.log(imgcoverListData);
return false;
});
});
uploaderImgcover.on('uploadError', function(file) {
$( '#'+file.id ).find('p.state').text('上传出错');
});
uploaderImgcover.on( 'uploadComplete', function(file) {
$( '#'+file.id ).find('.progress').fadeOut();
});
function setcoverVal()
{
var cover = '';
$.each(imgcoverListData,function(index, item) {
cover += item + ',';
});
cover = cover.substring(0, cover.length - 1);
$("input[name=cover]").val(cover);
}
documentUpload('cover','coverList',5,'{$data.cover}','{$data.valuedata}','icon_data','cover','{:U('File/uploadPicture',array('session_id'=>session_id(),'flag'=>true))}')
</script>
</block>

Loading…
Cancel
Save