@using Resources
@model Qcarbon.ViewModels.DTO.RiskMaterialListViewModel
@{
    ViewBag.Title = "Index";
    Layout = "~/Areas/Lca/Views/Shared/_LcaRiskLayout.cshtml";
    ViewBag.selected = "";
}

<div select-row lca-detail>
    @* header *@
    @* header's button style is controlled by header-content-layout, the business logic(ng-show) is controlled here *@
    <div class="body_content container" style="margin-top: 10px;">
        <div header-content-layout>
            @using (Html.BeginForm())
            {
                @Html.AntiForgeryToken()
                @Html.HiddenFor(x => x.cmd, new { @id = "cmd" })
                @Html.HiddenFor(x=>x.selectedID, new {@id="selectedID"})
                <div>
                    @Html.ValidationSummary(true)
                </div>
                @*header content layout provide the general function like mouse over and background image*@
                <div id="btnAdd" class="header_image_button" title="@Resource.StaticLabelAddNew"
                     style="background-image: url('@ViewBag.baseUrl/Browser_Local/img/header_image1_1.png');">
                </div>
                if (!string.IsNullOrWhiteSpace( Model.selectedID) || Model.selectedModel != null)
                {
                    <div id="btnEdit" class="header_image_button" title="@Resource.StaticLabelGlobal_Edit"
                         style="background-image: url('@ViewBag.baseUrl/Browser_Local/img/header_image4_1.png');">
                    </div>
                    <div id="btnDelete" class="header_image_button" title="@Resource.StaticLabelGlobal_Delete"
                         style="background-image: url('@ViewBag.baseUrl/Browser_Local/img/header_image6_1.png');">
                    </div>
                }
                @*<div id="btnExport" class="header_image_button" title="@Resource.StaticLabelExportBOM"
                     style="background-image: url('../../Browser_Local/img/header_image8_1.png');">
                </div>
                <div id="btnImport" class="header_image_button" title="@Resource.StaticLabelImprotBOM"
                     style="background-image: url('../../Browser_Local/img/header_image9_1.png');">
                </div>
                <div id="btnReference" class="header_image_button" title="@Resource.StaticLabelReferenceData"
                     style="background-image: url('../../Browser_Local/img/header_image17_1.png');">
                </div>
                <div class="header_image_button" title="@Resource.StaticLabelGlobal_Search"
                     style="background-image: url('../../Browser_Local/img/header_image11_1.png');">
                </div>
                <div class="header_search" ng-show="!Table_Edit_State">
                    <input type="text" class="transition" ng-model="searchText" ng-class="{ expand: search_box }" />
                </div>*@
            }
        </div>
    </div>
    @* end of header *@

    @* the body of index *@
    <div class="body_content">
        <div class="table_overflow">
            <table class="table">
                <thead>
                    <tr class="table-active">
                        <th style="text-align:center">@Resource.MaterialNo</th>
                        <th style="text-align:center">@Resource.RAMC3EMaterialSpec (kg)</th>
                        <th style="text-align:center">@Resource.RAMC3EMaterialActivityUnit</th>
                        <th style="text-align:center">@Resource.RAMC3EMaterialPCS</th>
                        <th style="text-align:center">@Resource.RAMC3EMaterialScalar (@Resource.KgCO2e)</th>
                        <th style="text-align:center">@Resource.RAMC3EMaterialActivity</th>
                        <th style="text-align:center">@Resource.RAMC3EMaterialQty (@Resource.KgCO2e)</th>
                        @*<th style="text-align:center">DQI</th>*@
                    </tr>
                </thead>
                <tbody>
                    @if (Model.modelList == null || Model.modelList.Count <= 0)
                    {
                        <tr style="border-bottom: solid 1px rgb(214, 214, 214);">
                            <td>
                                @Resource.NoData
                            </td>
                        </tr>
                    }
                    else
                    {
                        foreach (var rec in Model.modelList)
                        {
                            if (rec.MaterialNo == Model.selectedID)
                            {
                                ViewBag.selected = "selected";
                            }
                            else
                            {
                                ViewBag.selected = "";
                            }
                            <tr class="survey_order_table_row @ViewBag.selected" id="@rec.MaterialNo"
                                @*ng-class="{ selected: row == selectRow.getSelected() }"
                                ng-click="selectRow.select(row)"
                                ng-dblclick="editProcess(row)"
                                ng-repeat="row in model | filter: searchText | smarterLimitTo : 10 : (currentPage - 1) * 10"*@
                                >
                                <td style="text-align:center">@rec.MaterialNo</td>
                                <td style="text-align:right">@rec.MaterialSpec.ToString("F04")</td>
                                <td style="text-align:center">@rec.Unit</td>
                                <td style="text-align:right">@rec.AnnualPurchaseAmount</td>
                                <td style="text-align:right">@rec.KgCO2e.ToString("F10")</td>
                                <td style="text-align:right">@rec.ActivityIntensity.ToString("F04")</td>
                                <td style="text-align:right">@rec.Emission.ToString("F04")</td>
                                @*<td></td>*@
                            </tr>
                        }
                    }
                </tbody>
            </table>
        </div>
        @* end of the body of index *@

        @*<page passed-total-page="Math.ceil(model.length / 10)" passed-current-page="currentPage"></page>*@

    </div>
</div>

<script>
    $(document).on("click", ".header_image_button", function () {
        var clickId = $(this).attr('id');
        console.log('clicked id', clickId);
        $('#cmd').val(clickId);
        $('form').submit();
    });
    $(document).on("click", ".survey_order_table_row", function () {
        var clickId = $(this).attr('id');
        console.log('clicked id', clickId);
        $('#cmd').val('選取');
        $('#selectedID').val(clickId);
        $('form').submit();
    });
    //$('#btnAdd').click(function () {
    //    console.log('btnAdd clicked');
    //    $("#addModel").show();
    //});
</script>