"use strict";

function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }

function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }

function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }

function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }

function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }

function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }

function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }

function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }

function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }

function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }

function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }

jQuery(function () {
  $('#app').on('click', '.url_action', function (e) {
    e.preventDefault();
    e.stopPropagation();
    var confirmation = $(this).data('confirm');

    if (confirmation !== undefined) {
      if (!confirm(confirmation)) {
        return;
      }
    }

    var url = $(this).attr('href');
    var id = $(this).data('id'); // passer en refresh animé une éventuelle icone

    if ($(this).has('i.icon, i.fa')) {
      $(this).find('i.icon, i.fa').eq(0).replaceWith('<i class="fa fa-refresh fa-spin"></i>');
    }

    var nomBlocAjaxReload = $(this).data('ajaxreload');
    console.time('Chargement de VueJs APRES Ajax');
    $.ajax({
      url: url,
      async: true
    }).done(function () {
      if (parseInt(id) > 0) {
        app.rechargerJson(id);
        app.rechargerJson_deux(id);
      } else {
        app.rechargerJson();
        app.rechargerJson_deux();
      }

      if (nomBlocAjaxReload !== undefined) {
        console.log('depart reload: ' + nomBlocAjaxReload);
        ajaxReload(nomBlocAjaxReload, {
          args: {
            id: id
          },
          callback: function callback() {}
        });
      }
    });
  }); // lancement d'une modalbox

  $('#app').on('click', '.modalbox', function (e) {
    e.stopPropagation();
    e.preventDefault();
    var confirmation = $(this).data('confirm');

    if (confirmation !== undefined) {
      if (!confirm(confirmation)) {
        return;
      }
    }

    var url = $(this).attr('href');
    url += '&var_zajax=content';
    var data = {};
    var minHeight = $(this).data('minheight');

    if (minHeight !== undefined) {
      data.minHeight = minHeight;
    }

    var minWidth = $(this).data('minwidth');

    if (minWidth !== undefined) {
      data.minWidth = minWidth;
    }

    var width = $(this).data('width');

    if (width !== undefined) {
      data.width = width;
      var valeur_reduite = $(window).width() * width / 100;
      url += '&largeur=' + valeur_reduite + 'px';
    }

    data.onShow = function () {
      if ((typeof charger_require === "undefined" ? "undefined" : _typeof(charger_require)) !== undefined) {
        charger_require();
      }
    };

    $.modalbox(url, data);
  }); // lancement d'une médiabox

  $('#app').on('click', '.mediabox', function (e) {
    e.preventDefault();
    var confirmation = $(this).data('confirm');

    if (confirmation !== undefined) {
      if (!confirm(confirmation)) {
        return;
      }
    }

    var href = $(this).attr('href');
    $.fn.mediabox({
      href: href
    });
  });
});

function recupJson(d) {
  try {
    return JSON.parse(d);
  } catch (e) {
    console.log('erreur recupJson ', e);
    return false;
  }
}

var orderBy = function orderBy(arr, props, orders, champ) {
  return arr.sort(function (a, b) {
    return props.reduce(function (acc, prop, i) {
      if (acc === 0) {
        var _ref = orders && orders[i] === 'desc' ? [b[champ][prop], a[champ][prop]] : [a[champ][prop], b[champ][prop]],
            _ref2 = _slicedToArray(_ref, 2),
            p1 = _ref2[0],
            p2 = _ref2[1]; // passe en lowercase les String


        p1 = typeof p1 === 'string' ? p1.toLowerCase() : p1;
        p2 = typeof p2 === 'string' ? p2.toLowerCase() : p2; // Gestion du format de date
        // transforme 03/11/2000 en 20001103

        var re = /^(\d{2})\/(\d{2})\/(\d{2,4})$/;

        if (typeof p1 !== 'number') {
          var r1 = p1.match(re);

          if (Array.isArray(r1)) {
            p1 = r1[3] + r1[2] + r1[1];
          }

          var r2 = p2.match(re);

          if (Array.isArray(r2)) {
            p2 = r2[3] + r2[2] + r2[1];
          }
        }

        acc = p1 > p2 ? 1 : p1 < p2 ? -1 : 0;
      }

      return acc;
    }, 0);
  });
};

