joseph
/
Log_service
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

update routes.ts

This commit is contained in:
joseph le 2023-09-13 14:09:30 +07:00
parent 421d35d1d1
commit 1db6f7688c
7 changed files with 111 additions and 124 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

21
manage-view/src/App.js
View File

@ -2,24 +2,19 @@ import axios from "axios";
import React, { useEffect, useState } from "react"; import React, { useEffect, useState } from "react";
import { getKeyValues } from "./api/apiLog"; import { getKeyValues } from "./api/apiLog";
import ManageValues from "./pages/ManageValues"; import ManageValues from "./pages/ManageValues";
import { import { Routes, Route, Switch, useParams } from "react-router-dom";
Routes,
Route,
Switch,
useParams,
} from "react-router-dom";
import ShowLog from "./components/ShowLog/ShowLog"; import ShowLog from "./components/ShowLog/ShowLog";
import ListLog from "./components/ListLog/ListLog";
function App() { function App() {
return ( return (
<div className="App"> <div className="App">
<Routes> <Routes>
{/* Define routes */} {/* Define routes */}
<Route path="/" element={<ManageValues />}> <Route path="/" element={<ManageValues />}>
{/* Render the UserProfile component */} {/* Render the UserProfile component */}
</Route> </Route>
<Route path="/logs/:name" element={<ShowLog/>}> <Route path="/logs/:name" element={<ShowLog />}></Route>
<Route path="/logs" element={<ListLog />}></Route>
</Route>
</Routes> </Routes>
</div> </div>
); );

4
manage-view/src/api/apiLog.js
View File

@ -1,5 +1,5 @@
const API = "https://logs.danielvu.com/api"; // const API = "https://logs.danielvu.com/api";
// const API = "http://localhost:3333/api"; const API = "http://localhost:3333/api";
export const getKeyValues = API + "/getKeyValue"; export const getKeyValues = API + "/getKeyValue";
export const deleteValue = API + "/deleteValue"; export const deleteValue = API + "/deleteValue";
export const addKeyValue = API + "/addValue"; export const addKeyValue = API + "/addValue";

9
manage-view/src/components/ListLog/ListLog.jsx Normal file
View File

@ -0,0 +1,9 @@
import React from 'react'
const ListLog = () => {
return (
<div>ListLog</div>
)
}
export default ListLog

29
manage-view/src/components/ShowLog/ShowLog.css
View File

@ -7,7 +7,9 @@
.detectedDiv{ .detectedDiv{
height: 40%; height: 40%;
padding: 5px;
word-wrap:break-word; word-wrap:break-word;
border: solid gray 5px;
white-space:pre; white-space:pre;
overflow: auto; overflow: auto;
font-family: monospace; font-family: monospace;
@ -23,22 +25,23 @@
text-align: start; text-align: start;
appearance: auto; appearance: auto;
-webkit-rtl-ordering: logical; -webkit-rtl-ordering: logical;
resize: auto; resize: vertical;
cursor: text; cursor: text;
background-color: field; background-color: field;
column-count: initial !important; column-count: initial !important;
writing-mode: horizontal-tb !important; writing-mode: horizontal-tb !important;
box-sizing: border-box; /* box-sizing: border-box; */
margin: 0em; margin: 0em;
border-width: 1px; /* border-width: 1px; */
border-style: solid; /* border-style: solid;/ */
border-color: -internal-light-dark(rgb(118, 118, 118), rgb(133, 133, 133)); /* border-color: -internal-light-dark(rgb(118, 118, 118), rgb(133, 133, 133)); */
border-image: initial; /* border-image: initial; */
padding: 2px; padding: 5px;
} }
.logContent{ .logContent{
scroll-behavior: smooth; scroll-behavior: smooth;
border: solid gray 5px;
width:100%; width:100%;
height:60%; height:60%;
word-wrap:break-word; word-wrap:break-word;
@ -57,18 +60,18 @@
text-align: start; text-align: start;
appearance: auto; appearance: auto;
-webkit-rtl-ordering: logical; -webkit-rtl-ordering: logical;
resize: auto; resize: vertical;
cursor: text; cursor: text;
background-color: field; background-color: field;
column-count: initial !important; column-count: initial !important;
writing-mode: horizontal-tb !important; writing-mode: horizontal-tb !important;
box-sizing: border-box; box-sizing: border-box;
margin: 0em; margin: 0em;
border-width: 1px; /* border-width: 1px; */
border-style: solid; /* border-style: solid; */
border-color: -internal-light-dark(rgb(118, 118, 118), rgb(133, 133, 133)); /* border-color: -internal-light-dark(rgb(118, 118, 118), rgb(133, 133, 133)); */
border-image: initial; /* border-image: initial; */
padding: 2px; padding: 5px;
} }
.itemDetected{ .itemDetected{

131
manage-view/src/components/ShowLog/ShowLog.jsx
View File

@ -6,12 +6,12 @@ import "./ShowLog.css";
const ShowLog = () => { const ShowLog = () => {
let { name } = useParams(); let { name } = useParams();
const [log, setLog] = useState({}); const [log, setLog] = useState({});
const [content, setContent] = useState(""); const [status, setStatus] = useState();
const getContentLog = async () => { const getContentLog = async () => {
try { try {
let tempContent = "";
const res = await axios.get(getLog + "/" + name); const res = await axios.get(getLog + "/" + name);
setLog(res.data); setLog(res.data);
setStatus(res.status)
} catch (error) { } catch (error) {
console.log(error); console.log(error);
} }
@ -33,69 +33,78 @@ const ShowLog = () => {
}, 1000); }, 1000);
}, []); }, []);
// console.log(window.location.hash); // console.log(window.location.hash);
return ( if(status === 200){
<div className="main"> return (
<div className="detectedDiv"> <div className="main">
<h3 <div className="detectedDiv">
style={{ <h3
position: "sticky", style={{
top: 0, position: "sticky",
backgroundColor: "white", top: 0,
textAlign: "center", backgroundColor: "white",
}} textAlign: "center",
> }}
{name} >
</h3> {name}
<h3>Extra items:</h3> </h3>
{log?.modelSpecial?.split("\n")?.map((line) => ( <h3 style={{display:log?.modelSpecial!==""?"block":"none"}}>Extra items:</h3>
<span> {log?.modelSpecial?.split("\n")?.map((line) => (
<span className="lineNumberLog">{line.split("|-|")[0]}</span> <span>
<span>{line.split("|-|")[1]}</span> <span className="lineNumberLog">{line.split("|-|")[0]}</span>
<span className="itemDetected"> <span>{line.split("|-|")[1]}</span>
<a <span className="itemDetected">
href={"#" + line.split("|-|")[0]} <a
style={{ textDecoration: "none", color: "black" }} href={"#" + line.split("|-|")[0]}
> style={{ textDecoration: "none", color: "black" }}
{line.split("|-|")[2]} >
</a> {line.split("|-|")[2]}
</a>
</span>
<span>{line.split("|-|")[3]}</span>
<br></br>
</span> </span>
<span>{line.split("|-|")[3]}</span> ))}
<br></br> <h3 style={{display:log?.issueItem!==""?"block":"none"}}>Issue found:</h3>
</span> {log?.issueItem?.split("\n")?.map((line) => (
))} <span>
<h3>Issue found:</h3> <span className="lineNumberLog">{line.split("|-|")[0]}</span>
{log?.issueItem?.split("\n")?.map((line) => ( <span>{line.split("|-|")[1]}</span>
<span> <span className="itemDetected">
<span className="lineNumberLog">{line.split("|-|")[0]}</span> <a
<span>{line.split("|-|")[1]}</span> href={"#" + line.split("|-|")[0]}
<span className="itemDetected"> style={{ textDecoration: "none", color: "black" }}
<a >
href={"#" + line.split("|-|")[0]} {line.split("|-|")[2]}
style={{ textDecoration: "none", color: "black" }} </a>
> </span>
{line.split("|-|")[2]}{" "} <span>{line.split("|-|")[3]}</span>
</a> <br></br>
</span> </span>
<span>{line.split("|-|")[3]}</span> ))}
<br></br> </div>
</span> <div className="logContent">
))} {log?.contentFile?.split("\n")?.map((line) => (
<span>
<span className="lineNumberLog">{line.split("|-|")[0]}</span>
<span>{line.split("|-|")[1]}</span>
<span className="itemDetected">
<span id={line.split("|-|")[0]}>{line.split("|-|")[2]}</span>
</span>
<span>{line.split("|-|")[3]}</span>
<br></br>
</span>
))}
</div>
</div> </div>
<div className="logContent"> );
{log?.contentFile?.split("\n")?.map((line) => ( }else{
<span> return(
<span className="lineNumberLog">{line.split("|-|")[0]}</span> <div>
<span>{line.split("|-|")[1]}</span> <h1><i>The file was not found or no errors were found in the file.</i></h1>
<span className="itemDetected">
<span id={line.split("|-|")[0]}>{line.split("|-|")[2]}</span>
</span>
<span>{line.split("|-|")[3]}</span>
<br></br>
</span>
))}
</div> </div>
</div> )
); }
}; };
export default ShowLog; export default ShowLog;

