Added license view and edit functions

assets/styles/gargoyle.scss

@@ -86,7 +86,8 @@ input[type="submit"].button-primary{
   }
 }
 
-#item-header{
+#item-header,
+#license-header{
   margin-bottom: 25px;
 
   h1,
@@ -96,7 +97,9 @@ input[type="submit"].button-primary{
   }
 
   .item-added-date,
-  .item-updated-date{
+  .item-updated-date,
+  .license-added-date,
+  .license-updated-date{
     margin-bottom: 5px;
     color: #666;
     font-size: 1.6rem;

index.js

@@ -58,6 +58,9 @@ app.get('/item/:id/edit', itemRoutes.getItemEdit);
 app.post('/item/:id/edit', itemRoutes.postItemEdit);
 app.get('/license/add', licenseRoutes.getAdd);
 app.post('/license/add', licenseRoutes.postAdd);
+app.get('/license/:id', licenseRoutes.getLicense);
+app.get('/license/:id/edit', licenseRoutes.getEdit);
+app.post('/license/:id/edit', licenseRoutes.postEdit);
 
 // start app
 app.listen(config.get('server.port'), config.get('server.address'), () => {

src/routes/license.js

@@ -20,3 +20,55 @@ exports.postAdd = async function(req, res) {
 
   res.redirect('/');
 };
+
+// GET - /license/{id}
+exports.getLicense = async function(req, res) {
+  const license = await License.findAll({
+    where: {
+      id: req.params.id,
+    },
+  });
+
+  res.render('license/view.twig', {
+    license: license[0],
+  });
+};
+
+// GET - /license/{id}/edit
+exports.getEdit = async function(req, res) {
+  const license = await License.findAll({
+    where: {
+      id: req.params.id,
+    },
+  });
+
+  res.render('license/edit.twig', {
+    license: license[0],
+  });
+};
+
+// POST - /license/{id}/edit
+exports.postEdit = async function(req, res) {
+  // fetch license from DB
+  const licenseSearch = await License.findAll({
+    where: {
+      id: req.params.id,
+    },
+  });
+
+  // retrieve the license record from the array for ease of use
+  const license = licenseSearch[0];
+
+  // update license attributes
+  license.name = req.body.license_name;
+  license.key = req.body.license_key;
+  license.manufacturer = req.body.license_manufacturer;
+  license.purchasedFrom = req.body.license_purchase_from;
+  license.purchasedAt = req.body.license_purchase_date;
+
+  // save attribute changes
+  await license.save();
+
+  // redirect user to license page
+  res.redirect('/license/' + license.id);
+};

views/license/edit.twig

@@ -0,0 +1,53 @@
+{% extends 'layout.twig' %}
+
+{% block title %}Edit License{% endblock %}
+
+{% block content %}
+
+<!-- page header -->
+<header class="row">
+  <div class="columns twelve">
+    <h1>Editing "{{ license.name }}"</h1>
+  </div>
+</header>
+
+<section class="row">
+  <div class="columns twelve">
+    <form action="/license/{{ license.id }}/edit" method="POST">
+      <div class="row">
+        <div class="columns twelve">
+          <label for="license_name">License name:</label>
+          <input class="u-full-width" type="text" placeholder="My new license" id="license_name" name="license_name" value="{{ license.name }}" required>
+        </div>
+      </div>
+
+      <div class="row">
+        <div class="six columns">
+          <label for="license_key">License key:</label>
+          <input class="u-full-width" type="text" placeholder="ABCD-EFGH-1234-5678" id="license_key" name="license_key" value="{{ license.key }}" required>
+        </div>
+
+        <div class="six columns">
+          <label for="license_manufacturer">Manufacturer:</label>
+          <input class="u-full-width" type="text" placeholder="Manufacturer" id="license_manufacturer" name="license_manufacturer" value="{{ license.manufacturer }}">
+        </div>
+      </div>
+
+      <div class="row">
+        <div class="six columns">
+          <label for="license_purchase_from">Purchased from:</label>
+          <input class="u-full-width" type="text" placeholder="Newegg" id="license_purchase_from" name="license_purchase_from" value="{{ license.purchasedFrom }}">
+        </div>
+
+        <div class="six columns">
+          <label for="license_purchase_date">Purchased at:</label>
+          <input class="u-full-width" type="datetime-local" id="license_purchase_date" name="license_purchase_date" value="{{ license.purchasedAt }}">
+        </div>
+      </div>
+
+      <input class="button-primary u-full-width" type="submit" value="Submit">
+    </form>
+  </div>
+</section>
+
+{% endblock %}

views/license/view.twig

@@ -0,0 +1,43 @@
+{% extends 'layout.twig' %}
+
+{% block title %}{{ license.name }}{% endblock %}
+
+{% block content %}
+
+<!-- page header -->
+<header id="license-header" class="row">
+  <div class="columns twelve">
+    <span>
+      <h1>{{ license.name }}</h1>
+      <p><a href="/license/{{ license.id }}/edit"><i class="fa-solid fa-pen-to-square"></i> Edit</a></p>
+    </span>
+    <h4 class="license-added-date">license added at: {{ license.createdAt }}</h4>
+    <h4 class="license-updated-date">Last updated at: {{ license.updatedAt }}</h4>
+  </div>
+</header>
+
+<!-- license information -->
+<section class="row">
+  <table class="columns twelve">
+    <thead>
+      <tr>
+        <th>Product name</th>
+        <th>License Key</th>
+        <th>Manufacturer</th>
+        <th>Seller</th>
+        <th>Purchase date</th>
+      </tr>
+    </thead>
+    <tbody>
+      <tr>
+        <td>{{ license.name }}</td>
+        <td>{{ license.key ? license.key : 'N/a' }}</td>
+        <td>{{ license.manufacturer ? license.manufacturer : 'N/a' }}</td>
+        <td>{{ license.purchasedFrom ? license.purchasedFrom : 'N/a' }}</td>
+        <td>{{ license.purchasedAt | date("m/d/Y h:i:s A") }}</td>
+      </tr>
+    </tbody>
+  </table>
+</section>
+
+{% endblock %}