CertifInfoSearch.vue 1.57 KB
Newer Older
1
<template>
2
  <div id="CertifInfoSearch">
3 4
    <div class="container">
      <div class="row">
5 6 7
        <div class="col-md-12">
					<h2>Certif Info</h2>
          <input type="text" ref="certifinfo" placeholder="Code Certif Info" v-model="certifinfo" class="form-control"><br>
8
          <input @click="search()" type="button" class="btn main-button pull-right" value="Chercher">
9
        </div>
10 11 12 13
      </div>
      <br>
      <div class="row">
        <div class="col-md-12 results">
14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30
          <div v-if="this.certifinfo && Object.keys(this.results).length">
            <ul class="dash">
              <li v-for="(result,code) in this.results" :key="code">
                {{ result.text }}
              </li>
            </ul>
          </div>
          <div v-if="this.certifinfo && this.resultsIsEmpty">
            <p> Aucune certification trouvée avec l'identifiant «{{ this.certifinfo }}».</p>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>
<script>
  export default {
31
		name: 'CertifInfoSearch',
32 33 34 35 36 37 38 39 40
		data: function () {
			return {
        certifinfo: "",
        results: {},
        resultsIsEmpty: false,
			}
		},
		methods: {
			search: function () {
41 42 43 44 45 46 47
        this.$http
          .get('/certifinfo?q='+this.certifinfo)
          .then(response => {
            this.results = response.body;
            this.resultsIsEmpty = this.isEmpty(this.results);
          })
          .created;
48 49 50
			},
      isEmpty: function (obj) {
        for(var key in obj) {
51
          if(obj.hasOwnProperty(key)) return false;
52 53 54
        }
        return true;
      }
55
		}
56 57
  }
</script>