diff --git a/app/js/directives/droitsEligiblesList.js b/app/js/directives/droitsEligiblesList.js index 991bb3017e..0fcffdaf48 100644 --- a/app/js/directives/droitsEligiblesList.js +++ b/app/js/directives/droitsEligiblesList.js @@ -1,23 +1,76 @@ 'use strict'; +var SmoothScroll = require('smooth-scroll'); +var scroll = new SmoothScroll(); + +var mergeDroits = function(prestationsNationales, partenairesLocaux) { + + var droits = _.values(prestationsNationales); + _.forEach(partenairesLocaux, function(partenaireLocal) { + droits = droits.concat(_.values(partenaireLocal.prestations)); + }); + + droits.sort(function(a, b) { + return a.label < b.label ? -1 : 1; + }); + + return droits; +}; + +angular.module('ddsApp').controller('droitsEligiblesListCtrl', function($scope, TrampolineService) { + + $scope.isNumber = _.isNumber; + $scope.isString = _.isString; + $scope.isBoolean = _.isBoolean; + + $scope.$watch('droits', function(value) { + if (value) { + var list = mergeDroits(value.prestationsNationales, value.partenairesLocaux); + if ($scope.filter) { + list = _.filter(list, function(value) { + + return _.includes($scope.filter, value.id); + }); + } + $scope.list = list; + } + }); + + $scope.trampoline = TrampolineService; + $scope.isNumber = _.isNumber; + $scope.isString = _.isString; + $scope.list = []; + + $scope.scrollTo = function(droit, $event) { + $event.preventDefault(); + scroll.animateScroll(document.querySelector('#' + droit.id), $event.target, { + updateURL: false, + offset: function () { + return document.querySelector('header').offsetHeight; + } + }); + }; + + $scope.scrollToTop = function($event) { + $event.preventDefault(); + scroll.animateScroll(document.querySelector('body'), $event.target, { + updateURL: false + }); + }; + +}); + var controllerOptions = function(templateUrl) { return function() { return { restrict: 'E', templateUrl: templateUrl, - scope: true, + scope: { + droits: '=', + yearMoins2: '=', + filter: '=', + }, controller: 'droitsEligiblesListCtrl', - // Inject list into scope, filtered by benefits specified via the "filter" attribute - link: function ($scope, $element, $attributes) { - if ($attributes.hasOwnProperty('filter')) { - var filter = $scope.$eval($attributes.filter); - $scope.list = _.pickBy($scope.$eval($attributes.list), function(value, key) { - return _.includes(filter, key); - }); - } else { - $scope.list = $scope.$eval($attributes.list); - } - } }; }; }; @@ -26,20 +79,22 @@ angular.module('ddsApp') .directive('droitEligiblesList', controllerOptions('/partials/droits-eligibles-list.html')); angular.module('ddsApp') - .directive('droitNonEligiblesList', controllerOptions('/partials/droits-non-eligibles-list.html')); - -angular.module('ddsApp').controller('droitsEligiblesListCtrl', function($scope, TrampolineService) { - $scope.isNumber = _.isNumber; - $scope.isString = _.isString; - $scope.shouldDisplayYM2Warning = function(droit) { - return droit.isBaseRessourcesYearMoins2 && ! $scope.ressourcesYearMoins2Captured && ! _.isString(droit.montant); - }; + .directive('droitEligiblesDetails', controllerOptions('/partials/droits-eligibles-details.html')); - $scope.trampoline = TrampolineService; +angular.module('ddsApp') + .directive('droitNonEligiblesList', controllerOptions('/partials/droits-non-eligibles-list.html')); - // ng-class and uib-accordion don't work well together, hence this extra function. - // See https://github.com/angular-ui/bootstrap/issues/4172 - $scope.getAccordionClass = function(droit) { - return [$scope.shouldDisplayYM2Warning(droit) ? 'needs-n-2' : '', droit.open ? 'panel-opened': ''].join(' '); - }; -}); +angular.module('ddsApp') + .directive('droitMontant', function() { + return { + restrict: 'E', + templateUrl: '/partials/droit-montant.html', + scope: { + droit: '=', + }, + link: function(scope) { + scope.isNumber = _.isNumber; + scope.isString = _.isString; + } + }; + }); diff --git a/app/scripts.js b/app/scripts.js index a91cd64208..d2fd347825 100644 --- a/app/scripts.js +++ b/app/scripts.js @@ -29,7 +29,7 @@ require('./styles/enfants.css'); require('./styles/foyer/capture-montant-ressource.css'); require('./styles/foyer/capture-continuation-ressource.css'); require('./styles/recap-situation.css'); -require('./styles/droits-eligibles-list.css'); +require('./styles/droits-eligibles-list.scss'); require('./styles/breadcrumb.css'); require('./js/common.js'); diff --git a/app/styles/droits-eligibles-list.css b/app/styles/droits-eligibles-list.css deleted file mode 100644 index 672268b2eb..0000000000 --- a/app/styles/droits-eligibles-list.css +++ /dev/null @@ -1,62 +0,0 @@ -.result .panel-opened .panel-heading { - background-color: whitesmoke; -} - -.result .panel-heading { - background-color: white; - padding: 5px 0; -} - -.result .panel-heading:hover { - background-color: #ededed; -} - -.result .panel-heading .montant { - font-weight: 600; - font-size: 18px; -} - -.result .panel-heading .montant-inconnu { - position: relative; - top: .25em; -} - -.result .panel-heading .montant-detail { - font-size: 12px; -} - -.result .panel-title .description { - padding-top: 0.5em; -} - -.needs-n-2 .panel-heading { - background-color: whitesmoke; - color: #888; -} - -.montant i { - position: relative; - top: .4em; -} - -.droit-logo { - height: 2em; - padding-left: 20px; -} - -.droit-logo img { - height: 100%; -} - -@media print { - .result .cta, .result .fa-chevron-down, .result .fa-chevron-right { - display: none; - } - .result .panel-collapse { - display: inline; - } -} - -.result { - page-break-inside: avoid; -} diff --git a/app/styles/droits-eligibles-list.scss b/app/styles/droits-eligibles-list.scss new file mode 100644 index 0000000000..f72920f9a9 --- /dev/null +++ b/app/styles/droits-eligibles-list.scss @@ -0,0 +1,211 @@ +@import '~font-awesome/scss/variables'; +$fa-font-path: '~font-awesome/fonts'; +@import '~font-awesome/scss/mixins'; +@import '~bootstrap-sass/assets/stylesheets/bootstrap/variables'; +@import 'variables'; +@import 'theme-variables'; + +.result .panel-opened .panel-heading { + background-color: whitesmoke; +} + +.result .panel-heading { + background-color: white; + padding: 5px 0; +} + +.result .panel-heading:hover { + background-color: #ededed; +} + +.result .panel-heading .montant { + font-weight: 600; + font-size: 18px; +} + +.result .panel-heading .montant-detail { + font-size: 12px; +} + +.result .panel-title .description { + padding-top: 0.5em; +} + +.needs-n-2 .panel-heading { + background-color: whitesmoke; + color: #888; +} + +.montant i { + position: relative; + top: .4em; +} + +.droit-logo { + height: 2em; + padding-left: 20px; +} + +.droit-logo img { + height: 100%; +} + +@media print { + .result .cta, .result .fa-chevron-down, .result .fa-chevron-right { + display: none; + } + .result .panel-collapse { + display: inline; + } +} + +.result { + page-break-inside: avoid; +} + +.dotted-line { + flex: 1; + display: block; + border-top: 1px dotted lighten(#333, 20%); + margin: 0 15px; +} + +.dotted-line:last-child { + margin-right: 0; +} + +.droits-eligibles-list { + display: block; + background-color: white; + box-shadow: 0px 2px 5px 0 rgba(0, 0, 0, 0.26); + margin-bottom: 40px; +} + +.droits-eligibles-list-item { + + padding: 10px 15px; + display: flex; + flex-direction: row; + justify-content: space-between; + align-items: center; + color: #333; + position: relative; + + @media (max-width: $screen-sm-max) { + + padding: 10px 15px; + border-bottom: 1px solid #e0e0e0; + + &:after { + @include fa-icon(); + content: $fa-var-chevron-right; + color: #ccc; + text-align: right; + margin-left: 15px; + } + } + + &:active, + &:focus, + &:hover { + text-decoration: none; + color: #999; + } + + &-left { + + display: flex; + flex-direction: row; + align-items: center; + + @media (max-width: $screen-sm-max) { + width: 80%; + } + + img { + width: 60px; + margin-right: 15px; + @media (max-width: $screen-xs-max) { + width: 40px; + } + } + + h2 { + margin: 0; + @media (max-width: $screen-xs-max) { + font-size: ($font-size-h2 * 0.6); + } + small { + display: block; + color: $link-color; + margin-top: 6px; + } + } + + &:hover { + h2 { + small { + text-decoration: underline; + } + } + } + } +} + +.droit-montant { + + display: inline-block; + text-align: right; + + .montant { + font-weight: 600; + font-size: 18px; + @media (min-width: $screen-md-min) { + font-size: 22px; + } + } + .montant-detail { + display: inline-block; + } +} + +.droit-detail { + + margin-bottom: 30px; + + &-heading { + + display: flex; + flex-direction: row; + justify-content: space-between; + align-items: center; + position: relative; + margin-bottom: 15px; + padding: 15px 0; + + h3 { + margin: 0; + font-weight: 600; + } + + } + + &-description { + margin-bottom: 15px; + } + + &-buttons { + display: flex; + flex-direction: row; + justify-content: space-between; + align-items: center; + margin-bottom: 15px; + } + + .alert-warning { + display: flex; + justify-content: space-between; + align-items: center; + font-weight: 400; + } +} diff --git a/app/views/partials/droit-montant.html b/app/views/partials/droit-montant.html new file mode 100644 index 0000000000..6593c42ef3 --- /dev/null +++ b/app/views/partials/droit-montant.html @@ -0,0 +1,11 @@ +
+ + {{ droit.montant | currency : ( droit.unit || '€' ) : (droit.roundToNearestCent ? 2 : 0 ) }} + + + + + + {{ droit.legend || (droit.isMontantAnnuel ? '/ an' : '/ mois') }} + +
diff --git a/app/views/partials/droits-eligibles-details.html b/app/views/partials/droits-eligibles-details.html new file mode 100644 index 0000000000..908180c9e7 --- /dev/null +++ b/app/views/partials/droits-eligibles-details.html @@ -0,0 +1,95 @@ +
+
+ +
+

{{ droit.label }}

+
+ +
+ +
+ +   Cette aide se base sur vos ressources de l'année {{ yearMoins2 }} + + Déclarez vos ressources {{ yearMoins2 }} +
+ +
+

+
+

Pour en bénéficier, vous devez également :

+
    +
  • + + +
  • +
+
+
+ + + + + +
+
diff --git a/app/views/partials/droits-eligibles-list.html b/app/views/partials/droits-eligibles-list.html index 8867a4d36f..3eded42621 100644 --- a/app/views/partials/droits-eligibles-list.html +++ b/app/views/partials/droits-eligibles-list.html @@ -1,129 +1,19 @@ - - - -
- - -
- {{ droit.label }} - (en test) -
- -
-
- {{ droit.montant | currency : ( droit.unit || '€' ) : (droit.roundToNearestCent ? 2 : 0 ) }} - ? - -
- -
- {{ droit.legend || (droit.isMontantAnnuel ? '/ an' : '/ mois') }} -
- -
- -
- -
-
-
- -
-
-

-
- Pour en bénéficier, vous devez également : -
    -
  • - - -
  • -
-
- -
-

L'application Mes Aides ne peut pas calculer le montant de cette prestation, car .

-

-
- -
- Cette aide se base sur vos ressources de l'année {{ yearMoins2 }}. - Déclarez vos ressources {{ yearMoins2 }} -
-
- -
- - - + diff --git a/app/views/partials/resultat.html b/app/views/partials/resultat.html index ded8fb695c..b805ab59da 100644 --- a/app/views/partials/resultat.html +++ b/app/views/partials/resultat.html @@ -44,48 +44,35 @@

Juste une dernière étape…

- D'après la situation que vous avez décrite, vous êtes a priori éligible à ces aides {{ droits.partenairesLocaux ? "nationales" : "" }}. + D'après la situation que vous avez décrite, vous êtes a priori éligible à ces aides. Ces résultats sont fondés sur les seules informations que vous avez indiquées et ne constituent en aucune façon un engagement de la part des organismes cités. Les montants avancés sont arrondis à une dizaine d'euros près :

-
- - - -
-
+ + +

Les conditions des aides suivantes ne sont pas remplies :

-
- -
-
- -
-

Vous êtes {{ droits.prestationsNationales ? "également" : "" }} a priori éligible à ces aides {{ prestationsPartenaire.prefix }} {{ prestationsPartenaire.label }} :

-
- -
-

- - {{ (! droits.prestationsNationales && (droitsInjectes | isEmpty)) ? "Si vous percevez aussi des aides nationales, le" : "Le" }} - montant de ces aides locales pourrait être partiellement déduit de vos aides nationales. Nous travaillons avec nos partenaires pour déterminer plus précisément ces interactions. -

-
-
+
@@ -93,6 +80,11 @@

Vous n'êtes a priori éligible à aucune des aides calculées par ce simula

Si vous êtes dans une situation difficile, d'autres solutions existent.

+

Comment obtenir vos aides ?

+ +