diff --git a/back/infolica/routes.py b/back/infolica/routes.py
index 8cce2cb3..baf4ec34 100644
--- a/back/infolica/routes.py
+++ b/back/infolica/routes.py
@@ -35,6 +35,7 @@ def includeme(config):
     config.add_route('affaire_attribution_change_state', '/infolica/api/affaire_attribution_change_state')
     config.add_route('loadfile_bf_rp', '/infolica/api/loadfile_bf_rp')
     config.add_route('save_bf_rp', '/infolica/api/save_bf_rp')
+    config.add_route('activer_affaire', '/infolica/api/activer_affaire')
     #Factures
     config.add_route('factures', '/infolica/api/factures')
     config.add_route('factures_s', '/infolica/api/factures/')
@@ -114,6 +115,7 @@ def includeme(config):
     config.add_route('etapes_s','/infolica/api/etapes/')
     config.add_route('etapes_index','/infolica/api/etapes_index')
     config.add_route('etapes_index_s','/infolica/api/etapes_index/')
+    config.add_route('etapes_index_by_affaire_id','/infolica/api/etape_index_by_affaire_id')
     config.add_route('affaire_etapes_by_affaire_id','/infolica/api/affaire_etapes/{id}')
     config.add_route('controle_etape','/infolica/api/controle_etape')
     #Numeros affaires
diff --git a/back/infolica/scripts/utils.py b/back/infolica/scripts/utils.py
index 18ce06b4..15f17fbd 100644
--- a/back/infolica/scripts/utils.py
+++ b/back/infolica/scripts/utils.py
@@ -4,7 +4,7 @@
 from sqlalchemy import String
 from sqlalchemy.sql.expression import cast
 from infolica.models.models import Preavis, PreavisRemarque, Plan
-from infolica.models.models import Numero, AffaireNumero
+from infolica.models.models import Numero, AffaireNumero, AffaireEtape
 from infolica.models.models import Role, ReservationNumerosMO, Operateur
 from infolica.scripts.authentication import get_user_functions, check_connected
 
@@ -366,5 +366,29 @@ def generate_file_from_template(cls, request, template, data, output_file_name,
         doc.save(file_path)
         
         return filename
+    
+
+    @classmethod
+    def newAffaireEtape(cls, request, affaire_id, etape_id, remarque=None, operateur_id=None, datetime_=None):
+        
+        if datetime_ is None:
+            datetime_ = datetime.now()
+        
+        if operateur_id is None:
+            operateur_id = cls.getOperateurFromUser(request).id,
+        
+        params = Utils._params(
+            affaire_id = affaire_id,
+            etape_id = etape_id,
+            operateur_id = operateur_id,
+            datetime = datetime_,
+            remarque = remarque
+        )
+
+        record = AffaireEtape()
+        record = Utils.set_model_record(record, params)
+        request.dbsession.add(record)
+        
+        return
 
     
\ No newline at end of file
diff --git a/back/infolica/views/affaire.py b/back/infolica/views/affaire.py
index 6af9e8f3..9d28e0f0 100644
--- a/back/infolica/views/affaire.py
+++ b/back/infolica/views/affaire.py
@@ -9,6 +9,7 @@
 from infolica.models.models import ModificationAffaire, VAffaire, Facture, Client
 from infolica.models.models import ControleGeometre, ControleMutation, ControlePPE, SuiviMandat
 from infolica.models.models import AffaireEtape, AffaireEtapeIndex, Preavis
+from infolica.models.models import AffaireNumero, Numero, NumeroEtatHisto, NumeroRelation
 from infolica.scripts.mail_templates import MailTemplates
 from infolica.scripts.utils import Utils
 from infolica.scripts.authentication import check_connected
@@ -848,3 +849,83 @@ def guichet_rf_saisie_pm_view(request):
         }
 
     return result
