calculator

This commit is contained in:
ROMANGOLIENKO 2024-03-12 12:47:12 +03:00
parent f15fc3f7f7
commit 1ef21ae943
5 changed files with 181 additions and 111 deletions

View File

@ -9,6 +9,7 @@ use App\Models\EntranceExamination;
use App\Models\Faculty; use App\Models\Faculty;
use Illuminate\Http\Request; use Illuminate\Http\Request;
class CalculatorController extends Controller class CalculatorController extends Controller
{ {
public function findDirectionFromSubjects(Request $request) public function findDirectionFromSubjects(Request $request)
@ -34,10 +35,63 @@ class CalculatorController extends Controller
$faculty = Faculty::find($department->faculty_id); $faculty = Faculty::find($department->faculty_id);
return "{$acc} <tr class=\"\"> return "{$acc} <tr class=\"\">
<td id=\"faculty\"> {$faculty->name} </td> <td id=\"faculty\"> {$faculty->name} </td>
<td> {$direction->name} </td> <td>
<td class=\"text-end\"> {$direction->period} </td> <a class=\" border border-white rounded-3 p-2 hover1\" type=\"button\" data-bs-toggle=\"offcanvas\" data-bs-target=\"#offcanvasScrolling-{$direction->id}{$direction->id }\" aria-controls=\"offcanvasScrolling\" role=\"button\">{$direction->name}</a>
</tr>"; <div class=\"offcanvas offcanvas-bottom text-dark\" data-bs-scroll=\"true\" data-bs-backdrop=\"false\" tabindex=\"-1\" id=\"offcanvasScrolling-{$direction->id }{$direction->id }\" aria-labelledby=\"offcanvasScrollingLabel-{$direction->id}{$direction->id }\" style=\"height: 100%; font-family: Geologica-Medium;overflow-y: auto ;\">
<div class=\"mx-5\">
<div class=\"col-12 d-flex justify-content-end mt-4\">
<button type=\"button\" class=\"btn-close text-reset\" data-bs-dismiss=\"offcanvas\" aria-label=\"Close\"></button>
</div>
<div class=\"row\">
<div class=\"col-xl-3 col-12\">
<div class=\"display-5 \" style=\"font-family: Geologica-Light\"> {$direction->code} </div>
<div class=\"display-5 \" > {$direction->name}</div>
</div>
</div>
<div class=\"row\">
<div class=\"col-xl-3 col-12\">
<br>
<br>
<div> Уровень образования: <span style=\"font-family: Geologica-Light\">{$direction->educationLevel->name} </span> </div>
<div> Форма обучения: <span style=\"font-family: Geologica-Light\">{$direction->educationForm->name} </span></div>
</div>
<div class=\"col-xl-3 col-12\">
<br>
<br>
<div> Бюджетные места: <span style=\"font-family: Geologica-Light\">{$direction->budget_places} </span> </div>
<div> Квота: <span style=\"font-family: Geologica-Light\">{$direction->quota} </span></div>
</div>
<div class=\"col-xl-3 col-12\">
<br>
<br>
<div> Места на контракт: <span style=\"font-family: Geologica-Light\">{$direction->paid_places} </span> </div>
<div> Стоимость платного обучения: <span style=\"font-family: Geologica-Light\">{$direction->cost_paid_place} </span></div>
</div>
<div class=\"col-xl-3 col-12\">
<br>
<br>
<div> Период обучения (в годах): <span style=\"font-family: Geologica-Light\">{$direction->period} </span> </div>
</div>
</div>
<div class=\"offcanvas-body mt-2\" style=\"font-family: Geologica-ExtraLight\">
<p style=\"text-align: justify;\">{$direction->description}</p>
</div>
</div>
</div>
</td>
<td class=\"text-end\"> {$direction->period} </td>
</tr>";
}; };
$html = $directions->reduce($generateHtml, ''); $html = $directions->reduce($generateHtml, '');

View File

