2 changed files with 487 additions and 0 deletions
-
78src/main/java/com/feedback/it_asset/service/AssetDetailsService.java
-
409src/main/resources/templates/old-dashboard.html
@ -0,0 +1,78 @@ |
|||||
|
package com.feedback.it_asset.service; |
||||
|
|
||||
|
import java.sql.Connection; |
||||
|
import java.sql.DriverManager; |
||||
|
import java.sql.PreparedStatement; |
||||
|
import java.sql.SQLException; |
||||
|
|
||||
|
import org.springframework.stereotype.Service; |
||||
|
|
||||
|
|
||||
|
@Service |
||||
|
public class AssetDetailsService { |
||||
|
|
||||
|
|
||||
|
private static final String SOURCE_JDBC_URL = "jdbc:mysql://localhost:3306/gcc_asset_details"; |
||||
|
private static final String DESTINATION_JDBC_URL = "jdbc:mysql://localhost:3306/it_assets"; |
||||
|
private static final String SOURCE_USERNAME = "root"; |
||||
|
private static final String SOURCE_PASSWORD = "root"; |
||||
|
private static final String DESTINATION_USERNAME = "root"; |
||||
|
private static final String DESTINATION_PASSWORD = "root"; |
||||
|
|
||||
|
public void migrateData() { |
||||
|
try { |
||||
|
// Load the JDBC driver |
||||
|
Class.forName("com.mysql.cj.jdbc.Driver"); |
||||
|
|
||||
|
// Establish connections for source and destination databases |
||||
|
try ( |
||||
|
Connection sourceConnection = DriverManager.getConnection(SOURCE_JDBC_URL, SOURCE_USERNAME, SOURCE_PASSWORD); |
||||
|
Connection destinationConnection = DriverManager.getConnection(DESTINATION_JDBC_URL, DESTINATION_USERNAME, DESTINATION_PASSWORD) |
||||
|
) { |
||||
|
// SQL query to fetch data from the source schema |
||||
|
String sqlQuery = "SELECT ta.ASSET_ID, ta.ASSET_NO, td.DEPT_NAME, tl.LOC_NAME, tsu.SEC_USER_NAME " + |
||||
|
"FROM tbl_asset ta " + |
||||
|
"JOIN tbl_mas_dept td ON ta.DEPT_ID = td.DEPT_ID " + |
||||
|
"JOIN tbl_mas_loc tl ON ta.LOC_ID = tl.LOC_ID " + |
||||
|
"JOIN tbl_mas_sec_user tsu ON ta.SECUSER_ID = tsu.SEC_USER_ID "; |
||||
|
|
||||
|
|
||||
|
// Create a prepared statement for the source database |
||||
|
try (PreparedStatement preparedStatementSource = sourceConnection.prepareStatement(sqlQuery)) { |
||||
|
|
||||
|
// Execute the query in the source database |
||||
|
try (var resultSet = preparedStatementSource.executeQuery()) { |
||||
|
// SQL query to insert data into the destination schema for asset_data |
||||
|
String insertAssetDataQuery = "INSERT INTO gcc_asset_details (asset_id, asset_code, department_name, position, assign_person) VALUES (?, ?, ?, ?, ?)"; |
||||
|
|
||||
|
// SQL query to insert data into the destination schema for asset_category |
||||
|
// String insertAssetCategoryQuery = "INSERT INTO asset_category (category_name) VALUES (?)"; |
||||
|
|
||||
|
// Create prepared statements for the destination database |
||||
|
try (PreparedStatement preparedStatementDestinationAssetData = destinationConnection.prepareStatement(insertAssetDataQuery)) { |
||||
|
|
||||
|
// Process the result set and insert data into the destination schema |
||||
|
while (resultSet.next()) { |
||||
|
// Insert data into asset_data table |
||||
|
preparedStatementDestinationAssetData.setString(1, resultSet.getString("ASSET_ID")); |
||||
|
preparedStatementDestinationAssetData.setString(2, resultSet.getString("ASSET_NO")); |
||||
|
preparedStatementDestinationAssetData.setString(3, resultSet.getString("DEPT_NAME")); |
||||
|
preparedStatementDestinationAssetData.setString(4, resultSet.getString("LOC_NAME")); |
||||
|
preparedStatementDestinationAssetData.setString(5, resultSet.getString("SEC_USER_NAME")); |
||||
|
int rowsAffectedAssetData = preparedStatementDestinationAssetData.executeUpdate(); |
||||
|
System.out.println("Rows affected for asset_data: " + rowsAffectedAssetData); |
||||
|
|
||||
|
// Insert data into asset_category table |
||||
|
// preparedStatementDestinationAssetCategory.setString(1, resultSet.getString("category_name")); |
||||
|
// int rowsAffectedAssetCategory = preparedStatementDestinationAssetCategory.executeUpdate(); |
||||
|
// System.out.println("Rows affected for asset_category: " + rowsAffectedAssetCategory); |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
} catch (ClassNotFoundException | SQLException e) { |
||||
|
e.printStackTrace(); // Handle the exception appropriately |
||||
|
} |
||||
|
} |
||||
|
} |
||||
@ -0,0 +1,409 @@ |
|||||
|
<!doctype html> |
||||
|
<html xmlns:th="http://www.thymeleaf.org"> |
||||
|
<head th:replace="fragments/head :: head"></head> |
||||
|
|
||||
|
<body> |
||||
|
<!-- Page Container --> |
||||
|
<div id="page-container" class="sidebar-o sidebar-dark enable-page-overlay side-scroll page-header-fixed page-header-dark"> |
||||
|
<!-- Side Overlay aside (right)--> |
||||
|
<aside th:replace="fragments/aside-right :: aside"></aside> |
||||
|
<!-- END Side Overlay (right)--> |
||||
|
|
||||
|
<!-- Sidebar Nav--> |
||||
|
<nav th:replace="fragments/nav :: nav"></nav> |
||||
|
<!-- END Sidebar --> |
||||
|
|
||||
|
<!-- Header --> |
||||
|
<header th:replace="fragments/header :: header"></header> |
||||
|
<!-- END Header --> |
||||
|
|
||||
|
<!-- Main Container --> |
||||
|
<main id="main-container"> |
||||
|
<!-- Hero --> |
||||
|
<div class=""> |
||||
|
<div class="content content-full"> |
||||
|
<div class="d-flex flex-column flex-sm-row justify-content-sm-between align-items-sm-center"> |
||||
|
<h3 class="flex-grow-1 fs-5 fw-semibold my-2 my-sm-3">Welcome</h3> |
||||
|
<nav class="flex-shrink-0 my-2 my-sm-0 ms-sm-3" aria-label="breadcrumb"> |
||||
|
<ol class="breadcrumb"> |
||||
|
<li class="breadcrumb-item">Home</li> |
||||
|
<li class="breadcrumb-item active" aria-current="page">Dashboard</li> |
||||
|
</ol> |
||||
|
</nav> |
||||
|
</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
<!-- END Hero --> |
||||
|
|
||||
|
<!-- Page Content --> |
||||
|
<div class="content"> |
||||
|
<!-- Overview --> |
||||
|
<div class="row items-push"> |
||||
|
<div class="col-sm-6 col-xl-3"> |
||||
|
<div class="block block-rounded text-center d-flex flex-column h-100 mb-0"> |
||||
|
<div class="block-content block-content-full flex-grow-1"> |
||||
|
<div class="item rounded-3 bg-body mx-auto my-3"> |
||||
|
<i class="fa fa-qrcode fa-lg text-primary"></i> |
||||
|
</div> |
||||
|
<div class="fs-2 fw-bold text-success" th:utext="${totalAssets}">000</div> |
||||
|
<div class="text-muted mb-1 fs-5">Total Asset</div> |
||||
|
|
||||
|
</div> |
||||
|
<div class="block-content block-content-full block-content-sm bg-body-light fs-sm"> |
||||
|
<a class="fw-medium" href="/gcc-asset-list"> |
||||
|
View all Assets |
||||
|
<i class="fa fa-arrow-right ms-1 opacity-25"></i> |
||||
|
</a> |
||||
|
</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
<div class="col-sm-6 col-xl-3"> |
||||
|
<div class="block block-rounded text-center d-flex flex-column h-100 mb-0"> |
||||
|
<div class="block-content block-content-full flex-grow-1"> |
||||
|
<div class="item rounded-3 bg-body mx-auto my-3"> |
||||
|
<i class="fa fa-comments fa-lg text-primary"></i> |
||||
|
</div> |
||||
|
<div class="fs-2 fw-bold text-info" th:utext="${totalFeedbacks}">000</div> |
||||
|
<div class="text-muted mb-1 fs-5">Total Complaints</div> |
||||
|
|
||||
|
</div> |
||||
|
<div class="block-content block-content-full block-content-sm bg-body-light fs-sm"> |
||||
|
<a class="fw-medium" href="/complaint-list"> |
||||
|
View all Complaints |
||||
|
<i class="fa fa-arrow-right ms-1 opacity-25"></i> |
||||
|
</a> |
||||
|
</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
<div class="col-sm-6 col-xl-3"> |
||||
|
<div class="block block-rounded text-center d-flex flex-column h-100 mb-0"> |
||||
|
<div class="block-content block-content-full flex-grow-1"> |
||||
|
<div class="item rounded-3 bg-body mx-auto my-3"> |
||||
|
<i class="fa fa-thumbs-up fa-lg text-primary"></i> |
||||
|
</div> |
||||
|
<div class="fs-2 fw-bold text-success" th:utext="${totalYesFeedbacks}">000</div> |
||||
|
<div class="text-muted mb-1 fs-5">Total closed Complaints</div> |
||||
|
|
||||
|
</div> |
||||
|
<div class="block-content block-content-full block-content-sm bg-body-light fs-sm"> |
||||
|
<a class="fw-medium" href="/closed-complaint"> |
||||
|
View all Closed Complaints |
||||
|
<i class="fa fa-arrow-right ms-1 opacity-25"></i> |
||||
|
</a> |
||||
|
</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
<div class="col-sm-6 col-xl-3"> |
||||
|
<div class="block block-rounded text-center d-flex flex-column h-100 mb-0"> |
||||
|
<div class="block-content block-content-full"> |
||||
|
<div class="item rounded-3 bg-body mx-auto my-3"> |
||||
|
<i class="fa fa-thumbs-down fa-lg text-primary"></i> |
||||
|
</div> |
||||
|
<div class="fs-2 fw-bold text-warning" th:utext="${totalNoFeedbacks}">000</div> |
||||
|
<div class="text-muted mb-1 fs-5">Total Pending Complaints</div> |
||||
|
|
||||
|
</div> |
||||
|
<div class="block-content block-content-full block-content-sm bg-body-light fs-sm"> |
||||
|
<a class="fw-medium" href="/pending-complaint"> |
||||
|
View all Pending Complaint |
||||
|
<i class="fa fa-arrow-right ms-1 opacity-25"></i> |
||||
|
</a> |
||||
|
</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
<!-- END Overview --> |
||||
|
|
||||
|
<!-- Store Growth --> |
||||
|
<div class="block block-rounded"> |
||||
|
<div class="block-header block-header-default"> |
||||
|
<h3 class="block-title"> |
||||
|
Monthly Summary |
||||
|
</h3> |
||||
|
<div class="block-options"> |
||||
|
<button type="button" class="btn-block-option" data-toggle="block-option" data-action="state_toggle" data-action-mode="demo"> |
||||
|
<i class="si si-refresh"></i> |
||||
|
</button> |
||||
|
<button type="button" class="btn-block-option"> |
||||
|
<i class="si si-wrench"></i> |
||||
|
</button> |
||||
|
<button type="button" class="btn-block-option" id="reportrange"> |
||||
|
<span></span> |
||||
|
</button> |
||||
|
|
||||
|
</div> |
||||
|
</div> |
||||
|
<div class="block-content block-content-full"> |
||||
|
<div class="row"> |
||||
|
<div class="col-md-5 col-xl-4 d-md-flex align-items-md-center"> |
||||
|
<div class="p-md-2 p-lg-3"> |
||||
|
<div class="py-3"> |
||||
|
<div class="fs-1 fw-bold" th:utext="${totalFeedbacks}">000</div> |
||||
|
<div class="fw-semibold text-info">Total Complaints</div> |
||||
|
|
||||
|
</div> |
||||
|
<div class="py-3"> |
||||
|
<div class="fs-1 fw-bold" th:utext="${totalYesFeedbacks}">000</div> |
||||
|
<div class="fw-semibold text-success">Closed Complaints</div> |
||||
|
|
||||
|
</div> |
||||
|
<div class="py-3"> |
||||
|
<div class="fs-1 fw-bold" th:utext="${totalNoFeedbacks}">000</div> |
||||
|
<div class="fw-semibold text-warning">Pending Complaints</div> |
||||
|
|
||||
|
</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
<div class="col-md-7 col-xl-8 d-md-flex align-items-md-center"> |
||||
|
<div class="p-md-2 p-lg-3 w-100" style="height: 450px;"> |
||||
|
<!-- Bars Chart Container --> |
||||
|
<!-- Chart.js Chart is initialized in js/pages/be_pages_dashboard.min.js which was auto compiled from _js/pages/be_pages_dashboard.js --> |
||||
|
<!-- For more info and examples you can check out http://www.chartjs.org/docs/ --> |
||||
|
<canvas id="js-chartjs-analytics-bars"></canvas> |
||||
|
</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
<!-- END Store Growth --> |
||||
|
|
||||
|
<!-- Latest Orders + Stats --> |
||||
|
|
||||
|
<!-- END Latest Orders + Stats --> |
||||
|
</div> |
||||
|
<!-- END Page Content --> |
||||
|
</main> |
||||
|
<!-- END Main Container --> |
||||
|
|
||||
|
<!-- Footer --> |
||||
|
<footer th:replace="fragments/footer :: footer"></footer> |
||||
|
<!-- END Footer --> |
||||
|
</div> |
||||
|
<!-- END Page Container --> |
||||
|
|
||||
|
<!-- Scripts --> |
||||
|
<script th:replace="fragments/script :: script"></script> |
||||
|
<!-- Page JS Plugins --> |
||||
|
<script src="assets/js/plugins/chart.js/chart.umd.js"></script> |
||||
|
<!-- Include Date Range Picker --> |
||||
|
<script type="text/javascript" src="assets/js/plugins/bootstrap-daterangepicker/daterangepicker.js"></script> |
||||
|
<link rel="stylesheet" type="text/css" href="assets/js/plugins/bootstrap-daterangepicker/daterangepicker.css" /> |
||||
|
<script> |
||||
|
var dash; |
||||
|
function convert(){ |
||||
|
dash=/*[[${dashboard}]]*/{}; |
||||
|
} |
||||
|
convert(); |
||||
|
alert("hi board"); |
||||
|
console.log(dash); |
||||
|
// Chart.js Charts, for more examples you can check out http://www.chartjs.org/docs |
||||
|
class pageDashboard { |
||||
|
/* |
||||
|
* Init Charts |
||||
|
* |
||||
|
*/ |
||||
|
static initChartsBars() { |
||||
|
// Set Global Chart.js configuration |
||||
|
Chart.defaults.color = '#818d96'; |
||||
|
Chart.defaults.scale.grid.color = 'transparent'; |
||||
|
Chart.defaults.scale.grid.zeroLineColor = 'transparent'; |
||||
|
Chart.defaults.scale.beginAtZero = true; |
||||
|
Chart.defaults.elements.line.borderWidth = 1; |
||||
|
Chart.defaults.plugins.legend.labels.boxWidth = 12; |
||||
|
|
||||
|
// Get Chart Containers |
||||
|
let chartBarsCon = document.getElementById('js-chartjs-analytics-bars'); |
||||
|
|
||||
|
// Set Chart and Chart Data variables |
||||
|
let chartBars, chartLinesBarsData; |
||||
|
|
||||
|
// Bars Chart Data |
||||
|
chartLinesBarsData = { |
||||
|
//labels: ['MON', 'TUE', 'WED', 'THU', 'FRI', 'SAT', 'SUN'], |
||||
|
labels: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'], |
||||
|
|
||||
|
datasets: [ |
||||
|
{ |
||||
|
label: 'Total Complaints', |
||||
|
fill: true, |
||||
|
backgroundColor: '#c7d7e6', |
||||
|
borderColor: 'transparent', |
||||
|
pointBackgroundColor: '#c7d7e6', |
||||
|
pointBorderColor: '#fff', |
||||
|
pointHoverBackgroundColor: '#fff', |
||||
|
pointHoverBorderColor: '#c7d7e6', |
||||
|
data: [0, 0, 0, 1, 0, 0, 2] |
||||
|
}, |
||||
|
{ |
||||
|
label: 'Closed Complaint', |
||||
|
fill: true, |
||||
|
backgroundColor: '#c2d7ab', |
||||
|
borderColor: 'transparent', |
||||
|
pointBackgroundColor: '#c2d7ab', |
||||
|
pointBorderColor: '#fff', |
||||
|
pointHoverBackgroundColor: '#fff', |
||||
|
pointHoverBorderColor: '#c2d7ab', |
||||
|
data: [0, 0, 0, 1, 0, 0, 0] |
||||
|
}, |
||||
|
{ |
||||
|
label: 'Pending Complaint', |
||||
|
fill: true, |
||||
|
backgroundColor: '#e9cb91', |
||||
|
borderColor: 'transparent', |
||||
|
pointBackgroundColor: '#e9cb91', |
||||
|
pointBorderColor: '#fff', |
||||
|
pointHoverBackgroundColor: '#fff', |
||||
|
pointHoverBorderColor: '#e9cb91', |
||||
|
data: [0, 0, 0, 0, 0, 0, 2] |
||||
|
} |
||||
|
] |
||||
|
}; |
||||
|
|
||||
|
// Init Chart |
||||
|
if (chartBarsCon !== null) { |
||||
|
chartBars = new Chart(chartBarsCon, { |
||||
|
type: 'bar', |
||||
|
data: chartLinesBarsData, |
||||
|
options: { |
||||
|
responsive: true, |
||||
|
maintainAspectRatio: false, |
||||
|
plugins: { |
||||
|
tooltip: { |
||||
|
callbacks: { |
||||
|
label: function (context) { |
||||
|
return context.dataset.label + ': ' + context.parsed.y + ''; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
}); |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
/* |
||||
|
* Init functionality |
||||
|
* |
||||
|
*/ |
||||
|
static init() { |
||||
|
this.initChartsBars(); |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
// Initialize when page loads |
||||
|
Dashmix.onLoad(() => pageDashboard.init()); |
||||
|
|
||||
|
</script> |
||||
|
|
||||
|
<script type="text/javascript"> |
||||
|
$(function() { |
||||
|
|
||||
|
var start = moment().subtract(29, 'days'); |
||||
|
var end = moment(); |
||||
|
|
||||
|
function cb(start, end) { |
||||
|
$('#reportrange span').html(start.format('MMMM D, YYYY') + ' - ' + end.format('MMMM D, YYYY')); |
||||
|
} |
||||
|
|
||||
|
$('#reportrange').daterangepicker({ |
||||
|
startDate: start, |
||||
|
endDate: end, |
||||
|
ranges: { |
||||
|
'Today': [moment(), moment()], |
||||
|
'Yesterday': [moment().subtract(1, 'days'), moment().subtract(1, 'days')], |
||||
|
'Last 7 Days': [moment().subtract(6, 'days'), moment()], |
||||
|
'Last 30 Days': [moment().subtract(29, 'days'), moment()], |
||||
|
'This Month': [moment().startOf('month'), moment().endOf('month')], |
||||
|
'Last Month': [moment().subtract(1, 'month').startOf('month'), moment().subtract(1, 'month').endOf('month')] |
||||
|
} |
||||
|
}, cb); |
||||
|
|
||||
|
cb(start, end); |
||||
|
|
||||
|
}); |
||||
|
</script> |
||||
|
|
||||
|
<script type="text/javascript"> |
||||
|
//Chart Update data |
||||
|
/* static updateChartLinesBarsData(newData) { |
||||
|
// Update the chart data; |
||||
|
pageDashboard.chartLinesBarsData.datasets[0].data = newData.totalFeedbacks; |
||||
|
pageDashboard.chartLinesBarsData.datasets[1].data = newData.positiveFeedbacks; |
||||
|
pageDashboard.chartLinesBarsData.datasets[2].data = newData.negativeFeedbacks; |
||||
|
|
||||
|
// Update the chart |
||||
|
if (pageDashboard.chartBars !== undefined) { |
||||
|
pageDashboard.chartBars.data = pageDashboard.chartLinesBarsData; |
||||
|
pageDashboard.chartBars.update(); |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
function getAndpushdata(){ |
||||
|
$.ajax({ |
||||
|
url: 'api/dashboard', // Replace with the URL to fetch the updated data |
||||
|
method: 'GET', // Replace with the appropriate HTTP method |
||||
|
dataType: 'json', // Replace with the data type you are expecting |
||||
|
success: function (response) { |
||||
|
// Assuming the response contains the updated chart data in the expected format |
||||
|
pageDashboard.updateChartLinesBarsData(response); |
||||
|
}, |
||||
|
error: function (xhr, status, error) { |
||||
|
// Handle the error scenario |
||||
|
console.error('Error:', error); |
||||
|
} |
||||
|
}); |
||||
|
} */ |
||||
|
|
||||
|
|
||||
|
// Assuming pageDashboard is an object or class instance |
||||
|
var pageDashboard = { |
||||
|
chartLinesBarsData: { |
||||
|
datasets: [ |
||||
|
{ data: [] }, // Assuming totalFeedbacks is an array |
||||
|
{ data: [] }, // Assuming positiveFeedbacks is an array |
||||
|
{ data: [] } // Assuming negativeFeedbacks is an array |
||||
|
] |
||||
|
}, |
||||
|
chartBars: undefined, // Assuming chartBars is initially undefined |
||||
|
|
||||
|
updateChartLinesBarsData: function(newData) { |
||||
|
// Update the chart data |
||||
|
this.chartLinesBarsData.datasets[0].data = newData.totalFeedbacks; |
||||
|
this.chartLinesBarsData.datasets[1].data = newData.positiveFeedbacks; |
||||
|
this.chartLinesBarsData.datasets[2].data = newData.negativeFeedbacks; |
||||
|
|
||||
|
// Update the chart |
||||
|
if (this.chartBars !== undefined) { |
||||
|
this.chartBars.data = this.chartLinesBarsData; |
||||
|
this.chartBars.update(); |
||||
|
} |
||||
|
}, |
||||
|
|
||||
|
getAndPushData: function() { |
||||
|
var self = this; // Store a reference to the current object |
||||
|
|
||||
|
$.ajax({ |
||||
|
url: 'api/dashboard', // Replace with the URL to fetch the updated data |
||||
|
method: 'GET', // Replace with the appropriate HTTP method |
||||
|
dataType: 'json', // Replace with the data type you are expecting |
||||
|
success: function(response) { |
||||
|
// Assuming the response contains the updated chart data in the expected format |
||||
|
self.updateChartLinesBarsData(response); |
||||
|
}, |
||||
|
error: function(xhr, status, error) { |
||||
|
// Handle the error scenario |
||||
|
console.error('Error:', error); |
||||
|
} |
||||
|
}); |
||||
|
} |
||||
|
}; |
||||
|
|
||||
|
// Call the getAndPushData method to fetch and update chart data |
||||
|
pageDashboard.getAndPushData(); |
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
</script> |
||||
|
</body> |
||||
|
</html> |
||||
Write
Preview
Loading…
Cancel
Save
Reference in new issue