v8: Use umb-radiobutton component in relation types (#6454)

This commit is contained in:
Bjarne Fyrstenborg
2019-09-29 13:48:00 +02:00
committed by Sebastiaan Janssen
parent b87fc4a779
commit 9ec1c05304
5 changed files with 80 additions and 41 deletions

View File

@@ -46,7 +46,7 @@
vm.onChange({ model: vm.model, value: vm.value });
}, 0);
}
}
}
}
var component = {
@@ -58,8 +58,8 @@
value: "@",
name: "@",
text: "@",
disabled: "=",
required: "=",
disabled: "<",
required: "<",
onChange: "&?"
}
};

View File

@@ -1,5 +1,6 @@
<label class="radio umb-form-check umb-form-check--radiobutton" ng-class="{ 'umb-form-check--disabled': vm.disabled }">
<input type="radio" name="{{vm.name}}"
<input type="radio"
name="{{vm.name}}"
value="{{vm.value}}"
class="umb-form-check__input"
ng-model="vm.model"

View File

@@ -22,7 +22,12 @@ function RelationTypeEditController($scope, $routeParams, relationTypeResource,
function init() {
vm.page.loading = true;
localizationService.localizeMany(["relationType_tabRelationType", "relationType_tabRelations"]).then(function (data) {
var labelKeys = [
"relationType_tabRelationType",
"relationType_tabRelations"
];
localizationService.localizeMany(labelKeys).then(function (data) {
vm.page.navigation = [
{
"name": data[0],
@@ -51,6 +56,10 @@ function RelationTypeEditController($scope, $routeParams, relationTypeResource,
formatDates(relationType.relations);
getRelationNames(relationType);
// Convert property value to string, since the umb-radiobutton component at the moment only handle string values.
// Sometime later the umb-radiobutton might be able to handle value as boolean.
relationType.isBidirectional = (relationType.isBidirectional || false).toString();
vm.relationType = relationType;
editorState.set(vm.relationType);

View File

@@ -1,40 +1,38 @@
<umb-box>
<umb-box-content>
<!-- ID -->
<umb-control-group label="Id">
<div>{{model.relationType.id}}</div>
<small>{{model.relationType.key}}</small>
</umb-control-group>
<div ng-controller="Umbraco.Editors.RelationTypes.SettingsController as vm">
<umb-box>
<umb-box-content>
<!-- ID -->
<umb-control-group label="Id">
<div>{{model.relationType.id}}</div>
<small>{{model.relationType.key}}</small>
</umb-control-group>
<!-- Direction -->
<umb-control-group label="@relationType_direction">
<ul class="unstyled">
<li>
<label class="radio">
<input type="radio" name="relationType-direction" ng-model="model.relationType.isBidirectional" ng-value="false"> <localize key="relationType_parentToChild">Parent to child</localize>
</label>
</li>
<li>
<label class="radio">
<input type="radio" name="relationType-direction" ng-model="model.relationType.isBidirectional" ng-value="true"> <localize key="relationType_bidirectional">Bidirectional</localize>
</label>
</li>
</ul>
</umb-control-group>
<!-- Direction -->
<umb-control-group label="@relationType_direction">
<ul class="unstyled">
<li>
<umb-radiobutton name="relationTypeDirection" value="false" model="model.relationType.isBidirectional" text="{{vm.labels.parentToChild}}"></umb-radiobutton>
</li>
<li>
<umb-radiobutton name="relationTypeDirection" value="true" model="model.relationType.isBidirectional" text="{{vm.labels.bidirectional}}"></umb-radiobutton>
</li>
</ul>
</umb-control-group>
<!-- Parent-->
<umb-control-group label="@relationType_parent">
<div>{{model.relationType.parentObjectTypeName}}</div>
</umb-control-group>
<!-- Parent-->
<umb-control-group label="@relationType_parent">
<div>{{model.relationType.parentObjectTypeName}}</div>
</umb-control-group>
<!-- Child -->
<umb-control-group label="@relationType_child">
<div>{{model.relationType.childObjectTypeName}}</div>
</umb-control-group>
<!-- Child -->
<umb-control-group label="@relationType_child">
<div>{{model.relationType.childObjectTypeName}}</div>
</umb-control-group>
<!-- Relation count -->
<umb-control-group label="@relationType_count" ng-if="model.relationType.relations.length > 0">
<div>{{model.relationType.relations.length}}</div>
</umb-control-group>
</umb-box-content>
</umb-box>
<!-- Relation count -->
<umb-control-group label="@relationType_count" ng-if="model.relationType.relations.length > 0">
<div>{{model.relationType.relations.length}}</div>
</umb-control-group>
</umb-box-content>
</umb-box>
</div>

View File

@@ -0,0 +1,31 @@
/**
* @ngdoc controller
* @name Umbraco.Editors.RelationTypes.SettingsController
* @function
*
* @description
* The controller for editing relation type settings.
*/
function RelationTypeSettingsController($scope, localizationService) {
var vm = this;
vm.labels = {};
function init() {
var labelKeys = [
"relationType_parentToChild",
"relationType_bidirectional"
];
localizationService.localizeMany(labelKeys).then(function (data) {
vm.labels.parentToChild = data[0];
vm.labels.bidirectional = data[1];
});
}
init();
}
angular.module("umbraco").controller("Umbraco.Editors.RelationTypes.SettingsController", RelationTypeSettingsController);