<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">
			<div class="page-header">
				<h1><i class="icon-envelope-alt"></i>新建邮箱
				<div class="pull-right btn-group">
					<a id="form" class="btn btn-primary" href="javascript:void(0);"><i class="icon-plus-sign icon-white"></i>添加</a>
				</div>
				</h1>
			</div>
			<div id="form-content" style="display:none;">
				<form id="add_newsletter" class="form-horizontal" enctype="multipart/form-data" action="<?php echo base_url('index.php/emailsystem/emailAdd'); ?>" method="post">
					<div class="row-fluid">
						<div class="span6">
							<div class="control-group">
								<label class="control-label" for="title">标题</label>
								<div class="controls">
									<input id="title" class="input-xlarge" type="text" value="" name="title">
								</div>
							</div>
							<div class="control-group">
								<label class="control-label" for="group">分组</label>
								<div class="controls">
									<select multiple="multiple" name="group[]">
										<?php
											foreach($group as $key=>$val){
												echo "<option value=\"{$val->id}\">{$val->name}</option>";
											}
										?>
									</select>
								</div>
							</div>
						</div>
						
						<div class="span6">
							<div class="control-group">
								<label class="control-label" for="template">模版</label>
								<div class="controls">
									<select id="template" onchange="LoadTempl(this.value)" name="template">
                        				<option></option>
										<?php
											foreach($temp as $key=>$val){
												echo "<option value=\"{$val->id}\">{$val->tempname}</option>";
											}
										?>
									</select>
								</div>
							</div>
							<div class="control-group">
								<label class="control-label" for="ddate">发送日期</label>
								<div class="controls">
									<input id="ddate" type="text" value="" style="width: 100px;" name="ddate">
									<button id="trigger1" class="btn btn-primary" type="button" value="date" name=""><span><i class="icon-calendar"></i></span></button>
								</div>
							</div>
						</div>
					</div>
					
					<link href="<?php echo base_url('public/kindue/themes/default/default.css'); ?>" rel="stylesheet">
					<script src="<?php echo base_url('public/kindue/kindeditor-min.js'); ?>"></script>
					<script src="<?php echo base_url('public/kindue/lang/zh_CN.js'); ?>"></script>
					<div class="control-group">
						<label class="control-label" for="">邮件内容</label>
						<div class="controls">
							<textarea id="editor" name="email" style="width:700px;height:300px;">
							</textarea>
							<script>
								var options = {
									width : '700px',
									height : '400px;'
								};
						        KindEditor.ready(function(K) {
						                window.editor = K.create('#editor',options);
						        });
							</script>
						</div>
					</div>
					<div class="control-group">
						<label for="file" class="control-label">附件</label>
						<div class="controls">
 							<input type="file" value="Add files" multiple="" name="file[]" id="file" class="input-xlarge">
						</div>
 					</div>
					
					
					<div class="form-actions">
						<button class="btn btn-primary" type="submit">创建</button>
					</div>
					
				</form>
			</div>
		</div>
		
		<div class="row-fluid">
			<table class="table table-bordered table-striped" id="emailtable">
				<thead>
                    <tr>
                        <th class="span1">##</th>
                        <th class="" width="60">状态</th>
                        <th class="" width="80">日期</th>
                        <th class="" width="120">分组</th>
                        <th>标题</th>
                        <th class="" width="60">是否附件</th>
                        <th class="" width="60">操作</th>                                        
                    </tr>
                </thead>
				<tbody>
					<?php
						foreach($email as $key=>$val){
					?>
					<tr>
                        <td><?php echo $val->id; ?></td>
                        <td>
                        	<span class="label <?php if($val->status==1){echo "label-success";}else if($val->status==-1){echo "label-warning";}else if($val->status==0){} ?>">
                        		<?php
                        			if($val->status==1){
                        				echo "已发送";
                        			}else if($val->status==-1){
                        				echo "发送不完整";
                        			}else if($val->status==0){
                        				echo "未发送";
                        			}
                        		?>
                        	</span>
                        </td>
                        <td><?php echo $val->date; ?></td>
                        <td>
                        	<select style="width:110px;margin:0;">
								<?php
									foreach($val->group as $k=>$v){
										echo "<option>{$v->gname}</option>";
									}
								?>
							</select>
                        	
                        </td>
                        <td><a href="<?php echo base_url('index.php/emailsystem/emailView/'.$val->id); ?>"><?php echo $val->title; ?></a></td>
                        <td>
                        		<div class="file">
                        		<?php
                        			if( count($val->file_array) >=1 ){
                        				$file = "";
	                        			foreach ($val->file_array as $k=>$v) {
											$file .= $v."<br>";
										}
                        				echo '<a href="javascript:void(0);" data-html="true" class="btn" rel="popover" data-content="'.$file.'" data-original-title="附件文件">附件</a>';
                        			}
                        		?>
                        		</div>
                        </td>
                        <td>
                        	<div class="btn-group">
                          		<a href="#" data-toggle="dropdown" class="btn btn-primary dropdown-toggle">操作<span class="caret"></span></a>
                          		<ul class="dropdown-menu">
	                            	<!-- dropdown menu links -->
	                            	<li><a title="Run task" href="javascript:void(0);" class="run" runid="<?php echo $val->id; ?>"  status="<?php echo $val->status; ?>"><i class="icon-play"></i> 运行</a></li>
	                                <li class="divider"></li>
	                                <li><a onclick="return confirm('你确定要删除该邮件?');" href="<?php echo base_url('index.php/emailsystem/emailDel/'.$val->id); ?>">
	                                	<i class="icon-remove-sign"></i> 删除</a>
	                               	</li>
                             	</ul>
                        </div>
                		</td>
                    </tr>
                    <?php
                    	} 
                   	?>
				</tbody>
			</table>
		</div>
		<div class="pagination pagination-centered">
			<?php if(isset($this->pagination)){$this->pagination->show();} ?>
		</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>
	
</div>
<script>
	$('#form').click(function() {
		$('#form-content').slideToggle('fast');
		return false;
	});
	var myDate=new Date()
	myDate.setDate(myDate.getDate()-1);
	var startDate = new Date(myDate);
	$('#trigger1').datepicker()
	    .on('changeDate', function(ev){
		    if (ev.date.valueOf() < startDate.valueOf()){
		    	alert("邮件发送时间不能小于当前时间！");
		    }else{
		    	$('#ddate').val(ev.date.getFullYear()+"-"+(ev.date.getMonth()+1)+"-"+ev.date.getDate());
		    }
	  	});
	$('.file a').each(function(){
		$(this).popover({placement: "left",trigger: "hover"});
	});
	function LoadTempl(id){
		var url="<?php echo base_url('index.php/emailAjax/getTemp'); ?>";
		if(id){
			$.post(url, {tid: id},
			function(data){
				if(data.status==1){
					editor.html(data.html);
				}else{
					Messenger().post({
						type: 'error',
						message: data.msg,
						hideAfter: 10,
						hideOnNavigate: true,
						showCloseButton: true
					});
				}
			});
		}
	}
	var time = null;
	$('.run').click(function(){
		var runid = $(this).attr('runid');
		var status =  $(this).attr('status');
		if(status == -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 },
				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 },
							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>

