@using IOL.Fagprove.Data
<div style="display: none">
    <script id="editCabinInfoModalTemplate"
            type="text/x-kendo-template">
<i class="close icon"></i>
<div class="header">
    Rediger #= data.name #
</div>
<div class="content">
    <form class="ui form"
          id="editCabinForm"
          onsubmit="return false">
          <input type="hidden" name="id" id="id" value="#= data.id #">
        <div class="two fields">
            <div class="field required">
                <label for="name">Navn</label>
                <input id="name"
                       name="name"
                       required
                       value="#= data.name #"
                       type="text">
            </div>
            <div class="field">
                <label for="categoryId">Hyttefelt</label>
                <select class="ui selection dropdown"
                        id="categoryId"
                        name="categoryId">
                    @foreach (var field in StaticData.CabinFields)
                    {
                        <option value="@field.Id">@field.Name</option>
                    }
                </select>
            </div>
        </div>
        <div class="two fields">
            <div class="field">
                <label for="price">Pris pr. natt</label>
                <input id="price"
                       name="price"
                       value="#= data.price #"
                       type="text">
            </div>
            <div class="field">
                <label for="capacity">Sengeplasser</label>
                <input id="capacity"
                       name="capacity"
                       value="#= data.capacity #"
                       type="number">
            </div>
        </div>
        <div class="field">
            <label for="description">Beskrivelse</label>
            <textarea id="description"
                         name="description"
                         type="text">#= data.description #</textarea>
        </div>
    </form>
</div>
<div class="actions">
    <div class="ui black deny button">
        Avbryt
    </div>
    <div class="ui green right labeled icon button"
         id="submitEditCabinForm">
        Oppdater
        <i class="checkmark icon"></i>
    </div>
</div>
    </script>

    <script id="newCabinInfoModalTemplate"
            type="text/x-kendo-template">
<i class="close icon"></i>
<div class="header">
    Ny hytte
</div>
<div class="content">
    <form class="ui form"
          id="newCabinForm"
          onsubmit="return false">
        <div class="two fields">
            <div class="field required">
                <label for="name">Navn</label>
                <input id="name"
                       name="name"
                       required
                       type="text">
            </div>
            <div class="field">
                <label for="categoryId">Hyttefelt</label>
                <select class="ui selection dropdown"
                        id="categoryId"
                        name="categoryId">
                    @foreach (var field in StaticData.CabinFields)
                    {
                        <option value="@field.Id">@field.Name</option>
                    }
                </select>
            </div>
        </div>
        <div class="two fields">
            <div class="field">
                <label for="price">Pris pr. natt</label>
                <input id="price"
                       name="price"
                       type="text">
            </div>
            <div class="field">
                <label for="capacity">Sengeplasser</label>
                <input id="capacity"
                       name="capacity"
                       type="number">
            </div>
        </div>
        <div class="field">
            <label for="description">Beskrivelse</label>
            <textarea id="description"
                         name="description"
                         type="text"></textarea>
        </div>
    </form>
</div>
<div class="actions">
    <div class="ui black deny button">
        Avbryt
    </div>
    <div class="ui green right labeled icon button"
         id="submitNewCabinForm">
        Lagre
        <i class="checkmark icon"></i>
    </div>
</div>
</script>

    <script id="cabinRowCommandButtons"
            type="text/x-kendo-template">
        <div class="ui compact buttons">
            <button class='ui compact button primary' onclick="openEditCabinModal(this)">Rediger</button>
            <button class='ui compact button red' onclick="deleteCabin(this)">Slett</button>
        </div>
    </script>reservationsRowCommandButtons
    <script id="reservationsRowCommandButtons"
            type="text/x-kendo-template">
            <div class="ui compact buttons">
                <button class="ui compact button primary" onclick="inspectReservation(this)">Detaljer</button>
                # if(data.status !== 3 && data.status !== 1) { #
                <button class='ui compact button green' onclick="grantReservation(this)">Godkjenn</button>
                # } #
                # if(data.status !== 3 && data.status !== 2) { #
                <button class='ui compact button red' onclick="rejectReservation(this)">Avvis</button>
                # } #
            </div>
        </script>
    <script id="reservationStatusTextTemplate"
            type="text/x-kendo-template">
      # switch (data.status) {
      case 0: #
            <span class='ui teal label'>VENTENDE</span>
      # break; #
      # case 1: #
            <span class='ui green label'>GODKJENT</span>
      # break; #
      # case 2: #
            <span class='ui red label'>AVVIST</span>
      # break; #
      # case 3: #
            <span class='ui grey label'>INAKTIV</span>
      # break; #
      # }#
    </script>
    
    <script id="reservationInfoTemplate" type="text/x-kendo-template">
      <i class="close icon"></i>
      <div class="header">
        Reservasjon - #= data.name #
      </div>
      <div class="content">
        <div class="description">
          <div class="ui header">#= data.name #</div>
          <p>Fra: #= data.from #</p>
          <p>Til: #= data.to #</p>
          <p>Hytte: #= data.cabin #</p>
          <p>Status: #= data.status #</p>
                # switch (data.status) {
                case 0: #
                      <p>Status: <span class='ui teal label'>VENTENDE</span></p>
                # break; #
                # case 1: #
                      <p>Status: <span class='ui green label'>GODKJENT</span></p>
                # break; #
                # case 2: #
                      <p>Status: <span class='ui red label'>AVVIST</span></p>
                # break; #
                # case 3: #
                      <p>Status: <span class='ui grey label'>INAKTIV</span></p>
                # break; #
                # }#
          # if(data.description) { #
          <span class="ui large text">Kommentar</span>
          <p>#= data.description #</p>
          # } #
        </div>
      </div>
      <div class="actions">
        <div class="ui deny button">
          Lukk
        </div>
      </div>
    </script>
</div>