diff --git a/src/Umbraco.Web.UI.Client/src/common/directives/components/umbgroupsbuilder.directive.js b/src/Umbraco.Web.UI.Client/src/common/directives/components/umbgroupsbuilder.directive.js
index 81c6a6612e..328884cfa1 100644
--- a/src/Umbraco.Web.UI.Client/src/common/directives/components/umbgroupsbuilder.directive.js
+++ b/src/Umbraco.Web.UI.Client/src/common/directives/components/umbgroupsbuilder.directive.js
@@ -1,10 +1,13 @@
(function() {
'use strict';
- function GroupsBuilderDirective(contentTypeHelper, contentTypeResource, mediaTypeResource, dataTypeHelper, dataTypeResource, $filter, iconHelper, $q, $timeout) {
+ function GroupsBuilderDirective(contentTypeHelper, contentTypeResource, mediaTypeResource, dataTypeHelper, dataTypeResource, $filter, iconHelper, $q, $timeout, notificationsService, localizationService) {
function link(scope, el, attr, ctrl) {
+ var validationTranslated = "";
+ var tabNoSortOrderTranslated = "";
+
scope.sortingMode = false;
scope.toolbar = [];
scope.sortableOptionsGroup = {};
@@ -25,6 +28,14 @@
// add init tab
addInitGroup(scope.model.groups);
+ // localize texts
+ localizationService.localize("validation_validation").then(function(value) {
+ validationTranslated = value;
+ });
+
+ localizationService.localize("contentTypeEditor_tabHasNoSortOrder").then(function(value) {
+ tabNoSortOrderTranslated = value;
+ });
}
function setSortingOptions() {
@@ -202,13 +213,30 @@
scope.toggleSortingMode = function(tool) {
- scope.sortingMode = !scope.sortingMode;
+ if (scope.sortingMode === true) {
- if(scope.sortingMode === true) {
- scope.sortingButtonKey = "general_reorderDone";
- } else {
- scope.sortingButtonKey = "general_reorder";
- }
+ var sortOrderMissing = false;
+
+ for (var i = 0; i < scope.model.groups.length; i++) {
+ var group = scope.model.groups[i];
+ if (group.tabState !== "init" && group.sortOrder === undefined) {
+ sortOrderMissing = true;
+ group.showSortOrderMissing = true;
+ notificationsService.error(validationTranslated + ": " + group.name + " " + tabNoSortOrderTranslated);
+ }
+ }
+
+ if (!sortOrderMissing) {
+ scope.sortingMode = false;
+ scope.sortingButtonKey = "general_reorder";
+ }
+
+ } else {
+
+ scope.sortingMode = true;
+ scope.sortingButtonKey = "general_reorderDone";
+
+ }
};
@@ -394,8 +422,12 @@
}
};
- scope.changeSortOrderValue = function() {
- scope.model.groups = $filter('orderBy')(scope.model.groups, 'sortOrder');
+ scope.changeSortOrderValue = function(group) {
+
+ if (group.sortOrder !== undefined) {
+ group.showSortOrderMissing = false;
+ }
+ scope.model.groups = $filter('orderBy')(scope.model.groups, 'sortOrder');
};
function addInitGroup(groups) {
diff --git a/src/Umbraco.Web.UI.Client/src/less/components/umb-group-builder.less b/src/Umbraco.Web.UI.Client/src/less/components/umb-group-builder.less
index a0a1bad1dd..ef6cc07046 100644
--- a/src/Umbraco.Web.UI.Client/src/less/components/umb-group-builder.less
+++ b/src/Umbraco.Web.UI.Client/src/less/components/umb-group-builder.less
@@ -89,7 +89,6 @@
font-weight: bold;
display: flex;
align-items: center;
- margin-right: 10px;
}
.umb-group-builder__group-title-icon {
@@ -132,6 +131,15 @@ input.umb-group-builder__group-title-input {
display: inline-block;
position: relative;
top: 2px;
+ margin-left: 10px;
+}
+
+.umb-group-builder__group-sort-order {
+ display: flex;
+ align-items: center;
+ margin-left: 10px;
+ position: relative;
+ top: 2px;
}
input.umb-group-builder__group-sort-value {
@@ -139,10 +147,7 @@ input.umb-group-builder__group-sort-value {
padding: 0px 0 0px 5px;
width: 40px;
margin-bottom: 0;
- margin-right: 10px;
border-color: #d9d9d9;
- position: relative;
- top: 2px;
}
/* ---------- PROPERTIES ---------- */
diff --git a/src/Umbraco.Web.UI.Client/src/views/components/umb-groups-builder.html b/src/Umbraco.Web.UI.Client/src/views/components/umb-groups-builder.html
index fd169ca86a..c58ebcf364 100644
--- a/src/Umbraco.Web.UI.Client/src/views/components/umb-groups-builder.html
+++ b/src/Umbraco.Web.UI.Client/src/views/components/umb-groups-builder.html
@@ -84,7 +84,13 @@
-
+