@ -0,0 +1,68 @@
<?php
namespace App\Services;
use App\Models\Direction;
class DirectonHtmlBuilder
{
private Direction $direction;
public function __construct($direction)
{
$this->direction = $direction;
}
public function getHTML()
{
$direction = $this->direction;
return "<div class=\"offcanvas offcanvas-bottom\" data-bs-scroll=\"true\" data-bs-backdrop=\"false\" tabindex=\"-1\" id=\"offcanvasScrolling-{$direction->id }\" aria-labelledby=\"offcanvasScrollingLabel-{$direction->id}\" style=\"height: 100%; font-family: Geologica-Medium;overflow-y: auto ;\">
<div class=\"mx-5\">
<div class=\"col-12 d-flex justify-content-end mt-4\">
<button type=\"button\" class=\"btn-close text-reset\" data-bs-dismiss=\"offcanvas\" aria-label=\"Close\"></button>
</div>
<div class=\"row\">
<div class=\"col-xl-3 col-12\">
<div class=\"display-5 \" style=\"font-family: Geologica-Light\"> {$direction->code} </div>
<div class=\"display-5 \" > {$direction->name}</div>
</div>
</div>
<div class=\"row\">
<div class=\"col-xl-3 col-12\">
<br>
<br>
<div> Уровень образования: <span style=\"font-family: Geologica-Light\">{$direction->educationLevel->name} </span> </div>
<div> Форма обучения: <span style=\"font-family: Geologica-Light\">{$direction->educationForm->name} </span></div>
</div>
<div class=\"col-xl-3 col-12\">
<br>
<br>
<div> Бюджетные места: <span style=\"font-family: Geologica-Light\">{$direction->budget_places} </span> </div>
<div> Квота: <span style=\"font-family: Geologica-Light\">{$direction->quota} </span></div>
</div>
<div class=\"col-xl-3 col-12\">
<br>
<br>
<div> Места на контракт: <span style=\"font-family: Geologica-Light\">{$direction->paid_places} </span> </div>
<div> Стоимость платного обучения: <span style=\"font-family: Geologica-Light\">{$direction->cost_paid_place} </span></div>
</div>
<div class=\"col-xl-3 col-12\">
<br>
<br>
<div> Период обучения (в годах): <span style=\"font-family: Geologica-Light\">{$direction->period} </span> </div>
</div>
</div>
<div class=\"offcanvas-body mt-2\" style=\"font-family: Geologica-ExtraLight\">
<p style=\"text-align: justify;\">{$direction->description}</p>
</div>
</div>
</div> ";
}
}

View File

@ -0,0 +1 @@
<svg fill="#1A1A1A" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 50 50" width="50px" height="50px"><path d="M 42.875 8.625 C 42.84375 8.632813 42.8125 8.644531 42.78125 8.65625 C 42.519531 8.722656 42.292969 8.890625 42.15625 9.125 L 21.71875 40.8125 L 7.65625 28.125 C 7.410156 27.8125 7 27.675781 6.613281 27.777344 C 6.226563 27.878906 5.941406 28.203125 5.882813 28.597656 C 5.824219 28.992188 6.003906 29.382813 6.34375 29.59375 L 21.25 43.09375 C 21.46875 43.285156 21.761719 43.371094 22.050781 43.328125 C 22.339844 43.285156 22.59375 43.121094 22.75 42.875 L 43.84375 10.1875 C 44.074219 9.859375 44.085938 9.425781 43.875 9.085938 C 43.664063 8.746094 43.269531 8.566406 42.875 8.625 Z"/></svg>

After

Width:  |  Height:  |  Size: 708 B

View File

