<extend name="Public/base"/> <block name="body"> <script type="text/javascript" src="__STATIC__/uploadify/jquery.uploadify.min.js"></script> <script type="text/javascript" src="__STATIC__/webuploader/webuploader.js"></script> <link rel="stylesheet" type="text/css" href="__CSS__/admin_table.css" media="all"> <link rel="stylesheet" type="text/css" href="__STATIC__/webuploader/webuploader.css" media="all"> <div class="cf main-place top_nav_list navtab_list"> <h3 class="page_title">{$meta_title}</h3> <p class="description_text"></p> </div> <div class="tab-content tabcon1711 tabcon17112"> <IF condition="$type == edit"> <form action="{:U('edit',['menu_name' => $menu_name])}" method="post" class="form-horizontal form_info_ml"> <else /> <form action="{:U('add',['menu_name' => $menu_name])}" method="post" class="form-horizontal form_info_ml"> </IF> <table border="0" cellspacing="0" cellpadding="0"> <tbody> <tr> <td class="l noticeinfo">菜单名称</td> <td class="r table_radio"> <input type="text" class="" name="name" value="{$data.name|default=''}" > </td> </tr> <tr> <td class="l noticeinfo">菜单标题</td> <td class="r table_radio"> <input type="text" class="" name="title" value="{$data.title|default=''}" > </td> </tr> <tr> <td class="l noticeinfo">平台</td> <td class="r table_radio"> <span class="form_select"> <select name="menu_version"> <foreach name="menu_version" item="vo" key="k"> <if condition="$data['menu_version'] == $k"> <option value="{$k}" selected="selected">{$vo}</option> <else /> <option value="{$k}">{$vo}</option> </if> </foreach> </select> </span> </td> </tr> <tr> <td class="l noticeinfo">菜单链接</td> <td class="r table_radio"> <input type="text" class="" name="url" value="{$data.url|default=''}" > </td> </tr> <tr> <td class="l noticeinfo">url类型</td> <td class="r table_radio"> <span class="form_select"> <select name="type"> <foreach name="but_type" item="vo" key="k"> <if condition="$data['type'] == $k"> <option value="{$k}" selected="selected">{$vo}</option> <else /> <option value="{$k}">{$vo}</option> </if> </foreach> </select> </span> </td> </tr> <tr> <td class="l noticeinfo">跳转目标</td> <td class="r table_radio"> <input type="text" class="" name="act" value="{$data.act|default=''}" placeholder='url类型为原生时填写'> </td> </tr> <tr> <td class="l noticeinfo">IOS链接</td> <td class="r table_radio"> <input type="text" class="" name="ios_url" value="{$data.ios_url|default=''}"> </td> </tr> <tr> <td class="l noticeinfo">排序</td> <td class="r table_radio"> <input type="text" class="" name="sort" value="{$data.sort|default=''}"> </td> </tr> <tr> <td class="l noticeinfo">游戏隐藏</td> <td class="r table_radio"> <input type="text" class="" name="game_status" value="{$data.game_status|default=''}"> <span class="notice-text" style="left:215px;">针对游戏id隐藏,多个用,隔开</span> </td> </tr> <tr> <td class="l noticeinfo">状态</td> <td class="r table_radio"> <span class="form_select"> <select name="status"> <if condition="$data['status'] == 1 || !isset($data['status'])"> <option value="1" selected="selected">显示</option> <option value="0">隐藏</option> <else /> <option value="0" selected="selected">隐藏</option> <option value="1">显示</option> </if> </select> </span> </td> </tr> <tr class="picbox"> <td class="l noticeinfo">菜单图标</td> <td class="r table_radio"> <span class="form_icon table_btn table_upload"> <!-- <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 id="iconList" class="uploader-list" style="display: flex;"></div> </div>--> <!-- <div class="upload-img-box"> <notempty name="data['icon']"> <div class="upload-pre-item"> <span class="placeholder-graphic placeholder-graphic_icon"><img src="{$data['icon']}"/></span> </div> </notempty> </div>--> <input type="hidden" name="id" value="{$data['id']}" /> <input type="hidden" name="icon" value="{$data['cover']}" /> <div id="uploadImg" class="wu-example"> <div class="btns"> <div id="icon"> <div class="webuploader-pick" style="line-height: 14px">上传图片</div> </div> </div> <!--用来存放文件信息--> <div id="icon_thelist" class="uploader-list" style="display: flex;"> </div> </div> </span> <span class="notice-text" style="left:215px;">菜单图标</span> </td> </tr> </tbody> </table> <input type="hidden" name="id" value="{:I('id')}"> <script type="text/javascript"> //上传图片 /* 初始化上传插件 */ //上传游戏图标 /* 初始化上传插件 */ //$("#upload_picture_icon").uploadify({ // "height" : 30, // "swf" : "__STATIC__/uploadify/uploadify.swf", // "fileObjName" : "download", // "buttonText" : "上传图标", // "uploader" : "{:U('File/uploadPicture',array('session_id'=>session_id()))}", // "width" : 120, // 'removeTimeout' : 1, // 'fileTypeExts' : '*.jpg; *.jpeg; *.png; *.gif;', // "onUploadSuccess" : upload_picture_icon{$field.name}, // 'onFallback' : function() { // alert('未检测到兼容版本的Flash.'); // } //}); //function upload_picture_icon{$field.name}(file, data){ // var data = $.parseJSON(data); // var src = ''; // if(data.status){ // src = data.path || data.url; // $("#cover_id_icon").val(src); // $("#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); // setTimeout(function(){ // $('#top-alert').find('button').click(); // $(that).removeClass('disabled').prop('disabled',false); // },1500); // } //} </script> </form> <div class="form-item cf"> <button class="submit_btn ajax-post mlspacing" id="submit" type="submit" target-form="form-horizontal"> 保存 </button> <a class="submit_btn " alt="返回上一页" title="返回上一页" href="javascript:window.history.back();" > 返回 </a> </div> </div> </block> <block name="script"> <script type="text/javascript" charset="utf-8"> //导航高亮 highlight_subnav('{:U('SdkMenu/lists')}'); </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); } } } }); 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 imgListIconData = []; <?php if (!empty($img)) :?> var html = ''; $('#icon_thelist').css('margin-top','10px'); <?php foreach ($img as $value3) { ?> <?php $value3 = (int)$value3; ?> imgListIconData.push(<?=$value3?>); html += '<div id="' + <?=$value3?> + '" class="item flooring_page_img_box" style="margin-right: 10px;">'; html += '<a href="javascript:;"><img src="<?=get_cover($value3,"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="' + <?=$value3?> + '">删除</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 }?> $('#icon_thelist').html(html); $('#icon_thelist').children().children('h4').children('.jsdelzip').on('click', function() { var thisId = $(this).attr('img-id'); $(this).parent().parent().remove(); $.each(imgListIconData,function(index, item) { if (thisId == item) { imgListIconData.splice(index,1); return false; } }); setIconVal(); }); <?php endif ;?> var thisIndex2 = 0; var imgIconList = $("#icon_thelist"); 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 img2 = imgIconList.children('#'+file.id).find('img'); uploaderImgIcon.makeThumb(file, function (error, src) { if (error) { return; } img2.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) { imgListIconData.push(Number(response.id)); console.log(response) 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(imgListIconData,function(index, item) { if (response.id == item) { imgListIconData.splice(index,1); return false; } }); setIconVal(); return false; }); }); function setIconVal() { var icon = ''; $.each(imgListIconData,function(index, item) { icon += item + ','; }); icon = icon.substring(0, icon.length - 1); $('input[name=icon]').val(icon); console.log(icon) } </script> </block>