<link type="text/css" rel="stylesheet" href="/css/webht/jquery.suggest.css" />
<script src="/js/TQEditor/TQEditor.js" type="text/javascript"></script>
<script type="text/javascript" src="/js/jquery.suggest.js"></script>    

<div class="container-fluid">
  <div class="row">
  	<div class="col-xs-24" style="padding:15px; padding-right:30px;">
	  <form id="form-send-mail" method="post" action="<?php echo site_url('apps/outlook/index/sendmail');?>">
		<div class="media" style="overflow:visible;">
		  <div class="media-left">
		    <button type="button" id="btn-send-mail" class="media-object btn btn-default" style="width:80px;height:80px;" data-loading-text="正在发送" onclick="$(this).button('loading');"><span class="icon-newspaper" style="font-size:32px;"></span><br>发送(S)</button>
		  </div>
		  <div class="media-body" style="overflow:visible;">
			<div class="input-group" id="auto-complete">
	          <span class="input-group-btn">
	            <button class="btn btn-default" type="button" disabled="disabled">收件人(O)...</button>
	          </span>
	          <input type="text" class="form-control" id="emaillist" name="emaillist" value="新中华游公告;">
	        </div>
	        <div class="col-xs-24 btn-sm"></div>
			<div class="form-group input-group" id="auto-complete2">
	          <span class="input-group-btn">
	            <button class="btn btn-default" type="button" disabled="disabled">抄　送(C)...</button>
	          </span>
	          <input type="text" class="form-control" id="cs_emaillist" name="cs_emaillist">
	        </div>
		  </div>
		</div>
		<div class="form-group input-group">
          <div class="input-group-btn">
            <button type="button" class="btn btn-default" style="width:92px;"  data-toggle="modal" data-target="#myModal" data-backdrop="static">价值观 <span class="caret"> </span></button>
            <button type="button" class="btn btn-default" style="width:100px;cursor:default;background:#fff !important;" disabled="disabled">主　题</button>
          </div>
          <input type="text" class="form-control" name="mail_subject" id="mail-subject" autocomplete="off">
        </div>
		<textarea class="form-control" id="emailcontent" rows="36" name="emailcontent"></textarea>
	  	<input type="hidden" id="whm_value_key" name="whm_value_key">
	  	<input type="hidden" id="whum_value_user" name="whum_value_user">
	  </form>
  	</div>
  </div>
</div>

