jasterv/sentences-crud
1
0
Fork 0
mirror of https://codeberg.org/JasterV/sentences-crud.git synced 2026-04-26 18:10:05 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

views almost done

Browse source
This commit is contained in:
JasterV 2021-07-25 00:11:58 +02:00
parent 20ce2bda35
commit bc007024d7
3 changed files with 39 additions and 38 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

26
src/components/view/router.ts
View file

@ -11,7 +11,19 @@ const model = sentenceModel(db)
router.get('/sentences', async (req, res) => {
const { orderBy, order, lastId } = req.query
const sentences: Sentence[] = await model.list({ orderBy, order, last: lastId })
return res.render('list', { sentences })
return res.render('list', { sentences, orderBy: orderBy ?? null, order })
})
router.get('/sentence/create', async (req, res) => {
const { text, category } = req.body
const id = await model.create({ text, category })
return res.redirect('/public/sentence/' + id)
})
router.get('/sentence/:id/delete', async (req, res) => {
const { id } = req.params
await model.del(id)
return res.redirect('/public/sentences')
})
router.get('/sentence/:id/update', async (req, res) => {
@ -21,10 +33,10 @@ router.get('/sentence/:id/update', async (req, res) => {
return res.render('sentence', { sentence })
})
router.get('/sentence/:id/delete', async (req, res) => {
router.get('/sentence/:id/edit', async (req, res) => {
const { id } = req.params
await model.del(id)
return res.redirect('/sentences')
const sentence: Sentence = await model.getById(id)
return res.render('form_sentence', { sentence })
})
router.get('/sentence/:id', async (req, res) => {
@ -33,11 +45,7 @@ router.get('/sentence/:id', async (req, res) => {
return res.render('sentence', { sentence })
})
router.get('/sentence', async (req, res) => {
const { text, category } = req.body
const id = await model.create({ text, category })
return res.redirect('/sentence/' + id)
})
router.get('/sentence', (_req, res) => res.render('form_sentence', { sentence: {} }))
// EJS views
router.get('/', (_req, res) => res.render('index'))

28
src/views/list.ejs
View file

@ -27,9 +27,9 @@
<% if (sentences && sentences.length> 0) { %>
<div class="btn-toolbar" role="toolbar" aria-label="Toolbar with button groups">
<div class="btn-group mr-2" role="group" aria-label="First group">
<a href="/sentences?page=0&orderBy">
<button type="button" class="btn btn-secondary">Unsorted
<div class="btn-group mx-2" role="group" aria-label="First group">
<a href="/public/sentences">
<button type="button" class="btn btn-secondary">reset
</button>
</a>
</div>
@ -40,12 +40,18 @@
Sort categories
</button>
<div class="dropdown-menu" aria-labelledby="btnGroupDrop1">
<a class="dropdown-item" href="/sentences">ASC</a>
<a class="dropdown-item" href="#">DESC</a>
<a class="dropdown-item" href="/public/sentences?orderBy=category&order=asc">ASC</a>
<a class="dropdown-item" href="/public/sentences?orderBy=category&order=desc">DESC</a>
</div>
</div>
<a href="/sentences/1"><button type="button" class="btn btn-secondary mr-2">Next</button></a>
<a href=<%= `/public/sentences?lastId=${sentences[sentences.length - 1].id}` + (orderBy ? `&orderBy=${orderBy}&order=${order || 'asc'}` : '')%>>
<button type="button" class="btn btn-secondary mx-2">Next</button>
</a>
<a href="/public/sentence">
<button type="button" class="btn btn-secondary mx-2">New sentence</button>
</a>
</div>
<table id="datatable" class="table table-striped mt-5" style="width:100%">
@ -54,7 +60,6 @@
<th>ID</th>
<th>Text</th>
<th>Category</th>
<th>Actions</th>
</tr>
</thead>
<tbody>
@ -69,15 +74,6 @@
<td>
<%= sentence.category %>
</td>
<td>
<div class="btn-group" role="group" aria-label="First group">
<a href=<%='/public/sentence/' + sentence.id %>>
<button type="button" class="btn btn-primary">Edit</button>
</a>
<a href=<%='/public/sentence/' + sentence.id + '/delete' %>><button
type="button" class="btn btn-primary">Delete</button></a>
</div>
</td>
</tr>
<% } %>
</tbody>

23
src/views/sentence.ejs
View file

@ -18,32 +18,29 @@
<body>
<div class="d-flex flex-column h-100 flex-grow-1">
<h1 class="mt-5 align-self-center flex-grow-1">
Sentence <%= sentence.id %>
</h1>
<h1 class="mt-2 align-self-center flex-grow-1">
Sentence <%= sentence.text %>
</h1>
<h1 class="mt-2 align-self-center flex-grow-1">
Sentence <%= sentence.category %>
</h1>
<h3 class="mt-5 align-self-center flex-grow-1">
<%= sentence.text %>
</h3>
<h3 class="mt-3 align-self-center flex-grow-1">
<%= sentence.category %>
</h3>
<div
class="btn-group mt-5 align-self-center flex-grow-1"
role="group"
aria-label="First group"
>
<a href="/sentences?page=0&orderBy"
<a href=<%= "/public/sentence/" + sentence.id + '/edit' %> class="mx-2"
><button type="button" class="mr-2 btn btn-primary">Edit</button></a
>
<a href="/sentences?page=0&orderBy"
<a href=<%= "/public/sentence/" + sentence.id + '/delete' %> class="mx-2"
><button type="button" class="btn btn-primary mr-2">Delete</button></a
>
</div>
<a href="/sentences?page=0&orderBy"
<a href=<%= "/public/sentences" %> class="mt-5 align-self-center flex-grow-1 mr-2"
><button
type="button"
class="btn btn-primary mt-5 align-self-center flex-grow-1 mr-2"
class="btn btn-primary "
>
Sentences
</button></a