Commit 2cef6c60 authored by Stephane Bouvry's avatar Stephane Bouvry
Browse files

Mes jalons : 

 - Le filtre "Les jalons à faire" affichent également les jalons en cours
 - Les jalons sont affichés du plus ancien au plus récent
 - La date "depuis maintenant" est alignée à droite plus faciliter la lecture
parent 77d5820f

module/Oscar/src/Oscar/Entity/ActivityDateRepository.php

+2 −2
Original line number Diff line number Diff line
@@ -187,7 +187,7 @@ class ActivityDateRepository extends EntityRepository 


        if( $todoOnly ){

            $query->andWhere('t.finishable = TRUE');

            $query->andWhere('m.finished  = 0 OR m.finished IS NULL');

            $query->andWhere('m.finished  <= 50 OR m.finished IS NULL');

        }

        if( $bounds ){

            if( $bounds['from'] ){
@@ -220,7 +220,7 @@ class ActivityDateRepository extends EntityRepository 
        $query->select('m')

            ->setMaxResults($size)

            ->setFirstResult($size*($page-1))

            ->orderBy('m.dateStart', 'desc');

            ->orderBy('m.dateStart', 'asc');



        return $query->getQuery()->getResult();

    }

ui/src/oscar-css.scss

+15 −0
Original line number Diff line number Diff line
@@ -153,6 +153,19 @@ body:not(.privatize) { 
  }

}



.card {

  .card-title {

    .left-info {

      flex: 20% 0;

      align-self: flex-start;

      font-weight: 600;

      text-align: right;

      margin-left: auto;

      padding-right: .3em;

    }

  }

}