<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
  <div class="modal-dialog modal-lg" style="margin-top:5px;">
    <div class="modal-content">
      <div class="modal-header">       
        <div class="" id="auto-complete3">
          <input type="text" class="form-control" name="value_user" id="value_user" placeholder="value人员名单,输入名字，然后在下拉提示框里选择完整的名单">
        </div>
      </div>
      <div class="modal-body" style="padding-top:0;">
      	<div class="col-xs-12" style="padding-left:0;">
      		<h4>团队协作：</h4>
	        <div class="checkbox">
			  <label>
			    <input class="team_checkbox" type="checkbox" data-checked="false" value="team1">
			    1.心存谦卑，发现并欣赏他人的长处
			  </label>
			</div>
			<div class="checkbox">
			  <label>
			    <input class="team_checkbox" type="checkbox" data-checked="false" value="team2">
			    2.人比事更重要，爱能包容一切过错
			  </label>
			</div>
			<div class="checkbox">
			  <label>
			    <input class="team_checkbox" type="checkbox" data-checked="false" value="team3">
			    3.群策群力参与决策，百分之百支持决定！
			  </label>
			</div>
			<div class="checkbox">
			  <label>
			    <input class="team_checkbox" type="checkbox" data-checked="false" value="team4">
			    4.信任你的同事，相信平凡的一群人，能组成一个不平凡的团队 
			  </label>
			</div>
      	</div>
      	<div class="col-xs-12">
      		<h4>诚信负责：</h4>
	        <div class="checkbox">
			  <label>
			    <input class="chengxin_checkbox" type="checkbox" data-checked="false" value="chengxin1">
			    1.诚实可信、说到做到、告诉顾客真相
			  </label>
			</div>
			<div class="checkbox">
			  <label>
			    <input class="chengxin_checkbox" type="checkbox" data-checked="false" value="chengxin2">
			    2.做人一诺千金，做事全力以赴 
			  </label>
			</div>
			<div class="checkbox">
			  <label>
			    <input class="chengxin_checkbox" type="checkbox" data-checked="false" value="chengxin3">
			    3.传递真善美，打造美好旅程
			  </label>
			</div>
			<div class="checkbox">
			  <label>
			    <input class="chengxin_checkbox" type="checkbox" data-checked="false" value="chengxin4">
			    4.勇于承担责任使你更优秀 
			  </label>
			</div>
      	</div>
      	<div class="col-xs-24 clearfix"></div>
      	<div class="col-xs-12" style="padding-left:0;">
      		<h4>客户满意： </h4>
	        <div class="checkbox">
			  <label>
			    <input class="customer_checkbox" type="checkbox" data-checked="false" value="customer1">
			    1.穿客户的鞋，从客户的角度看问题 
			  </label>
			</div>
			<div class="checkbox">
			  <label>
			    <input class="customer_checkbox" type="checkbox" data-checked="false" value="customer2">
			    2.细节展现专业 
			  </label>
			</div>
			<div class="checkbox">
			  <label>
			    <input class="customer_checkbox" type="checkbox" data-checked="false" value="customer3">
			    3.客户的独特性就是我们存在的理由
			  </label>
			</div>
			<div class="checkbox">
			  <label>
			    <input class="customer_checkbox" type="checkbox" data-checked="false" value="customer4">
			    4.拒绝瑕疵，一眚能掩大德
			  </label>
			</div>
      	</div>
      	<div class="col-xs-12">
      		<h4>发现创新： </h4>
	        <div class="checkbox">
			  <label>
			    <input class="discovery_checkbox" type="checkbox" data-checked="false" value="discovery1">
			    1.学习是创新的基础，广开言路是学习的方法
			  </label>
			</div>
			<div class="checkbox">
			  <label>
			    <input class="discovery_checkbox" type="checkbox" data-checked="false" value="discovery2">
			    2.你的工作方法又比昨天进步了一点点吗？
			  </label>
			</div>
			<div class="checkbox">
			  <label>
			    <input class="discovery_checkbox" type="checkbox" data-checked="false" value="discovery3">
			    3.以往的成功经验未必是今天问题的解决方法
			  </label>
			</div>
			<div class="checkbox">
			  <label>
			    <input class="discovery_checkbox" type="checkbox" data-checked="false" value="discovery4">
			    4.Do Without，自己创造条件达到目标 
			  </label>
			</div>
      	</div>
      	<div class="col-xs-24" style="padding-left:0;">
      		<h4>系统思维:</h4>
	        <div class="checkbox">
			  <label>
			    <input class="system_checkbox" type="checkbox" data-checked="false" value="system1">
			    1.先确认要去的地方，再决定步骤和方法 
			  </label>
			</div>
			<div class="checkbox">
			  <label>
			    <input class="system_checkbox" type="checkbox" data-checked="false" value="system2">
			    2.举一反三，不头痛医头、脚痛医脚，从源头解决问题
			  </label>
			</div>
			<div class="checkbox">
			  <label>
			    <input class="system_checkbox" type="checkbox" data-checked="false" value="system3">
			    3.复杂的事情简单做，简单的事情认真重复做，重复的事情创造性地做，代码可以做的事情就不要人来做
			  </label>
			</div>
			<div class="checkbox">
			  <label>
			    <input class="system_checkbox" type="checkbox" data-checked="false" value="system4">
			    4.不掉进同一条河里
			  </label>
			</div>
      	</div>
      	
      	<div class="col-xs-24" style="padding-left:0;">
      		<h4>
      		  <label>
			    <input type="checkbox" data-checked="false" value="special" id="special_checkbox" onclick="$('#special_value_input').toggle();">
			    其他价值观
			  </label>
			</h4>
			<input class="form-control" id="special_value_input" name="special_text" style="display:none;">
      	</div>

      	<div class="clearfix"></div>
      </div>
      <div class="modal-footer">
            <button type="button" class="btn btn-primary" id="btn-value">确　定</button>
            <button type="button" class="btn btn-default" id="btn-value-remove" data-dismiss="modal" style="margin-left:5px;">取消</button>
      </div>
    </div>
  </div>
</div>
<div class="modal fade" id="myModal2" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-body">
        <div class="media">
		  <div class="media-left">
		    <div>
		      <span id="msgclass" class="glyphicon glyphicon-ok text-success" aria-hidden="true" style="font-size:85px;"> </span>
		    </div>
		  </div>
		  <div class="media-body" style="font-size:32px;">
		  	<div class="col-xs-24 btn-lg"><p></p></div>
		    <span id="msgbox" class="text-success">发送成功！</span>
		  </div>
		</div>
      </div>
    </div>
  </div>
