refactor: journal timetable entries

This commit is contained in:
2024-09-03 14:29:59 +02:00
parent 0861d92e4b
commit c93514fdf0
9 changed files with 192 additions and 67 deletions
@@ -16,37 +16,15 @@
{{ $t('app.no-result') }}
</div>
<div v-else>
<transition-group name="list-anim" tag="ul" class="journal-list">
<li v-for="timetable in timetableHistory" class="journal_item" :key="timetable.id">
<div class="journal_item-info">
<!-- General -->
<TimetableGeneral :timetable="timetable" />
<div @click="toggleExtraInfo(timetable.id)" style="cursor: pointer">
<!-- Route -->
<span class="item-route">
<b>{{ timetable.route.replace('|', ' - ') }}</b>
</span>
<hr />
<!-- Stops -->
<TimetableStops
:timetable="timetable"
:showExtraInfo="extraInfoIndexes.includes(timetable.id)"
/>
<!-- Status -->
<TimetableStatus :timetable="timetable" />
</div>
<!-- Extra -->
<TimetableDetails
:timetable="timetable"
:showExtraInfo="extraInfoIndexes.includes(timetable.id)"
@toggle-extra-info="toggleExtraInfo"
/>
</div>
</li>
<ul v-else class="journal-list">
<transition-group name="list-anim">
<JournalTimetableEntry
v-for="timetableEntry in timetableHistory"
:key="timetableEntry.id"
:timetableEntry="timetableEntry"
:onToggleShowExtraInfo="toggleExtraInfo"
:showExtraInfo="extraInfoIndexes.includes(timetableEntry.id)"
/>
</transition-group>
<AddDataButton
@@ -55,7 +33,7 @@
:scrollNoMoreData="scrollNoMoreData"
@addHistoryData="addHistoryData"
/>
</div>
</ul>
</div>
</transition>
@@ -68,28 +46,21 @@
</template>
<script lang="ts">
import { defineComponent, Prop, PropType, ref } from 'vue';
import { defineComponent, PropType } from 'vue';
import Loading from '../../Global/Loading.vue';
import AddDataButton from '../../Global/AddDataButton.vue';
import JournalTimetableEntry from './JournalTimetableEntry.vue';
import { useMainStore } from '../../../store/mainStore';
import { Status } from '../../../typings/common';
import { API } from '../../../typings/api';
import TimetableGeneral from './TimetableGeneral.vue';
import TimetableStops from './TimetableStops.vue';
import TimetableStatus from './TimetableStatus.vue';
import TimetableDetails from './TimetableDetails.vue';
export default defineComponent({
components: {
Loading,
AddDataButton,
TimetableDetails,
TimetableGeneral,
TimetableStatus,
TimetableStops
JournalTimetableEntry
},
props: {