252 lines
17 KiB
HTML
252 lines
17 KiB
HTML
{% extends 'base.html' %}
|
||
|
||
{% load static tags %}
|
||
|
||
{% block content %}
|
||
{% if error %}
|
||
<div class="pcoded-main-container mt-4">
|
||
{% include 'error_page.html' %}
|
||
</div>
|
||
{% else %}
|
||
<div class="pcoded-main-container">
|
||
<div class="pcoded-wrapper">
|
||
<div class="pcoded-content">
|
||
<div class="pcoded-inner-content">
|
||
<div class="main-body">
|
||
<div class="page-wrapper">
|
||
<!-- [ breadcrumb ] start -->
|
||
<div class="page-header">
|
||
<div class="page-block">
|
||
<div class="row align-items-center">
|
||
<div class="col-md-12">
|
||
<div class="page-header-title">
|
||
<h5 class="m-b-10">个人中心</h5>
|
||
</div>
|
||
<ul class="breadcrumb">
|
||
<li class="breadcrumb-item"><a href="index.html"><i
|
||
class="feather icon-home"></i></a></li>
|
||
<li class="breadcrumb-item"><a href="#!">个人中心</a></li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- [ breadcrumb ] end -->
|
||
|
||
<!-- [ Main Content ] start -->
|
||
<div class="row">
|
||
<div class="col-md-4 mb-4">
|
||
<div class="card statustic-card h-100">
|
||
<div class="card-body text-center">
|
||
<h3>{{ name }}</h3>
|
||
<p>{{ postion }}</p>
|
||
<div class="row mt-5">
|
||
<div class="col text-center">
|
||
<h4>{{ on_duty_days }}天</h4>
|
||
<span>{{ status }}</span>
|
||
</div>
|
||
<div class="col text-center">
|
||
<h4>{{ used_annual_leave }}天</h4>
|
||
<span>已用年假</span>
|
||
</div>
|
||
<div class="col text-center">
|
||
<h4>{{ remaining_annual_leave }}天</h4>
|
||
<span>剩余年假</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="col-md-4 mb-4">
|
||
<div class="card statustic-card h-100">
|
||
<div class="card-header borderless pb-0">
|
||
<h5>我的业绩目标</h5>
|
||
</div>
|
||
<div class="card-body text-center">
|
||
<span class="d-block text-c-blue f-36">{{ completion_rate }}</span>
|
||
<p class="m-b-0">业绩目标完成率</p>
|
||
<div class="progress">
|
||
<div class="progress-bar bg-c-blue"
|
||
style="width: {{ total_completed_amount }}"></div>
|
||
</div>
|
||
</div>
|
||
<div class="card-footer bg-c-blue border-0">
|
||
<h6 class="text-white m-b-0">
|
||
本年已完成项目收入: {{ total_completed_amount }}元</h6>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="col-md-4 mb-4">
|
||
<div class="card statustic-card h-100">
|
||
<div class="card-header borderless pb-0">
|
||
<h5>我的项目</h5>
|
||
</div>
|
||
<div class="card-body text-center">
|
||
<span class="d-block text-c-green f-36">{{ ongoing_project_count }}个</span>
|
||
<p class="m-b-0">正在进行的项目数量</p>
|
||
<div class="progress">
|
||
<div class="progress-bar bg-c-green"
|
||
style="width:{{ project_completion_rate }}"></div>
|
||
</div>
|
||
</div>
|
||
<div class="card-footer bg-c-green border-0">
|
||
<h6 class="text-white m-b-0">
|
||
今年已完成的项目数量: {{ completed_project_count }}个</h6>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="row d-flex align-items-stretch">
|
||
<div class="col-xl-4 col-md-6">
|
||
<div class="card latest-update-card update-card h-100">
|
||
<div class="card-header">
|
||
<h5>系统通知</h5>
|
||
</div>
|
||
<div class="new-scroll" style="height:350px;position:relative;">
|
||
<div class="card-body">
|
||
<div class="latest-update-box">
|
||
|
||
<div class="row p-t-20 p-b-30">
|
||
<div class="col-auto text-end update-meta">
|
||
<i class="feather icon-bell bg-c-blue update-icon"></i>
|
||
</div>
|
||
<div class="col p-l-5">
|
||
<a href="#!">
|
||
<h6 class="m-0">端午节放假通知</h6>
|
||
</a>
|
||
<p class="m-b-0">2024/06/07 11:40 AM</p>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="row p-b-30">
|
||
<div class="col-auto text-end update-meta">
|
||
<i class="feather icon-bell bg-c-blue update-icon"></i>
|
||
</div>
|
||
<div class="col p-l-5">
|
||
<a href="#!">
|
||
<h6 class="m-0">儿童节活动通知</h6>
|
||
</a>
|
||
<p class="m-b-0">2024/06/01 11:40 AM</p>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="row p-b-30">
|
||
<div class="col-auto text-end update-meta">
|
||
<i class="feather icon-file f-w-600 bg-c-yellow update-icon"></i>
|
||
</div>
|
||
<div class="col p-l-5">
|
||
<a href="#!">
|
||
<h6 class="m-0">更新报销明细</h6>
|
||
</a>
|
||
<p class="m-b-0">2024/05/27 9:00 AM</p>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="row p-b-30">
|
||
<div class="col-auto text-end update-meta">
|
||
<i class="feather icon-file bg-c-yellow update-icon"></i>
|
||
</div>
|
||
<div class="col p-l-5">
|
||
<a href="#!">
|
||
<h6 class="m-0">上传发票通知</h6>
|
||
</a>
|
||
<p class="m-b-0">2024/05/25 9:00 AM</p>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="row p-b-30">
|
||
<div class="col-auto text-end update-meta">
|
||
<i class="feather icon-check-circle f-w-600 bg-c-green update-icon"></i>
|
||
</div>
|
||
<div class="col p-l-5">
|
||
<a href="#!">
|
||
<h6 class="m-0">外贸出口项目完成</h6>
|
||
</a>
|
||
<p class="m-b-0">2024/4/28 9:00 AM</p>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="row">
|
||
<div class="col-auto text-end update-meta">
|
||
<i class="feather icon-alert-triangle f-w-600 bg-c-red update-icon"></i>
|
||
</div>
|
||
<div class="col p-l-5">
|
||
<a href="#!">
|
||
<h6 class="m-0">库存不足提醒</h6>
|
||
</a>
|
||
<p class="m-b-0">2024/4/28 9:00 AM</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="col-xl-8 col-md-6">
|
||
<div class="card user-list table-card h-100">
|
||
<div class="card-header">
|
||
<h5>项目协作动态</h5>
|
||
</div>
|
||
<div class="card-body pb-0">
|
||
<div class="table-responsive">
|
||
<div class="user-scroll ps ps--active-y"
|
||
style="height:430px;position:relative;">
|
||
<table class="table table-hover m-0">
|
||
<thead>
|
||
<tr>
|
||
<th>姓名</th>
|
||
<th>操作/项目</th>
|
||
<th>时间</th>
|
||
</tr>
|
||
</thead>
|
||
<tbody>
|
||
<tr>
|
||
<td>张三</td>
|
||
<td>
|
||
<h6 class="mb-1"><span
|
||
class="text-c-green">新增项目</span>：
|
||
老挝贸易项目
|
||
</h6>
|
||
</td>
|
||
<td>2024/06/01 11:40 AM</td>
|
||
</tr>
|
||
</tbody>
|
||
</table>
|
||
<div class="ps__rail-x" style="left: 0px; bottom: 0px;">
|
||
<div class="ps__thumb-x" tabindex="0"
|
||
style="left: 0px; width: 0px;"></div>
|
||
</div>
|
||
<div class="ps__rail-y"
|
||
style="top: 0px; height: 430px; right: 0px;">
|
||
<div class="ps__thumb-y" tabindex="0"
|
||
style="top: 0px; height: 351px;"></div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
</div>
|
||
<!-- [ Main Content ] end -->
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
{% endif %}
|
||
<style>
|
||
.statustic-card {
|
||
display: flex;
|
||
flex-direction: column;
|
||
justify-content: space-between;
|
||
}
|
||
|
||
.h-100 {
|
||
height: 100%;
|
||
}
|
||
</style>
|
||
{% endblock %} |