zeitkort-web-golang/templates/main.html

{{define "main"}}
{{if .AppError}}<p class="error">{{.AppError}}</p>{{end}}
{{if .Notice}}<p class="notice">{{.Notice}}</p>{{end}}

{{if .Running}}
<div class="running-bar">
  <span class="clock" id="clock" data-start="{{rfc3339 .Running.StartTime}}">00:00:00</span>
  <span class="rb-task">Working on <strong>{{.Running.TaskDescription}}</strong></span>
  <button class="go stop" hx-post="/sessions/{{.Running.ID}}/stop"
          hx-vals='{"company_id":"{{.CompanyID}}","assignment_id":"{{.AssignmentID}}"}'
          hx-target="#main">■ Stop</button>
</div>
{{end}}

<fieldset>
  <legend>Company</legend>
  <select name="company_id" hx-get="/main" hx-target="#main">
    <option value="0">— select company —</option>
    {{range .Companies}}
      <option value="{{.ID}}" {{if eq .ID $.CompanyID}}selected{{end}}>{{.Name}}</option>
    {{end}}
  </select>
  <button hx-get="/companies/new" hx-target="#main">New</button>
  {{if .CompanyID}}
    <button hx-get="/companies/{{.CompanyID}}/edit" hx-target="#main">Edit</button>
    <details class="confirm">
      <summary>Delete</summary>
      <div class="confirm-pop">
        Delete this company? You must remove its assignments first. This cannot be undone.
        <button hx-post="/companies/{{.CompanyID}}/delete" hx-target="#main">Yes, delete</button>
        <button class="cancel" hx-get="/main?company_id={{.CompanyID}}&amp;assignment_id={{.AssignmentID}}" hx-target="#main">Cancel</button>
      </div>
    </details>
  {{end}}
</fieldset>

{{if .CompanyID}}
<fieldset>
  <legend>Assignment</legend>
  <select name="assignment_id" hx-get="/main" hx-target="#main"
          hx-vals='{"company_id":"{{.CompanyID}}"}'>
    <option value="0">— select assignment —</option>
    {{range .Assignments}}
      <option value="{{.ID}}" {{if eq .ID $.AssignmentID}}selected{{end}}>{{.Name}} ({{.Status}})</option>
    {{end}}
  </select>
  <button hx-get="/assignments/new?company_id={{.CompanyID}}" hx-target="#main">New</button>
  {{if .AssignmentID}}
    <button hx-get="/assignments/{{.AssignmentID}}/edit?company_id={{.CompanyID}}" hx-target="#main">Edit</button>
    <details class="confirm">
      <summary>Delete</summary>
      <div class="confirm-pop">
        Delete this assignment? You must remove its tasks first. This cannot be undone.
        <button hx-post="/assignments/{{.AssignmentID}}/delete?company_id={{.CompanyID}}" hx-target="#main">Yes, delete</button>
        <button class="cancel" hx-get="/main?company_id={{.CompanyID}}&amp;assignment_id={{.AssignmentID}}" hx-target="#main">Cancel</button>
      </div>
    </details>
  {{end}}
</fieldset>
{{end}}

{{if .Assignment}}
<div class="columns">
<div class="col">