</div>
<div class="modal fade" id="myModal-img" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
        <h4 class="modal-title" id="myModalLabel">插入图片</h4>
      </div>
      <div class="modal-body">
      	<form action="<?php echo site_url('apps/outlook/index/upload_photos');?>" 
	        method="post" 
	        target="ifm1"
	        class="form-inline form_upload_photos"
	        enctype="multipart/form-data">
	        <div class="col-xs-24 btn-lg"></div>
	        <div class="form-group">
	        	<label for="宽度">图片</label>
				<input class="form-control" type="file" name="Profile_file" id="Profile_file" />
			</div>
			<div class="col-xs-24 btn-lg"></div>
			<div class="clearfix"></div>
			  <div class="form-group">
			    <label for="宽度">宽度</label>
			    <input type="text" class="form-control" id="upload_photo_width" value="500">
			  </div>
			  <div class="form-group">
			    <label for="高度">高度</label>
			    <input type="text" class="form-control" id="upload_photo_height" value="auto">
			  </div>
			  <div class="col-xs-24 btn-lg"></div>
			<div class="clearfix"></div>
		</form>
		<div id="upload_status1">
	       <iframe class="ifm1 hide" name="ifm1"></iframe>
	  </div>
      </div>
      <div class="modal-footer">
		<button type="button" class="btn btn-danger pull-right editor_img_upload">确　定</button>
      </div>
    </div>
  </div>
</div>

<script type="text/javascript" defer="true"> 
var $img_modal=$('#myModal-img');
var doname="<?php echo $_SERVER['HTTP_HOST']; ?>";
var TQE=new tqEditor('emailcontent', 
 {
	toolbar:['mode','paragraph','fontname','fontsize','forecolor','backcolor','bold','italic','underline','strikethrough','removeformat','|','justifyleft','justifycenter','justifyright','unorderedlist','orderedlist','iodent','outdent','indent','|','inserthorizontalrule','createlink','unlink','inserttable','|','insertimage','insertface'],
	toolbarRight:['fullscreen'],
	imageUploadUrl:'./upload.php', 
	linkUploadUrl:'./upload.php',
	faceurl:'http://'+doname+'/js/TQEditor/face'
 });

$(".editor_img_upload").click(function(){
	$(".form_upload_photos").submit();
	$img_modal.modal('hide');
});
function get_photo_url(text){
	var width=$("#upload_photo_width").val();
	var height=$("#upload_photo_height").val();
	var upload_html='<img src="'+text+'" width="'+width+'" height="'+height+'">';
	TQE.insertHtml(upload_html);
}

