You cannot select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

460 lines
18 KiB
HTML

This file contains ambiguous Unicode characters!

This file contains ambiguous Unicode characters that may be confused with others in your current locale. If your use case is intentional and legitimate, you can safely ignore this warning. Use the Escape button to highlight these characters.

<extend name="Public/base" />
<block name="css">
<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">
</block>
<block name="body">
<link rel="stylesheet" type="text/css" href="__CSS__/admin_table.css" media="all">
<script type="text/javascript" src="__STATIC__/layer/layer.js"></script>
<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>
<link rel="stylesheet" href="__CSS__/select2.min.css" type="text/css" />
<style>
.select2-container--default .select2-selection--single .select2-selection__rendered {
line-height:35px;
line-height:28px;
}
.select2-container--default .select2-selection--single .select2-selection__arrow {
height:26px;
}
.select2-container--default .select2-search--dropdown .select2-search__field {
height:26px;line-height:26px;font-size:12px;
}
.select2-results__option[aria-selected] {font-size:12px;}
.tabcon1711 .select2-container--default .select2-selection--single{
font-size: 12px;
color: #555;
vertical-align: middle;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;
background-color: #fff;
border: 1px solid #ccc;
-webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,0.075);
-moz-box-shadow: inset 0 1px 1px rgba(0,0,0,0.075);
box-shadow: inset 0 1px 1px rgba(0,0,0,0.075);
-webkit-transition: border linear .2s, box-shadow linear .2s;
-moz-transition: border linear .2s, box-shadow linear .2s;
-o-transition: border linear .2s, box-shadow linear .2s;
transition: border linear .2s, box-shadow linear .2s;height:30px;}
.tabcon1711 .select2-container--default .select2-selection--single .select2-selection__rendered {line-height: 30px;}
.tabcon1711 .select2-container--default .select2-selection--single .select2-selection__arrow {height:30px;}
.tabcon1711 .select2-container--default .select2-search--dropdown .select2-search__field {
height:26px;line-height:26px;font-size:12px;
}
.tabcon1711 .select2-results__option[aria-selected] {font-size:12px;}
.tow_table .table_btn {width:260px;}
.tabcon1711 .notice-text {margin-left:0;}
</style>
<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-wrap">
<div class="tab-content tabcon1711">
<!-- 表单 -->
<form id="form" action="{:U('add?model='.$model['id'])}" method="post" class="form-horizontal">
<!-- 基础文档模型 -->
<div id="tab1" class="tab-pane in tab1">
<table border="0" cellspacing="0" cellpadding="0">
<tbody>
<tr>
<td class="l">标题:</td>
<td class="r" >
<input type="text" class="txt" name="title" value="" placeholder="输入标题">
</td>
</tr>
<tr>
<td class="l"><i class="mustmark" style="margin-left:-7px">*</i>开始时间:</td>
<td class="r table_time">
<input type="text" class="txtt date" name="start_time" value="" placeholder=" 不填默认无时间限制">
</td>
</tr>
<tr>
<td class="l">结束时间:</td>
<td class="r table_time">
<input type="text" class="txtt time" name="end_time" value="" placeholder=" 不填默认无时间限制">
</td>
</tr>
<tr>
<td class="l">排序:</td>
<td class="r tow_table" >
<span class="form_radio table_btn">
<input type="text" class="txt" name="sort" value="0" placeholder="输入排序">
</span>
<span class="notice-text">不填默认为0数值越大越靠前</span>
</td>
</tr>
<tr>
<td class="l"><i class="mustmark" style="margin-left:-7px">*</i>奖励积分:</td>
<td class="r tow_table" >
<span class="form_radio table_btn">
<input type="text" class="txt" name="reward" value="1" placeholder="输入奖励积分">
</span>
<span class="notice-text">用户观看后可获得的积分奖励最少为1</span>
</td>
</tr>
<tr>
<td class="l"><i class="mustmark" style="margin-left:-7px">*</i>展示时间:</td>
<td class="r tow_table" >
<span class="form_radio table_btn">
<input type="text" class="txt" name="show" value="" placeholder="输入展示时间">
</span>
<span class="notice-text">广告播放时间最长时间限制为10秒</span>
</td>
</tr>
<tr>
<td class="l noticeinfo">打开方式</td>
<td class="r table_radio tow_table">
<span class="form_radio table_btn">
<label>
<input type="radio" class="inp_radio" value="1" name="way" checked="checked"> 横屏
</label>
<label>
<input type="radio" class="inp_radio" value="2" name="way" > 竖屏
</label>
</span>
<span class="notice-text">iOS设备不支持横屏播放视频</span>
</td>
</tr>
<tr class="picbox2">
<td class="l noticeinfo" ><i class="mustmark" style="margin-left:-7px">*</i>封面图</td>
<td class="r tow_table">
<span class="table_btn table_upload">
<input type="file" id="upload_picture_cover">
<input type="hidden" name="cover" id="cover_id_cover" value="" />
<div class="upload-img-box">
</div>
</span>
<span class="notice-text">图片大小为2M以内图片分辨率842*561PX支持PNG、JPG、JPEG格式</span>
</td>
</tr>
<tr class="picbox2">
<td class="l noticeinfo">素材</td>
<td class="r tow_table">
<span class="table_btn table_upload">
<div id="uploader" class="wu-example">
<div class="btns">
<div id="picker" style="height:30px;">上传素材</div>
</div>
<!--用来存放文件信息-->
<div id="thelist" class="uploader-list">
</div>
</div>
<input type="hidden" id="file_url" name="material_url" value=""/>
</span>
<span class="notice-text">视频大小为5M以内支持MP4格式只能上传单个素材未上传则显示封面图</span>
</td>
</tr>
</tbody>
</table>
</div>
<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>
</form>
</div>
</div>
<div class="common_settings">
<span class="plus_icon"><span><img src="__IMG__/zwmimages/icon_jia.png"></span></span>
<form class="addShortcutIcon">
<input type="hidden" name="title" value="{$m_title}">
<input type="hidden" name="url" value="{$m_url}">
</form>
<a class="ajax-post add-butn <notempty name='commonset'>addSIsetted</notempty>" href="javascript:;" target-form="addShortcutIcon" url="{:U('Think/addShortcutIcon')}"><img src="__IMG__/zwmimages/icon_jia.png"><span><notempty name='commonset'>已添加<else />添加至常用设置</notempty></span></a>
</div>
</block>
<block name="script">
<link href="__STATIC__/datetimepicker/css/datetimepicker.css" rel="stylesheet" type="text/css">
<php>if(C('COLOR_STYLE')=='blue_color') echo '<link href="__STATIC__/datetimepicker/css/datetimepicker_blue.css" rel="stylesheet" type="text/css">';</php>
<link href="__STATIC__/datetimepicker/css/dropdown.css" rel="stylesheet" type="text/css">
<script type="text/javascript" src="__STATIC__/datetimepicker/js/bootstrap-datetimepicker.min.js"></script>
<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')}');
$('#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_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,
'onFallback' : function() {
alert('未检测到兼容版本的Flash.');
}
});
function upload_picture_cover(file, 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"><span class="placeholder-graphic placeholder-graphic_ad"><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: 'mp4',
mimeTypes: '.mp4',
},
// 不压缩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("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>
</block>