@using Syncfusion.EJ2
@{
    ViewBag.Title = "Schulhaus-Verwaltung";
    Layout = "~/Views/Shared/_Layout.cshtml";
   

}
<h2>Schulhaus-Verwaltung</h2>
<br />

<div class="control-wrapper">
    <ejs-grid id="Grid" dataSource="@ViewBag.DataSource" allowPaging="true" toolbar="@(new List<string>() {"Add", "Edit", "Update", "Delete" })" actionComplete="actionComplete">
        <e-grid-editSettings allowAdding="true" allowDeleting="true" allowEditing="true" mode="Dialog" template='#dialogtemplate'></e-grid-editSettings>
        <e-data-manager url="/Schulhaus/UrlDataSource" adaptor="UrlAdaptor" updateUrl="/Schulhaus/Update" removeUrl="/Schulhaus/Remove" insertUrl="/Schulhaus/Insert"></e-data-manager>

        <e-grid-columns>

            <e-grid-column field="id" headerText="ID" textAlign="Right" width="50" isPrimaryKey="true" defaultValue="0" allowediting="false" isIdentity="true" type="number"></e-grid-column>

            <e-grid-column field="bezeichnung" headerText="Bezeichnung" width="100"></e-grid-column>

            <e-grid-column field="strasse" headerText="Strasse" width="100"></e-grid-column>

            <e-grid-column field="plz" headerText="Plz" width="50"></e-grid-column>

            <e-grid-column field="ort" headerText="Ort" width="100"></e-grid-column>

            <e-grid-column field="telefon" headerText="Tel." width="100"></e-grid-column>

            <e-grid-column field="aktiv" headerText="Akt." width="50" defaultValue="true" displayAsCheckBox="true" textAlign="Center" editType="booleanedit"></e-grid-column>
            @if (ViewBag.showadmin == "true")
            {
                <e-grid-column field="erstellt_am" headerText="erstellt_am" width="50" format="dd.MM.yyyy mm:ss:hs" DefaultValue="@(DateTime.Now)" visible="true"></e-grid-column>

                <e-grid-column field="mutiert_am" headerText="Mut." width="50" format="dd.MM.yyyy mm:ss:hs" DefaultValue="@(DateTime.Now)"></e-grid-column>

                <e-grid-column field="mutierer" headerText="MU" width="50" DefaultValue="0"></e-grid-column>

                <e-grid-column field="sort" headerText="sort" width="50" visible="true" DefaultValue="0"></e-grid-column>

                <e-grid-column field="mandantnr" headerText="mandantnr" width="50" visible="true" DefaultValue="0"></e-grid-column>
            }
        </e-grid-columns>
    </ejs-grid>
</div>

<script id="dialogtemplate" type="text/template">
    <div class="container" style="width:600px">



           <div class="form-row ">
                <div class="form-group col-6 ">
                    <div class="e-float-input e-control-wrapper">
                        <input id="id" name="id" type="text" value="${id}" ${if(isAdd)} ${else} disabled ${ /if} />
                        <span class="e-float-line"></span>
                        <label class="e-float-text e-label-top" for="id">ID</label>
                    </div>
                </div>

                <div class="form-group col-6  justify-content-end">
                    <div class="e-float-input e-control-wrapper  justify-content-end">
                        <input id="aktiv" name="aktiv" type="checkbox" class="e-field e-ejcheckbox valid" ${if (aktiv)} checked ${ /if} style="width:20px;" />
                        <label class="e-float-text e-label-top" for="aktiv">Aktiv</label>
                    </div>
                </div>

            </div>
        <div class="form-row">


            <div class="form-group col-md-6">
                <div class="e-float-input e-control-wrapper">
                    <input id="bezeichnung" name="bezeichnung" type="text" value="${bezeichnung}" />
                    <span class="e-float-line"></span>
                    <label class="e-float-text e-label-top" for="bezeichnung">Bezeichnung</label>
                </div>
            </div>
        </div>
        <div class="form-row">
            <div class="form-group col-md-6">
                <div class="e-float-input e-control-wrapper">
                    <input name="plz" id="plz" value="${plz}" />
                    <span class="e-float-line"></span>
                    <label class="e-float-text e-label-top" for="plz">PLZ</label>
                </div>
            </div>

            <div class="form-group col-md-6">
                <div class="e-float-input e-control-wrapper">
                    <input name="ort" id="ort" value="${ort}" />
                    <span class="e-float-line"></span>
                    <label class="e-float-text e-label-top" for="ort">Ort</label>
                </div>

            </div>
        </div>
        <div class="form-row">
            <div class="form-group col-md-6">
                <div class="e-float-input e-control-wrapper">
                    <input name="strasse" id="strasse" value="${strasse}" />
                    <span class="e-float-line"></span>
                    <label class="e-float-text e-label-top" for="strasse">Strasse</label>
                </div>
            </div>

            <div class="form-group col-md-6">
                <div class="e-float-input e-control-wrapper">
                    <input name="telefon" id="telefon" value="${telefon}" />
                    <span class="e-float-line"></span>
                    <label class="e-float-text e-label-top" for="telefon">Telefon</label>
                </div>
            </div>


        </div>
        <hidden name="erstellt_am" id="erstellt_am" value="${erstellt_am}" visible="false" />
        <hidden name="mutiert_am" id="mutiert_am" value="${mutiert_am}" />
        <hidden name="mutierer" id="mutierer" value="${mutierer}" />
        <hidden name="sort" id="sort" value="${sort}" />
        <hidden name="mandantnr" id="mandantnr" value="${mandantnr}" />
    </div>
</script>
<script type="text/javascript">

    function actionComplete(args) {
        if ((args.requestType === 'beginEdit' || args.requestType === 'add')) {
                var data = args.rowData;

                //var localData = @Html.Raw(Json.Serialize(ViewBag.DataSource));



                // Set initail Focus
                if (args.requestType === 'beginEdit') {
                    args.form.elements.namedItem('id').focus();
                    args.dialog.header = "Bearbeitung " + args.form.elements.namedItem('bezeichnung').value;

                } else {
                    args.form.elements.namedItem('id').focus();
                }
        }
    }

</script>