This repository has been archived on 2024-03-13. You can view files and clone it, but cannot push or open issues or pull requests.
timekeeper/pages/Missions.vue

81 lines
2.1 KiB
Vue
Raw Normal View History

2022-01-08 03:46:33 +00:00
<template>
<div class="missions grid">
<responsive-grid
v-if="incomplete.length"
:class="
completed.length &&
`pb-6 border-b-2 border-${$store.getters.activeTab.darkColor}`
"
>
<mission-button
v-for="(mission, index) in incomplete"
:key="index"
:mission="mission"
@click="complete(mission)"
/>
</responsive-grid>
<div
v-else
:class="
completed.length &&
`pt-6 pb-10 border-b-2 border-${$store.getters.activeTab.darkColor}`
"
>
<h3 class="text-center">No Missions Currently Available</h3>
</div>
<template v-if="completed.length">
<h2 class="pt-2 pb-2 text-center text-xl">Completed Missions</h2>
<responsive-grid min="1" mid="3" max="6">
<completed-mission
v-for="(mission, index) in completed"
:key="index"
:mission="mission"
/>
</responsive-grid>
</template>
</div>
2022-01-08 03:46:33 +00:00
</template>
<script>
export default {
computed: {
unlocked() {
return this.$store.state.missions.filter(({ unlockCriteria }) => {
if (unlockCriteria.unit === 'instruments') {
return unlockCriteria.value <= this.$store.getters.instruments
} else if (unlockCriteria.unit === 'apprenticeLevels') {
return unlockCriteria.value <= this.$store.getters.apprenticeLevels
} else if (unlockCriteria.unit === 'missionsCompleted') {
return unlockCriteria.value.every((name) =>
this.$store.getters.missionIsCompleted(name)
)
} else if (unlockCriteria.unit === 'timeJumpsBackwards') {
return unlockCriteria.value <= this.$store.state.timeJumpsBackwards
} else {
return false
}
})
},
incomplete() {
return this.unlocked.filter((m) => !m.complete)
},
completed() {
return this.unlocked.filter((m) => m.complete)
},
},
methods: {
complete(mission) {
this.$store.commit('completeMission', mission.name)
},
},
}
</script>
<style scoped>
.missions {
grid-template-rows: minmax(0, 1fr) auto auto;
}
</style>