<script src="<?php echo base_url('public/js/bootstrap-tab.js'); ?>"></script>
<script src="<?php echo base_url('public/js/Chart.min.js'); ?>"></script>
<link href="<?php echo base_url('public/css/datepicker.css'); ?>" rel="stylesheet">
<script src="<?php echo base_url('public/js/bootstrap-datepicker.js'); ?>"></script>
<script src="<?php echo base_url('public/js/bootbox.min.js'); ?>"></script>
<script src="<?php echo base_url('public/js/tmpl.min.js'); ?>"></script>
<div class="container" style="padding-top:42px;">
	<div class="row">
		<div class="span12">
			<h1><i class="icon-double-angle-right"></i>邮件标题：<?php echo $email[0]->title; ?></h1>
			<hr>
			<table class="table table-bordered">
				<thead>
					<tr>
						<th width="100">日期</th>
						<th width="140">发送日期</th>
						<th width="120">分组</th>
						<th>附件</th>
						<th width="60">发送邮件</th>
						<th width="60">失败邮件</th>
					</tr>
				</thead>
				<tbody>
					<tr>
						<th><span class="label label-inverse"><i class="icon-time"></i> <?php echo $email[0]->date; ?></span></th>
						<th><span class="label label-success"><i class="icon-time"></i> <?php echo date('Y-m-d H:s:i', $email[0]->sendtime); ?></span></th>
						<th><select>
										<?php
											foreach($group as $val){
												echo "<option value=\"{$val->id}\">{$val->gname}</option>";
											}
										?>
									</select></th>
						<th>
							
							<?php
								foreach ($email[0]->filePath as $key => $value) {
							?>
								<span><i class="icon-paper-clip"></i> <a href="<?php echo $value['path'] ?>"><?php echo $value['name']; ?></a></span>
							<?php
								}
							?>
						</th>
						<th><span class="label label-success"><?php echo $accEmail; ?></span></th>
						<th><span class="label label-warning"><?php echo $errEmail; ?></span></th>
					</tr>
				</tbody>
			</table>
			<a title="重新发送失败邮件" href="javascript:void(0);" class="run btn" runid="<?php echo $email[0]->id; ?>"  status="<?php echo $email[0]->status; ?>"><i class="icon-play"></i> 发送失败邮件</a>
			<hr>
			<a id="form" class="btn" href="javascript:void(0)"><i class="icon-eye-open"></i>查看邮件内容</a>
			<h4><i>邮件标题：</i><?php echo $email[0]->title; ?></h4>
			<div id="form-content" style="display: none;">
				<iframe width="100%" height="500px" frameborder="0" style="border:1px solid #ccc" src="<?php echo base_url('index.php/emailsystem/view_data/' . $eid); ?>"></iframe>
			</div>

		</div>
	</div>
</div>

	
	<!-- set up the modal to start hidden and fade in and out -->
	<div id="myModal" class="modal hide fade">
	    <!-- dialog contents -->
	    <div class="modal-body">
	    	<p class="text-info">正在预处理邮件。。。</p>
			<div class="progress progress-striped active read">
				<div class="bar" style="width: 1%;"></div>
			</div>
		</div>
	    <!-- dialog buttons -->
	    <div class="modal-footer"><a href="#" class="btn primary">取消</a></div>
	</div>
	
	<script type="text/x-tmpl" id="tmpl-pro">
		<p class="text-info">正在预处理邮件。。。</p>
		<div class="progress progress-striped active read">
			<div class="bar" style="width: 0%;"></div>
		</div>
	</script>
	
	
	<script type="text/x-tmpl" id="tmpl-send">
		<p class="text-success">邮件正在发送中。。。</p>
		<div class="progress progress-striped active send">
			<div class="bar" style="width: 0%;"></div>
		</div>
	</script>





<script>
		$('#form').click(function() {
			$('#form-content').slideToggle('fast');
			return false;
		});	
		
		var time = null;
	$('.run').click(function(){
		var runid = $(this).attr('runid');
		var status =  $(this).attr('status');
		var type = 0;
		if(status == -1){
			type = -1;
			if(!confirm('当前邮件还有发送失败的用户，你确实要重新发送?')){
				return false;
			}
		}
		if(status == 1){
			if(!confirm('当前邮件以发送，你确定要重新发送?')){
				return false;
			}
		}
		$('#myModal').bind('show', function(){
			runPro("read")
			$.post("<?php echo base_url('index.php/emailAjax/emailpro'); ?>", { eid: runid, 'type':type},
				function(data){
					if(data.status==1){
						//stopPro();
						//处理提示模版
						stopPro("read");
						var tmplSend = tmpl("tmpl-send");
						$('.read').remove();
						$('.text-info').remove();
						$('.modal-body').append(tmplSend);
						//发送邮件
						runPro("send");
						$.post("<?php echo base_url('index.php/emailAjax/emailsend'); ?>", { eid: runid,  'type':type},
							function(data){
								stopPro("send");
								$('.send').remove();
								$('.text-success').remove();
								dom = '<p class="text-success">邮件发送完毕</p>';
								dom += '<p class="label-important">'+data.msg+'</p>';
								$('.modal-body').append(dom);
						});
					}else{
						$('#myModal').modal('hide');
						stopPro("read");
						Messenger().post({
							type: 'error',
							message: data.msg,
							hideAfter: 10,
							hideOnNavigate: true,
							showCloseButton: true
						});
					}
					//alert("Data Loaded: " + data);
			});
			
			$('#myModal a.btn').click(function(e){
				$('#myModal').modal('hide');
				stopPro("read");
				var tmplPro = tmpl("tmpl-pro");
				$('.send').remove();
				$('.text-success').remove();
				$('.modal-body').append(tmplPro);
			}); 
		});
		
		
		$('#myModal').bind('hide', function(){
			$('#myModal a.btn').unbind();
			$('#myModal').unbind();
		});
		 $("#myModal").modal({
			"backdrop" : "static",
			"keyboard" : true,
			"show" : true // this parameter ensures the modal is shown immediately
		});
	});
	function stopPro(elem){
		clearTimeout(time);
		$('.'+elem+' div.bar').css({display:"none"});
		$('.'+elem+' div.bar').width("0%");
	}
	function runPro(elem){
		$('.'+elem+' div.bar').css({display:"block"});
		var bit = 0;
		if(elem=="read"){
			bit = 8;
		}else{
			bit = 2;
		}
		time = setInterval("progressOnly('"+elem+"',"+bit+")",100);
	}
	function progressOnly(elem,bitp){
		var proWidth = $('.'+elem+' div.bar').width();
		var readWidth = $('.'+elem).width();
		var bit = Math.ceil(proWidth/readWidth*100);
		if(bit >= 100 && bit!='Infinity'){
			$('.'+elem+' div.bar').css({display:"none"});
			$('.'+elem+' div.bar').width("0%");
			stopPro();
			time = setTimeout("runPro('"+elem+"')",700);
		}else{
			$('.'+elem+' div.bar').width( (bit+bitp)+"%");
		}
		//$('.read div').css({});
	}
		
		
		
		
		
</script>


</body>
</html>









