Skip to content

Commit

Permalink
group
Browse files Browse the repository at this point in the history
  • Loading branch information
mstgnz committed Jul 7, 2024
1 parent 6fe677a commit 3edcfa9
Show file tree
Hide file tree
Showing 4 changed files with 92 additions and 87 deletions.
1 change: 1 addition & 0 deletions cmd/main.go
Original file line number Diff line number Diff line change
Expand Up @@ -145,6 +145,7 @@ func main() {
r.Get("/groups", Catch(webGroupHandler.HomeHandler))
r.Get("/groups-pagination", Catch(webGroupHandler.PaginationHandler))
r.Post("/groups", Catch(webGroupHandler.CreateHandler))
r.Get("/groups/{id}", Catch(webGroupHandler.EditHandler))
r.Put("/groups/{id}", Catch(webGroupHandler.UpdateHandler))
r.Delete("/groups/{id}", Catch(webGroupHandler.DeleteHandler))
// webhook
Expand Down
93 changes: 87 additions & 6 deletions handler/web/group.go
Original file line number Diff line number Diff line change
@@ -1,13 +1,13 @@
package web

import (
"encoding/json"
"fmt"
"io"
"math"
"net/http"
"strings"

"github.com/go-chi/chi/v5"
"github.com/mstgnz/cronjob/config"
"github.com/mstgnz/cronjob/models"
"github.com/mstgnz/cronjob/services"
Expand Down Expand Up @@ -123,7 +123,6 @@ func (h *GroupHandler) PaginationHandler(w http.ResponseWriter, r *http.Request)
if v.UpdatedAt != nil {
updatedAt = v.UpdatedAt.Format("2006-01-02 15:04:05")
}
dataGroup, _ := json.Marshal(v)
tr += fmt.Sprintf(`<tr>
<th scope="row">%d</th>
<td>%s</td>
Expand All @@ -133,16 +132,98 @@ func (h *GroupHandler) PaginationHandler(w http.ResponseWriter, r *http.Request)
<td>%s</td>
<td>
<div class="hstack gap-1">
<button class="btn btn-info" data-group='%s'>
<button class="btn btn-info" hx-get="/groups/%d"
hx-trigger="edit"
onClick="let editing = document.querySelector('.editing')
if(editing) {
Swal.fire({title: 'Already Editing',
showCancelButton: true,
confirmButtonText: 'Yep, Edit This Row!',
text:'Hey! You are already editing a row! Do you want to cancel that edit and continue?'})
.then((result) => {
if(result.isConfirmed) {
htmx.trigger(editing, 'cancel')
htmx.trigger(this, 'edit')
}
})
} else {
htmx.trigger(this, 'edit')
}">
<i class="bi bi-pencil"></i>
</button>
<button class="btn btn-danger" hx-delete="/groups/%d" hx-confirm="Are you sure?">
<i class="bi bi-trash-fill"></i>
<button class="btn btn-danger" hx-delete="/groups/%d" hx-trigger='confirmed' onClick="Swal.fire({
title: 'Do you approve the deletion?',
icon: 'warning',
showCancelButton: true,
cancelButtonColor: '#d33',
cancelButtonText: 'Close',
confirmButtonColor: '#3085d6',
confirmButtonText: 'Yes Delete'
}).then((result) => {if (result.isConfirmed) {htmx.trigger(this, 'confirmed')}})">
<i class="bi bi-trash-fill"></i>
</button>
</div>
</td>
</tr>`, v.ID, v.Name, v.Parent.Name, v.Active, v.CreatedAt.Format("2006-01-02 15:04:05"), updatedAt, dataGroup, v.ID)
</tr>`, v.ID, v.Name, v.Parent.Name, v.Active, v.CreatedAt.Format("2006-01-02 15:04:05"), updatedAt, v.ID, v.ID)
}
_, _ = w.Write([]byte(tr))
return nil
}

func (h *GroupHandler) EditHandler(w http.ResponseWriter, r *http.Request) error {
cUser, _ := r.Context().Value(config.CKey("user")).(*models.User)

id := chi.URLParam(r, "id")
query := r.URL.Query()
query.Set("id", id)
r.URL.RawQuery = query.Encode()

_, response := h.ListService(w, r)

data, _ := response.Data["groups"].([]*models.Group)
var updatedAt = ""
if data[0].UpdatedAt != nil {
updatedAt = data[0].UpdatedAt.Format("2006-01-02 15:04:05")
}

activeSelected := ""
deactiveSelected := ""

if data[0].Active {
activeSelected = "selected"
} else {
deactiveSelected = "selected"
}

group := &models.Group{}
groups, _ := group.Get(cUser.ID, 0, 0)

groupSelect := `<select name="uid" class="form-control">`
for _, v := range groups {
groupSelect += fmt.Sprintf(`<option value="%d">%s</option>`, v.ID, v.Name)
}
groupSelect += `</select>`

form := fmt.Sprintf(`
<tr hx-put="/groups/%d" hx-trigger='cancel' hx-target="#toast" hx-swap="innerHTML" hx-ext="json-enc" class='editing'>
<th scope="row">%d</th>
<td><input name="name" class="form-control" value="%s"></td>
<td>%v</td>
<td><select class="form-select" name="active">
<option value="true" %s>Active</option>
<option value="false" %s>Deactive</option>
</select></td>
<td>%s</td>
<td>%s</td>
<td>
<div class="hstack gap-1">
<button class="btn btn-warning" hx-get="/groups-pagination" hx-target="#tbody" hx-swap="innerHTML">Cancel</button>
<button class="btn btn-danger" hx-put="/groups/%d" hx-include="closest tr">Save</button>
</div>
</td>
</tr>
`, data[0].ID, data[0].ID, data[0].Name, groupSelect, activeSelected, deactiveSelected, data[0].CreatedAt.Format("2006-01-02 15:04:05"), updatedAt, data[0].ID)

_, _ = w.Write([]byte(form))
return nil
}
4 changes: 2 additions & 2 deletions models/group.go
Original file line number Diff line number Diff line change
Expand Up @@ -61,10 +61,10 @@ func (m *Group) Get(userID, id, uid int) ([]*Group, error) {
query := strings.TrimSuffix(config.App().QUERY["GROUPS"], ";")

if id > 0 {
query += fmt.Sprintf(" AND id=%v", id)
query += fmt.Sprintf(" AND id=%d", id)
}
if uid > 0 {
query += fmt.Sprintf(" AND uid=%v", uid)
query += fmt.Sprintf(" AND uid=%d", uid)
}

// prepare
Expand Down
81 changes: 2 additions & 79 deletions views/components/group/list.gohtml
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,6 @@
{{end}}

{{define "groupList" }}

<table class="table" hx-get="/groups-pagination" hx-target="#tbody" hx-swap="innerHTML" hx-trigger="load">
<thead>
<tr>
Expand All @@ -25,88 +24,12 @@
<th scope="col">Actions</th>
</tr>
</thead>
<tbody id="tbody"></tbody>
<tbody id="tbody" hx-target="closest tr" hx-swap="outerHTML"></tbody>
</table>
<!-- Pagination -->
<div class="mt-4">
<nav aria-label="Page navigation example">
<nav>
<ul class="pagination justify-content-center" hx-get="/groups-pagination?pagination" hx-target="this" hx-swap="innerHTML" hx-trigger="load"></ul>
</nav>
</div>
<!-- GROUP UPDATE MODAL -->
<div id="update" class="modal modal-blur fade" style="display: none">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title">Group Update</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<form hx-put="/groups/0" hx-target="#toast" hx-ext="json-enc" novalidate autocomplete="off">
<div class="modal-body">
<div class="form-floating mb-2">
<input type="text" class="form-control" name="name" placeholder="Name" required>
<label for="name">Name</label>
</div>
<div class="form-floating mb-2">
<select class="form-select" name="uid">
<option value="0" selected>Choose Parent (optional)</option>
{{ range .lists.groups }}
<option value="{{.ID}}">{{.Name}}</option>
{{end}}
</select>
<label for="uid">Parent</label>
</div>
<div class="form-floating mb-2">
<select class="form-select" name="active">
<option value="true" selected>Active</option>
<option value="false">Deactive</option>
</select>
<label for="active">Status</label>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
<button type="submit" class="btn btn-primary">Change</button>
</div>
</form>
</div>
</div>
</div>
{{end}}

{{define "js"}}
<script>
document.querySelector("tbody").addEventListener("click", function(e) {
if (e.target.closest('.btn-info')) {
const button = e.target.closest('.btn-info');
let group = button.getAttribute('data-group');
group = JSON.parse(group)
document.getElementById('update').querySelectorAll('input[name="name"]')[0].value = group.name
document.getElementById('update').querySelectorAll('select[name="uid"]')[0].value = group.uid
document.getElementById('update').querySelectorAll('select[name="active"]')[0].value = group.active
document.getElementById('update').getElementsByTagName('form')[0].setAttribute("hx-put","/groups/"+group.id)
// report changes to htmx
htmx.process(document.getElementById('update').getElementsByTagName('form')[0]);
new bootstrap.Modal('#update').show()
}
})
document.body.addEventListener('htmx:confirm', function(evt) {
if (evt.target.matches("[confirm-with-sweet-alert='true']")) {
evt.preventDefault();
Swal.fire({
title: 'Do you approve the deletion?',
icon: 'warning',
showCancelButton: true,
cancelButtonColor: '#d33',
cancelButtonText: 'Close',
confirmButtonColor: '#3085d6',
confirmButtonText: 'Yes Delete'
}).then((result) => {
if (result.isConfirmed) {
evt.detail.issueRequest();
}
})
}
})
</script>
{{end}}

0 comments on commit 3edcfa9

Please sign in to comment.