+
+
+def _reopen_affaire(request, affaire_id):
+    affaire = request.dbsession.query(Affaire).filter(Affaire.id == affaire_id).first()
+
+    affaire.date_envoi = None
+    affaire.date_cloture = None
+    affaire.date_validation = None
+    affaire.abandon = False
+    affaire.urgent = False
+    affaire.urgent_echeance = None
+    affaire.attribution = None
+
+    return
+
+
+def _reinitialiser_etat_numero(request, affaire_id, numeros_type_id, nouvel_etat_id):
+    # numéros
+    numeros = request.dbsession.query(Numero).join(
+        AffaireNumero, AffaireNumero.numero_id == Numero.id
+    ).filter(
+        AffaireNumero.affaire_id == affaire_id,
+        AffaireNumero.type_id == numeros_type_id
+    ).all()
+
+    for num in numeros:
+        num.etat_id = nouvel_etat_id
+
+        neh = NumeroEtatHisto()
+        neh.numero_id = num.id
+        neh.numero_etat_id = nouvel_etat_id
+        neh.date = datetime.strftime(datetime.now(), '%Y-%m-%d')
+        request.dbsession.add(neh)
+
+    return
+
+
+def _remove_balance(request, affaire_id):
+    nr = request.dbsession.query(NumeroRelation).filter(NumeroRelation.affaire_id == affaire_id).all()
+    for num_rel_i in nr:
+        request.dbsession.delete(num_rel_i)
+    return
+
+
+@view_config(route_name='activer_affaire', request_method='POST', renderer='json')
+def activer_affaire_view(request):
+    """
+    Re-activate affaire
+    """
+    # Check connected
+    if not check_connected(request):
+        raise exc.HTTPForbidden()
+
+    affaire_id = request.params['affaire_id'] if 'affaire_id' in request.params else None
+    etape_id = request.params['etape_id'] if 'etape_id' in request.params else None
+
+    if affaire_id is None or etape_id is None:
+        exc.HTTPBadRequest('Il manque un paramètre à la requête (affaire_id et etape_id).')
+
+    ### Affaire
+    _reopen_affaire(request, affaire_id)
+
+    ### Numéros
+    affaire_numero_type_ancien_id = request.registry.settings['affaire_numero_type_ancien_id']
+    affaire_numero_type_nouveau_id = request.registry.settings['affaire_numero_type_nouveau_id']
+    numero_projet_id = request.registry.settings['numero_projet_id']
+    numero_vigueur_id = request.registry.settings['numero_vigueur_id']
+    # anciens numéros
+    _reinitialiser_etat_numero(request, affaire_id, numeros_type_id=affaire_numero_type_nouveau_id, nouvel_etat_id=numero_projet_id)
+
+    # Nouveaux numéros
+    _reinitialiser_etat_numero(request, affaire_id, numeros_type_id=affaire_numero_type_ancien_id, nouvel_etat_id=numero_vigueur_id)
+
+    # Effacer la balance
+    _remove_balance(request, affaire_id)
+
+    # set new affaire_etape
+    Utils.newAffaireEtape(request, affaire_id, etape_id, remarque="RÉACTIVATION DE L'AFFAIRE")
+
+    return exc.HTTPOk('Affaire réactivée avec succès. L''état des numéros liés à l''affaire a été réinitialisé.' )
diff --git a/back/infolica/views/affaire_etape.py b/back/infolica/views/affaire_etape.py
index 12367d8b..c332d4d3 100644
--- a/back/infolica/views/affaire_etape.py
+++ b/back/infolica/views/affaire_etape.py
@@ -9,7 +9,7 @@
 from infolica.exceptions.custom_error import CustomError
 from infolica.models.constant import Constant
 from infolica.models.models import AffaireEtape, AffaireEtapeIndex, VEtapesAffaires
-from infolica.models.models import Affaire, VAffaire, Facture
+from infolica.models.models import Affaire, VAffaire, AffaireType, Facture
 from infolica.scripts.mail_templates import MailTemplates
 from infolica.scripts.utils import Utils
 from infolica.scripts.authentication import check_connected
@@ -18,6 +18,53 @@
 ###########################################################
 # ETAPES AFFAIRE
 ###########################################################
