test mock data

This commit is contained in:
misya 2025-04-08 10:59:13 +08:00
parent e8a290c4e4
commit 5b0553527b
3 changed files with 87 additions and 83 deletions

View File

@ -8,6 +8,8 @@ namespace PSTW_CentralSystem.Areas.MMS.Controllers
{ {
[Area("MMS")] [Area("MMS")]
//testing from main laptop
//[Authorize(Policy = "RoleModulePolicy")] //[Authorize(Policy = "RoleModulePolicy")]
public class MarineController : Controller public class MarineController : Controller
{ {
@ -19,19 +21,19 @@ namespace PSTW_CentralSystem.Areas.MMS.Controllers
{ {
return View(); return View();
} }
// Generates and returns a Tar Ball Sampling Report PDF
public IActionResult GenerateReport() public IActionResult GenerateReport()
{ {
try try
{ {
var document = new TarBallPDF(); // Retrieve specific data based on the id, if required
var document = new TarBallPDF(); // Use id to customize the report if needed
var pdf = document.GeneratePdf(); var pdf = document.GeneratePdf();
var fileName = $"TarBallReport_{DateTime.Now:yyyyMMdd_HHmmss}.pdf"; var fileName = $"TarBallReport_{DateTime.Now:yyyyMMdd_HHmmss}.pdf";
return File(pdf, "application/pdf", fileName); return File(pdf, "application/pdf", fileName);
} }
catch (Exception ex) catch (Exception ex)
{ {
// Log the error (use a logger if configured)
Console.WriteLine(ex.Message); Console.WriteLine(ex.Message);
return StatusCode(StatusCodes.Status500InternalServerError, "An error occurred while generating the PDF. " + ex.Message); return StatusCode(StatusCodes.Status500InternalServerError, "An error occurred while generating the PDF. " + ex.Message);
} }
@ -41,20 +43,17 @@ namespace PSTW_CentralSystem.Areas.MMS.Controllers
{ {
try try
{ {
// Generate the PDF document // Retrieve specific data based on the id, if required
var document = new TarBallPDF(); var document = new TarBallPDF(); // Use id to customize the PDF if needed
var pdf = document.GeneratePdf(); var pdf = document.GeneratePdf();
// Return the PDF for inline viewing
return File(pdf, "application/pdf"); return File(pdf, "application/pdf");
} }
catch (Exception ex) catch (Exception ex)
{ {
// Log the error (use a logger if configured)
Console.WriteLine(ex.Message); Console.WriteLine(ex.Message);
return StatusCode(StatusCodes.Status500InternalServerError, "An error occurred while viewing the PDF. " + ex.Message); return StatusCode(StatusCodes.Status500InternalServerError, "An error occurred while viewing the PDF. " + ex.Message);
} }
} }
//ahbsf
} }
} }

View File

@ -7,9 +7,8 @@
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<title> <script src="https://cdn.jsdelivr.net/npm/vue@2.6.14"></script>
<h3>Tarball Report</h3> <title>Tarball Report</title>
</title>
<style> <style>
.container { .container {
width: 1200px; /* Approximate width for A4 aspect ratio */ width: 1200px; /* Approximate width for A4 aspect ratio */
@ -32,104 +31,109 @@
table { table {
width: 100%; width: 100%;
}
datatable {
width: 100%;
border-collapse: collapse; border-collapse: collapse;
border: 1px solid #ccc;
} }
tr { th, td {
border: 1px solid #ccc; border: 1px solid #ccc;
padding: 10px; padding: 10px;
} }
th{ .tbhead {
border: 1px solid #ccc;
padding:10px;
}
tbhead {
text-align: center; text-align: center;
} }
</style> </style>
</head> </head>
<!--to be updated later for user input,db connection, etc-->
<body> <body>
<div class="container"> <div id="app" class="container">
<div> <div>
<h4>Month</h4> <h4>Month</h4>
<select name="month" id="month" style="width: 100%; padding: 5px;"> <select v-model="selectedMonth" style="width: 100%; padding: 5px;">
<option value="default" selected disabled>Filter by Month</option> <option value="default" selected disabled>Filter by Month</option>
<option value="january">January</option> <option v-for="month in months" :value="month">{{ month }}</option>
<option value="february">February</option>
<option value="march">March</option>
<option value="april">April</option>
<option value="may">May</option>
<option value="june">June</option>
<option value="july">July</option>
<option value="august">August</option>
<option value="september">September</option>
<option value="october">October</option>
<option value="november">November</option>
<option value="december">December</option>
</select> </select>
<h4>Year</h4> <h4>Year</h4>
<select name="year" id="year" style="width: 100%; padding: 5px;"> <select v-model="selectedYear" style="width: 100%; padding: 5px;">
<option value="default" selected disabled>Filter by Year</option> <option value="default" selected disabled>Filter by Year</option>
<option value="January">January</option> <option v-for="year in years" :value="year">{{ year }}</option>
<!--based on database?-->
</select> </select>
</div> </div>
<div class="datatable"> <div class="datatable">
<table> <table>
<tr class="tbhead"> <thead>
<th>???</th> <tr>
<th>No.</th>
<th>Date</th> <th>Date</th>
<th>Station</th> <th>Station</th>
<th>Approval Status</th> <th>Approval Status</th>
<th>PDF</th> <th>PDF</th>
</tr> </tr>
<tr> </thead>
<th></th> <tbody>
<th></th> <tr v-for="data in numberedData" :key="data.no">
<th></th> <td>{{ data.no }}</td>
<th> <td>{{ data.date }}</td>
<td>{{ data.station }}</td>
<td>
<button class="btn btn-success">Approve</button> <button class="btn btn-success">Approve</button>
<button class="btn btn-danger">Reject</button> <button class="btn btn-danger">Reject</button>
</th> </td>
<th> <td>
<a href="/MMS/Marine/ViewPDF" class="btn btn-primary" target="_blank">View PDF</a> <a href="/MMS/Marine/ViewPDF" class="btn btn-primary" target="_blank">View PDF</a>
<a href="/MMS/Marine/GenerateReport" class="btn btn-primary">Download PDF</a> <a href="/MMS/Marine/GenerateReport" class="btn btn-primary">Download PDF</a>
</th> </td>
</tr> </tr>
</tbody>
</table> </table>
</div> </div>
</div> <!--CONTAINER END--> </div>
</body> </body>
<!--TESTING-->
</html> </html>
@section Scripts{ @section Scripts{
<script> <script>
document.addEventListener("DOMContentLoaded", function () { new Vue({
const monthDropdown = document.getElementById("month"); el: '#app',
const yearDropdown = document.getElementById("year"); data: {
selectedMonth: '',
selectedYear: '',
months: [
'January', 'February', 'March', 'April', 'May',
'June', 'July', 'August', 'September',
'October', 'November', 'December'
],
mockData: [
{ date: '2023-01-15', station: 'Station A' },
{ date: '2024-02-20', station: 'Station B' },
{ date: '2023-03-10', station: 'Station C' },
{ date: '2025-04-05', station: 'Station A' },
{ date: '2023-05-18', station: 'Station B' },
{ date: '2024-06-11', station: 'Station C' },
{ date: '2025-07-23', station: 'Station A' },
{ date: '2023-08-09', station: 'Station B' },
{ date: '2024-09-25', station: 'Station C' },
{ date: '2025-10-14', station: 'Station A' }
]
},
computed: {
years() {
const allYears = this.mockData.map(data => new Date(data.date).getFullYear());
const minYear = Math.min(...allYears);
const maxYear = Math.max(...allYears);
return Array.from({ length: maxYear - minYear + 1 }, (_, i) => (minYear + i).toString());
},
monthDropdown.addEventListener("change", filterData); //increment for 'no.' column
yearDropdown.addEventListener("change", filterData); numberedData() {
return this.mockData.map((data, index) => ({
function filterData() { no: index + 1,
const selectedMonth = monthDropdown.value; ...data
const selectedYear = yearDropdown.value; }));
}
console.log("Selected Month:", selectedMonth);
console.log("Selected Year:", selectedYear);
// Logic for updating or sorting data goes here
} }
}); });
</script> </script>

View File

@ -497,6 +497,7 @@
<i class="mdi mdi-view-dashboard"></i><span class="hide-menu">Inventory Report</span> <i class="mdi mdi-view-dashboard"></i><span class="hide-menu">Inventory Report</span>
</a> </a>
</li> </li>
<!--MMS-->
<li class="sidebar-item"> <li class="sidebar-item">
<a class="sidebar-link has-arrow waves-effect waves-dark" <a class="sidebar-link has-arrow waves-effect waves-dark"
href="javascript:void(0)" aria-expanded="false"> href="javascript:void(0)" aria-expanded="false">