split frontend from project and Implement ci/cd
This commit is contained in:
@@ -1,503 +0,0 @@
|
||||
{{-- {{dd($data)}} --}}
|
||||
<html lang="en">
|
||||
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||
<meta http-equiv="x-ua-compatible" content="ie=edge" />
|
||||
<link rel="icon" href="../../dist/images/fav.ico" type="image/ico" sizes="16x16" />
|
||||
<title>خروجی به PDF</title>
|
||||
<link rel="stylesheet" href="{{ asset('dist/css/adminlte.css') }}" />
|
||||
<link rel="stylesheet" href="{{ asset('dist/css/fontiran.css') }}" />
|
||||
<link rel="stylesheet" href="{{ asset('plugins/fontawesome-free/css/all.min.css') }}" />
|
||||
<!-- <link rel="stylesheet" href="{{ asset('plugins/chart.js/Chart.min.css') }}" /> -->
|
||||
|
||||
<script></script>
|
||||
<link rel="stylesheet" media="screen" href="">
|
||||
<style>
|
||||
* {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
box-sizing: border-box;
|
||||
direction: rtl;
|
||||
}
|
||||
|
||||
table tbody td {
|
||||
text-align: center;
|
||||
font-size: 13px;
|
||||
}
|
||||
|
||||
.header img {
|
||||
width: 30px;
|
||||
}
|
||||
|
||||
.table thead th {
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
table tr th {
|
||||
text-align: center;
|
||||
background-color: #fbe4d5;
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.tr-color-subheader th {
|
||||
background-color: #fbe4d5 !important;
|
||||
}
|
||||
|
||||
.head-bckchanger {
|
||||
text-align: center;
|
||||
background-color: #fbe4d5;
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
table tr:first-child th {
|
||||
background-color: #9cc2e5;
|
||||
}
|
||||
|
||||
.instead_bcolor {
|
||||
background-color: #9cc2e5;
|
||||
}
|
||||
|
||||
.background-changer {
|
||||
background-color: #fff !important;
|
||||
}
|
||||
|
||||
table td {
|
||||
text-align: center;
|
||||
background-color: #fff;
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.pro-span {
|
||||
color: #fdc07a;
|
||||
}
|
||||
|
||||
.header {
|
||||
display: flex;
|
||||
border-bottom: 2px solid #000;
|
||||
justify-content: space-around;
|
||||
align-items: center;
|
||||
margin-top: 10px;
|
||||
padding-bottom: 10px;
|
||||
}
|
||||
|
||||
.body {
|
||||
margin-top: 10px;
|
||||
border: 1px solid #000;
|
||||
overflow-x: auto;
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
.body-header-text {
|
||||
margin-bottom: 10px;
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
.all-tables {
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
.none-border {
|
||||
margin-bottom: 10px;
|
||||
border-bottom: none !important;
|
||||
}
|
||||
|
||||
.print-width {
|
||||
max-width: 900px;
|
||||
}
|
||||
|
||||
.img-front-header {
|
||||
width: 40px !important;
|
||||
height: 40px !important;
|
||||
margin-left: 20px;
|
||||
}
|
||||
|
||||
.h6-yellow {
|
||||
color: #fdc07a;
|
||||
}
|
||||
|
||||
.border-bottom-cleaner {
|
||||
border-bottom: 0px !important;
|
||||
}
|
||||
|
||||
.border-top-cleaner {
|
||||
border-top: 0px !important;
|
||||
}
|
||||
|
||||
.background-changer img {
|
||||
max-width: 100% !important;
|
||||
height: 600px !important;
|
||||
}
|
||||
|
||||
.tr-color-subheader th {
|
||||
background-color: #fbe4d5 !important;
|
||||
}
|
||||
|
||||
@media print {
|
||||
.print-none {
|
||||
display: none;
|
||||
}
|
||||
|
||||
body {
|
||||
-webkit-print-color-adjust: exact;
|
||||
}
|
||||
|
||||
table tr:first-child th {
|
||||
background-color: #9cc2e5 !important;
|
||||
}
|
||||
|
||||
.page-print-break {
|
||||
page-break-before: always;
|
||||
}
|
||||
|
||||
.pagebreak {
|
||||
page-break-before: always;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.image_header {
|
||||
width: 40px;
|
||||
}
|
||||
|
||||
.header-font {
|
||||
font-size: 15px;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.date_font {
|
||||
font-size: 15px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div class="print-none">
|
||||
<div class="d-flex justify-content-center mt-3 mb-3">
|
||||
<button class="btn btn-primary" onclick="showPrintPDF()">پرینت</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="container print-width" id="printablePart">
|
||||
<div class="row">
|
||||
<div class="col"><img src="{{ asset('word-icons/logo.svg') }}" alt=""><img class="image_header"
|
||||
src="{{ asset('word-icons/rahdari.png') }}" alt=""></div>
|
||||
<div class="col text-center">
|
||||
<p class="header-font"> گزارش عملکرد کاربران گروه <span>"{{ $data['group_name'] }}"</span></p>
|
||||
<p class="font-weight-bold date_font">(از تاریخ : <span
|
||||
class="date-from font-weight-light ml-3"></span>تا تاریخ:
|
||||
<span class="date-to font-weight-light"></span>)
|
||||
</p>
|
||||
</div>
|
||||
<div class="col"></div>
|
||||
|
||||
</div>
|
||||
<div class="body">
|
||||
<div class="d-flex flex-column justify-content-center align-items-center">
|
||||
<div class="d-flex w-100 pl-2 pr-2" style="background-color: #9cc2e5;justify-content: space-around;">
|
||||
<h6 class="col-2 pt-2 pb-2 text-center">مجموع فعالیت<br><small>(ساعت)</small></h6>
|
||||
<h6 class="col-2 pt-2 pb-2 text-center">تعداد فعالیت</h6>
|
||||
<h6 class="col-2 pt-2 pb-2 text-center">تعداد کاربران گروه</h6>
|
||||
<h6 class="col-2 pt-2 pb-2 text-center">تعداد کاربران فعال</h6>
|
||||
<h6 class="col-2 pt-2 pb-2 text-center">شاخص فعالیت<br><small>(تعداد کاربران/ساعت)</small></h6>
|
||||
</div>
|
||||
<div class="d-flex w-100 pl-2 pr-2" style="background-color: #fbe4d5;justify-content: space-around;">
|
||||
<p class="col-2 pt-2 m-0 pb-2 text-center">{{ $data['total_activity_time'] ?? 0 }}</p>
|
||||
<p class="col-2 pt-2 m-0 pb-2 text-center">{{ $data['total_activity_quantity'] }}</p>
|
||||
<p class="col-2 pt-2 m-0 pb-2 text-center">{{ $data['total_user_count'] }}</p>
|
||||
<p class="col-2 pt-2 m-0 pb-2 text-center">{{ $data['active_user_count'] }}</p>
|
||||
<p class="col-2 pt-2 m-0 pb-2 text-center">{{ $data['average'] }}</p>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<table class="table table-default table-bordered all-tables">
|
||||
<thead>
|
||||
<tr>
|
||||
<th colspan="9">
|
||||
<h5>لیست ده فعالیت پرتکرار</h5>
|
||||
</th>
|
||||
</tr>
|
||||
<tr class="tr-color-subheader">
|
||||
<th>عنوان فعالیت</th>
|
||||
<th>تعداد تکرار</th>
|
||||
<th>عنوان فعالیت</th>
|
||||
<th>تعداد تکرار</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
@if (count($data['top_10_activity_list']))
|
||||
@for ($i = 1; $i <= round(count($data['top_10_activity_list']) / 2); $i++)
|
||||
<tr>
|
||||
<td>{{ $data['top_10_activity_list'][$i - 1]->description }}</td>
|
||||
<td>{{ $data['top_10_activity_list'][$i - 1]->quantity }}</td>
|
||||
@if (isset($data['top_10_activity_list'][$i + round(count($data['top_10_activity_list']) / 2) - 1]))
|
||||
<td>{{ $data['top_10_activity_list'][$i + round(count($data['top_10_activity_list']) / 2) - 1]->description }}
|
||||
</td>
|
||||
<td>{{ $data['top_10_activity_list'][$i + round(count($data['top_10_activity_list']) / 2) - 1]->quantity }}
|
||||
</td>
|
||||
@endif
|
||||
</tr>
|
||||
@endfor
|
||||
@else
|
||||
<tr>
|
||||
<td colspan="4">داده ای وجود ندارد ...</td>
|
||||
</tr>
|
||||
@endif
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
<div>
|
||||
<canvas id="myChart" style="display: block; width: 1510px; height: 400px;"
|
||||
class="chartjs-render-monitor" width="1510" height="400"></canvas>
|
||||
</div>
|
||||
<div class="d-flex ">
|
||||
<table class="table table-default table-bordered all-tables ml-3">
|
||||
<thead>
|
||||
<tr>
|
||||
<th colspan="9">
|
||||
<h5>مجموع تعداد فعالیت به ازای هر کاربر گروه</h5>
|
||||
</th>
|
||||
</tr>
|
||||
<tr class="tr-color-subheader">
|
||||
<th>نام و نام خانوادگی<small class="pr-2">(نام کاربری) </small></th>
|
||||
<th>تعداد فعالیت</th>
|
||||
<th>سهم از کل <small>(درصد)</small></th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
@foreach ($data['user_activity_quantity'] as $item)
|
||||
<tr>
|
||||
<td>{{ $item['name'] }}</td>
|
||||
<td>{{ $item['majmoe'] }}</td>
|
||||
<td>{{ $data['total_activity_quantity'] ? round(($item['majmoe'] / $data['total_activity_quantity']) * 100) : 0 }}
|
||||
</td>
|
||||
</tr>
|
||||
@endforeach
|
||||
</tbody>
|
||||
</table>
|
||||
<table class="table table-default table-bordered all-tables">
|
||||
<thead>
|
||||
<tr>
|
||||
<th colspan="9">
|
||||
<h5>مجموع ساعت فعالیت به ازای هر کاربر گروه</h5>
|
||||
</th>
|
||||
</tr>
|
||||
<tr class="tr-color-subheader">
|
||||
<th>نام و نام خانوادگی<small class="pr-2">(نام کاربری) </small></th>
|
||||
<th>ساعت فعالیت</th>
|
||||
<th>سهم از کل <small>(درصد)</small></th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
@foreach ($data['user_activity_time'] as $item)
|
||||
<tr>
|
||||
<td>{{ $item['name'] }}</td>
|
||||
<td>{{ $item['majmoe'] }}</td>
|
||||
<td>{{ $data['total_activity_time'] ? round(($item['majmoe'] / $data['total_activity_time']) * 100) : 0 }}
|
||||
</td>
|
||||
</tr>
|
||||
@endforeach
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
<div class="">
|
||||
<table class="table table-default table-bordered all-tables">
|
||||
<thead>
|
||||
<tr>
|
||||
<th colspan="9">
|
||||
<h5>لیست فعالیت های پرتکرار هر کاربر گروه</h5>
|
||||
</th>
|
||||
</tr>
|
||||
<tr class="tr-color-subheader">
|
||||
<th>نام و نام خانوادگی</th>
|
||||
<th>فعالیت اول</th>
|
||||
<th>فعالیت دوم</th>
|
||||
<th>فعالیت سوم</th>
|
||||
<th>فعالیت چهارم</th>
|
||||
<th>فعالیت پنجم</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
@foreach ($data['user_activity_top_5_temp'] as $item)
|
||||
<tr>
|
||||
<td>{{ $item['name'] }}</td>
|
||||
@forelse ($item['activity_list'] as $temp)
|
||||
<td>{{ $temp->description }} ({{ $temp->quantity }})</td>
|
||||
@empty
|
||||
<td colspan="5">عملیاتی موجود نیست</td>
|
||||
@endforelse
|
||||
</tr>
|
||||
@endforeach
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<script src="{{ asset('plugins/jquery/jquery.min.js') }}"></script>
|
||||
<script src="{{ asset('plugins/bootstrap/js/bootstrap.bundle.min.js') }}"></script>
|
||||
<script src="{{ asset('plugins/moment/moment.min.js') }}"></script>
|
||||
<script src="{{ asset('dist/js/jalali-moment.browser.js') }}"></script>
|
||||
<script src="{{ asset('plugins/chart.js/Chart.min.js') }}"></script>
|
||||
<!-- <script src="{{ asset('dist/js/chartjs-plugin-datalabels.js') }}"></script> -->
|
||||
|
||||
<script src="{{ asset('plugins/chartjs-plugin-datalabels/chartjs-plugin-datalabels.min.js') }}"></script>
|
||||
<script>
|
||||
$(".date-from").text(moment(
|
||||
'{{ $data['fromDate'] }}').format('jYYYY/jMM/jDD'));
|
||||
$(".date-to").text(moment(
|
||||
'{{ $data['toDate'] }}').format('jYYYY/jMM/jDD'));
|
||||
</script>
|
||||
<script>
|
||||
var hour_data = []
|
||||
var quentity_hour = []
|
||||
var labels = []
|
||||
Chart.defaults.global.defaultFontFamily = "IRANSansFaNum";
|
||||
var serverToJs = {
|
||||
hourly_activity_chart: @json($data['hourly_activity_chart']),
|
||||
quantitative_activity_chart: @json($data['quantitative_activity_chart'])
|
||||
}
|
||||
|
||||
var hourly_activity_chart = serverToJs.hourly_activity_chart;
|
||||
var quantitative_activity_chart = serverToJs.quantitative_activity_chart;
|
||||
|
||||
console.log(serverToJs);
|
||||
|
||||
for (var i = 0; i < hourly_activity_chart.length; i++) {
|
||||
hour_data.push(hourly_activity_chart[i].majmoe)
|
||||
}
|
||||
|
||||
for (var i = 0; i < quantitative_activity_chart.length; i++) {
|
||||
quentity_hour.push(quantitative_activity_chart[i].quantity)
|
||||
labels.push(moment(quantitative_activity_chart[i].created_at).format("jYYYY/jMM/jDD"))
|
||||
}
|
||||
var data = {
|
||||
"datasets": [{
|
||||
"backgroundColor": "rgb(156, 39, 176)",
|
||||
"borderColor": "rgb(156, 39, 176)",
|
||||
"fill": false,
|
||||
"data": hour_data,
|
||||
"id": "amount",
|
||||
"label": "ساعت فعالیت در سامانه",
|
||||
"yAxisID": "left",
|
||||
"datalabels": {
|
||||
"align": 'start',
|
||||
"anchor": 'start'
|
||||
},
|
||||
},
|
||||
{
|
||||
"backgroundColor": "rgb(39, 176, 200)",
|
||||
"borderColor": "rgb(39, 176, 200)",
|
||||
"fill": false,
|
||||
"data": quentity_hour,
|
||||
"id": "amount",
|
||||
"label": "تعداد فعالیت در سامانه",
|
||||
"yAxisID": "right",
|
||||
"datalabels": {
|
||||
"align": 'end',
|
||||
"anchor": 'end'
|
||||
},
|
||||
}
|
||||
],
|
||||
"labels": labels
|
||||
};
|
||||
|
||||
var options = {
|
||||
"elements": {
|
||||
"rectangle": {
|
||||
"borderWidth": 2
|
||||
}
|
||||
},
|
||||
"layout": {
|
||||
"padding": 0
|
||||
},
|
||||
"legend": {
|
||||
"display": true,
|
||||
"labels": {
|
||||
"boxWidth": 16
|
||||
}
|
||||
},
|
||||
"maintainAspectRatio": false,
|
||||
"responsive": true,
|
||||
"scales": {
|
||||
"xAxes": [{
|
||||
"gridLines": {
|
||||
"display": false
|
||||
},
|
||||
"scaleLabel": {
|
||||
"display": true,
|
||||
"labelString": "روز فعالیت"
|
||||
},
|
||||
"stacked": false,
|
||||
"ticks": {
|
||||
"autoSkip": true,
|
||||
"beginAtZero": true
|
||||
},
|
||||
}],
|
||||
"yAxes": [{
|
||||
"scaleLabel": {
|
||||
"display": true,
|
||||
"labelString": "ساعت فعالیت در سامانه"
|
||||
},
|
||||
"id": "left",
|
||||
"stacked": false,
|
||||
"ticks": {
|
||||
"beginAtZero": true
|
||||
}
|
||||
},
|
||||
{
|
||||
"scaleLabel": {
|
||||
"display": true,
|
||||
"labelString": "تعداد فعالیت در سامانه"
|
||||
},
|
||||
"id": "right",
|
||||
"position": "right",
|
||||
"stacked": false,
|
||||
"ticks": {
|
||||
"beginAtZero": true
|
||||
}
|
||||
}
|
||||
]
|
||||
},
|
||||
"title": {
|
||||
"display": false
|
||||
},
|
||||
"tooltips": {
|
||||
"intersect": false,
|
||||
"mode": "index",
|
||||
"position": "nearest",
|
||||
"callbacks": {}
|
||||
},
|
||||
"plugins": {
|
||||
"datalabels": {
|
||||
"display": true,
|
||||
backgroundColor: function(context) {
|
||||
return context.dataset.backgroundColor;
|
||||
},
|
||||
display: true,
|
||||
formatter: function(value, ctx) {
|
||||
return value;
|
||||
},
|
||||
borderRadius: 4,
|
||||
color: 'white',
|
||||
font: {
|
||||
weight: 'bold'
|
||||
},
|
||||
padding: 6
|
||||
}
|
||||
},
|
||||
}
|
||||
var type = "line";
|
||||
|
||||
var myChart = new Chart(document.getElementById("myChart").getContext('2d'), {
|
||||
options,
|
||||
data,
|
||||
type
|
||||
});
|
||||
|
||||
function showPrintPDF() {
|
||||
window.print();
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
Reference in New Issue
Block a user