Skip to content
Snippets Groups Projects
Commit 2b6eda8d authored by Alex ORLUC's avatar Alex ORLUC
Browse files

action administration V2

parent 9e9e92e8
No related branches found
No related tags found
No related merge requests found
<div id="resultInfo" class="fade" style="display:none;">
{{resultInfo}}
</div>
<div *ngIf="loading">
<i class="fa fa-spinner fa-spin fa-5x" style="margin-left: 50%;margin-top: 16%;font-size: 8em"></i>
</div>
<div *ngIf="!loading" class="container-fluid">
<nav class="navbar navbar-default" style="font-size:17px !important;" id="toolBox">
<div class="container-fluid">
<div class="navbar-header">
<a class="navbar-brand" routerLink="/administration/actions" style="cursor: pointer">
<i class="fa fa-arrow-circle-left" title="{{lang.back}}"></i>
</a>
</div>
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<ul class="nav navbar-nav navbar-right">
</ul>
</div>
</div>
</nav>
<h1 style="margin-top: 0"><i class="fa fa-exchange fa-2x"></i> {{lang.pageTitle}}</h1>
<div class="container-fluid" style="border-left:solid 1px white;border-right:solid 1px white;background-color: #CEE9F1;border-top: solid 2px #FDD16C;border-bottom: solid 2px #FDD16C;padding:10px;">
<div class="col-md-6 col-md-offset-3">
<div *ngIf="action.is_system == true" class="alert alert-danger" role="alert"><b>{{lang.action}} {{lang.is_system}} !</b> {{lang.do_not_modify_unless_expert}}</div>
<form class="form-horizontal" (ngSubmit)="onSubmit()" #actionsFormUp="ngForm">
<div class="form-group">
<div class="col-sm-12">
<div class="input-group">
<span class="input-group-addon"><i aria-hidden="true" class="fa fa-tag" title="{{lang.desc}}"></i><sup class="mandatory" title="champ requis">*</sup></span>
<input [(ngModel)]="action.label_action" required class="form-control" name="action_name" id="action_name" title="{{lang.desc}}" type="text" placeholder="{{lang.desc}}" required>
</div>
</div>
</div>
<div class="form-group">
<div class="col-sm-12">
<div class="input-group">
<span class="input-group-addon"><i aria-hidden="true" class="fa fa-check-circle" title="{{lang.associated_status}}"></i></span>
<select [(ngModel)]="action.id_status" class="forms-select form-control" name="status" id="status">
<option *ngFor="let statut of statusList" [value]="statut.id">{{statut.label_status}}</option>
</select>
</div>
</div>
</div>
<div class="form-group">
<div class="col-sm-12">
<div class="input-group">
<span class="input-group-addon"><i aria-hidden="true" class="fa fa-retweet" title="{{lang.action_page}}"></i></span>
<select [(ngModel)]="action.action_page" class="forms-select form-control" name="action_page" id="action_page">
<option title="{{action.desc}}" *ngFor="let action of actionPagesList.actionsPageList" value="{{action.name}}">{{action.label}}</option>
</select>
</div>
</div>
</div>
<div class="form-group">
<div class="col-sm-12">
<div class="input-group">
<span class="input-group-addon"><i aria-hidden="true" class="fa fa-code" title="{{lang.keyword}}"></i></span>
<select [(ngModel)]="action.keyword" class="forms-select form-control" name="keyword" id="keyword">
<option title="{{keyword.desc}}" *ngFor="let keyword of keywordsList" value="{{keyword.value}}">{{keyword.label}}</option>
</select>
</div>
</div>
</div>
<div class="form-group">
<div class="col-sm-6">
<div class="input-group">
<label class="form-control" for="history" title="{{lang.action_history_desc}}">{{lang.action_history}}</label>
<span class="input-group-addon">
<input [(ngModel)]="action.history" name="history" id="history" type="checkbox">
</span>
</div>
</div>
<div class="col-sm-6">
<div class="input-group">
<label class="form-control" for="is_folder_action" title="{{lang.is_folder_action_desc}}">{{lang.is_folder_action}}</label>
<span class="input-group-addon">
<input [(ngModel)]="action.is_folder_action" name="is_folder_action" id="is_folder_action" type="checkbox">
</span>
</div>
</div>
</div>
<div id="categoryAssociationList" class="form-group panel panel-default">
<div class="col-sm-12 panel-heading" style="font-size: 14px;text-align:center;">
<i title="{{lang.selectAll}}" class="fa fa-check-square-o selectAll" data-target="categorieslist" (click)="selectAll($event)"></i>&nbsp;<i title="{{lang.unselectAll}}" class="fa fa-square-o unselectAll" data-target="categorieslist" (click)="unselectAll($event)"></i> {{lang.choose_category_association }}
</div>
<div class="col-sm-12 panel-body">
<select class="forms-select form-control" name="categorieslist[]" id="categorieslist" size="7" multiple="multiple" required>
<option *ngFor="let category of categoriesList" [selected]="category.selected" value="{{category.id}}">{{category.label}}</option>
</select>
</div>
</div>
<div class="col-sm-12 panel-body" style="text-align:center;">
<button class="btn btn-default" type="submit" [disabled]="!actionsFormUp.form.valid" >{{lang.validate}}</button>
<button class="btn btn-default" routerLink='/administration/actions'>{{lang.cancel}}</button>
</div>
</form>
</div>
</div>
</div>
\ No newline at end of file
select.form-control + .chosen-container.chosen-container-single .chosen-single {
display: block;
width: 100%;
height: 34px;
padding: 6px 12px;
font-size: 14px;
line-height: 1.428571429;
color: #555;
vertical-align: middle;
background-color: #fff;
border: 1px solid #ccc;
border-radius: 4px;
-webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,0.075);
box-shadow: inset 0 1px 1px rgba(0,0,0,0.075);
-webkit-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
background-image:none;
}
select.form-control + .chosen-container.chosen-container-single .chosen-single div {
top:4px;
color:#000;
}
select.form-control + .chosen-container .chosen-drop {
background-color: #FFF;
border: 1px solid #CCC;
border: 1px solid rgba(0, 0, 0, 0.15);
border-radius: 4px;
-webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
background-clip: padding-box;
margin: 2px 0 0;
}
select.form-control + .chosen-container .chosen-search input[type=text] {
display: block;
width: 100%;
height: 34px;
padding: 6px 12px;
font-size: 14px;
line-height: 1.428571429;
color: #555;
vertical-align: middle;
background-color: #FFF;
border: 1px solid #CCC;
border-radius: 4px;
-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
-webkit-transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
background-image:none;
}
select.form-control + .chosen-container .chosen-results {
margin: 2px 0 0;
padding: 5px 0;
font-size: 14px;
list-style: none;
background-color: #fff;
margin-bottom: 5px;
}
select.form-control + .chosen-container .chosen-results li ,
select.form-control + .chosen-container .chosen-results li.active-result {
display: block;
padding: 3px 20px;
clear: both;
font-weight: normal;
line-height: 1.428571429;
color: #333;
white-space: nowrap;
background-image:none;
}
select.form-control + .chosen-container .chosen-results li:hover,
select.form-control + .chosen-container .chosen-results li.active-result:hover,
select.form-control + .chosen-container .chosen-results li.highlighted
{
color: #FFF;
text-decoration: none;
background-color: #428BCA;
background-image:none;
}
select.form-control + .chosen-container-multi .chosen-choices {
display: block;
width: 100%;
min-height: 34px;
padding: 6px;
font-size: 14px;
line-height: 1.428571429;
color: #555;
vertical-align: middle;
background-color: #FFF;
border: 1px solid #CCC;
border-radius: 4px;
-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
-webkit-transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
background-image:none;
}
select.form-control + .chosen-container-multi .chosen-choices li.search-field input[type="text"] {
height:auto;
padding:5px 0;
}
select.form-control + .chosen-container-multi .chosen-choices li.search-choice {
background-image: none;
padding: 3px 24px 3px 5px;
margin: 0 6px 0 0;
font-size: 14px;
font-weight: normal;
line-height: 1.428571429;
text-align: center;
white-space: nowrap;
vertical-align: middle;
cursor: pointer;
border: 1px solid #ccc;
border-radius: 4px;
color: #333;
background-color: #FFF;
border-color: #CCC;
}
select.form-control + .chosen-container-multi .chosen-choices li.search-choice .search-choice-close {
top:8px;
right:6px;
}
select.form-control + .chosen-container-multi.chosen-container-active .chosen-choices,
select.form-control + .chosen-container.chosen-container-single.chosen-container-active .chosen-single,
select.form-control + .chosen-container .chosen-search input[type=text]:focus{
border-color: #66AFE9;
outline: 0;
-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075),0 0 8px rgba(102, 175, 233, 0.6);
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075),0 0 8px rgba(102, 175, 233, 0.6);
}
select.form-control + .chosen-container-multi .chosen-results li.result-selected{
display: list-item;
color: #ccc;
cursor: default;
background-color: white;
}
"use strict";
var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
return c > 3 && r && Object.defineProperty(target, key, r), r;
};
var __metadata = (this && this.__metadata) || function (k, v) {
if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
};
Object.defineProperty(exports, "__esModule", { value: true });
var core_1 = require("@angular/core");
var http_1 = require("@angular/http");
require("rxjs/add/operator/map");
var router_1 = require("@angular/router");
var ActionAdministrationComponent = (function () {
function ActionAdministrationComponent(http, route, router) {
this.http = http;
this.route = route;
this.router = router;
this.mode = null;
this.action = {};
this.statusList = [];
this.actionPagesList = [];
this.lang = {};
this.categoriesList = [];
this.keywordsList = [];
this.loading = false;
}
ActionAdministrationComponent.prototype.updateBreadcrumb = function (applicationName) {
if ($j('#ariane')[0]) {
$j('#ariane')[0].innerHTML = "<a href='index.php?reinit=true'>" + applicationName + "</a> > <a onclick='location.hash = \"/administration\"' style='cursor: pointer'>Administration</a> > <a onclick='location.hash = \"/administration/actions\"' style='cursor: pointer'>Actions</a> > Modification";
}
};
ActionAdministrationComponent.prototype.prepareActions = function () {
$j('#inner_content').remove();
};
ActionAdministrationComponent.prototype.ngOnInit = function () {
var _this = this;
this.prepareActions();
this.loading = true;
this.coreUrl = angularGlobals.coreUrl;
this.updateBreadcrumb(angularGlobals.applicationName);
this.route.params.subscribe(function (params) {
if (typeof params['id'] == "undefined") {
_this.mode = 'create';
_this.http.get(_this.coreUrl + 'rest/initAction')
.map(function (res) { return res.json(); })
.subscribe(function (data) {
_this.action = data.action;
_this.lang = data.lang;
_this.lang.pageTitle = _this.lang.modify_action + ' : ' + _this.action.action_id;
_this.categoriesList = data.categoriesList;
_this.statusList = data.statusList;
_this.actionPagesList = data.action_pagesList;
_this.keywordsList = data.keywordsList;
_this.loading = false;
setTimeout(function () {
$j("select").chosen({ width: "100%", disable_search_threshold: 10, search_contains: true });
}, 0);
});
}
else {
_this.mode = 'update';
_this.http.get(_this.coreUrl + 'rest/administration/actions/' + params['id'])
.map(function (res) { return res.json(); })
.subscribe(function (data) {
_this.lang = data.lang;
_this.lang.pageTitle = _this.lang.add + ' ' + _this.lang.action;
_this.action = data.action;
_this.categoriesList = data.categoriesList;
_this.statusList = data.statusList;
_this.actionPagesList = data.action_pagesList;
_this.keywordsList = data.keywordsList;
_this.loading = false;
setTimeout(function () {
$j("select").chosen({ width: "100%", disable_search_threshold: 10, search_contains: true });
}, 0);
});
}
});
};
ActionAdministrationComponent.prototype.onSubmit = function () {
var _this = this;
//affect value of select
this.action.actionCategories = $j("#categorieslist").chosen().val();
this.action.id_status = $j("#status").chosen().val();
this.action.keyword = $j("#keyword").chosen().val();
this.action.action_page = $j("#action_page").chosen().val();
if (this.mode == 'create') {
this.http.post(this.coreUrl + 'rest/actions', this.action)
.map(function (res) { return res.json(); })
.subscribe(function (data) {
_this.router.navigate(['/administration/actions']);
//TO_DO_NOTIF
}, function (errors) {
console.log(errors);
//TO_DO_NOTIF_ERRORS
});
}
else if (this.mode == 'update') {
this.http.put(this.coreUrl + 'rest/actions/' + this.action.id, this.action)
.map(function (res) { return res.json(); })
.subscribe(function (data) {
_this.router.navigate(['/administration/actions']);
//TO_DO_NOTIF
}, function (errors) {
console.log(errors);
//TO_DO_NOTIF_ERRORS
});
}
};
ActionAdministrationComponent.prototype.selectAll = function (event) {
var target = event.target.getAttribute("data-target");
$j('#' + target + ' option').prop('selected', true);
$j('#' + target).trigger('chosen:updated');
};
ActionAdministrationComponent.prototype.unselectAll = function (event) {
var target = event.target.getAttribute("data-target");
$j('#' + target + ' option').prop('selected', false);
$j('#' + target).trigger('chosen:updated');
};
return ActionAdministrationComponent;
}());
ActionAdministrationComponent = __decorate([
core_1.Component({
templateUrl: angularGlobals["action-administrationView"],
styleUrls: ['../../node_modules/bootstrap/dist/css/bootstrap.min.css', 'css/action-administration.component.css']
}),
__metadata("design:paramtypes", [http_1.Http, router_1.ActivatedRoute, router_1.Router])
], ActionAdministrationComponent);
exports.ActionAdministrationComponent = ActionAdministrationComponent;
import { Component, OnInit } from '@angular/core';
import { Http } from '@angular/http';
import 'rxjs/add/operator/map';
import { Router, ActivatedRoute } from '@angular/router';
declare function $j(selector: any) : any;
declare var angularGlobals : any;
@Component({
templateUrl : angularGlobals["action-administrationView"],
styleUrls : ['../../node_modules/bootstrap/dist/css/bootstrap.min.css', 'css/action-administration.component.css']
})
export class ActionAdministrationComponent implements OnInit {
coreUrl : string;
mode : string = null;
action : any = {};
statusList : any[] = [];
actionPagesList : any[] = [];
lang : any = {};
categoriesList : any[] = [];
keywordsList : any[] = [];
resultInfo : string;
loading : boolean = false;
constructor(public http: Http,private route: ActivatedRoute, private router: Router){
}
updateBreadcrumb(applicationName: string) {
if ($j('#ariane')[0]) {
$j('#ariane')[0].innerHTML = "<a href='index.php?reinit=true'>" + applicationName + "</a> > <a onclick='location.hash = \"/administration\"' style='cursor: pointer'>Administration</a> > <a onclick='location.hash = \"/administration/actions\"' style='cursor: pointer'>Actions</a> > Modification";
}
}
prepareActions() {
$j('#inner_content').remove();
}
ngOnInit(): void {
this.prepareActions();
this.loading = true;
this.coreUrl = angularGlobals.coreUrl;
this.updateBreadcrumb(angularGlobals.applicationName);
this.route.params.subscribe(params => {
if(typeof params['id']== "undefined"){
this.mode = 'create';
this.http.get(this.coreUrl + 'rest/initAction')
.map(res => res.json())
.subscribe((data) => {
this.action = data.action;
this.lang = data.lang;
this.lang.pageTitle = this.lang.modify_action+' : '+this.action.action_id
this.categoriesList = data.categoriesList;
this.statusList = data.statusList;
this.actionPagesList = data.action_pagesList;
this.keywordsList = data.keywordsList;
this.loading = false;
setTimeout(() => {
$j("select").chosen({width:"100%",disable_search_threshold: 10, search_contains: true});
}, 0);
});
}
else {
this.mode = 'update';
this.http.get(this.coreUrl + 'rest/administration/actions/' + params['id'])
.map(res => res.json())
.subscribe((data) => {
this.lang= data.lang;
this.lang.pageTitle = this.lang.add+' '+this.lang.action
this.action = data.action;
this.categoriesList = data.categoriesList;
this.statusList = data.statusList;
this.actionPagesList = data.action_pagesList;
this.keywordsList = data.keywordsList;
this.loading = false;
setTimeout(() => {
$j("select").chosen({width:"100%",disable_search_threshold: 10, search_contains: true});
}, 0);
});
}
});
}
onSubmit() {
//affect value of select
this.action.actionCategories = $j("#categorieslist").chosen().val();
this.action.id_status = $j("#status").chosen().val();
this.action.keyword = $j("#keyword").chosen().val();
this.action.action_page = $j("#action_page").chosen().val();
if (this.mode == 'create') {
this.http.post(this.coreUrl + 'rest/actions', this.action)
.map(res => res.json())
.subscribe((data) => {
this.router.navigate(['/administration/actions']);
//TO_DO_NOTIF
},(errors) => {
console.log(errors);
//TO_DO_NOTIF_ERRORS
});
}else if (this.mode == 'update') {
this.http.put(this.coreUrl + 'rest/actions/' + this.action.id, this.action)
.map(res => res.json())
.subscribe((data) => {
this.router.navigate(['/administration/actions']);
//TO_DO_NOTIF
},(errors) => {
console.log(errors);
//TO_DO_NOTIF_ERRORS
});
}
}
selectAll(event){
var target = event.target.getAttribute("data-target");
$j('#' + target + ' option').prop('selected', true);
$j('#' + target).trigger('chosen:updated');
}
unselectAll(event){
var target = event.target.getAttribute("data-target");
$j('#' + target + ' option').prop('selected', false);
$j('#' + target).trigger('chosen:updated');
}
/*createAction() {
delete this.action.id;
delete this.action.coll_categories;
this.http.post(this.coreUrl + 'rest/actions', this.action)
.map(res => res.json())
.subscribe((data) => {
if (data.errors) {
} else {
this.router.navigate(['/administration/actions']);
this.resultInfo = this.lang.action_added;
setTimeout(() => {
$j('#resultInfo').removeClass().addClass('alert alert-success alert-dismissible');
$j("#resultInfo").text(this.lang.action_added);
$j("#resultInfo").fadeTo(3000, 500).slideUp(500, function(){
$j("#resultInfo").slideUp(500);
});
}, 0);
}
}, (errors) => {
$j('#resultInfo').removeClass().addClass('alert alert-danger alert-dismissible');
$j("#resultInfo").text(JSON.parse(errors._body).errors);
$j("#resultInfo").fadeTo(3000, 500).slideUp(500, function(){
$j("#resultInfo").slideUp(500);
});
});
}*/
}
\ No newline at end of file
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment