Vue.config.devtools = true; Vue.component('v-select', VueSelect.VueSelect) var t = new Vue({ el: '#app_telofony', components: { //vueSelect: window.vueSelect, vuejsDatepicker: window.vuejsDatepicker }, data: function() { return { list: [], page: 1, myAudio: [], isNewPage: true, limit: 15, isTotal: false, total: 0, period: [ { code: 'today', date_period: 'Сегодня' }, { code: 'yesterday', date_period: 'Вчера' }, { code: 'week', date_period: 'Неделя' }, { code: 'month', date_period: 'Месяц' }, { code: 'quarter', date_period: 'Квартал' }, { code: 'year', date_period: 'Год' }, { code: 'period', date_period: 'Период' } ], selectedPeriod: 'today', ru: vdp_translation_ru.js, format: "dd.MM.yyyy", state: { date_from: new Date(), date_to: new Date() }, users: [], selectedUser: '', status: [{ code: 'all', name: 'Все' }, { code: 'accepted', name: 'Cостоявшийся' }, { code: 'skip', name: 'Пропущенный' } ], duration: [ { code: 'all', name: 'Любая' }, { code: 'less', name: 'До 1 мин' }, { code: '1to3min', name: '1 - 3 мин' }, { code: '3to10min', name: '3 - 10 мин' }, { code: '10to30min', name: '10 - 30 мин' }, { code: 'more', name: 'более…' } ], selectedStatus: 'all', selectedDuration: 'all', call_number: '', in_call_number: '', in_out: [{ code: 'all', name: 'Все' }, { code: 'in', name: 'Входящие' }, { code: 'out', name: 'Исходящие' } ], selectedIn_out: 'all', source: 'all', sourceArr: [{ code: 'all', name: '' }], isLoad: false, isLoadPage: false, is_call_record: 0, } }, methods: { isEmpty: function(data) { if (typeof(data) === 'object') { if (JSON.stringify(data) === '{}' || JSON.stringify(data) === '[]') { return true; } else if (!data) { return true; } return false; } else if (typeof(data) === 'string') { if (!data.trim()) { return true; } return false; } else if (typeof(data) === 'undefined') { return true; } else { return false; } }, start: function() { //console.log('vue_telofony'); $('#app_telofony').removeClass('hidden'); this.get_new_telephone(); }, get_telephone: function() { if (!this.isLoadPage) { this.isLoadPage = true; var date_from = this.get_php_date(this.state.date_from); var date_to = this.get_php_date(this.state.date_to); var agencyId = $('#SesAgencyId').val(); //console.log(this.selectedUser); axios.post('/ajax/ajax_telephone.php', { request: 'get_telephone', page: this.page, limit: this.limit, date_from: date_from, date_to: date_to, user: this.selectedUser, status: this.selectedStatus, duration: this.selectedDuration, call_number: this.call_number, in_call_number: this.in_call_number, agency_id: agencyId, in_out: this.selectedIn_out, source: this.source, is_call_record: this.is_call_record, }).then((response) => { console.log(response.data); var agency_id = response.data.agency_id; this.isNewPage = false; this.total = response.data.total; if (this.page == 1) { this.users = response.data.users; } if (response.data.list.length < this.limit) { this.isTotal = true; }; for (var i = 0; i < response.data.list.length; i++) { this.list.push(response.data.list[i]); var item = response.data.list[i]; if (!this.isEmpty(item.records)) { for (var r = 0; r < item.records.length; r++) { //app.$set(app.progressUoload[index], 'progress', pr); var rec = { 'rec': new Audio(), 'src': item.records[r], play: false }; this.$set(this.myAudio, item.records[r], rec); //this.myAudio[item.records[r]] = {'rec': new Audio(), 'src': '/server/mango/'+item.records[r]+'.mp3', play: false}; //this.list[i].audio.push({'rec': new Audio(), 'src': '/server/mango/'+item.records[r]+'.mp3', play: false}); } } } this.isLoadPage = false; //console.log(this.myAudio); //console.log(response.data); }) .catch(function(error) { console.log(error); }); } }, get_new_telephone: function() { this.list = []; this.page = 1; this.myAudio = []; this.isNewPage = true; this.isTotal = false; this.get_telephone(); }, play_record: function(record, index) { for (var j in this.myAudio) { if (j != record && this.myAudio[j].rec && !this.isEmpty(this.myAudio[j].rec.src)) { this.myAudio[j].rec.pause(); this.myAudio[j].play = false; } } if (this.myAudio[record].play) { this.myAudio[record].rec.pause(); this.myAudio[record].play = false; } else { if (this.isEmpty(this.myAudio[record].rec.src)) { this.myAudio[record].rec.src = this.myAudio[record].src; } this.myAudio[record].rec.play(); this.myAudio[record].play = true; } }, next_page: function() { this.page++; this.isNewPage = true; this.get_telephone(); }, change_period: function(value) { console.log(value); var date = new Date(); var date_to = new Date(); switch (value) { case "today": { this.state.date_from = date; this.state.date_to = date_to; break; } case "yesterday": { date.setDate(date.getDate() - 1); this.state.date_from = date; date_to.setDate(date_to.getDate() - 1); this.state.date_to = date_to; break; } case "week": { this.state.date_to = date_to; date.setDate(date.getDate() - 7); this.state.date_from = date; break; } case "month": { this.state.date_to = date_to; date.setDate(date.getDate() - 30); this.state.date_from = date; break; } case "quarter": { this.state.date_to = date_to; date.setDate(date.getDate() - 90); this.state.date_from = date; break; } case "year": { this.state.date_to = date_to; date.setDate(date.getDate() - 365); this.state.date_from = date; break; } case "period": { this.state.date_to = date_to; this.state.date_from = date; break; } default: { this.state.date_from = date_to; this.state.date_to = date; break; } } }, get_php_date: function(date) { var day = date.getDate(); //console.log(day); var month = date.getMonth(); //console.log(month); var year = date.getFullYear(); //console.log(year); //console.log(day+'.'+(month+1)+'.'+year); return day + '.' + (month + 1) + '.' + year; }, exportExcel: function() { if (!this.isLoad) { var agencyId = $('#SesAgencyId').val(); if (agencyId > 0) { this.isLoad = true; $.post("/ajax/export_excel_calls.php", { agency_id: agencyId, }, function(data) { t.isLoad = false; // $(that).data('state', 'ready'); // $("#export_objects_loader").hide(); console.log(data); let res = JSON.parse(data); if (res.result == 'ok') { let $a = $(""); $a.attr("href", res.file); $("body").append($a); $a.attr("download", res.name); $a[0].click(); $a.remove(); } }); } } }, }, mounted: function() { axios.post('/ajax/ajax_telephone.php', { request: 'get_source', }).then((response) => { //console.log(response.data); this.sourceArr = response.data; }) .catch(function(error) { console.log(error); }); } });