367 lines
15 KiB
JavaScript
367 lines
15 KiB
JavaScript
|
|
||
|
|
var funnelchecklist = new Vue({
|
||
|
|
el: '#funnel_check_list',
|
||
|
|
components: {
|
||
|
|
|
||
|
|
vuejsDatepicker: window.vuejsDatepicker
|
||
|
|
},
|
||
|
|
data(){
|
||
|
|
|
||
|
|
return {
|
||
|
|
ru: vdp_translation_ru.js,
|
||
|
|
isShow: false,
|
||
|
|
errorText: '',
|
||
|
|
errorMes: false,
|
||
|
|
isPreloader: 1,
|
||
|
|
steps: [],
|
||
|
|
typePole: {"Строка": "input",
|
||
|
|
"Текст": "textarea",
|
||
|
|
"Ветвление этапов": "select",
|
||
|
|
"Дата":"date",
|
||
|
|
"Файл":"file",
|
||
|
|
"Задача на выбор":"checkbox",
|
||
|
|
"Задаток":"deposit",
|
||
|
|
"Ожидаемая комиссия":"commission",
|
||
|
|
"Расходы":"expenses"
|
||
|
|
},
|
||
|
|
format: "dd.MM.yyyy",
|
||
|
|
mondayfirst: true,
|
||
|
|
selectFile: {'file':{}, 'typeFile': '', 'classFile': '', 'guid': '', 'progress': 0, 'isUpload': false, 'uploads': false, 'is': false},
|
||
|
|
classTypesFile:{'xls': 'far fa-file-excel',
|
||
|
|
'xlsx': 'far fa-file-excel',
|
||
|
|
'doc': 'far fa-file-word',
|
||
|
|
'docx': 'far fa-file-word',
|
||
|
|
'img': 'far fa-file-image',
|
||
|
|
'png': 'far fa-file-image',
|
||
|
|
'pdf': 'far fa-file-pdf',
|
||
|
|
'txt': 'far fa-file-alt',
|
||
|
|
'xml': 'far fa-file-alt',
|
||
|
|
'html': 'far fa-file-code',
|
||
|
|
'rar': 'far fa-file-archive',
|
||
|
|
'zip': 'far fa-file-archive',
|
||
|
|
'7z': 'far fa-file-archive',
|
||
|
|
'undefined': 'far fa-file'},
|
||
|
|
selectFiles:[],
|
||
|
|
updateWhoWork: false,
|
||
|
|
doers: [],
|
||
|
|
listDoers:[],
|
||
|
|
stepDoers:[],
|
||
|
|
tasks: [],
|
||
|
|
objects: [],
|
||
|
|
client_id: 0,
|
||
|
|
req_id: 0,
|
||
|
|
stepId: 0,
|
||
|
|
funnelId: 0,
|
||
|
|
id: 0,
|
||
|
|
}
|
||
|
|
},
|
||
|
|
methods:{
|
||
|
|
|
||
|
|
//Открытие
|
||
|
|
open(funnel_id, id, type){
|
||
|
|
this.isShow = true;
|
||
|
|
this.isPreloader = 1;
|
||
|
|
this.steps = [];
|
||
|
|
this.client_id = 0;
|
||
|
|
this.req_id = 0;
|
||
|
|
this.funnelId = funnel_id;
|
||
|
|
if(type == 'req'){
|
||
|
|
this.req_id = id;
|
||
|
|
}
|
||
|
|
if(type == 'client'){
|
||
|
|
this.client_id = id
|
||
|
|
}
|
||
|
|
|
||
|
|
axios.post('/ajax/ajax_vue_funnel.php',{
|
||
|
|
request: 'get_steps_order',
|
||
|
|
funnel_id: funnel_id,
|
||
|
|
|
||
|
|
},
|
||
|
|
)
|
||
|
|
.then((response)=> {
|
||
|
|
// console.log(response.data);
|
||
|
|
this.isPreloader = 0;
|
||
|
|
this.steps = this.getSteps(response.data);
|
||
|
|
$("body").addClass("lock");
|
||
|
|
$('.jw__add-popup').removeClass('is__show');
|
||
|
|
})
|
||
|
|
.catch(function (error) {
|
||
|
|
console.log(error);
|
||
|
|
});
|
||
|
|
|
||
|
|
},
|
||
|
|
|
||
|
|
//Получение этапов
|
||
|
|
getSteps(steps){
|
||
|
|
|
||
|
|
for(var id in steps){
|
||
|
|
|
||
|
|
var temp_list = [];
|
||
|
|
temp_list = JSON.parse(steps[id].pole_end_list);
|
||
|
|
steps[id].pole_end_list = temp_list;
|
||
|
|
steps[id].count = steps[id].pole_end_list.length;
|
||
|
|
|
||
|
|
if(steps[id].pole_end_list.length > 0){
|
||
|
|
for(var i=0; i < steps[id].pole_end_list.length; i++){
|
||
|
|
steps[id].pole_end_list[i].isSave=false;
|
||
|
|
if(steps[id].pole_end_list[i].dopSettings.select){
|
||
|
|
steps[id].pole_end_list[i].isHide=true;
|
||
|
|
steps[id].count--;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
//console.log(steps[id].pole_end_list);
|
||
|
|
steps[id].vidPole = [];
|
||
|
|
steps[id].values = [];
|
||
|
|
if(this.isEmpty(steps[id].color_step)){
|
||
|
|
steps[id].color_step = '#000';
|
||
|
|
}
|
||
|
|
|
||
|
|
}
|
||
|
|
return steps;
|
||
|
|
},
|
||
|
|
|
||
|
|
openStep: function(id){
|
||
|
|
|
||
|
|
this.options = [];
|
||
|
|
this.nextStepSelect = '';
|
||
|
|
this.selectFiles = [];
|
||
|
|
|
||
|
|
this.id = "step_"+this.steps[id].id;
|
||
|
|
this.stepId = this.steps[id].id;
|
||
|
|
//console.log(this.steps[id].id);
|
||
|
|
for(var i in this.steps[id].pole_end_list){
|
||
|
|
|
||
|
|
this.selectFiles.push({'file':{}, 'typeFile': '', 'classFile': '', 'guid': '', 'progress': 0, 'name': '', 'isUpload': false, 'uploads': false, 'is': false});
|
||
|
|
}
|
||
|
|
this.$set(this.steps[id], 'vidPole', []);
|
||
|
|
this.$set(this.steps[id], 'values', []);
|
||
|
|
this.$set(this.steps[id], 'tasks', []);
|
||
|
|
|
||
|
|
axios.post('/ajax/ajax_vue_clients.php',{
|
||
|
|
request: 'openDetailsStep',
|
||
|
|
client_id: this.client_id,
|
||
|
|
req_id: this.req_id,
|
||
|
|
step_id: this.steps[id].id,
|
||
|
|
},
|
||
|
|
)
|
||
|
|
.then((response)=> {
|
||
|
|
|
||
|
|
//console.log(response.data);
|
||
|
|
var res = response.data;
|
||
|
|
if(res != 0){
|
||
|
|
for(var i in res){
|
||
|
|
|
||
|
|
if(res[i]){
|
||
|
|
if(res[i].type == 'checkbox'){
|
||
|
|
if(res[i].value != ''){
|
||
|
|
this.tasks = res[i].value;
|
||
|
|
this.$set(this.steps[id].values[i], 'value', res[i].value);
|
||
|
|
}
|
||
|
|
} else
|
||
|
|
if(res[i].type == 'file'){
|
||
|
|
this.$set(this.steps[id].values[i], 'value', res[i].value);
|
||
|
|
if(res[i].value.file){
|
||
|
|
for(var f in res[i].value){
|
||
|
|
this.$set(this.selectFiles[i], f, res[i].value[f]);
|
||
|
|
}
|
||
|
|
|
||
|
|
}
|
||
|
|
} else if (res[i].type == 'textarea' || res[i].type == 'input' || res[i].type == 'date' || res[i].type == 'deposit') {
|
||
|
|
this.$set(this.steps[id].values[i], 'value', res[i].value);
|
||
|
|
//this.step.values[] = res;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
})
|
||
|
|
.catch(function (error) {
|
||
|
|
console.log(error);
|
||
|
|
});
|
||
|
|
|
||
|
|
var vala = [];
|
||
|
|
if(this.steps[id].pole_end_list.length > 0){
|
||
|
|
for(var i=0; i<this.steps[id].pole_end_list.length; i++){
|
||
|
|
this.steps[id].vidPole.push(this.typePole[this.steps[id].pole_end_list[i].type]);
|
||
|
|
var val = {'name': this.steps[id].pole_end_list[i].name,'type':this.steps[id].vidPole[i], 'value': ''};
|
||
|
|
this.$set(this.steps[id].values, i, {});
|
||
|
|
this.$set(this.steps[id].values[i], 'name', this.steps[id].pole_end_list[i].name);
|
||
|
|
this.$set(this.steps[id].values[i], 'type', this.steps[id].vidPole[i]);
|
||
|
|
this.$set(this.steps[id].values[i], 'value', '');
|
||
|
|
/* if(this.step.vidPole[i] == 'checkbox'){
|
||
|
|
val = {'name': this.step.pole_end_list[i].name,'type':this.step.vidPole[i], 'value': false};
|
||
|
|
}*/
|
||
|
|
// vala.push(val);
|
||
|
|
|
||
|
|
if(this.steps[id].vidPole[i] == 'date'){
|
||
|
|
$('#datepickerApp').datepicker({
|
||
|
|
autoClose: 'true'
|
||
|
|
});
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
//this.steps[id].values = vala
|
||
|
|
//console.log(this.step.values);
|
||
|
|
for(var i in this.steps[id].files){
|
||
|
|
this.steps[id].files[i].typeFile = this.typeFile(this.steps[id].files[i].name);
|
||
|
|
this.steps[id].files[i].classFile = this.classTypesFile[this.steps[id].step.files[i].typeFile];
|
||
|
|
}
|
||
|
|
},
|
||
|
|
|
||
|
|
onFileSelected(event){
|
||
|
|
|
||
|
|
var id = $(event.target).data("id");
|
||
|
|
this.$set(this.selectFiles[id], 'uploads', false);
|
||
|
|
this.$set(this.selectFiles[id], 'isUpload', false);
|
||
|
|
this.$set(this.selectFiles[id], 'progress', 0);
|
||
|
|
var file = event.target.files[0];
|
||
|
|
//console.log(id);
|
||
|
|
if(file.name){
|
||
|
|
this.selectFiles[id].file = file;
|
||
|
|
this.selectFiles[id].typeFile = this.typeFile(file.name).toLowerCase();
|
||
|
|
|
||
|
|
if (this.selectFiles[id].typeFile !== 'doc' && this.selectFiles[id].typeFile !== 'docx' && this.selectFiles[id].typeFile !== 'xls'
|
||
|
|
&& this.selectFiles[id].typeFile !== 'xlsx' && this.selectFiles[id].typeFile !== 'pdf' && this.selectFiles[id].typeFile !== 'jpeg' && this.selectFiles[id].typeFile !== 'jpg'
|
||
|
|
&& this.selectFiles[id].typeFile !== 'gif' && this.selectFiles[id].typeFile !== 'png' && this.selectFiles[id].typeFile !== 'mp3'
|
||
|
|
&& this.selectFiles[id].typeFile !== 'zip' && this.selectFiles[id].typeFile !== 'rar') {
|
||
|
|
alert("Неверный тип файла");
|
||
|
|
return;
|
||
|
|
}
|
||
|
|
|
||
|
|
this.selectFiles[id].classFile = this.classTypesFile[this.selectFiles[id].typeFile];
|
||
|
|
this.selectFiles[id].guid = '';
|
||
|
|
this.selectFiles[id].is = true;
|
||
|
|
this.selectFiles[id].name = file.name;
|
||
|
|
}
|
||
|
|
// console.log(this.selectFiles);
|
||
|
|
this.onUpload(id, file);
|
||
|
|
},
|
||
|
|
onUpload: function(index, file){
|
||
|
|
//console.log();
|
||
|
|
this.$set(this.selectFiles[index], 'uploads', true);
|
||
|
|
this.$set(this.selectFiles[index], 'isUpload', false);
|
||
|
|
this.$set(this.selectFiles[index], 'progress', 0);
|
||
|
|
let fd = new FormData();
|
||
|
|
fd.append('client_id', this.client_id);
|
||
|
|
fd.append('req_id', this.req_id);
|
||
|
|
fd.append('type_file', this.selectFiles[index].typeFile);
|
||
|
|
fd.append('etap_id', this.stepId);
|
||
|
|
fd.append('file', file);
|
||
|
|
|
||
|
|
axios.post('/ajax/vue_upload.php', fd,{
|
||
|
|
onUploadProgress: progressEvent => {
|
||
|
|
var pr = Math.ceil(progressEvent.loaded / progressEvent.total * 100);
|
||
|
|
this.$set(this.selectFiles[index], 'progress', pr);
|
||
|
|
}
|
||
|
|
})
|
||
|
|
.then((response)=> {
|
||
|
|
if (response.data.res === 'done') {
|
||
|
|
//console.log(response.data);
|
||
|
|
this.$set(this.selectFiles[index], 'guid', response.data.guid);
|
||
|
|
this.$set(this.selectFiles[index], 'isUpload', true);
|
||
|
|
this.steps[this.id].values[index].value = this.selectFiles[index];
|
||
|
|
this.$set(this.selectFiles[index], 'uploads', false);
|
||
|
|
} else {
|
||
|
|
alert(response.data.res);
|
||
|
|
}
|
||
|
|
})
|
||
|
|
.catch(function (error) {
|
||
|
|
|
||
|
|
console.log(error);
|
||
|
|
});
|
||
|
|
|
||
|
|
},
|
||
|
|
onDeleteFile: function(index, guid) {
|
||
|
|
$('.ui-tooltip').remove();
|
||
|
|
this.$set(this.selectFiles, index, {'file':{}, 'typeFile': '', 'classFile': '', 'guid': '', 'progress': 0, 'name': '', 'isUpload': false, 'uploads': false, 'is': false});
|
||
|
|
this.steps[this.id].values[index].value = '';
|
||
|
|
|
||
|
|
},
|
||
|
|
|
||
|
|
typeFile: function(nameFile){
|
||
|
|
var tchk = nameFile.lastIndexOf(".");
|
||
|
|
|
||
|
|
if(tchk != -1){
|
||
|
|
return nameFile.slice(tchk+1);
|
||
|
|
}
|
||
|
|
return 'undefined';
|
||
|
|
},
|
||
|
|
|
||
|
|
//Закрытие
|
||
|
|
closes(){
|
||
|
|
this.isShow = false;
|
||
|
|
|
||
|
|
$("body").removeClass("lock");
|
||
|
|
$('.jw__add-popup').removeClass('is__show');
|
||
|
|
},
|
||
|
|
|
||
|
|
//Сохранение изменений
|
||
|
|
save(pole){
|
||
|
|
axios.post('/ajax/ajax_vue_clients.php', {
|
||
|
|
request: 'save_check_list',
|
||
|
|
client_id: this.client_id,
|
||
|
|
req_id: this.req_id,
|
||
|
|
step_id: this.stepId,
|
||
|
|
funnel_id: this.funnelId,
|
||
|
|
values: JSON.stringify(this.steps[this.id].values),
|
||
|
|
pole: pole,
|
||
|
|
})
|
||
|
|
.then((response)=> {
|
||
|
|
console.log(response.data);
|
||
|
|
if(response.data == 1){
|
||
|
|
this.steps[this.id].pole_end_list[pole].isSave = true;
|
||
|
|
}
|
||
|
|
})
|
||
|
|
.catch(function (error) {
|
||
|
|
|
||
|
|
console.log(error);
|
||
|
|
});
|
||
|
|
},
|
||
|
|
|
||
|
|
toggleStep(id){
|
||
|
|
for(var stepId in this.steps){
|
||
|
|
if(stepId == id){
|
||
|
|
if(this.steps[stepId].isHide){
|
||
|
|
this.steps[stepId].isHide = false;
|
||
|
|
this.openStep(stepId);
|
||
|
|
} else {
|
||
|
|
this.steps[stepId].isHide = true;
|
||
|
|
}
|
||
|
|
} else {
|
||
|
|
this.steps[stepId].isHide = true;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
},
|
||
|
|
|
||
|
|
//Проверка на пустоту
|
||
|
|
isEmpty(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;
|
||
|
|
}
|
||
|
|
},
|
||
|
|
|
||
|
|
},
|
||
|
|
mounted() {
|
||
|
|
|
||
|
|
},
|
||
|
|
created: function() {
|
||
|
|
|
||
|
|
$("#funnel_check_list").removeClass("hidden");
|
||
|
|
|
||
|
|
}
|
||
|
|
})
|