@using Resources
@model Qcarbon.ViewModels.DTO.RiskMaterialListViewModel

<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>

            @*header content layout provide the general function like mouse over and background image*@
            <div class="header_image_button" title="@Resource.StaticLabelAddNew"
                 style="background-image: url('../../Browser_Local/img/header_image1_1.png');">
            </div>
            @if (Model.selectedModel != null)
            {
                <div class="header_image_button" title="@Resource.StaticLabelGlobal_Edit"
                     style="background-image: url('../../Browser_Local/img/header_image4_1.png');">
                </div>
                <div class="header_image_button" title="@Resource.StaticLabelGlobal_Delete"
                     style="background-image: url('../../Browser_Local/img/header_image6_1.png');">
                </div>
            }
            @*<div class="header_image_button" title="@Resource.StaticLabelExportBOM"
                 style="background-image: url('../../Browser_Local/img/header_image8_1.png');">
            </div>
            <div class="header_image_button" title="@Resource.StaticLabelImprotBOM"
                 style="background-image: url('../../Browser_Local/img/header_image9_1.png');">
            </div>
            <div 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" ng-model="currentPage" ng-init="currentPage = 1">
        <div class="table_overflow">
            <table class="table">
                <thead>
                    <tr class="table-active">
                        <th>@Resource.MaterialNo</th>
                        <th>@Resource.RAMC3EMaterialSpec</th>
                        <th>@Resource.RAMC3EMaterialActivityUnit</th>
                        <th>@Resource.RAMC3EMaterialPCS</th>
                        <th>@Resource.RAMC3EMaterialScalar (@Resource.KgCO2e)</th>
                        <th>@Resource.RAMC3EMaterialActivity</th>
                        <th>@Resource.RAMC3EMaterialQty (@Resource.KgCO2e)</th>
                        <th>DQI</th>
                    </tr>
                </thead>
                <tbody ng-mouseleave="setHoverColumnRow(-1, -1, -1)">
                    @if (Model.modelList == null || Model.modelList.Count <= 0)
                    {
                        <tr style="border-bottom: solid 1px rgb(214, 214, 214);">
                            <td ng-show="model.length == 0">
                                @Resource.NoData
                            </td>
                        </tr>
                    }
                    else
                    {
                        foreach (var rec in Model.modelList)
                        {
                            <tr class="survey_order_table_row"
                                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 ng-bind="row.KgCO2e">@rec.KgCO2e</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>