+ add report/annual data view.task #6762, task #6161.

This commit is contained in:
Catouse
2019-12-20 17:33:37 +08:00
parent 1a77048053
commit dc96a7879a
7 changed files with 245 additions and 0 deletions
+11
View File
@@ -237,4 +237,15 @@ class report extends control
echo "ok\n";
}
}
/**
* Show personal annual data
*
* @access public
* @return void
*/
public function annualData()
{
die($this->display());
}
}
View File
+50
View File
@@ -0,0 +1,50 @@
function showAnnualData(data)
{
$('.text-holder').each(function()
{
var $this = $(this);
var id = $this.data('id');
var idPath = id.split('.');
var dataProp = data;
for(var i = 0; i < idPath.length; ++i)
{
dataProp = dataProp[idPath[i]];
}
$this.text(dataProp);
});
var $projectsTableRows = $('<tbody></tbody>');
$.each(data.projectsList, function(index)
{
var project = data.projectsList[index];
$projectsTableRows.append(
[
'<tr>',
'<td class="col-name">' + project.name + '</td>',
'<td class="col-storyCount">' + project.storyCount + '</td>',
'<td class="col-taskCount">' + project.taskCount + '</td>',
'<td class="col-bugCount">' + project.bugCount + '</td>',
'</tr>'
].join(''));
});
$('#projectsTable').empty().append($projectsTableRows);
}
$(function()
{
var $main = $('#main');
var ajustPosition = function()
{
$main.css(
{
posotion: 'absolute',
top: Math.floor(($(window).height() - $main.outerHeight()) / 2),
left: Math.floor(($(window).width() - $main.outerWidth()) / 2),
});
};
ajustPosition();
$(window).on('resize', ajustPosition);
// setTimeout(() => {
// window.location.reload();
// }, 5000);
});
+141
View File
@@ -0,0 +1,141 @@
<?php include '../../common/view/header.lite.html.php';?>
<div id='container' style='background-image: url(<?php echo $config->webRoot . 'theme/default/images/main/annual_data_bg.png'?>)'>
<main id="main" style='background-image: url(<?php echo $config->webRoot . 'theme/default/images/main/annual_data_layout.png'?>)'>
<header id='header'>
<h1>2019年工作内容统计一览表 ── <span class='text-holder' data-id='username'>XXX</span></h1>
</header>
<section id='basic'>
<header>基本数据信息</header>
<ul>
<li>累计登录次数 <strong class='text-holder' data-id='totalLoginTimes'>344</strong></li>
<li>累计动态数 <strong class='text-holder' data-id='totalDynamicCount'>1543</strong></li>
<li>累计日志数 <strong class='text-holder' data-id='totalLogCount'>629</strong></li>
<li>累计工时数 <strong class='text-holder' data-id='totalWrokHours'>772</strong></li>
</ul>
</section>
<section id='projectsSummary'>
<header>参与项目概览</header>
<div class='progress-pie inline-block space progress-pie-200' data-value='88' data-doughnut-size='70'>
<canvas width='200' height='200' style='width: 200px; height: 200px;'></canvas>
<div class='progress-info'>
<strong class='text-holder' data-id='totalProjectsCount'>28</strong>
</div>
</div>
<ul>
<li><span class='dot'></span> 已完成的项目 <div><span class='text-holder' data-id='finishProjects'>20</span><span class='text-holder' data-id='finishProjectsPercent'>71.4</span></div></li>
<li><span class='dot'></span> 正在进行的项目 <div><span class='text-holder' data-id='activateProjects'>7</span><span class='text-holder' data-id='activateProjectsPercent'>25</span></div></li>
<li><span class='dot'></span> 已挂起的项目 <div><span class='text-holder' data-id='suspendProjects'>1</span><span class='text-holder' data-id='suspendProjectsPercent'>3.5</span></div></li>
</ul>
</section>
<section id='projectsList'>
<table class='table' id='projectsTableHeader'>
<thead>
<tr>
<th class='col-name'>项目名称</th>
<th class='col-storyCount'>完成需求数</th>
<th class='col-taskCount'>完成任务数</th>
<th class='col-bugCount'>解决bug数</th>
</tr>
</thead>
</table>
<div class='table-wrapper'>
<table class='table' id='projectsTable'>
</table>
</div>
</section>
<section id='tasksBugs'>
<!-- <header>
完成任务与解决bug数据
<div>优先级:<span class='pri pri-1'>1</span><span class='pri pri-2'>2</span><span class='pri pri-3'>3</span><span class='pri pri-4'>4</span></div>
</header> -->
</section>
<section id='tasksBugsHours'></section>
</main>
</div>
<script>
// 年度数据示例
var annualData =
{
// 用户名
username: 'XXX',
// 累计动态数
totalLoginTimes: 344,
// 累计日志数
totalDynamicCount: 1543,
// 累计工时数
totalWrokHours: 772,
// 参与总项目数
totalProjectsCount: 29,
// 已完成的项目
finishProjects: 20,
// 正在进行的项目
activateProjects: 7,
// 已挂起的项目
suspendProjects: 1,
// 已完成的项目占比
finishProjectsPercent: 71.4,
// 正在进行的项目占比
activateProjectsPercent: 25,
// 已挂起的项目占比
suspendProjectsPercent: 3.5,
// 项目列表
projectsList:
[
{name: '项目名称一', storyCount: 22, taskCount: 2, bugCount: '0%'},
{name: '项目名称二', storyCount: 22, taskCount: 2, bugCount: '0%'},
{name: '项目名称三', storyCount: 22, taskCount: 2, bugCount: '0%'},
{name: '项目名称四', storyCount: 22, taskCount: 2, bugCount: '0%'},
{name: '项目名称五', storyCount: 22, taskCount: 2, bugCount: '0%'},
{name: '项目名称六', storyCount: 22, taskCount: 2, bugCount: '0%'},
{name: '项目名称七', storyCount: 22, taskCount: 2, bugCount: '0%'},
{name: '项目名称八', storyCount: 22, taskCount: 2, bugCount: '0%'},
{name: '项目名称九', storyCount: 22, taskCount: 2, bugCount: '0%'},
{name: '项目名称十', storyCount: 22, taskCount: 2, bugCount: '0%'},
{name: '项目名称十一', storyCount: 22, taskCount: 2, bugCount: '0%'},
{name: '项目名称十二', storyCount: 22, taskCount: 2, bugCount: '0%'},
{name: '项目名称十三', storyCount: 22, taskCount: 2, bugCount: '0%'},
{name: '项目名称十四', storyCount: 22, taskCount: 2, bugCount: '0%'},
{name: '项目名称十五', storyCount: 22, taskCount: 2, bugCount: '0%'},
{name: '项目名称十六', storyCount: 22, taskCount: 2, bugCount: '0%'},
{name: '项目名称十七', storyCount: 22, taskCount: 2, bugCount: '0%'}
],
// 总完成任务数
finishTaskTotalCount: 512,
// 完成任务数 - 优先级1
finishTaskCountPri1: 42,
// 完成任务数 - 优先级2
finishTaskCountPri2: 172,
// 完成任务数 - 优先级3
finishTaskCountPri3: 212,
// 完成任务数 - 优先级4
finishTaskCountPri4: 86,
// 总完成bug数
finishBugTotalCount: 128,
// 完成bug数 - 优先级1
finishBugCountPri1: 42,
// 完成bug数 - 优先级2
finishBugCountPri2: 32,
// 完成bug数 - 优先级3
finishBugCountPri3: 20,
// 完成bug数 - 优先级4
finishBugCountPri4: 34,
// 年度解决任务累计工时
yearlyBugHours: [110, 154, 184, 220, 212, 250, 130, 146, 201, 89, 140, 59]
// 年度解决bug累计工时
yearlyBugHours: [10, 5, 11, 20, 30, 14, 3, 20, 50, 27, 13, 3]
};
// 显示年度数据
$(function()
{
//
showAnnualData(annualData);
});
</script>
<?php include '../../common/view/footer.lite.html.php';?>
Binary file not shown.

