Modify motion/assignment/customslide in form dialog without updating list/detail view.

This commit is contained in:
Emanuel Schuetze 2016-01-16 14:19:00 +01:00
parent 3ed5b2bb1b
commit 0e24d9b632
8 changed files with 129 additions and 27 deletions

View File

@ -144,8 +144,8 @@
</div> </div>
<div os-perms="agenda.can_manage" class="hoverActions" ng-class="{'hiddenDiv': !item.hover}"> <div os-perms="agenda.can_manage" class="hoverActions" ng-class="{'hiddenDiv': !item.hover}">
<a ui-sref="agenda.item.detail({id: item.id})" translate>List of speakers</a> | <a ui-sref="agenda.item.detail({id: item.id})" translate>List of speakers</a> |
<a href="" ng-click="item.quickEdit=true" translate>QuickEdit</a> | <a href="" ng-click="editDialog(item)" translate>Edit</a> |
<a href="" ng-click="editDialog(item)" translate>Edit</a> <a href="" ng-click="item.quickEdit=true" translate>QuickEdit</a>
<span ng-if="item.content_object.collection == 'core/customslide'"> | <span ng-if="item.content_object.collection == 'core/customslide'"> |
<a href="" class="text-danger" <a href="" class="text-danger"
ng-bootbox-confirm="{{ 'Are you sure you want to delete this entry?' | translate }}<br> ng-bootbox-confirm="{{ 'Are you sure you want to delete this entry?' | translate }}<br>

View File