$(document).ready(function()
{
  //自动提示
  var auto_complete_url="<?php echo site_url('apps/outlook/index/get_user_list'); ?>";
  $("#emaillist").suggest(auto_complete_url,{
        container: '#auto-complete',
        onSelect: function() {},
        selectClass: '',
        matchClass: 'active',
        resultsClass: 'list-unstyled'
  });
  $("#cs_emaillist").suggest(auto_complete_url,{
        container: '#auto-complete2',
        onSelect: function() {},
        selectClass: '',
        matchClass: 'active',
        resultsClass: 'list-unstyled'
  });
  $("#value_user").suggest(auto_complete_url,{
        container: '#auto-complete3',
        onSelect: function() {},
        selectClass: '',
        matchClass: 'active',
        resultsClass: 'list-unstyled'
  });

  $("input:checkbox").click(function() {
	if ($(this).attr('data-checked')=="false") {
		$(this).attr('data-checked','true');
	}else{
		$(this).attr('data-checked','false');
	}
  });

  $("#btn-value").click(function() {
  	if ($("#value_user").val()=='') {
  		alert('请输入要VALUE的人员名单！');
  		return false;
  	};
  	var checkurl="<?php echo site_url('apps/outlook/index/check_value_user'); ?>";
  	var flag=true;
  	var checkuserdata={"value_user":$("#value_user").val()};
  	$.ajax({
		type:'post',
		url:checkurl,
		data:checkuserdata,
		async:false,
		success:function(response){
		    if (response==0) {
				flag=false;	
		    }
		},
	});

  	if (!flag) {
  		alert('输入的value人员名字不够完整，请从下拉提示框里选择名单！');
  		return false;
  	};

	var subject='';
	var whm_value_key='';
	var teamstr='[团队协作]:';
	var	teamflag=false;
	$(".team_checkbox").each(function(){
		if ($(this).attr('data-checked')=="true") {
			teamstr+=$.trim($(this).parent("label").text())+'；';
			whm_value_key+=$(this).val()+',';
			teamflag=true;
		}
	});
	if(teamflag) subject+=teamstr;

	var chengxinstr='[诚信负责]:';
	var	chengxinflag=false;
	$(".chengxin_checkbox").each(function(){
		if ($(this).attr('data-checked')=="true") {
			chengxinstr+=$.trim($(this).parent("label").text())+'；';
			whm_value_key+=$(this).val()+',';
			chengxinflag=true;
		}
	});
	if(chengxinflag) subject+=chengxinstr;

	var customerstr='[客户满意]:';
	var	customerflag=false;
	$(".customer_checkbox").each(function(){
		if ($(this).attr('data-checked')=="true") {
			customerstr+=$.trim($(this).parent("label").text())+'；';
			whm_value_key+=$(this).val()+',';
			customerflag=true;
		}
	});
	if(customerflag) subject+=customerstr;

	var discoverystr='[发现创新]:';
	var	discoveryflag=false;
	$(".discovery_checkbox").each(function(){
		if ($(this).attr('data-checked')=="true") {
			discoverystr+=$.trim($(this).parent("label").text())+'；';
			whm_value_key+=$(this).val()+',';
			discoveryflag=true;
		}
	});
	if(discoveryflag) subject+=discoverystr;

	var systemstr='[系统思维]:';
	var	systemflag=false;
	$(".system_checkbox").each(function(){
		if ($(this).attr('data-checked')=="true") {
			systemstr+=$.trim($(this).parent("label").text())+'；';
			whm_value_key+=$(this).val()+',';
			systemflag=true;
		}
	});
	if(systemflag) subject+=systemstr;

	var specialstr='[其他价值观]:';
	var specialflag=false;
	if ($("#special_checkbox").attr('data-checked')=="true") {
		specialstr+=$("#special_value_input").val()+'；';
		whm_value_key+=$("#special_checkbox").val()+',';
		specialflag=true;
	};
	if(specialflag) subject+=specialstr;

	if (whm_value_key=='') {
		alert('请选择要VALUE的条目类型！');
  		return false;
	};

	if($("#value_user").val()) subject=$("#value_user").val()+subject;
	if (subject!=='') subject='values+'+subject;
	$("#mail-subject").val(subject);
	$("#whm_value_key").val(whm_value_key);
	$("#whum_value_user").val($("#value_user").val());
	
	$('#myModal').modal('hide');
/*	$("input:checkbox").attr('data-checked','false');
	$("input:checkbox").removeAttr("checked");
	$("#value_user").val('');
*/  });
//取消设置,所有选项清零
  $("#btn-value-remove").click(function () {
  	$("input:checkbox").attr('data-checked','false');
	$("input:checkbox").removeAttr("checked");
	$("#value_user").val('');
  });

  $("#btn-send-mail").click(function () {
  	if ($("#emailcontent").val().replace(/(^\s*)|(\s*$)/g,'')=="") {
		$("#msgclass").removeClass('glyphicon-ok text-success');
    	$("#msgclass").addClass('glyphicon-remove text-danger');
		$("#msgbox").removeClass('text-success');
		$("#msgbox").addClass('text-danger');
    	$("#msgbox").text('邮件内容不能为空！');
    	$('#myModal2').modal('show');
    	var that=$(this);
    	setTimeout(function() {
			$('#myModal2').modal('hide');
			that.button('reset');
		},3000);
		return false;
	};
	var url = $("form#form-send-mail").attr('action');
	var data= $("form#form-send-mail").serialize();
	$.post(url,data,function(result){
		if (result==1) {
			$("#msgclass").removeClass('glyphicon-remove text-danger');
	    	$("#msgclass").addClass('glyphicon-ok text-success');
	    	$("#msgbox").removeClass('text-danger');
			$("#msgbox").addClass('text-success');
	    	$("#msgbox").text('发送成功！');
	    	$('#myModal2').modal('show');
			setTimeout(function() {
				$('#myModal2').modal('hide');
				location.href=location.href;
			},1500);
		}else{
			$("#msgclass").removeClass('glyphicon-ok text-success');
	    	$("#msgclass").addClass('glyphicon-remove text-danger');
			$("#msgbox").removeClass('text-success');
			$("#msgbox").addClass('text-danger');
			if (result==-1) {
				$("#msgbox").text('请输入收件人名字！');
			}else{
				$("#msgbox").text('发送失败！');
			}
	    	$('#myModal2').modal('show');
	    	setTimeout(function() {
				$('#myModal2').modal('hide');
			},5000);
		}
	});
  })
});
</script>