<fieldset>
  <legend>Tasks</legend>
  {{range .Tasks}}
    {{if eq .ID $.EditingTaskID}}
    <div class="task">
      <form class="inline" hx-post="/tasks/{{.ID}}" hx-target="#main">
        <input type="hidden" name="company_id" value="{{$.CompanyID}}">
        <input type="hidden" name="assignment_id" value="{{$.AssignmentID}}">
        <span class="muted">{{.Number}} -</span>
        <input type="text" name="name" value="{{.Name}}">
        <button type="submit">Save</button>
        <button type="button" class="cancel"
                hx-get="/main?company_id={{$.CompanyID}}&amp;assignment_id={{$.AssignmentID}}"
                hx-target="#main">Cancel</button>
      </form>
    </div>
    {{else}}
    <div class="task">
      {{if $.Running}}
        {{if eq .ID $.Running.TaskID}}
          <span class="go-badge">● running</span>
        {{else}}
          <button class="go" disabled title="Stop the running timer first">▶ Start</button>
        {{end}}
      {{else}}
        <button class="go" hx-post="/sessions/start"
                hx-vals='{"company_id":"{{$.CompanyID}}","assignment_id":"{{$.AssignmentID}}","task_id":"{{.ID}}"}'
                hx-target="#main">▶ Start</button>
      {{end}}
      <span class="pick">{{.Number}} - {{.Name}}
        <span class="muted">({{hours .TotalMinutes}} hrs)</span>
      </span>
      <button hx-get="/tasks/{{.ID}}/edit?company_id={{$.CompanyID}}&amp;assignment_id={{$.AssignmentID}}"
              hx-target="#main">Edit</button>
      <details class="confirm">
        <summary>Delete</summary>
        <div class="confirm-pop">
          Delete this task? You must remove its work sessions first. This cannot be undone.
          <button hx-post="/tasks/{{.ID}}/delete?company_id={{$.CompanyID}}&amp;assignment_id={{$.AssignmentID}}" hx-target="#main">Yes, delete</button>
          <button class="cancel" hx-get="/main?company_id={{$.CompanyID}}&amp;assignment_id={{$.AssignmentID}}" hx-target="#main">Cancel</button>
        </div>
      </details>
    </div>
    {{end}}
  {{else}}
    <p class="muted">No tasks yet.</p>
  {{end}}
  {{if .AddingTask}}
  <form class="inline" hx-post="/tasks" hx-target="#main">
    <input type="hidden" name="company_id" value="{{.CompanyID}}">
    <input type="hidden" name="assignment_id" value="{{.AssignmentID}}">
    <input type="text" name="name" placeholder="new task name">
    <button type="submit">Add</button>
    <button type="button" class="cancel"
            hx-get="/main?company_id={{.CompanyID}}&amp;assignment_id={{.AssignmentID}}"
            hx-target="#main">Cancel</button>
  </form>
  {{else}}
  <button class="add-toggle"
          hx-get="/tasks/new?company_id={{.CompanyID}}&amp;assignment_id={{.AssignmentID}}"
          hx-target="#main">+ New task</button>
  {{end}}
</fieldset>

</div>
<div class="col">

<fieldset>
  <legend>Recent sessions</legend>
  <p>Total: <strong>{{money .TotalHours}} hrs</strong> = <strong>{{money .TotalAmount}} DKK</strong></p>
  <div class="table-wrap">
  <table>
    <thead><tr><th>Date</th><th>Time</th><th>Hrs</th><th>Task</th><th></th></tr></thead>
    <tbody>
    {{range .Sessions}}
      <tr {{if not .EndTime}}class="active"{{end}}>
        <td>{{datef .StartTime}}</td>
        <td>{{hm .StartTime}}–{{timef .EndTime}}</td>
        <td>{{if .EndTime}}{{hours .DurationMinutes}}{{else}}—{{end}}</td>
        <td>{{.TaskDescription}}</td>
        <td class="row-actions">
          {{if .EndTime}}
            <button hx-get="/sessions/{{.ID}}/edit?company_id={{$.CompanyID}}&assignment_id={{$.AssignmentID}}"
                    hx-target="#main">Edit</button>
            <details class="confirm">
              <summary>Del</summary>
              <div class="confirm-pop">
                Delete this work session? This cannot be undone.
                <button hx-post="/sessions/{{.ID}}/delete?company_id={{$.CompanyID}}&amp;assignment_id={{$.AssignmentID}}" hx-target="#main">Yes, delete</button>
                <button class="cancel" hx-get="/main?company_id={{$.CompanyID}}&amp;assignment_id={{$.AssignmentID}}" hx-target="#main">Cancel</button>
              </div>
            </details>
          {{end}}
        </td>
      </tr>
    {{else}}
      <tr><td colspan="5" class="muted">No sessions yet.</td></tr>
    {{end}}
    </tbody>
  </table>
  </div>
  <p>
    <button hx-get="/sessions/new?company_id={{.CompanyID}}&amp;assignment_id={{.AssignmentID}}"
            hx-target="#main">Add manual entry</button>
    <button hx-get="/invoice?company_id={{.CompanyID}}&amp;assignment_id={{.AssignmentID}}"
            hx-target="#main">Generate invoice (PDF)</button>
  </p>
</fieldset>

</div>
</div>
{{end}}
{{end}}