Skip to content

U
ulakbus-ui
Commit a20045b1 authored by Evren Kutar's avatar Evren Kutar
Browse files
Options

breadcrumb without actual links 

links updated
dropdown fix
nodetable to seperate file to reuse
parent 5300be68
Hide whitespace changes
Inline Side-by-side
Showing with 299 additions and 72 deletions
app/app.js
View file @ a20045b1
......@@ -24,7 +24,7 @@ var app = angular.module(
//'ulakbus.version',
'schemaForm',
'gettext',
'templates-prod'
//'templates-prod'
]).
/**
* RESTURL is the url of rest api to talk
......
app/app_routes.js
View file @ a20045b1
......@@ -10,19 +10,19 @@ app.config(['$routeProvider', function ($routeProvider) {
templateUrl: 'components/dashboard/dashboard.html',
controller: 'DashCtrl'
})
.when('/crud/:model/add', {
.when('/:model/add', {
templateUrl: 'components/crud/templates/add.html',
controller: 'CRUDAddEditCtrl'
})
.when('/crud/:model/edit/:id', {
.when('/:model/edit/:id', {
templateUrl: 'components/crud/templates/add.html',
controller: 'CRUDAddEditCtrl'
})
.when('/crud/:model', {
.when('/:model', {
templateUrl: 'components/crud/templates/list.html',
controller: 'CRUDListCtrl'
})
.when('/crud/:model/:id', {
.when('/:model/:id', {
templateUrl: 'components/crud/templates/show.html',
controller: 'CRUDShowCtrl'
})
......
app/components/crud/templates/list.html
View file @ a20045b1
......@@ -3,7 +3,12 @@
<table class="table table-bordered" style="background-color:#fff;">
<thead>
<tr>
<th colspan="2">#</th>
<th colspan="2">
<label>
<input type="checkbox" style="zoom:1.5; margin:5px 0 0 8px;">
Hepsini Seç
</label>
</th>
<th ng-repeat="(key,value) in objects[0].data">{{ key }}</th>
<th>action</th>
</tr>
......@@ -18,10 +23,27 @@
<th scope="row" style="text-align:center">1</th>
<td ng-repeat="(key,value) in object.data">{{value}}</td>
<td>
<a ng-href="#/crud/{{model}}/edit/{{object.key}}">Edit</a><br>
<a ng-href="#/crud/{{model}}/{{object.key}}">Show</a>
<a ng-href="#/{{model}}/edit/{{object.key}}">Edit</a><br>
<a ng-href="#/{{model}}/{{object.key}}">Show</a>
</td>
</tr>
</tbody>
</table>
<div class="btn-group">
<button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-haspopup="true"
aria-expanded="false">
İşlemler <span class="caret"></span>
</button>
<ul class="dropdown-menu">
<li><a href="">İşlem 1</a></li>
<li><a href="">İşlem 2</a></li>
<li><a href="">İşlem 3</a></li>
<li role="separator" class="divider"></li>
<li><a href="">İşlem 4</a></li>
</ul>
</div>
<hr>
</div>
\ No newline at end of file
app/index.html
View file @ a20045b1
......@@ -64,6 +64,7 @@
<script src="bower_components/angular/angular.min.js"></script>
<script src="bower_components/jquery/dist/jquery.min.js"></script>
<script src="bower_components/bootstrap/dist/js/bootstrap.min.js"></script>
<script src="bower_components/angular-route/angular-route.min.js"></script>
<script src="bower_components/angular-cookies/angular-cookies.min.js"></script>
<script src="bower_components/angular-resource/angular-resource.min.js"></script>
......
app/shared/directives.js
View file @ a20045b1
......@@ -45,19 +45,22 @@ app.directive('headerSubMenu', function () {
// todo: double make it but single not solve this!
angular.element($('#submitbutton')).triggerHandler('click');
angular.element($('#submitbutton')).triggerHandler('click');
//$scope.$broadcast('schemaFormValidate');
//$scope.onSubmit(angular.element($('#submitbutton')).scope().formgenerated);
}
}
}
});
// todo: unused delete
app.directive('headerSubMenuButtons', function () {
app.directive('headerBreadcrumb', function ($location) {
return {
templateUrl: 'shared/templates/directives/header-sub-menu-buttons.html',
templateUrl: 'shared/templates/directives/header-breadcrumb.html',
restrict: 'E',
replace: true
replace: true,
link: function($scope){
$scope.$watch('$routeUpdate', function(){
// todo: create actual links
$scope.links = $location.path().split('/');
});
}
}
});
......
app/shared/templates/add.html
View file @ a20045b1
<h1>{{ schema.title }}</h1>
<form id="formgenerated" name="formgenerated" sf-schema="schema" sf-form="form" sf-model="model"></form>
<div ng-repeat="node in nodes">
<h3>{{ node.title }}
<span ng-if="node.lengthModels < 1">
<a href="javascript:void(0);" add-modal-for-node={{node.title}}>
<i class="fa fa-plus-circle fa-fw"></i>
</a>
</span>
</h3>
<ng-include src="'shared/templates/nodeTable.html'" ng-if="node.lengthModels > 0"></ng-include>
<hr>
</div>
<div ng-repeat="node in listnodes">
<h3>{{ node.title }}
<span>
......@@ -8,33 +19,10 @@
</a>
</span>
</h3>
<table class="table table-bordered" style="background-color:#fff;">
<thead>
<tr>
<th colspan="2">#</th>
<th ng-repeat="(key,value) in node.fields">{{ value.title }}</th>
<th>action</th>
</tr>
</thead>
<tbody>
<tr>
<td width="60">
<label>
<input type="checkbox" style="zoom:1.5; margin:5px 0 0 8px;">
</label>
</td>
<th scope="row" style="text-align:center">1</th>
<td ng-repeat="(key,value) in node.models">{{ value.value }}</td>
<td>
<a ng-href="#/crud/{{model}}/edit/{{object.key}}">Edit</a><br>
<a ng-href="#/crud/{{model}}/{{object.key}}">Show</a>
<a ng-href="#/crud/{{model}}/{{object.key}}">Delete</a>
</td>
</tr>
</tbody>
</table>
<ng-include src="'shared/templates/nodeTable.html'" ng-if="node.lengthModels > 0"></ng-include>
<hr>
</div>
<button id="submitbutton" type="button" class="btn btn-primary" ng-click="onSubmit(formgenerated)">Kaydet</button>
<button type="button" class="btn btn-warning">Düzenle</button> <!-- todo: make it conditional -->
<button type="button" class="btn btn-danger">İptal</button> <!-- todo: turn back to previous page -->
\ No newline at end of file
<!-- <button type="button" class="btn btn-warning">Düzenle</button> todo: make it conditional -->
<!-- <button type="button" class="btn btn-danger">İptal</button> todo: turn back to previous page -->
\ No newline at end of file
app/shared/templates/directives/header-sub-menu-buttons.html deleted 100644 → 0
View file @ 5300be68
<button type="button" class="btn btn-primary" ng-click="onSubmit(formgenerated)">Kaydet</button>
<button type="button" class="btn btn-warning">Düzenle</button>
<button type="button" class="btn btn-danger">İptal</button>
\ No newline at end of file
app/shared/templates/directives/header-sub-menu.html
View file @ a20045b1
<div class="manager-view-header container-fluid">
<ul class="breadcrumb">
<li><a href="#">Personeller</a></li>
<li><a href="#">Liste</a></li>
<li class="active">Tablo</li>
</ul>
<!--<header-sub-menu-buttons></header-sub-menu-buttons>-->
<header-breadcrumb></header-breadcrumb>
<div id="header-buttons">
<button type="button" class="btn btn-primary" ng-click="triggerSubmit()">Kaydet</button>
<button type="button" class="btn btn-warning">Düzenle</button>
<button type="button" class="btn btn-danger">İptal</button>
<!--<button type="button" class="btn btn-warning">Düzenle</button>-->
<!--<button type="button" class="btn btn-danger">İptal</button>-->
</div>
</div>
\ No newline at end of file
app/shared/templates/directives/sidebar.html
View file @ a20045b1
......@@ -13,10 +13,10 @@
class="fa arrow"></span></a>
<ul class="nav nav-second-level" collapse="collapseVar!={{key}}">
<li ui-sref-active="active">
<a href="#/crud/{{item}}">List</a>
<a href="#/{{item}}">List</a>
</li>
<li ui-sref-active="active">
<a href="#/crud/{{item}}/add">Add</a>
<a href="#/{{item}}/add">Add</a>
</li>
</ul>
<!-- /.nav-second-level -->
......
app/shared/templates/foreignKey.html
View file @ a20045b1
......@@ -19,7 +19,7 @@
<div class="help-block" sf-message="form.description"></div>
</div>
<div class="col-md-4">
<a href="javascript:void(0);" add-modal>
<a href="javascript:void(0);" add-modal-for-linked-model>
<i class="fa fa-plus-circle fa-fw"></i>
</a>
</div>
......
app/shared/templates/nodeTable.html 0 → 100644
View file @ a20045b1
<table class="table table-bordered" style="background-color:#fff;">
<thead>
<tr>
<th colspan="2">#</th>
<th ng-repeat="(key,value) in node.fields">{{ value.title }}</th>
<th>action</th>
</tr>
</thead>
<tbody>
<tr>
<td width="60">
<label>
<input type="checkbox" style="zoom:1.5; margin:5px 0 0 8px;">
</label>
</td>
<th scope="row" style="text-align:center">1</th>
<td ng-repeat="(key,value) in node.models">{{ value.value }}</td>
<td>
<a ng-href="#/crud/{{model}}/edit/{{object.key}}">Edit</a><br>
<a ng-href="#/crud/{{model}}/{{object.key}}">Show</a>
<a ng-href="#/crud/{{model}}/{{object.key}}">Delete</a>
</td>
</tr>
</tbody>
</table>
\ No newline at end of file
app/zetalib/forms/form_service.js
View file @ a20045b1
......@@ -21,6 +21,8 @@ form_generator.factory('Generator', function ($http, $q, $log, $modal, $timeout,
for (var key in forms)
scope[key] = forms[key];
// initialModel will be used in formDiff when submiting the form to submit only
scope.initialModel = angular.copy(scope.model);
// if fieldset in form, make it collapsable with template
......@@ -32,7 +34,7 @@ form_generator.factory('Generator', function ($http, $q, $log, $modal, $timeout,
if (k.type == 'date') {
k.type = 'string';
//// seek for datepicker field and initialize datepicker
// seek for datepicker field and initialize datepicker
scope.$watch($('#'+v), function(){
$timeout(function () {
jQuery('#' + v).datepicker();
......@@ -53,11 +55,11 @@ form_generator.factory('Generator', function ($http, $q, $log, $modal, $timeout,
formitem = {
"type": "template",
"templateUrl": "shared/templates/foreignKey.html",
"title": k.model_name,
"title": k.title
};
k.title = k.model_name;
var modelscope = {"url": scope.url, "form_params": {model: k.model_name}};
var modelscope = {"url": scope.url, "form_params": {model: k.title}};
// get model objects from db and add to select list
generator.get_list(modelscope).then(function (res) {
......@@ -75,24 +77,30 @@ form_generator.factory('Generator', function ($http, $q, $log, $modal, $timeout,
}
if (k.type == 'ListNode') {
scope.form.splice([scope.form.indexOf(v)], 1);
// if listnode remove from form to generate its own form
//scope.form.splice([scope.form.indexOf(v)], 1);
scope.listnodes = scope.listnodes ? scope.listnodes : {};
console.log(k, '<=====>', scope.model[k.title]);
//debugger;
scope.listnodes[k.title] = (k);
scope.listnodes[k.title]['fields'] = scope.model[k.title][0].fields;
scope.listnodes[k.title]['models'] = scope.model[k.title][0].models;
// lengthModels is length of the listnode models. if greater than 0 show records on template
scope.listnodes[k.title]['lengthModels'] = scope.listnodes[k.title]['models'].length;
scope.listnodes[k.title]['lengthModels'] = 1;
//scope.model[k.title] = [];
debugger;
}
if (k.type == 'Node') {
scope.form.splice([scope.form.indexOf(v)], 1);
//scope.form.splice([scope.form.indexOf(v)], 1);
scope.nodes = scope.nodes ? scope.nodes : {};
scope.nodes[k.title] = (k);
scope.nodes[k.title]['fields'] = scope.model[k.title][0].fields;
scope.nodes[k.title]['models'] = scope.model[k.title][0].models;
// lengthModels is length of the node models. if greater than 0 show records on template
scope.nodes[k.title]['lengthModels'] = scope.nodes[k.title]['models'].length;
// todo: learn what node model will be?
//scope.model[k.title] = [];
}
});
scope.isCollapsed = true;
......@@ -108,7 +116,6 @@ form_generator.factory('Generator', function ($http, $q, $log, $modal, $timeout,
//angular.forEach(formObject.objects, function(k, v) {
// check if date string and convert to date object
// todo: catch date object and convert
//debugger;
//});
return Date(formObject);
};
......@@ -120,7 +127,6 @@ form_generator.factory('Generator', function ($http, $q, $log, $modal, $timeout,
// todo: cover all other exceptions (4xx, 5xx)
});
};
generator.get_list = function (scope) {
return $http
.post(generator.makeUrl(scope.url), scope.form_params)
......@@ -198,13 +204,61 @@ form_generator.controller('ModalCtrl', function ($scope, $modalInstance, $route,
});
/**
* modal directive for listnodes and nodes
* add modal directive for listnodes
* @params: $modal, Generator
* @return: openmodal directive
*/
// todo: use generator.openmodal instead
form_generator.directive('addModalForListNode', function ($modal, Generator) {
return {
link: function (scope, element, attributes) {
element.on('click', function () {
var modalInstance = $modal.open({
animation: false,
templateUrl: 'shared/templates/listnodeModalContent.html',
controller: 'ModalCtrl',
size: 'lg',
resolve: {
items: function () {
// get node from parent scope catch with attribute
var node = scope.$parent.$parent.listnodes[attributes['addModalForListNode']];
var items = {form: [], schema: {properties: {}, title: node.title, type: "object"}, model: {}};
angular.forEach(node.fields, function (item) {
debugger;
items.schema.properties[item.name] = item;
items.model[item.name] = item.value;
// idx field must be hidden
if (item.name != 'idx') {
items.form.push({type: item.type, key: item.name});
} else {
items.form.push({type: item.type, key: item.name, htmlClass: 'hidden'});
}
});
return Generator.generate(scope, items);
}
}
});
modalInstance.result.then(function (childmodel, key) {
// subfix will be remove
//var subfix = scope.schema.title.replace(/([a-z])([A-Z])/g, '$1_$2').toLowerCase();
// todo: run form validator here
debugger;
scope.$parent.model[scope.schema.title].push(scope.model);
});
});
}
}
});
/**
* edit modal directive for listnodes
* @params: $modal, Generator
* @return: openmodal directive
*/
// todo: edit modal make work properly
form_generator.directive('editModalForListNode', function ($modal, Generator) {
return {
link: function (scope, element, attributes) {
element.on('click', function () {
......@@ -217,10 +271,17 @@ form_generator.directive('addModalForListNode', function ($modal, Generator) {
items: function () {
// get node from parent scope catch with attribute
var node = angular.copy(scope.$parent.$parent.listnodes[attributes['addModalForListNode']]);
var items = {form: ['*'], schema: {properties: {}, title: node.title, type: "object"}, model: {}};
var items = {form: [], schema: {properties: {}, title: node.title, type: "object"}, model: {}};
angular.forEach(node.fields, function (item) {
items.schema.properties[item.name] = item;
items.model[item.name] = item.value;
// idx field must be hidden
if (item.name != 'idx') {
items.form.push({type: item.type, key: item.name});
} else {
items.form.push({type: item.type, key: item.name, htmlClass: 'hidden'});
}
});
return Generator.generate(scope, items);
}
......@@ -228,7 +289,10 @@ form_generator.directive('addModalForListNode', function ($modal, Generator) {
});
modalInstance.result.then(function (childmodel, key) {
var subfix = scope.schema.title.replace(/([a-z])([A-Z])/g, '$1_$2').toLowerCase();
// subfix will be remove
//var subfix = scope.schema.title.replace(/([a-z])([A-Z])/g, '$1_$2').toLowerCase();
// todo: run form validator here
debugger;
scope.$parent.model[scope.schema.title].push(scope.model);
});
});
......@@ -237,12 +301,142 @@ form_generator.directive('addModalForListNode', function ($modal, Generator) {
});
/**
* modal directive for linked models
* add modal directive for nodes
* @params: $modal, Generator
* @return: openmodal directive
*/
form_generator.directive('addModalForNode', function ($modal, Generator) {
return {
link: function (scope, element, attributes) {
element.on('click', function () {
var modalInstance = $modal.open({
animation: false,
templateUrl: 'shared/templates/listnodeModalContent.html',
controller: 'ModalCtrl',
size: 'lg',
resolve: {
items: function () {
// get node from parent scope catch with attribute
var node = angular.copy(scope.$parent.$parent.nodes[attributes['addModalForNode']]);
var items = {form: [], schema: {properties: {}, title: node.title, type: "object"}, model: {}};
angular.forEach(node.fields, function (item) {
items.schema.properties[item.name] = item;
items.model[item.name] = item.value;
// idx field must be hidden
if (item.name != 'idx') {
items.form.push({type: item.type, key: item.name});
} else {
items.form.push({type: item.type, key: item.name, htmlClass: 'hidden'});
}
});
return Generator.generate(scope, items);
}
}
});
modalInstance.result.then(function (childmodel, key) {
// subfix will be remove
//var subfix = scope.schema.title.replace(/([a-z])([A-Z])/g, '$1_$2').toLowerCase();
// todo: run form validator here
debugger;
scope.$parent.model[scope.schema.title].push(scope.model);
});
});
}
}
});
/**
* edit modal directive for nodes
* @params: $modal, Generator
* @return: openmodal directive
*/
// todo: edit modal make work properly
form_generator.directive('editModalForNode', function ($modal, Generator) {
return {
link: function (scope, element, attributes) {
element.on('click', function () {
var modalInstance = $modal.open({
animation: false,
templateUrl: 'shared/templates/listnodeModalContent.html',
controller: 'ModalCtrl',
size: 'lg',
resolve: {
items: function () {
// get node from parent scope catch with attribute
var node = angular.copy(scope.$parent.$parent.nodes[attributes['addModalForNode']]);
var items = {form: [], schema: {properties: {}, title: node.title, type: "object"}, model: {}};
angular.forEach(node.fields, function (item) {
items.schema.properties[item.name] = item;
items.model[item.name] = item.value;
// idx field must be hidden
if (item.name != 'idx') {
items.form.push({type: item.type, key: item.name});
} else {
items.form.push({type: item.type, key: item.name, htmlClass: 'hidden'});
}
});
return Generator.generate(scope, items);
}
}
});
modalInstance.result.then(function (childmodel, key) {
// subfix will be remove
//var subfix = scope.schema.title.replace(/([a-z])([A-Z])/g, '$1_$2').toLowerCase();
// todo: run form validator here
debugger;
scope.$parent.model[scope.schema.title].push(scope.model);
});
});
}
}
});
/**
* add modal directive for linked models
* @params: $modal, Generator
* @return: openmodal directive
*/
form_generator.directive('addModalForLinkedModel', function ($modal, Generator) {
return {
link: function (scope, element) {
element.on('click', function () {
var modalInstance = $modal.open({
animation: false,
templateUrl: 'shared/templates/linkedModelModalContent.html',
controller: 'ModalCtrl',
size: 'lg',
resolve: {
items: function () {
return Generator.get_form({
url: 'crud',
form_params: {'model': scope.form.title, "cmd": "add"}
});
}
}
});
modalInstance.result.then(function (childmodel, key) {
// todo: run form validator here
Generator.submit(scope);
});
});
}
}
});
/**
* edit modal directive for linked models
* @params: $modal, Generator
* @return: openmodal directive
*/
form_generator.directive('addModal', function ($modal, Generator) {
form_generator.directive('editModalForLinkedModel', function ($modal, Generator) {
return {
link: function (scope, element) {
element.on('click', function () {
......@@ -262,6 +456,7 @@ form_generator.directive('addModal', function ($modal, Generator) {
});
modalInstance.result.then(function (childmodel, key) {
// todo: run form validator here
Generator.submit(scope);
});
});
......
index.html
View file @ a20045b1
......@@ -72,6 +72,7 @@
<!-- @if NODE_ENV == 'DEVELOPMENT' -->
<script src="bower_components/angular/angular.min.js"></script>
<script src="bower_components/jquery/dist/jquery.min.js"></script>
<script src="bower_components/bootstrap/dist/js/bootstrap.min.js"></script>
<script src="bower_components/angular-route/angular-route.min.js"></script>
<script src="bower_components/angular-cookies/angular-cookies.min.js"></script>
<script src="bower_components/angular-resource/angular-resource.min.js"></script>
......
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