test mock data
This commit is contained in:
parent
e8a290c4e4
commit
5b0553527b
@ -8,6 +8,8 @@ namespace PSTW_CentralSystem.Areas.MMS.Controllers
|
||||
{
|
||||
[Area("MMS")]
|
||||
|
||||
//testing from main laptop
|
||||
|
||||
//[Authorize(Policy = "RoleModulePolicy")]
|
||||
public class MarineController : Controller
|
||||
{
|
||||
@ -19,21 +21,21 @@ namespace PSTW_CentralSystem.Areas.MMS.Controllers
|
||||
{
|
||||
return View();
|
||||
}
|
||||
// Generates and returns a Tar Ball Sampling Report PDF
|
||||
|
||||
public IActionResult GenerateReport()
|
||||
{
|
||||
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 fileName = $"TarBallReport_{DateTime.Now:yyyyMMdd_HHmmss}.pdf";
|
||||
return File(pdf, "application/pdf", fileName);
|
||||
}
|
||||
catch (Exception ex)
|
||||
{
|
||||
// Log the error (use a logger if configured)
|
||||
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
|
||||
{
|
||||
// Generate the PDF document
|
||||
var document = new TarBallPDF();
|
||||
// Retrieve specific data based on the id, if required
|
||||
var document = new TarBallPDF(); // Use id to customize the PDF if needed
|
||||
var pdf = document.GeneratePdf();
|
||||
|
||||
// Return the PDF for inline viewing
|
||||
return File(pdf, "application/pdf");
|
||||
}
|
||||
catch (Exception ex)
|
||||
{
|
||||
// Log the error (use a logger if configured)
|
||||
Console.WriteLine(ex.Message);
|
||||
return StatusCode(StatusCodes.Status500InternalServerError, "An error occurred while viewing the PDF. " + ex.Message);
|
||||
}
|
||||
}
|
||||
//ahbsf
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
@ -7,9 +7,8 @@
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>
|
||||
<h3>Tarball Report</h3>
|
||||
</title>
|
||||
<script src="https://cdn.jsdelivr.net/npm/vue@2.6.14"></script>
|
||||
<title>Tarball Report</title>
|
||||
<style>
|
||||
.container {
|
||||
width: 1200px; /* Approximate width for A4 aspect ratio */
|
||||
@ -31,105 +30,110 @@
|
||||
}
|
||||
|
||||
table {
|
||||
width:100%;
|
||||
}
|
||||
|
||||
datatable {
|
||||
width: 100%;
|
||||
border-collapse: collapse;
|
||||
border: 1px solid #ccc;
|
||||
}
|
||||
|
||||
tr {
|
||||
th, td {
|
||||
border: 1px solid #ccc;
|
||||
padding:10px;
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
th{
|
||||
border: 1px solid #ccc;
|
||||
padding:10px;
|
||||
}
|
||||
|
||||
tbhead {
|
||||
text-align:center;
|
||||
.tbhead {
|
||||
text-align: center;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<!--to be updated later for user input,db connection, etc-->
|
||||
<body>
|
||||
<div class="container">
|
||||
<div id="app" class="container">
|
||||
<div>
|
||||
<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="january">January</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>
|
||||
<option v-for="month in months" :value="month">{{ month }}</option>
|
||||
</select>
|
||||
|
||||
<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="January">January</option>
|
||||
<!--based on database?-->
|
||||
<option v-for="year in years" :value="year">{{ year }}</option>
|
||||
</select>
|
||||
</div>
|
||||
|
||||
<div class="datatable">
|
||||
<table>
|
||||
<tr class="tbhead">
|
||||
<th>???</th>
|
||||
<thead>
|
||||
<tr>
|
||||
<th>No.</th>
|
||||
<th>Date</th>
|
||||
<th>Station</th>
|
||||
<th>Approval Status</th>
|
||||
<th>PDF</th>
|
||||
</tr>
|
||||
<tr>
|
||||
<th></th>
|
||||
<th></th>
|
||||
<th></th>
|
||||
<th>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr v-for="data in numberedData" :key="data.no">
|
||||
<td>{{ data.no }}</td>
|
||||
<td>{{ data.date }}</td>
|
||||
<td>{{ data.station }}</td>
|
||||
|
||||
<td>
|
||||
<button class="btn btn-success">Approve</button>
|
||||
<button class="btn btn-danger">Reject</button>
|
||||
</th>
|
||||
<th>
|
||||
</td>
|
||||
<td>
|
||||
<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>
|
||||
</th>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div> <!--CONTAINER END-->
|
||||
</div>
|
||||
</body>
|
||||
<!--TESTING-->
|
||||
</html>
|
||||
|
||||
@section Scripts {
|
||||
@section Scripts{
|
||||
|
||||
<script>
|
||||
document.addEventListener("DOMContentLoaded", function () {
|
||||
const monthDropdown = document.getElementById("month");
|
||||
const yearDropdown = document.getElementById("year");
|
||||
new Vue({
|
||||
el: '#app',
|
||||
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);
|
||||
yearDropdown.addEventListener("change", filterData);
|
||||
|
||||
function filterData() {
|
||||
const selectedMonth = monthDropdown.value;
|
||||
const selectedYear = yearDropdown.value;
|
||||
|
||||
console.log("Selected Month:", selectedMonth);
|
||||
console.log("Selected Year:", selectedYear);
|
||||
// Logic for updating or sorting data goes here
|
||||
//increment for 'no.' column
|
||||
numberedData() {
|
||||
return this.mockData.map((data, index) => ({
|
||||
no: index + 1,
|
||||
...data
|
||||
}));
|
||||
}
|
||||
}
|
||||
});
|
||||
</script>
|
||||
|
||||
@ -497,6 +497,7 @@
|
||||
<i class="mdi mdi-view-dashboard"></i><span class="hide-menu">Inventory Report</span>
|
||||
</a>
|
||||
</li>
|
||||
<!--MMS-->
|
||||
<li class="sidebar-item">
|
||||
<a class="sidebar-link has-arrow waves-effect waves-dark"
|
||||
href="javascript:void(0)" aria-expanded="false">
|
||||
|
||||
Loading…
Reference in New Issue
Block a user