kreta/KretaWeb/Areas/Adatszolgaltatasok/Views/PedagogusIKTAdatszolgaltatas/Index.cshtml

@using Kendo.Mvc.UI
@using Kreta.Web.Areas.Adatszolgaltatasok.Models
@using Kreta.Web.Helpers
@using Kreta.Web.Classes
@using Kreta.Web.Helpers.Grid
@using Kreta.Resources;
@model PedagogusIKTAdatszolgaltatasModel

@{
    Layout = "~/Views/Shared/_MasterLayout.cshtml";
}

@{
    var gridName = "PedagogusIKTAdatszolgaltatasGrid";
    var formName = "PedagogusIKTAdatszolgaltatasForm";
}
@using (Html.KretaForm(formName))
{
    <div class="container-fluid">
        <div class="row">
            @Html.KretaSaveButton("SavePedagogusIKTAdatszolgaltatasUpper", "PedagogusIKTAdatszolgaltatasHelper.savePedagogusIKTAdatszolgaltatas")
            @Html.KretaButton("CancelPedagogusIKTAdatszolgaltatasUpper", CommonResource.Megse, clickEventName: "PedagogusIKTAdatszolgaltatasHelper.cancelPedagogusIKTAdatszolgaltatas")
        </div>
        <div class="col-sm-12 row">
            <div class="row">
                <div class="col-sm-3">
                    @Html.KretaLabelFor(m => m.ENaploHasznalat, 12, 0, true)
                </div>
                <div class="col-sm-9">
                    @Html.KretaRadioButtonListFor(m => m.ENaploHasznalat, Model.ENaploHasznalatList, true)
                </div>
            </div>
            <div class="row">
                <div class="col-sm-3">
                    @Html.KretaLabelFor(m => m.WifiEleres)
                </div>
                <div class="col-sm-9">
                    @Html.KretaRadioButtonListFor(m => m.WifiEleres, Model.WifiEleresList, true)
                </div>
            </div>
            <br />
            <div class="row">
                <div class="col-sm-12" style="font-weight: bold; text-align: center;">
                    @AdatszolgaltatasokResource.KerjukVegyeFelTermeitEsEszkozeit
                </div>
            </div>
            <div class="row" id="rowTermekSzamaGeneralt" name="rowTermekSzamaGeneralt">
                <div class="col-sm-6">
                    @Html.KretaLabelFor(m => m.TermekSzamaGeneralt)
                </div>
                <div class="col-sm-6">
                    @Html.KretaLabelFor(m => m.WifiLefedettTermekSzamaGeneralt)
                </div>
            </div>
            <div class="row" id="rowTermekSzama" name="rowTermekSzama">
                <div class="col-sm-6">
                    @Html.KretaNumericFor(m => m.TermekSzama).Min(0).Max(500).HtmlAttributes(new { maxlength = 3 }).RenderWithName()
                </div>
                <div class="col-sm-6">
                    @Html.KretaNumericFor(m => m.WifiLefedettTermekSzama).Min(0).Max(500).HtmlAttributes(new { maxlength = 3 }).RenderWithName()
                </div>
            </div>
            <div class="row">
                <div class="col-sm-6">
                    @Html.KretaLabelFor(m => m.ProjektorokSzamaGeneralt)
                </div>
                <div class="col-sm-6">
                    @Html.KretaLabelFor(m => m.MukodoProjektorokSzamaGeneralt)
                </div>
            </div>
            <div class="row">
                <div class="col-sm-6">
                    @Html.KretaNumericFor(m => m.ProjektorokSzama).Min(0).Max(99).HtmlAttributes(new { maxlength = 2 }).RenderWithName()
                </div>
                <div class="col-sm-6">
                    @Html.KretaNumericFor(m => m.MukodoProjektorokSzama).Min(0).Max(99).HtmlAttributes(new { maxlength = 2 }).RenderWithName()
                </div>
            </div>

            <div class="col-sm-12 row">
                @(Html.Kendo().PanelBar()
                    .Name("PanelBar")
                    .ExpandMode(PanelBarExpandMode.Multiple)
                    .Items(panelbar =>
                    {
                    panelbar.Add().Text(AdatszolgaltatasokResource.PedagogusIKTKompetenciaSzintekIdeKattintvaMegtekinthetiAReszletesLeirasokat)
                        .Expanded(false)
                        .Content(
                        @<table>
                            <tr style="padding: 10px;">
                                <td style="padding: 10px; font-weight: bold">
                                    @AdatszolgaltatasokResource.Nincs
                                </td>
                            </tr>
                            <tr style="padding: 10px; border-bottom: solid 1px #e0e0e0">
                                <td style="padding: 10px">
                                    @AdatszolgaltatasokResource.APedagogusNemRendelkezikIKTKompetenciaval
                                </td>
                            </tr>
                            <tr style="padding: 10px;">
                                <td style="padding: 10px; font-weight: bold">
                                    @AdatszolgaltatasokResource.IKER1
                                </td>
                            </tr>
                            <tr style="padding: 10px; border-bottom: solid 1px #e0e0e0">
                                <td style="padding: 10px">
                                    @AdatszolgaltatasokResource.EuropassOneletrajzbanAzASzint
                                </td>
                            </tr>
                            <tr style="padding: 10px;">
                                <td style="padding: 10px; font-weight: bold">
                                    @AdatszolgaltatasokResource.IKER2
                                </td>
                            </tr>
                            <tr style="padding: 10px; border-bottom: solid 1px #e0e0e0">
                                <td style="padding: 10px">
                                    @AdatszolgaltatasokResource.EuropassOneletrajzbanAzASzint0
                                </td>
                            </tr>
                            <tr style="padding: 10px;">
                                <td style="padding: 10px; font-weight: bold">
                                    @AdatszolgaltatasokResource.IKER3
                                </td>
                            </tr>
                            <tr style="padding: 10px; border-bottom: solid 1px #e0e0e0">
                                <td style="padding: 10px">
                                    @AdatszolgaltatasokResource.EuropassOneletrajzbanAzBSzint
                                </td>
                            </tr>
                            <tr style="padding: 10px;">
                                <td style="padding: 10px; font-weight: bold">
                                    @AdatszolgaltatasokResource.IKER4
                                </td>
                            </tr>
                            <tr style="padding: 10px; border-bottom: solid 1px #e0e0e0">
                                <td style="padding: 10px">
                                    @AdatszolgaltatasokResource.EuropassOneletrajzbanAzBSzint0
                                </td>
                            </tr>
                            <tr style="padding: 10px;">
                                <td style="padding: 10px; font-weight: bold">
                                    @AdatszolgaltatasokResource.Na
                                </td>
                            </tr>
                            <tr style="padding: 10px;">
                                <td style="padding: 10px">
                                    @AdatszolgaltatasokResource.NincsAdat
                                </td>
                            </tr>
                        </table>
                            );
                    })
                )
            </div>
        </div>
    </div>
    @Html.KretaValidationSummary()
}