3
manage-view/src/pages/ManageValues.jsx
View File

@ -100,6 +100,9 @@ const ManageValues = () => {
} }
}}>Add</button> }}>Add</button>
</div> </div>
<div>
<Link to={"/logs"}> <button style={{color:"white", backgroundColor:"blue", cursor:"pointer"}}>List of error logs</button></Link>
</div>
</div> </div>
); );
}; };

38
start/routes.ts
View File

@ -124,40 +124,6 @@ Route.get("/api/log/showLog/:name?", async ({ request, response }) => {
modelSpecialDetected.length > 0 ? modelSpecialDetected.join("\n") : ""; modelSpecialDetected.length > 0 ? modelSpecialDetected.join("\n") : "";
let issueItem = let issueItem =
issueSpecialDetected.length > 0 ? issueSpecialDetected.join("\n") : ""; issueSpecialDetected.length > 0 ? issueSpecialDetected.join("\n") : "";
// response.send(
// "<html>\
// <body>\
// <div style='width:100%;height:100%;word-wrap:break-word;white-space:pre;overflow: auto;font-family: monospace;text-rendering: auto;\
// color: fieldtext;\
// letter-spacing: normal;\
// word-spacing: normal;\
// line-height: normal;\
// text-transform: none;\
// text-indent: 0px;\
// text-shadow: none;\
// display: inline-block;\
// text-align: start;\
// appearance: auto;\
// -webkit-rtl-ordering: logical;\
// resize: auto;\
// cursor: text;\
// background-color: field;\
// column-count: initial !important;\
// writing-mode: horizontal-tb !important;\
// box-sizing: border-box;\
// margin: 0em;\
// border-width: 1px;\
// border-style: solid;\
// border-color: -internal-light-dark(rgb(118, 118, 118), rgb(133, 133, 133));\
// border-image: initial;\
// padding: 2px;'><b>"+request.params().name+"</b>" + modelSpecial + issueItem
// +
// data.join("\n") +
// "</div>\
// </body>\
// </html>"
// );
response response
.status(200) .status(200)
.send({ .send({
@ -167,7 +133,9 @@ Route.get("/api/log/showLog/:name?", async ({ request, response }) => {
}); });
} catch (error) { } catch (error) {
console.error(error); console.error(error);
response.send("<h1>-------------- File not found --------------</h1>"); response
.status(203)
.send("FILE NOT FOUND");
} }
}); });