@model PantheonRA.BackOffice.Models.SubjectCreateViewModel
@using PantheonRA.BackOffice.Enums
<div class="wrapper wrapper-content" id="ePayment">
    <div class="tabs-container">
        @Html.Hidden("UrlSaveEparam", Url.Action("SaveECommerce", "Subjects"))
        @Html.Hidden("UrlDeleteEparam", Url.Action("DeleteECommerce", "Subjects"))
        @Html.Hidden("UrlSaveWebShop", Url.Action("SaveWebShop", "Subjects"))
        @Html.Hidden("UrlDeleteWebShop", Url.Action("DeleteWebShop", "Subjects"))
        @Html.Hidden("UrlGetPAStoredProc", Url.Action("GetEpData", "Subjects"))
        @Html.Hidden("UrlGetPoslDog", Url.Action("GetPoslDog", "Subjects"))
        @Html.Hidden("UrlGetMailboxParams", Url.Action("GetMailboxParams", "Subjects"))
        @Html.Hidden("UrlGetDropDownValues", @Url.Action("GetDropDownValues", "GlobalHelper"))
        @Html.Hidden("TxtConfirm", Loc.Confirm)
        @Html.Hidden("TxtDeleteQuestion", Loc.DeleteQuestionRecord)
        @Html.Hidden("TxtCancel", Loc.Cancel)
        @Html.Hidden("TxtConfirmation", Loc.Confirmation)
        @Html.Hidden("TxtDelNotPossible", Loc.DeleteEntryTypeNotPossible)
        @Html.Hidden("TxtInputFields", Loc.FieldIsRequired)
        @Html.Hidden("TxtAlreadyExists", Loc.AlreadyExists)
        @Html.Hidden("PrimaryKeyExists", Loc.PrimaryKeyExists)
        @Html.Hidden("SubjectId", Model.SubjectId)
        @Html.Hidden("PageUrl", Url.Action("Edit", "Subjects"))
        @Html.Hidden("EPMailboxTypeC", EPMailboxParams.MailboxTypeC)

        <div class="tab-content set-wh-content">

            <div class="tab-content">
                <div class="row">
                    <div class="col-lg-6 col-md-12 col-sm-12  padding-top-10 column-full-height-border-right">
                        <div class="row padding-top-10">
                            <!-- eStoritve -->
                            <div class="col-md-12 padding-top-10">
                                <h4 class="padding-top-10">@Loc.SubjectEPaymentParams</h4>
                                <table id="tblEparams" class="table table-bordered setwh-table subjects-table" role="grid" style="table-layout:fixed; width:100%">
                                    <thead>
                                        <tr>
                                            <th style="width: 25%">@Loc.DocType</th>
                                            <th style="width: 20%">@Loc.Type</th>
                                            <th style="width: 30%">@Loc.Mailbox</th>
                                            <th style="width: 20%">@Loc.Data</th>
                                            <th style="width: 5%"></th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                        <tr id="tr-ep">
                                            <!-- DocType -->
                                            <td style="width: 25%; padding: 5px">
                                                <select id="input-ep-doctype"
                                                        data-placeholder="@Loc.DocType"
                                                        class="form-control select2withAPI"
                                                        data-search-width="450"
                                                        data-url=@Url.Action("GetPoslDog", "Subjects")>
                                                </select>
                                            </td>
                                            <!-- Type -->
                                            <td style="width: 20%; padding: 5px">
                                                <select id="input-ep-type"
                                                        data-placeholder="@Loc.Type"
                                                        class="form-control select2withAPI"
                                                        data-search-width="450"
                                                        onchange="changeType(this.id, 0);"
                                                        data-url=@Url.Action("GetMailboxParams", "Subjects")>
                                                </select>
                                            </td>
                                            <!-- Mailbox -->
                                            <td style="width: 30%; padding: 5px">
                                                <select id="input-ep-mailbox"
                                                        data-placeholder="@Loc.Mailbox"
                                                        class="form-control select2withAPI"
                                                        data-column-names="@Loc.Name, @Loc.Subject"
                                                        data-search-width="450"
                                                        data-bootstrap-columns="col-md-6, col-md-6"
                                                        data-url=@Url.Action("GetDropDownValues", "GlobalHelper", new { apiPath = "/v1/ecommerce-params/mailbox" })>
                                                </select>
                                            </td>
                                            <!-- Data -->
                                            <td style="width: 20%; padding: 5px">
                                                <input id="input-ep-data-input"
                                                       type="hidden"
                                                       data-placeholder="@Loc.Data"
                                                       class="form-control"
                                                       data-search-width="450"
                                                       data-bootstrap-columns="col-md-12" />
                                                <select id="input-ep-data"
                                                        data-placeholder="@Loc.Data"
                                                        class="form-control select2withAPI"
                                                        data-search-width="450"
                                                        data-bootstrap-columns="col-md-12"
                                                        data-url=@Url.Action("GetEpData", "Subjects")>
                                                </select>
                                            </td>
                                            <!-- Action -->
                                            <td style="width: 5%; padding: 5px" class="td-action">
                                                <p style="width: 100%; padding: 0px; padding-top: 11px; padding-bottom: 11px;" class="btn btn btn-success" onclick="saveEparam(0)">
                                                    <span class="far fa-plus cursor-pointer" aria-hidden="true"></span>
                                                </p>
                                            </td>
                                        </tr>
                                        @foreach (var item in Model.ECommerceParams)
                                        {
                                            <tr id="tr-ep-@item.AnQid">
                                                <!-- DocType -->
                                                <td style="width: 25%; padding: 5px">
                                                    <select id="input-ep-doctype-@item.AnQid"
                                                            data-placeholder="@Loc.DocType"
                                                            class="form-control select2withAPI"
                                                            data-search-width="450"
                                                            onchange="saveEparam(@item.AnQid)"
                                                            data-url=@Url.Action("GetPoslDog", "Subjects")>
                                                        <option value="@item.DocType" selected>@item.DocTypeText</option>
                                                    </select>
                                                </td>
                                                <!-- Type -->
                                                <td style="width: 20%; padding: 5px">
                                                    <select id="input-ep-type-@item.AnQid"
                                                            data-placeholder="@Loc.Type"
                                                            class="form-control select2withAPI"
                                                            data-search-width="450"
                                                            onchange="changeType(this.id, @item.AnQid); saveEparam(@item.AnQid)"
                                                            data-url=@Url.Action("GetMailboxParams", "Subjects")>
                                                        <option value="@item.Type" selected>@item.TypeText</option>
                                                    </select>
                                                </td>
                                                <!-- Mailbox -->
                                                <td style="width: 30%; padding: 5px">
                                                    <select id="input-ep-mailbox-@item.AnQid"
                                                            data-placeholder="@Loc.Mailbox"
                                                            class="form-control select2withAPI"
                                                            data-column-names="@Loc.Name, @Loc.Subject"
                                                            data-bootstrap-columns="col-md-6, col-md-6"
                                                            data-search-width="450"
                                                            onchange="saveEparam(@item.AnQid)"
                                                            data-url=@Url.Action("GetDropDownValues", "GlobalHelper", new { apiPath = "/v1/ecommerce-params/mailbox" })>
                                                        <option value="@item.MailboxQid" selected>@item.MailboxText</option>
                                                    </select>
                                                </td>
                                                <!-- Data -->
                                                <td style="width: 20%; padding: 5px">
                                                    @if (item.Type.Equals(EPMailboxParams.MailboxTypeC))
                                                    {
                                                        <input id="input-ep-data-@item.AnQid"
                                                               type="text"
                                                               data-placeholder="@Loc.Data"
                                                               class="form-control"
                                                               data-search-width="450"
                                                               data-bootstrap-columns="col-md-12"
                                                               onblur="saveEparam(@item.AnQid)"
                                                               value="@item.Data" />
                                                        <select data-placeholder="@Loc.Data"
                                                                class="form-control select2withAPI input-ep-data-hidden-select"
                                                                data-search-width="550"
                                                                onchange="saveEparam(@item.AnQid)"
                                                                data-url=@Url.Action("GetEpData", "Subjects", new { epType = item.Type })>
                                                            <option value="@item.Data" selected>@item.DataText</option>
                                                        </select>
                                                    }
                                                    else
                                                    {
                                                        <input id="input-ep-data-input-@item.AnQid"
                                                               type="hidden"
                                                               data-placeholder="@Loc.Data"
                                                               class="form-control"
                                                               data-search-width="450"
                                                               data-bootstrap-columns="col-md-12"
                                                               onblur="saveEparam(@item.AnQid)" />
                                                        <select id="input-ep-data-@item.AnQid"
                                                                data-placeholder="@Loc.Data"
                                                                class="form-control select2withAPI"
                                                                data-search-width="550"
                                                                onchange="saveEparam(@item.AnQid)"
                                                                data-url=@Url.Action("GetEpData", "Subjects", new { epType = item.Type })>
                                                            <option value="@item.Data" selected>@item.DataText</option>
                                                        </select>
                                                    }

                                                </td>
                                                <!-- Action -->
                                                <td style="width: 5%; padding: 5px" class="td-action">
                                                    <p class="text-center" style="margin-top: 8px !important">
                                                        <span onclick="deleteEparam(@item.AnQid)" class="far fa-trash-alt cursor-pointer" aria-hidden="true"></span>
                                                    </p>
                                                </td>
                                            </tr>
                                        }
                                    </tbody>
                                </table>
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-6 col-md-12 col-sm-12 padding-top-10">
                        <div class="row padding-top-10">
                            <!-- Spletne trgovine -->
                            <div class="col-md-12 padding-top-10">
                                <h4 class="padding-top-10">@Loc.SubjectWebShops</h4>
                                <table id="tblWebShop" class="table table-bordered setwh-table subjects-table" role="grid" style="table-layout:fixed; width:100%">
                                    <thead>
                                        <tr>
                                            <th style="width: 25%">@Loc.Name</th>
                                            <th style="width: 35%">@Loc.Description</th>
                                            <th style="width: 35%">@Loc.Mailbox</th>
                                            <th style="width: 5%"></th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                        <tr id="tr-ws">
                                            <!-- Name -->
                                            <td style="width: 25%; padding: 5px">
                                                <input type="text" id="input-ws-name"
                                                       class="form-control" placeholder="@Loc.Name" autocomplete="off" />
                                            </td>
                                            <!-- Description -->
                                            <td style="width: 35%; padding: 5px">
                                                <input type="text" id="input-ws-description"
                                                       class="form-control" placeholder="@Loc.Description" autocomplete="off" />
                                            </td>
                                            <!-- Mailbox -->
                                            <td style="width: 35%; padding: 5px">
                                                <select id="input-ws-mailbox"
                                                        data-placeholder="@Loc.Mailbox"
                                                        class="form-control select2withAPI"
                                                        data-column-names="@Loc.Name, @Loc.Subject"
                                                        data-bootstrap-columns="col-md-6, col-md-6"
                                                        data-search-width="450"
                                                        data-url=@Url.Action("GetDropDownValues", "GlobalHelper", new { apiPath = "/v1/ecommerce-params/mailbox" })>
                                                </select>
                                            </td>
                                            <!-- Action -->
                                            <td style="width: 5%; padding: 5px" class="td-action">
                                                <p class="btn btn btn-success" style="width: 100%; padding: 0px; padding-top: 11px; padding-bottom: 11px;" onclick="saveWebshop(0)">
                                                    <span class="far fa-plus cursor-pointer" aria-hidden="true"></span>
                                                </p>
                                            </td>
                                        </tr>
                                        @foreach (var item in Model.ECommerceWebShops)
                                        {
                                            <tr id="tr-ws-@item.AnQid">
                                                <!-- Name -->
                                                <td style="width: 25%; padding: 5px">
                                                    <input type="text" id="input-ws-name-@item.AnQid" style="outline: none !important"
                                                           class="form-control" placeholder="@Loc.Name" value="@item.Name" autocomplete="off" />
                                                </td>
                                                <!-- Description -->
                                                <td style="width: 35%; padding: 5px">
                                                    <input type="text" id="input-ws-description-@item.AnQid"
                                                           class="form-control" placeholder="@Loc.Description" value="@item.Description" autocomplete="off" />
                                                </td>
                                                <!-- Mailbox -->
                                                <td style="width: 35%; padding: 5px">
                                                    <select id="input-ws-mailbox-@item.AnQid"
                                                            data-placeholder="@Loc.Mailbox"
                                                            class="form-control select2withAPI"
                                                            data-column-names="@Loc.Name, @Loc.Subject"
                                                            data-bootstrap-columns="col-md-6, col-md-6"
                                                            data-search-width="450"
                                                            onchange="saveWebshop(@item.AnQid)"
                                                            data-url=@Url.Action("GetDropDownValues", "GlobalHelper", new { apiPath = "/v1/ecommerce-params/mailbox" })>
                                                        <option value="@item.MailboxQid" selected>@item.MailboxText</option>
                                                    </select>
                                                </td>
                                                <!-- Action -->
                                                <td style="width: 5%; padding: 5px" class="td-action">
                                                    <p class="text-center" style="margin-top: 8px !important;">
                                                        <span onclick="deleteWebshop(@item.AnQid)" class="far fa-trash-alt cursor-pointer" aria-hidden="true"></span>
                                                    </p>
                                                </td>
                                            </tr>
                                        }
                                    </tbody>
                                </table>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

@section pageScripts{
    @* TODO: remove after refactor *@
    @Scripts.Render("~/bundles/validation")
    <script src="~/Scripts/global-script.js"></script>
}
<script src="~/Scripts/custom/products/subjectEPayments.js"></script>