console.time('Chargement de VueJS AVANT Ajax');
console.time('Chargement de VueJs APRES Ajax');
Vue.nextTick(function () {
  console.timeEnd('Chargement de VueJS AVANT Ajax');
});

function exporterCSV(json, delimitercsv, name) {
  var csv = '';

  if (delimitercsv) {
    csv = Papa.unparse(json, {
      delimiter: delimitercsv
    });
  } else {
    csv = Papa.unparse(json);
  } //Download the file as CSV


  var link = document.createElement('a');
  link.setAttribute('href', 'data:text/csv;charset=utf-8,%EF%BB%BF' + encodeURIComponent(csv));
  link.setAttribute('download', name);
  link.style.visibility = 'hidden';
  document.body.appendChild(link);
  link.click();
  document.body.removeChild(link);
}

function trouver_index(table, id) {
  var i = -1;
  table.forEach(function (ligne, index) {
    if (ligne.html.id === parseInt(id)) {
      i = index;
    }
  });
  return i;
}

var monTableau = {
  props: {
    tparpage: {
      type: Array,
      default: function _default() {
        return [10, 20, 50, 'Tous'];
      }
    },
    apiuri: {
      type: String,
      required: true
    },
    champcsv: {
      type: String
    },
    delimitercsv: {
      type: String
    },
    namecsv: {
      type: String
    },
    url_sort_asc: {
      type: String
    },
    url_sort_desc: {
      type: String
    },
    urlvuebloc: {
      type: String
    },
    vueblocdefaut: {
      type: String,
      default: 'tableau'
    },
    filtrecolmulti: {
      type: String
    },
    nomblocajaxreload: {
      type: String
    },
    stockage: {
      type: String
    },
    includespip: {
      type: String
    },
    filtrer: {
      type: String
    },
    _id: {
      type: String
    },
    filtreselect: {
      type: String
    }
  },
  data: function data() {
    return {
      table: [],
      header: [],
      crayons: [],
      classes: [],
      ordreCol: [],
      filtreCol: [],
      filtreColExist: false,
      filtreColType: [],
      filtreColSelected: {},
      filtreColModif: 0,
      filtreColVal: {},
      search: this.filtrer,
      page: 1,
      parPage: sessionStorage.getItem('nbItems') ? sessionStorage.getItem('nbItems') : this.tparpage[0],
      parPageSelect: sessionStorage.getItem('nbItems') ? sessionStorage.getItem('nbItems') : this.tparpage[0],
      pages: [],
      triOrders: [],
      triProps: [],
      selectTr: [],
      champ_search: 'html',
      chargement: true,
      nameLocalStorage: this.calculer_nameLocalStorage(),
      quelleVue: this.vueblocdefaut,
      vuebloc: '',
      model: [],
      options: [],
      searchInputHead: '',
      searchInputVal: '',
      loadingVueSelect: true
    };
  },
  mounted: function mounted() {
    var _this = this;

    localforage.setDriver(localforage[this.stockage.toUpperCase()]);
    this.chargerJson();

    if (this.urlvuebloc) {
      fetch(this.urlvuebloc).then(function (response) {
        return response.text();
      }).then(function (data) {
        _this.vuebloc = data;
      });
    }

    setTimeout(function () {
      if (_this.ordreCol) {
        Object.entries(_this.ordreCol).forEach(function (_ref3) {
          var _ref4 = _slicedToArray(_ref3, 2),
              col = _ref4[0],
              sens = _ref4[1];

          _this.tri(col, sens);
        });
      }
    }, 500);
  },
  computed: {
    filtreColVal_visible: function filtreColVal_visible() {
      var head = this.searchInputHead;
      var val = this.searchInputVal;

      if (!head) {
        return this.filtreColVal;
      } else {
        var filtreColVal_visible = {};
        filtreColVal_visible[head] = this.filtreColVal[head].filter(function (v) {
          return v.toString().toLowerCase().indexOf(val.toLowerCase()) !== -1;
        });
        return filtreColVal_visible;
      }
    },
    tableau: function tableau() {
      var _this2 = this;

      this.setPages();

      if (!this.search && !this.filtreColModif) {
        return this.pagination(this.table);
      }

      return this.pagination(this.table.filter(function (ligne) {
        var rsearch = Object.values(ligne[_this2.champ_search]).toString().toLowerCase().indexOf(_this2.search.toLowerCase()) < 0 ? false : true;

        if (!rsearch) {
          return false;
        }

        Object.keys(_this2.filtreColSelected).forEach(function (colName) {
          if (rsearch) {
            var colValue = _this2.filtreColSelected[colName];

            if (colValue !== null) {
              if (!Array.isArray(colValue)) {
                colValue = [colValue];
              }

              var TcolValue = [];
              colValue.forEach(function (s) {
                if (Number.isInteger(s)) {
                  TcolValue.push(s);
                }

                if (s.length > 0) {
                  TcolValue.push(s.toLowerCase());
                }
              });

              if (TcolValue.length) {
                if (_this2.filtreColType[colName] === 'select') {
                  var Trsearch = TcolValue.some(function (uneValeur) {
                    if (Number.isInteger(uneValeur)) {
                      if (parseInt(ligne[_this2.champ_search][colName]) === uneValeur) {
                        return true;
                      }
                    } else {
                      if (!(uneValeur.indexOf(ligne[_this2.champ_search][colName].toString().toLowerCase().toString()) === -1 || !ligne[_this2.champ_search][colName].toString().toLowerCase())) {
                        return true;
                      }
                    }
                  });

                  if (!Trsearch) {
                    rsearch = false;
                  }
                } else {
                  if (ligne[_this2.champ_search][colName].toString().toLowerCase().indexOf(TcolValue.toString()) === -1) {
                    rsearch = false;
                  }
                }
              }
            }
          }
        });
        return rsearch;
      }));
    }
  },
  watch: {
    parPageSelect: function parPageSelect(e) {
      if (!parseInt(e)) {
        this.parPage = this.table.length;
      } else {
        this.parPage = e;
      }

      sessionStorage.setItem('nbItems', this.parPage);
    },
    table: function table() {
      this.saveHeader();
      var $table = [];
      $table = this.table;
      localforage.setItem(this.nameLocalStorage, JSON.stringify($table));
    },
    tableau: function tableau() {
      var _this3 = this;

      // ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
      // Si on veut filtrer la liste des options dynamique en fonction
      // du tri du tableau
      // ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
      if (this.filtrecolmulti === 'non') {
        this.filtreCol.forEach(function (col) {
          // let Tval = [''];
          var Tval = [];

          _this3.tableau.forEach(function (t) {
            var valCol = t[_this3.champ_search][col];

            if (Tval.indexOf(valCol) === -1) {
              Tval.push(valCol);
              _this3.filtreColValOk = true;
            }
          });

          _this3.filtreColVal[col] = Tval;
        });
      }
    },
    filtreColSelected: {
      handler: function handler() {
        if (!this.loadingVueSelect) {
          var ObfiltreSelect = [];

          if (this.filtreColSelected) {
            Object.entries(this.filtreColSelected).forEach(function (_ref5) {
              var _ref6 = _slicedToArray(_ref5, 2),
                  champ = _ref6[0],
                  valeurs = _ref6[1];

              if (!Array.isArray(valeurs)) {
                valeurs = [valeurs];
              }

              ObfiltreSelect.push({
                champ: champ,
                valeurs: valeurs
              });
            });
          }

          localStorage.setItem('filtreselect_' + this.nameLocalStorage, JSON.stringify(ObfiltreSelect));
        }
      },
      deep: true
    }
  },
  methods: {
    saveHeader: function saveHeader() {
      var $header = {
        header: this.header,
        crayons: this.crayons,
        classes: this.classes,
        filtreCol: this.filtreColType,
        ordreCol: this.ordreCol
      };

      if (!localStorage.getItem('header_' + this.nameLocalStorage)) {
        localStorage.setItem('headerJson_' + this.nameLocalStorage, JSON.stringify($header));
      }

      localStorage.setItem('header_' + this.nameLocalStorage, JSON.stringify($header));
    },
    deleteInputSearch: function deleteInputSearch(head) {
      this.loadingVueSelect = false;
      this.filtreColSelected[head] = [];
    },
    hanldeSearchInput: function hanldeSearchInput(event, head) {
      this.searchInputHead = head;
      this.searchInputVal = event.target.value;
    },
    selectValCol: function selectValCol() {
      this.filtreColModif++;
      this.searchInputVal = '';
      this.searchInputHead = '';
    },
    endLoadingVueSelect: function endLoadingVueSelect() {
      this.loadingVueSelect = false;
    },
    calculer_nameLocalStorage: function calculer_nameLocalStorage() {
      if (this.apiuri) {
        return this.apiuri.match(/.*page=(.*)/)[1];
      }

      return '';
    },
    chargerJson: function chargerJson(id) {
      var _this4 = this;

      this.chargement = true;
      var url = this.apiuri;

      if (parseInt(id) > 0) {
        url += '&id=' + id;
      } else {
        var config = localStorage.getItem('header_' + this.nameLocalStorage);
        config = recupJson(config);

        if (config && config.header !== undefined) {
          this.header = config.header;

          if (config.crayons !== undefined) {
            this.crayons = config.crayons;
          }

          if (config.classes !== undefined) {
            this.classes = config.classes;
          }

          if (config.ordreCol !== undefined) {
            this.ordreCol = config.ordreCol;
          }

          var filtreCol = [];

          if (config.filtreCol !== undefined) {
            filtreCol = config.filtreCol;
          }

          var that = this;
          localforage.getItem(that.nameLocalStorage).then(function (data) {
            data = recupJson(data);

            if (data && data.length) {
              that.table = data;

              if (data[0].search) {
                that.champ_search = 'search';
              }

              if (filtreCol !== undefined) {
                that.filtreColType = filtreCol;
                Object.keys(that.filtreColType).forEach(function (col) {
                  var Tval = []; // let Tval = [''];

                  that.table.forEach(function (t) {
                    var valCol = t[that.champ_search][col];

                    if (Tval.indexOf(valCol) === -1) {
                      Tval.push(valCol);
                    }
                  }); // that.filtreCol.push(col);

                  that.filtreColVal[col] = Tval;
                  that.filtreColSelected[col] = [];
                });
              }

              console.log('fin chargement local forage ');
            }

            if (that.nomblocajaxreload) {
              ajaxReload(that.nomblocajaxreload);
            }
          }).catch(function (err) {
            console.log(err);
          });
        }
      }

      fetch(url).then(function (response) {
        return response.json();
      }).then(function (data) {
        var config = data.shift();
        _this4.header = config.header;

        if (config.crayons !== undefined) {
          _this4.crayons = config.crayons;
        }

        if (config.classes !== undefined) {
          _this4.classes = config.classes;
        }

        if (config.ordreCol !== undefined) {
          _this4.ordreCol = config.ordreCol;
        }

        if (parseInt(id) > 0) {
          if (data.length > 0) {
            var i = trouver_index(_this4.table, id);
            _this4.table[i] = data[0];
          } else {
            var _i2 = trouver_index(_this4.table, id);

            _this4.table.splice(_i2, 1);
          }

          localforage.setItem(_this4.nameLocalStorage, JSON.stringify(_this4.table));
        } else {
          _this4.table = data;

          if (data[0] && data[0].search) {
            _this4.champ_search = 'search';
          }
        }

        if (config.filtreCol !== undefined) {
          _this4.filtreColType = config.filtreCol;
          _this4.filtreCol = [];
          Object.keys(_this4.filtreColType).forEach(function (col) {
            // let Tval = [''];
            var Tval = [];

            _this4.table.forEach(function (t) {
              var valCol = t[_this4.champ_search][col];

              if (valCol) {
                if (Tval.indexOf(valCol) === -1) {
                  Tval.push(valCol);
                }
              }
            });

            _this4.filtreCol.push(col);

            _this4.filtreColVal[col] = Tval;
            _this4.filtreColSelected[col] = [];
          });
        }

        Vue.nextTick(function () {
          _this4.chargement = false;
          var filtreselect = localStorage.getItem('filtreselect_' + _this4.nameLocalStorage);

          if (filtreselect) {
            var Tfiltres = JSON.parse(filtreselect);
            Tfiltres.forEach(function (col) {
              var v = col.valeurs;
              _this4.filtreColSelected[col.champ] = [].concat(_toConsumableArray(_this4.filtreColSelected[col.champ]), _toConsumableArray(v));
            });
            _this4.filtreColModif++;
          } else if (_this4.filtreselect) {
            var _Tfiltres = recupJson(decodeURIComponent(_this4.filtreselect));

            localStorage.setItem('filtreselect_' + _this4.nameLocalStorage, JSON.stringify(_Tfiltres));

            _Tfiltres.forEach(function (col) {
              _this4.filtreColSelected[col.champ] = [].concat(_toConsumableArray(_this4.filtreColSelected[col.champ]), _toConsumableArray(col.valeurs));
            });

            _this4.filtreColModif++;
          }

          if (parseInt(_this4._id) > 0) {
            var _id = parseInt(_this4._id);

            var parPage = parseInt(_this4.parPage);

            if (parseInt(parPage)) {
              var ordre = 0;
              Object.values(_this4.table).forEach(function (d, i) {
                if (_id === d.html.id) {
                  ordre = i + 1;
                }
              });

              if (ordre > parPage) {
                var numPage = parseInt(ordre / parPage) + 1;
                _this4.page = numPage;
              }
            }

            _this4.selectLigne(_id, 'id'); // let url = new URL(window.location);
            // url = url.href.replace('&_id=' + _id, '');
            // history.pushState({}, null, url);

          }

          if (_this4.nomblocajaxreload) {
            ajaxReload(_this4.nomblocajaxreload);
          }

          console.timeEnd('Chargement de VueJs APRES Ajax');
        });
      }).catch(function (error) {
        return console.log(error);
      });
    },
    setPages: function setPages() {
      var nombreDePages = Math.ceil(this.table.length / this.parPage);
      this.pages = [];

      for (var index = 1; index <= nombreDePages; index++) {
        this.pages.push(index);
      }
    },
    pagination: function pagination(tableau) {
      var page = this.page;
      var parPage = this.parPage;
      var from = page * parPage - parPage;
      var to = page * parPage;
      return tableau.slice(from, to);
    },
    afficher_crayons: function afficher_crayons(name, id) {
      if (Object.keys(this.crayons).indexOf(name) !== -1) {
        return "crayon ".concat(this.crayons[name], "-").concat(name, "-").concat(id);
      }
    },
    tri: function tri(col) {
      var sens = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
      var i = this.triProps.indexOf(col);

      if (i !== -1) {
        if (!sens) {
          sens = 'asc';

          if (this.triOrders[i] === 'asc') {
            sens = 'desc';
          }
        }

        this.triOrders[i] = sens;
      } else {
        if (!sens) {
          sens = 'asc';
        }

        this.triProps.push(col);
        this.triOrders.push(sens);
      }

      this.table = orderBy(this.table, this.triProps, this.triOrders, this.champ_search);
      this.ordreCol[col] = sens;
      this.saveHeader();
    },
    ordreActif: function ordreActif(col, sens) {
      var i = this.triProps.indexOf(col);

      if (i !== -1) {
        if (this.triOrders[i] === sens) {
          return 'active';
        }
      }
    },
    resetTri: function resetTri() {
      var _this5 = this;

      this.loadingVueSelect = false;
      this.table = orderBy(this.table, ['id'], '', this.champ_search);
      this.triOrders = [];
      this.triProps = [];
      this.ordreCol = [];
      Object.keys(this.filtreColType).forEach(function (col) {
        _this5.filtreColSelected[col] = [];
      });
    },
    selectLigne: function selectLigne(id, col) {
      if (col === 'id' && parseInt(id)) {
        var i = this.selectTr.indexOf(id);

        if (i !== -1) {
          this.selectTr.splice(i, 1);
        } else {
          this.selectTr.push(id);
        }
      }
    },
    exportCSV: function exportCSV() {
      var _this6 = this;

      var $csv = [];
      var $header = [];
      var $tableau = [];
      Object.keys(this.header).forEach(function (k) {
        return $header.push(k);
      });
      $tableau = this.tableau.reduce(function (acc, ligne) {
        var $uneLigne = [];
        Object.values(ligne[_this6.champcsv]).forEach(function (l) {
          return $uneLigne.push(l);
        });
        return [].concat(_toConsumableArray(acc), [[].concat($uneLigne)]);
      }, []);
      $csv = [[].concat($header)].concat(_toConsumableArray($tableau));
      exporterCSV($csv, this.delimitercsv, this.namecsv);
    },
    replaceBloc: function replaceBloc(ligne) {
      var html = this.vuebloc;
      Object.keys(ligne).forEach(function (key) {
        html = html.replace("@@".concat(key, "@@"), ligne[key]);
      });
      return html;
    },
    changerVue: function changerVue(vue) {
      this.quelleVue = vue;
    },
    ordonnerSelect: function ordonnerSelect(a, b) {
      if (Number.isInteger(a) && Number.isInteger(b)) {
        return a - b;
      } else {
        var x = a.toLowerCase();
        var y = b.toLowerCase();

        if (x < y) {
          return -1;
        }

        if (x > y) {
          return 1;
        }

        return 0;
      }
    }
  },
  template: "\n\t<div class=\"gamutable\">\n\t\t<div class=\"gamutable--surTable\">\n\t\t\t<select id=\"parPage\" v-model=\"parPageSelect\">\n\t\t\t\t<option v-for=\"v in tparpage\" :key=\"v\">{{v}}</option>\n\t\t\t</select>\n\t\t\t<input class=\"gamutable--rechercher\" type=\"text\" v-model=\"search\" placeholder=\"Rechercher\">\n\n\t\t\t<button class=\"btn gamutable--resetOrderBy\" type=\"button\" @click.stop=\"resetTri()\"\n\t\t\t\ttitle=\"R\xE9initialiser les tris des colonnes\">\n\t\t\t\t<i class=\"fa fas fa-eraser rouge\"></i>\n\t\t\t\t<i class=\"fa fa-filter fas\"></i>\n\t\t\t</button>\n\t\t\t<button class=\"btn var_gamutable\" type=\"button\" @click.stop=\"chargerJson()\"\n\t\t\t\ttitle=\"Forcer le rechargement\">\n\t\t\t\t<i class=\"fa fa-refresh fas fa-sync\"></i>\n\t\t\t</button>\n\n\t\t\t<button class=\"btn gamutable--vueTable\" title=\"Switcher en Vue tableau\"\n\t\t\t\t@click.stop=\"changerVue('tableau')\"\n\t\t\t\tv-if=\"this.vuebloc\"\n\t\t\t\tv-show=\"this.quelleVue === 'bloc'\">\n\t\t\t\t<i class=\"fas fa fa-table\"></i>\n\t\t\t</button>\n\n\t\t\t<button class=\"btn gamutable--vueBloc\" title=\"Switcher en Vue Bloc\"\n\t\t\t\t@click.stop=\"changerVue('bloc')\"\n\t\t\t\tv-if=\"this.vuebloc\"\n\t\t\t\tv-show=\"this.quelleVue === 'tableau'\">\n\t\t\t\t<i class=\"fas fa fa-th-large\"></i>\n\t\t\t</button>\n\t\t\t<button class=\"btn gamutable--exportCSV\" type=\"button\" @click.stop=\"exportCSV()\"\n\t\t\t\tv-show=\"this.namecsv\"\n\t\t\t\ttitle=\"Exporter le tableau affich\xE9 en csv\"\n\t\t\t>\n\t\t\t\t<i class=\"fa fa-file-excel-o fas fa-file-csv\" aria-hidden=\"true\"></i>\n\t\t\t</button>\n\t\t\t<span v-show=\"chargement\" class=\"rouge\">\n\t\t\t\t<i class=\"fa fa-refresh fa-spin fa-fw rouge fas fa-sync fa-spin\"></i>\n\t\t\t\t<span class=\"texteMajBDD\">\n\t\t\t\t\tMise \xE0 jour de la base de donn\xE9e\n\t\t\t\t</span>\n\t\t\t</span>\n\t\t\t<span v-show=\"!chargement\" class=\"btn verte\" style=\"cursor:auto;\"\n\t\t\t\ttitle=\"Base de donn\xE9e synchronis\xE9e !\"\n\t\t\t>\n\t\t\t\t<i class=\"fa fas fa-database\"></i>\n\t\t\t</span>\n\t\t\t<span class=\"gamutable-nbrMax\" :data-nbrmax=\"table.length\">{{tableau.length}} / {{table.length}} \xE9l\xE9ments</span>\n\t\t\t<span class=\"includespip\" v-html=\"this.includespip\"> </span>\n\t\t</div>\n\n\t\t<div class=\"vueBlocs\" v-if=\"quelleVue === 'bloc'\">\n\t\t\t<div class=\"vueBlocs-unbloc\"\n\t\t\tv-for=\"(ligne) in tableau\"\n\t\t\t:key=ligne.id\n\t\t\tv-html=replaceBloc(ligne.html)\n\t\t\t>\n\t\t\t</div>\n\t\t</div>\n\t\t<table class=\"table table--zebra\" v-if=\"quelleVue === 'tableau'\">\n\t\t\t<thead>\n\t\t\t\t<tr>\n\t\t\t\t\t<th v-for=\"(label,head,i) in header\" :key=\"'head_'+i\" :class=\"[head,classes[head]]\">\n\t\t\t\t\t\t<span class=\"gt_labels\">\n\t\t\t\t\t\t\t<span v-html=\"label\"></span>\n\t\t\t\t\t\t\t<span class=\"iconeTri\">\n\t\t\t\t\t\t\t\t<i class=\"fa fa-sort-asc fa-sort-up\" :class=\"ordreActif(head, 'asc')\" aria-hidden=\"true\" @click.stop=\"tri(head,'asc')\"></i>\n\t\t\t\t\t\t\t\t<i class=\"fa fa-sort-desc fa-sort-down\" :class=\"ordreActif(head, 'desc')\" aria-hidden=\"true\" @click.stop=\"tri(head,'desc')\"></i>\n\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t</span>\n\t\t\t\t\t</th>\n\t\t\t\t</tr>\n\t\t\t\t<tr v-if=\"filtreCol.length\" class=\"filtreColonne\">\n\t\t\t\t\t<th v-for=\"(label,head,i) in header\" :key=\"'filtreCol_'+i\">\n\t\t\t\t\t\t<div v-if=\"filtreCol.indexOf(head) !== -1\" :id=\"'filtreCol_'+head\" :class=\"classes[head]\">\n\t\t\t\t\t\t\t<vue-select\n\t\t\t\t\t\t\t\tv-if=\"filtreColType[head] === 'select'\"\n\t\t\t\t\t\t\t\tv-model=\"filtreColSelected[head]\"\n\t\t\t\t\t\t\t\t:options=\"filtreColVal[head].sort(ordonnerSelect)\"\n\t\t\t\t\t\t\t\t:visible-options=\"filtreColVal_visible[head]\"\n\t\t\t\t\t\t\t\thide-selected\n\t\t\t\t\t\t\t\tmultiple\n\t\t\t\t\t\t\t\ttaggable\n\t\t\t\t\t\t\t\tclose-on-select\n\t\t\t\t\t\t\t\tclear-on-close\n\t\t\t\t\t\t\t\tsearchable\n\t\t\t\t\t\t\t\t@selected=\"selectValCol\"\n\t\t\t\t\t\t\t\t@search:focus=\"endLoadingVueSelect\"\n\t\t\t\t\t\t\t\t@removed=\"endLoadingVueSelect\"\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<template #tag=\"{ option, remove }\">\n\t\t\t\t\t\t\t\t\t<div class=\"tag--un\">\n\t\t\t\t\t\t\t\t\t\t{{ option }}\n\t\t\t\t\t\t\t\t\t\t<span class=\"tag--remove pointer\" title=\"Cliquer pour supprimer \"@click.stop=\"remove\">x</span>\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t</template>\n\t\t\t\t\t\t\t</vue-select>\n\n\t\t\t\t\t\t\t<input\n\t\t\t\t\t\t\t\tv-if=\"filtreColType[head] === 'input'\"\n\t\t\t\t\t\t\t\tclass=\"gamutable__input--filtrer\"\n\t\t\t\t\t\t\t\tv-model=\"filtreColSelected[head]\"\n\t\t\t\t\t\t\t\ttype=\"text\"\n\t\t\t\t\t\t\t\tplaceholder=\"Rechercher\"\n\t\t\t\t\t\t\t\t@keydown=\"endLoadingVueSelect\"\n\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<button\n\t\t\t\t\t\t\t\tv-if=\"filtreColType[head] === 'input' && filtreColSelected[head].length !== 0\"\n\t\t\t\t\t\t\t\t@click.stop=\"deleteInputSearch(head)\"\n\t\t\t\t\t\t\t\ttitle=\"Vider ce champ\"\n\t\t\t\t\t\t\t\tclass=\"gamutable__input--filtrer\"\n\t\t\t\t\t\t\t>X</button>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</th>\n\t\t\t\t</tr>\n\t\t\t</thead>\n\t\t\t<tbody>\n\t\t\t\t<tr v-for=\"l in tableau\" :key=\"l.html.id\" :class=\"selectTr.indexOf(l.html.id) !== -1 ? 'select' : ''\" >\n\t\t\t\t\t<td v-for=\"(td,name, i) in l.html\" :key=\"'td_'+i\" :class=\"[afficher_crayons(name,l.html.id), name, classes[name], l.classes !== undefined ? l.classes[name] : '']\" v-html=\"td\" @click=\"selectLigne(l.html.id,name)\">\n\t\t\t\t\t</td>\n\t\t\t\t</tr>\n\t\t\t</tbody>\n\t\t</table>\n\t\t<div class=\"gamutable--sousTable\">\n\t\t\t<div class=\"gamutable-nbrMax\">{{tableau.length}} / {{table.length}} \xE9l\xE9ments</div>\n\t\t\t<div class=\"gamutable--pagination\">\n\t\t\t\t<div class=\"page-item\">\n\t\t\t\t\t<button type=\"button\" class=\"page-link\" v-if=\"page != 1\" @click=\"page=1\"> Premier </button>\n\t\t\t\t\t<button type=\"button\" class=\"page-link\" v-if=\"page != 1\" @click=\"page--\"> Pr\xE9c\xE9dent </button>\n\t\t\t\t</div>\n\t\t\t\t<div class=\"page-item\">\n\t\t\t\t\t<button type=\"button\" class=\"page-link\" :class=\"{'on':pageNumber===page}\" v-for=\"pageNumber in pages.slice(page-4 < 0 ? 0 : page-4, page+3)\" @click=\"page = pageNumber\"> {{pageNumber}} </button>\n\t\t\t\t</div>\n\t\t\t\t<div class=\"page-item\">\n\t\t\t\t\t<button type=\"button\" @click=\"page++\" v-if=\"page < pages.length\" class=\"page-link\"> Suivant </button>\n\t\t\t\t\t<button type=\"button\" @click=\"page=pages.length\" v-if=\"page < pages.length\" class=\"page-link\"> Dernier </button>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t</div>\n\t</div>"
};
var gamuTable = {
  components: {
    monTableau: monTableau
  },
  methods: {
    rechargerJson: function rechargerJson(id) {
      this.$refs.montableau.chargerJson(id);
    },
    rechargerJson_deux: function rechargerJson_deux(id) {
      this.$refs.montableau_deux.chargerJson(id);
    }
  }
};
var app = Vue.createApp(gamuTable).component('vue-select', window.VueNextSelect).mount('#app');