SylowTech/sylow

extends includes/dash.pug

block dashboard
  h1(class="ui header")= "Clients"
  div(class="ui four cards")
    each client in clients
      div(class="ui card")
        div(class="content")
          a(class="header" href=`/clients/${client._id}`)= client.clientName
          div(class="description")= "Client"
        a(class="ui bottom attached negative button" data-action="showDeleteModal" data-params=client._id)= "Delete"
  div(class="ui hidden divider")
  h2(class="ui header")= "Create New Client"
  form(class="ui form" id="register-form" method="POST")
    div(class="field")
      label= "Client ID"
      input(type="text" id="clientId" name="clientId" placeholder="myawesomeclient")
    div(class="field")
      label= "Client Name"
      input(type="text" id="clientName" name="clientName" placeholder="My Awesome Client")
    div(class="field")
      label= "Device Type"
      div(class="ui selection dropdown")
        input(id="deviceType" name="deviceType" type="hidden")
        i(class="dropdown-icon")
        div(class="default text") Computer
        div(class="menu")
          div(class="item" data-value="computer") Computer
          div(class="item" data-value="mobile") Mobile
          div(class="item" data-value="web") Web
          div(class="item" data-value="gateway") Gateway
          div(class="item" data-value="other") Other
    div(class="field")
      label= "Redirect URI"
      input(type="text" id="redirectUri" name="redirectUri" placeholder="https://example.com/oauth/cb")
    div(class="field")
      label= "Scopes"
      input(type="text" id="scope" name="scope" placeholder="read_documents write_documents")
    div(class="ui hidden divider")
    button(type="submit" class="ui large basic positive button") Register
    div(class="ui error message")

  div(id="delete-client-modal" class="ui basic modal")
    div(class="ui icon header")
      i(class="remove icon")
      | Delete Client
    div(class="content")
      p= "Are you sure you wish to delete this client?"
    div(class="actions")
      div(class="ui basic inverted button" data-action="hideModal")
        i(class="remove icon")
        | Cancel
      div(class="ui red basic inverted button" data-action="deleteClient")
        i(class="checkmark icon")
        | Delete