var app = new Vue({
el: '#app-distribution-index',
data: {
baseUrl: $('meta[name=baseurl]').attr('content'),
date: null,
dateFormat: null,
loading: true,
distribution: {
active: false,
},
producer: null,
oneDistributionWeekActive: false,
products: [],
countActiveProducts: 0,
pointsSale: [],
idActivePointSale: 0,
idDefaultPointSale: 0,
countActivePointsSale: 0,
countOrdersByPointSale: [],
orders: [],
ordersUpdate: [],
countOrders: 0,
users: [],
showModalProducts: false,
showModalPointsSale: false,
showModalFormOrderCreate: false,
orderCreate: null,
showModalFormOrderUpdate: false,
idOrderUpdate: 0,
showViewProduct: false,
idOrderView: 0,
showModalPayment: false,
idOrderPayment: 0,
showLoading: false,
calendar: {
mode: 'single',
attrs: [],
themeStyles: {
wrapper: {
background: '#F7F7F7',
color: '#333',
border: 'solid 1px #e0e0e0'
},
header: {
padding: '10px 10px',
},
headerHorizontalDivider: {
borderTop: 'solid rgba(255, 255, 255, 0.2) 1px',
width: '80%',
},
weekdays: {
color: '#e0e0e0',
fontWeight: '600',
padding: '10px 10px',
fontSize: '2rem'
},
weeks: {
padding: '0 15px 15px 15px',
},
dayContent: function(object) {
var style = {
fontSize: '2rem',
padding: '16px',
};
if(object.isHovered || object.isFocus) {
style.backgroundColor = '#F39C12' ;
}
return style ;
},
},
formats: {
dayPopover: 'DD/MM/YYYY'
}
},
},
mounted: function() {
if($('#distribution-date').size()) {
this.date = new Date($('#distribution-date').html()) ;
this.dateFormat = ('0' + this.date.getDate()).slice(-2)+ '/'
+ ('0' + (this.date.getMonth() +1)).slice(-2) + '/'
+ this.date.getFullYear() ;
}
this.init() ;
this.loading = false ;
},
methods: {
getDate: function() {
return this.formatDate(this.date) ;
},
formatDate: function(date) {
if(date) {
return date.getFullYear() + '-'
+ ('0' + (date.getMonth() +1)).slice(-2) + '-'
+ ('0' + date.getDate()).slice(-2) ;
}
return false ;
},
init: function(idActivePointSale) {
var app = this ;
this.showLoading = true ;
axios.get("ajax-infos",{params: {date : this.getDate()}})
.then(function(response) {
app.distribution = response.data.distribution ;
app.producer = response.data.producer ;
app.products = response.data.products ;
app.initCountActiveProducts() ;
app.oneDistributionWeekActive = response.data.one_distribution_week_active ;
app.countOrders = 0 ;
if(response.data.orders) {
app.orders = JSON.parse(JSON.stringify(response.data.orders)) ;
app.ordersUpdate = JSON.parse(JSON.stringify(response.data.orders)) ;
for(i=0 ; i < app.orders.length ; i++) {
if(!app.orders[i].date_delete) {
app.countOrders ++ ;
}
}
}
else {
app.orders = [] ;
}
if(response.data.order_create) {
app.orderCreate = response.data.order_create ;
app.idDefaultPointSale = app.orderCreate.id_point_sale ;
}
if(response.data.points_sale) {
app.pointsSale = response.data.points_sale ;
app.initPointsSale(idActivePointSale) ;
}
else {
app.pointsSale = [] ;
}
if(response.data.users) {
app.users = response.data.users ;
}
app.calendar.attrs = [] ;
var distributions = response.data.distributions ;
if(distributions.length) {
for(var i= 0; i < distributions.length; i++) {
app.calendar.attrs.push({
highlight: {
backgroundColor: '#5cb85c',
},
contentStyle: {
color: 'white',
},
dates: distributions[i].date,
}) ;
}
}
app.showLoading = false ;
}) ;
},
initCountActiveProducts: function() {
this.countActiveProducts = 0 ;
for(var i= 0; i < this.products.length; i++) {
if(this.products[i].productDistribution[0].active == 1) {
this.countActiveProducts ++ ;
}
}
},
initPointsSale: function(idActivePointSale) {
this.countActivePointsSale = 0 ;
this.setIdActivePointSale(0) ;
for(var i= 0; i < this.pointsSale.length; i++) {
if(this.pointsSale[i].pointSaleDistribution[0].delivery == 1) {
this.countActivePointsSale ++ ;
this.setIdActivePointSale(this.pointsSale[i].id) ;
}
}
if(this.countActivePointsSale > 1) {
this.setIdActivePointSale(0) ;
}
if(idActivePointSale) {
this.setIdActivePointSale(idActivePointSale) ;
}
this.countOrdersByPointSale = [] ;
for(var i = 0; i < this.pointsSale.length ; i++) {
this.countOrdersByPointSale[this.pointsSale[i].id] = 0 ;
}
for(var i = 0; i < this.orders.length ; i++) {
this.countOrdersByPointSale[this.orders[i].id_point_sale] ++ ;
}
},
dayClicked: function(day) {
this.date = day.date ;
this.dateFormat = ('0' + this.date.getDate()).slice(-2)+ '/'
+ ('0' + (this.date.getMonth() +1)).slice(-2) + '/'
+ this.date.getFullYear() ;
this.init() ;
},
productQuantityMaxChange: function(event) {
axios.get("ajax-process-product-quantity-max",{params: {
idDistribution: this.distribution.id,
idProduct: event.currentTarget.getAttribute('data-id-product'),
quantityMax: event.currentTarget.value
}})
.then(function(response) {
}) ;
},
productActiveClick: function(event) {
var idProduct = event.currentTarget.getAttribute('data-id-product') ;
var activeProduct = event.currentTarget.getAttribute('data-active-product') ;
axios.get("ajax-process-active-product",{params: {
idDistribution: this.distribution.id,
idProduct: idProduct,
active: activeProduct
}})
.then(function(response) {
}) ;
for(i = 0 ; i < this.products.length ; i++) {
if(this.products[i].id == idProduct) {
this.products[i].productDistribution[0].active = activeProduct ;
}
}
this.initCountActiveProducts() ;
},
pointSaleActiveClick: function(event) {
var idPointSale = event.currentTarget.getAttribute('data-id-point-sale') ;
var deliveryPointSale = event.currentTarget.getAttribute('data-delivery-point-sale') ;
axios.get("ajax-process-active-point-sale",{params: {
idDistribution: this.distribution.id,
idPointSale: idPointSale,
delivery: deliveryPointSale
}})
.then(function(response) {
}) ;
for(i = 0 ; i < this.pointsSale.length ; i++) {
if(this.pointsSale[i].id == idPointSale) {
this.pointsSale[i].pointSaleDistribution[0].delivery = deliveryPointSale ;
}
}
this.initPointsSale() ;
},
activeDistribution: function(event) {
var app = this ;
axios.get("ajax-process-active-distribution",{params: {
idDistribution: this.distribution.id,
active: event.currentTarget.getAttribute('data-active')
}})
.then(function(response) {
app.init() ;
}) ;
},
activeWeekDistribution: function(event) {
var app = this ;
axios.get("ajax-process-active-week-distribution",{params: {
date: this.date.getFullYear() + '-'
+ ('0' + (this.date.getMonth() +1)).slice(-2) + '-'
+ ('0' + this.date.getDate()).slice(-2),
active: event.currentTarget.getAttribute('data-active')
}})
.then(function(response) {
app.init() ;
}) ;
},
pointSaleClick: function(event) {
this.setIdActivePointSale(event.currentTarget.getAttribute('data-id-point-sale')) ;
},
setIdActivePointSale: function(id) {
this.idActivePointSale = id ;
if(!id) {
this.orderCreate.id_point_sale = this.idDefaultPointSale ;
}
else {
this.orderCreate.id_point_sale = id ;
}
},
orderCreatedUpdated: function() {
this.showModalFormOrderCreate = false ;
this.showModalFormOrderUpdate = false ;
this.init(this.idActivePointSale) ;
},
deleteOrderClick: function(event) {
var app = this ;
var idOrder = event.currentTarget.getAttribute('data-id-order') ;
axios.get(UrlManager.getBaseUrlAbsolute()+"order/ajax-delete",{params: {
idOrder: idOrder
}})
.then(function(response) {
app.init(app.idActivePointSale) ;
}) ;
},
updateOrderClick: function(event) {
var idOrder = event.currentTarget.getAttribute('data-id-order') ;
this.idOrderUpdate = idOrder ;
this.showModalFormOrderUpdate = true ;
},
orderPaymentModalClick: function(event) {
var idOrder = event.currentTarget.getAttribute('data-id-order') ;
this.idOrderPayment = idOrder ;
this.showModalPayment = true ;
},
orderPaymentClick: function(event) {
var app = this ;
var idOrder = event.currentTarget.getAttribute('data-id-order') ;
if(!idOrder) {
idOrder = this.idOrderPayment ;
}
axios.get(UrlManager.getBaseUrlAbsolute()+"order/ajax-payment",{params: {
idOrder: idOrder,
type: event.currentTarget.getAttribute('data-type'),
amount: event.currentTarget.getAttribute('data-amount')
}})
.then(function(response) {
app.init(app.idActivePointSale) ;
}) ;
},
orderViewClick: function(event) {
var currentIdOrderView = event.currentTarget.getAttribute('data-id-order') ;
if(this.idOrderView == currentIdOrderView) {
this.showViewProduct = !this.showViewProduct ;
}
else {
this.showViewProduct = true ;
this.idOrderView = currentIdOrderView ;
}
},
closeModalProducts: function() {
this.showModalProducts = false ;
this.init(this.idActivePointSale) ;
},
cloneOrder: function(order) {
var clone = Object.assign({}, order) ;
clone.productOrder = {} ;
for(var key in order.productOrder) {
clone.productOrder[key] = order.productOrder[key] ;
}
return clone ;
}
},
});
Vue.component('modal', {
template: '#modal-template'
})
Vue.component('order-form',{
props: ['date', 'pointsSale', 'users', 'products', 'order'],
data: function() {
return {
errors: [],
idPointSale: 0,
idUser: 0,
username : '',
comment: '',
} ;
},
template: '#order-form-template',
methods: {
checkForm: function() {
this.errors = [] ;
var countProducts = 0 ;
for(var key in this.order.productOrder) {
if(this.order.productOrder[key] > 0) {
countProducts ++ ;
}
}
if(this.order.id_point_sale
&& (this.order.id_user || (this.order.username && this.order.username.length))
&& countProducts > 0) {
return true ;
}
if(!this.order.id_point_sale) {
this.errors.push('Veuillez sélectionner un point de vente') ;
}
if(!this.order.id_user && !this.order.username) {
this.errors.push('Veuillez sélectionner ou saisir un utilisateur') ;
}
if(!countProducts) {
this.errors.push('Veuillez sélectionner au moins un produit') ;
}
},
submitFormCreate: function(event) {
var app = this ;
if(this.checkForm()) {
var processCredit = event.currentTarget.getAttribute('data-process-credit') ;
axios.get(UrlManager.getBaseUrlAbsolute()+"order/ajax-create",{params: {
date: this.date.getFullYear() + '-'
+ ('0' + (this.date.getMonth() +1)).slice(-2) + '-'
+ ('0' + this.date.getDate()).slice(-2),
idPointSale: this.order.id_point_sale,
idUser: this.order.id_user,
username: this.order.username,
products: JSON.stringify(this.order.productOrder),
comment: this.order.comment,
processCredit: processCredit
}})
.then(function(response) {
app.order.id_point_sale = 0 ;
app.order.id_user = 0 ;
app.order.username = '' ;
app.order.comment = '' ;
for(i=0 ; i<app.order.productOrder.length ; i++) {
app.order.productOrder[i] = 0 ;
}
app.$emit('ordercreatedupdated') ;
}) ;
}
},
submitFormUpdate: function(event) {
var app = this ;
if(this.checkForm()) {
var processCredit = event.currentTarget.getAttribute('data-process-credit') ;
axios.get(UrlManager.getBaseUrlAbsolute()+"order/ajax-update",{params: {
date: this.date.getFullYear() + '-'
+ ('0' + (this.date.getMonth() +1)).slice(-2) + '-'
+ ('0' + this.date.getDate()).slice(-2),
idOrder: this.order.id,
idPointSale: this.order.id_point_sale,
idUser: this.order.id_user,
username: ''+this.order.username,
products: JSON.stringify(this.order.productOrder),
comment: this.order.comment,
processCredit: processCredit
}})
.then(function(response) {
app.$emit('ordercreatedupdated') ;
}) ;
}
},
productQuantityClick: function(id_product, quantity) {
if(this.order.productOrder[id_product] + quantity >= 0) {
var theQuantity = this.order.productOrder[id_product] + quantity ;
Vue.set(this.order.productOrder, id_product, theQuantity);
}
}
}
}) ;