I have a vue class
export default {
data() {
return {
tasks: [],
currentSort:'name',
currentSortDir:'asc',
companies: []
};
},
async created() {
this.storage.tasks++;
try {
this.tasks = await Monitor.Task.getTasks();
this.companies = await Monitor.getCompanies();
} catch (code) {
this.notify("danger", "Не удалось загрузить задачи", code);
} finally {
this.storage.tasks--;
}
},
computed: {
mappedTasks() {
return _.chain(this.tasks)
.sort((a,b) => {
let modifier = 1;
if(this.currentSortDir === 'desc') modifier = -1;
if(a[this.currentSort] < b[this.currentSort]) return -1 * modifier;
if(a[this.currentSort] > b[this.currentSort]) return 1 * modifier;
return 0;
})
.map(it => {
let statusText;
switch (it.status) {
case "NOT_COMPLETED":
statusText = "Ожидает выполнения";
break;
case "COMPLETED":
statusText = "Завершено";
break;
case "CANCELED":
statusText = "Отменено";
break;
default:
statusText = "Неизвестно";
}
const companyName = this.getCompanyById(it.companyId).name;
let updated
if(it.updatedAt !== null) {
updated = Moment(it.updatedAt).utcOffset(TIME_ZONE).format("YYYY-MM-DD HH:mm:ss")
}
const values = {
statusText,
createdAt: Moment(it.createdAt).utcOffset(TIME_ZONE).format("YYYY-MM-DD HH:mm:ss"),
updatedAt: updated,
companyId: companyName
};
return _.assign({}, it, values);
})
.value();
},
},
methods: {
sort:function(s) {
if(s === this.currentSort) {
this.currentSortDir = this.currentSortDir==='asc'?'desc':'asc';
}
this.currentSort = s;
},
getCompanyById(id) {
return this.companies.find(company => company.id === id);
}
}
}
The proplem that in method getCompanyById this.companies is undefined therefore method doens’t return company. I tried to make to make method async and like this:
async getCompanyById() {
let companies = await Monitor.getCompanies()
return companies
}
In this case, I have that status of companies is pending. I don’t undenstand why in computed.mappedTask I can’t get companies from async created unlike tasks