@ -383,16 +383,31 @@ angular.module('OpenSlidesApp.assignments.site', ['OpenSlidesApp.assignments'])
'AssignmentForm', 'AssignmentForm',
'assignment', 'assignment',
function($scope, $state, Assignment, AssignmentForm, assignment) { function($scope, $state, Assignment, AssignmentForm, assignment) {
// set initial values for form model $scope.alert = {};
$scope.model = assignment; // set initial values for form model by create deep copy of assignment object
// so list/detail view is not updated while editing
$scope.model = angular.copy(assignment);
// get all form fields // get all form fields
$scope.formFields = AssignmentForm.getFormFields(); $scope.formFields = AssignmentForm.getFormFields();
// save assignment // save assignment
$scope.save = function (assignment) { $scope.save = function (assignment) {
// inject the changed assignment (copy) object back into DS store
Assignment.inject(assignment);
// save change motion object on server
Assignment.save(assignment).then( Assignment.save(assignment).then(
function(success) { function(success) {
$scope.closeThisDialog(); $scope.closeThisDialog();
},
function (error) {
// save error: revert all changes by restore
// (refresh) original assignment object from server
Assignment.refresh(assignment);
var message = '';
for (var e in error.data) {
message += e + ': ' + error.data[e] + ' ';
}
$scope.alert = {type: 'danger', msg: message, show: true};
} }
); );
}; };

View File

@ -1,6 +1,10 @@
<h1 ng-if="model.id" translate>Edit election</h1> <h1 ng-if="model.id" translate>Edit election</h1>
<h1 ng-if="!model.id" translate>New election</h1> <h1 ng-if="!model.id" translate>New election</h1>
<alert ng-show="alert.show" type="{{ alert.type }}" ng-click="alert={}" close="alert={}">
{{ alert.msg }}
</alert>
<form name="assignmentForm" ng-submit="save(model)"> <form name="assignmentForm" ng-submit="save(model)">
<formly-form model="model" fields="formFields"> <formly-form model="model" fields="formFields">
<button type="submit" ng-disabled="assignmentForm.$invalid" class="btn btn-primary" translate> <button type="submit" ng-disabled="assignmentForm.$invalid" class="btn btn-primary" translate>

View File

@ -220,14 +220,24 @@ angular.module('OpenSlidesApp.core.site', [
} }
} }
}) })
// redirects to customslide detail and opens customslide edit form dialog, uses edit url,
// used by ui-sref links from agenda only
// (from customslide controller use CustomSlideForm factory instead to open dialog in front
// of current view without redirect)
.state('core.customslide.detail.update', { .state('core.customslide.detail.update', {
onEnter: ['$stateParams', 'ngDialog', 'Customslide', function($stateParams, ngDialog, Customslide) { onEnter: ['$stateParams', '$state', 'ngDialog', 'Customslide',
function($stateParams, $state, ngDialog, Customslide) {
ngDialog.open({ ngDialog.open({
template: 'static/templates/core/customslide-form.html', template: 'static/templates/core/customslide-form.html',
controller: 'CustomslideUpdateCtrl', controller: 'CustomslideUpdateCtrl',
className: 'ngdialog-theme-default wide-form', className: 'ngdialog-theme-default wide-form',
resolve: { customslide: function() { resolve: {
return Customslide.find($stateParams.id) }} customslide: function() {return Customslide.find($stateParams.id) }
},
preCloseCallback: function() {
$state.go('core.customslide.detail', {customslide: $stateParams.id});
return true;
}
}); });
}] }]
}) })
@ -401,12 +411,28 @@ angular.module('OpenSlidesApp.core.site', [
// Provide generic customslide form fields for create and update view // Provide generic customslide form fields for create and update view
.factory('CustomslideFormFieldFactory', [ .factory('CustomslideForm', [
'gettextCatalog', 'gettextCatalog',
'CKEditorOptions', 'CKEditorOptions',
'Mediafile', 'Mediafile',
function (gettextCatalog, CKEditorOptions, Mediafile) { function (gettextCatalog, CKEditorOptions, Mediafile) {
return { return {
// ngDialog for customslide form
getDialog: function (customslide) {
if (customslide) {
var resolve = {
customslide: function(Customslide) {return Customslide.find(customslide.id);}
};
}
return {
template: 'static/templates/core/customslide-form.html',
controller: (customslide) ? 'CustomslideUpdateCtrl' : 'CustomslideCreateCtrl',
className: 'ngdialog-theme-default wide-form',
closeByEscape: false,
closeByDocument: false,
resolve: (resolve) ? resolve : null
}
},
getFormFields: function () { getFormFields: function () {
return [ return [
{ {
@ -641,20 +667,32 @@ angular.module('OpenSlidesApp.core.site', [
]) ])
// Customslide Controllers // Customslide Controllers
.controller('CustomslideDetailCtrl', function($scope, Customslide, customslide) { .controller('CustomslideDetailCtrl', [
'$scope',
'ngDialog',
'CustomslideForm',
'Customslide',
'customslide',
function($scope, ngDialog, CustomslideForm, Customslide, customslide) {
Customslide.bindOne(customslide.id, $scope, 'customslide'); Customslide.bindOne(customslide.id, $scope, 'customslide');
Customslide.loadRelations(customslide, 'agenda_item'); Customslide.loadRelations(customslide, 'agenda_item');
})
// open edit dialog
$scope.openDialog = function (customslide) {
ngDialog.open(CustomslideForm.getDialog(customslide));
};
}
])
.controller('CustomslideCreateCtrl', [ .controller('CustomslideCreateCtrl', [
'$scope', '$scope',
'$state', '$state',
'Customslide', 'Customslide',
'CustomslideFormFieldFactory', 'CustomslideForm',
function($scope, $state, Customslide, CustomslideFormFieldFactory) { function($scope, $state, Customslide, CustomslideForm) {
$scope.customslide = {}; $scope.customslide = {};
// get all form fields // get all form fields
$scope.formFields = CustomslideFormFieldFactory.getFormFields(); $scope.formFields = CustomslideForm.getFormFields();
// save form // save form
$scope.save = function (customslide) { $scope.save = function (customslide) {
@ -671,19 +709,34 @@ angular.module('OpenSlidesApp.core.site', [
'$scope', '$scope',
'$state', '$state',
'Customslide', 'Customslide',
'CustomslideFormFieldFactory', 'CustomslideForm',
'customslide', 'customslide',
function($scope, $state, Customslide, CustomslideFormFieldFactory, customslide) { function($scope, $state, Customslide, CustomslideForm, customslide) {
// set initial values for form model $scope.alert = {};
$scope.model = customslide; // set initial values for form model by create deep copy of customslide object
// so list/detail view is not updated while editing
$scope.model = angular.copy(customslide);
// get all form fields // get all form fields
$scope.formFields = CustomslideFormFieldFactory.getFormFields(); $scope.formFields = CustomslideForm.getFormFields();
// save form // save form
$scope.save = function (customslide) { $scope.save = function (customslide) {
// inject the changed customslide (copy) object back into DS store
Customslide.inject(customslide);
// save change customslide object on server
Customslide.save(customslide).then( Customslide.save(customslide).then(
function(success) { function(success) {
$scope.closeThisDialog(); $scope.closeThisDialog();
},
function (error) {
// save error: revert all changes by restore
// (refresh) original customslide object from server
Customslide.refresh(customslide);
var message = '';
for (var e in error.data) {
message += e + ': ' + error.data[e] + ' ';
}
$scope.alert = {type: 'danger', msg: message, show: true};
} }
); );
}; };

View File

@ -17,6 +17,12 @@
title="{{ 'Project agenda item' | translate }}"> title="{{ 'Project agenda item' | translate }}">
<i class="fa fa-video-camera"></i> <i class="fa fa-video-camera"></i>
</a> </a>
<!-- edit -->
<a os-perms="agenda.can_manage" ng-click="openDialog(customslide)"
class="btn btn-default btn-sm"
title="{{ 'Edit' | translate}}">
<i class="fa fa-pencil"></i>
</a>
</div> </div>
<h1>{{ customslide.agenda_item.getTitle() }}</h1> <h1>{{ customslide.agenda_item.getTitle() }}</h1>
<h2 translate>Agenda item</h2> <h2 translate>Agenda item</h2>

View File

@ -1,6 +1,10 @@
<h1 ng-if="model.id" translate>Edit agenda item</h1> <h1 ng-if="model.id" translate>Edit agenda item</h1>
<h1 ng-if="!model.id" translate>New agenda item</h1> <h1 ng-if="!model.id" translate>New agenda item</h1>
<alert ng-show="alert.show" type="{{ alert.type }}" ng-click="alert={}" close="alert={}">
{{ alert.msg }}
</alert>
<form name="customslideForm" ng-submit="save(model)"> <form name="customslideForm" ng-submit="save(model)">
<formly-form model="model" fields="formFields"> <formly-form model="model" fields="formFields">
<button type="submit" ng-disabled="customslideForm.$invalid" class="btn btn-primary" translate> <button type="submit" ng-disabled="customslideForm.$invalid" class="btn btn-primary" translate>

View File

@ -605,10 +605,13 @@ angular.module('OpenSlidesApp.motions.site', ['OpenSlidesApp.motions'])
Tag.bindAll({}, $scope, 'tags'); Tag.bindAll({}, $scope, 'tags');
User.bindAll({}, $scope, 'users'); User.bindAll({}, $scope, 'users');
Workflow.bindAll({}, $scope, 'workflows'); Workflow.bindAll({}, $scope, 'workflows');
$scope.alert = {};
// set initial values for form model // set initial values for form model by create deep copy of motion object
$scope.model = motion; // so list/detail view is not updated while editing
$scope.model = angular.copy(motion);
$scope.model.more = false; $scope.model.more = false;
// get all form fields // get all form fields
$scope.formFields = MotionForm.getFormFields(); $scope.formFields = MotionForm.getFormFields();
// override default values for update form // override default values for update form
@ -637,9 +640,22 @@ angular.module('OpenSlidesApp.motions.site', ['OpenSlidesApp.motions'])
// save motion // save motion
$scope.save = function (motion) { $scope.save = function (motion) {
// inject the changed motion (copy) object back into DS store
Motion.inject(motion);
// save change motion object on server
Motion.save(motion, { method: 'PATCH' }).then( Motion.save(motion, { method: 'PATCH' }).then(
function(success) { function(success) {
$scope.closeThisDialog(); $scope.closeThisDialog();
},
function (error) {
// save error: revert all changes by restore
// (refresh) original motion object from server
Motion.refresh(motion);
var message = '';
for (var e in error.data) {
message += e + ': ' + error.data[e] + ' ';
}
$scope.alert = {type: 'danger', msg: message, show: true};
} }
); );
}; };

View File

@ -1,6 +1,10 @@
<h1 ng-if="model.id" translate>Edit motion</h1> <h1 ng-if="model.id" translate>Edit motion</h1>
<h1 ng-if="!model.id" translate>New motion</h1> <h1 ng-if="!model.id" translate>New motion</h1>
<alert ng-show="alert.show" type="{{ alert.type }}" ng-click="alert={}" close="alert={}">
{{ alert.msg }}
</alert>
<form name="motionForm" ng-submit="save(model)"> <form name="motionForm" ng-submit="save(model)">
<formly-form model="model" fields="formFields"> <formly-form model="model" fields="formFields">
<button type="submit" ng-disabled="motionForm.$invalid" class="btn btn-primary" translate> <button type="submit" ng-disabled="motionForm.$invalid" class="btn btn-primary" translate>