.card-state {

  border-left: solid 4px #555;

  opacity: .9;
@@ -388,6 +401,8 @@ a.usage { 
  //text-shadow: 1px -1px 1px rgba(255,255,255,.3);

  background-color: lighten($brand-info, 15%);

  padding: 0 .5em;

  margin: 0 .3em;

  //white-space: nowrap;

  border-radius: .3em;

    color: darken($brand-info, 35%);

  .oscar-tag-icon {

ui/src/views/MilestonesUI.vue

+77 −46
Original line number Diff line number Diff line 
<template>

  <div class="overlay" v-show="displayHelp">

    <div class="overlay-content">

      <h1>Aide</h1>

      <p>Cet écran permet de visualiser les jalons de <strong>vos {{ $filters.oscarText('activités') }}</strong></p>

      <ul>

        <li>{{ $filters.oscarText('vos activités') }} (où vous êtes identifiés personnelement)</li>

        <li>{{ $filters.oscarText('activités de vos structures') }}</li>

      </ul>

      <p>

        Le panneau sur la droite vous permet de filtrer les jalons à afficher et d'ajuster les résultats de la recherche

      </p>

      <p>

        Les modes d'affichage en haut permettent de filtrer sur la période ou l'état d'avancement :

      </p>

      <ul>

        <li>

          <strong>Jalons proches</strong> :

          Jalons dont la date de référence est située entre la date du jour - 2 mois et la date du jour + 1 mois

        </li>

        <li>

          <strong>Jalons à faire</strong> :

          Jalons ayant un système de progression dont l'état est <strong>à faire</strong> ou <strong>en cours</strong>

        </li>

      </ul>

      <hr>

      <button class="btn btn-default" @click.prevent="displayHelp = false">

        Fermer

      </button>

    </div>

  </div>

  <h1>

    <i class="icon-calendar"></i>

    {{ title }}

    <em> ({{ total + ' ' + $filters.oscarText('jalons') }})</em>

    <button class="btn btn-default" @click="fetch(2000)">

      FETCH

    </button>

  </h1>



  <div class="row">

    <section class="results col-md-8 milestones">

      <div class="pagination btn-group">

        <div v-for="i in pagination.totalPages"

             class="pagination-item btn btn-default"

             @click.prevent="handlerPage(i)"

             :class="{'btn-primary': pagination.page == i}">

          {{ i }}

        </div>

      </div>

      <nav>

        Filtres :

        <div class="btn btn-lg"
@@ -34,6 +53,16 @@ 
        </div>

      </nav>

      <hr>

      <nav class="text-center" v-show="pagination && pagination.totalPages > 1">

        <div class="pagination btn-group">

          <div v-for="i in pagination.totalPages"

               class="pagination-item btn btn-default btn-xs"

               @click.prevent="handlerPage(i)"

               :class="{'btn-primary': pagination.page == i}">

            {{ i }}

          </div>

        </div>

      </nav>



        <section class="by-year" v-for="(yearData, year) in groupedMilestones">

          <div class="dateMarker">
@@ -56,29 +85,36 @@ 
             }"

            >

              <h2 class="card-title">

                <strong>

          <span class="problem-info" v-if="milestone.late">

                <span>

                  <strong class="problem-info" v-if="milestone.late">

                    <i class="icon-attention-1"></i>

                    En retard

          </span>

                  <i class="icon-calendar" v-else></i>

                  {{ milestone.type.label }} - {{ $filters.dateFull(milestone.dateStart) }}

                  </strong>

                  <i class="icon-calendar" v-else></i>

                  {{ milestone.type.label }}

                  - {{ $filters.date(milestone.dateStart) }}

                </span>

                <span class="left-info">

                  {{ $filters.timeAgo(milestone.dateStart) }}

                </span>

                <nav v-if="milestone.manage && false" class="right">

                  <a href="" class="btn btn-danger">Supprimer</a>

                  <a href="" class="btn btn-primary">Modifier</a>

                </nav>

              </h2>

              <div class="card-content">

                <div class="activity-info"

                <a class="activity-info"

                    v-if="milestone.activity"

                     :class="{'clickable' : milestone.activity.url}"

                     @click="handlerActivityShow(milestone)"

                >

                    :href="milestone.activity.url">

                  <i class="icon-cube"></i>

                  <strong v-if="milestone.activity.acronym">{{ milestone.activity.acronym }} </strong>

                  <em>({{ milestone.activity.num }})</em>

                  {{ milestone.activity.label }}

                </a>

                <div v-if="milestone.comment">

                  {{ milestone.comment }}

                </div>

                <div>

                  <span v-if="getContext(milestone.activity).mine" class="oscar-tag primary">

                    <i class="oscar-tag-icon icon-group"></i>

                    {{ $filters.oscarText('Membre de cette activité') }}
@@ -95,9 +131,6 @@ 
                    </span>

                  </span>

                </div>

                <div v-if="milestone.comment">

                  {{ milestone.comment }}

                </div>

                <nav class="milestone-progession" v-if="milestone.validable" style="position: relative">

                  <i class="icon-gauge"></i>

                  <strong class="milestone-progression-label">
@@ -114,16 +147,18 @@ 
                      <i class="oscar-tag-icon icon-user"></i>

                      {{ finishedPerson(milestone.finishedBy) }}

                    </strong>



            <a href="#" @click.prevent="handlerProgression(milestone, 'unvalid')"

                  </span>

                  <a href="#"

                     v-if="milestone.progress && milestone.finished >= 50"

                     @click.prevent="handlerProgression(milestone, 'unvalid')"

                     style="position: absolute; right: 0"

                     class="btn btn-xs btn-default right-0">

                    <i class="icon-history"></i>reset

                  </a>

          </span>

                  <nav v-if="milestone.progress" class="">

            <span v-if="!(milestone.finished > 0)">

              <a href="" class="btn btn-default xs" @click.prevent="handlerProgression(milestone, 'inprogress')">

                  <nav v-if="milestone.progress" class="oscar-border-separator-top">

                    <span v-if="!(milestone.finished > 0) || milestone.finished == 50">

                      <a href="" class="btn btn-default xs" v-if="milestone.finished != 50"

                         @click.prevent="handlerProgression(milestone, 'inprogress')">

                        <i class="icon-cw-outline"></i>

                        En cours</a>

                      <a href="" class="btn btn-success xs"  @click.prevent="handlerProgression(milestone, 'valid')">
@@ -145,21 +180,20 @@ 
    </section>

    <section class="results col-md-4">

      <nav class="filters">

        <section class="filters-select">

          <h3>Nombre de résultats</h3>



          <select name="" id="" v-model="size">

            <option value="50">50</option>

            <option value="25">25</option>

            <option value="10">10</option>

          </select>

        </section>

<!--        <section class="filters-select">-->

<!--          <h3>Nombre de résultats</h3>-->



<!--          <select name="" id="" v-model="size">-->

<!--            <option value="50">50</option>-->

<!--            <option value="25">25</option>-->

<!--            <option value="10">10</option>-->

<!--          </select>-->

<!--        </section>-->

        <section>

          <h3>{{ $filters.oscarText('Mes activités') }}</h3>

          <div class="oscar-tag --selectable secondary"

               :class="{'--selected': filterMine}"

               @click.prevent="handlerFilterMine($event)">

            >

            <i class="icon-eye-off" v-if="!filterMine"></i>

            <i class="icon-eye" v-else></i>

            {{ $filters.oscarText('Mes activités') }}
@@ -215,6 +249,7 @@ export default { 
      organizationsDetails: null,

      filterOrganizations: [],

      filterMine: true,

      displayHelp: true,



      // Nombre de résultat

      size: 50,
@@ -302,7 +337,7 @@ export default { 
      AxiosOscar.put(milestone.url, {'action': action, 'id': milestone.id}).then((response) => {

        console.log(response);

      }).then(response => {

        this.fetch()

        this.fetch(0)

      })

    },
@@ -405,7 +440,7 @@ export default { 
}

</script>

<style>

.milstones {

.milestones {

  padding-top: 1.5em;

  padding-left: 100px;

}
@@ -445,7 +480,7 @@ export default { 
}



.past {

  opacity: .7;

  opacity: 1;

}

.has-problem {

  border-left: solid 6px red !important;
@@ -486,10 +521,6 @@ export default { 
  border-left: solid 6px #EEE;

}



.progression-todo{

  background-color: #d0b68e !important;

}



.progression-progress{

  border-left-color: #555;

}