POC proposal detail page

frontend/app/app.router.js

@@ -29,6 +29,14 @@
               template: '<most-proposal-create />'
             }
           }
+        })
+        .state('most.proposal.detail', {
+          url: '/:proposalId',
+          views: {
+            'root@most': {
+              template: '<most-proposal-detail />'
+            }
+          }
         });
     });
 })();

frontend/app/proposal/detail/most-proposal-detail.component.js

+(function(angular) {
+  'use strict';
+
+  angular.module('linagora.esn.most')
+    .component('mostProposalDetail', {
+      templateUrl: '/linagora.esn.most/app/proposal/detail/most-proposal-detail.html',
+      controller: 'MostProposalDetailController'
+    });
+})(angular);

frontend/app/proposal/detail/most-proposal-detail.controller.js

+(function(angular) {
+  'use strict';
+
+  angular.module('linagora.esn.most')
+    .controller('MostProposalDetailController', MostProposalDetailController);
+
+  function MostProposalDetailController(
+    $state,
+    $stateParams,
+    mostProposalApiClient
+  ) {
+    var self = this;
+
+    self.$onInit = $onInit;
+    self.onRejectBtnClick = onRejectBtnClick;
+    self.onAcceptBtnClick = onAcceptBtnClick;
+
+    function $onInit() {
+      mostProposalApiClient.getProposal($stateParams.proposalId)
+        .then(function(proposal) {
+          self.proposal = proposal;
+        });
+    }
+
+    function onRejectBtnClick() {
+      return mostProposalApiClient.updateProposal($stateParams.proposalId, { status: 'REJECTED' })
+        .then(function() {
+          $state.go('most.proposal');
+        });
+    }
+
+    function onAcceptBtnClick() {
+      return mostProposalApiClient.updateProposal($stateParams.proposalId, { status: 'ACCEPTED' })
+        .then(function() {
+          $state.go('most.proposal');
+        });
+    }
+  }
+})(angular);

frontend/app/proposal/detail/most-proposal-detail.pug

+sub-header
+  most-proposal-detail-subheader(
+    title="$ctrl.proposal.formJson.title",
+    on-reject-btn-click="$ctrl.onRejectBtnClick()",
+    on-accept-btn-click="$ctrl.onAcceptBtnClick()"
+  )
+.card
+  .card-body.p-20
+    .row(ng-switch="$ctrl.proposal.type")
+      most-proposal-form-a1(ng-switch-when="A1", data="$ctrl.proposal.formJson", editMode="false")
+      most-proposal-form-a2(ng-switch-when="A2", data="$ctrl.proposal.formJson", editMode="false")
+      most-proposal-form-a3(ng-switch-when="A3", data="$ctrl.proposal.formJson", editMode="false")

frontend/app/proposal/detail/subheader/most-proposal-detail-subheader.component.js

+(function(angular) {
+  'use strict';
+
+  angular.module('linagora.esn.most')
+
+  .component('mostProposalDetailSubheader', {
+    templateUrl: '/linagora.esn.most/app/proposal/detail/subheader/most-proposal-detail-subheader.html',
+    bindings: {
+      title: '<',
+      onRejectBtnClick: '&',
+      onAcceptBtnClick: '&'
+    }
+  });
+})(angular);

frontend/app/proposal/detail/subheader/most-proposal-detail-subheader.pug

+extends /modules/subheader/responsive-subheader.pug
+
+block left
+  most-subheader-burger-button.hidden-md
+    i.mdi.mdi-menu
+  span.title.ellipsis {{::$ctrl.title}}
+
+block right
+  ul.actions.flex-space-around
+    li.contact-dropdown.dropdown
+      a(href='', data-toggle='dropdown')
+        i.mdi.mdi-dots-vertical
+      ul.dropdown-menu.dropdown-menu-right
+        li
+          a(href='', ng-click='$ctrl.onRejectBtnClick()') Từ chối
+        li
+          a(href='', ng-click='$ctrl.onAcceptBtnClick()') Duyệt
+        

frontend/app/proposal/list/item/most-proposal-list-item.pug

 .row
   .col-xs-6
-    h5.ellipsis(title="{{::$ctrl.proposal.formJson.title}}") {{::$ctrl.proposal.formJson.title}}
+    h5.ellipsis.clickable(
+      title="{{::$ctrl.proposal.formJson.title}}",
+      ui-sref="most.proposal.detail({proposalId: $ctrl.proposal.id})"
+    ) {{::$ctrl.proposal.formJson.title}}
   .col-xs-1
     span.ellipsis(title="{{::$ctrl.proposal.type}}") {{::$ctrl.proposal.type}}
   .col-xs-3

frontend/app/proposal/list/most-proposal-list.pug

@@ -4,6 +4,6 @@ sub-header
 .card.fadeIn200ms
     .listview.lv-bordered.lv-lg
       .lv-body
-        most-proposal-list-item.lv-item.clickable(proposal='proposal', ng-repeat="proposal in $ctrl.proposals")
+        most-proposal-list-item.lv-item(proposal='proposal', ng-repeat="proposal in $ctrl.proposals")
 
 fab(icon="plus", ui-sref="most.proposal.create")