* update report/annualdata view.
This commit is contained in:
@@ -0,0 +1,43 @@
|
||||
|
||||
#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: 23px; margin-left: 12px; line-height: 24px; font-size: 14px; padding: 0 8px;}
|
||||
#projectsSummary > .progress-pie {margin: 18px 0 0 18px;}
|
||||
#projectsSummary > .progress-pie .progress-info {padding: 70px 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;}
|
||||
|
||||
@@ -28,6 +28,16 @@ function showAnnualData(data)
|
||||
].join(''));
|
||||
});
|
||||
$('#projectsTable').empty().append($projectsTableRows);
|
||||
|
||||
var $projectsSummaryChart = $('#projectsSummaryChart');
|
||||
var pieChart = $projectsSummaryChart.data('pieChart');
|
||||
while(pieChart.segments.length) pieChart.removeData();
|
||||
var pieChartLabels = $projectsSummaryChart.data('labels').split(',');
|
||||
var pieChartColors = ['#0068B7', '#1aa1e6', '#81cef2'];
|
||||
$.each(['finishProjects', 'activateProjects', 'suspendProjects'], function(index, name)
|
||||
{
|
||||
pieChart.addData({color: pieChartColors[index], name: pieChartLabels[index], value: data[name]});
|
||||
});
|
||||
}
|
||||
|
||||
$(function()
|
||||
|
||||
@@ -15,8 +15,8 @@
|
||||
</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 id='projectsSummaryChart' class='progress-pie inline-block space progress-pie-200' data-value='100' data-doughnut-size='70' data-color='#186bb1' data-back-color='#84cff0' data-labels='已完成的项目,正在进行的项目,已挂起的项目' data-show-tip='true'>
|
||||
<canvas width='180' height='180' style='width: 180px; height: 180px;'></canvas>
|
||||
<div class='progress-info'>
|
||||
<strong class='text-holder' data-id='totalProjectsCount'>28</strong>
|
||||
</div>
|
||||
@@ -126,7 +126,7 @@ var annualData =
|
||||
finishBugCountPri4: 34,
|
||||
|
||||
// 年度解决任务累计工时
|
||||
yearlyBugHours: [110, 154, 184, 220, 212, 250, 130, 146, 201, 89, 140, 59]
|
||||
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]
|
||||
};
|
||||
@@ -134,7 +134,6 @@ var annualData =
|
||||
// 显示年度数据
|
||||
$(function()
|
||||
{
|
||||
//
|
||||
showAnnualData(annualData);
|
||||
});
|
||||
</script>
|
||||
|
||||
+5
-5
File diff suppressed because one or more lines are too long
@@ -54,46 +54,3 @@ 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;}
|
||||
|
||||
Reference in New Issue
Block a user