498 lines
16 KiB
Plaintext
498 lines
16 KiB
Plaintext
@{
|
|
string script = "@";
|
|
Layout = "~/Views/Shared/_Layout_Engineering.cshtml";
|
|
}
|
|
|
|
|
|
<h1>WEBCAM參數</h1>
|
|
<div>
|
|
<button class="btn btn-primary" onclick="add_webcam_view.showModal()" id="add_webcam_id">新增攝像頭</button>
|
|
<table class="table">
|
|
<thead>
|
|
<tr>
|
|
<th>
|
|
停車場位置
|
|
</th>
|
|
<th>
|
|
攝像頭帳號
|
|
</th>
|
|
<th>
|
|
攝像頭密碼
|
|
</th>
|
|
<th>
|
|
IP位置
|
|
</th>
|
|
<th>
|
|
使用Port
|
|
</th>
|
|
<th>
|
|
攝像頭使用模式
|
|
</th>
|
|
<th>
|
|
|
|
</th>
|
|
|
|
</tr>
|
|
</thead>
|
|
|
|
<tbody id="demo">
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
|
|
|
|
<!--彈跳視窗-->
|
|
<div>
|
|
<dialog id="add_webcam_view" style="width:80%;">
|
|
<div>
|
|
<button class="btn btn-danger" style="float:right" onclick="add_webcam_view.close();"> 關閉</button>
|
|
停車場位置 :
|
|
<select style="width:30%;" id="select_parking_spaces_name_id">
|
|
</select></br></br>
|
|
攝像頭帳號 : <input type="text" id="add_user_name_text_id" /></br></br>
|
|
攝像頭密碼 : <input type="text" id="add_password_text_id" /></br></br>
|
|
IP位置 : <input type="text" id="add_ip_text_id" /></br></br>
|
|
RTSP使用Port(串流) : <input type="text" id="add_rtsp_port_text_id" /></br></br>
|
|
HTTP使用Port(控制) : <input type="text" id="add_http_port_text_id" /></br></br>
|
|
攝像頭使用模式 :
|
|
<select size="1" id="select_mode_id">
|
|
<option value="pass">停車場進出</option>
|
|
<option value="violation">判斷違規左右轉 </option>
|
|
<option value="car_num_check">數量確認 </option>
|
|
</select></br></br>
|
|
<button class="btn btn-success" onclick="add_webcam()">上傳</button>
|
|
|
|
</div>
|
|
</dialog>
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<!--獲取資料-->
|
|
<script>
|
|
var token = localStorage.getItem('token_park_space');
|
|
var token_ckeck //= document.getElementById("token_ckeck_id").value
|
|
var position //職位
|
|
function get_data() {
|
|
//token_check = document.getElementById("token_check_id").value
|
|
console.log(token_check)
|
|
$.ajax({
|
|
type: "GET",
|
|
url: "http://localhost:5174/api/Parking_spaces_cam",
|
|
data: {},
|
|
headers: {
|
|
'Authorization': token
|
|
},
|
|
contentType: "application/json",
|
|
headers: {
|
|
'Authorization': token
|
|
},
|
|
success: function (Model) {
|
|
console.log(Model)
|
|
set_data(Model)
|
|
get_data_2()
|
|
|
|
}
|
|
});
|
|
}
|
|
function get_data_2() {
|
|
//token_check = document.getElementById("token_check_id").value
|
|
console.log(token_check)
|
|
$.ajax({
|
|
type: "GET",
|
|
url: "http://localhost:5174/api/Parking_spaces_total_table",
|
|
data: {},
|
|
headers: {
|
|
'Authorization': token
|
|
},
|
|
contentType: "application/json",
|
|
headers: {
|
|
'Authorization': token
|
|
},
|
|
success: function (Model) {
|
|
console.log(Model)
|
|
set_data_2(Model)
|
|
get_data_3()
|
|
}
|
|
});
|
|
}
|
|
|
|
function get_data_3() {
|
|
//token_check = document.getElementById("token_check_id").value
|
|
console.log(token_check)
|
|
$.ajax({
|
|
type: "GET",
|
|
url: "http://localhost:5174/api/Parking_spaces_violation_total_table",
|
|
data: {},
|
|
headers: {
|
|
'Authorization': token
|
|
},
|
|
contentType: "application/json",
|
|
headers: {
|
|
'Authorization': token
|
|
},
|
|
success: function (Model) {
|
|
console.log(Model)
|
|
set_data_3(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].parking_spaces_name != null) {
|
|
if (parseInt(Model[i].port) > 400) {
|
|
table += "<td>" + Model[i].parking_spaces_name + "</td>"
|
|
table += "<td>" + Model[i].user_name + "</td>"
|
|
table += "<td>" + Model[i].password + "</td>"
|
|
table += "<td>" + Model[i].ip + "</td>"
|
|
table += "<td>" + Model[i].port + "</td>"
|
|
if (Model[i].mode == "pass") { mode = "停車場進出" }
|
|
if (Model[i].mode == "violation") { mode = "判斷違規左右轉" }
|
|
if (Model[i].mode == "car_num_check") { mode = "數量確認" }
|
|
table += "<td>" +mode + "</td>"
|
|
table += "<td>" + '<button class="btn btn-outline-success " onclick="CAM_detail(' + "'" + Model[i].parking_spaces_name + ":" + Model[i].ip + ":" + Model[i].port + "'" + ')">詳細</button>'
|
|
}
|
|
table += "</tr>"
|
|
table += "<tr>"
|
|
}
|
|
|
|
|
|
}
|
|
}
|
|
document.getElementById("demo").innerHTML = table
|
|
}
|
|
|
|
function set_data_2(Model) {
|
|
var obj = document.getElementById("select_parking_spaces_name_id");
|
|
if (Model.length > 0) {
|
|
for (var i = 0; i < Model.length; i++) {
|
|
if (Model[i].parking_spaces_name != null) {
|
|
obj.options.add(new Option(Model[i].parking_spaces_name));
|
|
|
|
}
|
|
|
|
|
|
}
|
|
}
|
|
}
|
|
|
|
function set_data_3(Model) {
|
|
var obj = document.getElementById("select_parking_spaces_name_id");
|
|
if (Model.length > 0) {
|
|
for (var i = 0; i < Model.length; i++) {
|
|
if (Model[i].parking_spaces_violation_name != null) {
|
|
obj.options.add(new Option(Model[i].parking_spaces_violation_name));
|
|
|
|
}
|
|
|
|
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
|
|
<!--上傳資料-->
|
|
<script>
|
|
function add_webcam() {
|
|
var parking_spaces_name = document.getElementById("select_parking_spaces_name_id").value
|
|
var user_name = document.getElementById("add_user_name_text_id").value
|
|
var password = document.getElementById("add_password_text_id").value
|
|
var ip = document.getElementById("add_ip_text_id").value
|
|
var port = document.getElementById("add_rtsp_port_text_id").value
|
|
var http_port = document.getElementById("add_http_port_text_id").value
|
|
var mode = document.getElementById("select_mode_id").value
|
|
if (parseInt(port) > 400) {
|
|
var url = `rtsp://${user_name}:${password}@script${ip}:${port}/stream1`
|
|
console.log(url)
|
|
}
|
|
else {
|
|
var url = `http://${user_name}:${password}@script${ip}:${port}`
|
|
console.log(url)
|
|
}
|
|
var obj = {
|
|
parking_spaces_name: parking_spaces_name,
|
|
user_name: user_name,
|
|
password: password,
|
|
ip: ip,
|
|
port: port,
|
|
http_port: http_port,
|
|
mode: mode,
|
|
url: url,
|
|
}
|
|
|
|
var stringify_obj = JSON.stringify(obj);
|
|
$.ajax({
|
|
type: "Post",
|
|
url: "http://localhost:5174/api/Parking_spaces_cam",
|
|
//data: {test_id: test_id, test_date: test_date, test_time: test_time, test_analyst: test_analyst, img: img, data_creat_time: "2022-10-04T18:47:40.887014" },
|
|
data: stringify_obj,
|
|
contentType: "application/json",
|
|
headers: {
|
|
'Authorization': token
|
|
},
|
|
success: function (msg) {
|
|
console.log(msg)
|
|
add_roi()
|
|
add_webcam_view.close()
|
|
get_data()
|
|
|
|
}
|
|
});
|
|
|
|
|
|
|
|
}
|
|
</script>
|
|
|
|
<!--上傳ROI資料-->
|
|
<script>
|
|
function add_roi(){
|
|
var parking_spaces_name = document.getElementById("select_parking_spaces_name_id").value
|
|
var user_name = document.getElementById("add_user_name_text_id").value
|
|
var password = document.getElementById("add_password_text_id").value
|
|
var ip = document.getElementById("add_ip_text_id").value
|
|
var port = document.getElementById("add_rtsp_port_text_id").value
|
|
var http_port = document.getElementById("add_http_port_text_id").value
|
|
var mode = document.getElementById("select_mode_id").value
|
|
if (parseInt(port) > 400) {
|
|
var url = `rtsp://${user_name}:${password}@script${ip}:${port}/stream1`
|
|
console.log(url)
|
|
}
|
|
else {
|
|
var url = `http://${user_name}:${password}@script${ip}:${port}`
|
|
console.log(url)
|
|
}
|
|
if (mode == "pass") {
|
|
var obj = {
|
|
parking_spaces_name: parking_spaces_name,
|
|
cam_ip: url,
|
|
roi_x1: "0",
|
|
roi_x2: "100",
|
|
roi_y1: "0",
|
|
roi_y2: "100",
|
|
roi_function: "CAR_ROI_license_plate",
|
|
mode: mode,
|
|
}
|
|
|
|
var stringify_obj = JSON.stringify(obj);
|
|
$.ajax({
|
|
type: "Post",
|
|
url: "http://localhost:5174/api/Parking_spaces_roi_pass",
|
|
//data: {test_id: test_id, test_date: test_date, test_time: test_time, test_analyst: test_analyst, img: img, data_creat_time: "2022-10-04T18:47:40.887014" },
|
|
data: stringify_obj,
|
|
contentType: "application/json",
|
|
headers: {
|
|
'Authorization': token
|
|
},
|
|
success: function (msg) {
|
|
console.log(msg)
|
|
add_ptz()
|
|
add_webcam_view.close()
|
|
get_data()
|
|
|
|
}
|
|
});
|
|
}
|
|
|
|
if (mode == "violation") {
|
|
add_ptz()
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<!--上傳PTZ資料-->
|
|
<script>
|
|
function add_ptz() {
|
|
var parking_spaces_name = document.getElementById("select_parking_spaces_name_id").value
|
|
var user_name = document.getElementById("add_user_name_text_id").value
|
|
var password = document.getElementById("add_password_text_id").value
|
|
var ip = document.getElementById("add_ip_text_id").value
|
|
var port = document.getElementById("add_rtsp_port_text_id").value
|
|
var http_port = document.getElementById("add_http_port_text_id").value
|
|
var mode = document.getElementById("select_mode_id").value
|
|
if (parseInt(port) > 400) {
|
|
var url = `rtsp://${user_name}:${password}@script${ip}:${port}/stream1`
|
|
console.log(url)
|
|
}
|
|
else {
|
|
var url = `http://${user_name}:${password}@script${ip}:${port}`
|
|
console.log(url)
|
|
}
|
|
if (mode == "pass") {
|
|
var obj = {
|
|
parking_spaces_name: parking_spaces_name,
|
|
rtsp_url: url,
|
|
rtsp_port: port,
|
|
http_port: http_port,
|
|
mode: mode,
|
|
img: "",
|
|
pan: "0",
|
|
titl: "0",
|
|
zoom: "0",
|
|
create_data_time: "1"
|
|
}
|
|
|
|
var stringify_obj = JSON.stringify(obj);
|
|
$.ajax({
|
|
type: "Post",
|
|
url: "http://localhost:5174/api/Parking_spaces_cam_ptz_pass",
|
|
//data: {test_id: test_id, test_date: test_date, test_time: test_time, test_analyst: test_analyst, img: img, data_creat_time: "2022-10-04T18:47:40.887014" },
|
|
data: stringify_obj,
|
|
contentType: "application/json",
|
|
headers: {
|
|
'Authorization': token
|
|
},
|
|
success: function (msg) {
|
|
console.log(msg)
|
|
add_webcam_view.close()
|
|
get_data()
|
|
|
|
}
|
|
});
|
|
}
|
|
|
|
if (mode == "violation") {
|
|
var obj = {
|
|
parking_spaces_name: parking_spaces_name,
|
|
rtsp_url: url,
|
|
rtsp_port: port,
|
|
http_port: http_port,
|
|
mode: mode,
|
|
img: "",
|
|
pan: "0",
|
|
titl: "0",
|
|
zoom: "0",
|
|
create_data_time: "1"
|
|
}
|
|
|
|
var stringify_obj = JSON.stringify(obj);
|
|
$.ajax({
|
|
type: "Post",
|
|
url: "http://localhost:5174/api/Parking_spaces_cam_ptz_violation",
|
|
//data: {test_id: test_id, test_date: test_date, test_time: test_time, test_analyst: test_analyst, img: img, data_creat_time: "2022-10-04T18:47:40.887014" },
|
|
data: stringify_obj,
|
|
contentType: "application/json",
|
|
headers: {
|
|
'Authorization': token
|
|
},
|
|
success: function (msg) {
|
|
console.log(msg)
|
|
add_webcam_view.close()
|
|
get_data()
|
|
|
|
}
|
|
});
|
|
}
|
|
}
|
|
</script>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<!--跳轉頁面-->
|
|
<script>
|
|
function CAM_detail(name) {
|
|
window.location = "/Engineering/Engineering_CAM_detail/" + name;
|
|
}
|
|
</script>
|
|
|
|
|
|
|
|
<!--檢查token-->
|
|
<script>
|
|
var token
|
|
function token_check() {
|
|
// 检查本地存储中是否存在JWT令牌
|
|
token = localStorage.getItem('token_park_space');
|
|
console.log(token)
|
|
$.ajax({
|
|
type: "GET",
|
|
url: 'http://localhost:5174/Users/token_check',
|
|
headers: {
|
|
'Authorization': token
|
|
},
|
|
success: function (response) {
|
|
console.log(response)
|
|
token_check = "true"
|
|
from_token_import_id()
|
|
},
|
|
error: function (xhr) {
|
|
console.log("1")
|
|
token_check = "false"
|
|
window.location.href = '/';
|
|
//get_data()
|
|
// 处理错误响应，例如跳转到未授权页面
|
|
//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://localhost:5174/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://localhost:5174/Users/user_id-' + id,
|
|
headers: {
|
|
'Authorization': token
|
|
},
|
|
success: function (model) {
|
|
model = model.result
|
|
position = model.lastname
|
|
console.log(position)
|
|
if (position == "engineer"){
|
|
get_data()
|
|
}
|
|
else{
|
|
window.location.href = '/';
|
|
}
|
|
|
|
|
|
}
|
|
});
|
|
}
|
|
</script>
|
|
|
|
<!--開機自啟-->
|
|
<script>
|
|
window.onload = token_check;
|
|
</script> |