smig/odin-codespace
1
0
Fork 0
mirror of https://gitea.smigz.com/smiggiddy/odin-codeprojects.git synced 2025-06-28 12:55:36 -04:00
Code Issues Projects Releases Packages Wiki Activity Actions

feat: basic crud complete

Browse source
This commit is contained in:
Smigz 2025-01-20 19:24:37 -05:00
parent 6fb88b315a
commit 77a93ae9b1
10 changed files with 105 additions and 27 deletions
Download patch file Download diff file Expand all files Collapse all files

19
inventory/public/js/components/addForm.js
View file

@ -1,14 +1,17 @@
function addForm() {
let buttonClicked = true;
const addForm = document.querySelector(".add-form");
const button = document.querySelector(".add-btn");
const addFormClass = document.querySelector(".add-form");
button.addEventListener("click", () => {
buttonClicked
? (addForm.style.display = " block")
: (addForm.style.display = "none");
buttonClicked = !buttonClicked;
});
if (addFormClass != null) {
const button = document.querySelector(".add-btn");
button.addEventListener("click", () => {
buttonClicked
? (addFormClass.style.display = " block")
: (addFormClass.style.display = "none");
buttonClicked = !buttonClicked;
});
}
}
export { addForm };

29
inventory/public/js/components/modal.js
View file

@ -5,6 +5,9 @@ function formInput(props) {
formItemDiv.classList.add("form-item");
const input = document.createElement("input");
input.name = props.name;
input.required = true;
input.type = props.type;
if (props.type === "number") input.step = "0.01";
const label = document.createElement("label");
label.textContent = props.labelText;
formItemDiv.append(label, input);
@ -17,23 +20,30 @@ async function modal() {
div.classList.add("modal");
div.style = `
display: none;
positino: fixed;
position: fixed;
z-index: 1;
left: 0;
top: 0;
width: 100%;
height: 50vh;
height: 100vh;
overflow: auto;
background-color: rgb(0,0,0);
background-color: rgba(0,0,0,0.4);
justify-content: center;
align-items: center;
backdrop-filter: blur(15px);
`;
const form = document.createElement("form");
form.method = "POST";
form.action = "/item";
const name = formInput({ labelText: "Name", name: "name" });
const price = formInput({ labelText: "Price", name: "price" });
const qty = formInput({ labelText: "QTY", name: "qty" });
const name = formInput({ labelText: "name", name: "name", type: "text" });
const price = formInput({
labelText: "price",
name: "price",
type: "number",
});
const qty = formInput({ labelText: "qty", name: "qty", type: "number" });
const categories = await categoryPicker();
const stores = await storePicker();
@ -44,12 +54,19 @@ async function modal() {
submitButton.textContent = "Add Item";
const closeButton = document.createElement("button");
closeButton.classList.add("btn");
closeButton.textContent = "Close";
closeButton.type = "button";
closeButton.addEventListener("click", () => {
div.style.display = "none";
});
form.append(name, price, qty, categories, stores, submitButton, closeButton);
const btns = document.createElement("div");
btns.classList.add("form-item");
btns.style.flexDirection = "row";
btns.append(submitButton, closeButton);
form.append(name, price, qty, categories, stores, btns);
div.append(form);
return div;

2
inventory/public/js/components/selectComponent.js
View file

@ -22,7 +22,7 @@ async function categoryPicker() {
formItemDiv.classList.add("form-item");
const formLabel = document.createElement("label");
formLabel.textContent = "Categories";
formLabel.textContent = "categories";
const select = document.createElement("select");
select.classList.add("categories-list-modal");