+@view_config(route_name='etapes_index_by_affaire_id', request_method='GET', renderer='json')
+def etape_index_by_affaire_id_view(request):
+    """
+    GET etape index by affaire_id
+    """
+    # Check connected
+    if not check_connected(request):
+        raise exc.HTTPForbidden()
+
+    affaire_id = request.params['affaire_id'] if 'affaire_id' in request.params else None
+
+    if affaire_id is None:
+        raise exc.HTTPBadRequest(detail="Aucun index spécifié")
+
+    etape = request.dbsession.query(
+        AffaireEtapeIndex
+    ).join(
+        AffaireEtape, AffaireEtape.etape_id == AffaireEtapeIndex.id
+    ).filter(
+        AffaireEtape.affaire_id == affaire_id,
+        AffaireEtapeIndex.ordre != None
+    ).order_by(AffaireEtape.datetime.desc()).limit(1).first()
+
+    # get next step id
+    logique_processus = request.dbsession.query(
+        AffaireType.logique_processus
+    ).join(
+        Affaire, Affaire.type_id == AffaireType.id
+    ).filter(
+        Affaire.id == affaire_id
+    ).scalar()
+
+    next_step_id = None
+    if logique_processus is not None and etape.id in logique_processus:
+        idx = logique_processus.index(etape.id)
+
+        if idx < len(logique_processus)-1:
+            next_step_id = logique_processus[idx + 1]
+
+    data = {
+        'etape': etape.nom if etape is not None else None,
+        'predicted_next_step_id': next_step_id
+    }
+
+    return data
+
+
 @view_config(route_name='etapes_index', request_method='GET', renderer='json')
 @view_config(route_name='etapes_index_s', request_method='GET', renderer='json')
 def etapes_index_view(request):
diff --git a/front/.env b/front/.env
index f6f5b09a..e407a80d 100644
--- a/front/.env
+++ b/front/.env
@@ -79,6 +79,7 @@ VUE_APP_MODIFICATION_AFFAIRE_BY_AFFAIRE_FILLE_ENDPOINT = "/modification_affaire_
 VUE_APP_AFFAIRES_COCKPIT_ENDPOINT = "/affaires_cockpit"
 VUE_APP_ABANDON_AFFAIRE_REOUVERTURE_AFFAIRE_PARENT_ENDPOINT = "/abandon_affaire_reopen_parent_affaire"
 VUE_APP_AFFAIRE_ATTRIBUTION_CHANGE_STATE_ENDPOINT = "/affaire_attribution_change_state"
+VUE_APP_ACTIVATE_AFFAIRE_ENDPOINT = "/activer_affaire"
 
 #Preavis
 VUE_APP_PREAVIS_ENDPOINT = "/preavis"
@@ -111,6 +112,7 @@ VUE_APP_EXPORT_EMOLUMENTS_PDF_ENDPOINT = "/export_emoluments_pdf"
 
 #Etapes de l'affaire
 VUE_APP_ETAPES_INDEX_ENDPOINT = "/etapes_index/"
+VUE_APP_ETAPE_INDEX_BY_AFFAIRE_ID_ENDPOINT = "/etape_index_by_affaire_id"
 
 #Numéros relations
 VUE_APP_NUMERO_RELATIONS_BASE_ENDPOINT = "/numero_base_relations/"
diff --git a/front/src/components/Affaires/ActivationAffaire/ActivationAffaire.vue b/front/src/components/Affaires/ActivationAffaire/ActivationAffaire.vue
index b9ac31ac..f802a0b5 100644
--- a/front/src/components/Affaires/ActivationAffaire/ActivationAffaire.vue
+++ b/front/src/components/Affaires/ActivationAffaire/ActivationAffaire.vue
@@ -1,3 +1,4 @@
+<style src="./activationAffaire.css"></style>
 <template src="./activationAffaire.html"></template>
 
 // PROCESSUS
@@ -5,7 +6,8 @@
 
 <script>
 import { handleException } from "@/services/exceptionsHandler";
