mirror of
https://github.com/ansible/awx.git
synced 2026-05-23 16:47:45 -02:30
AC-1292 auto-resize groups height and scroll content when necessary.
This commit is contained in:
chouseknecht
@@ -531,7 +531,7 @@ function InventoriesEdit($scope, $location, $routeParams, $compile, $log, $rootS
|
|||||||
}
|
}
|
||||||
$scope.removeGroupTreeLoaded = $scope.$on('GroupTreeLoaded', function (event, inventory_name, groups) {
|
$scope.removeGroupTreeLoaded = $scope.$on('GroupTreeLoaded', function (event, inventory_name, groups) {
|
||||||
// Add breadcrumbs
|
// Add breadcrumbs
|
||||||
var e, inventoryAutoHelp;
|
var e, html, inventoryAutoHelp;
|
||||||
e = angular.element(document.getElementById('breadcrumbs'));
|
e = angular.element(document.getElementById('breadcrumbs'));
|
||||||
e.html(Breadcrumbs({ list: list, mode: 'edit' }));
|
e.html(Breadcrumbs({ list: list, mode: 'edit' }));
|
||||||
$compile(e)($scope);
|
$compile(e)($scope);
|
||||||
@@ -541,8 +541,14 @@ function InventoriesEdit($scope, $location, $routeParams, $compile, $log, $rootS
|
|||||||
mode: 'edit',
|
mode: 'edit',
|
||||||
id: 'groups-container',
|
id: 'groups-container',
|
||||||
breadCrumbs: false,
|
breadCrumbs: false,
|
||||||
searchSize: 'col-lg-5 col-md-5 col-sm-5'
|
searchSize: 'col-lg-5 col-md-5 col-sm-5',
|
||||||
|
skipTableHead: true
|
||||||
});
|
});
|
||||||
|
|
||||||
|
// Keep the table header fixed while allowing the table body to scroll and still use <table> element
|
||||||
|
html = "<table class=\"table table-condensed\" id=\"groups-table-header\">" + generator.buildHeader() + "</table>\n";
|
||||||
|
$(html).insertBefore('#groups-container .list-table-container');
|
||||||
|
|
||||||
$scope.groups = groups;
|
$scope.groups = groups;
|
||||||
$scope.inventory_name = inventory_name;
|
$scope.inventory_name = inventory_name;
|
||||||
|
|
||||||
@@ -595,7 +601,6 @@ function InventoriesEdit($scope, $location, $routeParams, $compile, $log, $rootS
|
|||||||
|
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|
||||||
// Called after tree data is reloaded on refresh button click.
|
// Called after tree data is reloaded on refresh button click.
|
||||||
if ($scope.removeGroupTreeRefreshed) {
|
if ($scope.removeGroupTreeRefreshed) {
|
||||||
$scope.removeGroupTreeRefreshed();
|
$scope.removeGroupTreeRefreshed();
|
||||||
|
|||||||
@@ -18,23 +18,36 @@ angular.module('InventoryHelper', ['RestServices', 'Utilities', 'OrganizationLis
|
|||||||
function (ApplyEllipsis) {
|
function (ApplyEllipsis) {
|
||||||
return function () {
|
return function () {
|
||||||
// Call to set or restore window resize
|
// Call to set or restore window resize
|
||||||
var timeOut;
|
|
||||||
$(window).resize(function () {
|
function setGroupsHeight() {
|
||||||
clearTimeout(timeOut);
|
// Attempt to set the group height
|
||||||
timeOut = setTimeout(function () {
|
var height;
|
||||||
// Hack to stop group-name div slipping to a new line
|
if ($(window).width() > 1210) {
|
||||||
$('#groups_table .name-column').each(function () {
|
height = $(window).height() - $('.main-menu').outerHeight() - $('#main_tabs').outerHeight() - $('#breadcrumbs').outerHeight() -
|
||||||
var td_width = $(this).width(),
|
($('.site-footer').outerHeight() * 2) - $('#groups-container .list-actions').outerHeight() - $('#groups-table-header').height() - 20;
|
||||||
level_width = $(this).find('.level').width(),
|
$('#groups-container .list-table-container').height(height);
|
||||||
level_padding = parseInt($(this).find('.level').css('padding-left').replace(/px/, '')),
|
}
|
||||||
level = level_width + level_padding,
|
else {
|
||||||
pct = (100 - Math.ceil((level / td_width) * 100)) + '%';
|
$('#groups-container .list-table-container').height('auto');
|
||||||
$(this).find('.group-name').css({ width: pct });
|
}
|
||||||
});
|
}
|
||||||
ApplyEllipsis('#groups_table .group-name a');
|
|
||||||
ApplyEllipsis('#hosts_table .host-name a');
|
setGroupsHeight();
|
||||||
}, 100);
|
|
||||||
});
|
$(window).resize(_.debounce(function() {
|
||||||
|
// Hack to stop group-name div slipping to a new line
|
||||||
|
$('#groups_table .name-column').each(function () {
|
||||||
|
var td_width = $(this).width(),
|
||||||
|
level_width = $(this).find('.level').width(),
|
||||||
|
level_padding = parseInt($(this).find('.level').css('padding-left').replace(/px/, '')),
|
||||||
|
level = level_width + level_padding,
|
||||||
|
pct = (100 - Math.ceil((level / td_width) * 100)) + '%';
|
||||||
|
$(this).find('.group-name').css({ width: pct });
|
||||||
|
});
|
||||||
|
ApplyEllipsis('#groups_table .group-name a');
|
||||||
|
ApplyEllipsis('#hosts_table .host-name a');
|
||||||
|
setGroupsHeight();
|
||||||
|
}, 500));
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
])
|
])
|
||||||
|
|||||||
@@ -16,7 +16,7 @@ angular.module('InventoryGroupsDefinition', [])
|
|||||||
hover: false,
|
hover: false,
|
||||||
hasChildren: true,
|
hasChildren: true,
|
||||||
filterBy: '{ show: true }',
|
filterBy: '{ show: true }',
|
||||||
'class': 'table-condensed table-no-border',
|
'class': 'table-no-border',
|
||||||
|
|
||||||
fields: {
|
fields: {
|
||||||
name: {
|
name: {
|
||||||
@@ -26,7 +26,7 @@ angular.module('InventoryGroupsDefinition', [])
|
|||||||
columnClick: "showHosts(group.id,group.group_id, false)",
|
columnClick: "showHosts(group.id,group.group_id, false)",
|
||||||
ngClass: "group.selected_class",
|
ngClass: "group.selected_class",
|
||||||
hasChildren: true,
|
hasChildren: true,
|
||||||
columnClass: 'col-lg-10 col-md-10 col-sm-10 col-xs-8',
|
columnClass: 'col-lg-10 col-md-10 col-sm-10 col-xs-9',
|
||||||
nosort: true,
|
nosort: true,
|
||||||
awDroppable: "{{ group.isDroppable }}",
|
awDroppable: "{{ group.isDroppable }}",
|
||||||
awDraggable: "{{ group.isDraggable }}",
|
awDraggable: "{{ group.isDraggable }}",
|
||||||
@@ -63,7 +63,7 @@ angular.module('InventoryGroupsDefinition', [])
|
|||||||
|
|
||||||
fieldActions: {
|
fieldActions: {
|
||||||
|
|
||||||
columnClass: 'col-lg-2 col-md-2 col-sm-2 col-xs-4',
|
columnClass: 'col-lg-2 col-md-2 col-sm-2 col-xs-3',
|
||||||
|
|
||||||
sync_status: {
|
sync_status: {
|
||||||
mode: 'all',
|
mode: 'all',
|
||||||
|
|||||||
@@ -28,7 +28,7 @@ angular.module('InventoryHostsDefinition', [])
|
|||||||
label: 'Hosts',
|
label: 'Hosts',
|
||||||
ngClick: "editHost(host.id)",
|
ngClick: "editHost(host.id)",
|
||||||
searchPlaceholder: "search_place_holder",
|
searchPlaceholder: "search_place_holder",
|
||||||
columnClass: 'col-lg-10 col-md-10 col-sm-10 col-xs-8',
|
columnClass: 'col-lg-10 col-md-10 col-sm-10 col-xs-9',
|
||||||
dataHostId: "{{ host.id }}",
|
dataHostId: "{{ host.id }}",
|
||||||
dataType: "host",
|
dataType: "host",
|
||||||
awDraggable: "true"
|
awDraggable: "true"
|
||||||
@@ -51,7 +51,7 @@ angular.module('InventoryHostsDefinition', [])
|
|||||||
|
|
||||||
fieldActions: {
|
fieldActions: {
|
||||||
|
|
||||||
columnClass: 'col-lg-2 col-md-2 col-sm-2 col-xs-4',
|
columnClass: 'col-lg-2 col-md-2 col-sm-2 col-xs-3',
|
||||||
|
|
||||||
enabled_flag: {
|
enabled_flag: {
|
||||||
iconClass: "{{ 'fa icon-enabled-' + host.enabled }}",
|
iconClass: "{{ 'fa icon-enabled-' + host.enabled }}",
|
||||||
|
|||||||
@@ -1324,6 +1324,16 @@ input[type="checkbox"].checkbox-no-label {
|
|||||||
margin-bottom: 0;
|
margin-bottom: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
#groups-table-header {
|
||||||
|
margin-bottom: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
#groups-container {
|
||||||
|
.list-table-container {
|
||||||
|
overflow: auto;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
#inventories_table i[class*="icon-job-"],
|
#inventories_table i[class*="icon-job-"],
|
||||||
#home_groups_table i[class*="icon-job-"] {
|
#home_groups_table i[class*="icon-job-"] {
|
||||||
margin-left: 10px;
|
margin-left: 10px;
|
||||||
@@ -1664,18 +1674,6 @@ tr td button i {
|
|||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Portrait tablet to landscape and desktop */
|
|
||||||
|
|
||||||
/*@media (max-width: 1200px) {
|
|
||||||
.site-footer {
|
|
||||||
.logo {
|
|
||||||
text-align: center;
|
|
||||||
padding-top: 20px;
|
|
||||||
margin-bottom: 10px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}*/
|
|
||||||
|
|
||||||
@media (min-width: 768px) and (max-width: 1199px) {
|
@media (min-width: 768px) and (max-width: 1199px) {
|
||||||
|
|
||||||
.level-1,
|
.level-1,
|
||||||
@@ -1709,6 +1707,7 @@ tr td button i {
|
|||||||
}
|
}
|
||||||
|
|
||||||
#hosts-container.col-lg-6 {
|
#hosts-container.col-lg-6 {
|
||||||
|
margin-top: 15px;
|
||||||
padding-left: 15px;
|
padding-left: 15px;
|
||||||
padding-right: 15px;
|
padding-right: 15px;
|
||||||
.well {
|
.well {
|
||||||
@@ -1804,6 +1803,7 @@ tr td button i {
|
|||||||
}
|
}
|
||||||
|
|
||||||
#hosts-container.col-lg-6 {
|
#hosts-container.col-lg-6 {
|
||||||
|
margin-toop: 15px;
|
||||||
padding-left: 15px;
|
padding-left: 15px;
|
||||||
padding-right: 15px;
|
padding-right: 15px;
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -12,456 +12,475 @@
|
|||||||
angular.module('ListGenerator', ['GeneratorHelpers'])
|
angular.module('ListGenerator', ['GeneratorHelpers'])
|
||||||
.factory('GenerateList', ['$location', '$compile', '$rootScope', 'SearchWidget', 'PaginateWidget', 'Attr', 'Icon',
|
.factory('GenerateList', ['$location', '$compile', '$rootScope', 'SearchWidget', 'PaginateWidget', 'Attr', 'Icon',
|
||||||
'Column', 'DropDown', 'NavigationLink', 'Button', 'SelectIcon', 'Breadcrumbs',
|
'Column', 'DropDown', 'NavigationLink', 'Button', 'SelectIcon', 'Breadcrumbs',
|
||||||
function ($location, $compile, $rootScope, SearchWidget, PaginateWidget, Attr, Icon, Column, DropDown, NavigationLink, Button, SelectIcon,
|
function ($location, $compile, $rootScope, SearchWidget, PaginateWidget, Attr, Icon, Column, DropDown, NavigationLink,
|
||||||
Breadcrumbs) {
|
Button, SelectIcon, Breadcrumbs) {
|
||||||
return {
|
return {
|
||||||
|
|
||||||
setList: function (list) {
|
setList: function (list) {
|
||||||
this.list = list;
|
this.list = list;
|
||||||
},
|
},
|
||||||
|
|
||||||
attr: Attr,
|
setOptions: function(options) {
|
||||||
|
this.options = options;
|
||||||
|
},
|
||||||
|
|
||||||
icon: Icon,
|
attr: Attr,
|
||||||
|
|
||||||
has: function (key) {
|
icon: Icon,
|
||||||
return (this.form[key] && this.form[key] !== null && this.form[key] !== undefined) ? true : false;
|
|
||||||
},
|
|
||||||
|
|
||||||
hide: function () {
|
has: function (key) {
|
||||||
$('#lookup-modal').modal('hide');
|
return (this.form[key] && this.form[key] !== null && this.form[key] !== undefined) ? true : false;
|
||||||
},
|
},
|
||||||
|
|
||||||
button: Button,
|
hide: function () {
|
||||||
|
$('#lookup-modal').modal('hide');
|
||||||
|
},
|
||||||
|
|
||||||
buildHTML: function(list, options) {
|
button: Button,
|
||||||
this.setList(list);
|
|
||||||
return this.build(options);
|
|
||||||
},
|
|
||||||
|
|
||||||
inject: function (list, options) {
|
buildHTML: function(list, options) {
|
||||||
// options.mode = one of edit, select or lookup
|
this.setList(list);
|
||||||
//
|
return this.build(options);
|
||||||
// Modes edit and select will inject the list as html into element #htmlTemplate.
|
},
|
||||||
// 'lookup' mode injects the list html into #lookup-modal-body.
|
|
||||||
//
|
|
||||||
// For options.mode == 'lookup', include the following:
|
|
||||||
//
|
|
||||||
// hdr: <lookup dialog header>
|
|
||||||
//
|
|
||||||
// Inject into a custom element using options.id: <element id attribute value>
|
|
||||||
// Control breadcrumb creation with options.breadCrumbs: <true | false>
|
|
||||||
//
|
|
||||||
var element;
|
|
||||||
|
|
||||||
if (options.id) {
|
inject: function (list, options) {
|
||||||
element = angular.element(document.getElementById(options.id));
|
// options.mode = one of edit, select or lookup
|
||||||
} else {
|
//
|
||||||
element = angular.element(document.getElementById('htmlTemplate'));
|
// Modes edit and select will inject the list as html into element #htmlTemplate.
|
||||||
}
|
// 'lookup' mode injects the list html into #lookup-modal-body.
|
||||||
|
//
|
||||||
|
// For options.mode == 'lookup', include the following:
|
||||||
|
//
|
||||||
|
// hdr: <lookup dialog header>
|
||||||
|
//
|
||||||
|
// Inject into a custom element using options.id: <element id attribute value>
|
||||||
|
// Control breadcrumb creation with options.breadCrumbs: <true | false>
|
||||||
|
//
|
||||||
|
var element;
|
||||||
|
|
||||||
this.setList(list);
|
if (options.id) {
|
||||||
element.html(this.build(options)); // Inject the html
|
element = angular.element(document.getElementById(options.id));
|
||||||
|
} else {
|
||||||
if (options.prepend) {
|
element = angular.element(document.getElementById('htmlTemplate'));
|
||||||
element.prepend(options.prepend);
|
|
||||||
}
|
|
||||||
|
|
||||||
if (options.append) {
|
|
||||||
element.append(options.append);
|
|
||||||
}
|
|
||||||
|
|
||||||
if (options.scope) {
|
|
||||||
this.scope = options.scope;
|
|
||||||
} else {
|
|
||||||
this.scope = element.scope();
|
|
||||||
}
|
|
||||||
|
|
||||||
$compile(element)(this.scope);
|
|
||||||
|
|
||||||
// Reset the scope to prevent displaying old data from our last visit to this list
|
|
||||||
//this.scope[list.name] = null;
|
|
||||||
this.scope[list.iterator] = [];
|
|
||||||
|
|
||||||
// Remove any lingering tooltip and popover <div> elements
|
|
||||||
$('.tooltip').each(function() {
|
|
||||||
$(this).remove();
|
|
||||||
});
|
|
||||||
|
|
||||||
$('.popover').each(function() {
|
|
||||||
// remove lingering popover <div>. Seems to be a bug in TB3 RC1
|
|
||||||
$(this).remove();
|
|
||||||
});
|
|
||||||
$(window).unbind('resize');
|
|
||||||
|
|
||||||
try {
|
|
||||||
$('#help-modal').empty().dialog('destroy');
|
|
||||||
} catch (e) {
|
|
||||||
//ignore any errors should the dialog not be initialized
|
|
||||||
}
|
|
||||||
|
|
||||||
/*if (options.mode === 'lookup') {
|
|
||||||
// options should include {hdr: <dialog header>, action: <function...> }
|
|
||||||
this.scope.formModalActionDisabled = false;
|
|
||||||
this.scope.lookupHeader = options.hdr;
|
|
||||||
$('#lookup-modal').modal({
|
|
||||||
backdrop: 'static',
|
|
||||||
keyboard: true
|
|
||||||
});
|
|
||||||
$('#lookup-modal').unbind('hidden.bs.modal');
|
|
||||||
$(document).bind('keydown', function (e) {
|
|
||||||
if (e.keyCode === 27) {
|
|
||||||
$('#lookup-modal').modal('hide');
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}*/
|
|
||||||
|
|
||||||
return this.scope;
|
|
||||||
},
|
|
||||||
|
|
||||||
build: function (options) {
|
|
||||||
//
|
|
||||||
// Generate HTML. Do NOT call this function directly. Called by inject(). Returns an HTML
|
|
||||||
// string to be injected into the current view.
|
|
||||||
//
|
|
||||||
var html = '',
|
|
||||||
list = this.list,
|
|
||||||
base, size, action, btn, fld, cnt, field_action, fAction, itm;
|
|
||||||
|
|
||||||
if (options.activityStream) {
|
|
||||||
// Breadcrumbs for activity stream widget
|
|
||||||
// Make the links clickable using ng-click function so we can first remove the stream widget
|
|
||||||
// before navigation
|
|
||||||
html += "<div class=\"nav-path\">\n";
|
|
||||||
html += "<ul class=\"breadcrumb\">\n";
|
|
||||||
html += "<li ng-repeat=\"crumb in breadcrumbs\"><a href=\"\" " + "ng-click=\"closeStream(crumb.path)\">" +
|
|
||||||
"{{ crumb.title }}</a></li>\n";
|
|
||||||
html += "<li class=\"active\">";
|
|
||||||
html += list.editTitle;
|
|
||||||
html += "</li>\n</ul>\n</div>\n";
|
|
||||||
} else if (options.mode !== 'lookup' && (options.breadCrumbs === undefined || options.breadCrumbs)) {
|
|
||||||
//Breadcrumbs
|
|
||||||
html += Breadcrumbs({
|
|
||||||
list: list,
|
|
||||||
mode: options.mode
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
if (options.mode === 'edit' && list.editInstructions) {
|
|
||||||
html += "<div class=\"alert alert-info alert-block\">\n";
|
|
||||||
html += "<button type=\"button\" class=\"close\" data-dismiss=\"alert\">×</button>\n";
|
|
||||||
html += "<strong>Hint: </strong>" + list.editInstructions + "\n";
|
|
||||||
html += "</div>\n";
|
|
||||||
}
|
|
||||||
|
|
||||||
if (options.instructions) {
|
|
||||||
html += "<div class=\"instructions alert alert-info\">" + options.instructions + "</div>\n";
|
|
||||||
}
|
|
||||||
else if (list.instructions) {
|
|
||||||
html += "<div class=\"instructions alert alert-info\">" + list.instructions + "</div>\n";
|
|
||||||
}
|
|
||||||
|
|
||||||
if (options.mode !== 'lookup' && (list.well === undefined || list.well)) {
|
|
||||||
html += "<div class=\"well\">\n";
|
|
||||||
}
|
|
||||||
|
|
||||||
if (options.activityStream) {
|
|
||||||
// Add a title row
|
|
||||||
html += "<div class=\"row\">\n";
|
|
||||||
html += "<div class=\"col-lg-12\">\n";
|
|
||||||
html += "<h5>{{ streamTitle }}</h5>\n";
|
|
||||||
html += "</div>\n";
|
|
||||||
html += "</div>\n";
|
|
||||||
}
|
|
||||||
|
|
||||||
if (options.showSearch=== undefined || options.showSearch === true) {
|
|
||||||
html += "<div class=\"row\">\n";
|
|
||||||
if (list.name !== 'groups') {
|
|
||||||
if (options.searchSize) {
|
|
||||||
html += SearchWidget({
|
|
||||||
iterator: list.iterator,
|
|
||||||
template: list,
|
|
||||||
mini: true,
|
|
||||||
size: options.searchSize,
|
|
||||||
searchWidgets: list.searchWidgets
|
|
||||||
});
|
|
||||||
} else if (options.mode === 'summary') {
|
|
||||||
html += SearchWidget({
|
|
||||||
iterator: list.iterator,
|
|
||||||
template: list,
|
|
||||||
mini: true,
|
|
||||||
size: 'col-lg-6'
|
|
||||||
});
|
|
||||||
} else if (options.mode === 'lookup' || options.id !== undefined) {
|
|
||||||
html += SearchWidget({
|
|
||||||
iterator: list.iterator,
|
|
||||||
template: list,
|
|
||||||
mini: true,
|
|
||||||
size: 'col-lg-8'
|
|
||||||
});
|
|
||||||
} else {
|
|
||||||
html += SearchWidget({
|
|
||||||
iterator: list.iterator,
|
|
||||||
template: list,
|
|
||||||
mini: true
|
|
||||||
});
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
if (options.mode !== 'lookup') {
|
|
||||||
//actions
|
|
||||||
base = $location.path().replace(/^\//, '').split('/')[0];
|
|
||||||
html += "<div class=\"";
|
|
||||||
if (list.name === 'groups') {
|
|
||||||
html += "col-lg-12";
|
|
||||||
} else if (options.searchSize && !options.listSize) {
|
|
||||||
// User supplied searchSize, calc the remaining
|
|
||||||
size = parseInt(options.searchSize.replace(/([A-Z]|[a-z]|\-)/g, ''));
|
|
||||||
size = (list.searchWidgets) ? list.searchWidgets * size : size;
|
|
||||||
html += 'col-lg-' + (12 - size);
|
|
||||||
} else if (options.listSize) {
|
|
||||||
html += options.listSize;
|
|
||||||
} else if (options.mode === 'summary') {
|
|
||||||
html += 'col-lg-6';
|
|
||||||
} else if (options.id !== undefined) {
|
|
||||||
html += "col-lg-4";
|
|
||||||
} else {
|
|
||||||
html += "col-lg-8 col-md-6";
|
|
||||||
}
|
|
||||||
html += "\">\n";
|
|
||||||
|
|
||||||
html += "<div class=\"list-actions\">\n";
|
|
||||||
|
|
||||||
// Add toolbar buttons or 'actions'
|
|
||||||
for (action in list.actions) {
|
|
||||||
if (list.actions[action].mode === 'all' || list.actions[action].mode === options.mode) {
|
|
||||||
if ((list.actions[action].basePaths === undefined) ||
|
|
||||||
(list.actions[action].basePaths && list.actions[action].basePaths.indexOf(base) > -1)) {
|
|
||||||
html += this.button({
|
|
||||||
btn: list.actions[action],
|
|
||||||
action: action,
|
|
||||||
toolbar: true
|
|
||||||
});
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
//select instructions
|
|
||||||
if (options.mode === 'select' && list.selectInstructions) {
|
|
||||||
btn = {
|
|
||||||
awPopOver: list.selectInstructions,
|
|
||||||
dataPlacement: 'left',
|
|
||||||
dataContainer: 'body',
|
|
||||||
'class': 'btn-xs btn-help',
|
|
||||||
awToolTip: 'Click for help',
|
|
||||||
dataTitle: 'Help',
|
|
||||||
iconSize: 'fa-lg'
|
|
||||||
};
|
|
||||||
//html += this.button(btn, 'select');
|
|
||||||
html += this.button({
|
|
||||||
btn: btn,
|
|
||||||
action: 'help',
|
|
||||||
toolbar: true
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
html += "</div><!-- list-acitons -->\n";
|
|
||||||
html += "</div><!-- list-actions-column -->\n";
|
|
||||||
} else {
|
|
||||||
//lookup
|
|
||||||
html += "<div class=\"col-lg-7\"></div>\n";
|
|
||||||
}
|
|
||||||
html += "</div><!-- row -->\n";
|
|
||||||
}
|
|
||||||
|
|
||||||
// Add a title and optionally a close button (used on Inventory->Groups)
|
|
||||||
if (options.mode !== 'lookup' && list.showTitle) {
|
|
||||||
html += "<div class=\"form-title\">";
|
|
||||||
html += (options.mode === 'edit' || options.mode === 'summary') ? list.editTitle : list.addTitle;
|
|
||||||
html += "</div>\n";
|
|
||||||
}
|
|
||||||
|
|
||||||
// table header row
|
|
||||||
html += "<div class=\"list-table-container\">\n";
|
|
||||||
html += "<table id=\"" + list.name + "_table\" ";
|
|
||||||
html += "class=\"table table-condensed";
|
|
||||||
html += (list['class']) ? " " + list['class'] : "";
|
|
||||||
html += (options.mode !== 'summary' && options.mode !== 'edit' && (options.mode === 'lookup' || options.id)) ?
|
|
||||||
' table-hover-inverse' : '';
|
|
||||||
html += (list.hover) ? ' table-hover' : '';
|
|
||||||
html += (options.mode === 'summary') ? ' table-summary' : '';
|
|
||||||
html += "\" ";
|
|
||||||
html += ">\n";
|
|
||||||
html += "<thead>\n";
|
|
||||||
html += "<tr>\n";
|
|
||||||
if (list.index) {
|
|
||||||
html += "<th class=\"col-lg-1 col-md-1 col-sm-2 hidden-xs\">#</th>\n";
|
|
||||||
}
|
|
||||||
for (fld in list.fields) {
|
|
||||||
if ((list.fields[fld].searchOnly === undefined || list.fields[fld].searchOnly === false) &&
|
|
||||||
!(options.mode === 'lookup' && list.fields[fld].excludeModal !== undefined && list.fields[fld].excludeModal === true)) {
|
|
||||||
html += "<th class=\"list-header";
|
|
||||||
html += (list.fields[fld].columnClass) ? " " + list.fields[fld].columnClass : "";
|
|
||||||
html += "\" id=\"" + list.iterator + "-" + fld + "-header\"";
|
|
||||||
html += (list.fields[fld].columnShow) ? " ng-show=\"" + list.fields[fld].columnShow + "\" " : "";
|
|
||||||
html += (list.fields[fld].nosort === undefined || list.fields[fld].nosort !== true) ? " ng-click=\"sort('" + list.iterator + "','" + fld + "')\"" : "";
|
|
||||||
html += ">";
|
|
||||||
html += list.fields[fld].label;
|
|
||||||
if (list.fields[fld].nosort === undefined || list.fields[fld].nosort !== true) {
|
|
||||||
html += " <i class=\"fa ";
|
|
||||||
if (list.fields[fld].key) {
|
|
||||||
if (list.fields[fld].desc) {
|
|
||||||
html += "fa-sort-down";
|
|
||||||
} else {
|
|
||||||
html += "fa-sort-up";
|
|
||||||
}
|
|
||||||
} else {
|
|
||||||
html += "fa-sort";
|
|
||||||
}
|
|
||||||
html += "\"></i></a>";
|
|
||||||
}
|
|
||||||
html += "</th>\n";
|
|
||||||
}
|
|
||||||
}
|
|
||||||
if (options.mode === 'select' || options.mode === 'lookup') {
|
|
||||||
html += "<th>Select</th>";
|
|
||||||
} else if (options.mode === 'edit' && list.fieldActions) {
|
|
||||||
html += "<th class=\"actions-column";
|
|
||||||
html += (list.fieldActions && list.fieldActions.columnClass) ? " " + list.fieldActions.columnClass : "";
|
|
||||||
html += "\">Actions</th>\n";
|
|
||||||
}
|
|
||||||
html += "</tr>\n";
|
|
||||||
html += "</thead>\n";
|
|
||||||
|
|
||||||
// table body
|
|
||||||
html += "<tbody>\n";
|
|
||||||
html += "<tr ng-class=\"" + list.iterator;
|
|
||||||
html += (options.mode === 'lookup' || options.mode === 'select') ? ".success_class" : ".active_class";
|
|
||||||
html += "\" ";
|
|
||||||
html += "class=\"" + list.iterator + "_class\" ";
|
|
||||||
html += "ng-repeat=\"" + list.iterator + " in " + list.name;
|
|
||||||
html += (list.orderBy) ? " | orderBy:'" + list.orderBy + "'" : "";
|
|
||||||
html += (list.filterBy) ? " | filter: " + list.filterBy : "";
|
|
||||||
html += "\">\n";
|
|
||||||
if (list.index) {
|
|
||||||
html += "<td class=\"index-column hidden-xs\">{{ $index + ((" + list.iterator + "_page - 1) * " + list.iterator + "_page_size) + 1 }}.</td>\n";
|
|
||||||
}
|
|
||||||
cnt = 2;
|
|
||||||
base = (list.base) ? list.base : list.name;
|
|
||||||
base = base.replace(/^\//, '');
|
|
||||||
for (fld in list.fields) {
|
|
||||||
cnt++;
|
|
||||||
if ((list.fields[fld].searchOnly === undefined || list.fields[fld].searchOnly === false) &&
|
|
||||||
!(options.mode === 'lookup' && list.fields[fld].excludeModal !== undefined &&
|
|
||||||
list.fields[fld].excludeModal === true)) {
|
|
||||||
html += Column({
|
|
||||||
list: list,
|
|
||||||
fld: fld,
|
|
||||||
options: options,
|
|
||||||
base: base
|
|
||||||
});
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
if (options.mode === 'select' || options.mode === 'lookup') {
|
|
||||||
html += "<td><input type=\"checkbox\" ng-model=\"" + list.iterator + ".checked\" name=\"check_{{" +
|
|
||||||
list.iterator + ".id }}\" ng-click=\"toggle_" + list.iterator + "(" + list.iterator + ".id, true)\" ng-true-value=\"1\" " +
|
|
||||||
"ng-false-value=\"0\" id=\"check_{{" + list.iterator + ".id}}\" /></td>";
|
|
||||||
} else if ((options.mode === 'edit' || options.mode === 'summary') && list.fieldActions) {
|
|
||||||
|
|
||||||
// Row level actions
|
|
||||||
|
|
||||||
html += "<td class=\"actions\">";
|
|
||||||
|
|
||||||
for (field_action in list.fieldActions) {
|
|
||||||
if (field_action !== 'columnClass') {
|
|
||||||
if (list.fieldActions[field_action].type && list.fieldActions[field_action].type === 'DropDown') {
|
|
||||||
html += DropDown({
|
|
||||||
list: list,
|
|
||||||
fld: field_action,
|
|
||||||
options: options,
|
|
||||||
base: base,
|
|
||||||
type: 'fieldActions',
|
|
||||||
td: false
|
|
||||||
});
|
|
||||||
} else {
|
|
||||||
fAction = list.fieldActions[field_action];
|
|
||||||
html += "<a id=\"";
|
|
||||||
html += (fAction.id) ? fAction.id : field_action + "-action";
|
|
||||||
html += "\" ";
|
|
||||||
html += (fAction.href) ? "href=\"" + fAction.href + "\" " : "";
|
|
||||||
html += (fAction.ngHref) ? "ng-href=\"" + fAction.ngHref + "\" " : "";
|
|
||||||
html += (field_action === 'cancel') ? "class=\"cancel red-txt\" " : "";
|
|
||||||
html += (fAction.awPopOver) ? "aw-pop-over=\"" + fAction.awPopOver + "\" " : "";
|
|
||||||
html += (fAction.dataPlacement) ? Attr(fAction, 'dataPlacement') : "";
|
|
||||||
html += (fAction.dataTitle) ? Attr(fAction, 'dataTitle') : "";
|
|
||||||
for (itm in fAction) {
|
|
||||||
if (itm !== 'ngHref' && itm !== 'href' && itm !== 'label' && itm !== 'icon' && itm !== 'class' &&
|
|
||||||
itm !== 'iconClass' && itm !== "dataPlacement" && itm !== "awPopOver" &&
|
|
||||||
itm !== "dataTitle") {
|
|
||||||
html += Attr(fAction, itm);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
html += ">";
|
|
||||||
if (fAction.iconClass) {
|
|
||||||
html += "<i class=\"" + fAction.iconClass + "\"></i>";
|
|
||||||
} else {
|
|
||||||
html += SelectIcon({
|
|
||||||
action: field_action
|
|
||||||
});
|
|
||||||
}
|
|
||||||
//html += (fAction.label) ? "<span class=\"list-action-label\"> " + list.fieldActions[field_action].label +
|
|
||||||
// "</span>" : "";
|
|
||||||
html += "</a>";
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
html += "</td>\n";
|
|
||||||
}
|
|
||||||
html += "</tr>\n";
|
|
||||||
|
|
||||||
// Message for when a collection is empty
|
|
||||||
html += "<tr class=\"loading-info\" ng-show=\"" + list.iterator + "Loading == false && " + list.name + ".length == 0\">\n";
|
|
||||||
html += "<td colspan=\"" + cnt + "\"><div class=\"loading-info\">No records matched your search.</div></td>\n";
|
|
||||||
html += "</tr>\n";
|
|
||||||
|
|
||||||
// Message for loading
|
|
||||||
html += "<tr class=\"loading-info\" ng-show=\"" + list.iterator + "Loading == true\">\n";
|
|
||||||
html += "<td colspan=\"" + cnt + "\"><div class=\"loading-info\">Loading...</div></td>\n";
|
|
||||||
html += "</tr>\n";
|
|
||||||
|
|
||||||
// End List
|
|
||||||
html += "</tbody>\n";
|
|
||||||
html += "</table>\n";
|
|
||||||
html += "</div><!-- table container -->\n";
|
|
||||||
|
|
||||||
if (options.mode === 'select' && (options.selectButton === undefined || options.selectButton)) {
|
|
||||||
html += "<div class=\"navigation-buttons\">\n";
|
|
||||||
html += " <button class=\"btn btn-sm btn-primary pull-right\" aw-tool-tip=\"Complete your selection\" " +
|
|
||||||
"ng-click=\"finishSelection()\" ng-disabled=\"disableSelectBtn\"><i class=\"fa fa-check\"></i> Select</button>\n";
|
|
||||||
html += "</div>\n";
|
|
||||||
}
|
|
||||||
|
|
||||||
if (options.mode !== 'lookup' && (list.well === undefined || list.well === true)) {
|
|
||||||
html += "</div>\n"; //well
|
|
||||||
}
|
|
||||||
|
|
||||||
if (list.name !== 'groups') {
|
|
||||||
if (options.mode === 'lookup' || (options.id && options.id === "form-modal-body")) {
|
|
||||||
html += PaginateWidget({
|
|
||||||
set: list.name,
|
|
||||||
iterator: list.iterator
|
|
||||||
});
|
|
||||||
} else {
|
|
||||||
html += PaginateWidget({
|
|
||||||
set: list.name,
|
|
||||||
iterator: list.iterator
|
|
||||||
});
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
return html;
|
|
||||||
}
|
}
|
||||||
};
|
|
||||||
}
|
this.setOptions(options);
|
||||||
]);
|
this.setList(list);
|
||||||
|
element.html(this.build(options)); // Inject the html
|
||||||
|
|
||||||
|
if (options.prepend) {
|
||||||
|
element.prepend(options.prepend);
|
||||||
|
}
|
||||||
|
|
||||||
|
if (options.append) {
|
||||||
|
element.append(options.append);
|
||||||
|
}
|
||||||
|
|
||||||
|
if (options.scope) {
|
||||||
|
this.scope = options.scope;
|
||||||
|
} else {
|
||||||
|
this.scope = element.scope();
|
||||||
|
}
|
||||||
|
|
||||||
|
$compile(element)(this.scope);
|
||||||
|
|
||||||
|
// Reset the scope to prevent displaying old data from our last visit to this list
|
||||||
|
//this.scope[list.name] = null;
|
||||||
|
this.scope[list.iterator] = [];
|
||||||
|
|
||||||
|
// Remove any lingering tooltip and popover <div> elements
|
||||||
|
$('.tooltip').each(function() {
|
||||||
|
$(this).remove();
|
||||||
|
});
|
||||||
|
|
||||||
|
$('.popover').each(function() {
|
||||||
|
// remove lingering popover <div>. Seems to be a bug in TB3 RC1
|
||||||
|
$(this).remove();
|
||||||
|
});
|
||||||
|
$(window).unbind('resize');
|
||||||
|
|
||||||
|
try {
|
||||||
|
$('#help-modal').empty().dialog('destroy');
|
||||||
|
} catch (e) {
|
||||||
|
//ignore any errors should the dialog not be initialized
|
||||||
|
}
|
||||||
|
|
||||||
|
/*if (options.mode === 'lookup') {
|
||||||
|
// options should include {hdr: <dialog header>, action: <function...> }
|
||||||
|
this.scope.formModalActionDisabled = false;
|
||||||
|
this.scope.lookupHeader = options.hdr;
|
||||||
|
$('#lookup-modal').modal({
|
||||||
|
backdrop: 'static',
|
||||||
|
keyboard: true
|
||||||
|
});
|
||||||
|
$('#lookup-modal').unbind('hidden.bs.modal');
|
||||||
|
$(document).bind('keydown', function (e) {
|
||||||
|
if (e.keyCode === 27) {
|
||||||
|
$('#lookup-modal').modal('hide');
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}*/
|
||||||
|
|
||||||
|
return this.scope;
|
||||||
|
},
|
||||||
|
|
||||||
|
build: function (options) {
|
||||||
|
//
|
||||||
|
// Generate HTML. Do NOT call this function directly. Called by inject(). Returns an HTML
|
||||||
|
// string to be injected into the current view.
|
||||||
|
//
|
||||||
|
var html = '',
|
||||||
|
list = this.list,
|
||||||
|
base, size, action, btn, fld, cnt, field_action, fAction, itm;
|
||||||
|
|
||||||
|
if (options.activityStream) {
|
||||||
|
// Breadcrumbs for activity stream widget
|
||||||
|
// Make the links clickable using ng-click function so we can first remove the stream widget
|
||||||
|
// before navigation
|
||||||
|
html += "<div class=\"nav-path\">\n";
|
||||||
|
html += "<ul class=\"breadcrumb\">\n";
|
||||||
|
html += "<li ng-repeat=\"crumb in breadcrumbs\"><a href=\"\" " + "ng-click=\"closeStream(crumb.path)\">" +
|
||||||
|
"{{ crumb.title }}</a></li>\n";
|
||||||
|
html += "<li class=\"active\">";
|
||||||
|
html += list.editTitle;
|
||||||
|
html += "</li>\n</ul>\n</div>\n";
|
||||||
|
} else if (options.mode !== 'lookup' && (options.breadCrumbs === undefined || options.breadCrumbs)) {
|
||||||
|
//Breadcrumbs
|
||||||
|
html += Breadcrumbs({
|
||||||
|
list: list,
|
||||||
|
mode: options.mode
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
if (options.mode === 'edit' && list.editInstructions) {
|
||||||
|
html += "<div class=\"alert alert-info alert-block\">\n";
|
||||||
|
html += "<button type=\"button\" class=\"close\" data-dismiss=\"alert\">×</button>\n";
|
||||||
|
html += "<strong>Hint: </strong>" + list.editInstructions + "\n";
|
||||||
|
html += "</div>\n";
|
||||||
|
}
|
||||||
|
|
||||||
|
if (options.instructions) {
|
||||||
|
html += "<div class=\"instructions alert alert-info\">" + options.instructions + "</div>\n";
|
||||||
|
}
|
||||||
|
else if (list.instructions) {
|
||||||
|
html += "<div class=\"instructions alert alert-info\">" + list.instructions + "</div>\n";
|
||||||
|
}
|
||||||
|
|
||||||
|
if (options.mode !== 'lookup' && (list.well === undefined || list.well)) {
|
||||||
|
html += "<div class=\"well\">\n";
|
||||||
|
}
|
||||||
|
|
||||||
|
if (options.activityStream) {
|
||||||
|
// Add a title row
|
||||||
|
html += "<div class=\"row\">\n";
|
||||||
|
html += "<div class=\"col-lg-12\">\n";
|
||||||
|
html += "<h5>{{ streamTitle }}</h5>\n";
|
||||||
|
html += "</div>\n";
|
||||||
|
html += "</div>\n";
|
||||||
|
}
|
||||||
|
|
||||||
|
if (options.showSearch=== undefined || options.showSearch === true) {
|
||||||
|
html += "<div class=\"row\">\n";
|
||||||
|
if (list.name !== 'groups') {
|
||||||
|
if (options.searchSize) {
|
||||||
|
html += SearchWidget({
|
||||||
|
iterator: list.iterator,
|
||||||
|
template: list,
|
||||||
|
mini: true,
|
||||||
|
size: options.searchSize,
|
||||||
|
searchWidgets: list.searchWidgets
|
||||||
|
});
|
||||||
|
} else if (options.mode === 'summary') {
|
||||||
|
html += SearchWidget({
|
||||||
|
iterator: list.iterator,
|
||||||
|
template: list,
|
||||||
|
mini: true,
|
||||||
|
size: 'col-lg-6'
|
||||||
|
});
|
||||||
|
} else if (options.mode === 'lookup' || options.id !== undefined) {
|
||||||
|
html += SearchWidget({
|
||||||
|
iterator: list.iterator,
|
||||||
|
template: list,
|
||||||
|
mini: true,
|
||||||
|
size: 'col-lg-8'
|
||||||
|
});
|
||||||
|
} else {
|
||||||
|
html += SearchWidget({
|
||||||
|
iterator: list.iterator,
|
||||||
|
template: list,
|
||||||
|
mini: true
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
if (options.mode !== 'lookup') {
|
||||||
|
//actions
|
||||||
|
base = $location.path().replace(/^\//, '').split('/')[0];
|
||||||
|
html += "<div class=\"";
|
||||||
|
if (list.name === 'groups') {
|
||||||
|
html += "col-lg-12";
|
||||||
|
} else if (options.searchSize && !options.listSize) {
|
||||||
|
// User supplied searchSize, calc the remaining
|
||||||
|
size = parseInt(options.searchSize.replace(/([A-Z]|[a-z]|\-)/g, ''));
|
||||||
|
size = (list.searchWidgets) ? list.searchWidgets * size : size;
|
||||||
|
html += 'col-lg-' + (12 - size);
|
||||||
|
} else if (options.listSize) {
|
||||||
|
html += options.listSize;
|
||||||
|
} else if (options.mode === 'summary') {
|
||||||
|
html += 'col-lg-6';
|
||||||
|
} else if (options.id !== undefined) {
|
||||||
|
html += "col-lg-4";
|
||||||
|
} else {
|
||||||
|
html += "col-lg-8 col-md-6";
|
||||||
|
}
|
||||||
|
html += "\">\n";
|
||||||
|
|
||||||
|
html += "<div class=\"list-actions\">\n";
|
||||||
|
|
||||||
|
// Add toolbar buttons or 'actions'
|
||||||
|
for (action in list.actions) {
|
||||||
|
if (list.actions[action].mode === 'all' || list.actions[action].mode === options.mode) {
|
||||||
|
if ((list.actions[action].basePaths === undefined) ||
|
||||||
|
(list.actions[action].basePaths && list.actions[action].basePaths.indexOf(base) > -1)) {
|
||||||
|
html += this.button({
|
||||||
|
btn: list.actions[action],
|
||||||
|
action: action,
|
||||||
|
toolbar: true
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
//select instructions
|
||||||
|
if (options.mode === 'select' && list.selectInstructions) {
|
||||||
|
btn = {
|
||||||
|
awPopOver: list.selectInstructions,
|
||||||
|
dataPlacement: 'left',
|
||||||
|
dataContainer: 'body',
|
||||||
|
'class': 'btn-xs btn-help',
|
||||||
|
awToolTip: 'Click for help',
|
||||||
|
dataTitle: 'Help',
|
||||||
|
iconSize: 'fa-lg'
|
||||||
|
};
|
||||||
|
//html += this.button(btn, 'select');
|
||||||
|
html += this.button({
|
||||||
|
btn: btn,
|
||||||
|
action: 'help',
|
||||||
|
toolbar: true
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
html += "</div><!-- list-acitons -->\n";
|
||||||
|
html += "</div><!-- list-actions-column -->\n";
|
||||||
|
} else {
|
||||||
|
//lookup
|
||||||
|
html += "<div class=\"col-lg-7\"></div>\n";
|
||||||
|
}
|
||||||
|
html += "</div><!-- row -->\n";
|
||||||
|
}
|
||||||
|
|
||||||
|
// Add a title and optionally a close button (used on Inventory->Groups)
|
||||||
|
if (options.mode !== 'lookup' && list.showTitle) {
|
||||||
|
html += "<div class=\"form-title\">";
|
||||||
|
html += (options.mode === 'edit' || options.mode === 'summary') ? list.editTitle : list.addTitle;
|
||||||
|
html += "</div>\n";
|
||||||
|
}
|
||||||
|
|
||||||
|
// table header row
|
||||||
|
html += "<div class=\"list-table-container\">\n";
|
||||||
|
html += "<table id=\"" + list.name + "_table\" ";
|
||||||
|
html += "class=\"table table-condensed";
|
||||||
|
html += (list['class']) ? " " + list['class'] : "";
|
||||||
|
html += (options.mode !== 'summary' && options.mode !== 'edit' && (options.mode === 'lookup' || options.id)) ?
|
||||||
|
' table-hover-inverse' : '';
|
||||||
|
html += (list.hover) ? ' table-hover' : '';
|
||||||
|
html += (options.mode === 'summary') ? ' table-summary' : '';
|
||||||
|
html += "\" ";
|
||||||
|
html += ">\n";
|
||||||
|
|
||||||
|
if (!options.skipTableHead) {
|
||||||
|
html += this.buildHeader(options);
|
||||||
|
}
|
||||||
|
|
||||||
|
// table body
|
||||||
|
html += "<tbody>\n";
|
||||||
|
html += "<tr ng-class=\"" + list.iterator;
|
||||||
|
html += (options.mode === 'lookup' || options.mode === 'select') ? ".success_class" : ".active_class";
|
||||||
|
html += "\" ";
|
||||||
|
html += "class=\"" + list.iterator + "_class\" ";
|
||||||
|
html += "ng-repeat=\"" + list.iterator + " in " + list.name;
|
||||||
|
html += (list.orderBy) ? " | orderBy:'" + list.orderBy + "'" : "";
|
||||||
|
html += (list.filterBy) ? " | filter: " + list.filterBy : "";
|
||||||
|
html += "\">\n";
|
||||||
|
if (list.index) {
|
||||||
|
html += "<td class=\"index-column hidden-xs\">{{ $index + ((" + list.iterator + "_page - 1) * " + list.iterator + "_page_size) + 1 }}.</td>\n";
|
||||||
|
}
|
||||||
|
cnt = 2;
|
||||||
|
base = (list.base) ? list.base : list.name;
|
||||||
|
base = base.replace(/^\//, '');
|
||||||
|
for (fld in list.fields) {
|
||||||
|
cnt++;
|
||||||
|
if ((list.fields[fld].searchOnly === undefined || list.fields[fld].searchOnly === false) &&
|
||||||
|
!(options.mode === 'lookup' && list.fields[fld].excludeModal !== undefined &&
|
||||||
|
list.fields[fld].excludeModal === true)) {
|
||||||
|
html += Column({
|
||||||
|
list: list,
|
||||||
|
fld: fld,
|
||||||
|
options: options,
|
||||||
|
base: base
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
if (options.mode === 'select' || options.mode === 'lookup') {
|
||||||
|
html += "<td><input type=\"checkbox\" ng-model=\"" + list.iterator + ".checked\" name=\"check_{{" +
|
||||||
|
list.iterator + ".id }}\" ng-click=\"toggle_" + list.iterator + "(" + list.iterator + ".id, true)\" ng-true-value=\"1\" " +
|
||||||
|
"ng-false-value=\"0\" id=\"check_{{" + list.iterator + ".id}}\" /></td>";
|
||||||
|
} else if ((options.mode === 'edit' || options.mode === 'summary') && list.fieldActions) {
|
||||||
|
|
||||||
|
// Row level actions
|
||||||
|
|
||||||
|
html += "<td class=\"actions\">";
|
||||||
|
|
||||||
|
for (field_action in list.fieldActions) {
|
||||||
|
if (field_action !== 'columnClass') {
|
||||||
|
if (list.fieldActions[field_action].type && list.fieldActions[field_action].type === 'DropDown') {
|
||||||
|
html += DropDown({
|
||||||
|
list: list,
|
||||||
|
fld: field_action,
|
||||||
|
options: options,
|
||||||
|
base: base,
|
||||||
|
type: 'fieldActions',
|
||||||
|
td: false
|
||||||
|
});
|
||||||
|
} else {
|
||||||
|
fAction = list.fieldActions[field_action];
|
||||||
|
html += "<a id=\"";
|
||||||
|
html += (fAction.id) ? fAction.id : field_action + "-action";
|
||||||
|
html += "\" ";
|
||||||
|
html += (fAction.href) ? "href=\"" + fAction.href + "\" " : "";
|
||||||
|
html += (fAction.ngHref) ? "ng-href=\"" + fAction.ngHref + "\" " : "";
|
||||||
|
html += (field_action === 'cancel') ? "class=\"cancel red-txt\" " : "";
|
||||||
|
html += (fAction.awPopOver) ? "aw-pop-over=\"" + fAction.awPopOver + "\" " : "";
|
||||||
|
html += (fAction.dataPlacement) ? Attr(fAction, 'dataPlacement') : "";
|
||||||
|
html += (fAction.dataTitle) ? Attr(fAction, 'dataTitle') : "";
|
||||||
|
for (itm in fAction) {
|
||||||
|
if (itm !== 'ngHref' && itm !== 'href' && itm !== 'label' && itm !== 'icon' && itm !== 'class' &&
|
||||||
|
itm !== 'iconClass' && itm !== "dataPlacement" && itm !== "awPopOver" &&
|
||||||
|
itm !== "dataTitle") {
|
||||||
|
html += Attr(fAction, itm);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
html += ">";
|
||||||
|
if (fAction.iconClass) {
|
||||||
|
html += "<i class=\"" + fAction.iconClass + "\"></i>";
|
||||||
|
} else {
|
||||||
|
html += SelectIcon({
|
||||||
|
action: field_action
|
||||||
|
});
|
||||||
|
}
|
||||||
|
//html += (fAction.label) ? "<span class=\"list-action-label\"> " + list.fieldActions[field_action].label +
|
||||||
|
// "</span>" : "";
|
||||||
|
html += "</a>";
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
html += "</td>\n";
|
||||||
|
}
|
||||||
|
html += "</tr>\n";
|
||||||
|
|
||||||
|
// Message for when a collection is empty
|
||||||
|
html += "<tr class=\"loading-info\" ng-show=\"" + list.iterator + "Loading == false && " + list.name + ".length == 0\">\n";
|
||||||
|
html += "<td colspan=\"" + cnt + "\"><div class=\"loading-info\">No records matched your search.</div></td>\n";
|
||||||
|
html += "</tr>\n";
|
||||||
|
|
||||||
|
// Message for loading
|
||||||
|
html += "<tr class=\"loading-info\" ng-show=\"" + list.iterator + "Loading == true\">\n";
|
||||||
|
html += "<td colspan=\"" + cnt + "\"><div class=\"loading-info\">Loading...</div></td>\n";
|
||||||
|
html += "</tr>\n";
|
||||||
|
|
||||||
|
// End List
|
||||||
|
html += "</tbody>\n";
|
||||||
|
html += "</table>\n";
|
||||||
|
html += "</div><!-- table container -->\n";
|
||||||
|
|
||||||
|
if (options.mode === 'select' && (options.selectButton === undefined || options.selectButton)) {
|
||||||
|
html += "<div class=\"navigation-buttons\">\n";
|
||||||
|
html += " <button class=\"btn btn-sm btn-primary pull-right\" aw-tool-tip=\"Complete your selection\" " +
|
||||||
|
"ng-click=\"finishSelection()\" ng-disabled=\"disableSelectBtn\"><i class=\"fa fa-check\"></i> Select</button>\n";
|
||||||
|
html += "</div>\n";
|
||||||
|
}
|
||||||
|
|
||||||
|
if (options.mode !== 'lookup' && (list.well === undefined || list.well === true)) {
|
||||||
|
html += "</div>\n"; //well
|
||||||
|
}
|
||||||
|
|
||||||
|
if (list.name !== 'groups') {
|
||||||
|
if (options.mode === 'lookup' || (options.id && options.id === "form-modal-body")) {
|
||||||
|
html += PaginateWidget({
|
||||||
|
set: list.name,
|
||||||
|
iterator: list.iterator
|
||||||
|
});
|
||||||
|
} else {
|
||||||
|
html += PaginateWidget({
|
||||||
|
set: list.name,
|
||||||
|
iterator: list.iterator
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
return html;
|
||||||
|
},
|
||||||
|
|
||||||
|
buildHeader: function(options) {
|
||||||
|
var list = this.list,
|
||||||
|
fld, html;
|
||||||
|
|
||||||
|
if (options === undefined) {
|
||||||
|
options = this.options;
|
||||||
|
}
|
||||||
|
|
||||||
|
html = "<thead>\n";
|
||||||
|
html += "<tr>\n";
|
||||||
|
if (list.index) {
|
||||||
|
html += "<th class=\"col-lg-1 col-md-1 col-sm-2 hidden-xs\">#</th>\n";
|
||||||
|
}
|
||||||
|
for (fld in list.fields) {
|
||||||
|
if ((list.fields[fld].searchOnly === undefined || list.fields[fld].searchOnly === false) &&
|
||||||
|
!(options.mode === 'lookup' && list.fields[fld].excludeModal !== undefined && list.fields[fld].excludeModal === true)) {
|
||||||
|
html += "<th class=\"list-header";
|
||||||
|
html += (list.fields[fld].columnClass) ? " " + list.fields[fld].columnClass : "";
|
||||||
|
html += "\" id=\"" + list.iterator + "-" + fld + "-header\"";
|
||||||
|
html += (list.fields[fld].columnShow) ? " ng-show=\"" + list.fields[fld].columnShow + "\" " : "";
|
||||||
|
html += (list.fields[fld].nosort === undefined || list.fields[fld].nosort !== true) ? " ng-click=\"sort('" + list.iterator + "','" + fld + "')\"" : "";
|
||||||
|
html += ">";
|
||||||
|
html += list.fields[fld].label;
|
||||||
|
if (list.fields[fld].nosort === undefined || list.fields[fld].nosort !== true) {
|
||||||
|
html += " <i class=\"fa ";
|
||||||
|
if (list.fields[fld].key) {
|
||||||
|
if (list.fields[fld].desc) {
|
||||||
|
html += "fa-sort-down";
|
||||||
|
} else {
|
||||||
|
html += "fa-sort-up";
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
html += "fa-sort";
|
||||||
|
}
|
||||||
|
html += "\"></i></a>";
|
||||||
|
}
|
||||||
|
html += "</th>\n";
|
||||||
|
}
|
||||||
|
}
|
||||||
|
if (options.mode === 'select' || options.mode === 'lookup') {
|
||||||
|
html += "<th>Select</th>";
|
||||||
|
} else if (options.mode === 'edit' && list.fieldActions) {
|
||||||
|
html += "<th class=\"actions-column";
|
||||||
|
html += (list.fieldActions && list.fieldActions.columnClass) ? " " + list.fieldActions.columnClass : "";
|
||||||
|
html += "\">Actions</th>\n";
|
||||||
|
}
|
||||||
|
html += "</tr>\n";
|
||||||
|
html += "</thead>\n";
|
||||||
|
return html;
|
||||||
|
}
|
||||||
|
};
|
||||||
|
}]);
|
||||||
Reference in New Issue
Block a user