BIG parameters update

This commit is contained in:
Ivan 2023-09-25 19:37:21 +03:00
parent 88825aba2e
commit 817f3e8b71
Signed by untrusted user who does not match committer: ppechenkoo
GPG Key ID: 0C191B86D9582583
11 changed files with 2661 additions and 960 deletions

607
server.js
View File

@ -878,7 +878,7 @@ async function reports(req, res) {
} }
const query = ` const query = `
SELECT a.evtuuid, a.id, a.cmdno, a.time, a.serial, a.st, r.plate, g.latitude, g.longitude SELECT a.evtuuid, a.id, a.cmdno, a.time, a.serial, a.st, r.plate, g.latitude, g.longitude, r.number
FROM ( FROM (
SELECT DISTINCT ON (evtuuid) evtuuid, id, cmdno, time, serial, st SELECT DISTINCT ON (evtuuid) evtuuid, id, cmdno, time, serial, st
FROM alarms FROM alarms
@ -1016,6 +1016,7 @@ async function reports(req, res) {
id: alarm.id, id: alarm.id,
cmdno: alarm.cmdno, cmdno: alarm.cmdno,
time: formatDate(alarm.time), time: formatDate(alarm.time),
number: alarm.number,
serial: alarm.serial, serial: alarm.serial,
st: alarm.st, st: alarm.st,
type: type, type: type,
@ -1879,7 +1880,193 @@ async function devices(req, res) {
} }
} }
app.get('/devices/device/system/:serial', async (req, res) => {
if (req.session.userId === undefined) {
return res.redirect("/signin");
}
const userInfo = await getUserInfo(req.session.userId);
if (!userInfo.EditTransport) {
return res.redirect("/devices");
}
const serial = req.params.serial;
let templateData = {
SERVER_IP: process.env.SERVER_IP,
Organisation: userInfo.Organisation,
User: userInfo.User,
UserInfo: userInfo.Users,
isAdmin: req.session.userId === 'admin',
ifDBError: false,
Serial: serial,
EditTransport: false,
DeleteTransport: false,
Update: false,
};
try {
const pool = new Pool({
user: DB_User,
host: DB_Host,
database: DB_Name,
password: DB_Password,
port: DB_Port,
});
const client = await pool.connect();
const source = fs.readFileSync("static/templates/devices/system.html", "utf8");
const template = handlebars.compile(source);
const resultT = template(templateData);
res.send(resultT);
client.release();
} catch (error) {
console.error(error);
templateData.ifDBError = true;
const source = fs.readFileSync(
"static/templates/devices/system.html",
"utf8"
);
const template = handlebars.compile(source);
const resultT = template(templateData);
res.send(resultT);
}
});
app.get('/devices/device/:serial', async (req, res) => {
if (req.session.userId === undefined) {
return res.redirect("/signin");
}
const userInfo = await getUserInfo(req.session.userId);
if (!userInfo.EditTransport) {
return res.redirect("/devices");
}
const serial = req.params.serial;
let templateData = {
SERVER_IP: process.env.SERVER_IP,
Organisation: userInfo.Organisation,
User: userInfo.User,
UserInfo: userInfo.Users,
isAdmin: req.session.userId === 'admin',
ifDBError: false,
Serial: serial,
EditTransport: false,
DeleteTransport: false,
Update: false,
GroupsList: [],
Number: "",
Plate: "",
PlateColor: "",
Channels: "",
Protocol: "",
Ip: "",
Group: "",
Port: "",
Sim: "",
Imei: "",
Imsi: "",
Module: "",
Type: "",
Factory: "",
Capacity: "",
Engine: "",
Stanina: "",
Fuel: "",
Certificate: "",
Category: "",
Expire: "",
Consumption: "",
Region: "",
City: "",
Name: "",
Password: "",
Batch: "",
Release: "",
Installer: "",
Installation: "",
Description: "",
};
try {
const pool = new Pool({
user: DB_User,
host: DB_Host,
database: DB_Name,
password: DB_Password,
port: DB_Port,
});
const client = await pool.connect();
const query = "SELECT * FROM registrars WHERE serial = $1";
const result = await client.query(query, [serial]);
const groupsQuery = "SELECT id, name FROM groups";
const groupsResult = await client.query(groupsQuery);
templateData.GroupsList = groupsResult.rows.map(row => ({
id: row.id,
name: row.name,
}));
// Предполагается, что результат запроса содержит одну строку данных.
if (result.rows.length === 1) {
const rowData = result.rows[0];
// Заполнение данных из результата SQL запроса в объект templateData.
templateData.Number = rowData.number;
templateData.Plate = rowData.plate;
templateData.PlateColor = rowData.plate_color;
templateData.Channels = rowData.channels;
templateData.Protocol = rowData.protocol;
templateData.Ip = rowData.ip;
templateData.Group = rowData.group;
templateData.Port = rowData.port;
templateData.Sim = rowData.sim;
templateData.Imei = rowData.imei;
templateData.Imsi = rowData.imsi;
templateData.Module = rowData.module;
templateData.Type = rowData.auto;
templateData.Factory = rowData.factory;
templateData.Capacity = rowData.capacity;
templateData.Engine = rowData.engine;
templateData.Stanina = rowData.stanina;
templateData.Fuel = rowData.fuel;
templateData.Certificate = rowData.certificate;
templateData.Category = rowData.category;
templateData.Expire = rowData.certificate_exp;
templateData.Consumption = rowData.consumption;
templateData.Region = rowData.region;
templateData.City = rowData.city;
templateData.Name = rowData.name;
templateData.Password = rowData.password;
templateData.Batch = rowData.batch;
templateData.Release = rowData.release;
templateData.Installer = rowData.installer;
templateData.Installation = rowData.installation;
templateData.Description = rowData.description;
}
const source = fs.readFileSync("static/templates/devices/device.html", "utf8");
const template = handlebars.compile(source);
const resultT = template(templateData);
res.send(resultT);
client.release();
} catch (error) {
console.error(error);
templateData.ifDBError = true;
const source = fs.readFileSync(
"static/templates/devices/device.html",
"utf8"
);
const template = handlebars.compile(source);
const resultT = template(templateData);
res.send(resultT);
}
});
async function groups(req, res) { async function groups(req, res) {
if (req.session.userId === undefined) { if (req.session.userId === undefined) {
@ -1971,7 +2158,7 @@ async function getParameters(serial) {
}, },
data: JSON.stringify({ data: JSON.stringify({
"FIELDS": [ "FIELDS": [
"DOSD" "EOSD"
] ]
}), }),
}); });
@ -2024,11 +2211,78 @@ async function getParameters(serial) {
await new Promise(resolve => setTimeout(resolve, 300)); await new Promise(resolve => setTimeout(resolve, 300));
const getResponse = await axios.get(`http://${process.env.SERVER_IP}:8080/http/parameters/get?serial=${serial}`); const getResponse = await axios.get(`http://${process.env.SERVER_IP}:8080/http/parameters/get?serial=${serial}`);
// console.log(getResponse.data);
return getResponse.data; return getResponse.data;
} }
app.post('/main-parameters', async (req, res) => {
if (req.session.userId === undefined) {
return res.redirect("/signin");
}
try {
const { serial } = req.body;
const requestResponse = await axios.get(`http://${process.env.SERVER_IP}:8080/http/parameters/request?serial=${serial}`, {
headers: {
'Content-Type': 'application/json',
},
data: JSON.stringify({
"FIELDS": [
"RIP",
"VS"
]
}),
});
await new Promise(resolve => setTimeout(resolve, 300));
const getResponse = await axios.get(`http://${process.env.SERVER_IP}:8080/http/parameters/get?serial=${serial}`);
res.json(getResponse.data);
} catch (error) {
console.error(error);
res.status(500).json({ error: 'Internal server error' });
}
});
app.put('/main-parameters', async (req, res) => {
if (req.session.userId === undefined) {
return res.redirect("/signin");
}
const requestData = req.body;
const { serial } = req.query;
const {
NUMBER,
PLATE,
VIN
} = requestData;
const requestBody = {
"RIP": {
"BN": NUMBER,
"BID": PLATE
},
"VS": {
"VIN": VIN
}
};
try {
const response = await axios.get(`http://${process.env.SERVER_IP}:8080/http/parameters/set?serial=${serial}`, {
data: JSON.stringify(requestBody),
headers: {
'Content-Type': 'application/json'
}
});
res.status(response.status).send(response.data);
} catch (error) {
res.status(500).send('Произошла ошибка при отправке GET запроса.');
}
});
app.post('/device-parameters', async (req, res) => { app.post('/device-parameters', async (req, res) => {
if (req.session.userId === undefined) { if (req.session.userId === undefined) {
return res.redirect("/signin"); return res.redirect("/signin");
@ -2037,7 +2291,7 @@ app.post('/device-parameters', async (req, res) => {
const { serial } = req.body; const { serial } = req.body;
// Используем асинхронный цикл для выполнения GET-запросов по очереди
const responseData = await getParameters(serial); const responseData = await getParameters(serial);
@ -2048,6 +2302,314 @@ app.post('/device-parameters', async (req, res) => {
} }
}); });
app.post('/ethernet-parameters', async (req, res) => {
if (req.session.userId === undefined) {
return res.redirect("/signin");
}
try {
const { serial } = req.body;
const requestResponse = await axios.get(`http://${process.env.SERVER_IP}:8080/http/parameters/request?serial=${serial}`, {
headers: {
'Content-Type': 'application/json',
},
data: JSON.stringify({
"FIELDS": [
"ETHERNET",
"KEYS"
]
}),
});
await new Promise(resolve => setTimeout(resolve, 300));
const getResponse = await axios.get(`http://${process.env.SERVER_IP}:8080/http/parameters/get?serial=${serial}`);
res.json(getResponse.data);
} catch (error) {
console.error(error);
res.status(500).json({ error: 'Internal server error' });
}
});
app.put('/ethernet-parameters', async (req, res) => {
if (req.session.userId === undefined) {
return res.redirect("/signin");
}
const requestData = req.body;
const { serial } = req.query;
const {
IPMODE,
IPADDR,
SUBMASK,
GATEWAY,
DNSMODE,
PDNS,
ADNS,
MAC
} = requestData;
const requestBody = {
"ETHERNET": {
"IPMODE": IPMODE,
"PIP": {
"IPADDR": IPADDR,
"SUBMASK": SUBMASK,
"GATEWAY": GATEWAY,
},
"DNSMODE": DNSMODE,
"DNS": {
"PDNS": PDNS,
"ADNS": ADNS
}
},
"KEYS": {
"MAC": MAC
}
};
try {
const response = await axios.get(`http://${process.env.SERVER_IP}:8080/http/parameters/set?serial=${serial}`, {
data: JSON.stringify(requestBody),
headers: {
'Content-Type': 'application/json'
}
});
res.status(response.status).send(response.data);
} catch (error) {
res.status(500).send('Произошла ошибка при отправке GET запроса.');
}
});
app.post('/wifi-parameters', async (req, res) => {
if (req.session.userId === undefined) {
return res.redirect("/signin");
}
try {
const { serial } = req.body;
const requestResponse = await axios.get(`http://${process.env.SERVER_IP}:8080/http/parameters/request?serial=${serial}`, {
headers: {
'Content-Type': 'application/json',
},
data: JSON.stringify({
"FIELDS": [
"WIFI"
]
}),
});
await new Promise(resolve => setTimeout(resolve, 300));
const getResponse = await axios.get(`http://${process.env.SERVER_IP}:8080/http/parameters/get?serial=${serial}`);
res.json(getResponse.data);
} catch (error) {
console.error(error);
res.status(500).json({ error: 'Internal server error' });
}
});
app.put('/wifi-parameters', async (req, res) => {
if (req.session.userId === undefined) {
return res.redirect("/signin");
}
const requestData = req.body;
const { serial } = req.query;
const {
WIFI,
ESSID,
ECRYPTTYPE,
PWD,
IPMODE,
IPADDR,
SUBMASK,
GATEWAY
} = requestData;
const requestBody = {
"WIFI": {
"ENABLE": WIFI,
"ESSID": ESSID,
"ECRYPTTYPE": ECRYPTTYPE,
"IPMODE": IPMODE,
"PWD": PWD,
"PIP": {
"IPADDR": IPADDR,
"SUBMASK": SUBMASK,
"GATEWAY": GATEWAY,
}
}
};
try {
const response = await axios.get(`http://${process.env.SERVER_IP}:8080/http/parameters/set?serial=${serial}`, {
data: JSON.stringify(requestBody),
headers: {
'Content-Type': 'application/json'
}
});
res.status(response.status).send(response.data);
} catch (error) {
res.status(500).send('Произошла ошибка при отправке GET запроса.');
}
});
app.post('/communication-parameters', async (req, res) => {
if (req.session.userId === undefined) {
return res.redirect("/signin");
}
try {
const { serial } = req.body;
const requestResponse = await axios.get(`http://${process.env.SERVER_IP}:8080/http/parameters/request?serial=${serial}`, {
headers: {
'Content-Type': 'application/json',
},
data: JSON.stringify({
"FIELDS": [
"M3G"
]
}),
});
await new Promise(resolve => setTimeout(resolve, 300));
const getResponse = await axios.get(`http://${process.env.SERVER_IP}:8080/http/parameters/get?serial=${serial}`);
res.json(getResponse.data);
} catch (error) {
console.error(error);
res.status(500).json({ error: 'Internal server error' });
}
});
app.put('/communication-parameters', async (req, res) => {
if (req.session.userId === undefined) {
return res.redirect("/signin");
}
const requestData = req.body;
const { serial } = req.query;
const {
NM1,
APN1,
UN1,
PW1,
NM2,
APN2,
UN2,
PW2,
AT,
TN1,
TN2,
TN3
} = requestData;
const requestBody = {
"M3G": {
"M3M": {
"AT": AT,
"TN1":TN1,
"TN2":TN2,
"TN3":TN3
},
"MP": {
"NM": NM1,
"APN": APN1,
"UN": UN1,
"PW": PW1
},
"M4G": {
"NM": NM2,
"APN": APN2,
"UN": UN2,
"PW": PW2
},
}
};
try {
const response = await axios.get(`http://${process.env.SERVER_IP}:8080/http/parameters/set?serial=${serial}`, {
data: JSON.stringify(requestBody),
headers: {
'Content-Type': 'application/json'
}
});
res.status(response.status).send(response.data);
} catch (error) {
res.status(500).send('Произошла ошибка при отправке GET запроса.');
}
});
app.post('/install-parameters', async (req, res) => {
if (req.session.userId === undefined) {
return res.redirect("/signin");
}
try {
const { serial } = req.body;
const requestResponse = await axios.get(`http://${process.env.SERVER_IP}:8080/http/parameters/request?serial=${serial}`, {
headers: {
'Content-Type': 'application/json',
},
data: JSON.stringify({
"FIELDS": [
"MCMS"
]
}),
});
await new Promise(resolve => setTimeout(resolve, 300));
const getResponse = await axios.get(`http://${process.env.SERVER_IP}:8080/http/parameters/get?serial=${serial}`);
res.json(getResponse.data);
} catch (error) {
console.error(error);
res.status(500).json({ error: 'Internal server error' });
}
});
app.put('/install-parameters', async (req, res) => {
if (req.session.userId === undefined) {
return res.redirect("/signin");
}
const requestData = req.body;
const { serial } = req.query;
const {
SP
} = requestData;
const requestBody = {
"MCMS": {
"SP": SP
}
};
try {
const response = await axios.get(`http://${process.env.SERVER_IP}:8080/http/parameters/set?serial=${serial}`, {
data: JSON.stringify(requestBody),
headers: {
'Content-Type': 'application/json'
}
});
res.status(response.status).send(response.data);
} catch (error) {
res.status(500).send('Произошла ошибка при отправке GET запроса.');
}
});
app.put('/device-parameters', async (req, res) => { app.put('/device-parameters', async (req, res) => {
if (req.session.userId === undefined) { if (req.session.userId === undefined) {
return res.redirect("/signin"); return res.redirect("/signin");
@ -2069,9 +2631,11 @@ app.put('/device-parameters', async (req, res) => {
TE, TE,
VE, VE,
SE, SE,
GE GE,
DE
} = requestData; } = requestData;
// Создаем JSON для GET запроса // Создаем JSON для GET запроса
const requestBody = { const requestBody = {
"TIMEP": { "TIMEP": {
@ -2087,16 +2651,26 @@ app.put('/device-parameters', async (req, res) => {
"SUBSTRNET": { "SUBSTRNET": {
"SM": parseInt(SUBSTREAMMODE, 10) || 1 "SM": parseInt(SUBSTREAMMODE, 10) || 1
}, },
"DOSD": { "EOSD": [
"NE": parseInt(NE, 10) || 1, { "GE": GE, "NE": NE, "SE": SE, "TE": TE, "VE": VE, "DE": DE },
"TE": parseInt(TE, 10) || 1, { "GE": GE, "NE": NE, "SE": SE, "TE": TE, "VE": VE, "DE": DE },
"VE": parseInt(VE, 10) || 0, { "GE": GE, "NE": NE, "SE": SE, "TE": TE, "VE": VE, "DE": DE },
"SE": parseInt(SE, 10) || 0, { "GE": GE, "NE": NE, "SE": SE, "TE": TE, "VE": VE, "DE": DE },
"GE": parseInt(GE, 10) || 0 { "GE": GE, "NE": NE, "SE": SE, "TE": TE, "VE": VE, "DE": DE },
} { "GE": GE, "NE": NE, "SE": SE, "TE": TE, "VE": VE, "DE": DE },
{ "GE": GE, "NE": NE, "SE": SE, "TE": TE, "VE": VE, "DE": DE },
{ "GE": GE, "NE": NE, "SE": SE, "TE": TE, "VE": VE, "DE": DE },
{ "GE": GE, "NE": NE, "SE": SE, "TE": TE, "VE": VE, "DE": DE },
{ "GE": GE, "NE": NE, "SE": SE, "TE": TE, "VE": VE, "DE": DE },
{ "GE": GE, "NE": NE, "SE": SE, "TE": TE, "VE": VE, "DE": DE },
{ "GE": GE, "NE": NE, "SE": SE, "TE": TE, "VE": VE, "DE": DE },
{ "GE": GE, "NE": NE, "SE": SE, "TE": TE, "VE": VE, "DE": DE },
{ "GE": GE, "NE": NE, "SE": SE, "TE": TE, "VE": VE, "DE": DE },
{ "GE": GE, "NE": NE, "SE": SE, "TE": TE, "VE": VE, "DE": DE },
{ "GE": GE, "NE": NE, "SE": SE, "TE": TE, "VE": VE, "DE": DE },
]
}; };
// Отправляем GET запрос с JSON BODY // Отправляем GET запрос с JSON BODY
try { try {
const response = await axios.get(`http://${process.env.SERVER_IP}:8080/http/parameters/set?serial=${serial}`, { const response = await axios.get(`http://${process.env.SERVER_IP}:8080/http/parameters/set?serial=${serial}`, {
@ -2183,6 +2757,7 @@ app.post("/updatedevice", async (req, res) => {
serialNumber, serialNumber,
deviceNumber, deviceNumber,
plateNumber, plateNumber,
vinNumber,
channelsAmount, channelsAmount,
plateColor, plateColor,
IPAddress, IPAddress,
@ -2249,8 +2824,9 @@ app.post("/updatedevice", async (req, res) => {
installer = $28, installer = $28,
installation = $29, installation = $29,
description = $30, description = $30,
number = $31 number = $31,
WHERE serial = $32 vin = $32
WHERE serial = $33
RETURNING *; RETURNING *;
`; `;
@ -2286,6 +2862,7 @@ app.post("/updatedevice", async (req, res) => {
equipmentInstalled, equipmentInstalled,
equipmentDescription, equipmentDescription,
deviceNumber, deviceNumber,
vinNumber,
serialNumber, serialNumber,
]; ];

View File

@ -0,0 +1,253 @@
const container = document.getElementById("new-parameters");
const content1 = document.getElementById("parameters");
const content2 = document.getElementById("ethernet");
const content3 = document.getElementById("wifi");
const content4 = document.getElementById("communication");
const content5 = document.getElementById("install");
const content6 = document.getElementById("cameras");;
const radioButtons = document.querySelectorAll(
'input[type="radio"][name="newStage"]'
);
const duration = 100;
let activeContent = content1;
function switchContent(newContent) {
fadeOut(activeContent, () => {
fadeIn(newContent);
activeContent = newContent;
});
}
function fadeIn(element) {
element.style.opacity = 0;
element.style.display = "block";
let start = performance.now();
function animate(time) {
let timeFraction = (time - start) / duration;
if (timeFraction > 1) {
element.style.opacity = 1;
} else {
element.style.opacity = timeFraction;
requestAnimationFrame(animate);
}
}
requestAnimationFrame(animate);
}
function fadeOut(element, callback) {
element.style.opacity = 1;
let start = performance.now();
function animate(time) {
let timeFraction = (time - start) / duration;
if (timeFraction > 1) {
element.style.opacity = 0;
element.style.display = "none";
if (callback) {
callback();
}
} else {
element.style.opacity = 1 - timeFraction;
requestAnimationFrame(animate);
}
}
requestAnimationFrame(animate);
}
for (let radioButton of radioButtons) {
radioButton.addEventListener("change", () => {
if (radioButton.value === "parameters") {
switchContent(content1);
document.getElementById('parameters-bg').style.display = 'flex';
fetch('/device-parameters', {
method: 'POST',
headers: {
'Content-Type': 'application/json'
},
body: JSON.stringify(requestBody)
})
.then(response => response.json())
.then(data => {
document.getElementById('parameters-bg').style.display = 'none';
camerasData = data;
console.log(data.DATA);
document.getElementById('system-date').value = data.DATA.TIMEP.DATEM;
document.getElementById('system-time').value = data.DATA.TIMEP.TIMEM;
document.getElementById('system-language').value = data.DATA.GSP.LANT;
document.getElementById('system-timezone').value = data.DATA.TIMEP.TIMEZ;
document.getElementById('system-geo').value = data.DATA.GSP.GM;
document.getElementById('system-stream').value = data.DATA.SUBSTRNET.SM;
document.getElementById('NE').checked = data.DATA.EOSD[0].NE === 1;
document.getElementById('TE').checked = data.DATA.EOSD[0].TE === 1;
document.getElementById('VE').checked = data.DATA.EOSD[0].VE === 1;
document.getElementById('SE').checked = data.DATA.EOSD[0].SE === 1;
document.getElementById('GE').checked = data.DATA.EOSD[0].GE === 1;
document.getElementById('DE').checked = data.DATA.EOSD[0].DE === 1;
$("select").trigger("input");
})
.catch(error => console.error('Ошибка:', error));
} else if (radioButton.value === "ethernet") {
switchContent(content2);
document.getElementById('parameters-bg').style.display = 'flex';
fetch('/ethernet-parameters', {
method: 'POST',
headers: {
'Content-Type': 'application/json'
},
body: JSON.stringify(requestBody)
})
.then(response => response.json())
.then(data => {
document.getElementById('parameters-bg').style.display = 'none';
camerasData = data;
console.log(data.DATA);
document.getElementById('system-ipmode').value = data.DATA.ETHERNET.IPMODE;
document.getElementById('system-ipaddr').value = data.DATA.ETHERNET.PIP.IPADDR;
document.getElementById('system-submask').value = data.DATA.ETHERNET.PIP.SUBMASK;
document.getElementById('system-gateway').value = data.DATA.ETHERNET.PIP.GATEWAY;
document.getElementById('system-dnsmode').value = data.DATA.ETHERNET.DNSMODE;
document.getElementById('system-pdns').value = data.DATA.ETHERNET.DNS.PDNS;
document.getElementById('system-adns').value = data.DATA.ETHERNET.DNS.ADNS;
document.getElementById('system-mac').value = data.DATA.KEYS.MAC;
$("select").trigger("input");
})
.catch(error => console.error('Ошибка:', error));
} else if (radioButton.value === "wifi") {
switchContent(content3);
document.getElementById('parameters-bg').style.display = 'flex';
fetch('/wifi-parameters', {
method: 'POST',
headers: {
'Content-Type': 'application/json'
},
body: JSON.stringify(requestBody)
})
.then(response => response.json())
.then(data => {
document.getElementById('parameters-bg').style.display = 'none';
camerasData = data;
console.log(data.DATA);
document.getElementById('system-wifi').value = data.DATA.WIFI.ENABLE;
document.getElementById('system-wifi-essid').value = data.DATA.WIFI.ESSID;
document.getElementById('system-wifi-ecrypttype').value = data.DATA.WIFI.ECRYPTTYPE;
document.getElementById('system-wifi-pwd').value = data.DATA.WIFI.PWD;
document.getElementById('system-wifi-ipmode').value = data.DATA.WIFI.IPMODE;
document.getElementById('system-wifi-ipaddr').value = data.DATA.WIFI.PIP.IPADDR;
document.getElementById('system-wifi-submask').value = data.DATA.WIFI.PIP.SUBMASK;
document.getElementById('system-wifi-gateway').value = data.DATA.WIFI.PIP.GATEWAY;
$("select").trigger("input");
})
.catch(error => console.error('Ошибка:', error));
} else if (radioButton.value === "communication") {
switchContent(content4);
document.getElementById('parameters-bg').style.display = 'flex';
fetch('/communication-parameters', {
method: 'POST',
headers: {
'Content-Type': 'application/json'
},
body: JSON.stringify(requestBody)
})
.then(response => response.json())
.then(data => {
document.getElementById('parameters-bg').style.display = 'none';
camerasData = data;
console.log(data.DATA);
document.getElementById('system-nm1').value = data.DATA.M3G.MP.NM;
document.getElementById('system-apn1').value = data.DATA.M3G.MP.APN;
document.getElementById('system-un1').value = data.DATA.M3G.MP.UN;
document.getElementById('system-pw1').value = data.DATA.M3G.MP.PW;
document.getElementById('system-nm2').value = data.DATA.M3G.M4G.NM;
document.getElementById('system-apn2').value = data.DATA.M3G.M4G.APN;
document.getElementById('system-un2').value = data.DATA.M3G.M4G.UN;
document.getElementById('system-pw2').value = data.DATA.M3G.M4G.PW;
document.getElementById('system-at').value = data.DATA.M3G.M3M.AT;
document.getElementById('system-tn1').value = data.DATA.M3G.M3M.TN1;
document.getElementById('system-tn2').value = data.DATA.M3G.M3M.TN2;
document.getElementById('system-tn3').value = data.DATA.M3G.M3M.TN3;
$("select").trigger("input");
})
.catch(error => console.error('Ошибка:', error));
} else if (radioButton.value === "install") {
switchContent(content5);
document.getElementById('parameters-bg').style.display = 'flex';
fetch('/install-parameters', {
method: 'POST',
headers: {
'Content-Type': 'application/json'
},
body: JSON.stringify(requestBody)
})
.then(response => response.json())
.then(data => {
document.getElementById('parameters-bg').style.display = 'none';
camerasData = data;
console.log(data.DATA);
clearServerContainer();
data.DATA.MCMS.SP.forEach((data) => {
addServer(data);
});
$("select").trigger("input");
})
.catch(error => console.error('Ошибка:', error));
} else if (radioButton.value === "cameras") {
switchContent(content6);
}
});
}
function truncateText(select) {
var maxLength = 30;
var option = select.options[select.selectedIndex];
if (option.text.length > maxLength) {
option.text = option.text.substring(0, maxLength) + "...";
}
}

View File

@ -30,7 +30,7 @@ const createTable = () => {
reportID.textContent = device.id; reportID.textContent = device.id;
row.appendChild(reportID); row.appendChild(reportID);
const plate = document.createElement("td"); const plate = document.createElement("td");
plate.textContent = device.plate; plate.textContent = device.number;
row.appendChild(plate); row.appendChild(plate);
const numberTS = document.createElement("td"); const numberTS = document.createElement("td");
numberTS.textContent = device.serial; numberTS.textContent = device.serial;
@ -77,7 +77,6 @@ const createPagination = () => {
const pageLink = document.createElement("a"); const pageLink = document.createElement("a");
pageLink.href = "#"; pageLink.href = "#";
if (i === currentPage) { if (i === currentPage) {
document.querySelector("#device-all").checked = false;
pageLink.classList.add("active"); pageLink.classList.add("active");
} }
pageLink.textContent = i; pageLink.textContent = i;

View File

@ -27,9 +27,6 @@ const createTable = () => {
const number = document.createElement("td"); const number = document.createElement("td");
number.textContent = device.number; number.textContent = device.number;
row.appendChild(number); row.appendChild(number);
const plate = document.createElement("td");
plate.textContent = device.plate;
row.appendChild(plate);
const serial = document.createElement("td"); const serial = document.createElement("td");
serial.textContent = device.serial; serial.textContent = device.serial;
row.appendChild(serial); row.appendChild(serial);
@ -72,7 +69,8 @@ const createTable = () => {
if (EditTransport) { if (EditTransport) {
const optionsButton = document.createElement("button"); const optionsButton = document.createElement("button");
optionsButton.setAttribute("class", "options"); optionsButton.setAttribute("class", "options");
optionsButton.setAttribute("onclick", `openForm("${device.id}")`); // optionsButton.setAttribute("onclick", `openForm("${device.id}")`);
optionsButton.setAttribute("onclick", `location.href = "/devices/device/${device.serial}"`);
optionsButton.value = `options-device-${device.id}`; optionsButton.value = `options-device-${device.id}`;
optionsButton.id = `options-device-${device.id}`; optionsButton.id = `options-device-${device.id}`;
trashCell.appendChild(optionsButton); trashCell.appendChild(optionsButton);
@ -103,7 +101,7 @@ const createPagination = () => {
const pageLink = document.createElement("a"); const pageLink = document.createElement("a");
pageLink.href = "#"; pageLink.href = "#";
if (i === currentPage) { if (i === currentPage) {
document.querySelector("#device-all").checked = false; // document.querySelector("#device-all").checked = false;
pageLink.classList.add("active"); pageLink.classList.add("active");
} }
pageLink.textContent = i; pageLink.textContent = i;

View File

@ -1130,6 +1130,7 @@ tr:nth-child(even) {
height: 90%; height: 90%;
border: 2px solid #f5f5fa; border: 2px solid #f5f5fa;
border-radius: 20px 0px 0px 20px; border-radius: 20px 0px 0px 20px;
padding-bottom: 25px;
} }
.for-new input[type="radio"] { .for-new input[type="radio"] {
@ -1190,6 +1191,7 @@ tr:nth-child(even) {
border: 2px solid #f5f5fa; border: 2px solid #f5f5fa;
border-left: 0; border-left: 0;
border-radius: 0px 20px 20px 0px; border-radius: 0px 20px 20px 0px;
padding-bottom: 25px;
} }
.new-parameters { .new-parameters {

View File

@ -0,0 +1,685 @@
<!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.0">
<title>{{Serial}}</title>
<link rel="stylesheet" href="../../styles/main.css" />
</head>
<body>
<style>
.main {
margin-top: 92px !important;
}
.main .bg {
min-height: calc(100vh - 162px - 92px);
}
</style>
<header>
<img src="../../img/argus.png">
<h1>Аргус</h1>
<h2><span>/</span> {{Organisation}}</h2>
</header>
<section class="account-info">
<div id="account-main">
<img id="person" src="../../img/person.svg">
<span>{{User}}</span>
<img id="down" src="../../img/down.svg">
<img id="up" src="../../img/up.svg">
</div>
<a href="/logout"><div id="account-additional" class="additional">Выйти</div></a>
</section>
<section class="navigation">
<a href="/">
<div><img src="../../img/chart.svg">Главная</div>
</a>
<a href="/devices">
<div class="selected"><img src="../../img/cloud.svg">Устройства</div>
</a>
<a href="/reports">
<div><img src="../../img/bubble.svg">Отчёты</div>
</a>
<a href="/live">
<div><img src="../../img/waves.svg">Трансляция</div>
</a>
<a href="/videos">
<div><img src="../../img/play.svg">Записи</div>
</a>
{{#if isAdmin}}
<a class="admin-panel" href="/admin">
<div><img src="../../img/keyboard.svg">Админка</div>
</a>
{{/if}}
<a class="settings" href="/settings">
<div><img src="../../img/gear.svg">Настройки</div>
</a>
</section>
<section class="main">
{{#if ifDBError}}
<section class="dberror">
<div class="erorr-container">
<img src="../../img/warning.svg"> <br>
<h1>Ошибка </h1> <br>
<span>Не удалось получить данные из БД</span>
<button type="button" onclick="location.reload();">Повторить попытку</button>
</div>
</section>
{{/if}}
<section style="display: none;" class="dberror" id="addInformation" >
<div class="erorr-container">
<div id="loader" class="loader">
<div class="square" id="sq1"></div>
<div class="square" id="sq2"></div>
<div class="square" id="sq3"></div>
<div class="square" id="sq4"></div>
<div class="square" id="sq5"></div>
<div class="square" id="sq6"></div>
<div class="square" id="sq7"></div>
<div class="square" id="sq8"></div>
<div class="square" id="sq9"></div>
</div>
<svg id="success-mark" style="display: none;" xmlns="http://www.w3.org/2000/svg" width="108" height="108" fill="none" viewBox="0 0 108 108">
<g clip-path="url(#a)">
<path fill="#8086F9" fill-opacity=".85" d="M54 107.947c29.541 0 54-24.5 54-53.973C108 24.447 83.488 0 53.947 0 24.459 0 0 24.447 0 53.974c0 29.474 24.512 53.973 54 53.973Zm0-8.995c-24.988 0-44.947-20.002-44.947-44.978 0-24.976 19.906-44.978 44.894-44.978S99 28.998 99 53.974c0 24.976-20.012 44.978-45 44.978Zm-5.824-19.844c1.747 0 3.23-.846 4.289-2.487l24.194-38.046c.582-1.058 1.27-2.222 1.27-3.386 0-2.382-2.117-3.916-4.341-3.916-1.323 0-2.647.847-3.653 2.381l-21.97 35.241-10.43-13.493c-1.27-1.693-2.435-2.116-3.917-2.116-2.277 0-4.077 1.852-4.077 4.18 0 1.164.477 2.276 1.218 3.28l12.917 15.875c1.324 1.747 2.753 2.487 4.5 2.487Z"/>
</g>
<defs>
<clipPath id="a">
<path fill="#fff" d="M0 0h108v108H0z"/>
</clipPath>
</defs>
</svg>
<h1>Обновление устройства</h1> <br>
<span id="status">Пожалуйста, подождите</span>
<button id="closeButton" style="display: none;" onclick="hideMessage()">Закрыть</button>
</div>
</section>
<div class="name">
<span>{{Serial}}</span>
</div>
<nav>
<a class="return-name" href="/devices">
<svg xmlns="http://www.w3.org/2000/svg" width="10" height="17" fill="none" viewBox="0 0 10 17">
<g clip-path="url(#a)">
<path fill="#8086F9" d="M0 8.477a.88.88 0 0 0 .273.644l7.745 7.568a.84.84 0 0 0 .634.264c.508 0 .899-.38.899-.889a.917.917 0 0 0-.264-.634l-7.11-6.953 7.11-6.954A.936.936 0 0 0 9.551.89.876.876 0 0 0 8.652 0a.869.869 0 0 0-.634.254L.273 7.832A.864.864 0 0 0 0 8.477Z"/>
</g>
<defs>
<clipPath id="a">
<path fill="#fff" d="M0 0h9.551v16.963H0z"/>
</clipPath>
</defs>
</svg>
Вернуться</a>
<a class="selected" href="/devices/device/{{Serial}}">Основные настройки</a>
<a href="/devices/device/system/{{Serial}}">Системные настройки</a>
</nav>
<section class="bg">
<section class="content">
<section class="for-new">
<section class="stages">
<input name="newStage" type="radio" value="details" id="stage-details" checked><label for="stage-details">Детали</label>
<div class="vertical-line"></div>
<input name="newStage" type="radio" value="sim" id="stage-sim"><label for="stage-sim">SIM - Карта</label>
<div class="vertical-line"></div>
<input name="newStage" type="radio" value="ts" id="stage-ts"><label for="stage-ts">Транспортное средство</label>
<div class="vertical-line"></div>
<input name="newStage" type="radio" value="equipment" id="stage-equipment"><label for="stage-equipment">Оборудование</label>
</section>
</section>
<section id="add-new-container" class="add-new">
<section style="display: flex; width: 100%; height:100%; top: 0; left: 0;" class="dberror" id="parameters-bg" >
<div class="loader-container">
<div class="loader">
<div class="square" id="sq11"></div>
<div class="square" id="sq12"></div>
<div class="square" id="sq13"></div>
<div class="square" id="sq14"></div>
<div class="square" id="sq15"></div>
<div class="square" id="sq16"></div>
<div class="square" id="sq17"></div>
<div class="square" id="sq18"></div>
<div class="square" id="sq19"></div>
</div>
</div>
</section>
<img src="../img/xmark.svg" id="close-form-btn">
<form id="edit-form" enctype="multipart/form-data" method="post" action="/updatedevice">
<div id="details" class="new-parameters active">
<h1>Детали устройства</h1>
<h2>Сперва самое необходимое</h2>
<div class="horizontal-line"></div>
<div class="parameters-inputs">
<div class="parameters-input">
<label for="parameters-serial">Серийный номер<span style="color: rgba(255, 69, 58, 1);">*</span></label>
<input name="serialNumber" type="text" id="parameters-serial" placeholder="Серийный номер устройства" required readonly>
</div>
<div class="parameters-input">
<label for="parameters-number">Номерной знак</label>
<input name="deviceNumber" type="text" id="parameters-number" placeholder="Номерной знак устройства">
</div>
<div class="parameters-input">
<label for="parameters-plate">Государственный номер<span style="color: rgba(255, 69, 58, 1);">*</span></label>
<input name="plateNumber" type="text" id="parameters-plate" placeholder="Государственный номер ТС" required>
</div>
<div class="parameters-input">
<label for="parameters-vin">VIN</label>
<input name="vinNumber" type="text" id="parameters-vin" placeholder="VIN номер устройства">
</div>
<div class="parameters-input">
<label for="parameters-channels">Количество каналов<span style="color: rgba(255, 69, 58, 1);">*</span></label>
<input name="channelsAmount" type="text" id="parameters-channels" placeholder="Кол-во каналов устройства" required>
</div>
<div class="parameters-input">
<label for="parameters-plateColor">Цвет номерного знака<span style="color: rgba(255, 69, 58, 1);">*</span></label>
<select name="plateColor" id="parameters-plateColor">
<option value="white">Белый</option>
<option value="blue">Синий</option>
<option value="yellow">Жёлтый</option>
</select>
</div>
<div class="parameters-input">
<label for="parameters-ip">IP-адрес<span style="color: rgba(255, 69, 58, 1);">*</span></label>
<input name="IPAddress" type="text" id="parameters-ip" placeholder="IP-адрес сервера" required>
</div>
<div class="parameters-input">
<label for="parameters-port">Порт<span style="color: rgba(255, 69, 58, 1);">*</span></label>
<input name="serverPort" type="text" id="parameters-port" placeholder="Порт сервера" required>
</div>
<div class="parameters-input">
<label for="parameters-group">Группа<span style="color: rgba(255, 69, 58, 1);">*</span></label>
<select name="deviceGroup" id="parameters-group">
<option value="0">Другое</option>
{{#each GroupsList}}
<option value="{{this.id}}">{{this.name}}</option>
{{/each}}
</select>
</div>
<div class="parameters-input">
<label for="parameters-protocol">Протокол<span style="color: rgba(255, 69, 58, 1);">*</span></label>
<select name="connectionProtocol" id="parameters-protocol">
<option value="N9M">N9M</option>
</select>
</div>
</div>
<div class="horizontal-line"></div>
<button id="continue-details" type="button">Продолжить</button>
</div>
<div id="sim" class="new-parameters">
<h1>Настройки SIM-карты</h1>
<h2>Для связи с устройством</h2>
<div class="horizontal-line"></div>
<div class="parameters-inputs">
<div class="parameters-input">
<label for="parameters-sim">Номер SIM-карты<span style="color: rgba(255, 69, 58, 1);">*</span></label>
<input name="sumNumber" type="text" id="parameters-sim" placeholder="Номер SIM-карты" required>
</div>
<div class="parameters-input">
<label for="parameters-sim-imei">IMEI<span style="color: rgba(255, 69, 58, 1);">*</span></label>
<input name="simIMEI" type="text" id="parameters-sim-imei" placeholder="IMEI SIM-карты" required>
</div>
<div class="parameters-input">
<label for="parameters-sim-imsi">IMSI<span style="color: rgba(255, 69, 58, 1);">*</span></label>
<input name="simIMSI" type="text" id="parameters-sim-imsi" placeholder="IMSI SIM-карты" required>
</div>
<div class="parameters-input">
<label for="parameters-sim-module">Тип сетевого модуля<span style="color: rgba(255, 69, 58, 1);">*</span></label>
<select name="simModule" id="parameters-sim-module">
<option value="GPRS">GPRS</option>
<option value="CDMA">CDMA</option>
<option value="EVDO">EVDO</option>
<option value="WCDMA">WCDMA</option>
<option value="EDGE">EDGE</option>
<option value="TDSCDMA">TDSCDMA</option>
<option value="LTE-TDD">LTE-TDD</option>
<option value="LTE-FDD">LTE-FDD</option>
</select>
</div>
</div>
<div class="horizontal-line"></div>
<button id="continue-sim" type="button">Продолжить</button>
</div>
<div id="ts" class="new-parameters">
<h1>Детали транспортного средства</h1>
<h2>Технические характеристики и не только</h2>
<div class="horizontal-line"></div>
<div class="parameters-inputs">
<div class="parameters-input">
<label for="parameters-trasnsport-type">Тип автомобиля<span style="color: rgba(255, 69, 58, 1);">*</span></label>
<select name="transportType" id="parameters-trasnsport-type" onchange="truncateText(this)">
<option value="1">Пассажирский подвижной состав</option>
<option value="2">Большой автобус</option>
<option value="3">Средний автобус</option>
<option value="4">Микроавтобус</option>
<option value="5">Лимузин</option>
<option value="6">Большой спальный автобус</option>
<option value="7">Спальный автобус среднего размера</option>
<option value="8">Обычный грузовик</option>
<option value="9">Большой обычный грузовик</option>
<option value="10">Среднегабаритный обычный грузовик</option>
<option value="11">Маленький обычный грузовик</option>
<option value="12">Специальная транспортировочная машина</option>
<option value="13">Контейнерная тележка</option>
<option value="14">Большой транспортировочный автомобиль</option>
<option value="15">Изометрический вагон</option>
<option value="16">Спецтехника для перевозки грузовых автомобилей</option>
<option value="17">Танкер</option>
<option value="18">Тягач</option>
<option value="19">Прицеп</option>
<option value="20">Транспортер</option>
<option value="21">Другая спецтехника</option>
<option value="22">Автомобиль для перевозки опасных грузов</option>
<option value="23">Сельскохозяйственная машина</option>
</select>
</div>
<div class="parameters-input">
<label for="parameters-trasnsport-factory">Номер завода<span style="color: rgba(255, 69, 58, 1);">*</span></label>
<input name="transportFactory" type="text" id="parameters-trasnsport-factory" placeholder="Номер завода ТС" required>
</div>
<div class="parameters-input">
<label for="parameters-transport-strength">Несущая способность<span style="color: rgba(255, 69, 58, 1);">*</span></label>
<input name="transportStrength" type="text" id="parameters-transport-strength" placeholder="Несущая способность (тонны)" required>
</div>
<div class="parameters-input">
<label for="parameters-transport-engine">Номер двигателя<span style="color: rgba(255, 69, 58, 1);">*</span></label>
<input name="transportEngine" type="text" id="parameters-transport-engine" placeholder="Номер двигателя ТС" required>
</div>
<div class="parameters-input">
<label for="parameters-transport-stanina">Номер станины<span style="color: rgba(255, 69, 58, 1);">*</span></label>
<input name="transportStanina" type="text" id="parameters-transport-stanina" placeholder="Номер станины ТС" required>
</div>
<div class="parameters-input">
<label for="parameters-trasnsport-fuel">Тип топливного масла<span style="color: rgba(255, 69, 58, 1);">*</span></label>
<select name="transportFuel" id="parameters-trasnsport-fuel">
<option value="gasoline">Бензин</option>
<option value="diesel">Дизельное топливо</option>
<option value="naturalGas">Природный газ</option>
<option value="liquefiedGas">Сжиженный газ</option>
<option value="electric">Электрическое</option>
<option value="other">Прочие</option>
</select>
</div>
<div class="parameters-input">
<div class="parameters-transport-certificate">
<label for="parameters-transport-certificate">Свид-ство о дорожной перевозке<span style="color: rgba(255, 69, 58, 1);">*</span></label>
<input name="transportCertificate" type="text" id="parameters-transport-certificate" placeholder="Номер свидетельства" required>
</div>
</div>
<div class="parameters-input">
<div class="pparameters-trasnsport-category">
<label for="parameters-trasnsport-category">Техническая категория<span style="color: rgba(255, 69, 58, 1);">*</span></label>
<select name="transportCategory" id="parameters-trasnsport-category">
<option value="1">Категория 1</option>
<option value="2">Категория 2</option>
<option value="3">Категория 3</option>
<option value="other">Не достает стандарта</option>
</select>
</div>
</div>
<div class="parameters-input">
<label for="parameters-transport-expire">Срок действия<span style="color: rgba(255, 69, 58, 1);">*</span></label>
<input name="transportExpire" type="date" id="parameters-transport-expire" required>
</div>
<div class="parameters-input">
<label for="parameters-transport-consumption">Расход топлива на 100 км<span style="color: rgba(255, 69, 58, 1);">*</span></label>
<input name="transportConsumption" type="text" id="parameters-transport-consumption" placeholder="Расход топлива в литрах" required>
</div>
<div class="parameters-input">
<label for="parameters-transport-province">Провинция<span style="color: rgba(255, 69, 58, 1);">*</span></label>
<input name="transportProvince" type="text" id="parameters-transport-province" placeholder="Провинция" required>
</div>
<div class="parameters-input">
<label for="parameters-transport-city">Город<span style="color: rgba(255, 69, 58, 1);">*</span></label>
<input name="transportCity" type="text" id="parameters-transport-city" placeholder="Город" required>
</div>
</div>
<div class="horizontal-line"></div>
<button id="continue-ts" type="button">Продолжить</button>
</div>
<div id="equipment" class="new-parameters">
<h1>Информация о оборудовании</h1>
<h2>Технические моменты</h2>
<div class="horizontal-line"></div>
<div class="parameters-inputs">
<div class="parameters-input">
<label for="parameters-equipment-name">Имя устройства<span style="color: rgba(255, 69, 58, 1);">*</span></label>
<input name="equipmentName" type="text" id="parameters-equipment-name" placeholder="Имя пользовательского устройства" required>
</div>
<div class="parameters-input">
<label for="parameters-equipment-password">Пароль устройства<span style="color: rgba(255, 69, 58, 1);">*</span></label>
<input name="equipmentPassword" type="text" id="parameters-equipment-password" placeholder="Пароль устройства" required>
</div>
<div class="parameters-input">
<label for="parameters-equipment-number">Номер партии<span style="color: rgba(255, 69, 58, 1);">*</span></label>
<input name="equipmentNumber" type="text" id="parameters-equipment-number" placeholder="Заводской номер партии" required>
</div>
<div class="parameters-input">
<label for="parameters-equipment-released">Дата выпуска<span style="color: rgba(255, 69, 58, 1);">*</span></label>
<input name="equipmentReleased" type="date" id="parameters-equipment-released" required>
</div>
<div class="parameters-input">
<label for="parameters-device-installer">Установщик<span style="color: rgba(255, 69, 58, 1);">*</span></label>
<input name="equipmentInstaller" type="text" id="parameters-device-installer" placeholder="ФИО установщика" required>
</div>
<div class="parameters-input">
<label for="parameters-equipment-installed">Дата монтажа<span style="color: rgba(255, 69, 58, 1);">*</span></label>
<input name="equipmentInstalled" type="date" id="parameters-equipment-installed" required>
</div>
<label for="parameters-device-description">Внешнее описание</label>
<input name="equipmentDescription" type="text" id="parameters-device-description" placeholder="Внешнее описание ">
</div>
<div class="horizontal-line"></div>
<button type="button" id="send-form">Сохранить</button>
</div>
</form>
</section>
</section>
</section>
</section>
<section style="display: none;" class="dberror" id="deleteConfirmation">
<div class="erorr-container">
<img src="../img/warning.svg"> <br>
<h1>Удаление группы </h1> <br>
<span>Вы уверены что хотите удалить <span id="driverDeleteInfo"></span>?</span>
<div class="buttons">
<button id="deleteCancel" onclick="closeDeletion();" style="display: inline-block; background-color: white; color: rgba(0, 0, 0, 0.7); margin-right: 5px;" type="button" onclick="deleteDriver()">Отменить</button>
<button id="deleteDriver" style="display: inline-block;" type="button">Подтвердить</button>
</div>
</div>
</section>
<script src="../../scripts/jquery.min.js"></script>
<script src="https://rawgit.com/RobinHerbots/Inputmask/5.x/dist/jquery.inputmask.js"></script>
<script src="../../scripts/device-form.js"></script>
<script>
$(document).ready(function(){
$('#user-phone').inputmask({"mask": "+7 (999) 999-9999"});
});
</script>
<script>
function formatDate(date) {
if (date === "") {
date = new Date();
} else {
date = new Date(date)
}
const year = date.getFullYear();
const month = String(date.getMonth() + 1).padStart(2, '0');
const day = String(date.getDate()).padStart(2, '0');
return `${year}-${month}-${day}`;
}
$("#parameters-plate").val("{{Plate}}");
$("#parameters-number").val("{{Number}}");
$("#parameters-plateColor").val("{{PlateColor}}");
$("#parameters-serial").val("{{Serial}}");
$("#parameters-channels").val("{{Channels}}");
$("#parameters-protocol").val("{{Protocol}}");
$("#parameters-ip").val("{{Ip}}");
$("#parameters-group").val("{{Group}}");
$("#parameters-port").val("{{Port}}");
$("#parameters-sim").val("{{Sim}}");
$("#parameters-sim-imei").val("{{Imei}}");
$("#parameters-sim-imsi").val("{{Imsi}}");
$("#parameters-sim-module").val("{{Module}}");
$("#parameters-trasnsport-type").val("{{Type}}");
$("#parameters-trasnsport-factory").val("{{Factory}}");
$("#parameters-transport-strength").val("{{Capacity}}");
$("#parameters-transport-engine").val("{{Engine}}");
$("#parameters-transport-stanina").val("{{Stanina}}");
$("#parameters-trasnsport-fuel").val("{{Fuel}}");
$("#parameters-transport-certificate").val("{{Certificate}}");
$("#parameters-transport-category").val("{{Category}}");
$("#parameters-transport-expire").val(formatDate("{{Expire}}"));
$("#parameters-transport-consumption").val("{{Consumption}}");
$("#parameters-transport-province").val("{{Region}}");
$("#parameters-transport-city").val("{{City}}");
$("#parameters-equipment-name").val("{{Name}}");
$("#parameters-equipment-password").val("{{Password}}");
$("#parameters-equipment-number").val("{{Batch}}");
$("#parameters-equipment-released").val(formatDate("{{Release}}"));
$("#parameters-device-installer").val("{{Installer}}");
$("#parameters-equipment-installed").val(formatDate("{{Installation}}"));
$("#parameters-device-description").val("{{Description}}");
document.getElementById('parameters-bg').style.display = 'flex';
const requestBody = {
"serial": $("#parameters-serial").val()
};
fetch('/main-parameters', {
method: 'POST',
headers: {
'Content-Type': 'application/json'
},
body: JSON.stringify(requestBody)
})
.then(response => response.json())
.then(data => {
document.getElementById('parameters-bg').style.display = 'none';
camerasData = data;
document.getElementById('parameters-number').value = data.DATA.RIP.BN;
document.getElementById('parameters-plate').value = data.DATA.RIP.BID;
document.getElementById('parameters-vin').value = data.DATA.VS.VIN;
})
.catch(error => console.error('Ошибка:', error));
</script>
<script>
async function sendPutRequest() {
const NUMBER = document.getElementById('parameters-number').value;
const PLATE = document.getElementById('parameters-plate').value;
const VIN = document.getElementById('parameters-vin').value;
const serial = $("#parameters-serial").val();
// Создаем объект данных для PUT запроса
const requestData = {
NUMBER,
PLATE,
VIN,
};
try {
// Отправляем PUT запрос
const response = await fetch(`/main-parameters?serial=${serial}`, {
method: 'PUT',
headers: {
'Content-Type': 'application/json',
},
body: JSON.stringify(requestData),
});
if (response.ok) {
// PUT запрос выполнен успешно
var formContainer = $("#form-bg");
var form = $("#form");
formContainer.removeClass("active");
form.removeClass("form-animation");
$("body").css("overflow", "auto");
console.log('PUT запрос выполнен успешно');
} else {
console.error('Ошибка при выполнении PUT запроса');
}
} catch (error) {
console.error('Произошла ошибка при отправке PUT запроса:', error);
}
}
</script>
<script>
const form = document.getElementById('edit-form');
const sendButton = document.getElementById('send-form');
sendButton.addEventListener('click', function(event) {
event.preventDefault();
const xhr = new XMLHttpRequest();
const deleteConfirmation = document.getElementById("addInformation");
const loader = document.getElementById("loader");
const status = document.getElementById("status");
const closeButton = document.getElementById("closeButton");
const mark = document.getElementById("success-mark");
loader.style.display = "block";
closeButton.style.display = "none";
deleteConfirmation.style.display = "flex";
mark.style.display = "none";
xhr.open('POST', form.action, true);
xhr.setRequestHeader('Content-Type', 'application/json');
sendPutRequest();
xhr.onload = function() {
if (xhr.status === 200) {
showMessage("Данные успешно обновлены", true);
} else {
showMessage("Не удалось обновить данные", false);
console.error("Ошибка:", xhr.status);
}
};
// Получаем данные формы для отправки
const formData = new FormData(form);
// Создаем объект с данными формы
const data = {};
for (const [key, value] of formData) {
data[key] = value;
}
// Преобразуем данные в JSON
const jsonData = JSON.stringify(data);
// Отправляем данные формы
xhr.send(jsonData);
});
</script>
<script>
function hideMessage() {
location.reload();
const deleteConfirmation = document.getElementById("addInformation");
deleteConfirmation.style.display = "none";
}
function showMessage(messageText, isSuccess) {
const loader = document.getElementById("loader");
const status = document.getElementById("status");
const closeButton = document.getElementById("closeButton");
const mark = document.getElementById("success-mark");
loader.style.display = "none";
status.textContent = messageText;
if (isSuccess) {
mark.style.display = "block";
status.style.color = "green";
} else {
status.style.color = "red";
}
closeButton.style.display = "block";
}
</script>
<script>
// Скрытие/Показ дополнительных меню аккаунта
const accountMain = document.getElementById('account-main');
const accountAdditional = document.getElementById('account-additional');
const accountUp = document.getElementById('up');
const accountDown = document.getElementById('down');
accountAdditional.style.display = 'none';
accountUp.style.display = 'none';
accountMain.addEventListener('click', () => {
if (accountAdditional.style.display === 'none') {
accountAdditional.style.display = 'flex';
accountUp.style.display = 'unset';
accountDown.style.display = 'none';
} else {
accountAdditional.style.display = 'none';
accountUp.style.display = 'none';
accountDown.style.display = 'unset';
}
});
</script>
</body>
</html>

View File

@ -123,7 +123,6 @@
<thead> <thead>
<tr> <tr>
<th>Группа</th> <th>Группа</th>
<th>Код</th>
<th>Номерной знак</th> <th>Номерной знак</th>
<th>Серийный номер</th> <th>Серийный номер</th>
<th>Статус</th> <th>Статус</th>
@ -157,502 +156,7 @@
</section> </section>
</section> </section>
<section id="form-bg" class="edit-container">
<section id="form">
<section class="for-new">
<section class="stages">
<input name="newStage" type="radio" value="details" id="stage-details" checked><label for="stage-details">Детали</label>
<div class="vertical-line"></div>
<input name="newStage" type="radio" value="sim" id="stage-sim"><label for="stage-sim">SIM - Карта</label>
<div class="vertical-line"></div>
<input name="newStage" type="radio" value="ts" id="stage-ts"><label for="stage-ts">Транспортное средство</label>
<div class="vertical-line"></div>
<input name="newStage" type="radio" value="equipment" id="stage-equipment"><label for="stage-equipment">Оборудование</label>
<br>
<input name="newStage" type="radio" value="parameters" id="stage-parameters"><label style="margin-top: 90%;" for="stage-parameters" id="stage-parameters-label">Системные настройки</label>
<div class="vertical-line" id="between-parameters-and-cameras"></div>
<input name="newStage" type="radio" value="cameras" id="stage-cameras"><label for="stage-cameras" id="stage-cameras-label">Настройки камер</label>
</section>
</section>
<section id="add-new-container" class="add-new">
<img src="../img/xmark.svg" id="close-form-btn">
<form id="edit-form" enctype="multipart/form-data" method="post" action="/updatedevice">
<div id="details" class="new-parameters active">
<h1>Детали устройства</h1>
<h2>Сперва самое необходимое</h2>
<div class="horizontal-line"></div>
<div class="parameters-inputs">
<label for="parameters-serial">Серийный номер<span style="color: rgba(255, 69, 58, 1);">*</span></label>
<input name="serialNumber" type="text" id="parameters-serial" placeholder="Серийный номер устройства" required readonly>
<div class="parameters-input">
<label for="parameters-number">Цифровой код</label>
<input name="deviceNumber" type="text" id="parameters-number" placeholder="Цифровой код устройства">
</div>
<div class="parameters-input">
<label for="parameters-plate">Номерной знак<span style="color: rgba(255, 69, 58, 1);">*</span></label>
<input name="plateNumber" type="text" id="parameters-plate" placeholder="Номер номерного знака" required>
</div>
<div class="parameters-input">
<label for="parameters-channels">Количество каналов<span style="color: rgba(255, 69, 58, 1);">*</span></label>
<input name="channelsAmount" type="text" id="parameters-channels" placeholder="Кол-во каналов устройства" required>
</div>
<div class="parameters-input">
<label for="parameters-plateColor">Цвет номерного знака<span style="color: rgba(255, 69, 58, 1);">*</span></label>
<select name="plateColor" id="parameters-plateColor">
<option value="white">Белый</option>
<option value="blue">Синий</option>
<option value="yellow">Жёлтый</option>
</select>
</div>
<div class="parameters-input">
<label for="parameters-ip">IP-адрес<span style="color: rgba(255, 69, 58, 1);">*</span></label>
<input name="IPAddress" type="text" id="parameters-ip" placeholder="IP-адрес сервера" required>
</div>
<div class="parameters-input">
<label for="parameters-port">Порт<span style="color: rgba(255, 69, 58, 1);">*</span></label>
<input name="serverPort" type="text" id="parameters-port" placeholder="Порт сервера" required>
</div>
<div class="parameters-input">
<label for="parameters-group">Группа<span style="color: rgba(255, 69, 58, 1);">*</span></label>
<select name="deviceGroup" id="parameters-group">
<option value="0">Другое</option>
{{#each GroupsList}}
<option value="{{this.id}}">{{this.name}}</option>
{{/each}}
</select>
</div>
<div class="parameters-input">
<label for="parameters-protocol">Протокол<span style="color: rgba(255, 69, 58, 1);">*</span></label>
<select name="connectionProtocol" id="parameters-protocol">
<option value="N9M">N9M</option>
</select>
</div>
</div>
<div class="horizontal-line"></div>
<button id="continue-details" type="button">Продолжить</button>
</div>
<div id="sim" class="new-parameters">
<h1>Настройки SIM-карты</h1>
<h2>Для связи с устройством</h2>
<div class="horizontal-line"></div>
<div class="parameters-inputs">
<div class="parameters-input">
<label for="parameters-sim">Номер SIM-карты<span style="color: rgba(255, 69, 58, 1);">*</span></label>
<input name="sumNumber" type="text" id="parameters-sim" placeholder="Номер SIM-карты" required>
</div>
<div class="parameters-input">
<label for="parameters-sim-imei">IMEI<span style="color: rgba(255, 69, 58, 1);">*</span></label>
<input name="simIMEI" type="text" id="parameters-sim-imei" placeholder="IMEI SIM-карты" required>
</div>
<div class="parameters-input">
<label for="parameters-sim-imsi">IMSI<span style="color: rgba(255, 69, 58, 1);">*</span></label>
<input name="simIMSI" type="text" id="parameters-sim-imsi" placeholder="IMSI SIM-карты" required>
</div>
<div class="parameters-input">
<label for="parameters-sim-module">Тип сетевого модуля<span style="color: rgba(255, 69, 58, 1);">*</span></label>
<select name="simModule" id="parameters-sim-module">
<option value="GPRS">GPRS</option>
<option value="CDMA">CDMA</option>
<option value="EVDO">EVDO</option>
<option value="WCDMA">WCDMA</option>
<option value="EDGE">EDGE</option>
<option value="TDSCDMA">TDSCDMA</option>
<option value="LTE-TDD">LTE-TDD</option>
<option value="LTE-FDD">LTE-FDD</option>
</select>
</div>
</div>
<div class="horizontal-line"></div>
<button id="continue-sim" type="button">Продолжить</button>
</div>
<div id="ts" class="new-parameters">
<h1>Детали транспортного средства</h1>
<h2>Технические характеристики и не только</h2>
<div class="horizontal-line"></div>
<div class="parameters-inputs">
<div class="parameters-input">
<label for="parameters-trasnsport-type">Тип автомобиля<span style="color: rgba(255, 69, 58, 1);">*</span></label>
<select name="transportType" id="parameters-trasnsport-type" onchange="truncateText(this)">
<option value="1">Пассажирский подвижной состав</option>
<option value="2">Большой автобус</option>
<option value="3">Средний автобус</option>
<option value="4">Микроавтобус</option>
<option value="5">Лимузин</option>
<option value="6">Большой спальный автобус</option>
<option value="7">Спальный автобус среднего размера</option>
<option value="8">Обычный грузовик</option>
<option value="9">Большой обычный грузовик</option>
<option value="10">Среднегабаритный обычный грузовик</option>
<option value="11">Маленький обычный грузовик</option>
<option value="12">Специальная транспортировочная машина</option>
<option value="13">Контейнерная тележка</option>
<option value="14">Большой транспортировочный автомобиль</option>
<option value="15">Изометрический вагон</option>
<option value="16">Спецтехника для перевозки грузовых автомобилей</option>
<option value="17">Танкер</option>
<option value="18">Тягач</option>
<option value="19">Прицеп</option>
<option value="20">Транспортер</option>
<option value="21">Другая спецтехника</option>
<option value="22">Автомобиль для перевозки опасных грузов</option>
<option value="23">Сельскохозяйственная машина</option>
</select>
</div>
<div class="parameters-input">
<label for="parameters-trasnsport-factory">Номер завода<span style="color: rgba(255, 69, 58, 1);">*</span></label>
<input name="transportFactory" type="text" id="parameters-trasnsport-factory" placeholder="Номер завода ТС" required>
</div>
<div class="parameters-input">
<label for="parameters-transport-strength">Несущая способность<span style="color: rgba(255, 69, 58, 1);">*</span></label>
<input name="transportStrength" type="text" id="parameters-transport-strength" placeholder="Несущая способность (тонны)" required>
</div>
<div class="parameters-input">
<label for="parameters-transport-engine">Номер двигателя<span style="color: rgba(255, 69, 58, 1);">*</span></label>
<input name="transportEngine" type="text" id="parameters-transport-engine" placeholder="Номер двигателя ТС" required>
</div>
<div class="parameters-input">
<label for="parameters-transport-stanina">Номер станины<span style="color: rgba(255, 69, 58, 1);">*</span></label>
<input name="transportStanina" type="text" id="parameters-transport-stanina" placeholder="Номер станины ТС" required>
</div>
<div class="parameters-input">
<label for="parameters-trasnsport-fuel">Тип топливного масла<span style="color: rgba(255, 69, 58, 1);">*</span></label>
<select name="transportFuel" id="parameters-trasnsport-fuel">
<option value="gasoline">Бензин</option>
<option value="diesel">Дизельное топливо</option>
<option value="naturalGas">Природный газ</option>
<option value="liquefiedGas">Сжиженный газ</option>
<option value="electric">Электрическое</option>
<option value="other">Прочие</option>
</select>
</div>
<div class="parameters-input">
<div class="parameters-transport-certificate">
<label for="parameters-transport-certificate">Свид-ство о дорожной перевозке<span style="color: rgba(255, 69, 58, 1);">*</span></label>
<input name="transportCertificate" type="text" id="parameters-transport-certificate" placeholder="Номер свидетельства" required>
</div>
</div>
<div class="parameters-input">
<div class="pparameters-trasnsport-category">
<label for="parameters-trasnsport-category">Техническая категория<span style="color: rgba(255, 69, 58, 1);">*</span></label>
<select name="transportCategory" id="parameters-trasnsport-category">
<option value="1">Категория 1</option>
<option value="2">Категория 2</option>
<option value="3">Категория 3</option>
<option value="other">Не достает стандарта</option>
</select>
</div>
</div>
<div class="parameters-input">
<label for="parameters-transport-expire">Срок действия<span style="color: rgba(255, 69, 58, 1);">*</span></label>
<input name="transportExpire" type="date" id="parameters-transport-expire" required>
</div>
<div class="parameters-input">
<label for="parameters-transport-consumption">Расход топлива на 100 км<span style="color: rgba(255, 69, 58, 1);">*</span></label>
<input name="transportConsumption" type="text" id="parameters-transport-consumption" placeholder="Расход топлива в литрах" required>
</div>
<div class="parameters-input">
<label for="parameters-transport-province">Провинция<span style="color: rgba(255, 69, 58, 1);">*</span></label>
<input name="transportProvince" type="text" id="parameters-transport-province" placeholder="Провинция" required>
</div>
<div class="parameters-input">
<label for="parameters-transport-city">Город<span style="color: rgba(255, 69, 58, 1);">*</span></label>
<input name="transportCity" type="text" id="parameters-transport-city" placeholder="Город" required>
</div>
</div>
<div class="horizontal-line"></div>
<button id="continue-ts" type="button">Продолжить</button>
</div>
<div id="equipment" class="new-parameters">
<h1>Информация о оборудовании</h1>
<h2>Технические моменты</h2>
<div class="horizontal-line"></div>
<div class="parameters-inputs">
<div class="parameters-input">
<label for="parameters-equipment-name">Имя устройства<span style="color: rgba(255, 69, 58, 1);">*</span></label>
<input name="equipmentName" type="text" id="parameters-equipment-name" placeholder="Имя пользовательского устройства" required>
</div>
<div class="parameters-input">
<label for="parameters-equipment-password">Пароль устройства<span style="color: rgba(255, 69, 58, 1);">*</span></label>
<input name="equipmentPassword" type="text" id="parameters-equipment-password" placeholder="Пароль устройства" required>
</div>
<div class="parameters-input">
<label for="parameters-equipment-number">Номер партии<span style="color: rgba(255, 69, 58, 1);">*</span></label>
<input name="equipmentNumber" type="text" id="parameters-equipment-number" placeholder="Заводской номер партии" required>
</div>
<div class="parameters-input">
<label for="parameters-equipment-released">Дата выпуска<span style="color: rgba(255, 69, 58, 1);">*</span></label>
<input name="equipmentReleased" type="date" id="parameters-equipment-released" required>
</div>
<div class="parameters-input">
<label for="parameters-device-installer">Установщик<span style="color: rgba(255, 69, 58, 1);">*</span></label>
<input name="equipmentInstaller" type="text" id="parameters-device-installer" placeholder="ФИО установщика" required>
</div>
<div class="parameters-input">
<label for="parameters-equipment-installed">Дата монтажа<span style="color: rgba(255, 69, 58, 1);">*</span></label>
<input name="equipmentInstalled" type="date" id="parameters-equipment-installed" required>
</div>
<label for="parameters-device-description">Внешнее описание</label>
<input name="equipmentDescription" type="text" id="parameters-device-description" placeholder="Внешнее описание ">
</div>
<div class="horizontal-line"></div>
<button type="button" id="send-form">Сохранить</button>
</div>
</form>
<div id="parameters" style="position: relative;" class="new-parameters">
<section style="display: flex; width: 100%; height:100%; top: 0; left: 0;" class="dberror" id="parameters-bg" >
<div class="loader-container">
<div class="loader">
<div class="square" id="sq11"></div>
<div class="square" id="sq12"></div>
<div class="square" id="sq13"></div>
<div class="square" id="sq14"></div>
<div class="square" id="sq15"></div>
<div class="square" id="sq16"></div>
<div class="square" id="sq17"></div>
<div class="square" id="sq18"></div>
<div class="square" id="sq19"></div>
</div>
</div>
</section>
<h1>Системные настройки</h1>
<h2>Параметры регистраторов</h2>
<div class="horizontal-line"></div>
<div class="parameters-inputs">
<div class="parameters-input">
<label for="system-date">Формат даты</label>
<select name="DATEMOD" id="system-date">
<option value="0">ММ-ДД-ГГГГ</option>
<option value="1">ГГГГ-ММ-ДД</option>
<option value="2">ДД-ММ-ГГГГ</option>
</select>
</div>
<div class="parameters-input">
<label for="system-time">Формат времени</label>
<select name="TIMEFORMAT" id="system-time">
<option value="0">24 ч</option>
<option value="1">12 ч</option>
</select>
</div>
<div class="parameters-input">
<label for="system-timezone">Часовой пояс</label>
<select name="TIMEZ" id="system-timezone">
<option value="120A">(МСК-1) Калининград</option>
<option value="180C">(МСК) Москва</option>
<option value="240A">(МСК+1) Самара</option>
<option value="300A">(МСК+2) Екатеринбург</option>
<option value="360A">(МСК+3) Омск</option>
<option value="420A">(МСК+4) Красноярск</option>
<option value="480A">(МСК+5) Иркутск</option>
<option value="540A">(МСК+6) Якутск</option>
<option value="600A">(МСК+7) Владивосток</option>
<option value="660A">(МСК+8) Магадан</option>
<option value="720A">(МСК+9) Камчатка</option>
</select>
</div>
<div class="parameters-input">
<label for="system-stream">Формат трансляции</label>
<select name="SUBSTREAMMODE" id="system-stream">
<option value="0">Плавно</option>
<option value="1">Менее качественно, но более плавно</option>
<option value="2">Менее плавно, но более качественно</option>
<option value="3">Качество</option>
</select>
</div>
<div class="parameters-input">
<label for="system-language">Язык системы</label>
<select name="LANGUAGE" id="system-language">
<option value="1">Английский</option>
<option value="12">Русский</option>
</select>
</div>
<div class="parameters-input">
<label for="system-geo">Определение геопозиции</label>
<select name="GEOMOD" id="system-geo">
<option value="0">GPS</option>
<option value="1">BEIDO</option>
<option value="2">GALILEO</option>
<option value="3">GLENAS</option>
<option value="4">Смешанное</option>
</select>
</div>
</div>
<div class="horizontal-line"></div>
<h2 style="margin-bottom: 5px;">Отметьте то, что должно отображаться на трансляции</h2>
<input type="checkbox" id="TE" class="checkbox-input" hidden><label for="TE" class="checkbox-label"><div class="checkmark"></div>Время</label>
<input type="checkbox" id="SE" class="checkbox-input" hidden><label for="SE" class="checkbox-label"><div class="checkmark"></div>Скорость</label>
<input type="checkbox" id="VE" class="checkbox-input" hidden><label for="VE" class="checkbox-label"><div class="checkmark"></div>Номер ТС</label>
<input type="checkbox" id="GE" class="checkbox-input" hidden><label for="GE" class="checkbox-label"><div class="checkmark"></div>Координаты</label>
<input type="checkbox" id="NE" class="checkbox-input" hidden><label for="NE" class="checkbox-label"><div class="checkmark"></div>Названия камер</label>
<div class="horizontal-line"></div>
<button id="continue-parameters" onclick="sendPutRequest();" type="button">Сохранить</button>
</div>
<div id="cameras" style="position: relative;" class="new-parameters">
<section style="display: flex; width: 100%; height:100%; top: 0; left: 0;" class="dberror" id="cameras-bg" >
<div class="loader-container">
<div class="loader">
<div class="square" id="sq1"></div>
<div class="square" id="sq2"></div>
<div class="square" id="sq3"></div>
<div class="square" id="sq4"></div>
<div class="square" id="sq5"></div>
<div class="square" id="sq6"></div>
<div class="square" id="sq7"></div>
<div class="square" id="sq8"></div>
<div class="square" id="sq9"></div>
</div>
</div>
</section>
<h1>Настройки камер</h1>
<h2>Выберите нужную камеру и выставьте параметры</h2>
<div class="horizontal-line"></div>
<label style="width: 100%;" for="cameras-id">Номер камеры</label>
<select style="width: 100%;" name="cameras-id" id="cameras-id">
<option value="1">Камера 1</option>
<option value="2">Камера 2</option>
<option value="3">Камера 3</option>
<option value="4">Камера 4</option>
<option value="5">Камера 5</option>
<option value="6">Камера 6</option>
<option value="7">Камера 7</option>
<option value="8">Камера 8</option>
<option value="9">Камера 9</option>
<option value="10">Камера 10</option>
<option value="11">Камера 11</option>
<option value="12">Камера 12</option>
<option value="13">Камера 13</option>
<option value="14">Камера 14</option>
<option value="15">Камера 15</option>
<option value="16">Камера 16</option>
</select>
<div class="horizontal-line"></div>
<div class="parameters-inputs">
<div class="parameters-input">
<label for="cameras-quality">Качество видео</label>
<select name="QLT" id="cameras-quality">
<option value="1">Максимальное</option>
<option value="2">Скорее максимальное</option>
<option value="3">Скорее минимальное</option>
<option value="4">Минимальное</option>
</select>
</div>
<div class="parameters-input">
<label for="cameras-bitrate">Максимальный битрейт</label>
<input name="BR" type="text" id="cameras-bitrate" placeholder="Максимальный битрейт видео">
</div>
<div class="parameters-input">
<label for="cameras-video">Разрешение видео</label>
<select name="RST" id="cameras-video">
<option value="0">352 x 288</option>
<option value="1">352 x 576</option>
<option value="2">704 x 576</option>
<option value="3">176 x 144</option>
<option value="4">320 × 240</option>
<option value="5">640 × 480</option>
<option value="6">1280 x 720</option>
<option value="7">1920 × 1080</option>
</select>
</div>
<div class="parameters-input">
<label for="cameras-alert">Качество видео при предупреждении</label>
<select name="ALT" id="cameras-alert">
<option value="1">Максимальное</option>
<option value="2">Скорее максимальное</option>
<option value="3">Скорее минимальное</option>
<option value="4">Минимальное</option>
</select>
</div>
<div class="parameters-input">
<label for="cameras-ven">Нужно ли видео</label>
<select name="VEN" id="cameras-ven">
<option value="0">Нет</option>
<option value="1">Да</option>
</select>
</div>
<div class="parameters-input">
<label for="cameras-aen">Нужно ли аудио</label>
<select name="AEN" id="cameras-aen">
<option value="0">Нет</option>
<option value="1">Да</option>
</select>
</div>
<div class="parameters-input">
<label for="cameras-framerate">Фреймрейт</label>
<input name="FR" type="text" id="cameras-framerate" placeholder="Фреймрейт видео">
</div>
</div>
<div class="horizontal-line"></div>
<button id="continue-cameras" onclick="updateCamera();" type="button">Сохранить</button>
</div>
</section>
</section>
</section>
<section style="display: none;" class="dberror" id="deleteConfirmation"> <section style="display: none;" class="dberror" id="deleteConfirmation">
<div class="erorr-container"> <div class="erorr-container">
@ -705,363 +209,7 @@
}); });
</script> </script>
<script>
// Функция для отправки PUT запроса
async function sendPutRequest() {
const dateModSelect = document.getElementById('system-date');
const timeFormatSelect = document.getElementById('system-time');
const streamFormatSelect = document.getElementById('system-stream');
const languageSelect = document.getElementById('system-language');
const geoModSelect = document.getElementById('system-geo');
const timeZoneSelect = document.getElementById('system-timezone');
// Извлекаем значения выбранных опций
const DATEMOD = dateModSelect.value;
const TIMEFORMAT = timeFormatSelect.value;
const SUBSTREAMMODE = streamFormatSelect.value;
const LANGUAGE = languageSelect.value;
const GEOMOD = geoModSelect.value;
const TIMEZ = timeZoneSelect.value;
// Извлекаем значения чекбоксов
const NE = document.getElementById('NE').checked ? 1 : 0;
const TE = document.getElementById('TE').checked ? 1 : 0;
const VE = document.getElementById('VE').checked ? 1 : 0;
const SE = document.getElementById('SE').checked ? 1 : 0;
const GE = document.getElementById('GE').checked ? 1 : 0;
const serial = $("#parameters-serial").val();
// Создаем объект данных для PUT запроса
const requestData = {
DATEMOD,
TIMEFORMAT,
SUBSTREAMMODE,
LANGUAGE,
GEOMOD,
TIMEZ,
NE,
TE,
VE,
SE,
GE,
};
// console.log(requestData);
try {
// Отправляем PUT запрос
const response = await fetch(`/device-parameters?serial=${serial}`, {
method: 'PUT',
headers: {
'Content-Type': 'application/json',
},
body: JSON.stringify(requestData),
});
if (response.ok) {
// PUT запрос выполнен успешно
var formContainer = $("#form-bg");
var form = $("#form");
formContainer.removeClass("active");
form.removeClass("form-animation");
$("body").css("overflow", "auto");
console.log('PUT запрос выполнен успешно');
} else {
console.error('Ошибка при выполнении PUT запроса');
}
} catch (error) {
console.error('Произошла ошибка при отправке PUT запроса:', error);
}
}
</script>
<script>
const form = document.getElementById('edit-form');
const sendButton = document.getElementById('send-form');
sendButton.addEventListener('click', function(event) {
event.preventDefault(); // Предотвращаем отправку формы по умолчанию
const xhr = new XMLHttpRequest();
xhr.open('POST', form.action, true);
xhr.setRequestHeader('Content-Type', 'application/json');
xhr.onload = function() {
if (xhr.status === 200) {
console.log('Данные устройства обновлены!');
location.reload()
} else {
console.error('Ошибка отправки формы:', xhr.status);
}
};
// Получаем данные формы для отправки
const formData = new FormData(form);
// Создаем объект с данными формы
const data = {};
for (const [key, value] of formData) {
data[key] = value;
}
// Преобразуем данные в JSON
const jsonData = JSON.stringify(data);
// Отправляем данные формы
xhr.send(jsonData);
});
</script>
<script>
// Преобразование даты в формат YYYY-MM-DD
function formatDate(date) {
const year = date.getFullYear();
const month = String(date.getMonth() + 1).padStart(2, '0');
const day = String(date.getDate()).padStart(2, '0');
return `${year}-${month}-${day}`;
}
var camerasData;
// Открывает popup форму
function openForm(id) {
document.getElementById('parameters-bg').style.display = 'flex';
document.getElementById('cameras-bg').style.display = 'flex';
document.getElementById('cameras-id').value = 1;
var formContainer = $("#form-bg");
var form = $("#form");
$.ajax({
url: "/devicedata",
method: "POST",
contentType: "application/json",
data: JSON.stringify({ id: id }),
success: function(response) {
// Установка значений полей формы
$("#parameters-number").val(response.number);
$("#parameters-plate").val(response.plate);
$("#parameters-plateColor").val(response.plate_color);
$("#parameters-serial").val(response.serial);
$("#parameters-channels").val(response.channels);
$("#parameters-protocol").val(response.protocol);
$("#parameters-ip").val(response.ip);
$("#parameters-group").val(response.group);
$("#parameters-port").val(response.port);
$("#parameters-sim").val(response.sim);
$("#parameters-sim-imei").val(response.imei);
$("#parameters-sim-imsi").val(response.imsi);
$("#parameters-sim-module").val(response.module);
$("#parameters-trasnsport-type").val(response.auto);
$("#parameters-trasnsport-factory").val(response.factory);
$("#parameters-transport-strength").val(response.capacity);
$("#parameters-transport-engine").val(response.engine);
$("#parameters-transport-stanina").val(response.stanina);
$("#parameters-trasnsport-fuel").val(response.fuel);
$("#parameters-transport-certificate").val(response.certificate);
$("#parameters-transport-category").val(response.category);
$("#parameters-transport-expire").val(formatDate(new Date(response.certificate_exp)));
$("#parameters-transport-consumption").val(response.consumption);
$("#parameters-transport-province").val(response.region);
$("#parameters-transport-city").val(response.city);
$("#parameters-equipment-name").val(response.name);
$("#parameters-equipment-password").val(response.password);
$("#parameters-equipment-number").val(response.batch);
$("#parameters-equipment-released").val(formatDate(new Date(response.release)));
$("#parameters-device-installer").val(response.installer);
$("#parameters-equipment-installed").val(formatDate(new Date(response.installation)));
$("#parameters-device-description").val(response.description);
var nowTime = new Date();
var lastkeepalive = new Date(response.lastkeepalive);
var differenceTime = (nowTime - lastkeepalive) / (1000 * 60);
if (differenceTime > 1) {
$("#between-parameters-and-cameras").hide();
$("#stage-parameters-label").hide();
$("#stage-cameras-label").hide();
} else {
$("#between-parameters-and-cameras").show();
$("#stage-parameters-label").show();
$("#stage-cameras-label").show();
}
activeContent = content1
switchContent(content1);
content2.style.opacity = 0;
content2.style.display = "none";
content3.style.opacity = 0;
content3.style.display = "none";
content4.style.opacity = 0;
content4.style.display = "none";
content5.style.opacity = 0;
content5.style.display = "none";
content6.style.opacity = 0;
content6.style.display = "none";
document.getElementById("stage-details").checked = true;
// Открытие формы
formContainer.addClass("active");
form.addClass("form-animation");
$("body").css("overflow", "hidden");
const requestBody = {
"serial": $("#parameters-serial").val()
};
console.log(requestBody);
// Отправляем POST-запрос
fetch('/device-parameters', {
method: 'POST',
headers: {
'Content-Type': 'application/json'
},
body: JSON.stringify(requestBody)
})
.then(response => response.json())
.then(data => {
document.getElementById('parameters-bg').style.display = 'none';
document.getElementById('cameras-bg').style.display = 'none';
camerasData = data;
document.getElementById('system-date').value = data.DATA.TIMEP.DATEM;
document.getElementById('system-time').value = data.DATA.TIMEP.TIMEM;
document.getElementById('system-language').value = data.DATA.GSP.LANT;
document.getElementById('system-timezone').value = data.DATA.TIMEP.TIMEZ;
document.getElementById('system-geo').value = data.DATA.GSP.GM;
document.getElementById('system-stream').value = data.DATA.SUBSTRNET.SM;
document.getElementById('NE').checked = data.DATA.DOSD.NE === 1;
document.getElementById('TE').checked = data.DATA.DOSD.TE === 1;
document.getElementById('VE').checked = data.DATA.DOSD.VE === 1;
document.getElementById('SE').checked = data.DATA.DOSD.SE === 1;
document.getElementById('GE').checked = data.DATA.DOSD.GE === 1;
document.getElementById('cameras-quality').value = data.DATA.AR.VEC[0].QLT;
document.getElementById('cameras-bitrate').value = data.DATA.AR.VEC[0].BR;
document.getElementById('cameras-video').value = data.DATA.AR.VEC[0].RST;
document.getElementById('cameras-alert').value = data.DATA.AR.VEC[0].ALT;
document.getElementById('cameras-ven').value = data.DATA.AR.VEC[0].VEN;
document.getElementById('cameras-aen').value = data.DATA.AR.VEC[0].AEN;
document.getElementById('cameras-framerate').value = data.DATA.AR.VEC[0].FR;
})
.catch(error => console.error('Ошибка:', error));
},
error: function() {
// Обработка ошибки при запросе к серверу
alert("Произошла ошибка при запросе к серверу.");
}
});
};
$(document).ready(function() {
var formContainer = $("#form-bg");
var form = $("#form");
// Закрывает popup форму
$("#close-form-btn").click(function() {
closeForm();
});
// Закрывает popup форму при клике вне её области
$(document).click(function(event) {
if (
!formContainer.is(event.target) &&
formContainer.has(event.target).length === 0 &&
formContainer.hasClass("active") &&
!openButton.is(event.target)
) {
closeForm();
}
});
// Функция для закрытия формы
function closeForm() {
formContainer.removeClass("active");
form.removeClass("form-animation");
$("body").css("overflow", "auto");
}
});
document.getElementById('cameras-id').addEventListener('change', function() {
var selectedCamera = this.value;
var cameraData = camerasData.DATA.AR.VEC[selectedCamera - 1];
document.getElementById('cameras-quality').value = cameraData.QLT;
document.getElementById('cameras-bitrate').value = cameraData.BR;
document.getElementById('cameras-video').value = cameraData.RST;
document.getElementById('cameras-alert').value = cameraData.ALT;
document.getElementById('cameras-ven').value = cameraData.VEN;
document.getElementById('cameras-aen').value = cameraData.AEN;
document.getElementById('cameras-framerate').value = cameraData.FR;
});
async function updateCamera() {
var selectedCamera = document.getElementById('cameras-id').value;
var cameraData = {
QLT: document.getElementById('cameras-quality').value,
BR: document.getElementById('cameras-bitrate').value,
RST: document.getElementById('cameras-video').value,
ALT: document.getElementById('cameras-alert').value,
VEN: document.getElementById('cameras-ven').value,
AEN: document.getElementById('cameras-aen').value,
FR: document.getElementById('cameras-framerate').value
};
camerasData.DATA.AR.VEC[selectedCamera - 1] = cameraData;
const serial = $("#parameters-serial").val();
try {
// Отправляем PUT запрос
const response = await fetch(`/camera-parameters?serial=${serial}`, {
method: 'PUT',
headers: {
'Content-Type': 'application/json',
},
body: JSON.stringify(camerasData.DATA.AR),
});
if (response.ok) {
// PUT запрос выполнен успешно
var formContainer = $("#form-bg");
var form = $("#form");
formContainer.removeClass("active");
form.removeClass("form-animation");
$("body").css("overflow", "auto");
console.log('PUT запрос выполнен успешно');
} else {
console.error('Ошибка при выполнении PUT запроса');
}
} catch (error) {
console.error('Произошла ошибка при отправке PUT запроса:', error);
}
};
</script>
<script> <script>
function deleteDevice(id) { function deleteDevice(id) {
@ -1135,7 +283,6 @@ $.ajax({
}); });
</script> </script>
<script src="../scripts/device-form.js"></script>
<script> <script>
const checkboxes = document.querySelectorAll('.organisation .checkbox-input'); const checkboxes = document.querySelectorAll('.organisation .checkbox-input');
@ -1180,46 +327,6 @@ checkboxes.forEach((checkbox) => {
}); });
</script> </script>
<script>
var table = document.querySelector('#deviceTable');
var tableCheckboxAll = table.querySelector('#device-all');
var tableCheckboxes = table.querySelectorAll('tbody input[type="checkbox"]');
tableCheckboxAll.addEventListener('click', function(event) {
table = document.querySelector('#deviceTable');
tableCheckboxes = table.querySelectorAll('tbody input[type="checkbox"]');
if (tableCheckboxAll.checked) {
tableCheckboxes.forEach((tableCheckbox) => {
tableCheckbox.checked = true;
});
} else {
tableCheckboxes.forEach((tableCheckbox) => {
tableCheckbox.checked = false;
});
}
});
$('#deviceTable').click( function(event) {
table = document.querySelector('#deviceTable');
tableCheckboxes = table.querySelectorAll('tbody input[type="checkbox"]');
for (var i = 0; i < tableCheckboxes.length; i++) {
tableCheckboxes[i].addEventListener('click', function(event) {
for (var j = 0; j < tableCheckboxes.length; j++) {
if (!tableCheckboxes[j].checked || tableCheckboxes[j].disabled) {
tableCheckboxAll.checked = false;
return;
}
}
tableCheckboxAll.checked = true;
});
}
});
</script>
</body> </body>

File diff suppressed because it is too large Load Diff

View File

@ -322,7 +322,7 @@
} }
async function playNextCamerasInGroup() { async function playNextCamerasInGroup() {
const startCamera = currentCameraGroup === 1 ? 2 : (currentCameraGroup - 1) * camerasPerGroup + 1; const startCamera = currentCameraGroup === 1 ? 2 : (currentCameraGroup - 1) * camerasPerGroup;
const endCamera = startCamera + camerasPerGroup - 1; const endCamera = startCamera + camerasPerGroup - 1;
if (startCamera > totalCameras) { if (startCamera > totalCameras) {

View File

@ -156,6 +156,7 @@
{ {
id: "{{this.id}}", id: "{{this.id}}",
cmdno: "{{this.cmdno}}", cmdno: "{{this.cmdno}}",
number: "{{this.number}}",
time: "{{this.time}}", time: "{{this.time}}",
serial: "{{this.serial}}", serial: "{{this.serial}}",
type: "{{this.type}}", type: "{{this.type}}",
@ -233,46 +234,6 @@ checkboxes.forEach((checkbox) => {
}); });
</script> </script>
<script>
var table = document.querySelector('#deviceTable');
var tableCheckboxAll = table.querySelector('#device-all');
var tableCheckboxes = table.querySelectorAll('tbody input[type="checkbox"]');
tableCheckboxAll.addEventListener('click', function(event) {
table = document.querySelector('#deviceTable');
tableCheckboxes = table.querySelectorAll('tbody input[type="checkbox"]');
if (tableCheckboxAll.checked) {
tableCheckboxes.forEach((tableCheckbox) => {
tableCheckbox.checked = true;
});
} else {
tableCheckboxes.forEach((tableCheckbox) => {
tableCheckbox.checked = false;
});
}
});
$('#deviceTable').click( function(event) {
table = document.querySelector('#deviceTable');
tableCheckboxes = table.querySelectorAll('tbody input[type="checkbox"]');
for (var i = 0; i < tableCheckboxes.length; i++) {
tableCheckboxes[i].addEventListener('click', function(event) {
for (var j = 0; j < tableCheckboxes.length; j++) {
if (!tableCheckboxes[j].checked || tableCheckboxes[j].disabled) {
tableCheckboxAll.checked = false;
return;
}
}
tableCheckboxAll.checked = true;
});
}
});
</script>
</body> </body>

View File

@ -13,8 +13,8 @@
<form enctype="multipart/form-data" method="post" action="/login" id="loginForm"> <form enctype="multipart/form-data" method="post" action="/login" id="loginForm">
<h1 style="margin-bottom: 40px;">Добро пожаловать в Аргус</h1> <h1 style="margin-bottom: 40px;">Добро пожаловать в Аргус</h1>
<label for="login">Логин или Email<span>*</span></label> <label for="login">Email<span>*</span></label>
<input placeholder="Введите логин или Email" name="email" type="text" required> <input placeholder="Введите Email" name="email" type="text" required>
<label for="password">Пароль<span>*</span></label> <label for="password">Пароль<span>*</span></label>
<input placeholder="Введите пароль" name="password" type="password" required> <input placeholder="Введите пароль" name="password" type="password" required>