After

Width:  |  Height:  |  Size: 128 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 10 KiB

+43
View File
@@ -54,3 +54,46 @@ a.showMoreImage:hover{opacity: 1;}
.color-darkblue{background:rgb(0,0,139)}
.color-darkblue:hover{background:rgb(0,0,139)}
.color-darkblue:focus{background:rgb(0,0,139)}
#main,
#tasksBugs
{
border: 1px solid rgb(255,0,139, .5);
}
body {height: 100vh; padding: 0;}
#container {position: fixed; top: 0; right: 0; bottom: 0; left: 0; display: flex; justify-content: center; align-items: center; background-color: #010417; color: #fff; background-size: cover;}
#container:before {content: ' '; display: block; position: absolute; top: 0; left: 0; right: 0; bottom: 0; z-index: 0; opacity: 0.9; background: #010419;}
#main {border: 1px solid rgba(255,255,255,.15); min-width: 1280px; min-height: 800px; position: absolute; z-index: 10; padding: 0;}
#main > section {position: absolute; }
#header > h1 {width: 500px; margin: 40px auto 0; height: 58px; font-weight: normal; text-align: center; font-size: 20px; display: block; line-height: 58px; position: relative; left: -30px;}
#basic {left: 25px; top: 128px; width: 366px; height: 283px;}
#basic > header {margin-top: 7px; line-height: 24px; font-size: 14px; padding: 0 8px;}
#basic > ul {margin: 16px 36px 0 32px; padding: 0;}
#basic > ul > li {line-height: 40px; height: 46px; padding-left: 23px; position: relative; margin-bottom: 10px;}
#basic > ul > li > strong {position: absolute; right: 18px; top: 2px; font-size: 20px;}
#projectsSummary {left: 405px; top: 132px; width: 400px; height: 280px;}
#projectsSummary > header {margin-top: 22px; margin-left: 12px; line-height: 24px; font-size: 14px; padding: 0 8px;}
#projectsSummary > .progress-pie {margin: 15px 0 0 15px;}
#projectsSummary > .progress-pie .progress-info {padding: 80px 0;}
#projectsSummary > .progress-pie .progress-info > strong {font-size: 30px; font-weight: normal;}
#projectsSummary > ul {position: absolute; left: 240px; top: 80px; padding: 0; font-size: 14px;}
#projectsSummary > ul > li {padding-left: 25px; line-height: 20px; position: relative; color: #A0A0A0; margin-bottom: 15px;}
#projectsSummary > ul > li > .dot {position: absolute; width: 16px; height: 16px; left: 0; top: 2px; background: #00A0E9; border-radius: 2px;}
#projectsSummary > ul > li:first-child > .dot {background: #0068B7;}
#projectsSummary > ul > li:last-child > .dot {background: #7ECEF4;}
#projectsSummary > ul > li > div {margin-top: 5px; color: #fff; max-width: 80px;}
#projectsSummary > ul > li > div > span:last-child {float: right;}
#projectsList {left: 825px; top: 129px; width: 421px; height: 284px; padding: 8px 0 8px 8px;}
#projectsTableHeader {position: absolute; top: 8px; left: 8px; right: 10px; background: #0075A9; width: 401px;}
#projectsTableHeader > thead > tr > th {color: #fff; font-weight: normal; line-height: 20px; padding: 2px 4px; border: none}
#projectsList > .table-wrapper {overflow: auto; margin-top: 26px; max-height: 247px;}
#projectsTable {color: #A0A0A0;}
#projectsTable > tbody > tr > td {border-bottom: 1px #0075A9 dashed; line-height: 20px; padding: 5px 4px;}
#projectsList .col-name {width: 170px;}
#projectsList .col-storyCount {width: 80px; text-align: center;}
#projectsList .col-taskCount {width: 80px; text-align: center;}
#projectsList .col-bugCount {text-align: center;}