Итак, я создаю трекер посещаемости с Vuejs и Vuetify, и я хочу, чтобы он выглядел следующим образом: Calender, состоящий из компонентов V-Card, и список отсутствий, считанный из базы данных. У меня настроен API, и я могу получить список отсутствий без каких-либо проблем, но когда дело доходит до их вывода на экран, у меня возникают некоторые проблемы. Я хочу сделать следующее: пользователь выбирает месяц и год. Каждая карта показывает один день этого месяца. У меня есть функция с именем getAbsDate(date)
, которая возвращает список отсутствий на дату, переданную ей. Я хочу, чтобы это работало примерно так на каждой карточке:
<v-card min-height="170" tile>
<v-card-text class="text-center black--text">
{{i}}
<v-sheet
color="blue"
class="pa-1"
v-for="abs in getAbsDate(i+'.'+monthsNums[selMonth]+'.'+selYear)"
:key="abs['id']"
>{{abs["name"]}}</v-sheet>
</v-card-text>
</v-card>
selMonth - это месяц, выбранный пользователем, а selYear - год, выбранный пользователем. Это не работает однако. Я не получаю никаких ошибок, карты просто пустые. getAbsDate()
возвращает список объектов. Есть идеи, почему это не работает? Спасибо!
РЕДАКТИРОВАТЬ Вот объявление моей getAbsDate()
функции.
getAbsDate: function(date) {
let l = [];
this.absences.forEach(abs => {
if (abs["start"] == date) {
l.push(abs);
}
if (abs["end"] == date) {
l.push(abs);
}
let day_start = moment(abs["start"].replace(".", "/"), "DD/MM/YYYY")
.toDate()
.getTime();
let day_end = moment(abs["end"].replace(".", "/"), "DD/MM/YYYY")
.toDate()
.getTime();
let day_date = moment(date.replace(".", "/"), "DD/MM/YYYY")
.toDate()
.getTime();
if (day_start <= day_date && day_date <= day_end) {
l.push(abs);
}
});
return l;
}
}
Форматирование не совсем верно для .toDate()
и .getTime()
, но в моем файле это не так.