Discussion :

[fruwen7]

Bonjour ,

j’ai une table qui contient les données suivants (photo)



je veux faire un filter sur la table qui doit m’afficher juste les lignes du mois actuel , le filter je veux le faire avec la date d’expiration

N.B : j’utilise vuejs3 et store(vuex)

voici une partie de mon code :

Ma table :

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
          <thead>
            <tr class="w3-blue">
              <th scope="col">Serveur</th>
              <th scope="col">Adresse Ip</th>
              <th scope="col">Date Debut</th>
              <th scope="col">Date Expiration</th>
              <th scope="col">Hebergeur</th>
              <th scope="col">Montant</th>
              <th scope="col">Etat</th>
            </tr>
          </thead>
          <tr
            v-for="servS in liste_serv"
            :key="servS.id"
          >
            <td>{{ servS.serv }}</td>
            <td>{{ servS.adip }}</td>
            <td>{{ servS.daD }}</td>
            <td>{{ servS.daE }}</td>
            <td>{{ servS.heb }}</td>
            <td>{{ servS.Mont }}</td>
            <td>{{ servS.Etat }}</td>
            </tr>
        </table>

j’ai essayé de créer un filtre mais ca marche pas

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
const liste = store.getters[“global/getServ”];
const liste_serv = computed({
  get: () => {
    const liste = store.getters["global/getServ"];
 
    //date systeme
    const ds = new Date();
    const ms = ds.getMonth() + 1;
    console.log(ms);
 
    //date
    const dd = new Date(/*ici la date d'expiration */);
    const md = dd.getMonth() + 1;
    console.log(md);
    return liste.filter(ob => (ob.md = ob => ob.ms));
  },
});

comment faire pour prendre la date d’expiration de ma table et la faire afficher dans la console et après l’utilisé pour le filtre

store(vuex) :
state:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
export default function () {
  return {
    allServ: [],
  };
}

getters :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
export const getServ = (state) => {
  if (state.allServ) {
    return state.allServ;
  }
  return [];
};

mutations :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
export function setServ(state, data) {
  state.allServ = data;
}