Fixed Input unfocus, add information about save status

This commit is contained in:
Igor Barcik 2024-01-02 19:09:25 +01:00
parent eb414dc57c
commit ae82426d2c
5 changed files with 14 additions and 7 deletions

View File

@ -1,2 +1,2 @@
VITE_APP_NAME=Frez Manager [Developer Build] VITE_APP_NAME=Frez Manager [Developer Build]
VITE_API_URL=http://localhost:7082 VITE_API_URL=http://localhost

BIN
bun.lockb

Binary file not shown.

View File

@ -85,12 +85,12 @@ export interface CustomRouteObject extends Omit<RouteObject, "children"> {
//Main configuration, static data, mostly used here //Main configuration, static data, mostly used here
export const main = { export const main = {
program_name: viteEnv.VITE_APP_NAME, program_name: viteEnv.VITE_APP_NAME,
program_version: "2.0.0", program_version: "2.1.0",
}; };
//About page configuration //About page configuration
export const about = { export const about = {
program_description: `${main.program_name} to nowoczesna platforma dedykowana specjalistom z branży obróbki skrawaniem. Nasza strona umożliwia profesjonalny dobór narzędzi do frezowania, gwarantując precyzję i efektywność w każdym projekcie. Dzięki intuicyjnemu interfejsowi i zaawansowanym algorytmom, ${main.program_name} staje się niezastąpionym narzędziem dla każdego, kto chce osiągnąć perfekcyjne rezultaty w obróbce materiałów.`, program_description: `${main.program_name} to nowoczesna platforma dedykowana specjalistom z branży obróbki skrawaniem. Nasza strona umożliwia profesjonalny dobór narzędzi do frezowania, gwarantując precyzję i efektywność w każdym projekcie. Dzięki intuicyjnemu interfejsowi i zaawansowanym algorytmom, ${main.program_name} staje się niezastąpionym narzędziem dla każdego, kto chce osiągnąć perfekcyjne rezultaty w obróbce materiałów.`,
program_authors: [{ name: "Bartosz Bielski", email: "bartbie194@student.polsl.pl" }], program_authors: [{ name: "Igor Barcik", email: "chx94126@student.chorzow.wsb.pl" }],
}; };
//---- //----
export const flatRoutes = flatternRoutingTable(navigation); export const flatRoutes = flatternRoutingTable(navigation);

View File

@ -61,6 +61,7 @@ const HomePage = () => {
const [searching, setSearching] = useState(false); // Status wyszukiwania const [searching, setSearching] = useState(false); // Status wyszukiwania
const [notFound, setNotFound] = useState(false); // Status znalezienia const [notFound, setNotFound] = useState(false); // Status znalezienia
const [edited, setEdited] = useState(false); // Status edycji const [edited, setEdited] = useState(false); // Status edycji
const [saving, setSaving] = useState(false); // Status zapisywania
// ----------------------------- FUNCTION -------------------------- // ----------------------------- FUNCTION --------------------------
const handleChangeOfField = (key: keyof typeof input) => (e: React.ChangeEvent<HTMLSelectElement>) => { const handleChangeOfField = (key: keyof typeof input) => (e: React.ChangeEvent<HTMLSelectElement>) => {
const value = Number(e.target.value); const value = Number(e.target.value);
@ -182,7 +183,7 @@ const HomePage = () => {
<> <>
{result.map((tool, index) => { {result.map((tool, index) => {
return ( return (
<div key={uuid4()}> <div key={index}>
<h2 className="text-2xl mb-1">{tool.name}</h2> <h2 className="text-2xl mb-1">{tool.name}</h2>
<table className="table"> <table className="table">
<thead> <thead>
@ -192,9 +193,9 @@ const HomePage = () => {
</tr> </tr>
</thead> </thead>
<tbody> <tbody>
{Object.entries(tool).map(([key, value]) => { {Object.entries(tool).map(([key, value], indexNumber) => {
return ( return (
<tr key={uuid4()}> <tr key={indexNumber}>
<td className="border px-4 py-2">{key}</td> <td className="border px-4 py-2">{key}</td>
<td className="border px-4 py-2"> <td className="border px-4 py-2">
<input <input
@ -230,10 +231,16 @@ const HomePage = () => {
const newToolsDB: Database = { ...toolsDB, tools: [...toolsDB.tools, ...newTool] }; const newToolsDB: Database = { ...toolsDB, tools: [...toolsDB.tools, ...newTool] };
// Set new tools to localStorage // Set new tools to localStorage
setToolsDB(newToolsDB); setToolsDB(newToolsDB);
setEdited(false);
setSaving(true);
setTimeout(() => {
setSaving(false);
}, 3000); // 100ms delay
}} }}
disabled={!edited} disabled={!edited}
> >
Zapisz zmiany jako nowy przypadek Zapisz zmiany jako nowy przypadek {saving && "(Zapisano ✅)"}
</button> </button>
<div className="h-px bg-neutral-content mb-2"></div> <div className="h-px bg-neutral-content mb-2"></div>
</div> </div>