<?
require_once "api.php";
$boardid = r('boardid');

$boards = boards(true);
$lists = getlists($boardid);
$cards = getcards($boardid,array_keys($lists));
$users = getusers();
$risklabels = getRiskLabels();
$allrisklabels = getAllRiskLabels();
$yanqidepartmentuser = getYanQiDepartmentUser();

$DATA = array(
	'boardid' => $boardid,
	'boards' => $boards,
	'lists' => $lists,
	'cards' => $cards,
	'users'=>$users,
    'risklabels'=>$risklabels,
    'allrisklabels'=>$allrisklabels,
    'yanqidepartmentuser'=> $yanqidepartmentuser,
    'ts'=>time(),
);
?>

<!DOCTYPE html>
<html>
	<head>
		<? require_once "header.html"; ?>
		<link type="text/css" href="css/jquery.atwho.css?_<?=filemtime('css/jquery.atwho.css')?>" rel="stylesheet" />
		<link type="text/css" href="scripts/jedate.css?_<?=filemtime('scripts/jedate.css')?>" rel="stylesheet" />
		<script type="text/javascript" src="scripts/jquery.caret.js?_<?=filemtime('scripts/jquery.caret.js')?>"></script>
		<script type="text/javascript" src="scripts/jquery.atwho.js?_<?=filemtime('scripts/jquery.atwho.js')?>"></script>
		<script type="text/javascript" src="scripts/proreport.js?_<?=filemtime('scripts/proreport.js')?>"></script>
		<script type="text/javascript" src="scripts/cardPopover.js?_<?=filemtime('scripts/cardPopover.js')?>"></script>
		<script type="text/javascript" src="scripts/card_list_timeline.js?_<?=filemtime('scripts/card_list_timeline.js')?>"></script>
		<script type="text/javascript" src="scripts/copy_list_to_new.js?_<?=filemtime('scripts/copy_list_to_new.js')?>"></script>
		<script type="text/javascript" src="scripts/echarts.min.js?_<?=filemtime('scripts/echarts.min.js')?>"></script>
		<script type="text/javascript" src="scripts/jedate.js?_<?=filemtime('scripts/jedate.js')?>"></script>
		<script type="text/javascript" src="scripts/diff.js"></script>

        <!--  fullcalendar v4.1.0 start -->
        <link href='timeline/core.main.min.css' rel='stylesheet'/>
        <link href='timeline/timeline.main.min.css' rel='stylesheet'/>
        <link href='timeline/resource-timeline.main.min.css' rel='stylesheet'/>
        <script src='timeline/core.main.min.js'></script>
        <script src='timeline/locales-all.min.js'></script>
        <script src='timeline/interaction.main.min.js'></script>
        <script src='timeline/timeline.main.min.js'></script>
        <script src='timeline/resource-common.main.min.js'></script>
        <script src='timeline/resource-timeline.main.min.js'></script>
        <style>
            a.fc-timeline-event {
                color: #fff
            }
        </style>
        <!--  fullcalendar v4.1.0 end -->

	</head>
	<body>
    	<? require_once "leftbar.html"; ?>
    	<? require_once "projectheader.html"; ?>
        <div id="firstlabelcardinfoMask" style="display:none;"></div>
        <script type="text/tmpl" id="tmpl-cardinfo" >
			<? require_once "cardinfo.html"; ?>
		</script>

        <script type="text/tmpl" id="tmpl-card_timeline" >
			<? require_once "card_list_timeline.html"; ?>
		</script>
		
		<script type="text/tmpl" id="tmpl-listmenu" >
			<? require_once "listmenu.html"; ?>
		</script>

		<script type="text/tmpl" id="tmpl-cardmenu" >
			<? require_once "cardmenu.html"; ?>
		</script>
		
		<script type="text/tmpl" id="tmpl-cardinfo_comments" >
			<? require_once "cardinfo_comments.html"; ?>
		</script>
		
		<script type="text/tmpl" id="tmpl-proreport" >
			<? require_once "proreport.html"; ?>
		</script>

        <script type="text/tmpl" id="tmpl-cardpopover" >
			<? require_once "cardpopover.html"; ?>
		</script>
		
		<script type="text/tmpl" id="tmpl-memberlist" >
			<? require_once "memberlist.html"; ?>
		</script>
        
        <script type="text/tmpl" id="tmpl-addlabels" >
			<? require_once "labels.html"; ?>
		</script>

        <script type="text/tmpl" id="tmpl-addRisklabels" >
            <? require_once "risklabels.html"; ?>
        </script>

        <script type="text/tmpl" id="tmpl-addQAlabels" >
			<? require_once "qalabels.html"; ?>
		</script>

        <script type="text/tmpl" id="tmpl-firstAddQaLabels" >
			<? require_once "firstAddQaLabels.html"; ?>
		</script>

		<script type="text/tmpl" id="tmpl-modifyTitle" >
			<div class="pop-over" id="modifyTitle">
				<div class="header">
					<span class="header-title">修改看板名</span>
					<a class="headbtn_right close_popover"><i class="fa fa-close"></i></a>
				</div>
				<div class="popcontent">
					<input type="text" class="modifyTitle_text" placeholder="输入看板名"></input>
					<button class="button modifyTitle_btnsubmit" type="button" style=" margin: 4px 0 15px 0;">确定</button>
				</div>
			</div>
		</script>
        
        <script type="text/tmpl" id="tmpl-lists" >
			<div class="panel" data-id="<%=data['_id']%>" id="list_<%=data['_id']%>">
				<div class="tasktitle">
					<div class="tasklistcount"></div>
					<h2 class="tasktitle_cont"><%=data['title']%></h2>
					<a class="fa fa-bars list_menu" href="javascript:;;;"></a>
					<div class="setlisttile_editor_div" style="display:none ;">
	            		<textarea class="setlisttile_editor js-new-comment-input" data-bindbtn='.setlisttile_btnsubmit' placeholder="输入栏目标题" data-autosize-on="true" style=" word-wrap: break-word; height: 35px;width: 200px;"></textarea><button class="button setlisttile_btnsubmit" type="button" style=" float: right; margin-top: 4px;">确定</button>
	            	</div>
	            	
				</div>
				
				<div class="tasklist">
				</div>
				
				<div class="" style=" width:94%; clear: both; position:relative;; margin:0 3%;margin-top: 15px; display: ;">
					<a class="js-card-composer add_card_href" href="javascript:;" style="display: block;width: 115px;">
						<i class="fa fa-plus"></i>添加卡片
					</a>
	            	
	            	<div class="class_addcard_div" style="display: none;">
	            		<textarea class="addcard_editor js-new-comment-input" data-bindbtn='.addcard_btnsubmit' placeholder="输入任务(Ctrl+Enter提交)" data-autosize-on="true" style="word-wrap: break-word; height: 35px;width: 200px;"></textarea><button class="button addcard_btnsubmit" type="button" style=" float: right; margin-top: 4px;">添加</button>
	            	</div>
            	</div>
			</div>
		</script>
		
		<script type="text/tmpl" id="tmpl-list-add" >
			<div class="panel" id="list_add_panel">
				<div class="tasktitle">
					<h2 class="tasktitle_cont"><i class="fa fa-plus"></i> 新增栏目</h2>
					<div class="setlisttile_editor_div" style="display:none ;">
	            		<textarea class="setlisttile_editor js-new-comment-input"  data-bindbtn='.setlisttile_btnsubmit' placeholder="输入标题(Ctrl+Enter提交)" data-autosize-on="true" style="word-wrap: break-word; height: 35px;width: 200px;"></textarea><button class="button setlisttile_btnsubmit" type="button" style=" float: right; margin-top: 4px;">确定</button>
	            	</div>
	            	
				</div>
				<div class="tasklist">
				</div>
			</div>
		</script>
        
        <script type="text/tmpl" id="tmpl-card" >
			<div class="card" data-id="<%=data['_id']%>" id="card_<%=data['_id']%>">
    				<div>
    				    <input type="checkbox" id="finishcheck_<%=data['_id']%>" class="finishcheck" style="vertical-align: top;"/>
    				    <span class="list_card_title_qalabel_name"></span>
    				    <span class="list_card_title"></span>
    				    <div class="commonts_num"><span></span></div>
                        <span class="card-corner-mark"></span>
    				</div>
    				<!--<span class="badge-icon fa fa-comment-o badge-comment"> 4</span> -->
    				<div class="badges">
    					<div class="minicard-labels"></div>
    				</div>
    				<div class="minicard-members js-minicard-members"></div>
    				<div style="clear:both"></div>
			</div>
		</script>
        

		<div id="wrap">
			<div id="main">
				<div id="centerpanel" style=" white-space:nowrap;">
                	
				</div>
			</div>
		</div>
		
		
        <script>
		DATA = <?=json_encode($DATA)?>;
		
		$(function(){
			listInit();
			
			$('#centerpanel').sortable({
				tolerance:'pointer',
				items: ".panel:not(#list_add_panel)",
				distance: 15,
				opacity:0.8,
				revert:100,
				stop: function(event, ui){ 
					var newOrder = $('#centerpanel').sortable('serialize');
					doSubmitSortList(DATA.boardid,newOrder);
					console.log( newOrder );
				}
			});
			bindTasklistsort();
			

			$('body').on("click",".card",function(e){
				if(e.toElement && e.toElement.type == 'checkbox')return;
				console.log('showcard');
				var cardid = $(this).data('id');
				//checkUnfinishedCardCanClick(cardid,function() {
                    showCard( cardid );
                //});
			});
			//增加卡片链接
			$('body').on("click",".add_card_href",function(){
				$(this).parent().find('.class_addcard_div').show();
				// $(this).parent().find('.addcard_editor').val('【分类】');
				$(this).parent().find('.addcard_editor').val('');
                $(this).parent().find('.addcard_editor').select();
				$(this).hide();
                //
				return;


                // 新的提单方式
                var me = this;
                var val = DC.unfinishedTitle;

                // var val = $(this).parent().find('.addcard_editor').val();
                // if(val.length==0){
                //     $(this).parents('.class_addcard_div').hide();
                //     $(this).parents('.panel').find('.add_card_href').show();
                //     return;
                // }
                var listid = $(this).parents('.panel').data('id');
                doSubmitAddCard2(val,DATA.boardid,listid,function(data){
                    $(me).parent().find('.addcard_editor').val('');
                    $('#list_'+ listid+ ' .tasklist').scrollTop(999999);
                    console.log('new data',data);

                    showCard( data.data._id );
                });

			});
			
			//添加卡片-添加按钮
			$('body').on("click",".addcard_btnsubmit",function(e){


				var me = this;
                $(this).parents('.class_addcard_div').hide();
                $(this).parents('.panel').find('.add_card_href').show();

				var val = $(this).parent().find('.addcard_editor').val();
				if(val.length==0){
					$(this).parents('.class_addcard_div').hide();
					$(this).parents('.panel').find('.add_card_href').show();
					return;
				}

				var listid = $(this).parents('.panel').data('id');
                doSubmitAddCard2(val,DATA.boardid,listid,function(data){
					$(me).parent().find('.addcard_editor').val('');
					$('#list_'+ listid+ ' .tasklist').scrollTop(999999);
                    // console.log('old data',data);

                    DATA.lastShowCardID = data.data._id;

                    // $('#firstlabelcardinfoMask').show();
                    // showQALabelsOnNewAdd(e);

                    showCard( data.data._id ,function () {
                        var target = $('#cardinfo').offset();
                        console.log('target',target);

                        var boardTitle = DATA.boards[DATA.boardid].title;
                        var isCheckBoardTitle = boardTitle.match(/《(\S*?)》/g);
                        if (isCheckBoardTitle){
                            showQALabelsOnNewAdd({clientY:target.top+110,clientX:target.left+15});
                        }

                        // $('.cardinfo_description').click();
                    });




				});
			});
			
			//栏目标题
			$('body').on("click",".tasktitle_cont",function(){
				$(this).parent().find('.setlisttile_editor_div').show();
				$(this).hide();
				var ov = $(this).text();
				if(ov==' 新增栏目')ov="【】";
				$(this).parent().find('.setlisttile_editor').val( ov );
			});
			//栏目标题确认按钮
			$('body').on("click",".setlisttile_btnsubmit",function(){
				var me = this;
				var val = $(this).parent().find('.setlisttile_editor').val();
				if(val.length==0){
					$(this).parents('.setlisttile_editor_div').hide();
					$(this).parents('.panel').find('.tasktitle_cont').show();
					return;
				}
				isvalok = val.match(/【(\S*?)】/g);
				if(!isvalok || isvalok.length == 0){
				    alert('请添加【】符号正确创建新列表');
				    return;
                }
				if(val.replace(/\s+/g, "") == '【】'){
                    alert('请在【】中添加内容');
                    return;
                }

				var listid = $(this).parents('.panel').data('id');
				if(listid==null){
					doSubmitAddList(val,DATA.boardid,function(){
						$(me).parent().find('.setlisttile_editor').val('');
						$(me).click();
					});
				}else{
					doSubmitSetListTitle(val,DATA.boardid,listid,function(){
						$(me).parent().find('.setlisttile_editor').val('');
						$(me).click();
					});
				}
			});
			
			//顶部标题
			$('body').on("click",".projectheader h1",function(e){
				showMidiTitle(e);
			});
			//顶部标题确定按钮
			$('body').on("click",".modifyTitle_btnsubmit",function(e){
				doSubmitMidifyBoardTitle( DATA.boardid , $('.modifyTitle_text').val(),function(){
					$('#modifyTitle .close_popover').click();
				});
			});
			
			//popover统一关闭逻辑
			$('body').on("click",".close_popover",function(e){
				$(this).parents('.pop-over').remove();
			});
			
			
			
			//title前的复选框
			$('body').on("click",".finishcheck",function(){
                var that = $(this);
                // that.preventDefault();
                var cardid = $(this).parents('.card').data('id');
				
				/*
				var labels = DATA.cards[cardid].labelIds;
				for(var i=0;i<labels.length;i++){
					doSubmitSetLabel(cardid,labels[i]);
				}
				if(DATA.cards[cardid].risklabelIds){
					var risklabels = DATA.cards[cardid].risklabelIds;
					for(var i=0;i<risklabels.length;i++){
						doSubmitSetRiskLabel(cardid,risklabels[i]);
					}
				}
				*/

				var _oldTitle = DATA.cards[cardid].title;
				if(_oldTitle.indexOf('~~') == -1){
					_oldTitle = '~~'+ _oldTitle + '~~';
					doSubmitCommonts('我勾选了<font color=blue>[完成]</font>卡片',DATA.boardid,cardid);

					if(window.MYINFO && DATA.cards[ cardid ].userId != window.MYINFO._id ){
						//如果这个单子不是我创建的
						var ownerInfo = DATA.users[DATA.cards[ cardid ].userId];
						if(ownerInfo && ownerInfo.profile.fullname){
							var msgInfo = window.MYINFO.profile.fullname + "完成了任务["+ DATA.cards[ cardid  ].title+']';
							sendDDMSG(ownerInfo.profile.fullname,msgInfo,location.href,ownerInfo.dduserid);
						}
					}

				}else{
					_oldTitle = _oldTitle.replace(/~/g,'');
				}
				doSubmitTitle(_oldTitle, DATA.boardid, cardid,function(){});
			});
			
			//list列表菜单按钮
			$('body').on("click",".list_menu",function(e){
				showListMenu(e,this);
			});
			$('#wrap').on('click',function(){
				$('.listmenu').remove();
			});
			$('body').on("click",".close_menu_li",function(e){
				$('.listmenu').remove();
			});
			$('body').on("click",".archived_list",function(e){
				if(confirm("确定要将这个列表归档吗？")){
					var listid = $(this).parents('.listmenu').data('id');
					doSubmitArchivedList(listid,function(){
						$('.close_menu_li').click();
					});
				}
                $('.listmenu').remove();
			});
			$('body').on("click",".archived_overedcards",function(e){
				if(confirm("确定要将这个列表中所有已完成项归档吗？")){
					var listid = $(this).parents('.listmenu').data('id');
					doSubmitArchivedOveredCards(listid,function(){
						$('.close_menu_li').click();
					});
				}
			});

            $('body').on("click",".export_excel_this_list",function(e){
                const lid = $(this).parents('.listmenu').data('id');
                const bid = DATA.lists[lid].boardId;
                export_excel_url = pyapi_host + `/v2/export/list?bid=${bid}&lid=${lid}`;
                window.open(export_excel_url);
                return;

            });

            $('body').on("click",".list_timeline",function(e){
                var listid = $(this).parents('.listmenu').data('id');


                $('.listmenu').remove();
                showCardTimeline(listid);

            });

			$('body').on("contextmenu",".card",function(e){
				$('#cardmenu').remove();
				var cardid = $(this).data('id');
				//var listid = $(obj).parents('.panel').data('id');
				//var html = T( $('#tmpl-listmenu').html() , DATA.lists[ listid ] );
				var html = $('#tmpl-cardmenu').html();
				$('body').append( html );

				var listTitle = {};
				for(var listid in DATA.lists){
					if(DATA.lists[listid].boardId != DATA.boardid)continue;
					if(DATA.lists[listid].archived)continue;
					listTitle[ DATA.lists[listid].title ] = listid;
				}
				var listTitles = Object.keys(listTitle);
				listTitles.sort();
				var html = ["<option value=''>请选择</option>"];
				for(var i=0;i<listTitles.length;i++){
					html.push("<option value='"+ listTitle[ listTitles[i] ] +"'>"+ listTitles[i] +"</option>");
				}
				console.log( html );
				$('#cardmovetoselect').html( html.join('') );
				
				$('#cardmenu').css({
					'left':$(document).scrollLeft() + e.clientX,
					'top':e.clientY+15
				});

				$('#cardmovetoselect').off().on('change',function(){
					if(!$(this).val())return;
					doSubmitChangeListID(cardid,$(this).val());
					$('#cardmenu').remove();
				});
				return false;
            });
			$('body').on('click','#movecardto',function(e){
               $('#movetodiv').css({
					top:$(this).offset().top+20,
					left:$(this).offset().left+60
			   }).show();
			
				
            });



            $('body').on("click",".copy_list_to_new",function(e){
                var listid = $(this).parents('.listmenu').data('id');

                $('.listmenu').remove();
                // showCardTimeline(listid);
                copyListToNew(listid);

            });

			
			//当有hash值时，自动选中对应card
			if( window['HASH'] && HASH()['cardid']){
				if($('#card_'+ HASH()['cardid']).length >0 ){
					moveToCard( HASH()['cardid'] )
					showCard( HASH()['cardid'] );
				}
			}
			
			//移动到指定卡片
			function moveToCard(cardid,callback){
				if($('#card_'+ cardid).length == 0 ){
					callback && callback();
					return;
				}
				var offset = $('#card_'+ cardid).offset();
				$('body').animate({scrollLeft: (offset.left-200)+'px'}, 400);
				
				setTimeout(function(){
					var top = $('#card_'+ cardid).position().top; 
					$('#card_'+ cardid).parents('.tasklist').animate({scrollTop: (top-300) +'px'}, 400);
					callback && callback();
				},400);
			}
			
			//textarea ctrl+Enter处理
			$('body').on('keydown','textarea,input',function(e){
				if(e.keyCode == 13 && e.ctrlKey ){
					var _select = $(this).data('bindbtn');
					$(this).parent().find(_select).click();
				}
			});
			
			
			
			
			//快捷键
			$('body').on('keydown',function(e){
				//console.log(e);
				//ALT+M
				if(e.keyCode == 77 && e.altKey ){
					if(filterList._lastFiler!='my'){
						filterList.my();
						$('#filterText').val('my');
					}else{
						filterList.null();
						$('#filterText').val('');
					}
				}
			});
			
		});
		</script>
	</body>
</html>


