427 lines
14 KiB
PHP
427 lines
14 KiB
PHP
<?php
|
|
$userinfo = getUserInfo($MYID);
|
|
$rqorgid = r('orgid');
|
|
?>
|
|
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<? require_once "header.html"; ?>
|
|
<script type="text/javascript" src="scripts/colpick.js?_<?=filemtime('scripts/colpick.js')?>"></script>
|
|
<!-- <script src="https://cdn.jsdelivr.net/npm/handlebars@latest/dist/handlebars.js"></script>-->
|
|
<link type="text/css" href="css/colpick.css?_<?=filemtime('css/colpick.css')?>" rel="stylesheet" />
|
|
</head>
|
|
<body>
|
|
<? require_once "leftbar.html"; ?>
|
|
<? require_once "projectheader.html"; ?>
|
|
|
|
<!-- <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">-->
|
|
<link type="text/css" href="css/bootstrap.min.css?_<?=filemtime('css/bootstrap.min.css')?>" rel="stylesheet" />
|
|
|
|
<style>
|
|
.h1_title{
|
|
font-size: 25px;
|
|
margin-left: 10px;
|
|
margin-top: 10px;
|
|
}
|
|
a.star_top{
|
|
color: red;
|
|
}
|
|
.right_ico{
|
|
margin: 0px 3px;
|
|
}
|
|
.board_star_num{
|
|
font-size: 13px;
|
|
/*margin-right: 10px;*/
|
|
/*margin-top: 5px;*/
|
|
display: inline-block;
|
|
width: 77px;
|
|
}
|
|
.main_board_act{
|
|
display: none;
|
|
}
|
|
.star_board_boardmain{
|
|
height: 100px;
|
|
}
|
|
.main_board_progress{
|
|
margin-top: 5px;
|
|
}
|
|
|
|
|
|
|
|
</style>
|
|
<script type="text/tmpl" id="tmpl-board" >
|
|
<div class="boardtmpl canchangesort">
|
|
<%
|
|
var bgcolor = "";
|
|
var scolor = localStorage['boardColor1_'+ data['_id']];
|
|
if(scolor){
|
|
if(scolor.indexOf('base64')!=-1){
|
|
bgcolor = "background-image:url("+scolor+");background-size:100%";
|
|
}else{
|
|
bgcolor = "background-color:"+scolor;
|
|
}
|
|
}
|
|
var star_icon = 'fa-star-o';
|
|
|
|
%>
|
|
<div class="boardmain" data-id="<%=data['_id']%>" data-title="<%=data['title']%>" style="position: relative;<%=bgcolor%>">
|
|
<a href="./?app=list&boardid=<%=data['_id']%>"><%=data['title']%></a>
|
|
<%if(MYINFO && MYINFO.extData && MYINFO.extData.admin=='all'){%>
|
|
<span style="font-size:12px;font-weight: normal;"><%=(MYINFO&&MYINFO.extData&&MYINFO.extData.admin?data['orgname']:"")%></span>
|
|
<%}%>
|
|
<!--div style="float:right"><a class="fa <%=star_icon%> js_star_board" href="javascript:;;;" title="星标看板"></a></div-->
|
|
<div class="main_board_act" style="position: absolute; bottom: 0; text-align: right; width: 94%; font-weight: normal;">
|
|
<a class="fa fa-trash-o archivedBoard" href="javascript:;;;" title="归档该看板"></a>
|
|
<a class="fa fa-adjust colorbox" href="javascript:;;;" title="修改背景色"></a>
|
|
<a class="fa fa-sign-out jsQuitBoard" href="javascript:;;;" title="退出看板"></a>
|
|
|
|
<!--<img src="img/getcolor.png" class="colorbox" style="width: 15px;" />-->
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</script>
|
|
|
|
<!-- 星标看板 -->
|
|
<script type="text/tmpl" id="tmpl-board_star" >
|
|
<div class="boardtmpl star_canchangesort board_star">
|
|
<%
|
|
var bgcolor = "";
|
|
var scolor = localStorage['boardColor1_'+ data['_id']];
|
|
if(scolor){
|
|
if(scolor.indexOf('base64')!=-1){
|
|
bgcolor = "background-image:url("+scolor+");background-size:100%";
|
|
}else{
|
|
bgcolor = "background-color:"+scolor;
|
|
}
|
|
}
|
|
|
|
var star_icon = 'fa-star';
|
|
|
|
var progress_class = 'progress-bar-danger';
|
|
|
|
var progress_num = (data['complete_card_num'] / data['all_card_num'] * 100).toFixed(2);
|
|
if(data['remain_card_num'] <= 0 || data['all_card_num'] <= 0){
|
|
progress_num = 0;
|
|
}
|
|
if (progress_num >= 80){
|
|
progress_class = 'progress-bar-success';
|
|
}else if(progress_num >= 50){
|
|
progress_class = 'progress-bar-warning';
|
|
}
|
|
|
|
var showTopbtnClass = '';
|
|
var flagClass = '';
|
|
if (data['showTopbtn']){
|
|
flagClass = 'fa-flag';
|
|
showTopbtnClass = 'fa-caret-square-o-up';
|
|
}
|
|
var boardRightHtml = '';
|
|
if(data['showTopbtn']){
|
|
boardRightHtml += '<a class="right_ico fa fa-caret-square-o-up jsTopBoard top_board_hide" href="javascript:;;;" title="置顶"> </a>';
|
|
}
|
|
|
|
if(data['isTop']){
|
|
boardRightHtml += '<a class="right_ico fa fa-flag star_top" href="javascript:;;;" title="重要看板"> </a>';
|
|
bgcolor = "background-color: #0a009fa3";
|
|
}else{
|
|
if(data['isStar']){
|
|
boardRightHtml += '<a class="right_ico fa fa-star js_star_board" href="javascript:;;;" title="星标看板"> </a>';
|
|
}
|
|
}
|
|
|
|
|
|
%>
|
|
<div class="boardmain star_board_boardmain" data-id="<%=data['_id']%>" data-title="<%=data['title']%>" style="position: relative;<%=bgcolor%>">
|
|
<a href="./?app=list&boardid=<%=data['_id']%>"><%=data['title']%></a>
|
|
<div style="float:right">
|
|
<!-- <a class="fa <%=showTopbtnClass%> jsTopBoard top_board_hide" href="javascript:;;;" title="置顶"></a>-->
|
|
<!-- <a class="fa <%=star_icon%> js_star_board" href="javascript:;;;" title="星标看板"></a>-->
|
|
<%=boardRightHtml%>
|
|
|
|
</div>
|
|
<div style="">
|
|
<span class='board_star_num'>已完成: <%=data['complete_card_num']%></span>
|
|
<span class='board_star_num'>剩余单: <%=data['remain_card_num']%></span>
|
|
<span class='board_star_num'>总单数: <%=data['all_card_num']%></span>
|
|
</div>
|
|
<div class="main_board_progress">
|
|
<div class="progress">
|
|
<div class="progress-bar <%=progress_class%> progress-bar-striped active" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" style="min-width: 3em; width: <%=progress_num%>%;">
|
|
<%=progress_num%>%
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="main_board_act" style="position: absolute; bottom: 0; text-align: right; width: 94%; font-weight: normal;">
|
|
<a class="fa fa-trash-o archivedBoard" href="javascript:;;;" title="归档该看板"></a>
|
|
<!-- <a class="fa fa-adjust colorbox" href="javascript:;;;" title="修改背景色"></a>-->
|
|
<a class="fa fa-sign-out jsQuitBoard" href="javascript:;;;" title="退出看板"></a>
|
|
|
|
<!--<img src="img/getcolor.png" class="colorbox" style="width: 15px;" />-->
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</script>
|
|
|
|
<script type="text/tmpl" id="tmpl-createproject" >
|
|
<? require_once "createproject.html"; ?>
|
|
</script>
|
|
|
|
<div id="wrap">
|
|
|
|
<!-- <div class="" style="max-width: 1200px; padding-top: 5px;; margin:auto">
|
|
<h1 class="h1_title boards-page-board-section-header-name"> 重要看板</h1>
|
|
</div>
|
|
<div id="main_top" style="max-width: 1200px; padding-top: 5px;; margin:auto">
|
|
|
|
</div>-->
|
|
|
|
<!-- <div class="" style="max-width: 1200px; padding-top: 5px;; margin:auto;clear: both"></div>-->
|
|
|
|
|
|
<!--div class="" style="max-width: 1200px; padding-top: 5px;; margin:auto">
|
|
<h1 class="h1_title boards-page-board-section-header-name"> 星标看板</h1>
|
|
</div>
|
|
<div id="main_star_1" style="max-width: 1200px; padding-top: 5px;; margin:auto">
|
|
<div id="main_star_top" style="max-width: 1200px; padding-top: 5px;; margin:auto">
|
|
|
|
</div>
|
|
<div id="main_star" style="max-width: 1200px; margin:auto">
|
|
|
|
</div>
|
|
|
|
</div-->
|
|
|
|
<div class="" style="max-width: 1200px; padding-top: 5px;; margin:auto;clear: both"></div>
|
|
|
|
<div class="" style="max-width: 1200px; padding-top: 5px;; margin:auto">
|
|
<h1 class="h1_title boards-page-board-section-header-name" style=";width:120px;display:inline-block"> 项目看板</h1>
|
|
|
|
<?php
|
|
if($userinfo && $userinfo['extData'] && $userinfo['extData']['admin']==='all'){
|
|
$orgs = getorgs();
|
|
?>
|
|
<span>
|
|
<select style="padding:5px;" id="selectorg">
|
|
<option value="">切换组织</option>
|
|
<? foreach($orgs as $orgid=>$orgname){?>
|
|
<option value="<?=$orgid?>"><?=$orgname?></option>
|
|
<? } ?>
|
|
</select>
|
|
</span>
|
|
<?php
|
|
}
|
|
?>
|
|
</div>
|
|
<div id="main" style="max-width: 1200px; padding-top: 5px;; margin:auto"></div>
|
|
|
|
|
|
|
|
</div>
|
|
</body>
|
|
|
|
<script>
|
|
var rqorgid="<?=$rqorgid?>";
|
|
var sortData = {};
|
|
if(localStorage.boardSortData){
|
|
try{
|
|
sortData = JSON.parse(localStorage.boardSortData);
|
|
}catch(e){}
|
|
}
|
|
|
|
function initBoard(){
|
|
getboards(function(json){
|
|
DATA.boards = json;
|
|
fmtBoards();
|
|
|
|
},rqorgid);
|
|
}
|
|
|
|
function bindBoardSort(){
|
|
try{
|
|
$('#main').sortable('destory');
|
|
}catch(e){}
|
|
|
|
var lastSortCard;
|
|
$('#main').sortable({
|
|
connectWith: [".canchangesort"],
|
|
|
|
distance: 15,
|
|
tolerance:'pointer',
|
|
opacity:0.8,
|
|
revert:100,
|
|
helper:'clone',
|
|
appendTo:'body',
|
|
start : function(event, ui){
|
|
|
|
},
|
|
stop: function(event, ui){
|
|
sortData = {};
|
|
$('.canchangesort').each(function(index){
|
|
var boardid = $(this).find('.boardmain').data('id');
|
|
sortData[boardid] = index;
|
|
});
|
|
localStorage.boardSortData = JSON.stringify(sortData);
|
|
},
|
|
|
|
}).disableSelection();
|
|
}
|
|
|
|
function fmtBoards(){
|
|
boards = [];
|
|
for(var bid in DATA.boards){
|
|
DATA.boards[bid].sort = sortData[bid] || 0;
|
|
boards.push( DATA.boards[bid] );
|
|
}
|
|
boards.sort(function(a,b){
|
|
return a.sort - b.sort;
|
|
});
|
|
|
|
console.log('fmtBoards',boards);
|
|
|
|
fill('#tmpl-board', boards ,'#main');
|
|
$('#main').prepend('<div class="boardtmpl">\
|
|
<div class="boardmain" style="background-color:#999;text-align: center;line-height: 50px;">\
|
|
<a href="javascript:;" class="addprojecthref">新建看板</a>\
|
|
</div>\
|
|
</div><div class="boardtmpl">\
|
|
<div class="boardmain" style="text-align: center;line-height: 50px;">\
|
|
<a href="./?app=mylists" class="tomylists">与我相关</a>\
|
|
</div>\
|
|
</div>');
|
|
|
|
bindBoardSort();
|
|
//选色器
|
|
$('.colorbox').colpick({
|
|
onChange:function(hsb,hex,rgb,el,bySetColor) {
|
|
//$(el).css('border-color','#'+hex);
|
|
var b = $(el).parents('.boardmain');
|
|
var id = b.data('id');
|
|
|
|
b.css('background-color','#'+hex);
|
|
localStorage['boardColor_'+ id] = '#'+hex;
|
|
//console.log(hex);
|
|
},
|
|
onSubmit:function(hsb,hex,rgb,el) {
|
|
$(el).colpickHide();
|
|
}
|
|
});
|
|
|
|
//粘贴背景图片
|
|
$('.boardmain').pasteImageReader(function(results){
|
|
var id = $(this).data('id');
|
|
console.log(id);
|
|
localStorage['boardColor_'+ id] = results.dataURL;
|
|
fmtBoards();
|
|
});
|
|
}
|
|
|
|
//创建看板
|
|
$('body').on('click','.addprojecthref',function(e){
|
|
|
|
$('#createproject').remove();
|
|
var html = T( $('#tmpl-createproject').html() , {} );
|
|
$('body').append( html );
|
|
$('#createproject').css({
|
|
'left':e.clientX+5,
|
|
'top':e.clientY+10
|
|
});
|
|
|
|
return false;
|
|
});
|
|
//创建submit
|
|
$('body').on('click','.addboard_btnsubmit',function(e){
|
|
var val = $('.addboard_text').val();
|
|
if(val.length == 0)return;
|
|
doSubmitAddboard(val,function(json){
|
|
$('.close_createproject').click();
|
|
});
|
|
});
|
|
|
|
$('#selectorg').on('change',function(e){
|
|
var orgid = $(this).val();
|
|
console.log(orgid);
|
|
location.href="./?app=board&orgid="+orgid;
|
|
});
|
|
$('#selectorg').val("<?=$rqorgid?>");
|
|
|
|
|
|
//创建界面X
|
|
$('body').on('click','.close_createproject',function(e){
|
|
$('#createproject').remove();
|
|
});
|
|
$('#main').click(function(){
|
|
$('#createproject').remove();
|
|
});
|
|
|
|
//归档看板
|
|
$('body').on('click','.archivedBoard',function(e){
|
|
var title = $(this).parents('.boardmain').data('title');
|
|
var id = $(this).parents('.boardmain').data('id');
|
|
var code = prompt('输入口令归档看板['+ title +']');
|
|
if(code==null)return;
|
|
|
|
if(code == 'legucc'){
|
|
doArchivedboard(id);
|
|
}else{
|
|
alert('口令错误');
|
|
}
|
|
});
|
|
|
|
// 退出看板
|
|
$('body').on('click','.jsQuitBoard',function(e){
|
|
var title = $(this).parents('.boardmain').data('title');
|
|
var boardid = $(this).parents('.boardmain').data('id');
|
|
if(confirm('你确定退出该项目吗？')){
|
|
$.get('./?app=api&apiact=quit_board&boardid='+ boardid , function(text){
|
|
initBoard();
|
|
});
|
|
}
|
|
});
|
|
|
|
// 置顶看板
|
|
$('body').on('click','.jsTopBoard',function(e){
|
|
var title = $(this).parents('.boardmain').data('title');
|
|
var id = $(this).parents('.boardmain').data('id');
|
|
var isTop = confirm('你确定置顶该项目吗？');
|
|
|
|
if(isTop){
|
|
// doArchivedboard(id);
|
|
var bid = $(this).parents('.boardmain').data('id');
|
|
var url = pyapi_host + '/v2/main_board/toggle_top_board?uid=' + MYID + '&bid=' + bid;
|
|
console.log('quit_board uid',MYID, ' bid ', bid );
|
|
$.get(url,function (data) {
|
|
initBoard();
|
|
});
|
|
|
|
}
|
|
});
|
|
|
|
// 星标看板
|
|
$('body').on('click','.js_star_board',function(e){
|
|
// var title = $(this).parents('.boardmain').data('title');
|
|
var bid = $(this).parents('.boardmain').data('id');
|
|
var url = pyapi_host + '/v2/main_board/toggle_star?uid=' + MYID + '&bid=' + bid;
|
|
$.get(url,function (data) {
|
|
initBoard();
|
|
});
|
|
});
|
|
$('body').on('mouseenter','.boardmain',function (e) {
|
|
$(this).find('.main_board_act').show();
|
|
});
|
|
$('body').on('mouseleave','.boardmain',function (e) {
|
|
$(this).find('.main_board_act').hide();
|
|
});
|
|
|
|
EVENT.on('addboard',function(data){
|
|
initBoard();
|
|
});
|
|
EVENT.on('archivedboard',function(data){
|
|
initBoard();
|
|
});
|
|
|
|
initBoard();
|
|
</script>
|
|
</html>
|
|
|
|
|