476 lines
18 KiB
PHP
476 lines
18 KiB
PHP
@extends('layouts.vertical', ["page_title"=> "Add & Edit Products"])
|
|
|
|
@section('css')
|
|
<!-- third party css -->
|
|
|
|
<!-- third party css end -->
|
|
@endsection
|
|
|
|
@section('content')
|
|
|
|
<style>
|
|
.page-container {
|
|
max-width: 700px;
|
|
height: auto;
|
|
position: relative;
|
|
font-size: 10px;
|
|
}
|
|
|
|
.company-logo {
|
|
margin-bottom: 20px;
|
|
padding-top: 40px;
|
|
margin-right: 16px;
|
|
margin-left: 18px;
|
|
}
|
|
.company-logo img {
|
|
height: 30px;
|
|
}
|
|
|
|
.col-card {
|
|
border-radius: 10px;
|
|
}
|
|
|
|
.page-content-card .card-img-overlay {
|
|
position: relative;
|
|
background-color: rgba(250, 250, 250, 0);
|
|
padding: 0px 15px 10px;
|
|
padding-bottom: 20%;
|
|
}
|
|
.page-content-card .card-img-overlay .row-card {
|
|
background-color: transparent;
|
|
padding: 0px 2px;
|
|
margin: 0;
|
|
min-height: 4.2em;
|
|
color: #fff;
|
|
}
|
|
.page-content-card .card-img-overlay .row.row-card:nth-child(odd) > .col-card {
|
|
color: #333;
|
|
background-color: #fff;
|
|
}
|
|
|
|
.page-content-card .card-img-overlay .row.row-card:nth-child(even) > .col-card {
|
|
background: linear-gradient(
|
|
180deg,
|
|
rgba(3, 150, 219, 1) 17%,
|
|
rgba(44, 73, 153, 1) 68%
|
|
);
|
|
}
|
|
|
|
.page-content-card .card-img-overlay .col-card {
|
|
font-size: 16px;
|
|
padding: 8px 8px;
|
|
align-items: center;
|
|
line-height: 1.2;
|
|
border: 1px solid #96e9ff;
|
|
}
|
|
|
|
.page-content-card .card-img-overlay .col-card img {
|
|
width: auto;
|
|
height: 25px;
|
|
}
|
|
.page-content-card.score-board-page-content-card
|
|
.card-img-overlay
|
|
.row-card.row-head
|
|
.col-card {
|
|
background: linear-gradient(0deg, rgba(2, 0, 36, 1) 31%, rgb(22 22 116) 82%);
|
|
border: 1px solid #ccc;
|
|
text-align: center;
|
|
font-size: 14px;
|
|
font-weight: 600;
|
|
padding: 8px 5px;
|
|
color: #fff;
|
|
}
|
|
.page-content-card .card-img-overlay .col-card {
|
|
max-width: calc((100% / 4));
|
|
flex-basis: calc((100% / 4));
|
|
flex-shrink: 1;
|
|
}
|
|
.page-content-card .card-img-overlay .row-card .col-card:nth-child(1) {
|
|
font-weight: 600;
|
|
}
|
|
.page-content-card .card-img-overlay .col-card:nth-child(3) {
|
|
max-width: calc((3 * (100% / 4)));
|
|
flex-basis: calc((3 * (100% / 4)));
|
|
flex-grow: 1;
|
|
}
|
|
.page-content-card .card-img-overlay .col-card:nth-child(4) {
|
|
max-width: calc((100% / 4) + 20px);
|
|
flex-basis: calc((100% / 4) + 20px);
|
|
}
|
|
|
|
/** Team Score Page **/
|
|
|
|
.page-content-card .card-img-overlay#team-score-board-page-content {
|
|
background-color: rgba(250, 250, 250, 0);
|
|
padding: 0px 25px 25%;
|
|
}
|
|
.page-content-card
|
|
.card-img-overlay#team-score-board-page-content
|
|
.team-logo-container {
|
|
min-height: 22em;
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
margin-bottom: 30px;
|
|
padding: 20px;
|
|
border-radius: 15px;
|
|
background-color: #fff;
|
|
}
|
|
.page-content-card
|
|
.card-img-overlay#team-score-board-page-content
|
|
.team-logo-container
|
|
img {
|
|
height: 100%;
|
|
width: auto;
|
|
/* max-width: 250px; */
|
|
max-height: 160px;
|
|
object-fit: contain;
|
|
object-position: center;
|
|
}
|
|
.page-content-card .card-img-overlay#team-score-board-page-content .col-card {
|
|
max-width: calc((100% / 8));
|
|
flex-basis: calc((100% / 8));
|
|
flex-shrink: 1;
|
|
align-items: center;
|
|
}
|
|
.page-content-card
|
|
.card-img-overlay#team-score-board-page-content
|
|
.col-card:nth-child(1) {
|
|
max-width: calc((3.2 * (100% / 8)));
|
|
flex-basis: calc((3.2 * (100% / 8)));
|
|
flex-grow: 1;
|
|
}
|
|
.page-content-card
|
|
.card-img-overlay#team-score-board-page-content
|
|
.col-card:nth-child(2),
|
|
.page-content-card
|
|
.card-img-overlay#team-score-board-page-content
|
|
.col-card:nth-child(3) {
|
|
max-width: calc(1.4 * (100% / 8));
|
|
flex-basis: calc(1.4 * (100% / 8));
|
|
}
|
|
.page-content-card .card-img-overlay#team-score-board-page-content .row-card {
|
|
background-color: transparent;
|
|
padding: 0px 3px;
|
|
margin: 0;
|
|
min-height: 5.68em;
|
|
color: #333;
|
|
}
|
|
.page-content-card.team-score-board-card
|
|
.card-img-overlay
|
|
.row-card.row-head
|
|
.col-card {
|
|
background: linear-gradient(
|
|
264deg,
|
|
rgba(196, 36, 22, 1) 15%,
|
|
rgba(219, 113, 3, 1) 81%
|
|
) !important;
|
|
border: 1px solid rgb(240, 140, 32);
|
|
text-align: center;
|
|
font-size: 13px;
|
|
font-weight: 600;
|
|
padding: 8px 3px;
|
|
color: #fff !important;
|
|
}
|
|
|
|
.page-content-card.team-score-board-card
|
|
.card-img-overlay
|
|
.row.row-card:nth-child(odd)
|
|
> .col-card {
|
|
color: #333;
|
|
background: linear-gradient(
|
|
0deg,
|
|
rgba(101, 197, 239, 1) 15%,
|
|
rgba(255, 255, 255, 1) 81%
|
|
);
|
|
}
|
|
|
|
.page-content-card.team-score-board-card
|
|
.card-img-overlay
|
|
.row.row-card:nth-child(even)
|
|
> .col-card {
|
|
background: linear-gradient(
|
|
0deg,
|
|
rgba(87, 107, 175, 1) 15%,
|
|
rgba(255, 255, 255, 1) 81%
|
|
);
|
|
}
|
|
|
|
/* .page-content-card
|
|
.card-img-overlay#team-score-board-page-content
|
|
.row-card:last-child {
|
|
min-height: 8.8em;
|
|
color: #fffe78;
|
|
|
|
padding-top: 0.65em;
|
|
}
|
|
.page-content-card
|
|
.card-img-overlay#team-score-board-page-content
|
|
.row-card:last-child
|
|
.col-card {
|
|
font-weight: bold;
|
|
background: linear-gradient(
|
|
0deg,
|
|
rgba(196, 36, 22, 1) 15%,
|
|
rgba(219, 113, 3, 1) 81%
|
|
);
|
|
border: 1px solid rgb(240, 140, 32);
|
|
color: #fffe78;
|
|
} */
|
|
|
|
/* Responsive styles */
|
|
@media screen and (max-width: 767px) {
|
|
.page-container {
|
|
/* width: 360px; */
|
|
width: 100%;
|
|
}
|
|
|
|
.col-card {
|
|
border-radius: 8px;
|
|
}
|
|
|
|
.page-content-card .card-img-overlay {
|
|
padding: 0% 10px 30%;
|
|
}
|
|
.page-content-card .card-img-overlay .col-card img {
|
|
object-fit: contain;
|
|
width: auto;
|
|
height: auto;
|
|
max-width: 35px;
|
|
max-height: 20px;
|
|
object-position: center;
|
|
}
|
|
|
|
.page-content-card.score-board-page-content-card
|
|
.card-img-overlay
|
|
.row-card.row-head
|
|
.col-card {
|
|
padding: 5px;
|
|
font-size: 12px;
|
|
}
|
|
|
|
.page-content-card .card-img-overlay .row-card {
|
|
min-height: 2.75em;
|
|
}
|
|
.page-content-card .card-img-overlay .col-card {
|
|
font-size: 13px;
|
|
padding: 4px 8px;
|
|
line-height: 1.2;
|
|
}
|
|
|
|
/** Team Score Page **/
|
|
.page-content-card .card-img-overlay#team-score-board-page-content {
|
|
padding: 0% 10px 40%;
|
|
}
|
|
.page-content-card
|
|
.card-img-overlay#team-score-board-page-content
|
|
.team-logo-container {
|
|
min-height: 12em;
|
|
margin-bottom: 15px;
|
|
padding: 20px;
|
|
}
|
|
.page-content-card
|
|
.card-img-overlay#team-score-board-page-content
|
|
.team-logo-container
|
|
img {
|
|
height: 80px;
|
|
width: auto;
|
|
}
|
|
|
|
.page-content-card .card-img-overlay#team-score-board-page-content .row-card {
|
|
/* background-color: lightblue; */
|
|
background-color: transparent;
|
|
padding: 0px 3px;
|
|
margin: 0;
|
|
min-height: 2.95em;
|
|
color: #333;
|
|
}
|
|
.page-content-card
|
|
.card-img-overlay#team-score-board-page-content
|
|
.row-card:last-child {
|
|
min-height: 4em;
|
|
}
|
|
.page-content-card.team-score-board-card
|
|
.card-img-overlay
|
|
.row-card.row-head
|
|
.col-card {
|
|
font-size: 12px;
|
|
}
|
|
.page-content-card
|
|
.card-img-overlay#team-score-board-page-content
|
|
.col-card:nth-child(1) {
|
|
max-width: calc((1.8 * (100% / 8)));
|
|
flex-basis: calc((1.8 * (100% / 8)));
|
|
}
|
|
.page-content-card.team-score-board-card .card-img-overlay .col-card {
|
|
font-size: 13px;
|
|
padding: 5px 8px;
|
|
line-height: 1.2;
|
|
}
|
|
|
|
#team-score-board-content {
|
|
overflow: scroll;
|
|
}
|
|
#team-score-board-content > div {
|
|
min-width: 600px;
|
|
}
|
|
}
|
|
|
|
|
|
</style>
|
|
|
|
<!-- Start Content-->
|
|
<div class="container-fluid">
|
|
<div class="card">
|
|
<div class="card-body p-1 p-sm-3">
|
|
<div class="row">
|
|
<div class="col-12">
|
|
<div class="card border-primary border mb-3" id="compatition_team_dashboard_{{$competition->id}}">
|
|
<div class="card-header"><i class="mdi mdi-calendar-month-outline font-18 text-success me-1"></i> {{date("d M Y h:iA", strtotime($competition->validity_start))}} - {{date("d M Y h:iA", strtotime($competition->validity_end)-1 )}}</div>
|
|
<div class="card-body p-1 p-sm-3">
|
|
<h4 class="card-title text-primary">{{$competition->title}}</h4>
|
|
<button class="btn btn-success btn-sm rounded-pill dlscreenshot mb-2"
|
|
target="contest1">
|
|
Download PNG
|
|
</button>
|
|
|
|
<div id="contest1" class="page-container">
|
|
<div
|
|
class="card page-content-card team-score-board-card text-white border-0"
|
|
style="background-image: linear-gradient(180deg,rgba(8, 32, 66, 1) 15%,rgba(49, 56, 108, 0.85) 48%,rgba(84, 69, 106, 0.2) 81%), url(/images/team4/team-page-bg.jpg);background-size: 100%;background-repeat: no-repeat;background-position: bottom center;"
|
|
>
|
|
<div class="company-logo d-flex justify-content-between align-items-center">
|
|
<div>
|
|
<h4 class="text-warning mb-0 mt-0">{{$competition->title}}</h4>
|
|
</div>
|
|
<img src="/images/team4/company-logo.png" class="img-fluid" alt="company-logo" />
|
|
</div>
|
|
<div id="team-score-board-page-content" class="card-img-overlay">
|
|
@php
|
|
$participant_team = ($competition->team);
|
|
$logo_img = $participant_team->image;
|
|
@endphp
|
|
<div class="team-logo-container">
|
|
<img src="{{$logo_img}}" class="img-fluid mx-auto" alt="{{$participant_team->name}} logo" />
|
|
</div>
|
|
<div id="team-score-board-content" class="team-score-board-content">
|
|
<div>
|
|
<div class="row row-cols-8 row-card row-head d-flex flex-nowrap mb-2">
|
|
<div class="col col-card d-flex justify-content-center text-wrap align-item-center">
|
|
TM Name
|
|
</div>
|
|
<div class="col col-card d-flex justify-content-center align-item-center">
|
|
Conversion Dr Score
|
|
</div>
|
|
<div class="col col-card d-flex justify-content-center align-item-center">
|
|
Consolidation Dr Score
|
|
</div>
|
|
<div class="col col-card d-flex justify-content-center align-item-center">
|
|
Camps Score
|
|
</div>
|
|
<div class="col col-card d-flex justify-content-center align-item-center">
|
|
Visit Score
|
|
</div>
|
|
<div class="col col-card d-flex justify-content-center align-item-center">
|
|
MLC Adult Ach Score
|
|
</div>
|
|
<div class="col col-card d-flex justify-content-center align-item-center">
|
|
MLC Kid Ach Score
|
|
</div>
|
|
<div class="col col-card d-flex justify-content-center align-item-center">
|
|
Total
|
|
</div>
|
|
</div>
|
|
@foreach($competition->userscore as $participant)
|
|
<div class="row row-cols-8 row-card d-flex flex-nowrap">
|
|
<div class="col col-card d-flex justify-content-start text-wrap align-item-center">
|
|
{{$participant->name}}
|
|
</div>
|
|
<div class="col col-card d-flex justify-content-center align-item-center">
|
|
{{ (isset($participant->{'1712380767-05a6d97a-4d83-41b2-mlcadult-5116b7c5fd13'}) ? $participant->{'1712380767-05a6d97a-4d83-41b2-mlcadult-5116b7c5fd13'} : 0) + (isset($participant->{'1712380767-05a6d97a-4d83-41b2-8972-5116b7c5fd13'}) ? $participant->{'1712380767-05a6d97a-4d83-41b2-8972-5116b7c5fd13'} : 0) }}
|
|
</div>
|
|
<div class="col col-card d-flex justify-content-center align-item-center">
|
|
{{ (isset($participant->{'1712380852-948358bf-92df-49f2-ac84-7921ae8ac1e7'}) ? $participant->{'1712380852-948358bf-92df-49f2-ac84-7921ae8ac1e7'} : 0) + (isset($participant->{'1712380852-948358bf-92df-49f2-mlcadult-7921ae8ac1e7'}) ? $participant->{'1712380852-948358bf-92df-49f2-mlcadult-7921ae8ac1e7'} : 0) }}
|
|
</div>
|
|
<div class="col col-card d-flex justify-content-center align-item-center">
|
|
{{ (isset($participant->{'1712380881-26db26d4-d528-4e61-ae92-3ef112ef2443'}) ? $participant->{'1712380881-26db26d4-d528-4e61-ae92-3ef112ef2443'} : 0) }}
|
|
</div>
|
|
<div class="col col-card d-flex justify-content-center align-item-center">
|
|
{{ (isset($participant->{'1712380921-c326a211-ac16-4bb3-86b7-bfb25f3789fd'}) ? $participant->{'1712380921-c326a211-ac16-4bb3-86b7-bfb25f3789fd'} : 0) }}
|
|
</div>
|
|
<div class="col col-card d-flex justify-content-center align-item-center">
|
|
{{ (isset($participant->{'1712294381-98d1e9f1-421d-4aba-bf95-c57406dac49f'}) ? $participant->{'1712294381-98d1e9f1-421d-4aba-bf95-c57406dac49f'} : 0) }}
|
|
</div>
|
|
<div class="col col-card d-flex justify-content-center align-item-center">
|
|
{{ (isset($participant->{'1712294753-99c0b84e-f7c8-4c79-9e2d-720e34550bb4'}) ? $participant->{'1712294753-99c0b84e-f7c8-4c79-9e2d-720e34550bb4'} : 0) }}
|
|
</div>
|
|
<div class="col col-card d-flex justify-content-center align-item-center">
|
|
{{ is_object($participant->score) ? '-' : $participant->score }}
|
|
</div>
|
|
</div>
|
|
@endforeach
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div id="previewImg2" class="d-none"></div>
|
|
|
|
<!-- <p class="card-text">Some quick example text to build on the card title and make up the bulk of the card's content.</p> -->
|
|
<!-- <div class="table-responsive">
|
|
<table class="table table-borderless table-nowrap table-hover table-centered m-0">
|
|
<thead class="table-light">
|
|
<tr>
|
|
<th>Rank</th>
|
|
<th>User Name</th>
|
|
<th>Total Runs</th>
|
|
@foreach($competition->metrics as $metric)
|
|
<th>{{$metric->name}}</th>
|
|
@endforeach
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
@foreach($competition->userscore as $participant)
|
|
<tr>
|
|
<td><h2>{{$participant->rank}}</h2></td>
|
|
<td><h5 class="m-0 fw-normal">{{$participant->name}}</h5></td>
|
|
<td>{{ is_object($participant->score) ? '-' : $participant->score }}</td>
|
|
@foreach($competition->metrics as $metric)
|
|
<td>{{ isset($participant->{$metric->id}) ? $participant->{$metric->id} : 0 }}</td>
|
|
@endforeach
|
|
</tr>
|
|
@endforeach
|
|
</tbody>
|
|
</table>
|
|
</div> -->
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
@endsection
|
|
|
|
@section('script')
|
|
<script src="{{asset('assets/js/html2canvas.min.js')}}" integrity="sha512-BNaRQnYJYiPSqHHDb58B0yaPfCu+Wgds8Gp/gU33kqBtgNS4tSPHuGibyoeqMV/TJlSKda6FXzoEyYGjTe+vXA==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
|
|
<script type="text/javascript">
|
|
jQuery(document).ready(function($){
|
|
$('.dlscreenshot').click(function(){
|
|
html2canvas(document.getElementById( $(this).attr('target') ), {
|
|
allowTaint: true, useCORS: true
|
|
}).then(function (canvas) {
|
|
var anchorTag = document.createElement("a");
|
|
document.body.appendChild(anchorTag);
|
|
document.getElementById("previewImg2").appendChild(canvas);
|
|
anchorTag.download = "filename.jpg";
|
|
anchorTag.href = canvas.toDataURL();
|
|
anchorTag.target = '_blank';
|
|
anchorTag.click();
|
|
});
|
|
})
|
|
});
|
|
|
|
</script>
|
|
|
|
@endsection |