mirror of https://github.com/raiots/TasksManager
455 lines
21 KiB
HTML
455 lines
21 KiB
HTML
{% extends 'tasks/base.html' %}
|
|
{% load static %}
|
|
|
|
{% block main_content %}
|
|
<div class="content-wrapper" style="min-height: 1200.88px;">
|
|
<!-- Content Header (Page header) -->
|
|
<section class="content-header">
|
|
<div class="container-fluid">
|
|
<div class="row mb-2">
|
|
<div class="col-sm-6">
|
|
<h1>总览 ({{ date }}) </h1>
|
|
<h1><font color="#FF0000">测试版，请勿用于生产环境！！！</font></h1>
|
|
</div>
|
|
<div class="col-sm-6">
|
|
{# <ol class="breadcrumb float-sm-right">#}
|
|
{# <li class="breadcrumb-item active"><a href="#">主页</a></li>#}
|
|
{# </ol>#}
|
|
<br>
|
|
{% load taskfilter %}
|
|
<ul class="pagination float-md-right">
|
|
<li class="page-item"><a class="page-link" href="/{{ date|last_month }}">«</a></li>
|
|
<li class="page-item"><a class="page-link"> {{ date|this_month }}月 </a></li>
|
|
<li class="page-item"><a class="page-link" href="/{{ date|next_month }}">»</a></li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div><!-- /.container-fluid -->
|
|
</section>
|
|
|
|
<!-- Main content -->
|
|
<section class="content">
|
|
<div class="container-fluid">
|
|
<div class="row">
|
|
<div class="col">
|
|
<div class="info-box">
|
|
<span class="info-box-icon bg-danger elevation-1"><i class="fas fa-tasks"></i></span>
|
|
<div class="info-box-content">
|
|
<span class="info-box-text">部门总任务数</span>
|
|
<span class="info-box-number">
|
|
{{ department_cal.depart_count|floatformat:'0'|default_if_none:'0' }}
|
|
<small>个</small>
|
|
</span>
|
|
</div>
|
|
<!-- /.info-box-content -->
|
|
</div>
|
|
<!-- /.info-box -->
|
|
</div>
|
|
<!-- /.col -->
|
|
<div class="col">
|
|
<div class="info-box mb-3">
|
|
<div class="info-box-content">
|
|
<span class="info-box-text">部门预计总工作量</span>
|
|
<span class="info-box-number">
|
|
{{ department_cal.pre_cal|default_if_none:'0'|floatformat:'1' }}
|
|
<small></small>
|
|
</span>
|
|
</div>
|
|
<!-- /.info-box-content -->
|
|
</div>
|
|
<!-- /.info-box -->
|
|
</div>
|
|
<!-- /.col -->
|
|
<div class="col">
|
|
<div class="info-box mb-3">
|
|
<div class="info-box-content">
|
|
<span class="info-box-text">部门实际总工作量</span>
|
|
<span class="info-box-number">
|
|
{{ department_cal.real_cal|default_if_none:'0'|floatformat:'1' }}
|
|
<small></small>
|
|
</span>
|
|
</div>
|
|
|
|
<!-- /.info-box-content -->
|
|
</div>
|
|
<!-- /.info-box -->
|
|
</div>
|
|
<!-- /.col -->
|
|
<div class="col">
|
|
<div class="info-box mb-3">
|
|
<div class="info-box-content">
|
|
<span class="info-box-text">部门预计平均工作量</span>
|
|
<span class="info-box-number">
|
|
{{ department_cal.pre_avg|default_if_none:'0'|floatformat:'1' }}
|
|
<small></small>
|
|
</span>
|
|
</div>
|
|
<!-- /.info-box-content -->
|
|
</div>
|
|
<!-- /.info-box -->
|
|
</div>
|
|
<!-- /.col -->
|
|
<div class="col">
|
|
<div class="info-box mb-3">
|
|
<div class="info-box-content">
|
|
<span class="info-box-text">部门实际平均工作量</span>
|
|
<span class="info-box-number">
|
|
{{ department_cal.real_avg|default_if_none:'0'|floatformat:'1' }}
|
|
<small></small>
|
|
</span>
|
|
</div>
|
|
|
|
<!-- /.info-box-content -->
|
|
</div>
|
|
<!-- /.info-box -->
|
|
</div>
|
|
<!-- /.col -->
|
|
|
|
<!-- fix for small devices only -->
|
|
<div class="clearfix hidden-md-up"></div>
|
|
|
|
{# <div class="col-12 col-sm-6 col-md-3">#}
|
|
{# <div class="info-box mb-3">#}
|
|
{# <span class="info-box-icon bg-success elevation-1"><i class="fas fa-shopping-cart"></i></span>#}
|
|
{##}
|
|
{# <div class="info-box-content">#}
|
|
{# <span class="info-box-text">Sales</span>#}
|
|
{# <span class="info-box-number">760</span>#}
|
|
{# </div>#}
|
|
{# <!-- /.info-box-content -->#}
|
|
{# </div>#}
|
|
{# <!-- /.info-box -->#}
|
|
{# </div>#}
|
|
{# <!-- /.col -->#}
|
|
{# <div class="col-12 col-sm-6 col-md-3">#}
|
|
{# <div class="info-box mb-3">#}
|
|
{# <span class="info-box-icon bg-warning elevation-1"><i class="fas fa-users"></i></span>#}
|
|
{##}
|
|
{# <div class="info-box-content">#}
|
|
{# <span class="info-box-text">New Members</span>#}
|
|
{# <span class="info-box-number">2,000</span>#}
|
|
{# </div>#}
|
|
{# <!-- /.info-box-content -->#}
|
|
{# </div>#}
|
|
{# <!-- /.info-box -->#}
|
|
{# </div>#}
|
|
<!-- /.col -->
|
|
</div>
|
|
<div class="row">
|
|
<div class="col">
|
|
<div class="info-box">
|
|
<span class="info-box-icon bg-info elevation-1"><i class="fas fa-tasks"></i></span>
|
|
|
|
<div class="info-box-content">
|
|
<span class="info-box-text"><b>个人任务数据统计:</b></span>
|
|
{# <span class="info-box-number">#}
|
|
{# {% for user in current_user %}{{ user.main_executor_count }}{% endfor %}#}
|
|
{# <small>个</small>#}
|
|
{# </span>#}
|
|
</div>
|
|
<!-- /.info-box-content -->
|
|
</div>
|
|
<!-- /.info-box -->
|
|
</div>
|
|
<div class="col">
|
|
<div class="info-box">
|
|
{# <span class="info-box-icon bg-info elevation-1"><i class="fas fa-tasks"></i></span>#}
|
|
|
|
<div class="info-box-content">
|
|
<span class="info-box-text">承办任务数</span>
|
|
<span class="info-box-number">
|
|
{{ current_user.main_count }}
|
|
<small>个</small>
|
|
</span>
|
|
</div>
|
|
<!-- /.info-box-content -->
|
|
</div>
|
|
<!-- /.info-box -->
|
|
</div>
|
|
<!-- /.col -->
|
|
<div class="col">
|
|
<div class="info-box mb-3">
|
|
{# <span class="info-box-icon bg-danger elevation-1"><i class="fas fa-tasks"></i></span>#}
|
|
|
|
<div class="info-box-content">
|
|
<span class="info-box-text">协办任务数</span>
|
|
<span class="info-box-number">
|
|
{{ current_user.sub_count }}
|
|
<small>个</small>
|
|
</span>
|
|
</div>
|
|
<!-- /.info-box-content -->
|
|
</div>
|
|
<!-- /.info-box -->
|
|
</div>
|
|
<!-- /.col -->
|
|
<div class="col">
|
|
<div class="info-box mb-3">
|
|
<div class="info-box-content">
|
|
<span class="info-box-text">预计工作量</span>
|
|
<span class="info-box-number">
|
|
{{ current_user.pre_cal|floatformat:'1'|default_if_none:'0' }}
|
|
<small></small>
|
|
</span>
|
|
</div>
|
|
<!-- /.info-box-content -->
|
|
</div>
|
|
<!-- /.info-box -->
|
|
</div>
|
|
<!-- /.col -->
|
|
<div class="col">
|
|
<div class="info-box mb-3">
|
|
<div class="info-box-content">
|
|
<span class="info-box-text">实际工作量</span>
|
|
<span class="info-box-number">
|
|
{{ current_user.real_cal|floatformat:'1'|default_if_none:'0' }}
|
|
<small></small>
|
|
</span>
|
|
</div>
|
|
<!-- /.info-box-content -->
|
|
</div>
|
|
<!-- /.info-box -->
|
|
</div>
|
|
<!-- /.col -->
|
|
|
|
<!-- fix for small devices only -->
|
|
<div class="clearfix hidden-md-up"></div>
|
|
|
|
{# <div class="col-12 col-sm-6 col-md-3">#}
|
|
{# <div class="info-box mb-3">#}
|
|
{# <span class="info-box-icon bg-success elevation-1"><i class="fas fa-shopping-cart"></i></span>#}
|
|
{##}
|
|
{# <div class="info-box-content">#}
|
|
{# <span class="info-box-text">Sales</span>#}
|
|
{# <span class="info-box-number">760</span>#}
|
|
{# </div>#}
|
|
{# <!-- /.info-box-content -->#}
|
|
{# </div>#}
|
|
{# <!-- /.info-box -->#}
|
|
{# </div>#}
|
|
{# <!-- /.col -->#}
|
|
{# <div class="col-12 col-sm-6 col-md-3">#}
|
|
{# <div class="info-box mb-3">#}
|
|
{# <span class="info-box-icon bg-warning elevation-1"><i class="fas fa-users"></i></span>#}
|
|
{##}
|
|
{# <div class="info-box-content">#}
|
|
{# <span class="info-box-text">New Members</span>#}
|
|
{# <span class="info-box-number">2,000</span>#}
|
|
{# </div>#}
|
|
{# <!-- /.info-box-content -->#}
|
|
{# </div>#}
|
|
{# <!-- /.info-box -->#}
|
|
{# </div>#}
|
|
<!-- /.col -->
|
|
</div>
|
|
<div class="row">
|
|
<div class="col-md-12">
|
|
<!-- BAR CHART -->
|
|
<div class="card card-gray">
|
|
<div class="card-header">
|
|
<h3 class="card-title">本部门工作统计表</h3>
|
|
|
|
<div class="card-tools">
|
|
<button type="button" class="btn btn-tool" data-card-widget="collapse"><i
|
|
class="fas fa-minus"></i>
|
|
</button>
|
|
<button type="button" class="btn btn-tool" data-card-widget="remove"><i
|
|
class="fas fa-times"></i></button>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 工作统计表格 -->
|
|
<div class="card-body">
|
|
<div class="chart">
|
|
<div class="chartjs-size-monitor">
|
|
<div class="chartjs-size-monitor-expand">
|
|
<div class=""></div>
|
|
</div>
|
|
<div class="chartjs-size-monitor-shrink">
|
|
<div class=""></div>
|
|
</div>
|
|
</div>
|
|
<canvas id="barChart"
|
|
style="height: 230px; min-height: 230px; display: block; width: 764px;"
|
|
width="764" height="230" class="chartjs-render-monitor"></canvas>
|
|
</div>
|
|
</div>
|
|
<!-- /.card-body -->
|
|
</div>
|
|
<!-- /.card -->
|
|
</div>
|
|
<!-- /.col (MAIN) -->
|
|
</div>
|
|
<!-- /.row -->
|
|
<div class="row">
|
|
<div class="col-12">
|
|
<div class="card">
|
|
<div class="card-header">
|
|
<h3 class="card-title">部门工作统计表</h3>
|
|
</div>
|
|
{# TODO 更换为绩效考核表 分季度按人显示工作量及完成质量#}
|
|
<!-- /.card-header -->
|
|
<div class="card-body">
|
|
<div id="example2_wrapper" class="dataTables_wrapper dt-bootstrap4"><div class="row"><div class="col-sm-12 col-md-6"></div><div class="col-sm-12 col-md-6"></div></div><div class="row"><div class="col-sm-12"><table id="example2" class="table table-bordered table-hover dataTable" role="grid" aria-describedby="example2_info">
|
|
<thead>
|
|
<tr role="row">
|
|
<th class="sorting_asc" tabindex="0" aria-controls="example2" rowspan="2" colspan="1" aria-sort="ascending" aria-label="Rendering engine: activate to sort column descending">姓名</th>
|
|
<th class="sorting" tabindex="0" aria-controls="example2" rowspan="1" colspan="2" style="text-align: center">一季度</th>
|
|
<th class="sorting" tabindex="0" aria-controls="example2" rowspan="1" colspan="2" style="text-align: center">二季度</th>
|
|
<th class="sorting" tabindex="0" aria-controls="example2" rowspan="1" colspan="2" style="text-align: center">三季度</th>
|
|
<th class="sorting" tabindex="0" aria-controls="example2" rowspan="1" colspan="2" style="text-align: center">四季度</th>
|
|
</tr>
|
|
<tr role="row">
|
|
<th>实际工作量</th>
|
|
<th>完成质量</th>
|
|
<th>实际工作量</th>
|
|
<th>完成质量</th>
|
|
<th>实际工作量</th>
|
|
<th>完成质量</th>
|
|
<th>实际工作量</th>
|
|
<th>完成质量</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
{% for user in stat.values %}
|
|
<tr role="row" class="odd">
|
|
<td class="sorting_1">{{ user.real_name }}</td>
|
|
<td>{{ user.real_cal_1|default_if_none:'0'|floatformat:'1' }}</td>
|
|
<td>{{ user.quality_1|default_if_none:'0'|floatformat:'1' }}</td>
|
|
<td>{{ user.real_cal_2|default_if_none:'0'|floatformat:'1' }}</td>
|
|
<td>{{ user.quality_2|default_if_none:'0'|floatformat:'1' }}</td>
|
|
<td>{{ user.real_cal_3|default_if_none:'0'|floatformat:'1' }}</td>
|
|
<td>{{ user.quality_3|default_if_none:'0'|floatformat:'1' }}</td>
|
|
<td>{{ user.real_cal_4|default_if_none:'0'|floatformat:'1' }}</td>
|
|
<td>{{ user.quality_4|default_if_none:'0'|floatformat:'1' }}</td>
|
|
</tr>
|
|
{% endfor %}
|
|
</tbody>
|
|
{# <tfoot>#}
|
|
{# <tr><th rowspan="1" colspan="1">Rendering engine</th><th rowspan="1" colspan="1">Browser</th><th rowspan="1" colspan="1">Platform(s)</th><th rowspan="1" colspan="1">Engine version</th><th rowspan="1" colspan="1">CSS grade</th></tr>#}
|
|
{# </tfoot>#}
|
|
</table></div></div>
|
|
</div>
|
|
</div>
|
|
<!-- /.card-body -->
|
|
</div>
|
|
<!-- /.card -->
|
|
</div>
|
|
<!-- /.col -->
|
|
</div>
|
|
|
|
</div><!-- /.container-fluid -->
|
|
</section>
|
|
<!-- /.content -->
|
|
</div>
|
|
|
|
{# <div class="content-wrapper">#}
|
|
{# {{ main_points }}#}
|
|
{# <br>#}
|
|
{# {{ sub_points }}#}
|
|
{# <br>#}
|
|
{# {{ points }}#}
|
|
{# {{ points.3.credit }}#}
|
|
{# {% for point in points.values %}'{{ point }}', {% endfor %}#}
|
|
{# {% for point in points %}#}
|
|
{# {{ point }}#}
|
|
{# {% endfor %}#}
|
|
{##}
|
|
{# {% for user in users %}#}
|
|
{# {{ user }}#}
|
|
{# {{ user.get_predict_work_count.total_predict_work }}#}
|
|
{# {{ user.get_total_point }}#}
|
|
{# {{ user.main_executor.count }}#}
|
|
{# {% for todo in user.main_executor.all %}#}
|
|
{# {{ todo }}#}
|
|
{# {{ todo.points }}#}
|
|
{# {% endfor %}#}
|
|
{# </br>#}
|
|
{# {% endfor %}#}
|
|
{##}
|
|
{# </div>#}
|
|
{% endblock %}
|
|
|
|
{% block script %}
|
|
<!-- ChartJS -->
|
|
<script src="{% static 'tasks/plugins/chart.js/Chart.min.js' %}"></script>
|
|
<script>
|
|
$(function () {
|
|
/* ChartJS
|
|
* -------
|
|
* Here we will create a few charts using ChartJS
|
|
*/
|
|
var areaChartData = {
|
|
labels : [{% for user in users_data.values %}'{{ user.real_name }}', {% endfor %}],
|
|
datasets: [
|
|
{
|
|
label : '协办任务',
|
|
backgroundColor : 'rgba(114,140,212,1)',
|
|
borderColor : 'rgba(114,140,212,1)',
|
|
pointRadius : false,
|
|
pointColor : 'rgba(114,140,212,1)',
|
|
pointStrokeColor : '#c1c7d1',
|
|
pointHighlightFill : '#fff',
|
|
pointHighlightStroke: 'rgba(220,220,220,1)',
|
|
data : [{% for user in users_data.values %}'{{ user.sub_count }}', {% endfor %}]
|
|
},
|
|
{
|
|
label : '承办任务',
|
|
backgroundColor : 'rgba(23,162,184,0.9)',
|
|
borderColor : 'rgba(100,98,204,0.8)',
|
|
pointRadius : false,
|
|
pointColor : '#3b8bba',
|
|
pointStrokeColor : 'rgba(60,141,188,1)',
|
|
pointHighlightFill : '#fff',
|
|
pointHighlightStroke: 'rgba(60,141,188,1)',
|
|
data : [{% for user in users_data.values %}'{{ user.main_count }}', {% endfor %}]
|
|
},
|
|
{
|
|
label : '预计工作量',
|
|
backgroundColor : 'rgba(210, 214, 222,1)',
|
|
borderColor : 'rgba(210, 214, 222,1)',
|
|
pointRadius : false,
|
|
pointColor : '#3b8bba',
|
|
pointStrokeColor : 'rgba(60,141,188,1)',
|
|
pointHighlightFill : '#fff',
|
|
pointHighlightStroke: 'rgba(60,141,188,1)',
|
|
data : [{% for user in users_data.values %}'{{ user.pre_cal|floatformat:'1' }}', {% endfor %}]
|
|
},
|
|
{
|
|
label : '工作量',
|
|
backgroundColor : 'rgba(253,199,101,0.9)',
|
|
borderColor : 'rgba(253,199,101,0.8)',
|
|
pointRadius : false,
|
|
pointColor : '#3b8bba',
|
|
pointStrokeColor : 'rgba(60,141,188,1)',
|
|
pointHighlightFill : '#fff',
|
|
pointHighlightStroke: 'rgba(60,141,188,1)',
|
|
data : [{% for user in users_data.values %}'{{ user.real_cal|floatformat:'1' }}', {% endfor %}]
|
|
},
|
|
]
|
|
}
|
|
//-------------
|
|
//- BAR CHART -
|
|
//-------------
|
|
var barChartCanvas = $('#barChart').get(0).getContext('2d')
|
|
var barChartData = jQuery.extend(true, {}, areaChartData)
|
|
var temp0 = areaChartData.datasets[0]
|
|
var temp1 = areaChartData.datasets[1]
|
|
barChartData.datasets[0] = temp1
|
|
barChartData.datasets[1] = temp0
|
|
|
|
var barChartOptions = {
|
|
responsive : true,
|
|
maintainAspectRatio : false,
|
|
datasetFill : false
|
|
}
|
|
|
|
var barChart = new Chart(barChartCanvas, {
|
|
type: 'bar',
|
|
data: barChartData,
|
|
options: barChartOptions
|
|
})
|
|
|
|
})
|
|
</script>
|
|
{% endblock %} |