@ -48,7 +48,7 @@
color: unset; color: unset;
} }
a:hover{ a:hover{
color: unset;
} }
@ -126,19 +126,20 @@
left: 0; left: 0;
height: 25px; height: 25px;
width: 25px; width: 25px;
background-color: rgba(255, 255, 255, 0.18); background-color: transparent;
border: 1px solid rgba(255, 255, 255, 0.2); border: 1px solid rgb(241, 241, 241);
border-radius: 5px; border-radius: 8px;
} }
/* On mouse-over, add a grey background color */ /* On mouse-over, add a grey background color */
.checkbox1:hover input ~ .checkmark { .checkbox1:hover input ~ .checkmark {
background-color: rgba(44, 131, 204, 0.85); background-color: rgba(64, 160, 241, 0.85);
} }
/* When the checkbox is checked, add a blue background */ /* When the checkbox is checked, add a blue background */
.checkbox1 input:checked ~ .checkmark { .checkbox1 input:checked ~ .checkmark {
background-color: rgb(255, 255, 255); background-color: rgb(255, 255, 255);
} }
/* Create the checkmark/indicator (hidden when not checked) */ /* Create the checkmark/indicator (hidden when not checked) */
@ -171,12 +172,14 @@
/* width */ /* width */
::-webkit-scrollbar { ::-webkit-scrollbar {
width: 15px; width: 15px;
transition: 0.3s;
background-image: linear-gradient(to right, rgb(38, 159, 239), 20%, rgb(2, 142, 229));
} }
/* Track */ /* Track */
::-webkit-scrollbar-track { ::-webkit-scrollbar-track {
background: #FFFFFF; background: #bdbdbd;
box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
border-radius: 20px; border-radius: 20px;
@ -187,15 +190,18 @@
height: 30px; height: 30px;
width: 8px; width: 8px;
background: #eaeaea; background-image: linear-gradient(to right, rgba(38, 159, 239, 0.6), 20%, rgba(2, 142, 229, 0.6));
box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px; opacity: 0.1;
border-radius: 10px; border-radius: 10px;
transition: 0.3s;
} }
/* Handle on hover */ /* Handle on hover */
::-webkit-scrollbar-thumb:hover { ::-webkit-scrollbar-thumb:hover {
background: #bebebe; background-image: linear-gradient(to right, rgb(38, 159, 239), 20%, rgb(2, 142, 229));
transition: 0.3s;
} }
@ -237,9 +243,9 @@
<a href="#" class="col-auto px-lg-3 text-white text-sm-start " style="font-size: 20px;font-weight: 400;line-height: 29px;"> <a href="#" class="col-auto px-lg-3 text-white text-sm-start " style="font-size: 20px;font-weight: 400;line-height: 29px;">
<div class="hover2"> Все контакты</div> <div class="hover2"> Все контакты</div>
</a> </a>
<a href="#" class="col-auto px-lg-3 text-white text-sm-start " style="font-size: 20px;font-weight: 400;line-height: 29px;"> {{-- <a href="#" class="col-auto px-lg-3 text-white text-sm-start " style="font-size: 20px;font-weight: 400;line-height: 29px;">--}}
<div class="hover2"> RU </div> {{-- <div class="hover2"> RU </div>--}}
</a> {{-- </a>--}}
{{-- <img id="specialButton" style="cursor:pointer; width: 25px; height: 25px;" src="{{ URL::to('img/front-page/eye.png') }}" alt="ВЕРСИЯ ДЛЯ СЛАБОВИДЯЩИХ" title="ВЕРСИЯ ДЛЯ СЛАБОВИДЯЩИХ" />--}} {{-- <img id="specialButton" style="cursor:pointer; width: 25px; height: 25px;" src="{{ URL::to('img/front-page/eye.png') }}" alt="ВЕРСИЯ ДЛЯ СЛАБОВИДЯЩИХ" title="ВЕРСИЯ ДЛЯ СЛАБОВИДЯЩИХ" />--}}
</div> </div>
@ -318,7 +324,7 @@
</div> </div>
<div class="row d-flex justify-content-md-start justify-content-center"> <div class="row d-flex justify-content-md-start justify-content-center">
@php use App\Services\DirectonHtmlBuilder; @endphp
@foreach($faculties as $faculty) @foreach($faculties as $faculty)
<div class="mt-xl-5 col-xxl-4 col-md-6 col-10 "> <div class="mt-xl-5 col-xxl-4 col-md-6 col-10 ">
@ -358,57 +364,11 @@
<tr> <tr>
<td> <td>
<a class="" type="button" data-bs-toggle="offcanvas" data-bs-target="#offcanvasScrolling-{{ $direction->id }}" aria-controls="offcanvasScrolling" role="button">{{ $direction->name }}</a> <a class=" border border-dark rounded-3 p-2 hover1" type="button" data-bs-toggle="offcanvas" data-bs-target="#offcanvasScrolling-{{ $direction->id }}" aria-controls="offcanvasScrolling" role="button">{{ $direction->name }}</a>
<div class="offcanvas offcanvas-bottom" data-bs-scroll="true" data-bs-backdrop="false" tabindex="-1" id="offcanvasScrolling-{{ $direction->id }}" aria-labelledby="offcanvasScrollingLabel-{{ $direction->id }}" style="height: 100%; font-family: Geologica-Medium;overflow-y: auto ;"> @php
<div class="mx-5"> $DirectonHtmlBuilder = new DirectonHtmlBuilder($direction);
<div class="col-12 d-flex justify-content-end mt-4"> echo $DirectonHtmlBuilder->getHTML();
<button type="button" class="btn-close text-reset" data-bs-dismiss="offcanvas" aria-label="Close"></button> @endphp
</div>
<div class="row">
<div class="col-xl-3 col-12">
<div class="display-5 " style="font-family: Geologica-Light">{{ $direction->code }} </div>
<div class="display-5 " > {{ $direction->name }}</div>
</div>
</div>
<div class="row">
<div class="col-xl-3 col-12">
<br>
<br>
<div class=" "> Уровень образования: <span style="font-family: Geologica-Light">{{ $direction->educationLevel->name }} </span> </div>
<div class=" "> Форма обучения: <span style="font-family: Geologica-Light">{{ $direction->educationForm->name }} </span></div>
</div>
<div class="col-xl-3 col-12">
<br>
<br>
<div class=" "> Бюджетные места: <span style="font-family: Geologica-Light">{{ $direction->budget_places }} </span> </div>
<div class=" "> Квота: <span style="font-family: Geologica-Light">{{ $direction->quota }} </span></div>
</div>
<div class="col-xl-3 col-12">
<br>
<br>
<div class=" "> Места на контракт: <span style="font-family: Geologica-Light">{{ $direction->paid_places }} </span> </div>
<div class=" "> Стоимость платного обучения: <span style="font-family: Geologica-Light">{{ $direction->cost_paid_place }} </span></div>
</div>
<div class="col-xl-3 col-12">
<br>
<br>
<div class=" "> Период обучения (в годах): <span style="font-family: Geologica-Light">{{ $direction->period }} </span> </div>
</div>
</div>
{{-- <p class="display-5 " style="font-family: Geologica-Light">{{ $direction->code }} </p>--}}
{{-- <p class="display-5 " > {{ $direction->name }}</p>--}}
<div class="offcanvas-body mt-2" style="font-family: Geologica-ExtraLight">
<p style="text-align: justify;">{{ $direction->description }}</p>
<p style="text-align: justify;">{{ $direction->description }}</p>
</div>
</div>
</div>
</td> </td>
<td> {{ $direction->code }} </td> <td> {{ $direction->code }} </td>
@ -456,6 +416,7 @@
<div class="text-white display-6" > Выберите предметы ЕГЭ</div> <div class="text-white display-6" > Выберите предметы ЕГЭ</div>
<form class="text-white mt-4 fs-4 calcul" style=" font-family: Geologica-ExtraLight"> <form class="text-white mt-4 fs-4 calcul" style=" font-family: Geologica-ExtraLight">
<script src="{{ URL::to('https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js')}}"></script>
@foreach($subjects as $id => $name) @foreach($subjects as $id => $name)
@if($name == "Русский язык" || $name == "математика" ) @if($name == "Русский язык" || $name == "математика" )
@ -477,22 +438,26 @@
</form> </form>
<div class="row d-md-block d-flex ms-md-3 justify-content-center"> <div class="row d-md-block d-flex ms-md-3 justify-content-center">
<button style="border-radius: 11px; font-family: Geologica-ExtraLight" class="mt-4 col-5 text-white p-2 border border-white d-inline-flex justify-content-center shadow checkbox_clear"> Сбросить фильтр </button> <a role="button" style="border-radius: 11px; font-family: Geologica-ExtraLight" class="hover3 unclearall mt-4 col-5 text-white p-2 border border-white d-inline-flex justify-content-center shadow"> Сбросить фильтр </a>
<script>
function checkAll(checkEm) {
var cbs = document.getElementsByTagName('input');
for (var i = 0; i < cbs.length; i++) { <script type="text/javascript">
if (cbs[i].type == 'checkbox') { function uncheckAll() {
if (cbs[i].name == 'my_form_tasks[]') {
cbs[i].checked = checkEm; document.querySelectorAll('input[type="checkbox"]')
} .forEach(el => el.checked = false);
}
}
} }
document.querySelector('button').addEventListener('click', uncheckAll)
</script> </script>
</div> </div>
<script>window.onload = function() { <script>window.onload = function() {
$(".unclearall").click(function(){
$('input[type="checkbox"]').prop('checked',false);
return false;
})
$(".calcul input").click(function(){ $(".calcul input").click(function(){
$('.text-remove').remove(); $('.text-remove').remove();
let selected = []; let predmets=''; let selected = []; let predmets='';
@ -500,14 +465,15 @@
selected.push($(this).val()); selected.push($(this).val());
predmets += $(this).val()+','; predmets += $(this).val()+',';
}); });
console.log(selected);
$.ajax({ url: "{{ route('calculator') }}", dataType: 'json', cache:false,type: "POST",data: 'ajx=get_napr&format=html&predmets='+JSON.stringify(selected), $.ajax({ url: "{{ route('calculator') }}", dataType: 'json', cache:false,type: "POST",data: 'ajx=get_napr&format=html&predmets='+JSON.stringify(selected),
success: function(data) { success: function(data) {
$(".calcul_rez").html('<tr><th> Факультет </th><th> Направление </th><th align="right"> Период обучения (в годах)</th></tr>'); $(".calcul_rez").html('<tr><th class="fs-5"> Факультет </th><th class="fs-5"> Направление </th><th class="fs-5" style="text-align: right;"> Период обучения (в годах)</th></tr>');
$(".calcul_rez").append(data.html); $(".calcul_rez").append(data.html);
console.log(data);
}}); }});
}); });
}; };
@ -517,41 +483,19 @@
<div class="col-md-6 mt-md-0 mt-5 col-12"> <div class="col-md-6 mt-md-0 mt-5 col-12">
<div class="d-md-flex d-none border border-white py-5 justify-content-center" style="border-radius: 50px;"> <div class="d-flex border border-white py-5 justify-content-center align-items-center" style="border-radius: 50px; min-height: 200px;">
<table class="table1 text-white mx-0 p-2 calcul_rez" style="width: 90%; font-family: Geologica-ExtraLight;"> <div class="col-12 text-remove text-white w-100 text-center fs-4" style="font-family: Geologica-ExtraLight">Выберите предметы</div>
<span class="text-remove">Выберите предметы</span> <div class="table-responsive ps-5 " style="width: 90%">
<table class=" text-white px-5 calcul_rez" style="width: 90%; font-family: Geologica-ExtraLight;">
</table> </table>
</div> </div>
<div class="d-md-none d-flex border border-white py-5 justify-content-center " style="border-radius: 50px;">
<table class="table1 text-white mx-0 p-2 calcul_rez " style="width: 90%; font-family: Geologica-ExtraLight; font-size: 13px;">
<tr class="">
<td id="faculty"> Технологический факультет </td>
<td> Строительство </td>
<td class="text-end"> 4 года</td>
</tr>
<tr class="">
<td id="faculty"> Технологический факультет </td>
<td> Технологические машины и оборудование </td>
<td class="text-end"> 4 года</td>
</tr>
<tr class="">
<td> Технологический факультет </td>
<td> Продукты питания из растительного сырья </td>
<td class="text-end"> 4 года</td>
</tr>
<tr class="">
<td> Технологический факультет </td>
<td> Строительство </td>
<td class="text-end"> 4 года</td>
</tr>
</table>
</div> </div>
</div> </div>
</div> </div>

View File

@ -19,6 +19,9 @@ Route::get('/', function () {
return view('new-design.bakalavr-special', compact('faculties')); return view('new-design.bakalavr-special', compact('faculties'));
})->name('bakalavr-special'); })->name('bakalavr-special');
Route::get('/course', function () { Route::get('/course', function () {
return view('menu.course'); return view('menu.course');
})->name('course'); })->name('course');