yv01p/Umbraco-CMS
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Grid config row and editor checkboxes (#8363)

Browse Source
This commit is contained in:
Bjarne Fyrstenborg
2020-07-14 16:49:24 +02:00
committed by GitHub
parent e66fd7b8e0
commit da1a274dbf
4 changed files with 72 additions and 36 deletions
Download Patch File Download Diff File Expand all files Collapse all files

17
src/Umbraco.Web.UI.Client/src/views/propertyeditors/grid/dialogs/layoutconfig.controller.js
View File

@@ -71,10 +71,23 @@ angular.module("umbraco")
var index = template.sections.indexOf(section)
template.sections.splice(index, 1);
};
$scope.selectRow = function (section, row) {
section.allowed = section.allowed || [];
var index = section.allowed.indexOf(row.name);
if (row.allowed === true) {
if (index === -1) {
section.allowed.push(row.name);
}
}
else {
section.allowed.splice(index, 1);
}
};
$scope.close = function() {
if($scope.model.close) {
if ($scope.model.close) {
$scope.model.close();
}
}

41
src/Umbraco.Web.UI.Client/src/views/propertyeditors/grid/dialogs/layoutconfig.html
View File

@@ -98,31 +98,36 @@
ui-sortable
ng-model="model.value.templates">
<li ng-repeat="row in rows">
<li ng-repeat="row in rows track by $id(row)">
<label style="display: block">
<input type="checkbox"
checklist-model="currentSection.allowed"
checklist-value="row.name"
style="float: left; margin-right: 10px;">
<div class="flex">
<div class="preview-rows columns" style="margin-top: 5px; float:left">
<div class="preview-row">
<div class="preview-col"
ng-class="{last:$last}"
ng-repeat="area in row.areas"
ng-style="{width: percentage(area.grid) + '%'}">
<umb-checkbox model="row.allowed"
input-id="rowconfig-{{$index}}"
on-change="selectRow(currentSection, row)">
</umb-checkbox>
<div class="preview-cell"></div>
<div ng-click="row.allowed = !row.allowed; selectRow(currentSection, row)" class="flex flex-auto cursor-pointer">
<div class="preview-rows columns" style="margin-top: auto;">
<div class="preview-row">
<div class="preview-col"
ng-class="{last:$last}"
ng-repeat="area in row.areas"
ng-style="{width: percentage(area.grid) + '%'}">
<div class="preview-cell"></div>
</div>
</div>
</div>
<div>
{{row.name}}<br />
<small>{{row.areas.length}} cells</small>
</div>
</div>
<div>
{{row.name}}<br />
<small>{{row.areas.length}} cells</small><br />
</div>
</label>
</div>
<br style="clear: both" />
</li>

31
src/Umbraco.Web.UI.Client/src/views/propertyeditors/grid/dialogs/rowconfig.controller.js
View File

@@ -13,10 +13,9 @@ function RowConfigController($scope, localizationService) {
}
}
$scope.currentRow = $scope.model.currentRow;
$scope.editors = $scope.model.editors;
$scope.columns = $scope.model.columns;
$scope.editors = $scope.model.editors;
$scope.scaleUp = function(section, max, overflow) {
var add = 1;
@@ -44,7 +43,7 @@ function RowConfigController($scope, localizationService) {
delete $scope.currentCell;
}
else {
if (cell === undefined) {
if (cell === null) {
var available = $scope.availableRowSpace;
var space = 4;
@@ -58,6 +57,11 @@ function RowConfigController($scope, localizationService) {
row.areas.push(cell);
}
cell.allowed = cell.allowed || [];
$scope.editors.forEach(function (e) { e.allowed = cell.allowed.indexOf(e.alias) !== -1 });
$scope.currentCell = cell;
$scope.currentCell.allowAll = cell.allowAll || !cell.allowed || !cell.allowed.length;
}
@@ -74,14 +78,28 @@ function RowConfigController($scope, localizationService) {
$scope.deleteArea = function (cell, row) {
if ($scope.currentCell === cell) {
$scope.currentCell = undefined;
$scope.currentCell = null;
}
var index = row.areas.indexOf(cell)
row.areas.splice(index, 1);
};
$scope.closeArea = function() {
$scope.currentCell = undefined;
$scope.currentCell = null;
};
$scope.selectEditor = function (cell, editor) {
cell.allowed = cell.allowed || [];
var index = cell.allowed.indexOf(editor.alias);
if (editor.allowed === true) {
if (index === -1) {
cell.allowed.push(editor.alias);
}
}
else {
cell.allowed.splice(index, 1);
}
};
$scope.close = function() {
@@ -118,11 +136,8 @@ function RowConfigController($scope, localizationService) {
}
}
}, true);
init();
}
angular.module("umbraco").controller("Umbraco.PropertyEditors.GridPrevalueEditor.RowConfigController", RowConfigController);

19
src/Umbraco.Web.UI.Client/src/views/propertyeditors/grid/dialogs/rowconfig.html
View File

@@ -55,7 +55,7 @@
</a>
<a class="td uSky-templates-column add"
ng-click="configureCell(undefined, currentRow)"
ng-click="configureCell(null, currentRow)"
ng-style="{width: percentage(availableRowSpace) + '%'}">
<i class="icon icon-add"></i>
</a>
@@ -103,13 +103,16 @@
<div ng-if="currentCell.allowAll === false">
<hr />
<ul class="unstyled">
<li ng-repeat="editor in editors">
<label>
<input type="checkbox"
checklist-model="currentCell.allowed"
checklist-value="editor.alias">
<i class="icon {{editor.icon}}"></i> {{editor.name}}
<small class="input-label--small">({{editor.alias}})</small>
<li ng-repeat="editor in editors track by $id(editor)">
<umb-checkbox model="editor.allowed"
input-id="editorconfig-{{$index}}"
on-change="selectEditor(currentCell, editor)">
</umb-checkbox>
<label for="editorconfig-{{$index}}" style="padding: 0; margin-left: -10px;">
<i class="icon {{editor.icon}}" aria-hidden="true"></i> {{editor.name}}
<small class="input-label--small">({{editor.alias}})</small>
</label>
</li>
</ul>