2022-01-03 23:53:38 +00:00
|
|
|
<template>
|
2022-01-15 08:56:54 +00:00
|
|
|
<div class="pb-20">
|
2022-01-10 10:16:25 +00:00
|
|
|
<responsive-grid class="mb-4">
|
|
|
|
<progress-button
|
|
|
|
v-for="(process, index) in uncreated"
|
|
|
|
:key="index"
|
|
|
|
:label="process.instrument"
|
|
|
|
:max="process.cost"
|
|
|
|
:value="$store.state.currency"
|
2022-01-12 04:24:49 +00:00
|
|
|
@click="create(process)"
|
2022-01-10 10:16:25 +00:00
|
|
|
/>
|
|
|
|
</responsive-grid>
|
|
|
|
|
2022-01-15 08:56:54 +00:00
|
|
|
<responsive-grid min="2" mid="3" max="5">
|
2022-01-10 10:16:25 +00:00
|
|
|
<timekeeping-instrument
|
|
|
|
v-for="(process, index) in created"
|
|
|
|
:key="index"
|
|
|
|
:process="process"
|
|
|
|
/>
|
|
|
|
</responsive-grid>
|
2022-01-04 22:41:36 +00:00
|
|
|
</div>
|
2022-01-03 23:53:38 +00:00
|
|
|
</template>
|
|
|
|
|
|
|
|
<script>
|
2022-01-10 10:16:25 +00:00
|
|
|
export default {
|
|
|
|
computed: {
|
2022-01-11 05:47:26 +00:00
|
|
|
unlocked() {
|
2022-01-13 05:37:30 +00:00
|
|
|
return this.$store.state.processes.filter((p) => p.visited)
|
2022-01-11 05:47:26 +00:00
|
|
|
},
|
2022-01-10 10:16:25 +00:00
|
|
|
created() {
|
2022-01-11 05:47:26 +00:00
|
|
|
return this.unlocked.filter((p) => p.created)
|
2022-01-10 10:16:25 +00:00
|
|
|
},
|
|
|
|
uncreated() {
|
2022-01-11 05:47:26 +00:00
|
|
|
return this.unlocked.filter((p) => !p.created)
|
2022-01-10 10:16:25 +00:00
|
|
|
},
|
|
|
|
},
|
|
|
|
methods: {
|
2022-01-12 04:24:49 +00:00
|
|
|
create(process) {
|
|
|
|
this.$store.commit('createInstrument', process.instrument)
|
|
|
|
this.$store.commit('spendCurrency', process.cost)
|
2022-01-12 06:23:41 +00:00
|
|
|
if (process.instrument === 'Mechanical Clock') {
|
|
|
|
this.$store.commit('unlockTab', 'Apprentices')
|
|
|
|
this.$store.commit('unlockTab', 'Missions')
|
|
|
|
}
|
2022-01-10 10:16:25 +00:00
|
|
|
},
|
|
|
|
},
|
2022-01-08 22:04:05 +00:00
|
|
|
}
|
2022-01-10 10:16:25 +00:00
|
|
|
</script>
|