Added a table to display inventory on the home page; fixed the item add route

This commit is contained in:
Gregory Ballantine 2022-11-02 14:29:46 -04:00
parent 12770a995d
commit 1b46e7c3fb
4 changed files with 32 additions and 9 deletions

View File

@ -5,10 +5,10 @@ const app = express();
const port = 3000; const port = 3000;
// initialize database connection // initialize database connection
const db = require('./src/models'); (async () => {
db.sequelize.sync({ force: true }).then(() => { const db = require('./src/models');
console.log("Drop and re-sync db."); await db.sequelize.sync();
}); })();
// set up body POST parameters // set up body POST parameters
app.use(express.json()); app.use(express.json());

View File

@ -4,6 +4,8 @@ const Item = db.items;
// GET - / // GET - /
exports.getIndex = async function (req, res) { exports.getIndex = async function (req, res) {
let items = await Item.findAll({}); let items = await Item.findAll({});
console.log(items);
res.render('index.twig'); res.render('index.twig', {
inventory: items,
});
}; };

View File

@ -27,4 +27,25 @@
</div> </div>
</section> </section>
<section class="row">
<table class="columns twelve">
<thead>
<tr>
<th>Name</th>
<th>Manufacturer</th>
<th>Type</th>
</tr>
</thead>
<tbody>
{% for item in inventory %}
<tr>
<td>{{ item.name }}</td>
<td>{{ item.manufacturer }}</td>
<td>{{ item.type }}</td>
</tr>
{% endfor %}
</tbody>
</table>
</section>
{% endblock %} {% endblock %}

View File

@ -17,19 +17,19 @@
<div class="row"> <div class="row">
<div class="columns twelve"> <div class="columns twelve">
<label for="item_name">Item name:</label> <label for="item_name">Item name:</label>
<input class="u-full-width" type="text" placeholder="My new item" id="item_name"> <input class="u-full-width" type="text" placeholder="My new item" id="item_name" name="item_name">
</div> </div>
</div> </div>
<div class="row"> <div class="row">
<div class="six columns"> <div class="six columns">
<label for="item_manufacturer">Manufacturer:</label> <label for="item_manufacturer">Manufacturer:</label>
<input class="u-full-width" type="text" placeholder="Manufacturer" id="item_manufacturer"> <input class="u-full-width" type="text" placeholder="Manufacturer" id="item_manufacturer" name="item_manufacturer">
</div> </div>
<div class="six columns"> <div class="six columns">
<label for="item_type">Item type</label> <label for="item_type">Item type</label>
<select class="u-full-width" id="item_type"> <select class="u-full-width" id="item_type" name="item_type">
<option value="cpu">Processor</option> <option value="cpu">Processor</option>
<option value="motherboard">Motherboard</option> <option value="motherboard">Motherboard</option>
<option value="memory">Memory (RAM)</option> <option value="memory">Memory (RAM)</option>