新增管理者模式
This commit is contained in:
parent
0e983cca4f
commit
3f9d7f5a4a
31
Parking_spaces/Controllers/ManagerController.cs
Normal file
31
Parking_spaces/Controllers/ManagerController.cs
Normal file
@ -0,0 +1,31 @@
|
||||
using Microsoft.AspNetCore.Mvc;
|
||||
|
||||
namespace Parking_spaces.Controllers
|
||||
{
|
||||
public class ManagerController : Controller
|
||||
{
|
||||
public IActionResult Manager_Index()
|
||||
{
|
||||
return View();
|
||||
}
|
||||
public IActionResult Manager_Violation()
|
||||
{
|
||||
return View();
|
||||
}
|
||||
public IActionResult Single_violation_detail(string id)
|
||||
{
|
||||
ViewBag.parking_spaces_name = id;
|
||||
return View();
|
||||
}
|
||||
|
||||
public IActionResult Yuntech_in_car()
|
||||
{
|
||||
return View();
|
||||
}
|
||||
|
||||
public IActionResult Map_RTSP(string id)
|
||||
{
|
||||
return View();
|
||||
}
|
||||
}
|
||||
}
|
531
Parking_spaces/Views/Manager/Manager_Index.cshtml
Normal file
531
Parking_spaces/Views/Manager/Manager_Index.cshtml
Normal file
@ -0,0 +1,531 @@
|
||||
|
||||
@{
|
||||
ViewData["Title"] = "Manager_Index";
|
||||
Layout = "~/Views/Shared/_Layout_Manager.cshtml";
|
||||
}
|
||||
|
||||
<h1>管理員模式</h1>
|
||||
|
||||
|
||||
|
||||
<div class="row">
|
||||
<!--每日違規數量-->
|
||||
<div class="col-xl-6 col-lg-6">
|
||||
<div class="card shadow mb-8">
|
||||
<div class="card-header py-3">
|
||||
<h6 class="m-0 font-weight-bold text-primary">
|
||||
每日違規數量
|
||||
<button class="btn btn-info btn-circle btn-sm" style="float:right; background-image: url('/image/icon/F5.png'); background-size: cover;" onclick="get_violation_data_1()"></button>
|
||||
</h6>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<div class="chart-bar">
|
||||
<canvas id="violation_car_Bar"></canvas>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!--每日車流量-->
|
||||
<div class="col-xl-6 col-lg-6">
|
||||
<div class="card shadow mb-8">
|
||||
<div class="card-header py-3">
|
||||
<h6 class="m-0 font-weight-bold text-primary">
|
||||
每日車流量<button class="btn btn-info btn-circle btn-sm" style="float:right; background-image: url('/image/icon/F5.png'); background-size: cover;" onclick="get_in_yuntech_data_1()"></button>
|
||||
</h6>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<div class="chart-area">
|
||||
<canvas id="in_car_Bar"></canvas>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<br />
|
||||
|
||||
|
||||
<script src="/bootstrap_1/vendor/chart.js/Chart.min.js"></script>
|
||||
|
||||
<!--設定數據圖數據-每日車流量-->
|
||||
<script>
|
||||
function set_in_yuntech_table(labels, dailyTrafficData) {
|
||||
date = JSON.parse(JSON.stringify(labels));
|
||||
values = JSON.parse(JSON.stringify(dailyTrafficData));
|
||||
// 假設你有一些資料,例如每日車流量
|
||||
var dailyTrafficData = dailyTrafficData
|
||||
|
||||
// 取得 canvas 元素
|
||||
var ctx1 = document.getElementById('in_car_Bar')
|
||||
|
||||
|
||||
// 使用 Chart.js 繪製長條圖
|
||||
var myLineChart = new Chart(ctx1, {
|
||||
type: 'line',
|
||||
data: {
|
||||
labels: date.reverse(),
|
||||
datasets: [{
|
||||
label: '車流量',
|
||||
data: values.reverse(),
|
||||
backgroundColor: 'rgba(75, 192, 192, 0.2)', // 設定背景色
|
||||
borderColor: 'rgba(75, 192, 192, 1)', // 設定邊框色
|
||||
pointHitRadius: 10,
|
||||
pointBorderWidth: 2,
|
||||
ineTension: 0.3,
|
||||
pointRadius: 3,
|
||||
pointHoverRadius: 3,
|
||||
}]
|
||||
},
|
||||
options: {
|
||||
responsive: true, // 啟用 responsive 設置
|
||||
maintainAspectRatio: false, // 保持長寬比例
|
||||
scales: {
|
||||
y: {
|
||||
beginAtZero: true
|
||||
},
|
||||
xAxes: {
|
||||
gridLines: {
|
||||
display: false // 移除 x 軸的網格線
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
|
||||
}
|
||||
|
||||
function set_in_yuntech_table_1(labels, dailyTrafficData) {
|
||||
date = JSON.parse(JSON.stringify(labels));
|
||||
values = JSON.parse(JSON.stringify(dailyTrafficData));
|
||||
// 假設你有一些資料,例如每日車流量
|
||||
var dailyTrafficData = dailyTrafficData
|
||||
|
||||
// 取得 canvas 元素
|
||||
var ctx = document.getElementById('in_car_Bar')
|
||||
|
||||
|
||||
// 使用 Chart.js 繪製長條圖
|
||||
var myBarChart = new Chart(ctx, {
|
||||
type: 'bar',
|
||||
data: {
|
||||
labels: date.reverse(),
|
||||
datasets: [{
|
||||
label: '車流量',
|
||||
data: values.reverse(),
|
||||
backgroundColor: 'rgba(75, 192, 192, 0.2)', // 設定背景色
|
||||
borderColor: 'rgba(75, 192, 192, 1)', // 設定邊框色
|
||||
borderWidth: 1
|
||||
}]
|
||||
},
|
||||
options: {
|
||||
responsive: true, // 啟用 responsive 設置
|
||||
maintainAspectRatio: false, // 保持長寬比例
|
||||
scales: {
|
||||
y: {
|
||||
beginAtZero: true
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
|
||||
}
|
||||
|
||||
|
||||
</script>
|
||||
|
||||
<!--設定數據圖數據-每日違規數量-->
|
||||
<script>
|
||||
function set_violation_table(labels, dailyTrafficData) {
|
||||
|
||||
date = JSON.parse(JSON.stringify(labels));
|
||||
values = JSON.parse(JSON.stringify(dailyTrafficData));
|
||||
// 假設你有一些資料,例如每日違規數量
|
||||
var dailyTrafficData = dailyTrafficData;
|
||||
|
||||
// 取得 canvas 元素
|
||||
var ctx = document.getElementById('violation_car_Bar')
|
||||
|
||||
|
||||
|
||||
// 使用 Chart.js 繪製長條圖
|
||||
var myBarChart = new Chart(ctx, {
|
||||
type: 'bar',
|
||||
data: {
|
||||
labels: date.reverse(),
|
||||
datasets: [{
|
||||
label: '違規數量',
|
||||
data: values.reverse(),
|
||||
backgroundColor: 'rgba(255, 0, 0, 0.5)', // 設定半透明的紅色背景
|
||||
borderColor: 'rgba(255, 0, 0, 1)', // 設定不透明的紅色邊框
|
||||
borderWidth: 1
|
||||
}]
|
||||
},
|
||||
options: {
|
||||
responsive: true, // 啟用 responsive 設置
|
||||
maintainAspectRatio: false, // 保持長寬比例
|
||||
scales: {
|
||||
y: {
|
||||
beginAtZero: true
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
</script>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<!--獲取資料-->
|
||||
<script>
|
||||
function get_data(){
|
||||
console.log("GET")
|
||||
get_violation_data_1()
|
||||
get_in_yuntech_data_1()
|
||||
|
||||
}
|
||||
</script>
|
||||
|
||||
<!--獲取違規資料-->
|
||||
<script>
|
||||
var token_ckeck //= document.getElementById("token_ckeck_id").value
|
||||
var position //職位
|
||||
function get_violation_data_1() {
|
||||
violation_car_list = []
|
||||
//console.log("start")
|
||||
//token_check = document.getElementById("token_check_id").value
|
||||
//console.log(token_check)
|
||||
$.ajax({
|
||||
type: "GET",
|
||||
url: "http://140.125.20.183:7700/api/Parking_spaces_violation_total_table",
|
||||
data: {},
|
||||
contentType: "application/json",
|
||||
success: function (Model) {
|
||||
get_violation_data_2(Model)
|
||||
|
||||
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function get_violation_data_2(Model) {
|
||||
if (Model.length > 0) {
|
||||
for (var i = 0; i < Model.length; i++) {
|
||||
var name = Model[i].parking_spaces_violation_name
|
||||
////console.log(name)
|
||||
$.ajax({
|
||||
type: "GET",
|
||||
url: "http://140.125.20.183:7700/api/Violation_car_table/violation_location_name-" + name,
|
||||
data: {},
|
||||
contentType: "application/json",
|
||||
success: function (Model) {
|
||||
set_violation_data_1(Model)
|
||||
|
||||
}
|
||||
});
|
||||
|
||||
}
|
||||
}
|
||||
set_violation_data_3()
|
||||
|
||||
}
|
||||
</script>
|
||||
|
||||
<!--設置違規資料-->
|
||||
<script>
|
||||
var date_list = []
|
||||
var violation_car_list = []
|
||||
|
||||
function set_violation_data_1(Model) {
|
||||
// 獲取當前日期
|
||||
var today = new Date();
|
||||
// 提取年、月、日
|
||||
var year = today.getFullYear();
|
||||
var month = today.getMonth() + 1; // 注意:月份是從 0 開始的,所以需要加 1
|
||||
var day = today.getDate();
|
||||
// 將月份和日期補零,以確保是兩位數
|
||||
month = month < 10 ? '0' + month : month;
|
||||
day = day < 10 ? '0' + day : day;
|
||||
// 構建日期字符串,格式:YYYY-MM-DD
|
||||
var todayDate = year + '-' + month + '-' + day;
|
||||
|
||||
if (Model.length > 0) {
|
||||
var D = ""
|
||||
for (var i = 0; i < Model.length; i++) {
|
||||
// 假設你有一個包含日期時間的字符串
|
||||
var dateTimeString = Model[i].create_data_time;
|
||||
// 將字符串轉換為 Date 對象
|
||||
var dateTime = new Date(dateTimeString);
|
||||
// 提取日期部分
|
||||
var year = dateTime.getFullYear();
|
||||
var month = dateTime.getMonth() + 1; // 月份是從 0 開始的,所以要加 1
|
||||
var day = dateTime.getDate();
|
||||
// 將月份和日期補零,以確保是兩位數
|
||||
month = month < 10 ? '0' + month : month;
|
||||
day = day < 10 ? '0' + day : day;
|
||||
|
||||
// 構建日期字符串,格式:YYYY-MM-DD
|
||||
var date = year + '-' + month + '-' + day;
|
||||
|
||||
// 將字符串轉換為 Date 對象
|
||||
var startDate = new Date(date);
|
||||
var endDate = new Date(todayDate);
|
||||
// 計算天數差
|
||||
var timeDifference = endDate - startDate;
|
||||
|
||||
var daysDifference = Math.floor(timeDifference / (1000 * 60 * 60 * 24));// 轉換為天數(毫秒 / 1000 / 60 / 60 / 24)
|
||||
|
||||
if (daysDifference > 29) {
|
||||
console.log(date_list)
|
||||
break
|
||||
}
|
||||
|
||||
if (D != date) {
|
||||
D = date
|
||||
var D_1 = new Date(D);
|
||||
var MD = D_1.toLocaleDateString('en-US', { month: '2-digit', day: '2-digit' });
|
||||
var hasValue = date_list.includes(MD);
|
||||
if (hasValue == false) {
|
||||
date_list.push(MD)
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
//console.log(date_list)
|
||||
set_violation_data_2(Model)
|
||||
}
|
||||
|
||||
function set_violation_data_2(Model) {
|
||||
if (date_list.length > 0 && violation_car_list.length <= 0) {
|
||||
for (var i = 0; i < date_list.length; i++) {
|
||||
violation_car_list.push(0)
|
||||
}
|
||||
}
|
||||
|
||||
var today = new Date();
|
||||
var year = today.getFullYear();
|
||||
var month = today.getMonth() + 1; // 注意:月份是從 0 開始的,所以需要加 1
|
||||
var day = today.getDate();
|
||||
month = month < 10 ? '0' + month : month;
|
||||
day = day < 10 ? '0' + day : day;
|
||||
var todayDate = year + '-' + month + '-' + day;
|
||||
|
||||
if (Model.length > 0) {
|
||||
var D = ""
|
||||
for (var i = 0; i < Model.length; i++) {
|
||||
// 假設你有一個包含日期時間的字符串
|
||||
var dateTimeString = Model[i].create_data_time;
|
||||
// 將字符串轉換為 Date 對象
|
||||
var dateTime = new Date(dateTimeString);
|
||||
// 提取日期部分
|
||||
var year = dateTime.getFullYear();
|
||||
var month = dateTime.getMonth() + 1; // 月份是從 0 開始的,所以要加 1
|
||||
var day = dateTime.getDate();
|
||||
// 將月份和日期補零,以確保是兩位數
|
||||
month = month < 10 ? '0' + month : month;
|
||||
day = day < 10 ? '0' + day : day;
|
||||
|
||||
// 構建日期字符串,格式:YYYY-MM-DD
|
||||
var date = year + '-' + month + '-' + day;
|
||||
|
||||
// 將字符串轉換為 Date 對象
|
||||
var startDate = new Date(date);
|
||||
var endDate = new Date(todayDate);
|
||||
// 計算天數差
|
||||
var timeDifference = endDate - startDate;
|
||||
|
||||
var daysDifference = Math.floor(timeDifference / (1000 * 60 * 60 * 24));// 轉換為天數(毫秒 / 1000 / 60 / 60 / 24)
|
||||
////console.log(daysDifference)
|
||||
if (daysDifference > date_list.length) {
|
||||
break
|
||||
}
|
||||
var D_1 = new Date(date);
|
||||
var MD = D_1.toLocaleDateString('en-US', { month: '2-digit', day: '2-digit' });
|
||||
var index = date_list.indexOf(MD);
|
||||
////console.log(index)
|
||||
violation_car_list[index] = violation_car_list[index] + 1
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
function set_violation_data_3() {
|
||||
// 等待 2000 毫秒(2 秒)
|
||||
setTimeout(function () {
|
||||
set_violation_table(date_list, violation_car_list)
|
||||
}, 200);
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
|
||||
|
||||
<!--獲取進入雲科資料-->
|
||||
<script>
|
||||
function get_in_yuntech_data_1() {
|
||||
in_car_list = []
|
||||
//console.log(token_check)
|
||||
$.ajax({
|
||||
type: "GET",
|
||||
url: "http://140.125.20.183:7700/api/Yuntech_in_car_table",
|
||||
data: {},
|
||||
contentType: "application/json",
|
||||
success: function (Model) {
|
||||
//console.log(Model)
|
||||
setTimeout(function () {
|
||||
set_in_yuntech_data_1(Model)
|
||||
}, 200);
|
||||
|
||||
|
||||
}
|
||||
});
|
||||
}
|
||||
</script>
|
||||
|
||||
<!--設置進入雲科資料-->
|
||||
<script>
|
||||
var in_car_list = []
|
||||
function set_in_yuntech_data_1(Model) {
|
||||
if (date_list.length > 0 && in_car_list.length <= 0) {
|
||||
for (var i = 0; i < date_list.length; i++) {
|
||||
in_car_list.push(0)
|
||||
}
|
||||
}
|
||||
console.log(in_car_list)
|
||||
var today = new Date();
|
||||
var year = today.getFullYear();
|
||||
var month = today.getMonth() + 1; // 注意:月份是從 0 開始的,所以需要加 1
|
||||
var day = today.getDate();
|
||||
month = month < 10 ? '0' + month : month;
|
||||
day = day < 10 ? '0' + day : day;
|
||||
var todayDate = year + '-' + month + '-' + day;
|
||||
|
||||
if (Model.length > 0) {
|
||||
var D = ""
|
||||
for (var i = 0; i < Model.length; i++) {
|
||||
// 假設你有一個包含日期時間的字符串
|
||||
var dateTimeString = Model[i].in_time;
|
||||
// 將字符串轉換為 Date 對象
|
||||
var dateTime = new Date(dateTimeString);
|
||||
// 提取日期部分
|
||||
var year = dateTime.getFullYear();
|
||||
var month = dateTime.getMonth() + 1; // 月份是從 0 開始的,所以要加 1
|
||||
var day = dateTime.getDate();
|
||||
// 將月份和日期補零,以確保是兩位數
|
||||
month = month < 10 ? '0' + month : month;
|
||||
day = day < 10 ? '0' + day : day;
|
||||
|
||||
// 構建日期字符串,格式:YYYY-MM-DD
|
||||
var date = year + '-' + month + '-' + day;
|
||||
|
||||
// 將字符串轉換為 Date 對象
|
||||
var startDate = new Date(date);
|
||||
var endDate = new Date(todayDate);
|
||||
// 計算天數差
|
||||
var timeDifference = endDate - startDate;
|
||||
|
||||
var daysDifference = Math.floor(timeDifference / (1000 * 60 * 60 * 24));// 轉換為天數(毫秒 / 1000 / 60 / 60 / 24)
|
||||
////console.log(daysDifference)
|
||||
if (daysDifference > date_list.length) {
|
||||
break
|
||||
}
|
||||
var D_1 = new Date(date);
|
||||
var MD = D_1.toLocaleDateString('en-US', { month: '2-digit', day: '2-digit' });
|
||||
var index = date_list.indexOf(MD);
|
||||
////console.log(index)
|
||||
in_car_list[index] = in_car_list[index] + 1
|
||||
|
||||
}
|
||||
set_in_yuntech_data_3()
|
||||
}
|
||||
|
||||
}
|
||||
function set_in_yuntech_data_3() {
|
||||
set_in_yuntech_table(date_list, in_car_list)
|
||||
|
||||
}
|
||||
</script>
|
||||
|
||||
|
||||
|
||||
<!--檢查token-->
|
||||
<script>
|
||||
function token_check() {
|
||||
// 检查本地存储中是否存在JWT令牌
|
||||
var token = localStorage.getItem('token_park_space');
|
||||
//console.log(token)
|
||||
$.ajax({
|
||||
type: "GET",
|
||||
url: 'http://140.125.20.183:7700/Users/token_check',
|
||||
headers: {
|
||||
'Authorization': token
|
||||
},
|
||||
success: function (response) {
|
||||
//console.log(response)
|
||||
token_check = "true"
|
||||
from_token_import_id()
|
||||
},
|
||||
error: function (xhr) {
|
||||
token_check = "false"
|
||||
window.location.href = '/';
|
||||
// 处理错误响应,例如跳转到未授权页面
|
||||
//window.location.href = 'https://example.com/unauthorized_page';
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function from_token_import_id() {
|
||||
var token = localStorage.getItem('token_park_space');
|
||||
$.ajax({
|
||||
type: "GET",
|
||||
url: 'http://140.125.20.183:7700/Users/token-' + token,
|
||||
headers: {
|
||||
'Authorization': token
|
||||
},
|
||||
success: function (response) {
|
||||
//console.log(response)
|
||||
from_id_import_user_data(response)
|
||||
|
||||
|
||||
}
|
||||
});
|
||||
}
|
||||
function from_id_import_user_data(id) {
|
||||
var token = localStorage.getItem('token_park_space');
|
||||
$.ajax({
|
||||
type: "GET",
|
||||
url: 'http://140.125.20.183:7700/Users/user_id-' + id,
|
||||
headers: {
|
||||
'Authorization': token
|
||||
},
|
||||
success: function (model) {
|
||||
model = model.result
|
||||
position = model.lastname
|
||||
console.log(position)
|
||||
if (position == "manager") {
|
||||
get_data()
|
||||
}
|
||||
else {
|
||||
window.location.href = '/';
|
||||
}
|
||||
|
||||
}
|
||||
});
|
||||
}
|
||||
</script>
|
||||
|
||||
<!--開機自啟-->
|
||||
<script>
|
||||
window.onload = token_check;
|
||||
</script>
|
||||
|
||||
|
552
Parking_spaces/Views/Manager/Manager_Violation.cshtml
Normal file
552
Parking_spaces/Views/Manager/Manager_Violation.cshtml
Normal file
@ -0,0 +1,552 @@
|
||||
|
||||
@{
|
||||
ViewData["Title"] = "Manager_Violation";
|
||||
Layout = "~/Views/Shared/_Layout_Manager.cshtml";
|
||||
}
|
||||
|
||||
<h1>校園總違規區域</h1>
|
||||
|
||||
<div class="size2">
|
||||
<button class="btn btn-primary" onclick="add_violation_view.showModal();map_show_1()" id="add_violation_id">新增違規區域</button>
|
||||
<!--<button class="btn btn-primary" onclick="add_park_space_view.showModal();map_show()" id="add_park_space_id">新增停車區</button>
|
||||
<button class="btn btn-primary" onclick="add_violation_view.showModal();map_show_1()" id="add_violation_id">新增違規區域</button>
|
||||
<button style="height:30px;float:right " class="btn btn-outline-secondary" onclick="serch_click()">搜尋</button>
|
||||
<input type="text" style="float:right" placeholder="請輸入您的車牌" id="serch_text_id" />-->
|
||||
<table class="table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>
|
||||
總違規區域
|
||||
</th>
|
||||
|
||||
<th>
|
||||
|
||||
</th>
|
||||
</tr>
|
||||
</thead>
|
||||
|
||||
<tbody id="demo">
|
||||
</tbody>
|
||||
|
||||
|
||||
</table>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="row">
|
||||
<!--每日違規數量-->
|
||||
<div class="col-xl-8 col-lg-8">
|
||||
<div class="card shadow mb-8">
|
||||
<div class="card-header py-3">
|
||||
<h6 class="m-0 font-weight-bold text-primary">
|
||||
每日違規數量
|
||||
<button class="btn btn-info btn-circle btn-sm" style="float:right; background-image: url('/image/icon/F5.png'); background-size: cover;" onclick="get_violation_data_1()"></button>
|
||||
</h6>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<div class="chart-bar">
|
||||
<canvas id="violation_car_Bar"></canvas>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!--違規次數-->
|
||||
<div class="col-xl-4 col-lg-4">
|
||||
<div class="card shadow mb-8">
|
||||
<div class="card-header py-3">
|
||||
<h6 class="m-0 font-weight-bold text-primary">
|
||||
違規次數
|
||||
<button class="btn btn-info btn-circle btn-sm" style="float:right; background-image: url('/image/icon/F5.png'); background-size: cover;" onclick="get_recidivst_1()"></button>
|
||||
</h6>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<div class="chart-bar">
|
||||
<canvas id="violation_car_time_Bar"></canvas>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<!--設定數據圖數據-違規次數-->
|
||||
<script>
|
||||
function set_violation_time_table(labels, dailyTrafficData) {
|
||||
|
||||
date = JSON.parse(JSON.stringify(labels));
|
||||
values = JSON.parse(JSON.stringify(dailyTrafficData));
|
||||
// 假設你有一些資料,例如違規次數
|
||||
var dailyTrafficData = dailyTrafficData;
|
||||
|
||||
// 取得 canvas 元素
|
||||
var ctx = document.getElementById('violation_car_time_Bar')
|
||||
|
||||
|
||||
//生成10種顏色
|
||||
function generateColors_1(numColors) {
|
||||
var colors = [];
|
||||
for (var i = 0; i < numColors; i++) {
|
||||
var ratio = i / (numColors - 1);
|
||||
var r = Math.round(255 * (1 - ratio) + 0 * ratio);
|
||||
var g = Math.round(0 * (1 - ratio) + 0 * ratio);
|
||||
var b = Math.round(0 * (1 - ratio) + 0 * ratio);
|
||||
var color = rgbToHex(r, g, b);
|
||||
colors.push(color);
|
||||
}
|
||||
return colors;
|
||||
}
|
||||
|
||||
function generateColors_2(numColors) {
|
||||
var colors = [];
|
||||
for (var i = 0; i < numColors; i++) {
|
||||
var ratio = i / (numColors - 1);
|
||||
var r = Math.round(170 * (1 - ratio) + 0 * ratio);
|
||||
var g = Math.round(30 * (1 - ratio) + 32 * ratio);
|
||||
var b = Math.round(20 * (1 - ratio) + 32 * ratio);
|
||||
var color = rgbToHex(r, g, b);
|
||||
colors.push(color);
|
||||
}
|
||||
return colors;
|
||||
}
|
||||
|
||||
function rgbToHex(r, g, b) {
|
||||
return '#' + componentToHex(r) + componentToHex(g) + componentToHex(b);
|
||||
}
|
||||
|
||||
function componentToHex(c) {
|
||||
var hex = c.toString(16);
|
||||
return hex.length == 1 ? '0' + hex : hex;
|
||||
}
|
||||
|
||||
var numColors = 10;
|
||||
var backgroundColors = generateColors_1(numColors);
|
||||
var hoverBackgroundColors = generateColors_2(numColors);
|
||||
|
||||
|
||||
|
||||
// 使用 Chart.js 繪製圓餅圖
|
||||
var myBarChart = new Chart(ctx, {
|
||||
type: 'pie',//line(線圖),pie(圓餅圖),bar(長條圖)
|
||||
data: {
|
||||
labels: date.reverse(),
|
||||
datasets: [{
|
||||
label: '違規次數',
|
||||
data: values.reverse(),
|
||||
backgroundColor: backgroundColors,
|
||||
hoverBackgroundColor: hoverBackgroundColors,
|
||||
borderWidth: 1
|
||||
}]
|
||||
},
|
||||
options: {
|
||||
responsive: true, // 啟用 responsive 設置
|
||||
maintainAspectRatio: false, // 保持長寬比例
|
||||
scales: {
|
||||
y: {
|
||||
beginAtZero: true
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
}
|
||||
|
||||
|
||||
</script>
|
||||
|
||||
|
||||
<!--設定數據圖數據-每日違規數量-->
|
||||
<script>
|
||||
function set_violation_table(labels, dailyTrafficData) {
|
||||
|
||||
date = JSON.parse(JSON.stringify(labels));
|
||||
values = JSON.parse(JSON.stringify(dailyTrafficData));
|
||||
// 假設你有一些資料,例如每日違規數量
|
||||
var dailyTrafficData = dailyTrafficData;
|
||||
|
||||
// 取得 canvas 元素
|
||||
var ctx = document.getElementById('violation_car_Bar')
|
||||
|
||||
|
||||
|
||||
// 使用 Chart.js 繪製長條圖
|
||||
var myBarChart = new Chart(ctx, {
|
||||
type: 'bar',
|
||||
data: {
|
||||
labels: date.reverse(),
|
||||
datasets: [{
|
||||
label: '違規數量',
|
||||
data: values.reverse(),
|
||||
backgroundColor: 'rgba(255, 0, 0, 0.5)', // 設定半透明的紅色背景
|
||||
borderColor: 'rgba(255, 0, 0, 1)', // 設定不透明的紅色邊框
|
||||
borderWidth: 1
|
||||
}]
|
||||
},
|
||||
options: {
|
||||
responsive: true, // 啟用 responsive 設置
|
||||
maintainAspectRatio: false, // 保持長寬比例
|
||||
scales: {
|
||||
y: {
|
||||
beginAtZero: true
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
</script>
|
||||
|
||||
|
||||
|
||||
<!--獲取資料-->
|
||||
<script>
|
||||
var token_ckeck //= document.getElementById("token_ckeck_id").value
|
||||
var position //職位
|
||||
function get_data() {
|
||||
console.log("start")
|
||||
//token_check = document.getElementById("token_check_id").value
|
||||
console.log(token_check)
|
||||
$.ajax({
|
||||
type: "GET",
|
||||
url: "http://140.125.20.183:7700/api/Parking_spaces_violation_total_table",
|
||||
data: {},
|
||||
contentType: "application/json",
|
||||
success: function (Model) {
|
||||
console.log(Model)
|
||||
set_data(Model)
|
||||
get_recidivst_1()
|
||||
get_violation_data_1()
|
||||
|
||||
}
|
||||
});
|
||||
}
|
||||
</script>
|
||||
|
||||
<!--放置資料-->
|
||||
<script>
|
||||
function set_data(Model) {
|
||||
table = "<tr>";
|
||||
//console.log(Model.length)
|
||||
if (Model.length > 0) {
|
||||
for (var i = 0; i < Model.length; i++) {
|
||||
if (Model[i].parking_spaces_violation_name != null) {
|
||||
table += "<td>" + Model[i].parking_spaces_violation_name + "</td>"
|
||||
|
||||
table += "<td>"
|
||||
if (token_check == "true") {
|
||||
table += '<button class="btn btn-outline-success " onclick="detail_data(' + "'" + Model[i].parking_spaces_violation_name + "'" + ')">詳細</button>' + ' ' + ' '
|
||||
}
|
||||
}
|
||||
table += "</tr>"
|
||||
table += "<tr>"
|
||||
|
||||
}
|
||||
}
|
||||
document.getElementById("demo").innerHTML = table
|
||||
}
|
||||
</script>
|
||||
|
||||
|
||||
<!--前往詳細頁面-->
|
||||
<script>
|
||||
function detail_data(name) {
|
||||
window.location = "/Manager/Single_violation_detail/" + name;
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
|
||||
<!--抓出違規慣犯-->
|
||||
<script>
|
||||
function get_recidivst_1() {
|
||||
$.ajax({
|
||||
type: "GET",
|
||||
url: "http://140.125.20.183:7700/api/Violation_car_table/recidivists",
|
||||
data: {},
|
||||
contentType: "application/json",
|
||||
success: function (Model) {
|
||||
//console.log(Model)
|
||||
set_recidivst_1(Model)
|
||||
|
||||
|
||||
}
|
||||
});
|
||||
}
|
||||
function set_recidivst_1(Model) {
|
||||
var car_list = []
|
||||
var occurrences_list = []
|
||||
if (Model.length > 0) {
|
||||
for (var i = 0; i < Model.length; i++) {
|
||||
if (Model[i].licensePlateNumber != "") {
|
||||
car_list.push(Model[i].licensePlateNumber)
|
||||
occurrences_list.push(Model[i].occurrences)
|
||||
if (car_list.length >= 10) {
|
||||
break
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
console.log(car_list)
|
||||
console.log(occurrences_list)
|
||||
set_violation_time_table(car_list, occurrences_list)
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
</script>
|
||||
|
||||
|
||||
|
||||
<!--獲取違規資料-->
|
||||
<script>
|
||||
var token_ckeck //= document.getElementById("token_ckeck_id").value
|
||||
var position //職位
|
||||
function get_violation_data_1() {
|
||||
violation_car_list = []
|
||||
//console.log("start")
|
||||
//token_check = document.getElementById("token_check_id").value
|
||||
//console.log(token_check)
|
||||
$.ajax({
|
||||
type: "GET",
|
||||
url: "http://140.125.20.183:7700/api/Parking_spaces_violation_total_table",
|
||||
data: {},
|
||||
contentType: "application/json",
|
||||
success: function (Model) {
|
||||
get_violation_data_2(Model)
|
||||
|
||||
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function get_violation_data_2(Model) {
|
||||
if (Model.length > 0) {
|
||||
for (var i = 0; i < Model.length; i++) {
|
||||
var name = Model[i].parking_spaces_violation_name
|
||||
////console.log(name)
|
||||
$.ajax({
|
||||
type: "GET",
|
||||
url: "http://140.125.20.183:7700/api/Violation_car_table/violation_location_name-" + name,
|
||||
data: {},
|
||||
contentType: "application/json",
|
||||
success: function (Model) {
|
||||
set_violation_data_1(Model)
|
||||
|
||||
}
|
||||
});
|
||||
|
||||
}
|
||||
}
|
||||
set_violation_data_3()
|
||||
|
||||
}
|
||||
</script>
|
||||
|
||||
<!--設置違規資料-->
|
||||
<script>
|
||||
var date_list = []
|
||||
var violation_car_list = []
|
||||
|
||||
function set_violation_data_1(Model) {
|
||||
// 獲取當前日期
|
||||
var today = new Date();
|
||||
// 提取年、月、日
|
||||
var year = today.getFullYear();
|
||||
var month = today.getMonth() + 1; // 注意:月份是從 0 開始的,所以需要加 1
|
||||
var day = today.getDate();
|
||||
// 將月份和日期補零,以確保是兩位數
|
||||
month = month < 10 ? '0' + month : month;
|
||||
day = day < 10 ? '0' + day : day;
|
||||
// 構建日期字符串,格式:YYYY-MM-DD
|
||||
var todayDate = year + '-' + month + '-' + day;
|
||||
|
||||
if (Model.length > 0) {
|
||||
var D = ""
|
||||
for (var i = 0; i < Model.length; i++) {
|
||||
// 假設你有一個包含日期時間的字符串
|
||||
var dateTimeString = Model[i].create_data_time;
|
||||
// 將字符串轉換為 Date 對象
|
||||
var dateTime = new Date(dateTimeString);
|
||||
// 提取日期部分
|
||||
var year = dateTime.getFullYear();
|
||||
var month = dateTime.getMonth() + 1; // 月份是從 0 開始的,所以要加 1
|
||||
var day = dateTime.getDate();
|
||||
// 將月份和日期補零,以確保是兩位數
|
||||
month = month < 10 ? '0' + month : month;
|
||||
day = day < 10 ? '0' + day : day;
|
||||
|
||||
// 構建日期字符串,格式:YYYY-MM-DD
|
||||
var date = year + '-' + month + '-' + day;
|
||||
|
||||
// 將字符串轉換為 Date 對象
|
||||
var startDate = new Date(date);
|
||||
var endDate = new Date(todayDate);
|
||||
// 計算天數差
|
||||
var timeDifference = endDate - startDate;
|
||||
|
||||
var daysDifference = Math.floor(timeDifference / (1000 * 60 * 60 * 24));// 轉換為天數(毫秒 / 1000 / 60 / 60 / 24)
|
||||
|
||||
if (daysDifference > 29) {
|
||||
console.log(date_list)
|
||||
break
|
||||
}
|
||||
|
||||
if (D != date) {
|
||||
D = date
|
||||
var D_1 = new Date(D);
|
||||
var MD = D_1.toLocaleDateString('en-US', { month: '2-digit', day: '2-digit' });
|
||||
var hasValue = date_list.includes(MD);
|
||||
if (hasValue == false) {
|
||||
date_list.push(MD)
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
//console.log(date_list)
|
||||
set_violation_data_2(Model)
|
||||
}
|
||||
|
||||
function set_violation_data_2(Model) {
|
||||
if (date_list.length > 0 && violation_car_list.length <= 0) {
|
||||
for (var i = 0; i < date_list.length; i++) {
|
||||
violation_car_list.push(0)
|
||||
}
|
||||
}
|
||||
|
||||
var today = new Date();
|
||||
var year = today.getFullYear();
|
||||
var month = today.getMonth() + 1; // 注意:月份是從 0 開始的,所以需要加 1
|
||||
var day = today.getDate();
|
||||
month = month < 10 ? '0' + month : month;
|
||||
day = day < 10 ? '0' + day : day;
|
||||
var todayDate = year + '-' + month + '-' + day;
|
||||
|
||||
if (Model.length > 0) {
|
||||
var D = ""
|
||||
for (var i = 0; i < Model.length; i++) {
|
||||
// 假設你有一個包含日期時間的字符串
|
||||
var dateTimeString = Model[i].create_data_time;
|
||||
// 將字符串轉換為 Date 對象
|
||||
var dateTime = new Date(dateTimeString);
|
||||
// 提取日期部分
|
||||
var year = dateTime.getFullYear();
|
||||
var month = dateTime.getMonth() + 1; // 月份是從 0 開始的,所以要加 1
|
||||
var day = dateTime.getDate();
|
||||
// 將月份和日期補零,以確保是兩位數
|
||||
month = month < 10 ? '0' + month : month;
|
||||
day = day < 10 ? '0' + day : day;
|
||||
|
||||
// 構建日期字符串,格式:YYYY-MM-DD
|
||||
var date = year + '-' + month + '-' + day;
|
||||
|
||||
// 將字符串轉換為 Date 對象
|
||||
var startDate = new Date(date);
|
||||
var endDate = new Date(todayDate);
|
||||
// 計算天數差
|
||||
var timeDifference = endDate - startDate;
|
||||
|
||||
var daysDifference = Math.floor(timeDifference / (1000 * 60 * 60 * 24));// 轉換為天數(毫秒 / 1000 / 60 / 60 / 24)
|
||||
////console.log(daysDifference)
|
||||
if (daysDifference > date_list.length) {
|
||||
break
|
||||
}
|
||||
var D_1 = new Date(date);
|
||||
var MD = D_1.toLocaleDateString('en-US', { month: '2-digit', day: '2-digit' });
|
||||
var index = date_list.indexOf(MD);
|
||||
////console.log(index)
|
||||
violation_car_list[index] = violation_car_list[index] + 1
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
function set_violation_data_3() {
|
||||
// 等待 2000 毫秒(2 秒)
|
||||
setTimeout(function () {
|
||||
set_violation_table(date_list, violation_car_list)
|
||||
}, 200);
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<!--檢查token-->
|
||||
<script>
|
||||
function token_check() {
|
||||
// 检查本地存储中是否存在JWT令牌
|
||||
var token = localStorage.getItem('token_park_space');
|
||||
console.log(token)
|
||||
$.ajax({
|
||||
type: "GET",
|
||||
url: 'http://140.125.20.183:7700/Users/token_check',
|
||||
headers: {
|
||||
'Authorization': token
|
||||
},
|
||||
success: function (response) {
|
||||
console.log(response)
|
||||
token_check = "true"
|
||||
from_token_import_id()
|
||||
},
|
||||
error: function (xhr) {
|
||||
token_check = "false"
|
||||
window.location.href = '/';
|
||||
// 处理错误响应,例如跳转到未授权页面
|
||||
//window.location.href = 'https://example.com/unauthorized_page';
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function from_token_import_id() {
|
||||
var token = localStorage.getItem('token_park_space');
|
||||
$.ajax({
|
||||
type: "GET",
|
||||
url: 'http://140.125.20.183:7700/Users/token-' + token,
|
||||
headers: {
|
||||
'Authorization': token
|
||||
},
|
||||
success: function (response) {
|
||||
console.log(response)
|
||||
from_id_import_user_data(response)
|
||||
|
||||
|
||||
}
|
||||
});
|
||||
}
|
||||
function from_id_import_user_data(id) {
|
||||
var token = localStorage.getItem('token_park_space');
|
||||
$.ajax({
|
||||
type: "GET",
|
||||
url: 'http://140.125.20.183:7700/Users/user_id-' + id,
|
||||
headers: {
|
||||
'Authorization': token
|
||||
},
|
||||
success: function (model) {
|
||||
model = model.result
|
||||
position = model.lastname
|
||||
console.log(position)
|
||||
if (position == "manager") {
|
||||
get_data()
|
||||
}
|
||||
else {
|
||||
window.location.href = '/';
|
||||
}
|
||||
|
||||
}
|
||||
});
|
||||
}
|
||||
</script>
|
||||
|
||||
<!--開機自啟-->
|
||||
<script>
|
||||
window.onload = token_check;
|
||||
</script>
|
8
Parking_spaces/Views/Manager/Map_RTSP.cshtml
Normal file
8
Parking_spaces/Views/Manager/Map_RTSP.cshtml
Normal file
@ -0,0 +1,8 @@
|
||||
|
||||
@{
|
||||
ViewData["Title"] = "Map_RTSP";
|
||||
Layout = "~/Views/Shared/_Layout_Manager.cshtml";
|
||||
}
|
||||
|
||||
<h1>Map_RTSP</h1>
|
||||
|
378
Parking_spaces/Views/Manager/Single_violation_detail.cshtml
Normal file
378
Parking_spaces/Views/Manager/Single_violation_detail.cshtml
Normal file
@ -0,0 +1,378 @@
|
||||
|
||||
@{
|
||||
ViewData["Title"] = "Single_violation_detail";
|
||||
Layout = "~/Views/Shared/_Layout_Engineering.cshtml";
|
||||
var parking_spaces_name = ViewBag.parking_spaces_name;
|
||||
}
|
||||
<input type="hidden" id="parking_spaces_name_id" value=@parking_spaces_name />
|
||||
|
||||
<h1>違規車輛</h1>
|
||||
|
||||
<div class="size2">
|
||||
起始時間 : <input type="date" id="start_date_id">
|
||||
結束時間 : <input type="date" id="end_date_id">
|
||||
<button style="height:30px; " class="btn btn-outline-secondary" onclick="serch_date_click()">搜尋</button>
|
||||
|
||||
<button style="height:30px;float:right " class="btn btn-outline-secondary" onclick="serch_click()">搜尋</button>
|
||||
<input type="text" style="float:right" placeholder="請輸入車牌 ex:ABC4321" id="serch_text_id" />
|
||||
<table class="table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>
|
||||
違規區域
|
||||
</th>
|
||||
<th>
|
||||
車牌號碼
|
||||
</th>
|
||||
<!--<th>
|
||||
進入圖片
|
||||
</th>
|
||||
<th>
|
||||
違規圖片
|
||||
</th>-->
|
||||
<th>
|
||||
時間
|
||||
</th>
|
||||
<th></th>
|
||||
</tr>
|
||||
</thead>
|
||||
|
||||
<tbody id="demo">
|
||||
</tbody>
|
||||
|
||||
|
||||
</table>
|
||||
</div>
|
||||
|
||||
<!--車輛詳細-彈跳視窗-->
|
||||
<div>
|
||||
<dialog id="detail_car_data_view" style="width:100%;">
|
||||
<table class="table">
|
||||
<button class="btn btn-danger" style="float:right" onclick="detail_car_data_view.close();"> 關閉 </button>
|
||||
<button class="btn btn-warning" style="float:right" onclick="updata_violation_car_get()"> 更新資料 </button><p></p>
|
||||
<thead>
|
||||
<tr>
|
||||
<th>
|
||||
違規區域
|
||||
</th>
|
||||
<th>
|
||||
車牌號碼
|
||||
</th>
|
||||
<th>
|
||||
進入圖片
|
||||
</th>
|
||||
<th>
|
||||
違規圖片
|
||||
</th>
|
||||
<th>
|
||||
時間
|
||||
</th>
|
||||
|
||||
</tr>
|
||||
</thead>
|
||||
|
||||
<tbody id="detail_car_data">
|
||||
</tbody>
|
||||
|
||||
|
||||
</table>
|
||||
<button class="btn btn-outline-success" style="float:left" onclick="previous_detail_data()"> Previous</button>
|
||||
<button class="btn btn-outline-success" style="float:right" onclick="next_detail_data()"> Next </button>
|
||||
</dialog>
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
<!--獲取資料-->
|
||||
<script>
|
||||
var All_Model
|
||||
var serial_number=0
|
||||
function get_data() {
|
||||
var name = document.getElementById("parking_spaces_name_id").value
|
||||
//console.log(name)
|
||||
$.ajax({
|
||||
type: "GET",
|
||||
url: "http://140.125.20.183:7700/api/Violation_car_table/violation_location_name-" + name,
|
||||
data: {},
|
||||
contentType: "application/json",
|
||||
success: function (Model) {
|
||||
//console.log(Model)
|
||||
All_Model = Model
|
||||
set_data(Model)
|
||||
|
||||
}
|
||||
});
|
||||
}
|
||||
</script>
|
||||
|
||||
<!--放置資料-->
|
||||
<script>
|
||||
|
||||
function set_data(Model) {
|
||||
table = "<tr>";
|
||||
console.log(Model.length)
|
||||
if (Model.length > 0) {
|
||||
for (var i = 0; i < Model.length; i++) {
|
||||
if (Model[i].violation_location_name != null) {
|
||||
table += "<td>" + Model[i].violation_location_name + "</td>"
|
||||
table += "<td>" + Model[i].license_plate_number + "</td>"
|
||||
//table += "<td>" + "</td>"
|
||||
//table += "<td>" + "</td>"
|
||||
// table += "<td>" + "<img src=" + Model[i].car_start_img + ' style="width:100%"' + ">" + "</td>"
|
||||
// table += "<td>" + "<img src=" + Model[i].car_end_img + ' style="width:100% "' + ">" + "</td>"
|
||||
// 将字符串转换为 Date 对象
|
||||
var timestampDt = new Date(Model[i].create_data_time);
|
||||
// 转换为其他格式
|
||||
var options = { year: 'numeric', month: '2-digit', day: '2-digit', hour: '2-digit', minute: '2-digit', second: '2-digit' };
|
||||
var formattedDate = timestampDt.toLocaleDateString('en-US', options);
|
||||
table += "<td>" + formattedDate + "</td>"
|
||||
table += "<td>" + '<button class="btn btn-outline-success" onclick="detail_data(' + "'" + Model[i].violation_location_name + "','" + i+ "','" + Model[i].create_data_time + "'" + ')">詳細</button>'
|
||||
table += '<button class="btn btn-danger" onclick="delet_data(' + "'" + Model[i].violation_location_name + "','" + Model[i].license_plate_number + "','" + Model[i].create_data_time + "'" + ')">刪除</button>' + "</td>"
|
||||
|
||||
}
|
||||
table += "</tr>"
|
||||
table += "<tr>"
|
||||
|
||||
}
|
||||
}
|
||||
document.getElementById("demo").innerHTML = table
|
||||
}
|
||||
</script>
|
||||
|
||||
<!--更新違規車輛資料-->
|
||||
<script>
|
||||
function updata_violation_car_get() {
|
||||
var violation_location_name = document.getElementById('parking_spaces_name_id').value
|
||||
var time = document.getElementById('create_data_time_id').innerHTML
|
||||
console.log(time)
|
||||
$.ajax({
|
||||
type: "GET",
|
||||
url: "http://140.125.20.183:7700/api/Violation_car_table/location_nam-" + violation_location_name + "-time-" + time,
|
||||
data: {},
|
||||
contentType: "application/json",
|
||||
success: function (Model) {
|
||||
//console.log(Model)
|
||||
updata_violation_car_put(Model)
|
||||
}
|
||||
});
|
||||
}
|
||||
function updata_violation_car_put(Model) {
|
||||
var violation_location_name = document.getElementById('parking_spaces_name_id').value
|
||||
var time = document.getElementById('create_data_time_id').innerHTML
|
||||
var license_plate_number = document.getElementById('license_plate_number_text_id').value
|
||||
Model.license_plate_number = license_plate_number
|
||||
//console.log(Model)
|
||||
var stringify_obj = JSON.stringify(Model);
|
||||
$.ajax({
|
||||
type: "PUT",
|
||||
url: "http://140.125.20.183:7700/api/Violation_car_table/location_nam-" + violation_location_name + "-time-" + time,
|
||||
data: stringify_obj,
|
||||
contentType: "application/json",
|
||||
success: function (Model) {
|
||||
// console.log(Model)
|
||||
//updata_violation_car_put(Model)
|
||||
}
|
||||
});
|
||||
|
||||
}
|
||||
</script>
|
||||
|
||||
<!--下一筆資料-->
|
||||
<script>
|
||||
function next_detail_data() {
|
||||
serial_number = Number(serial_number) + 1
|
||||
if (serial_number >= All_Model.length) {
|
||||
window.alert('無下一筆資料')
|
||||
serial_number = All_Model.length-1
|
||||
return
|
||||
}
|
||||
//console.log(serial_number)
|
||||
//console.log(All_Model[serial_number])
|
||||
detail_data(All_Model[serial_number]['violation_location_name'], serial_number, All_Model[serial_number]['create_data_time'])
|
||||
}
|
||||
</script>
|
||||
|
||||
<!--上一筆資料-->
|
||||
<script>
|
||||
function previous_detail_data() {
|
||||
serial_number = Number(serial_number) - 1
|
||||
if (serial_number < 0){
|
||||
window.alert('無上一筆資料')
|
||||
serial_number = 0
|
||||
return
|
||||
}
|
||||
// console.log(serial_number)
|
||||
//console.log(All_Model[serial_number])
|
||||
detail_data(All_Model[serial_number]['violation_location_name'], serial_number, All_Model[serial_number]['create_data_time'])
|
||||
}
|
||||
</script>
|
||||
|
||||
|
||||
|
||||
<!--違規車輛詳細-->
|
||||
<script>
|
||||
function detail_data(location_name, car_serial_number, time) {
|
||||
//console.log(location_name)
|
||||
//console.log(All_Model[car_serial_number])
|
||||
//console.log(time)
|
||||
serial_number = car_serial_number
|
||||
$.ajax({
|
||||
type: "GET",
|
||||
url: "http://140.125.20.183:7700/api/Violation_car_table/location_nam-" + location_name + "-time-" + time,
|
||||
data: {},
|
||||
contentType: "application/json",
|
||||
success: function (Model) {
|
||||
console.log(Model)
|
||||
table = "<tr>";
|
||||
table += "<td>" + Model.violation_location_name + "</td>"
|
||||
table += "<td>" + '<input type="text" id = "license_plate_number_text_id" value="'+Model.license_plate_number+ '"/>' + "</td>"
|
||||
//table += "<td>" + "</td>"
|
||||
//table += "<td>" + "</td>"
|
||||
table += "<td>" + "<img src=" + Model.car_start_img + ' style="width:100%"' + ">" + "</td>"
|
||||
table += "<td>" + "<img src=" + Model.car_end_img + ' style="width:100% "' + ">" + "</td>"
|
||||
table += "<td id = 'create_data_time_id' >" + Model.create_data_time + "</td>"
|
||||
document.getElementById("detail_car_data").innerHTML = table
|
||||
}
|
||||
});
|
||||
detail_car_data_view.showModal();
|
||||
}
|
||||
</script>
|
||||
|
||||
<!--透過車牌號碼搜尋-->
|
||||
<script>
|
||||
function serch_click() {
|
||||
var license_plate_number = document.getElementById("serch_text_id").value
|
||||
if (license_plate_number == "") {
|
||||
get_data()
|
||||
}
|
||||
$.ajax({
|
||||
type: "GET",
|
||||
url: "http://140.125.20.183:7700/api/Violation_car_table/license_plate_number-" + license_plate_number,
|
||||
data: {},
|
||||
contentType: "application/json",
|
||||
success: function (Model) {
|
||||
console.log(Model)
|
||||
All_Model = Model
|
||||
set_data(Model)
|
||||
|
||||
}
|
||||
});
|
||||
}
|
||||
</script>
|
||||
|
||||
|
||||
<!--透過日期搜尋紀錄-->
|
||||
<script>
|
||||
function serch_date_click() {
|
||||
var name = document.getElementById("parking_spaces_name_id").value
|
||||
var start_date = document.getElementById("start_date_id").value
|
||||
var end_date = document.getElementById("end_date_id").value
|
||||
console.log(start_date)
|
||||
$.ajax({
|
||||
type: "GET",
|
||||
url: "http://140.125.20.183:7700/api/Violation_car_table/location_name_1_-" + name + "-start_time-" + start_date + "-end_time-" + end_date,
|
||||
data: {},
|
||||
contentType: "application/json",
|
||||
success: function (Model) {
|
||||
console.log(Model)
|
||||
All_Model = Model
|
||||
set_data(Model)
|
||||
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
}
|
||||
</script>
|
||||
|
||||
<!--刪除資料-->
|
||||
<script>
|
||||
function delet_data(location_name , name , time) {
|
||||
console.log(location_name)
|
||||
console.log(name)
|
||||
console.log(time)
|
||||
$.ajax({
|
||||
type: "DELETE",
|
||||
url: "http://140.125.20.183:7700/api/Violation_car_table/location_name-" + location_name + "-time-" + time,
|
||||
data: {},
|
||||
contentType: "application/json",
|
||||
success: function (msg) {
|
||||
console.log(msg)
|
||||
get_data()
|
||||
}
|
||||
});
|
||||
}
|
||||
</script>
|
||||
|
||||
|
||||
<!--檢查token-->
|
||||
<script>
|
||||
function token_check() {
|
||||
// 检查本地存储中是否存在JWT令牌
|
||||
var token = localStorage.getItem('token_park_space');
|
||||
console.log(token)
|
||||
$.ajax({
|
||||
type: "GET",
|
||||
url: 'http://140.125.20.183:7700/Users/token_check',
|
||||
headers: {
|
||||
'Authorization': token
|
||||
},
|
||||
success: function (response) {
|
||||
console.log(response)
|
||||
token_check = "true"
|
||||
from_token_import_id()
|
||||
},
|
||||
error: function (xhr) {
|
||||
token_check = "false"
|
||||
window.location.href = '/';
|
||||
// 处理错误响应,例如跳转到未授权页面
|
||||
//window.location.href = 'https://example.com/unauthorized_page';
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function from_token_import_id() {
|
||||
var token = localStorage.getItem('token_park_space');
|
||||
$.ajax({
|
||||
type: "GET",
|
||||
url: 'http://140.125.20.183:7700/Users/token-' + token,
|
||||
headers: {
|
||||
'Authorization': token
|
||||
},
|
||||
success: function (response) {
|
||||
console.log(response)
|
||||
from_id_import_user_data(response)
|
||||
|
||||
|
||||
}
|
||||
});
|
||||
}
|
||||
function from_id_import_user_data(id) {
|
||||
var token = localStorage.getItem('token_park_space');
|
||||
$.ajax({
|
||||
type: "GET",
|
||||
url: 'http://140.125.20.183:7700/Users/user_id-' + id,
|
||||
headers: {
|
||||
'Authorization': token
|
||||
},
|
||||
success: function (model) {
|
||||
model = model.result
|
||||
position = model.lastname
|
||||
console.log(position)
|
||||
if (position == "manager") {
|
||||
get_data()
|
||||
}
|
||||
else {
|
||||
window.location.href = '/';
|
||||
}
|
||||
|
||||
}
|
||||
});
|
||||
}
|
||||
</script>
|
||||
|
||||
<!--開機自啟-->
|
||||
<script>
|
||||
window.onload = token_check;
|
||||
</script>
|
310
Parking_spaces/Views/Manager/Yuntech_in_car.cshtml
Normal file
310
Parking_spaces/Views/Manager/Yuntech_in_car.cshtml
Normal file
@ -0,0 +1,310 @@
|
||||
|
||||
@{
|
||||
ViewData["Title"] = "Yuntech_in_car";
|
||||
Layout = "~/Views/Shared/_Layout_Manager.cshtml";
|
||||
}
|
||||
|
||||
<h1>進入車輛</h1>
|
||||
|
||||
|
||||
<div class="size2">
|
||||
起始時間 : <input type="date" id="start_date_id">
|
||||
結束時間 : <input type="date" id="end_date_id">
|
||||
<button style="height:30px; " class="btn btn-outline-secondary" onclick="serch_date_click()">搜尋</button>
|
||||
|
||||
<button style="height:30px;float:right " class="btn btn-outline-secondary" onclick="serch_click()">搜尋</button>
|
||||
<input type="text" style="float:right" placeholder="請輸入車牌 ex:ABC4321" id="serch_text_id" />
|
||||
<table class="table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>
|
||||
區域
|
||||
</th>
|
||||
<th>
|
||||
車牌號碼
|
||||
</th>
|
||||
<!--<th>
|
||||
進入圖片
|
||||
</th>
|
||||
<th>
|
||||
違規圖片
|
||||
</th>-->
|
||||
<th>
|
||||
時間
|
||||
</th>
|
||||
<th></th>
|
||||
</tr>
|
||||
</thead>
|
||||
|
||||
<tbody id="demo">
|
||||
</tbody>
|
||||
|
||||
|
||||
</table>
|
||||
</div>
|
||||
|
||||
<!--車輛詳細-彈跳視窗-->
|
||||
<div>
|
||||
<dialog id="detail_car_data_view" style="width:100%;">
|
||||
<table class="table">
|
||||
<button class="btn btn-danger" style="float:right" onclick="detail_car_data_view.close();"> 關閉 </button>
|
||||
|
||||
<p></p>
|
||||
<thead>
|
||||
<tr>
|
||||
<th>
|
||||
區域
|
||||
</th>
|
||||
<th>
|
||||
車牌號碼
|
||||
</th>
|
||||
<th>
|
||||
進入圖片
|
||||
</th>
|
||||
<th>
|
||||
時間
|
||||
</th>
|
||||
|
||||
</tr>
|
||||
</thead>
|
||||
|
||||
<tbody id="detail_car_data">
|
||||
</tbody>
|
||||
|
||||
|
||||
</table>
|
||||
<button class="btn btn-outline-success" style="float:left" onclick="previous_detail_data()"> Previous</button>
|
||||
<button class="btn btn-outline-success" style="float:right" onclick="next_detail_data()"> Next </button>
|
||||
</dialog>
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
<!--獲取資料-->
|
||||
<script>
|
||||
var All_Model
|
||||
var serial_number = 0
|
||||
function get_data() {
|
||||
var name = "大門口"
|
||||
//console.log(name)
|
||||
$.ajax({
|
||||
type: "GET",
|
||||
url: "http://140.125.20.183:7700/api/Yuntech_in_car_table/location-" + name,
|
||||
data: {},
|
||||
contentType: "application/json",
|
||||
success: function (Model) {
|
||||
//console.log(Model)
|
||||
All_Model = Model
|
||||
set_data(Model)
|
||||
|
||||
}
|
||||
});
|
||||
}
|
||||
</script>
|
||||
|
||||
<!--放置資料-->
|
||||
<script>
|
||||
|
||||
function set_data(Model) {
|
||||
table = "<tr>";
|
||||
console.log(Model.length)
|
||||
if (Model.length > 0) {
|
||||
for (var i = 0; i < Model.length; i++) {
|
||||
if (Model[i].location != null) {
|
||||
table += "<td>" + Model[i].location + "</td>"
|
||||
table += "<td>" + Model[i].license_plate_number + "</td>"
|
||||
// 将字符串转换为 Date 对象
|
||||
var timestampDt = new Date(Model[i].in_time);
|
||||
// 转换为其他格式
|
||||
var options = { year: 'numeric', month: '2-digit', day: '2-digit', hour: '2-digit', minute: '2-digit', second: '2-digit' };
|
||||
var formattedDate = timestampDt.toLocaleDateString('en-US', options);
|
||||
table += "<td>" + formattedDate + "</td>"
|
||||
table += "<td>" + '<button class="btn btn-outline-success" onclick="detail_data(' + "'" + Model[i].location + "','" + i + "','" + Model[i].in_time + "'" + ')">詳細</button>'
|
||||
|
||||
|
||||
}
|
||||
table += "</tr>"
|
||||
table += "<tr>"
|
||||
|
||||
}
|
||||
}
|
||||
document.getElementById("demo").innerHTML = table
|
||||
}
|
||||
</script>
|
||||
|
||||
|
||||
<!--下一筆資料-->
|
||||
<script>
|
||||
function next_detail_data() {
|
||||
serial_number = Number(serial_number) + 1
|
||||
if (serial_number >= All_Model.length) {
|
||||
window.alert('無下一筆資料')
|
||||
serial_number = All_Model.length - 1
|
||||
return
|
||||
}
|
||||
//console.log(serial_number)
|
||||
//console.log(All_Model[serial_number])
|
||||
detail_data(All_Model[serial_number]['location'], serial_number, All_Model[serial_number]['in_time'])
|
||||
}
|
||||
</script>
|
||||
|
||||
<!--上一筆資料-->
|
||||
<script>
|
||||
function previous_detail_data() {
|
||||
serial_number = Number(serial_number) - 1
|
||||
if (serial_number < 0) {
|
||||
window.alert('無上一筆資料')
|
||||
serial_number = 0
|
||||
return
|
||||
}
|
||||
// console.log(serial_number)
|
||||
//console.log(All_Model[serial_number])
|
||||
detail_data(All_Model[serial_number]['location'], serial_number, All_Model[serial_number]['in_time'])
|
||||
}
|
||||
</script>
|
||||
|
||||
<!--車輛詳細-->
|
||||
<script>
|
||||
function detail_data(location_name, car_serial_number, time) {
|
||||
//console.log(location_name)
|
||||
//console.log(All_Model[car_serial_number])
|
||||
//console.log(time)
|
||||
serial_number = car_serial_number
|
||||
$.ajax({
|
||||
type: "GET",
|
||||
url: "http://140.125.20.183:7700/api/Yuntech_in_car_table/location_name-" + location_name + "-time-" + time,
|
||||
data: {},
|
||||
contentType: "application/json",
|
||||
success: function (Model) {
|
||||
console.log(Model)
|
||||
table = "<tr>";
|
||||
table += "<td>" + Model.location + "</td>"
|
||||
table += "<td>" + '<input type="text" id = "license_plate_number_text_id" value="' + Model.license_plate_number + '"/>' + "</td>"
|
||||
//table += "<td>" + "</td>"
|
||||
//table += "<td>" + "</td>"
|
||||
table += "<td>" + "<img src=" + Model.car_img + ' style="width:80%"' + ">" + "</td>"
|
||||
table += "<td id = 'create_data_time_id' >" + Model.in_time + "</td>"
|
||||
document.getElementById("detail_car_data").innerHTML = table
|
||||
}
|
||||
});
|
||||
detail_car_data_view.showModal();
|
||||
}
|
||||
</script>
|
||||
|
||||
<!--透過車牌號碼搜尋-->
|
||||
<script>
|
||||
function serch_click() {
|
||||
var license_plate_number = document.getElementById("serch_text_id").value
|
||||
if (license_plate_number == "") {
|
||||
get_data()
|
||||
}
|
||||
$.ajax({
|
||||
type: "GET",
|
||||
url: "http://140.125.20.183:7700/api/Yuntech_in_car_table/license_plate_number-" + license_plate_number,
|
||||
data: {},
|
||||
contentType: "application/json",
|
||||
success: function (Model) {
|
||||
console.log(Model)
|
||||
All_Model = Model
|
||||
|
||||
set_data(Model)
|
||||
|
||||
}
|
||||
});
|
||||
}
|
||||
</script>
|
||||
|
||||
<!--透過日期搜尋紀錄-->
|
||||
<script>
|
||||
function serch_date_click() {
|
||||
var name = "大門口"
|
||||
var start_date = document.getElementById("start_date_id").value
|
||||
var end_date = document.getElementById("end_date_id").value
|
||||
console.log(start_date)
|
||||
$.ajax({
|
||||
type: "GET",
|
||||
url: "http://140.125.20.183:7700/api/Yuntech_in_car_table/location_name_1_-" + name + "-start_time-" + start_date + "-end_time-" + end_date,
|
||||
data: {},
|
||||
contentType: "application/json",
|
||||
success: function (Model) {
|
||||
console.log(Model)
|
||||
All_Model = Model
|
||||
set_data(Model)
|
||||
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
}
|
||||
</script>
|
||||
|
||||
<!--檢查token-->
|
||||
<script>
|
||||
function token_check() {
|
||||
// 检查本地存储中是否存在JWT令牌
|
||||
var token = localStorage.getItem('token_park_space');
|
||||
console.log(token)
|
||||
$.ajax({
|
||||
type: "GET",
|
||||
url: 'http://140.125.20.183:7700/Users/token_check',
|
||||
headers: {
|
||||
'Authorization': token
|
||||
},
|
||||
success: function (response) {
|
||||
console.log(response)
|
||||
token_check = "true"
|
||||
from_token_import_id()
|
||||
},
|
||||
error: function (xhr) {
|
||||
token_check = "false"
|
||||
window.location.href = '/';
|
||||
// 处理错误响应,例如跳转到未授权页面
|
||||
//window.location.href = 'https://example.com/unauthorized_page';
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function from_token_import_id() {
|
||||
var token = localStorage.getItem('token_park_space');
|
||||
$.ajax({
|
||||
type: "GET",
|
||||
url: 'http://140.125.20.183:7700/Users/token-' + token,
|
||||
headers: {
|
||||
'Authorization': token
|
||||
},
|
||||
success: function (response) {
|
||||
console.log(response)
|
||||
from_id_import_user_data(response)
|
||||
|
||||
|
||||
}
|
||||
});
|
||||
}
|
||||
function from_id_import_user_data(id) {
|
||||
var token = localStorage.getItem('token_park_space');
|
||||
$.ajax({
|
||||
type: "GET",
|
||||
url: 'http://140.125.20.183:7700/Users/user_id-' + id,
|
||||
headers: {
|
||||
'Authorization': token
|
||||
},
|
||||
success: function (model) {
|
||||
model = model.result
|
||||
position = model.lastname
|
||||
console.log(position)
|
||||
if (position == "manager") {
|
||||
get_data()
|
||||
}
|
||||
else {
|
||||
window.location.href = '/';
|
||||
}
|
||||
|
||||
}
|
||||
});
|
||||
}
|
||||
</script>
|
||||
|
||||
<!--開機自啟-->
|
||||
<script>
|
||||
window.onload = token_check;
|
||||
</script>
|
@ -249,7 +249,7 @@
|
||||
}
|
||||
else if (position == "manager") {
|
||||
//document.getElementById("position_id").innerHTML = "<p " + ' onclick="manager_mode()"' + '>校園總停車區域-管理者模式</p>'
|
||||
document.getElementById("position_id").innerHTML = '校園總停車區域-管理者模式'
|
||||
document.getElementById("position_id").innerHTML = "<p " + ' onclick="manager_mode()"' + '>校園總停車區域-管理者模式</p>'
|
||||
}
|
||||
else{
|
||||
document.getElementById("position_id").innerHTML ='校園總停車區域'
|
||||
@ -364,6 +364,9 @@
|
||||
function engineer_mode() {
|
||||
window.location = "/Engineering/Engineering_Index";
|
||||
}
|
||||
function manager_mode() {
|
||||
window.location = "/Manager/Manager_Index";
|
||||
}
|
||||
</script>
|
||||
|
||||
|
||||
|
477
Parking_spaces/Views/Shared/_Layout_Manager.cshtml
Normal file
477
Parking_spaces/Views/Shared/_Layout_Manager.cshtml
Normal file
@ -0,0 +1,477 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
|
||||
<head>
|
||||
|
||||
<meta charset="utf-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
|
||||
<meta name="description" content="">
|
||||
<meta name="author" content="">
|
||||
|
||||
<title>工程模式</title>
|
||||
|
||||
<!-- Custom fonts for this template-->
|
||||
<link href="~/bootstrap_1/vendor/fontawesome-free/css/all.min.css" rel="stylesheet" type="text/css">
|
||||
<link href="https://fonts.googleapis.com/css?family=Nunito:200,200i,300,300i,400,400i,600,600i,700,700i,800,800i,900,900i"
|
||||
rel="stylesheet">
|
||||
|
||||
<!-- Custom styles for this template-->
|
||||
<link href="~/bootstrap_1/css/sb-admin-2.min.css" rel="stylesheet">
|
||||
|
||||
|
||||
|
||||
</head>
|
||||
|
||||
<body id="page-top">
|
||||
|
||||
<!-- Page Wrapper -->
|
||||
<div id="wrapper">
|
||||
|
||||
<!-- Sidebar -->
|
||||
<ul class="navbar-nav bg-gradient-primary sidebar sidebar-dark accordion" id="accordionSidebar">
|
||||
|
||||
<!-- Sidebar - Brand -->
|
||||
<!--<a class="sidebar-brand d-flex align-items-center justify-content-center" href="index.html">-->
|
||||
<a class="sidebar-brand d-flex align-items-center justify-content-center" asp-area="" asp-controller="Park_spaces" asp-action="Parking_spaces_total_table">
|
||||
<!--
|
||||
<div class="sidebar-brand-icon rotate-n-15">
|
||||
<i class="fas fa-laugh-wink"></i>
|
||||
</div>
|
||||
<div class="sidebar-brand-text mx-3">工程模式 <sup>2</sup></div>-->
|
||||
<div class="sidebar-brand-text mx-3">
|
||||
<img class="img-profile rounded-circle" style="width:20%" src="~/bootstrap_1/img/Yuntech.png">
|
||||
停車位
|
||||
</div>
|
||||
</a>
|
||||
|
||||
<!-- Divider -->
|
||||
<hr class="sidebar-divider my-0">
|
||||
|
||||
<!-- Nav Item - Dashboard -->
|
||||
<li class="nav-item active">
|
||||
<!--<a class="nav-link" href="/Engineering/Engineering_Index">-->
|
||||
<a class="nav-link" asp-area="" asp-controller="Manager" asp-action="Manager_Index">
|
||||
<i class="fas fa-fw fa-tachometer-alt"></i>
|
||||
<span>管理員模式</span>
|
||||
</a>
|
||||
</li>
|
||||
|
||||
<!-- Divider -->
|
||||
<!--<hr class="sidebar-divider">-->
|
||||
|
||||
<!-- Heading -->
|
||||
<div class="sidebar-heading">
|
||||
設定介面
|
||||
</div>
|
||||
|
||||
<!-- Nav Item - Pages Collapse Menu -->
|
||||
<li class="nav-item">
|
||||
<a class="nav-link collapsed" href="#" data-toggle="collapse" data-target="#collapseTwo"
|
||||
aria-expanded="true" aria-controls="collapseTwo">
|
||||
<i class="fas fa-fw fa-cog"></i>
|
||||
<span>設定參數</span>
|
||||
</a>
|
||||
<div id="collapseTwo" class="collapse" aria-labelledby="headingTwo" data-parent="#accordionSidebar">
|
||||
<div class="bg-white py-2 collapse-inner rounded">
|
||||
<!--<h6 class="collapse-header">Custom Components:</h6>-->
|
||||
<a class="collapse-item" asp-controller="Manager" asp-action="Manager_Violation"> 違規區域</a>
|
||||
<a class="collapse-item" asp-controller="Manager" asp-action="Yuntech_in_car"> 進入車輛</a>
|
||||
<a class="collapse-item" asp-controller="Manager" asp-action="Map_RTSP"> 即時影像</a>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
|
||||
<!-- Nav Item - Utilities Collapse Menu -->
|
||||
<!--
|
||||
<li class="nav-item">
|
||||
<a class="nav-link collapsed" href="#" data-toggle="collapse" data-target="#collapseUtilities"
|
||||
aria-expanded="true" aria-controls="collapseUtilities">
|
||||
<i class="fas fa-fw fa-wrench"></i>
|
||||
<span>Utilities</span>
|
||||
</a>
|
||||
<div id="collapseUtilities" class="collapse" aria-labelledby="headingUtilities"
|
||||
data-parent="#accordionSidebar">
|
||||
<div class="bg-white py-2 collapse-inner rounded">
|
||||
<h6 class="collapse-header">Custom Utilities:</h6>
|
||||
<a class="collapse-item" href="utilities-color.html">Colors</a>
|
||||
<a class="collapse-item" href="utilities-border.html">Borders</a>
|
||||
<a class="collapse-item" href="utilities-animation.html">Animations</a>
|
||||
<a class="collapse-item" href="utilities-other.html">Other</a>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
-->
|
||||
<!-- Divider -->
|
||||
<!--
|
||||
<hr class="sidebar-divider">
|
||||
-->
|
||||
|
||||
<!-- Heading -->
|
||||
<!--
|
||||
<div class="sidebar-heading">
|
||||
Addons
|
||||
</div>
|
||||
-->
|
||||
|
||||
<!-- Nav Item - Pages Collapse Menu -->
|
||||
<!--
|
||||
<li class="nav-item">
|
||||
<a class="nav-link collapsed" href="#" data-toggle="collapse" data-target="#collapsePages"
|
||||
aria-expanded="true" aria-controls="collapsePages">
|
||||
<i class="fas fa-fw fa-folder"></i>
|
||||
<span>Pages</span>
|
||||
</a>
|
||||
<div id="collapsePages" class="collapse" aria-labelledby="headingPages" data-parent="#accordionSidebar">
|
||||
<div class="bg-white py-2 collapse-inner rounded">
|
||||
<h6 class="collapse-header">Login Screens:</h6>
|
||||
<a class="collapse-item" href="login.html">Login</a>
|
||||
<a class="collapse-item" href="register.html">Register</a>
|
||||
<a class="collapse-item" href="forgot-password.html">Forgot Password</a>
|
||||
<div class="collapse-divider"></div>
|
||||
<h6 class="collapse-header">Other Pages:</h6>
|
||||
<a class="collapse-item" href="404.html">404 Page</a>
|
||||
<a class="collapse-item" href="blank.html">Blank Page</a>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
-->
|
||||
|
||||
<!-- Nav Item - Charts -->
|
||||
<!--
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="charts.html">
|
||||
<i class="fas fa-fw fa-chart-area"></i>
|
||||
<span>Charts</span>
|
||||
</a>
|
||||
</li>
|
||||
-->
|
||||
|
||||
<!-- Nav Item - Tables -->
|
||||
<!--
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="tables.html">
|
||||
<i class="fas fa-fw fa-table"></i>
|
||||
<span>Tables</span>
|
||||
</a>
|
||||
</li>
|
||||
-->
|
||||
<!-- Divider -->
|
||||
<!--
|
||||
<hr class="sidebar-divider d-none d-md-block">
|
||||
-->
|
||||
|
||||
<!-- Sidebar Toggler (Sidebar) -->
|
||||
<!--
|
||||
<div class="text-center d-none d-md-inline">
|
||||
<button class="rounded-circle border-0" id="sidebarToggle"></button>
|
||||
</div>
|
||||
-->
|
||||
|
||||
|
||||
</ul>
|
||||
<!-- End of Sidebar -->
|
||||
<!-- Content Wrapper -->
|
||||
<div id="content-wrapper" class="d-flex flex-column">
|
||||
|
||||
<!-- Main Content -->
|
||||
<div id="content">
|
||||
|
||||
<!-- Topbar -->
|
||||
<nav class="navbar navbar-expand navbar-light bg-white topbar mb-4 static-top shadow">
|
||||
|
||||
<!-- Sidebar Toggle (Topbar) -->
|
||||
<button id="sidebarToggleTop" class="btn btn-link d-md-none rounded-circle mr-3">
|
||||
<i class="fa fa-bars"></i>
|
||||
</button>
|
||||
|
||||
<!-- Topbar Search -->
|
||||
<!--
|
||||
<form class="d-none d-sm-inline-block form-inline mr-auto ml-md-3 my-2 my-md-0 mw-100 navbar-search">
|
||||
<div class="input-group">
|
||||
<input type="text" class="form-control bg-light border-0 small" placeholder="Search for..."
|
||||
aria-label="Search" aria-describedby="basic-addon2">
|
||||
<div class="input-group-append">
|
||||
<button class="btn btn-primary" type="button">
|
||||
<i class="fas fa-search fa-sm"></i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
-->
|
||||
|
||||
<!-- Topbar Navbar -->
|
||||
|
||||
<ul class="navbar-nav ml-auto">
|
||||
<!-- Nav Item - Search Dropdown (Visible Only XS) -->
|
||||
<!--
|
||||
<li class="nav-item dropdown no-arrow d-sm-none">
|
||||
<a class="nav-link dropdown-toggle" href="#" id="searchDropdown" role="button"
|
||||
data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
|
||||
<i class="fas fa-search fa-fw"></i>
|
||||
|
||||
<div class="dropdown-menu dropdown-menu-right p-3 shadow animated--grow-in"
|
||||
aria-labelledby="searchDropdown">
|
||||
<form class="form-inline mr-auto w-100 navbar-search">
|
||||
<div class="input-group">
|
||||
<input type="text" class="form-control bg-light border-0 small"
|
||||
placeholder="Search for..." aria-label="Search"
|
||||
aria-describedby="basic-addon2">
|
||||
<div class="input-group-append">
|
||||
<button class="btn btn-primary" type="button">
|
||||
<i class="fas fa-search fa-sm"></i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</li>
|
||||
-->
|
||||
|
||||
<!-- Nav Item - Alerts -->
|
||||
<li class="nav-item dropdown no-arrow mx-1">
|
||||
<!-- <a class="nav-link dropdown-toggle" href="#" id="alertsDropdown" role="button"
|
||||
data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
|
||||
<i class="fas fa-bell fa-fw"></i>
|
||||
Counter - Alerts -->
|
||||
<!--
|
||||
<span class="badge badge-danger badge-counter">3+</span>
|
||||
</a>-->
|
||||
<!-- Dropdown - Alerts -->
|
||||
<!--
|
||||
<div class="dropdown-list dropdown-menu dropdown-menu-right shadow animated--grow-in"
|
||||
aria-labelledby="alertsDropdown">
|
||||
<h6 class="dropdown-header">
|
||||
Alerts Center
|
||||
</h6>
|
||||
<a class="dropdown-item d-flex align-items-center" href="#">
|
||||
<div class="mr-3">
|
||||
<div class="icon-circle bg-primary">
|
||||
<i class="fas fa-file-alt text-white"></i>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="small text-gray-500">December 12, 2019</div>
|
||||
<span class="font-weight-bold">A new monthly report is ready to download!</span>
|
||||
</div>
|
||||
</a>
|
||||
<a class="dropdown-item d-flex align-items-center" href="#">
|
||||
<div class="mr-3">
|
||||
<div class="icon-circle bg-success">
|
||||
<i class="fas fa-donate text-white"></i>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="small text-gray-500">December 7, 2019</div>
|
||||
$290.29 has been deposited into your account!
|
||||
</div>
|
||||
</a>
|
||||
<a class="dropdown-item d-flex align-items-center" href="#">
|
||||
<div class="mr-3">
|
||||
<div class="icon-circle bg-warning">
|
||||
<i class="fas fa-exclamation-triangle text-white"></i>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="small text-gray-500">December 2, 2019</div>
|
||||
Spending Alert: We've noticed unusually high spending for your account.
|
||||
</div>
|
||||
</a>
|
||||
<a class="dropdown-item text-center small text-gray-500" href="#">Show All Alerts</a>
|
||||
</div>
|
||||
-->
|
||||
</li>
|
||||
|
||||
<!-- Nav Item - Messages -->
|
||||
<li class="nav-item dropdown no-arrow mx-1">
|
||||
<!--
|
||||
<a class="nav-link dropdown-toggle" href="#" id="messagesDropdown" role="button"
|
||||
data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
|
||||
<i class="fas fa-envelope fa-fw"></i>
|
||||
<span class="badge badge-danger badge-counter">7</span>
|
||||
</a>
|
||||
<div class="dropdown-list dropdown-menu dropdown-menu-right shadow animated--grow-in"
|
||||
aria-labelledby="messagesDropdown">
|
||||
<h6 class="dropdown-header">
|
||||
Message Center
|
||||
</h6>
|
||||
<a class="dropdown-item d-flex align-items-center" href="#">
|
||||
<div class="dropdown-list-image mr-3">
|
||||
<img class="rounded-circle" src="img/undraw_profile_1.svg"
|
||||
alt="...">
|
||||
<div class="status-indicator bg-success"></div>
|
||||
</div>
|
||||
<div class="font-weight-bold">
|
||||
<div class="text-truncate">
|
||||
Hi there! I am wondering if you can help me with a
|
||||
problem I've been having.
|
||||
</div>
|
||||
<div class="small text-gray-500">Emily Fowler · 58m</div>
|
||||
</div>
|
||||
</a>
|
||||
<a class="dropdown-item d-flex align-items-center" href="#">
|
||||
<div class="dropdown-list-image mr-3">
|
||||
<img class="rounded-circle" src="img/undraw_profile_2.svg"
|
||||
alt="...">
|
||||
<div class="status-indicator"></div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="text-truncate">
|
||||
I have the photos that you ordered last month, how
|
||||
would you like them sent to you?
|
||||
</div>
|
||||
<div class="small text-gray-500">Jae Chun · 1d</div>
|
||||
</div>
|
||||
</a>
|
||||
<a class="dropdown-item d-flex align-items-center" href="#">
|
||||
<div class="dropdown-list-image mr-3">
|
||||
<img class="rounded-circle" src="img/undraw_profile_3.svg"
|
||||
alt="...">
|
||||
<div class="status-indicator bg-warning"></div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="text-truncate">
|
||||
Last month's report looks great, I am very happy with
|
||||
the progress so far, keep up the good work!
|
||||
</div>
|
||||
<div class="small text-gray-500">Morgan Alvarez · 2d</div>
|
||||
</div>
|
||||
</a>
|
||||
<a class="dropdown-item d-flex align-items-center" href="#">
|
||||
<div class="dropdown-list-image mr-3">
|
||||
<img class="rounded-circle" src="https://source.unsplash.com/Mv9hjnEUHR4/60x60"
|
||||
alt="...">
|
||||
<div class="status-indicator bg-success"></div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="text-truncate">
|
||||
Am I a good boy? The reason I ask is because someone
|
||||
told me that people say this to all dogs, even if they aren't good...
|
||||
</div>
|
||||
<div class="small text-gray-500">Chicken the Dog · 2w</div>
|
||||
</div>
|
||||
</a>
|
||||
<a class="dropdown-item text-center small text-gray-500" href="#">Read More Messages</a>
|
||||
</div>
|
||||
-->
|
||||
</li>
|
||||
|
||||
<div class="topbar-divider d-none d-sm-block"></div>
|
||||
|
||||
<!-- Nav Item - User Information -->
|
||||
<li class="nav-item dropdown no-arrow">
|
||||
<a class="nav-link dropdown-toggle" href="#" id="userDropdown" role="button"
|
||||
data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
|
||||
<span class="mr-2 d-none d-lg-inline text-gray-600 small">碼農</span>
|
||||
<img class="img-profile rounded-circle"
|
||||
src="~/bootstrap_1/img/undraw_profile.svg">
|
||||
</a>
|
||||
<!-- Dropdown - User Information -->
|
||||
|
||||
<div class="dropdown-menu dropdown-menu-right shadow animated--grow-in"
|
||||
aria-labelledby="userDropdown">
|
||||
<!--
|
||||
<a class="dropdown-item" href="#">
|
||||
<i class="fas fa-user fa-sm fa-fw mr-2 text-gray-400"></i>
|
||||
Profile
|
||||
</a>
|
||||
<a class="dropdown-item" href="#">
|
||||
<i class="fas fa-cogs fa-sm fa-fw mr-2 text-gray-400"></i>
|
||||
Settings
|
||||
</a>
|
||||
<a class="dropdown-item" href="#">
|
||||
<i class="fas fa-list fa-sm fa-fw mr-2 text-gray-400"></i>
|
||||
Activity Log
|
||||
</a>
|
||||
<div class="dropdown-divider"></div>
|
||||
-->
|
||||
<a class="dropdown-item" href="#" data-toggle="modal" data-target="#logoutModal" onclick="Logout_clicked()">
|
||||
<i class="fas fa-sign-out-alt fa-sm fa-fw mr-2 text-gray-400"></i>
|
||||
Logout
|
||||
</a>
|
||||
</div>
|
||||
</li>
|
||||
|
||||
</ul>
|
||||
|
||||
</nav>
|
||||
<!-- End of Topbar -->
|
||||
<!-- Begin Page Content -->
|
||||
<div class="container-fluid">
|
||||
@RenderBody()
|
||||
</div>
|
||||
<!-- /.container-fluid -->
|
||||
|
||||
</div>
|
||||
<!-- End of Main Content -->
|
||||
<!-- Footer -->
|
||||
<!--
|
||||
<footer class="sticky-footer bg-white">
|
||||
<div class="container my-auto">
|
||||
<div class="copyright text-center my-auto">
|
||||
<span>Copyright © Your Website 2021</span>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
-->
|
||||
<!-- End of Footer -->
|
||||
|
||||
</div>
|
||||
<!-- End of Content Wrapper -->
|
||||
|
||||
</div>
|
||||
<!-- End of Page Wrapper -->
|
||||
<!-- Scroll to Top Button-->
|
||||
<a class="scroll-to-top rounded" href="#page-top">
|
||||
<i class="fas fa-angle-up"></i>
|
||||
</a>
|
||||
|
||||
<!-- Logout Modal-->
|
||||
<div class="modal fade" id="logoutModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel"
|
||||
aria-hidden="true">
|
||||
<div class="modal-dialog" role="document">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
<h5 class="modal-title" id="exampleModalLabel">Ready to Leave?</h5>
|
||||
<button class="close" type="button" data-dismiss="modal" aria-label="Close">
|
||||
<span aria-hidden="true">×</span>
|
||||
</button>
|
||||
</div>
|
||||
<div class="modal-body">Select "Logout" below if you are ready to end your current session.</div>
|
||||
<div class="modal-footer">
|
||||
<button class="btn btn-secondary" type="button" data-dismiss="modal">Cancel</button>
|
||||
<a class="btn btn-primary" href="login.html">Logout</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Bootstrap core JavaScript-->
|
||||
<script src="~/bootstrap_1/vendor/jquery/jquery.min.js"></script>
|
||||
<script src="~/bootstrap_1/vendor/bootstrap/js/bootstrap.bundle.min.js"></script>
|
||||
|
||||
<!-- Core plugin JavaScript-->
|
||||
<script src="~/bootstrap_1/vendor/jquery-easing/jquery.easing.min.js"></script>
|
||||
|
||||
<!-- Custom scripts for all pages-->
|
||||
<script src="~/bootstrap_1/js/sb-admin-2.min.js"></script>
|
||||
|
||||
<!-- Page level plugins -->
|
||||
<script src="~/bootstrap_1/vendor/chart.js/Chart.min.js"></script>
|
||||
|
||||
<!-- Page level custom scripts -->
|
||||
<script src="~/bootstrap_1/js/demo/chart-area-demo.js"></script>
|
||||
<script src="~/bootstrap_1/js/demo/chart-pie-demo.js"></script>
|
||||
|
||||
|
||||
<!--登出-->
|
||||
<script>
|
||||
function Logout_clicked() {
|
||||
localStorage.removeItem('token_park_space');
|
||||
window.location.href = '/';
|
||||
}
|
||||
</script>
|
||||
|
||||
</body>
|
||||
|
||||
</html>
|
Loading…
Reference in New Issue
Block a user