Skip to content
Permalink
81d4d11e85
Switch branches/tags

Name already in use

A tag already exists with the provided branch name. Many Git commands accept both tag and branch names, so creating this branch may cause unexpected behavior. Are you sure you want to create this branch?
Go to file
 
 
Cannot retrieve contributors at this time
245 lines (239 sloc) 20.8 KB
diff --git a/endpoints/auto/items.json b/endpoints/auto/items.json
index b9d484a..91845e1 100644
--- a/endpoints/auto/items.json
+++ b/endpoints/auto/items.json
@@ -23,7 +23,7 @@
"route": "/items",
"method": "POST",
"sql": "INSERT INTO items(itemName, quantity, categoryId) VALUES ($itemName, $quantity, $categoryId)",
- "auth_required": true,
+ "auth_required": false,
"allowed_roles": [
"*"
],
@@ -38,7 +38,7 @@
"route": "/items/$itemId",
"method": "PUT",
"sql": "UPDATE items SET itemName = $itemName, quantity = $quantity, categoryId = $categoryId WHERE itemId = $itemId",
- "auth_required": true,
+ "auth_required": false,
"allowed_roles": [
"*"
],
@@ -53,7 +53,7 @@
"route": "/items/$itemId",
"method": "DELETE",
"sql": "DELETE FROM items WHERE itemId = $itemId",
- "auth_required": true,
+ "auth_required": false,
"allowed_roles": [
"*"
],
diff --git a/sql/create_tables.sql b/sql/create_tables.sql
index a9e7518..6a96b83 100644
--- a/sql/create_tables.sql
+++ b/sql/create_tables.sql
@@ -22,10 +22,10 @@ FROM categories c
NATURAL join items i;
INSERT INTO `categories` (`categoryId`, `catName`, `pictureURL`) VALUES
- (1, 'Comida', 'images/food.jpg'),
- (2, 'Bebida', 'images/drinks.jpg'),
- (3, 'Farmacia', 'images/pharmacy.jpg'),
- (4, 'Otros', 'images/other.jpg');
+ (1, 'Comida', 'images/food.png'),
+ (2, 'Bebida', 'images/drinks.png'),
+ (3, 'Farmacia', 'images/pharmacy.png'),
+ (4, 'Otros', 'images/other.png');
INSERT INTO `items` (`itemId`, `itemName`, `quantity`, `categoryId`) VALUES
(1, 'Cebollas', 2, 1),
diff --git a/web/css/style.css b/web/css/style.css
index ae1e964..a9fb469 100644
--- a/web/css/style.css
+++ b/web/css/style.css
@@ -9,4 +9,10 @@
div.card {
margin-bottom: 3%;
+}
+
+.deleted {
+ transform: scale(0%, 0%);
+ opacity: 0;
+ transition: all 0.5s;
}
\ No newline at end of file
diff --git a/web/index.html b/web/index.html
index 4ad2fee..7063f8f 100644
--- a/web/index.html
+++ b/web/index.html
@@ -8,9 +8,11 @@
<link rel="stylesheet" href="/css/bootstrap.min.css">
<link rel="stylesheet" href="/css/style.css">
- <link rel="stylesheet" href="css/font-awesome.min.css">
+ <link rel="stylesheet" href="/css/font-awesome.min.css">
<script src="/js/libs/bootstrap.min.js"></script>
+ <script src="js/libs/axios.min.js"></script>
+ <script src="/js/index.js" type="module"></script>
<title>Shopping list</title>
</head>
@@ -20,12 +22,15 @@
<h1 class="text-center">My Shopping List</h1>
</div>
<div class="container">
+
<h3 class="m-2">Add a new element:</h3>
+
+ <div id="errors"></div>
<form action="POST" id="create-item">
<div class="row">
<div class="col-md-5">
<div class="form-floating mb-3">
- <input type="text" name="name" id="name-input" class="form-control" placeholder="Item name">
+ <input type="text" name="itemName" id="name-input" class="form-control" placeholder="Item name">
<label for="name-input">Item name</label>
</div>
</div>
@@ -36,139 +41,19 @@
</div>
</div>
<div class="col-md-3">
- <div class="form-floating mb-3">
- <select name="categoryId" id="categoryId-input" class="form-select" placeholder="Category">
- <option value="1">Comida</option>
- <option value="2">Bebida</option>
- <option value="3">Farmacia</option>
- <option value="4">Otros</option>
- </select>
+ <div class="form-floating mb-3" id="categoriesDiv">
+ <!-- select with categories goes here -->
<label for="categoryId-input">Category</label>
</div>
</div>
<div class="col-md-1">
- <button class="btn btn-primary w-100 h-100">Send</button>
+ <button class="btn btn-primary w-100 h-100" id="sendButton" type="submit">Send</button>
</div>
</div>
</form>
<hr>
- <div class="row">
- <div class="col-md-4">
- <div class="card p-2">
- <div class="row text-center">
- <div class="col-4 d-flex align-items-center">
- <img src="images/food.png" alt="Comida" class="img-fluid">
- </div>
- <div class="col-8">
- <h4>Cebollas</h4>
- <h6 class="text-muted">Food</h6>
-
- <hr>
-
- <input type="number" name="quantity" id="quantity-item-1" class="form-control mb-3" value="2" min="1">
-
- <div class="row">
- <div class="col">
- <button class="btn btn-primary w-100">
- <i class="fa fa-check" aria-hidden="true"></i>
- </button>
- </div>
- <div class="col">
- <button class="btn btn-danger w-100">
- <i class="fa fa-trash" aria-hidden="true"></i>
- </button>
- </div>
- </div>
-
- </div>
- </div>
- </div>
- </div>
- <div class="col-md-4">
- <div class="card p-2">
- <div class="row text-center">
- <div class="col-4 d-flex align-items-center">
- <img src="images/drinks.png" alt="Bebida" class="img-fluid">
- </div>
- <div class="col-8">
- <h4>Cervezas</h4>
- <h6 class="text-muted">Drinks</h6>
-
- <hr>
-
- <input type="number" name="quantity" id="quantity-item-1" class="form-control mb-3" value="6" min="1">
-
- <div class="row">
- <div class="col">
- <button class="btn btn-primary w-100">
- <i class="fa fa-check" aria-hidden="true"></i>
- </button>
- </div>
- <div class="col">
- <button class="btn btn-danger w-100">
- <i class="fa fa-trash" aria-hidden="true"></i>
- </button>
- </div>
- </div>
-
- </div>
- </div>
- </div>
- </div>
- <div class="col-md-4">
- <div class="card p-2">
- <div class="row text-center">
- <div class="col-4 d-flex align-items-center">
- <img src="images/pharmacy.png" alt="Farmacia" class="img-fluid">
- </div>
- <div class="col-8">
- <h4>Mascarillas</h4>
- <h6 class="text-muted">Cleaning</h6>
- <hr>
- <input type="number" name="quantity" id="quantity-item-1" class="form-control mb-3" value="1" min="1">
- <div class="row">
- <div class="col">
- <button class="btn btn-primary w-100">
- <i class="fa fa-check" aria-hidden="true"></i>
- </button>
- </div>
- <div class="col">
- <button class="btn btn-danger w-100">
- <i class="fa fa-trash" aria-hidden="true"></i>
- </button>
- </div>
- </div>
- </div>
- </div>
- </div>
- </div>
- <div class="col-md-4">
- <div class="card p-2">
- <div class="row text-center">
- <div class="col-4 d-flex align-items-center">
- <img src="images/other.png" alt="Otros" class="img-fluid">
- </div>
- <div class="col-8">
- <h4>Pilas</h4>
- <h6 class="text-muted">Other</h6>
- <hr>
- <input type="number" name="quantity" id="quantity-item-1" class="form-control mb-3" value="1" min="1">
- <div class="row">
- <div class="col">
- <button class="btn btn-primary w-100">
- <i class="fa fa-check" aria-hidden="true"></i>
- </button>
- </div>
- <div class="col">
- <button class="btn btn-danger w-100">
- <i class="fa fa-trash" aria-hidden="true"></i>
- </button>
- </div>
- </div>
- </div>
- </div>
- </div>
- </div>
+ <div id="shoppingListDiv">
+ <!-- ShoppingList goes here -->
</div>
</div>
</body>