maatma: add toast instead of alert
This commit is contained in:
parent
da72f5e28a
commit
709205846e
2 changed files with 84 additions and 17 deletions
|
|
@ -33,7 +33,36 @@ angular.module("AdLinApp")
|
|||
});
|
||||
|
||||
angular.module("AdLinApp")
|
||||
.component('toast', {
|
||||
bindings: {
|
||||
date: '=',
|
||||
msg: '=',
|
||||
title: '=',
|
||||
variant: '=',
|
||||
},
|
||||
controller: function($element) {
|
||||
$element.children(0).toast('show')
|
||||
},
|
||||
template: `<div class="toast mb-2" role="alert" aria-live="assertive" aria-atomic="true" data-delay="7000">
|
||||
<div class="toast-header">
|
||||
<span ng-if="$ctrl.variant" class="badge badge-pill badge-{{ $ctrl.variant }}" style="padding: .25em .66em"> </span>
|
||||
<strong class="mr-auto" ng-bind="$ctrl.title"></strong>
|
||||
<small class="text-muted" ng-bind="$ctrl.date">just now</small>
|
||||
<button type="button" class="ml-2 mb-1 close" data-dismiss="toast" aria-label="Close">
|
||||
<span aria-hidden="true">×</span>
|
||||
</button>
|
||||
</div>
|
||||
<div class="toast-body" ng-bind-html="$ctrl.msg"></div>
|
||||
</div>`
|
||||
})
|
||||
|
||||
.run(function($rootScope, $interval, $http) {
|
||||
$rootScope.toasts = [];
|
||||
|
||||
$rootScope.addToast = function(toast) {
|
||||
$rootScope.toasts.unshift(toast);
|
||||
}
|
||||
|
||||
$rootScope.checkLoginState = function() {
|
||||
$http({
|
||||
method: 'GET',
|
||||
|
|
@ -67,7 +96,8 @@ angular.module("AdLinApp")
|
|||
});
|
||||
}
|
||||
refreshChal();
|
||||
$interval(refreshChal, 15750);
|
||||
var myinterval = $interval(refreshChal, 15750);
|
||||
$scope.$on('$destroy', function () { $interval.cancel(myinterval); });
|
||||
})
|
||||
|
||||
.controller("AuthController", function($scope, $rootScope, $http, $location) {
|
||||
|
|
@ -88,8 +118,12 @@ angular.module("AdLinApp")
|
|||
$location.url("/");
|
||||
}, function(response) {
|
||||
$scope.pleaseWait = false;
|
||||
if (response.data && response.data.errmsg)
|
||||
alert(response.data.errmsg);
|
||||
if (response.data)
|
||||
$scope.addToast({
|
||||
variant: "danger",
|
||||
title: "Connexion impossible",
|
||||
msg: (response.data ? response.data.errmsg : "Impossible de contacter le serveur"),
|
||||
});
|
||||
});
|
||||
}
|
||||
})
|
||||
|
|
@ -112,12 +146,16 @@ angular.module("AdLinApp")
|
|||
}).then(function(response) {
|
||||
$scope.tunnels = response.data;
|
||||
}, function(response) {
|
||||
if (response.data && response.data.errmsg)
|
||||
alert(response.data.errmsg);
|
||||
$scope.addToast({
|
||||
variant: "warning",
|
||||
title: "Maatma Tunnels",
|
||||
msg: "Nous rencontrons actuellement des difficultés avec la gestion des tunnels : " + (response.data ? response.data.errmsg : "Impossible de contacter le serveur") + "<br>Veuillez réessayer dans quelques instants.",
|
||||
});
|
||||
});
|
||||
};
|
||||
$scope.updateTunnelsList();
|
||||
$interval($scope.updateTunnelsList, 12000);
|
||||
var myinterval = $interval($scope.updateTunnelsList, 12000);
|
||||
$scope.$on('$destroy', function () { $interval.cancel(myinterval); });
|
||||
|
||||
$scope.newTunnel = function() {
|
||||
$scope.pleaseWaitNew = true;
|
||||
|
|
@ -128,9 +166,18 @@ angular.module("AdLinApp")
|
|||
}).then(function(response) {
|
||||
$scope.updateTunnelsList();
|
||||
$scope.pleaseWaitNew = false;
|
||||
$scope.addToast({
|
||||
variant: "success",
|
||||
title: "Maatma Tunnels",
|
||||
msg: "Tunnel créé avec succès !",
|
||||
});
|
||||
}, function(response) {
|
||||
$scope.pleaseWaitNew = false;
|
||||
alert(response.data.errmsg);
|
||||
$scope.addToast({
|
||||
variant: "danger",
|
||||
title: "Maatma Tunnels",
|
||||
msg: (response.data ? response.data.errmsg : "Impossible de contacter le serveur"),
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
|
|
@ -143,14 +190,23 @@ angular.module("AdLinApp")
|
|||
}).then(function(response) {
|
||||
$scope.updateTunnelsList();
|
||||
tunnel.pleaseWaitDrop = false;
|
||||
$scope.addToast({
|
||||
variant: "success",
|
||||
title: "Maatma Tunnels",
|
||||
msg: "Tunnel supprimé avec succès !",
|
||||
});
|
||||
}, function(response) {
|
||||
tunnel.pleaseWaitDrop = false;
|
||||
alert(response.data.errmsg);
|
||||
$scope.addToast({
|
||||
variant: "danger",
|
||||
title: "Maatma Tunnels",
|
||||
msg: (response.data ? response.data.errmsg : "Impossible de contacter le serveur"),
|
||||
});
|
||||
});
|
||||
}
|
||||
})
|
||||
|
||||
.controller("DomainsController", function($scope, $http, $interval, $location) {
|
||||
.controller("DomainsController", function($scope, $http, $location) {
|
||||
var onUpdateEvt = [];
|
||||
var callOnUpdateEvt = function() {
|
||||
angular.forEach(onUpdateEvt, function(cb) {
|
||||
|
|
@ -175,11 +231,10 @@ angular.module("AdLinApp")
|
|||
}).then(function(response) {
|
||||
response.data.forEach(function(rr) {
|
||||
$scope.adomains.push(rr);
|
||||
|
||||
});
|
||||
});
|
||||
}, function(response) {
|
||||
alert(response.data.errmsg);
|
||||
console.log(response.data.errmsg);
|
||||
});
|
||||
});
|
||||
};
|
||||
|
|
@ -207,9 +262,18 @@ angular.module("AdLinApp")
|
|||
}).then(function(response) {
|
||||
$scope.updateAssociationD();
|
||||
$scope.pleaseWaitNewAssociation = false;
|
||||
$scope.addToast({
|
||||
variant: "success",
|
||||
title: "Maatma Domain Names",
|
||||
msg: "Nouvelle association créée avec succès !",
|
||||
});
|
||||
}, function(response) {
|
||||
$scope.pleaseWaitNewAssociation = false;
|
||||
alert(response.data.errmsg);
|
||||
$scope.addToast({
|
||||
variant: "danger",
|
||||
title: "Maatma Domain Names",
|
||||
msg: "Erreur durant l'attribution du domaine : " + response.data.errmsg,
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
|
|
@ -227,7 +291,7 @@ angular.module("AdLinApp")
|
|||
"domain": domain,
|
||||
"ttl": 900,
|
||||
"rr": "NS",
|
||||
"valuesfrom": rr.values,
|
||||
"valuesfrom": rr.values.join(" "),
|
||||
"values": rr.values,
|
||||
}
|
||||
$('#NSModal').modal('show');
|
||||
|
|
@ -246,7 +310,7 @@ angular.module("AdLinApp")
|
|||
"domain": domain,
|
||||
"ttl": 900,
|
||||
"rr": "AAAA",
|
||||
"valuesfrom": rr.values,
|
||||
"valuesfrom": rr.values.join(" "),
|
||||
"values": rr.values,
|
||||
}
|
||||
$('#NSModal').modal('show');
|
||||
|
|
@ -267,14 +331,13 @@ angular.module("AdLinApp")
|
|||
"ttl": 900,
|
||||
"rr": "DS",
|
||||
"labels": ["Key Tag", "Algo clef", "Algo hash", "Hash (hex)"],
|
||||
"valuesfrom": rr.values,
|
||||
"valuesfrom": rr.values.join(" "),
|
||||
"values": rr.values,
|
||||
}
|
||||
$('#NSModal').modal('show');
|
||||
}
|
||||
|
||||
$scope.saveNSRR = function(nsrr) {
|
||||
nsrr.values = nsrr.values.join(" ");
|
||||
$http({
|
||||
method: (nsrr.valuesfrom !== undefined)?'PATCH':'POST',
|
||||
url: "api/ddomains/" + nsrr.domain + "/" + nsrr.rr,
|
||||
|
|
|
|||
|
|
@ -8,7 +8,7 @@
|
|||
<base href="/maatma/">
|
||||
</head>
|
||||
<body>
|
||||
<nav class="navbar sticky-top navbar-expand-lg navbar-dark bg-dark">
|
||||
<nav class="navbar sticky-top navbar-expand-sm navbar-dark bg-dark">
|
||||
<a class="navbar-brand" href=".">
|
||||
Maatma
|
||||
</a>
|
||||
|
|
@ -35,6 +35,10 @@
|
|||
|
||||
<div class="container mt-1" ng-view></div>
|
||||
|
||||
<div style="position: fixed; top: 60px; right: 0; z-index: 10; min-width: 30vw;">
|
||||
<toast ng-repeat="toast in toasts" date="toast.date" msg="toast.msg" title="toast.title" variant="toast.variant"></toast>
|
||||
</div>
|
||||
|
||||
<script src="js/jquery-3.4.1.slim.min.js"></script>
|
||||
<script src="js/bootstrap.min.js"></script>
|
||||
<script src="js/angular.min.js"></script>
|
||||
|
|
|
|||
Reference in a new issue