@Html.KretaTooltipTemplate("kendoTooltip-tanarNevTemplate",
    @"<div class='kendoTooltip'>
    <table>
      <tr>
        <td style='padding-right: 5px'><b>Anyja neve:</b></td>
        <td>#:target.data('anyjaneve')#</td>
      </tr>
      <tr>
        <td style='padding-right: 5px'><b>Születési idő:</b></td>
        <td>#:target.data('szuletesiido')#</td>
      </tr>
    </table>
  </div>")

<div>
    @{
        var grid = Html.KretaGrid<PedagogusIKTAdatszolgaltatasGridModel>(
            gridName,
            new GridApiUrl("PedagogusIKTAdatszolgaltatasApi", "GetPedagogusIKTAdatszolgaltatasGrid", new Dictionary<string, string>()),
            dataBoundAdditionalFunction: "PedagogusIKTAdatszolgaltatasHelper.dataBoundAdditionalFunction();",
            allowSorting: false,
            allowPaging: false,
            allowScrolling: true,
            pageSizes: null,
            mustShowPagerCount: false,
            //TODO: Itt azért tüntettjük el a sorszámot, mert hozzáadunk egy plusz sort amivel az összes elemet lehet módosítani, amit szintén sorszámoz a grid és ez a user-eket zavarja!
            //      Vissza kell tenni a sorszámokat, ha sikerül máshogy megoldani az összes elem módosítását a gridben!
            showSorszam: false,
            sort: sort => sort.Add(s => s.TanarNev).Ascending()
        )
        .Columns(columns =>
        {
            columns.Bound(c => c.ID).Hidden(true);
            columns.Bound(c => c.TanarNev)
                .ClientTemplate(@"
            <span class='kendoTooltip tanarNev'
              data-tanarid='#: ID #'
              data-tanarnev='#: TanarNev #'
              data-anyjaneve='#: AnyjaNeve #'
              data-szuletesiido='#: SzuletesiIdoFormatted #'
            >#: TanarNev #</span>");
        })
        .ComboBoxForColumn(Html, AdatszolgaltatasokResource.IKTKompetenciaSzint, Model.IKTKompetenciaSzintList, m => m.IKTKompetenciaSzint, classList: new List<string> { "gridInputMaxWidth" })
        .ComboBoxForColumn(Html, AdatszolgaltatasokResource.IKTEszkozhasznalatModja, Model.IKTEszkozhasznalatModjaList, m => m.IKTEszkozhasznalatModja, classList: new List<string> { "gridInputMaxWidth" })
        .ComboBoxForColumn(Html, AdatszolgaltatasokResource.ElsodlegesIKTEszkoz, Model.ElsodlegesIKTEszkozList, m => m.ElsodlegesIKTEszkoz, classList: new List<string> { "gridInputMaxWidth" });
    }
</div>

<script type="text/javascript">

    PedagogusIKTAdatszolgaltatasHelper = (function () {
        var pedagogusIKTAdatszolgaltatasHelper = function () { };

        var url = {
            SavePedagogusIKTAdatszolgaltatas: "@Url.HttpRouteUrl(Constants.RouteKey.ActionApi, new { controller = "PedagogusIKTAdatszolgaltatasApi", action = "SavePedagogusIKTAdatszolgaltatas" })"
        };

        var gridName = "@gridName";
        var formName = "@formName";

        pedagogusIKTAdatszolgaltatasHelper.dataBoundAdditionalFunction = function () {
            KretaTooltipHelper.setTooltip($(".tanarNev"), "#kendoTooltip-tanarNevTemplate");
            var dataSource = KretaGridHelper.getKendoGridData(gridName).dataSource.data();
            setHeaderComboBoxChange(dataSource, "IKTKompetenciaSzint");
            setHeaderComboBoxChange(dataSource, "IKTEszkozhasznalatModja");
            setHeaderComboBoxChange(dataSource, "ElsodlegesIKTEszkoz");
        }

        function setHeaderComboBoxChange(dataSource, comboBoxName) {
            var headerComboBoxFullName = gridName + "_" + comboBoxName + "_0";
            var headerComboBox = $("#" + headerComboBoxFullName);
            $(headerComboBox).off("change");
            $(headerComboBox).on("change", function () {
                var headerValue = headerComboBox[0].value;
                var hasHeaderComboBoxItem = CommonUtils.checkKendoComboBoxHasItemByValue(headerComboBoxFullName, headerValue);
                if (!hasHeaderComboBoxItem) {
                    var kendoHeaderComboBox = KretaComboBoxHelper.getKendoComboBoxData(headerComboBoxFullName);
                    kendoHeaderComboBox.value("");
                } else {
                    $.each(dataSource, function (index, value) {
                        var comboBoxFullName = gridName + "_" + comboBoxName + "_" + value.ID;
                        var hasComboBoxItem = CommonUtils.checkKendoComboBoxHasItemByValue(comboBoxFullName, headerValue);
                        if (hasComboBoxItem) {
                            value.dirty = true;
                            var kendoComboBox = KretaComboBoxHelper.getKendoComboBoxData(comboBoxFullName);
                            kendoComboBox.value(headerValue);
                        }
                    });
                }
            });
        }

        pedagogusIKTAdatszolgaltatasHelper.savePedagogusIKTAdatszolgaltatas = function () {
            var form = $("#" + formName);
            if (form.valid()) {
                var model = getPedagogusIKTAdatszolgaltatasRogzitesModel();

                setTimeout(AjaxHelper.ShowIndicator(), 1);
                setTimeout(AjaxHelper.DoValidationPost(url.SavePedagogusIKTAdatszolgaltatas, formName, model, savePedagogusIKTAdatszolgaltatasResponseOk), 2);
            }
        }

        pedagogusIKTAdatszolgaltatasHelper.cancelPedagogusIKTAdatszolgaltatas = function () {
            location.reload(true);
        }

        function savePedagogusIKTAdatszolgaltatasResponseOk() {
            KretaWindowHelper.feedbackWindow("@(CommonResource.Siker)", "@(CommonResource.AMentesSikeresenMegtortent)", false);
        }

        function getPedagogusIKTAdatszolgaltatasRogzitesModel() {
            var model = {};

            var formData = $("#" + formName).toObject();

            model.ENaploHasznalat = formData.ENaploHasznalat;
            model.ProjektorokSzama = formData.ProjektorokSzama;
            model.MukodoProjektorokSzama = formData.MukodoProjektorokSzama;
            model.TermekSzama = formData.TermekSzama;
            model.WifiLefedettTermekSzama = formData.WifiLefedettTermekSzama;
            model.WifiEleres = formData.WifiEleres;

            model.PedagogusIKTKompetenciaList = [];

            var modifiedRows = KretaGridHelper.getModifiedRows(gridName);

            $.each(modifiedRows, function () {
                if (this.ID !== "0") {
                    var item = {
                        "TanarId": this.ID,
                        "TanarNev": this.TanarNev,
                        "IKTKompetenciaSzint": this.ki_IKTKompetenciaSzint,
                        "IKTEszkozhasznalatModja": this.ki_IKTEszkozhasznalatModja,
                        "ElsodlegesIKTEszkoz": this.ki_ElsodlegesIKTEszkoz
                    };
                    model.PedagogusIKTKompetenciaList.push(item);
                }
            });

            return model;
        }

        return pedagogusIKTAdatszolgaltatasHelper;
    })();

    $(document).ready(function () {
        if ($("#WifiEleres2").is(':checked')) {
            $("#rowTermekSzama").attr("style", "display: block;");
            $("#rowTermekSzamaGeneralt").attr("style", "display: block;");
        }
        else {
            $("#rowTermekSzama").attr("style", "display: none;");
            $("#rowTermekSzamaGeneralt").attr("style", "display: none;");
        }
    });

    $("#WifiEleres1").on('click', (function () {
        this.checked = true;
        $("#rowTermekSzama").attr("style", "display: none;");
        $("#rowTermekSzamaGeneralt").attr("style", "display: none;");
    }));
    $("#WifiEleres2").on('click', (function () {
        this.checked = true;
        $("#rowTermekSzama").attr("style", "display: block;");
        $("#rowTermekSzamaGeneralt").attr("style", "display: block;");
    }));
    $("#WifiEleres3").on('click', (function () {
        this.checked = true;
        $("#rowTermekSzama").attr("style", "display: none;");
        $("#rowTermekSzamaGeneralt").attr("style", "display: none;");
    }));
</script>

<div>
    @(grid)
</div>

<div class="container-fluid">
    <div class="row">
        @Html.KretaSaveButton("SavePedagogusIKTAdatszolgaltatasLower", "PedagogusIKTAdatszolgaltatasHelper.savePedagogusIKTAdatszolgaltatas")
        @Html.KretaButton("CancelPedagogusIKTAdatszolgaltatasLower", CommonResource.Megse, clickEventName: "PedagogusIKTAdatszolgaltatasHelper.cancelPedagogusIKTAdatszolgaltatas")
    </div>
</div>