EnVisageOnline/Main-RMO/Source/EnVisage/Views/Shared/EditorTemplates/SlidersGroupModel.cshtml

81 lines
3.4 KiB
Plaintext

@using System.Web.Mvc.Html
@using EnVisage.Code
@using EnVisage.Models
@using EnVisage.Code.HtmlHelpers
@model EnVisage.Models.SlidersGroupModel
@{
// need to init angular header controller
var json = Newtonsoft.Json.JsonConvert.SerializeObject(new
{
slidersData = Model.Sliders,
groupId = Model.GroupDisplayId,
availableToAddItems = Model.Options
});
var sliderClientId = Html.IdFor(t => t.Sliders).ToHtmlString().Replace("_", ".");
}
<script type="text/javascript">
$(function () {
$("#addItems_@(Model.GroupDisplayId)").select2({
placeholder: "Select teams",
});
});
</script>
<div class="col-sm-12" id="slidersGroupContainer_@(Model.GroupDisplayId)" data-slider-group="sliderGroup_@(Model.GroupDisplayId)" ng-controller="slidersGroupController" ng-init="init(@json)" ng-cloak>
@Html.HiddenFor(x => x.GroupId)
<div ng-repeat="item in arrSliders track by $index">
<input type="hidden" name="@(sliderClientId)[{{$index}}].Id" ng-value="item.Id" />
<input type="hidden" name="@(sliderClientId)[{{$index}}].EntityId" ng-value="item.EntityId" />
<input type="hidden" name="@(sliderClientId)[{{$index}}].ParentId" ng-value="item.ParentId" />
<input type="hidden" name="@(sliderClientId)[{{$index}}].Name" ng-value="item.Name" />
<input type="hidden" name="@(sliderClientId)[{{$index}}].IsExcludable" ng-value="item.IsExcludable" />
<input type="hidden" name="@(sliderClientId)[{{$index}}].AllocatePercentage" class="sliderValue" ng_value="item.AllocatePercentage" />
<div class="row" ng-attr-id="slider_{{item.DisplayId}}_div">
<div class="col-sm-4" style="text-align: right;">
<label ng-attr-id="slider_{{item.DisplayId}}_label">
{{ item.Name }}
</label>
</div>
<div class="col-sm-4" style="padding-top: 6px;">
<div ng-attr-id="slider_{{item.DisplayId}}_container" data-slider-key="{{item.DisplayId}}" ng-class="item.Css">
<span class="sliderTitle">{{ item.AllocatePercentage | number:0 }} %</span>
</div>
</div>
<div class="col-sm-4">
<a class="btn btn-xs btn-labeled btn-danger" ng-show="!isReadOnly && item.IsExcludable" ng-click="removeItem(item.DisplayId);">Remove</a>
</div>
</div>
</div>
<div id="additembutton_@(Model.GroupDisplayId)" data-ng-show="!isReadOnly && !showAddItemsDiv">
<div>
<div class="col-sm-4" style="text-align: right;">
<a class="btn btn-success" href="javascript:void(0)" data-ng-click="showControlsToAddItems();">Add teams</a>
</div>
<div class="col-sm-4" style="padding-bottom: 17px;">
&nbsp;
</div>
<div class="col-sm-4" style="padding-bottom: 17px;">
</div>
</div>
</div>
<div id="additemdiv_@(Model.GroupDisplayId)" data-ng-show="!isReadOnly && showAddItemsDiv">
<div>
<div class="form-group no-margin-hr select2-primary col-sm-4" style="text-align: right;">
<select name="addItems_@(Model.GroupDisplayId)" class="form-control" id="addItems_@(Model.GroupDisplayId)" multiple="multiple"
ng-options="item.Text for item in availableToAddItems | excludeFrom:arrSliders | orderBy:['Text']" ng-model="selectedTeams">
</select>
</div>
<div class="col-sm-4">
<a class="btn btn-success" href="javascript:void(0)" data-ng-click="addItemsByUI(); "><i class="fa fa-plus"></i>Add</a>
<a class="btn btn-default" href="javascript:void(0)" data-ng-click="hideControlsToAddItems();">Cancel</a>
</div>
<div class="col-sm-4" style="padding-bottom: 17px;">
</div>
</div>
</div>
</div>