Skip to content

U
ulakbus-ui
Commit 9ced9654 authored by Bahadir Can Yildiz's avatar Bahadir Can Yildiz
Browse files
Options

CHANGE rref #5257, refs GH-98. Created universal modal, for using in modal... 

CHANGE rref #5257, refs GH-98. Created universal modal, for using in modal controller, bund with confirm button
parent ae77eb45
Hide whitespace changes
Inline Side-by-side
Showing with 138 additions and 63 deletions
app/components/uitemplates/form_service_pg.html
View file @ 9ced9654
<div> <div>
<select ng-model="selection" ng-options="forms.indexOf(form) as form.name for form in forms" ng-change="selectform(selection)"> <select ng-model="selection" ng-options="trialList.indexOf(trial) as trial.name for trial in trialList" ng-change="selectform(selection)">
</select> </select>
<div class="container"> <div class="container">
<div class="row"> <div class="row">
<div class="col-xs-6 center"> <div class="col-xs-8 center">
<form sf-schema="schema" sf-form="form" sf-model="model"></form> <form sf-schema="schema" sf-form="form" sf-model="model"></form>
</div> </div>
</div> </div>
......
app/components/uitemplates/uitemplates.js
View file @ 9ced9654
...@@ -6,7 +6,7 @@ ...@@ -6,7 +6,7 @@
* (GPLv3). See LICENSE.txt for details. * (GPLv3). See LICENSE.txt for details.
*/ */
angular.module('ulakbus.uitemplates', ['ngRoute', 'ulakbus.formService']) angular.module('ulakbus.uitemplates', ['ngRoute', 'ulakbus.crud'])
.controller('NewDesignsCtrl', function ($scope) { .controller('NewDesignsCtrl', function ($scope) {
...@@ -14,13 +14,13 @@ angular.module('ulakbus.uitemplates', ['ngRoute', 'ulakbus.formService']) ...@@ -14,13 +14,13 @@ angular.module('ulakbus.uitemplates', ['ngRoute', 'ulakbus.formService'])
$scope.selection = $scope.items[0]; $scope.selection = $scope.items[0];
}) })
.controller('FormServicePg', function ($scope, Generator) { .controller('FormServicePg', function ($scope, Generator, CrudUtility) {
/* /*
This controller is for testing new SchemaForm components. In addition, forms need to have the attribute: This controller is for testing new SchemaForm components. In addition, forms need to have the attribute:
"name" for defining the name shown in dropdown box. Paste the JSON of form as a member of $scope.forms. "name" for defining the name shown in dropdown box. Paste the JSON of form as a member of $scope.forms.
*/ */
$scope.forms = [ $scope.trialList = [
{ {
name: 'Deneme Form 1', name: 'Deneme Form 1',
form: ['email', 'id', 'name', 'valid'], form: ['email', 'id', 'name', 'valid'],
...@@ -51,10 +51,11 @@ angular.module('ulakbus.uitemplates', ['ngRoute', 'ulakbus.formService']) ...@@ -51,10 +51,11 @@ angular.module('ulakbus.uitemplates', ['ngRoute', 'ulakbus.formService'])
type:'confirm', type:'confirm',
confirm_message:"Lorem Ipsum Dolor Sit Amet", confirm_message:"Lorem Ipsum Dolor Sit Amet",
buttons: [ buttons: [
{ text: "button 1", style: "btn-warning", dismiss: true }, { text: "button 1", cmd:"zeaaa", style: "btn-warning", dismiss: true},
{ text: "button 2", cmd:"cmd1", style: "btn-success"}, { text: "button 2", cmd:"cmd1", style: "btn-success"},
], ],
readonly:"true"} readonly:"true",
form_validate: false}
}, required: [], type: 'object', title: 'servicetest' }, required: [], type: 'object', title: 'servicetest'
}, },
model: { model: {
...@@ -64,10 +65,13 @@ angular.module('ulakbus.uitemplates', ['ngRoute', 'ulakbus.formService']) ...@@ -64,10 +65,13 @@ angular.module('ulakbus.uitemplates', ['ngRoute', 'ulakbus.formService'])
]; ];
$scope.form_params = {}; $scope.form_params = {};
$scope.selection = 0; $scope.selection = 0;
$scope.meta = {};
$scope.selectform = function (index) { $scope.selectform = function (index) {
var form = $scope.forms[index]; var data = { forms: $scope.trialList[index] };
$scope = Generator.generate($scope, {forms: form}); CrudUtility.listPageItems($scope, data);
Generator.generate($scope, data);
Generator.setPageData({pageData: false});
}; };
$scope.selectform($scope.selection); $scope.selectform($scope.selection);
}); });
\ No newline at end of file
app/shared/templates/confirm.html
View file @ 9ced9654
...@@ -2,19 +2,19 @@ ...@@ -2,19 +2,19 @@
<button class="btn {{ form.style || 'btn-default' }}" <button class="btn {{ form.style || 'btn-default' }}"
type="button" type="button"
ng-disabled="form.readonly" ng-disabled="form.readonly"
ng-click="form.openModal(form)"> ng-click="form.openModal()">
<span ng-if="form.icon" class="{{form.icon}}"></span> <span ng-if="form.icon" class="{{form.icon}}"></span>
{{form.title}} {{form.title}}
</button> </button>
<script type="text/ng-template" id="confirmModalTemplate.html"> <!--<script type="text/ng-template" id="confirmModalTemplate.html">-->
<div class="modal-header"> <!--<div class="modal-header">-->
<h3 class="modal-title">{{form.title}}</h3> <!--<h3 class="modal-title">{{form.title}}</h3>-->
</div> <!--</div>-->
<div class="modal-body"> <!--<div class="modal-body">-->
<p>{{form.confirm_message}}</p> <!--<p>{{form.confirm_message}}</p>-->
</div> <!--</div>-->
<div class="modal-footer"> <!--<div class="modal-footer">-->
<button ng-repeat="b in form.buttons" class="btn {{b.style || 'btn-default'}}" type="button" ng-click="form.send(b.cmd,(b.dismiss || false))">{{b.text}}</button> <!--<button ng-repeat="b in form.buttons" class="btn {{b.style || 'btn-default'}}" type="button" ng-click="form.send(b.cmd,(b.dismiss || false))">{{b.text}}</button>-->
</div> <!--</div>-->
</script> <!--</script>-->
</div> </div>
\ No newline at end of file
app/shared/templates/confirmModalContent.html 0 → 100644
View file @ 9ced9654
<div class="modal-header">
<h3 class="modal-title">{{form.title}}</h3>
</div>
<div class="modal-body">
<p>{{form.confirm_message}}</p>
</div>
<div class="modal-footer">
<button ng-repeat="b in form.buttons" class="btn {{b.style || 'btn-default'}}" type="button" ng-click="form.onClick(b.cmd)">{{b.text}}</button>
</div>
\ No newline at end of file
app/shared/templates/listnodeModalContent.html
View file @ 9ced9654
...@@ -3,6 +3,5 @@ ...@@ -3,6 +3,5 @@
<form name="modalForm" sf-schema="schema" sf-form="form" sf-model="model" modal-form-locator></form> <form name="modalForm" sf-schema="schema" sf-form="form" sf-model="model" modal-form-locator></form>
</div> </div>
<div class="modal-footer"> <div class="modal-footer">
<button type="submit" class="btn btn-primary" ng-click="onNodeSubmit()">Tamam</button> <button ng-repeat="b in buttons" type="{{b.type}}" class="btn {{b.style || 'btn-default'}}" ng-click="onNodeBtnClk(b)">{{b.text}}</button>
<button type="button" class="btn btn-warning" ng-click="cancel()">İptal</button>
</div> </div>
\ No newline at end of file
app/zetalib/form_service.js
View file @ 9ced9654
...@@ -396,6 +396,7 @@ angular.module('ulakbus.formService', ['ui.bootstrap']) ...@@ -396,6 +396,7 @@ angular.module('ulakbus.formService', ['ui.bootstrap'])
model_name: k, model_name: k,
inline_edit: scope.inline_edit inline_edit: scope.inline_edit
}, },
buttons: v.buttons,
url: scope.url, url: scope.url,
wf: v.wf || scope.wf, wf: v.wf || scope.wf,
quick_add: v.quick_add, quick_add: v.quick_add,
...@@ -656,24 +657,53 @@ angular.module('ulakbus.formService', ['ui.bootstrap']) ...@@ -656,24 +657,53 @@ angular.module('ulakbus.formService', ['ui.bootstrap'])
// style: "btn-warning", // style: "btn-warning",
// dismiss: false --> this one is for deciding if the button can dismiss modal // dismiss: false --> this one is for deciding if the button can dismiss modal
//}] //}]
modalFunction: function(field){ modalFunction: function(){
this.modalInstance = $uibModal.open({ delete scope.form_params.cmd;
delete scope.form_params.flow;
if (v.cmd) {
scope.form_params["cmd"] = v.cmd;
}
if (v.flow) {
scope.form_params["flow"] = v.flow;
}
if (v.wf) {
delete scope.form_params["cmd"];
scope.form_params["wf"] = v.wf;
}
var modalInstance = $uibModal.open({
animation: true, animation: true,
templateUrl: 'confirmModalTemplate.html', templateUrl: 'shared/templates/confirmModalContent.html',
controller: function ($scope){ controller: 'ModalController',
$scope.form = field; resolve: {
items: function(){
var newscope = {
form: {
title: v.title,
confirm_message: v.confirm_message,
buttons: v.buttons,
onClick: function (cmd) {
// send cmd with submit
modalInstance.dismiss();
if (cmd) generator.submit(scope, false);
}
}
};
return newscope;
}
} }
}); });
}, },
openModal: function(field){ openModal: function(){
var workOnForm = scope.modalElements ? scope.modalElements.workOnForm : 'formgenerated'; var workOnForm = scope.modalElements ? scope.modalElements.workOnForm : 'formgenerated';
if (!v.form_validate && angular.isDefined(v.form_validate)){ if (!v.form_validate && angular.isDefined(v.form_validate)){
this.modalFunction(field); this.modalFunction();
} }
else{ else{
scope.$broadcast('schemaFormValidate'); scope.$broadcast('schemaFormValidate');
if (scope[workOnForm].$valid) { if (scope[workOnForm].$valid) {
this.modalFunction(field); this.modalFunction();
} else { } else {
// focus to first input with validation error // focus to first input with validation error
$timeout(function () { $timeout(function () {
...@@ -682,15 +712,7 @@ angular.module('ulakbus.formService', ['ui.bootstrap']) ...@@ -682,15 +712,7 @@ angular.module('ulakbus.formService', ['ui.bootstrap'])
}); });
} }
} }
},
send: function (cmd, dismiss) {
// send cmd with submit
delete scope.form_params.cmd;
scope.form_params['cmd'] = v.cmd;
if (dismiss) this.modalInstance.dismiss('cancel');
if (cmd) generator.submit(scope, false);
} }
}; };
} }
}, },
...@@ -967,31 +989,61 @@ angular.module('ulakbus.formService', ['ui.bootstrap']) ...@@ -967,31 +989,61 @@ angular.module('ulakbus.formService', ['ui.bootstrap'])
* @returns {*} * @returns {*}
*/ */
generator.doItemAction = function ($scope, key, todo, mode) { generator.doItemAction = function ($scope, key, todo, mode) {
$scope.form_params.cmd = todo.cmd;
$scope.form_params.wf = $scope.wf;
if (todo.wf) {
$scope.url = todo.wf;
$scope.form_params.wf = todo.wf;
delete $scope.token;
delete $scope.form_params.model;
delete $scope.form_params.cmd
}
if (todo.object_key) {
$scope.form_params[todo.object_key] = key;
} else {
$scope.form_params.object_id = key;
}
$scope.form_params.param = $scope.param;
$scope.form_params.id = $scope.param_id;
$scope.form_params.token = $scope.token;
var _do = { var _do = {
normal: function () { normal: function () {
$log.debug('normal mode starts'); $log.debug('normal mode starts');
$scope.form_params.cmd = todo.cmd;
$scope.form_params.wf = $scope.wf;
if (todo.wf) {
$scope.url = todo.wf;
$scope.form_params.wf = todo.wf;
delete $scope.token;
delete $scope.form_params.model;
delete $scope.form_params.cmd
}
if (todo.object_key) {
$scope.form_params[todo.object_key] = key;
} else {
$scope.form_params.object_id = key;
}
$scope.form_params.param = $scope.param;
$scope.form_params.id = $scope.param_id;
$scope.form_params.token = $scope.token;
return generator.get_wf($scope); return generator.get_wf($scope);
}, },
modal: function () { modal: function () {
$log.debug('modal mode is not not ready'); $log.debug('modal mode starts');
var modalInstance = $uibModal.open({
animation: true,
backdrop: 'static',
keyboard: false,
templateUrl: 'shared/templates/confirmModalContent.html',
controller: 'ModalController',
size: '',
resolve: {
items: function () {
var newscope = {
form: {
buttons: [ { text: "Evet", style: "btn-success", cmd:"confirm" }, { text: "Hayir", "style": "btn-warning", dismiss: true } ],
title: todo.name,
confirm_message: "Islemi onayliyor musunuz?",
onClick: function(cmd){
modalInstance.close();
if (cmd === "confirm" && angular.isDefined(cmd)) {
modalInstance.close();
return generator.get_wf($scope);
}
}
}
}
return newscope;
}
}
});
}, },
new: function () { new: function () {
$log.debug('new mode is not not ready'); $log.debug('new mode is not not ready');
...@@ -1361,11 +1413,23 @@ angular.module('ulakbus.formService', ['ui.bootstrap']) ...@@ -1361,11 +1413,23 @@ angular.module('ulakbus.formService', ['ui.bootstrap'])
} }
}; };
$scope.onNodeSubmit = function () { $scope.onNodeBtnClk = function (button) {
$scope.$broadcast('schemaFormValidate'); if(!button.form_validate && angular.isDefined(button.form_validate)){
if ($scope.modalForm.$valid) {
$uibModalInstance.close($scope); $uibModalInstance.close($scope);
} }
else{
$scope.$broadcast('schemaFormValidate');
if ($scope.modalForm.$valid) {
$uibModalInstance.close($scope);
}
else {
// focus to first input with validation error
$timeout(function () {
var firsterror = angular.element(document.querySelectorAll('input.ng-invalid'))[0];
firsterror.focus();
});
}
}
}; };
$scope.cancel = function () { $scope.cancel = function () {
......
dist/templates.js
View file @ 9ced9654
...@@ -2843,8 +2843,7 @@ angular.module("shared/templates/listnodeModalContent.html", []).run(["$template ...@@ -2843,8 +2843,7 @@ angular.module("shared/templates/listnodeModalContent.html", []).run(["$template
" <form name=\"modalForm\" sf-schema=\"schema\" sf-form=\"form\" sf-model=\"model\" modal-form-locator></form>\n" + " <form name=\"modalForm\" sf-schema=\"schema\" sf-form=\"form\" sf-model=\"model\" modal-form-locator></form>\n" +
"</div>\n" + "</div>\n" +
"<div class=\"modal-footer\">\n" + "<div class=\"modal-footer\">\n" +
" <button type=\"submit\" class=\"btn btn-primary\" ng-click=\"onNodeSubmit()\">Tamam</button>\n" + " <button ng-repeat=\"b in schema.buttons\" type=\"{{b.type}}\" class=\"btn {{b.style || 'btn-default'}}\" ng-click=\"onNodeSubmit(b)\">{{b.text}}</button>\n" +
" <button type=\"button\" class=\"btn btn-warning\" ng-click=\"cancel()\">İptal</button>\n" +
"</div>"); "</div>");
}]); }]);
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment