Fix : pagination (activités/organisations)

    },

    getPagination() {

      const current = this.page;

      const total = this.pages;

      const delta = 5;

      const current = parseInt(this.page);

      const total = parseInt(this.pages);

      const delta = 3;

      const range = [];

      const rangeWithDots = [];

      let rangeWithDots = [];

      let l;

      for (let i = 1; i <= total; i++) {

        if (i === 1 || i === total || (i >= current - delta && i <= current + delta)) {

          range.push(i);

      console.log("-------------------------");

      console.log(current,"/",total);

      if( total <= delta*2+3 ){

        rangeWithDots = Array.from({length: total}, (_,i) => i+1);

      } else {

        let start = current-delta;

        let end = current+delta;

        console.log("bornes départ", start,',',end);

        let decalage = 0;

        if( start < 1 ){

          decalage = Math.abs(start)+1;

          console.log("decalage début", decalage);

        }

        if( end > total ){

          decalage = -(end-total);

          console.log("decalage fin", decalage);

        }

      for (let i of range) {

        if (l) {

          if (i - l === 2) rangeWithDots.push(l + 1);

          else if (i - l > 2) rangeWithDots.push("…");

        if(decalage != 0 ){

          start += decalage;

          end += decalage;

        }

        console.log("start", start, "end", end);

        for(let i = start; i <= end; ++i){

          range.push(i);

        }

        if( start>1 ){ rangeWithDots.push(1); }

        if( start>2 ){ rangeWithDots.push('…'); }

        for(let i = start; i <= end; ++i){

          rangeWithDots.push(i);

        l = i;

        }

        if( end<total-1 ){ rangeWithDots.push('…'); }

        if( end<total ){ rangeWithDots.push(total); }

      }

      console.log( rangeWithDots);

      return rangeWithDots;

    }

  },

<script setup>

import { ref } from 'vue'

defineProps({

  node: {

    type: Object,

    required: true

  },

  selectable: {

    type: Boolean,

    default: true

  }

})

const emit = defineEmits(['select'])

const isOpen = ref(false)

const toggle = () => (isOpen.value = !isOpen.value)

const selectNode = () => {

  emit('select', node)

}

</script>

<template>

  <div class="ml-4">

    <div class="flex items-center space-x-1">

      <span

          v-if="node.children && node.children.length"

          class="cursor-pointer select-none"

          @click="toggle"

      >

        {{ isOpen ? '▼' : '▶' }}

      </span>

      <span

          v-if="selectable"

          class="cursor-pointer hover:text-blue-600 select-none"

          @click="selectNode"

      >

        {{ node.label }}

      </span>

      <span v-else>{{ node.label }}</span>

    </div>

    <div v-if="isOpen && node.children && node.children.length" class="ml-4">

      <TreeSelect

          v-for="child in node.children"

          :key="child.id + '-' + child.label"

          :node="child"

          @select="emit('select', $event)"

      />

    </div>

  </div>

</template>

 No newline at end of file

<template>

  <h1>{{ $filters.oscarText("Liste des activitées") }}</h1>

  <pre>

    url: {{ url }}

  </pre>

  <div class="input-group input-group-lg">

    <input type="search" class="form-control" placeholder="Rechercher..." />

    <button class="btn btn-primary" @click.prevent="search()">Rechercher</button>

  </div>

  <section class="activities card-list">

    <article class="card" v-for="a in activities">

      {{ a }}

    </article>

  </section>

</template>

<script>

import AxiosOscar from "../utils/AxiosOscar.js";

export default {

  props:{

    url: { type: String }

  },

  data(){

    return {

      // Critères de tri

      rbp: 20,

      sort: 'hit',

      direction: "ASC",

      // Résultats

      activities: []

    }

  },

  methods:{

    search(page=1){

      const params = {

        //'active': this.filterActive,

        'q': this.searchText ?? "",

        'page': page,

        'rbp': this.rbp,

        'sort': this.filterSorting,

        'direction': this.filterDirection,

        //'usage': this.filterUsage,

        //'t': this.filterType.length ? this.filterType.join(',') : '',

      };

      let urlBuilder = new URLSearchParams(params);

      //window.history.pushState({}, '', '?' + urlBuilder.toString());

      let url = this.url + "?" + urlBuilder.toString();

      AxiosOscar.get(url).then(ok => {

        console.log(ok);

        this.activities = ok.data.activities;

      })

    }

  }

}

</script>

 No newline at end of file