re merge ticket559

This commit is contained in:
Vincent BRIDIER 2022-03-31 11:33:43 +02:00
commit 25ccced946
No known key found for this signature in database
GPG key ID: 8571BFA20420D512
3 changed files with 41 additions and 13 deletions

5
resources/js/app.js vendored
View file

@ -70,6 +70,8 @@ moment.locale('fr', {
moment.locale('fr');
Vue.prototype.moment = moment
Vue.prototype.$window = window
Vue.prototype.$displayStatus = 'Grid'
// Vue
import Vue from 'vue';
@ -209,7 +211,8 @@ const store = new Vuex.Store({
}
});
new Vue({
// * Make Vue prototype accessible to jquery
window.Vue = new Vue({
el: '#vue-app',
store,
components: {

View file

@ -3,11 +3,11 @@
<div v-show="scrollLoader" class="scrollLoader"><div class="animated slideInUp"><i class="fa fa-circle-notch fa-spin"></i> Chargements des médias</div></div>
<div class="media_container">
<div v-show="loader" class="loader"><i class="fa fa-circle-notch fa-spin"></i></div>
<div class="wrapper" v-if="medias.data">
<div v-if="showDateSeparators() && medias.data.length" class="date-separator">{{formatDate(medias.data[0].updated_at)}}</div>
<div :class="'wrapper' + ($displayStatus == 'Grid' ? '' : ' inline')" v-if="medias.data">
<div v-if="showDateSeparators() && medias.data.length" class="date-separator">Date de {{ dateSorted === 'updated_at' ? 'modification' : 'création' }} : {{formatDate(medias.data[0][dateSorted])}}</div>
<div v-else class="noresult" >Aucun résultat</div>
<template v-for="media,index in medias.data">
<div v-if="showDateSeparators() && !isSameDay(media,medias.data[Math.max(index-1,0)])" class="date-separator">{{formatDate(media[dateSorted])}}</div>
<div v-if="showDateSeparators() && !isSameDay(media,medias.data[Math.max(index-1,0)])" class="date-separator">Date de {{ dateSorted === 'updated_at' ? 'modification' : 'création' }} : {{formatDate(media[dateSorted])}}</div>
<div @dragstart="dragStart(media, $event)" v-on:dblclick="edit(media)" @click="select(media)" :class=" isCAQuery && media.id !== lastVersion.id ? 'imageItem not-last-version' : 'imageItem'" :draggable="medias.draggable" :aria-grabbed="storeGrabbed.filter(e => e.id === media.id).length > 0">
<div class="etiquette" :style="'background-color:' + media.etiquette.color + '; border-color:' + media.etiquette.color + ';'" :data-id="media.etiquette.etiquette_id" >{{media.etiquette.libelle}}</div>

43
resources/js/media.js vendored
View file

@ -1,4 +1,31 @@
$(document).ready(function() {
let methods = {
refreshDisplay() {
if (__MEDIAS.displayStatus === 'Grid') {
__MEDIAS.methods.displayGrid()
} else {
__MEDIAS.methods.displayList()
}
},
displayGrid() {
Vue.__proto__.$displayStatus = 'Grid'
__MEDIAS.displayStatus = 'Grid'
$(".action_wrapper .display .fa-th-list").removeClass('selected');
$(".media_container .wrapper").removeClass('inline');
},
displayList() {
Vue.__proto__.$displayStatus = 'List'
__MEDIAS.displayStatus = 'List'
$(".action_wrapper .display .fa-th").removeClass('selected');
$(".media_container .wrapper").addClass('inline');
}
};
window.__MEDIAS = {
displayStatus: 'Grid',
methods: methods
}
$(document).ready(function () {
$.ajaxSetup({
headers:
@ -82,16 +109,14 @@ $(document).ready(function() {
}
} else {
if($(this).hasClass('fa-th')){ // mode mosaique
if(!$(this).hasClass('selected')){
$(".action_wrapper .display .fa-th-list").removeClass('selected');
$(this).addClass('selected');
$(".media_container .wrapper").removeClass('inline');
if (!$(this).hasClass('selected')) {
$(this).addClass('selected')
methods.displayGrid()
}
}else{ // mode liste
if(!$(this).hasClass('selected')){
$(".action_wrapper .display .fa-th").removeClass('selected');
$(this).addClass('selected');
$(".media_container .wrapper").addClass('inline');
if (!$(this).hasClass('selected')) {
$(this).addClass('selected')
methods.displayList()
}
}
}