-import { getEtatsNumeros, stringifyAutocomplete, logAffaireEtape } from "@/services/helper.js";
+import NewStepSetter from "@/components/Utils/NewStepSetter/NewStepSetter.vue";
+
 import moment from "moment";
 
 export default {
@@ -13,365 +15,51 @@ export default {
   props: {
     affaire: Object
   },
-  component: {},
+  components: {
+    NewStepSetter,
+  },
   data: () => {
     return {
-      affaire_numeros: [],
-      numero_etats_liste: [],
+      disabledConfirmBtn: true,
+      nouvelle_etape_affaire_id: null,
       showActivationDialog: false,
-      showBalanceAlertDialog: false,
+      showProgressBar: false,
     };
   },
   methods: {
     openActivationDialog(){
-      this.getNumerosAffaire();
-
       this.showActivationDialog = true;
+      this.disabledConfirmBtn = true;
     },
 
-
     /**
-     * Réactivation de l'affaire
+     * (Re-)Activation function
      */
     async activateAffaire() {
-      let promises = [];
-      promises.push(this.updateAffaire());
-      promises.push(this.resetNumeroEtat());
-
-      Promise.all(promises).then(() => {
-        this.$root.$emit("showMessage", "L'affaire " + this.affaire.id + " a bien été réactivée");
-        //Log edition facture
-        logAffaireEtape(this.affaire.id, Number(process.env.VUE_APP_ETAPE_ACTIVATION_ID));
-        this.showActivationDialog = false;
-        this.$router.go(0);
-
-        this.getAffaireNumerosRelation()
-        .then(response => {
-          if (response && response.data && response.data.length > 0) {
-            this.showBalanceAlertDialog = true;
-          }
-        }).catch(err => handleException(err, this));
-
-      }).catch(err => handleException(err, this));
-    },
-
-
-    /**
-     * Supprimer mention ABABDON et date clôture de l'affaire
-     */
-    async updateAffaire() {
-      let formData = new FormData();
-      formData.append('id_affaire', this.affaire.id);
-      formData.append('date_cloture', null);
-      formData.append('abandon', false);
-
-      return new Promise((resolve, reject) => {
-        this.$http.put(
-          process.env.VUE_APP_API_URL + process.env.VUE_APP_AFFAIRES_ENDPOINT,
-          formData,
-          {
-            withCredentials: true,
-            headers: { Accept: "application/json" }
-          }
-        ).then(response => resolve(response))
-        .catch(err => reject(err));
-      });
-    },
-
-
-    /**
-     * Charger les numéros dans l'affaire
-     */
-    async getNumerosAffaire() {
-      this.$http
-        .get(
-          process.env.VUE_APP_API_URL + process.env.VUE_APP_AFFAIRE_NUMEROS_ENDPOINT + "/" +
-          this.affaire.id,
-          {
-            withCredentials: true,
-            headers: { Accept: "application/json" }
-          }
-        )
-        .then(response => {
-          if (response && response.data) {
-            this.affaire_numeros = response.data;
-          }
-        })
-        .catch(err => handleException(err, this));
-    },
-
-    /**
-     * Reset numeros affaires
-     */
-    async resetNumeroEtat() {
-      let promises = [];
-
-      return new Promise((resolve, reject) => {
-
-        if (this.affaire_numeros.length > 0) {
-          this.affaire_numeros.forEach(x => {
-            if (x.affaire_numero_type_id === Number(process.env.VUE_APP_AFFAIRE_NUMERO_TYPE_ANCIEN_ID)) {
-              // Ancien état
-            if (x.numero_etat_id === Number(process.env.VUE_APP_NUMERO_SUPPRIME_ID)) {
-              promises.push(this.updateNumeroEtat(x.numero_id, Number(process.env.VUE_APP_NUMERO_VIGUEUR_ID)));
-              promises.push(this.updateNumeroEtatHisto(x.numero_id, Number(process.env.VUE_APP_NUMERO_VIGUEUR_ID)));
-            }
-          } else {
-            // Nouvel etat
-            if (x.numero_etat_id === Number(process.env.VUE_APP_NUMERO_ABANDONNE_ID)) {
-              promises.push(this.updateNumeroEtat(x.numero_id, Number(process.env.VUE_APP_NUMERO_PROJET_ID)));
-              promises.push(this.updateNumeroEtatHisto(x.numero_id, Number(process.env.VUE_APP_NUMERO_PROJET_ID)));
-            }
-          }
-        })
-      }
-
-      Promise.all(promises)
-      .then(response => resolve(response))
-      .catch(err => reject(err));
-      });
-    },
-
-    /**
-     * updateNumeroEtat
-     */
-    async updateNumeroEtat(numero_id, etat_id) {
-      let formData = new FormData();
-      formData.append("id", numero_id);
-      formData.append("etat_id", etat_id);
-
-      return new Promise((resolve, reject) => {
-        this.$http.put(
-          process.env.VUE_APP_API_URL + process.env.VUE_APP_NUMEROS_ENDPOINT,
-          formData,
-          {
-            withCredentials: true,
-            headers: { Accept: "application/json" }
-          }
-        ).then(response => resolve(response))
-        .catch(err => reject(err));
-      });
-    },
-
-
-    /**
-     * Update numero etat histo
-     */
-    async updateNumeroEtatHisto(numero_id, etat_id) {
-      let formData = new FormData();
-      formData.append("numero_id", numero_id);
-      formData.append("numero_etat_id", etat_id);
-      formData.append("date", moment(new Date()).format(process.env.VUE_APP_DATEFORMAT_WS));
-        
-      return new Promise((resolve, reject) => {
-        this.$http.post(
-          process.env.VUE_APP_API_URL + process.env.VUE_APP_NUMEROS_ETAT_HISTO_ENDPOINT,
-          formData,
-          {
-            withCredentials: true,
-            headers: {Accept: "application/json"}
-          }
-        ).then(response => resolve(response))
-        .catch(err => reject(err));
-      });
-    },
-
-
-    /**
-     * Get affaire numeros relation
-     */
-    async getAffaireNumerosRelation() {
-      return new Promise((resolve, reject) => {
-        this.$http.get(
-          process.env.VUE_APP_API_URL + process.env.VUE_APP_NUMEROS_RELATIONS_BY_AFFAIREID_ENDPOINT + this.affaire.id,
-          {
-            withCredentials: true,
-            headers: {Accept: "application/json"}
-          }
-        ).then(response => resolve(response))
-        .catch(err => reject(err));
-      });
-    },
-
-
-    /**
-     * Delete numeros relation in db
-     */
-    async deleteRelation(rel) {
-      return new Promise((resolve, reject) => {
-        this.$http.delete(
-          process.env.VUE_APP_API_URL +
-          process.env.VUE_APP_NUMEROS_RELATIONS_ENDPOINT + "?numero_relation_id=" +  rel.relation_id,
-          {
-            withCredentials: true,
-            headers: {Accept: "application/json"}
-          }
-        ).then(response => resolve(response))
-        .catch(err => reject(err));
-      })
-    },
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-    /**
-     * Open clotureDialog
-     */
-    openClotureDialog(){
-      this.getNumerosAffaire();
-      this.showActivationDialog = true;
-    },
-
-
-
-    /**
-     * Récupérer les numéros de base pour les numéros DDP, PPE et PCOP
-     */
-    getNumerosBaseList(data) {
-      var tmp = new Set(data.map(x => x.numero_base_id));
-      tmp.delete(null);
-      return Array.from(tmp);
-    },
-
-    /**
-     * Filtrer les numéros actifs dans l'affaire
-     */
-    filterNumerosActiveInAffaire(numeros) {
-      return numeros.filter(x => x.affaire_destination_id === null);
-    },
-
-    /**
-     * Créer la prédiction de l'état du numéro
-     */
-    setPredictedFutureState(data, base) {
+      this.showProgressBar = true;
       
-      let num_type = {
-        ancien_id: Number(process.env.VUE_APP_AFFAIRE_NUMERO_TYPE_ANCIEN_ID),
-        nouveau_id: Number(process.env.VUE_APP_AFFAIRE_NUMERO_TYPE_NOUVEAU_ID)
-      };
+      let formData = new FormData();
+      formData.append('affaire_id', this.affaire.id);
+      formData.append('etape_id', this.nouvelle_etape_affaire_id);
       
-      let num_etat = {
-        projet_id: Number(process.env.VUE_APP_NUMERO_PROJET_ID),
-        vigueur_id: Number(process.env.VUE_APP_NUMERO_VIGUEUR_ID),
-        supprime_id: Number(process.env.VUE_APP_NUMERO_SUPPRIME_ID)
-      };
-
-      data.forEach(element => {
-        element.numero_etatFutur_id = element.numero_etat_id;
-
-        // Cas des numéros projetés, non mat-diff, à passer de projet à validé
-        if (element.affaire_numero_type_id === num_type.nouveau_id && 
-            element.numero_etat_id === num_etat.projet_id) {
-          element.numero_etatFutur_id = num_etat.vigueur_id;
-        } 
-        // Cas des numéros référencés à supprimer
-        else if (element.affaire_numero_type_id === num_type.ancien_id) {
-          if (~base.includes(element.numero_id)) {
-            element.numero_etatFutur_id = num_etat.supprime_id;
-          }
+      this.$http.post(
+        process.env.VUE_APP_API_URL + process.env.VUE_APP_ACTIVATE_AFFAIRE_ENDPOINT,
+        formData,
+        {
+          withCredentials: true,
+          headers: { Accept: "application/json" }
         }
-      });
-      return data;
-    },
-
-    /**
-     * Récupérer les états des numéros
-     */
-    async getNumeroEtats() {
-      getEtatsNumeros()
-      .then(response => {
-        if (response && response.data) {
-          this.numero_etats_liste = stringifyAutocomplete(response.data);
-        }
-      })
-      .catch(err => handleException(err, this));
-    },
-
-    /**
-     * update Affaire_Numeros when new etat selected
-     */
-    updateAffaireNumero(num_id, etat_id) {
-      this.affaire_numeros.map(x => {
-        if (x.numero_id == num_id) {
-          x.numero_etatFutur_id = etat_id;
-        } 
-      })
-    },
-
-
-    /**
-     * Confirmer la clôture d'affaire
-     */
-    onConfirmCloture() {
-      this.showActivationDialog = false;
-      
-      const _this = this;
-      var promises = [];
-
-      _this.affaire_numeros.forEach(num => {
-        promises.push(_this.saveNewEtatNumero(num));
-        promises.push(_this.saveNewEtatHistoryNumero(num));
-      });
-
-      Promise.all(promises)
-      .then(response => {
-        if (response) {
-          this.AjoutDateClotureAffaire()
-          .then(() => {
+        ).then(response => {
+          if (response && response.data) {
+            this.$root.$emit('ShowMessage', "L''affaire a bien été réactivée.")
+            this.showProgressBar = false;
             this.$router.go(0);
-            this.$parent.setAffaire();
-            this.$root.$emit("ShowMessage", "L'affaire " + this.affaire_id + " a été clôturées avec succès");
-
-            //Log edition facture
-            logAffaireEtape(this.affaire.id, Number(process.env.VUE_APP_ETAPE_CLOTURE_ID));
-          })
-          .catch(err => handleException(err, this));
-        }
-      })
-      .catch(err => {
-        handleException(err, this);
-      });
-    },
-
-    /**
-     * Ajout de la date de clôture de l'affaire
-     */
-    async AjoutDateClotureAffaire(){
-      return new Promise((resolve, reject) => {
-        var formData = new FormData();
-        formData.append("id_affaire", this.affaire.id);
-        formData.append("date_cloture",  moment(new Date()).format(process.env.VUE_APP_DATEFORMAT_WS));
-
-        this.$http
-          .put(
-            process.env.VUE_APP_API_URL +
-            process.env.VUE_APP_AFFAIRES_ENDPOINT,
-            formData,
-            {
-              withCredentials: true,
-              headers: {"Accept": "application/json"}
-            }
-          ).then(response => {
-            if (response) {
-              resolve(response);
-            }
-          }).catch(err => reject(err));
-        })
-    },
+          }
+        }).catch(err => {
+          handleException(err, this);
+          this.showProgressBar = false;
+        });
+      },
 
 
     /**
@@ -421,10 +109,14 @@ export default {
       })
     },
 
+    /**
+     * set nouvelle_etape_affaire_id
+     */
+    setNewStepId(new_step_id) {
+      this.nouvelle_etape_affaire_id = new_step_id;
+      this.disabledConfirmBtn = false;
+    }
 
   },
-  mounted: function() {
-    this.getNumeroEtats();
-  }
 };
 </script>
\ No newline at end of file
diff --git a/front/src/components/Affaires/ActivationAffaire/activationAffaire.css b/front/src/components/Affaires/ActivationAffaire/activationAffaire.css
new file mode 100644
index 00000000..1c700d68
--- /dev/null
+++ b/front/src/components/Affaires/ActivationAffaire/activationAffaire.css
@@ -0,0 +1,4 @@
+.activationAffaireDialog .md-dialog-container {
+  min-width: 750px;
+  width: 750px;
+}
diff --git a/front/src/components/Affaires/ActivationAffaire/activationAffaire.html b/front/src/components/Affaires/ActivationAffaire/activationAffaire.html
index 61429d52..91e697bb 100644
--- a/front/src/components/Affaires/ActivationAffaire/activationAffaire.html
+++ b/front/src/components/Affaires/ActivationAffaire/activationAffaire.html
@@ -1,40 +1,27 @@
 <div class="activationAffaire">
-  <md-dialog :md-active.sync="showActivationDialog">
+  <md-dialog :md-active.sync="showActivationDialog" class="activationAffaireDialog">
     <md-dialog-title>Réactivation de l'affaire</md-dialog-title>
+
+    <md-dialog-content>
+      <p>
+        En confirmant, les opérations suivantes seront réalisées:
+        <ul>
+          <li>Les dates d'envoi, clôture et de validation de l'affaire seront effacées,</li>
+          <li>l'affaire sera renvoyée à l'étape précisée ci-dessous,</li>
+          <li>les biens-fonds réservés dans l'affaire redeviendront à l'état "projet" et ceux liés à l'affaire à l'état "validé",</li>
+          <li>la balance et les relations entre les numéros (DDP, PPE, PCOP) de l'affaire seront effacées</li>
+        </ul>
+      </p>
+      <br>
+      <NewStepSetter :affaire_id="affaire.id" @new-step-selected="setNewStepId" />
+    </md-dialog-content>
     
-    <!-- <md-dialog-content>
-      <p>Vérifier l'état des numéros</p>
-      <md-table v-model="affaire_numeros" md-sort="numero" md-sort-order="asc" md-card md-dense md-fixed-header>
-        <md-table-row slot="md-table-row" slot-scope="{ item }">
-          <md-table-cell md-label="id" md-sort-by="numero_id" v-if="false">{{ item.numero_id }}</md-table-cell>
-          <md-table-cell md-label="Cadastre" md-sort-by="numero_cadastre">{{ item.numero_cadastre }}</md-table-cell>
-          <md-table-cell md-label="Type" md-sort-by="numero_type">{{ item.numero_type }}</md-table-cell>
-          <md-table-cell md-label="Numéro" md-sort-by="numero" number>{{ item.numero }}</md-table-cell>
-          <md-table-cell md-label="Suffixe/Unité" md-sort-by="numero_suffixe">{{ item.numero_suffixe }}</md-table-cell>
-          <md-table-cell md-label="Etat" md-sort-by="numero_etat">{{ item.numero_etat }}</md-table-cell>
-          <md-table-cell md-label="Nouvel état" md-sort-by="numero_etatFutur_id">
-            <md-field>
-              <md-select v-model="item.numero_etatFutur_id" md-dense>
-                <md-option v-for="etat in numero_etats_liste" :key="etat.id" :value="etat.id">{{ etat.nom }}</md-option>
-              </md-select>
-            </md-field>
-          </md-table-cell>
-        </md-table-row>
-      </md-table>
-    </md-dialog-content> -->
 
     <md-dialog-actions>
+      <md-progress-bar md-mode="indeterminate" v-if="showProgressBar"></md-progress-bar>
       <md-button class="md-accent" @click="showActivationDialog=false">Annuler</md-button>
-      <md-button class="md-primary" @click="activateAffaire">Confirmer</md-button>
+      <md-button class="md-primary" @click="activateAffaire" :disabled="disabledConfirmBtn">Confirmer</md-button>
     </md-dialog-actions>
 
   </md-dialog>
-
-  <!-- Supprimer la balance ? -->
-  <md-dialog-alert
-      :md-active.sync="showBalanceAlertDialog"
-      md-title="Balance de l'affaire"
-      md-content="Vérifier l'exactitude de la balance!"
-      md-confirm-text="Reçu 5/5" />
-
 </div>
\ No newline at end of file
diff --git a/front/src/components/Utils/NewStepSetter/NewStepSetter.vue b/front/src/components/Utils/NewStepSetter/NewStepSetter.vue
new file mode 100644
index 00000000..9ef08029
--- /dev/null
+++ b/front/src/components/Utils/NewStepSetter/NewStepSetter.vue
@@ -0,0 +1,63 @@
+<style src="./newStepSetter.css" scoped></style>
+<style lang="css">.md-menu-content { z-index: 9000 !important; }</style>
+<template src="./newStepSetter.html"></template>
+
+
+<script>
+
+import { handleException } from "@/services/exceptionsHandler";
+
+export default {
+  name: "NewStepSetter",
+  props: {
+    affaire_id: {
+      type: Number,
+    }
+  },
+  data: () => {
+    return {
+      actual_step: null,
+      etapes: [],
+      new_step_id: null
+    };
+  },
+
+  methods: {
+    async getActualAffaireEtape() {
+      this.$http.get(
+        process.env.VUE_APP_API_URL + process.env.VUE_APP_ETAPE_INDEX_BY_AFFAIRE_ID_ENDPOINT + "?affaire_id=" + this.affaire_id,
+        {
+          withCredentials: true,
+          headers: { Accept: "application/json" }
+        }
+      ).then(response => {
+        this.actual_step = response.data.etape;
+        this.next_step_id = response.data.predicted_next_step_id;
+      }).catch(err => handleException(err, this));
+    },
+    
+    
+    async getAffaireEtapes() {
+      this.$http.get(
+        process.env.VUE_APP_API_URL + process.env.VUE_APP_ETAPES_INDEX_ENDPOINT,
+        {
+          withCredentials: true,
+          headers: { Accept: "application/json" }
+        }
+      ).then(response => {
+        this.etapes = response.data;
+      }).catch(err => handleException(err, this));
+    },
+
+    newStepSelected(value) {
+      this.$emit('new-step-selected', value);
+    }
+
+  },
+  mounted: function() {
+    this.getAffaireEtapes();
+    this.getActualAffaireEtape();
+  }
+};
+
+</script>
diff --git a/front/src/components/Utils/NewStepSetter/newStepSetter.css b/front/src/components/Utils/NewStepSetter/newStepSetter.css
new file mode 100644
index 00000000..f56680a0
--- /dev/null
+++ b/front/src/components/Utils/NewStepSetter/newStepSetter.css
@@ -0,0 +1,3 @@
+#newStepSetter .inputWidth {
+    width: 280px !important;
+}
\ No newline at end of file
diff --git a/front/src/components/Utils/NewStepSetter/newStepSetter.html b/front/src/components/Utils/NewStepSetter/newStepSetter.html
new file mode 100644
index 00000000..1cc6066d
--- /dev/null
+++ b/front/src/components/Utils/NewStepSetter/newStepSetter.html
@@ -0,0 +1,23 @@
+<div id="newStepSetter">
+    <div class="md-layout md-gutter md-alignment-top-space-between">
+        <div class="md-layout-item md-size-45">
+            <!-- Nom de l'étape en cours -->
+            <md-field class="inputWidth">
+                <label>Etape en cours</label>
+                <md-input v-model="actual_step" readonly></md-input>
+            </md-field>
+        </div>
+
+        <h3 style="margin-top: 24px">=></h3>
+
+        <div class="md-layout-item md-size-45">
+            <!-- Nom de la prochaine étape -->
+            <md-field  class="inputWidth">
+                <label>Prochaine étape</label>
+                <md-select v-model="new_step_id" md-dense @md-selected="newStepSelected">
+                    <md-option v-for="item in etapes" :value="item.id">{{ item.nom }}</md-option>
+                </md-select>
+            </md-field>
+        </div>
+    </div>
+</div>