Mr.Combet Webshell 🔥

View File Name : ActivityDisaggregatedReport.cshtml

@{
    int page = 1;
    if (Request.QueryString["page"] != null)
    {
        page = Convert.ToInt32(Request.QueryString["page"].ToString());
    }
}
<style>
    .ibox-content {
        margin-bottom: 0px;
    }
</style>
@* Filter section *@
<div class="wrapper wrapper-content animated fadeInRight" style="padding:0px">
    <div class="row wrapper border-bottom white-bg page-heading">
        <div class="col-md-12">
            <ol class="breadcrumb">
                <li class="active">
                    <strong>Activity Disaggregated Report </strong>
                </li>
            </ol>

        </div>
    </div>
    <br/>
    <div class="row">
        <div class="filter col-lg-12">
            <div class="ibox float-e-margins">
                <div class="ibox-content">
                    <div class="row">
                        <div class="form-group col-md-3" style="z-index:9999">
                            <label>Fiscal Year</label>
                            @Html.ListBox("FiscalYearId", null, new { @multiple = "multiple", @style = "display:none", @class = "form-control" })
                            @*<select class="form-control required" name="FiscalYearId" id="FiscalYearId" data-api="/fiscal_year_unlocked/select"></select>*@
                        </div>
                        <div class="form-group col-md-3" style="z-index:9999">
                            <label>Component</label>
                            @Html.ListBox("ComponentId", null, new { @multiple = "multiple", @style = "display:none", @class = "form-control" })
                            @*<select class="form-control required clear" id="ComponentId" name="ComponentId" data-api="/component/select"></select>*@
                        </div>
                        <div class="form-group col-md-3" style="z-index:9999">
                            <label>Sub Component</label>
                            @Html.ListBox("SubComponentId", null, new { @multiple = "multiple", @style = "display:none", @class = "form-control" })
                            @*<select class="form-control required clear" id="SubComponentId" name="SubComponentId" data-api="/sub-component/select" disabled=""></select>*@
                        </div>
                        <div class="form-group col-md-3">
                            <label><strong>Province</strong></label>
                            @Html.ListBox("ProvinceId", null, new { @multiple = "multiple", @style = "display:none", @class = "form-control" })
                        </div>
                    </div>
                    <div class="row">
                        <div class="form-group  col-md-3">
                            <label><strong>Commodity</strong></label>
                            @Html.ListBox("CommodityId", null, new { @multiple = "multiple", @style = "display:none", @class = "form-control" })
                        </div>
                    </div>


                        <div class="row">

                            <div class="form-group col-md-offset-10">
                                <button type="button" id="filter" name="filter" class="btn btn-primary center-orientation">Search&nbsp;<i class="fa fa-search" aria-hidden="true"></i></button>
                                <button type="button" id="clear" name="clear" class="btn btn-primary center-orientation">Reset&nbsp;<i class="fa fa-refresh" aria-hidden="true"></i></button>
                            </div>
                        </div>
                    </div>
                </div>
        </div>
    </div>
</div>
<br />
<br />
<br />
<br />
@* End of filter section *@
<div class="wrapper wrapper-content animated fadeInRight">

    <div class="row">
        <div class="col-lg-12">
            <div class="ibox-content">
                <div id="loadPartialView"></div>
                <div class="row">
                    <div class="pull-right">
                        <a href="/activityreporting/reporting" class="btn btn-default btn-sm">Back</a>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<script src="~/Scripts/app/bootstrap-multiselect.js"></script>
<script>
    $('#FiscalYearId').multiselect({
        includeSelectAllOption: true, buttonWidth: "100%", search: true, enableFiltering: true,
        enableCaseInsensitiveFiltering: true, maxHeight: 300, buttonWidth: '100%', width: 420
    });


    $('#ComponentId').multiselect({
        includeSelectAllOption: true, buttonWidth: "100%", search: true, enableFiltering: true,
        enableCaseInsensitiveFiltering: true, maxHeight: 300, buttonWidth: '100%', width: 420
    });

    $('#SubComponentId').multiselect({
        includeSelectAllOption: true, buttonWidth: "100%", search: true, enableFiltering: true,
        enableCaseInsensitiveFiltering: true, maxHeight: 300, buttonWidth: '100%', width: 420
    });

    $('#ProvinceId').multiselect({
        includeSelectAllOption: true, buttonWidth: "100%", search: true, enableFiltering: true,
        enableCaseInsensitiveFiltering: true, maxHeight: 300, buttonWidth: '100%', width: 420
    });

    $('#CommodityId').multiselect({
        includeSelectAllOption: true, buttonWidth: "100%", search: true, enableFiltering: true,
        enableCaseInsensitiveFiltering: true, maxHeight: 300, buttonWidth: '100%', width: 420
    });


    $('.multiselect').css('max-width', '455px');
    $('.multiselect').css('overflow', 'hidden');

    function getFiscalIds() {
        var a = Array.from(document.getElementById("FiscalYearId").options).filter(option => option.selected).map(option => option.value);
        console.log(a);
        return a;
    }
    function getcommodityIds() {
        var a = Array.from(document.getElementById("CommodityId").options).filter(option => option.selected).map(option => option.value);
        console.log(a);
        return a;
    }
    function getprovinceIds() {
        var a = Array.from(document.getElementById("ProvinceId").options).filter(option => option.selected).map(option => option.value);
        console.log(a);
        return a;
    }
    function getComponentIds() {
        var a = Array.from(document.getElementById("ComponentId").options).filter(option => option.selected).map(option => option.value);
        console.log(a);
        return a;
    }
    function getSubComponentIds() {
        var a = Array.from(document.getElementById("SubComponentId").options).filter(option => option.selected).map(option => option.value);
        console.log(a);
        return a;
    }
    $(document).ready(function () {
        window.initializeSelectApis();
        window.initializeCascadeComponent();
        loadData();
    });
        $('#filter').off("click").on("click", function () {
        WorkForce.loader.show();
        loadData();
    })
    $('#clear').off("click").on("click", function () {
        $("#ComponentId").val("");
        $("#SubComponentId").val("");
        $("#FiscalYearId").val("");
        $("#ProvinceId").val("");
        $("#CommodityId").val("");
        loadData();
    })
    function loadData() {
        $('#loadPartialView').load("/activities/report/disaggregated/list",JSON.parse(getSearchModel()),
            function (response, status, xhr) {

                if (status == "error") {
                    var msg = "Sorry but there was an error: ";
                    ShowMessage("error", "error", msg + xhr.status + " " + xhr.statusText);
                };
                WorkForce.loader.hide();
            });
    }
     function getSearchModel() {
         var ActivityFilterVM = {
             componentId: $('#ComponentId').val(),
             subComponentId: $('#SubComponentId').val(),
             fiscalyearId: $("#FiscalYearId").val(),
             provinceId: $("#ProvinceId").val(),
             commodityId: $("#CommodityId").val(),
             fiscalyearIds: getFiscalIds(),
             componentIds: getComponentIds(),
             subComponentIds: getSubComponentIds(),
             provinceIds: getprovinceIds(),
             commodityIds: getcommodityIds(),

             page:@page
        };
        var model = JSON.stringify(ActivityFilterVM);
        return model;
    };
</script>


<style>
    .dropdown-menu > li > a {
        line-height: 4px;
    }

    ul.multiselect-container.dropdown-menu {
        height: 170px;
    }
</style>