Files
backend/resources/views/rmto-preview/pages/fast-reaction-preview.blade.php
2024-02-01 09:53:53 +00:00

309 lines
11 KiB
PHP

{{-- dd($roadProblemArray) --}}
<!DOCTYPE html>
<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">
<meta name="csrf-token" content="{{ csrf_token() }}">
<title> پیش‌نمایش گزارش مشکلات مردمی </title>
<link rel="stylesheet" href="/var/www/rms/public/dist/css/fontiran.css" />
<link rel="stylesheet" href="/var/www/rms/public/dist/css/leaflet.css" />
<link rel="stylesheet" href="/var/www/rms/public/plugins/fontawesome-free/css/all.min.css">
<link rel="stylesheet" href="/var/www/rms/public/dist/css/financeend.css">
<style>
.preview-template {
border-left: 2px solid black;
border-right: 2px solid black;
direction: rtl;
font-family: IRANSansFaNum, sans-serif;
}
.template-section {
border-top: 2px solid black;
border-bottom: 2px solid black;
}
.section-title {
font-size: 13px;
text-align: center;
background-color: lightgrey;
font-weight: 600;
padding: 10px 15px;
border-bottom: 2px solid black;
}
.section-table>table {
width: 100%;
}
.section-table>table,
th,
td {
border: 1px solid black;
border-collapse: collapse;
}
.section-table th {
text-align: center;
font-size: 11px;
font-weight: 500;
padding: 8px 10px;
}
.section-table th.sub-title {
text-align: center;
font-size: 9px;
font-weight: 500;
padding: 4px 5px;
}
.section-table td {
text-align: center;
padding: 10px 5px;
}
.section-table th.w-2 {
width: 3%;
}
.section-table th.w-3 {
width: 3%;
}
.section-table th.w-4 {
width: 4%;
}
.section-table th.w-5 {
width: 5%;
}
.section-table td.desc-data {
text-align: right;
font-size: 11px;
font-weight: 600;
}
.template-details {
padding: 5px;
font-size: 12px;
border-top: 2px solid black;
text-align: left;
}
.template-details {
display: flex;
}
.details-icon,
.details-date {
width: 50%;
}
.details-icon {
text-align: right;
padding-right: 15px;
}
.details-icon>img {
width: 40px;
}
.details-date {
line-height: 48px;
}
.section-preview-1-data>td {
font-size: 10px;
font-weight: 400;
}
.desc-data-str {
font-size: 10px;
font-weight: 400;
overflow-wrap: anywhere;
word-wrap: break-word;
word-break: break-all;
}
#complaint_range_map , #submited_range_map {
height: 100%;
border: 1px solid #dee2e6;
border-radius: 0.25rem;
}
</style>
</head>
<body>
<div class="preview-template" style="width: 100%;">
<div class="template-section" style="border-bottom: 0;">
<div class="section-title" style="font-size: 16px;font-weight: 600;"> طرح ملی واکنش سریع راهداری
</div>
</div>
<div class="template-section" style="margin: 5px 0 10px 0px;">
<div class="section-title"> اطلاعات موضوع مورد شکایت </div>
<div class="section-table">
<table>
<tr>
<th style="font-size: 10px;white-space: nowrap">اداره کل:</th>
<th style="font-size: 10px;white-space: nowrap">شهرستان:</th>
<th style="font-size: 10px;white-space: nowrap">موضوع شکایت:</th>
<th style="font-size: 10px;white-space: nowrap">نوع شکایت:</th>
<th style="font-size: 10px;white-space: nowrap">توضیحات شکایت:</th>
<th style="font-size: 10px;white-space: nowrap">شماره تماس گیرنده :</th>
<th style="font-size: 10px;white-space: nowrap">تاریخ ثبت شکایت:</th>
</tr>
<tr class="section-preview-1-data">
<td>
@if ($roadProblemArray['province_name'])
{{ $roadProblemArray['province_name'] }}
@else
-
@endif
</td>
<td>
@if ($roadProblemArray['city_name'])
{{ $roadProblemArray['city_name'] }}
@else
-
@endif
</td>
<td>
@if ($roadProblemArray['title'])
{{ $roadProblemArray['title'] }}
@else
-
@endif
</td>
<td>
@if ($roadProblemArray['type'])
{{ $roadProblemArray['type'] }}
@else
-
@endif
</td>
<td>
@if ($roadProblemArray['description'])
{{ $roadProblemArray['description'] }}
@else
-
@endif
</td>
<td>
@if ($roadProblemArray['mobile'])
{{ $roadProblemArray['mobile'] }}
@else
-
@endif
</td>
<td>
@if ($roadProblemArray['date'])
{{ $roadProblemArray['date'] }}
@else
-
@endif
</td>
</tr>
</table>
</div>
</div>
<div class="template-section" style="margin: 0 0 10px 0">
<div class="section-title"> اقدامات صورت گرفته بر رفع موضوع مورد شکایت
</div>
<div class="section-table">
<table>
<tr>
<th style="background-color: #e8e8e8">تصویر پیش از اقدام:</th>
<th style="background-color: #e8e8e8">تصویر پس از اقدام:</th>
</tr>
<tr>
<td style="padding: 10px;min-height: 200px;width:50%;vertical-align: middle;"><img
src="{{ $roadProblemArray['images'][0] }}"
style="width: 75%;height: auto;display: block;margin-left: auto;margin-right: auto;"
alt="">
</td>
<td style="padding: 10px;min-height: 200px;width:50%;vertical-align: middle;"><img
src="{{ $roadProblemArray['images'][1] }}"
style="width: 75%;height: auto;display: block;margin-left: auto;margin-right: auto;"
alt="">
</td>
</tr>
</table>
</div>
</div>
<div class="template-section">
<div class="section-title"> نام و نام خانوادگی و امضا
</div>
<div class="section-table">
<table>
<tr>
<th style="width: 25%;">کارشناس:</th>
<th style="width: 25%;">رئیس اداره شهرستان:</th>
<td rowspan="2" style="text-align:right"><span
style="font-size: 11px;font-weight: 500;top: -55px;position: relative;">توضیحات:</span>
<div class="desc-data-str">
@if ($roadProblemArray['rms_description'])
{{ $roadProblemArray['rms_description'] }}
@else
-
@endif
</div>
</td>
<td style="width: 20%;text-align:right"><span style="font-size: 10px;font-weight: 500;">تاریخ
اقدام:</span>
<div class="desc-data-str" style="text-align: center;">
@if ($roadProblemArray['rms_last_activity'])
{{ $roadProblemArray['rms_last_activity'] }}
@else
-
@endif
</div>
</td>
</tr>
<tr>
<td style="height: 70px;"> </td>
<td style="height: 70px;"> </td>
<td style="width: 20%;text-align:right"><span
style="font-size: 10px;font-weight: 500;position: relative;">موقعیت
جغرافیایی محل اقدام:</span>
<div class="desc-data-str" style="text-align: center;">
@if ($roadProblemArray['rms_start_latlng'] && $roadProblemArray['rms_start_latlng'][0] && $roadProblemArray['rms_start_latlng'][1])
x: {{ $roadProblemArray['rms_start_latlng'][0] }}, y:
{{ $roadProblemArray['rms_start_latlng'][1] }}
@else
x: -, y: -
@endif
</div>
</td>
</tr>
</table>
</div>
</div>
</div>
</body>
<script src="/var/www/rms/public/dist/js/leaflet.js"></script>
<script src="/var/www/rms/public/dist/js/leaflet.markercluster.js"></script>
<script src="/var/www/rms/public/dist/js/leaflet-routing-machine.js"></script>
<script>
// var submited_complain= @json($roadProblemArray['rms_start_latlng'])
// var range_complain=@json($roadProblemArray['lat_lng'])
// console.log({roadProblemArray ,range_complain });
// var complaint_range_map=null;
// var submited_range_map=null;
// if (complaint_range_map == null) {
// setTimeout(() => {
// createLocationMap(row.data().h, row.data().g);
// }, 600);
// } else {
// setTimeout(() => {
// clearLocationMap(row.data().h, row.data().g);
// }, 600);
// }
</script>
</html>