@model Guid
@using EnVisage.Code
@using Microsoft.AspNet.Identity
<div id="controller-team-board">
    <form id="simpleModeForm" name="simpleModeForm">
        <div class="row">
            <div class="col-sm-12 col-md-5 col-lg-3">
                <div class="form-group no-margin-hr">
                    <label class="control-label">Expenditure Category</label>
                    <select id="capacityExpCat" class="form-control" name="capacityExpCat" data-capacity-planning="filterCategories" data-key="expCategory" data-val="true" data-val-required="Required"></select>
                </div>
            </div>
            <div class="col-sm-12 col-md-7 col-lg-4">
                <div class="row">
                    <div class="col-xs-8">
                        <div class="form-group no-margin-hr">
                            <label class="control-label">Start<span class="enddatespan">/End</span> Date</label>
                            <div class="input-daterange input-group" data-capacity-planning="filterDates">
                                @{
                                    var startDate = DateTime.Today.AddMonths(1).AddDays(1 - DateTime.Today.Day);
                                    var endDate = startDate.AddYears(1).AddDays(-1);
                                }
                                <input class="form-control" data-capacity-planning="filterStartDate" name="capacityStartDate" type="text" value="@(startDate.ToShortDateString())" data-val="true" data-val-required="Required">
                                <span class="field-validation-valid" data-valmsg-for="capacityStartDate" data-valmsg-replace="true"></span>
                                <span class="input-group-addon enddate">to</span>
                                <input class="form-control enddate" data-capacity-planning="filterEndDate" name="capacityEndDate" type="text" value="@(endDate.ToShortDateString())" data-val="true" data-val-required="Required">
                                <span class="field-validation-valid" data-valmsg-for="capacityEndDate" data-valmsg-replace="true"></span>
                            </div>
                        </div>
                    </div>
                    <div class="col-xs-4">
                        <div class="form-group no-margin-hr">
                            <label class="control-label">&nbsp;</label><br />
                            <input type="checkbox" name="permanent" data-capacity-planning="filterIsPermanent" />&nbsp;Permanent
                        </div>
                    </div>
                </div>
            </div>
            <div class="col-xs-2 col-lg-1">
                <div class="form-group no-margin-hr">
                    <label class="control-label" title="Number of Resources">Resources</label>
                    <input id="capacityAmount" data-capacity-planning="filterAmount" name="capacityAmount" class="form-control" data-val="true" data-val-required="Required" data-val-number="Should be a number"
                           data-val-range="Should be between 1 and 100." data-val-range-max="100" data-val-range-min="1" data-val-integer="Should be an integer" value="1" />
                    <span class="field-validation-valid" data-valmsg-for="capacityAmount" data-valmsg-replace="true"></span>
                </div>
            </div>
            <div class="col-xs-10 col-lg-4">
                <div class="form-group no-margin-hr">
                    <label class="control-label">&nbsp;</label><br />
                    <a class="btn btn-success" data-capacity-planning="filterIncreaseCapacity" title="Increase Capacity"><i class="fa fa-arrow-up"></i></a>
                    <a class="btn btn-info" data-capacity-planning="filterDecreaseCapacity" title="Decrease Capacity"><i class="fa fa-arrow-down "></i></a>
                    <a class="btn btn-warning" data-capacity-planning="filterResetCapacity" title="Reset Capacity"><i class="fa fa-undo"></i></a>&nbsp;
                    <a class="btn btn-danger" data-capacity-planning="filterResetEntireCapacity" title="Reset All Categories">Reset All</a>
                </div>
            </div>
        </div>
    </form>
    <div class="row">
        <div class="col-sm-12">
            <table data-capacity-planning="dataTable" class="table table-striped table-bordered dataTable-tight"></table>
        </div>
    </div>
    <form id="fillCapacityDecreaseForm" name="fillCapacityDecreaseForm">
        <div id="fillCapacityDecreaseModal" class="modal fade" tabindex="-1" role="dialog" style="display: none;" data-backdrop="static">
            <div class="modal-dialog">
                <div class="modal-content">
                    <div class="modal-header">
                        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
                        <h4 class="modal-title">Fill Capacity Decrease</h4>
                    </div>
                    <div class="modal-body">
                        <p>
                            Please select the resource to fill decrease in Planned Capacity.
                            <br />
                            The resource will be set an End Date of <span id="fillCapacityDecreaseEndDate"></span>
                        </p>
                        <div class="alert" id="dvNoResourcesWarning">
                            There are no resources to fill decrease in Planned Capacity with given date - resources should be active and start at least one week before fill decrease date.
                        </div>
                        <select id="fillCapacityDecreaseResourceId" class="form-control" name="fillCapacityDecreaseResourceId" data-val="true" data-val-required="Please select a resource to fill capacity decrease"></select>
                        <span class="field-validation-valid" data-valmsg-for="fillCapacityDecreaseResourceId" data-valmsg-replace="true"></span>
                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                        <button type="button" class="btn btn-primary" data-capacity-planning="formDecreaseSubmitBtn">Fill Decrease</button>
                    </div>
                </div>
            </div>
        </div>
    </form>
    <!-- / .panel-body -->
</div>