Commit ce3db1cd authored by void's avatar void 💬
Browse files

Merge branch 'abandonar-barca' into 'master'

Poder abandonar una barca (fixes #4)

Closes #4

See merge request !3
parents 7724b0d7 d86ed2cb
Pipeline #35323 passed with stages
in 1 minute and 36 seconds
......@@ -3,30 +3,34 @@
## instalar dependencias
primero instalá [pnpm](https://pnpm.js.org/en/installation)
```
pnpm i
```
## configurar entorno
```
cp .env.example .env
# editar .env con la url de la API, por defecto está en produccion
```
## modo de desarrollo
```
pnpm run serve
# anda a localhost:8080
```
## hacer que quede bien el código
```
pnpm run prettify
```
## compilar para produccion
```
pnpm build
# el resultado esta en dist/
```
......@@ -51,6 +51,7 @@ html
--gray: #c7c7c7
--darkgray: #8f8f8f
--verydarkgray: #555
--darkred: #F51818
--red: red
color: var(--foreground)
......@@ -112,6 +113,8 @@ button
&.primary
--foreground: var(--background)
background: var(--accent)
&.red
--accent: var(--darkred)
&.small
font-size: 0.7em
padding: 6px 8px
......
......@@ -14,6 +14,7 @@ import CrearBarca from './views/CrearBarca.vue'
import Consenso from './views/Consenso.vue'
import CrearConsenso from './views/CrearConsenso.vue'
import EliminarPropuesta from './views/EliminarPropuesta.vue'
import AbandonarBarca from './views/AbandonarBarca.vue'
import NotFound from './views/NotFound.vue'
Vue.use(Router)
......@@ -110,6 +111,16 @@ const router = new Router({
router.push(`/barcas/${route.params.id}`),
},
},
{
path: '/barcas/:id(\\d+)/abandonar',
name: 'abandonar barca',
component: AbandonarBarca,
meta: {
requiresAuth: true,
backCallback: (router, route) =>
router.push(`/barcas/${route.params.id}`),
},
},
{
path: '*',
name: 'not found',
......
......@@ -46,12 +46,18 @@ export const request = async (path, settings = {}) => {
if (response.status === 404) {
throw 'not_found'
}
if (response.status >= 500) {
throw 'internal_server_error'
}
if (response.status === 422) {
let error
try {
const json = await response.json()
if (json.errors) error = json.errors
else throw null
if (json.errors) {
if (json.errors[0]) error = json.errors[0]
// si es un array
else error = json.errors
} else throw null
} catch (error) {
error = 'unprocessable_entity'
}
......@@ -115,6 +121,9 @@ const store = new Vuex.Store({
]
}
},
abandonadaBarca: (state, barcaId) => {
state.barcas = state.barcas.filter(barca => barca.id !== barcaId)
},
gotConsensos: (state, { barcaId, consensos }) => {
state.consensos = [
......@@ -209,6 +218,13 @@ const store = new Vuex.Store({
})
commit('abordadaBarca', barcaId)
},
async abandonarBarca({ commit }, { barcaId }) {
const res = await request(`/barcas/${barcaId}/abandonar`, {
method: 'DELETE',
parseJson: false,
})
commit('abandonadaBarca', barcaId)
},
async crearBarca({ commit }, body) {
const json = await request(`/barcas`, {
method: 'POST',
......
<template>
<div class="abandonar-barca">
<div v-if="error" class="error">
<template v-if="error === 'unprocessable_entity'">
¡Ya te fuiste de esta barca!
<router-link to="/barcas">Volver a las barcas</router-link>
</template>
<template v-if="error === 'not_found'">
Esta barca no existe.
<router-link to="/barcas">Volver a las barcas</router-link>
</template>
<template v-else>
{{ error }}
</template>
</div>
<h1>
Abandonar barca
<template v-if="barca">
{{ barca.nombre }}
</template>
</h1>
<p>¿Estás segurx de que querés abandonar esta barca?</p>
<custom-button @click="abandonar" :loading="abandonando">
Abandonar barca
</custom-button>
</div>
</template>
<script>
import { mapState } from 'vuex'
import Consenso from '@/components/Consenso'
import CustomButton from '@/components/Button.vue'
export default {
name: 'AbandonarBarca',
components: { Consenso, CustomButton },
data() {
return { abandonando: false, error: null }
},
methods: {
abandonar() {
this.abandonando = true
return this.$store
.dispatch('abandonarBarca', { barcaId: this.id })
.then(() => this.$router.push(`/barcas`))
.catch(err => (this.error = err))
.finally(() => (this.abandonando = false))
},
refrescar() {
return this.$store.dispatch('conseguirBarca', {
barcaId: this.id,
})
},
},
mounted() {
this.refrescar()
},
computed: {
id() {
return this.$route.params.id
},
...mapState({
barca(state) {
return state.barcas.find(barca => barca.id === Number(this.id))
},
}),
},
}
</script>
<style lang="sass" scoped>
.abandonar-barca
margin: 10px 20px
</style>
......@@ -10,6 +10,7 @@
tag="button"
class="primary circle"
:to="`/barcas/${barcaId}/consensos/crear`"
v-if="barca.abordada"
>
<InIcono />
</router-link>
......@@ -37,9 +38,20 @@
</template>
<h1 v-else>Error: {{ error }}</h1>
</div>
<template v-else-if="consensos.length > 0" v-for="consenso in consensos">
<consenso :consenso="consenso" :barcaId="barcaId" :key="consenso.id" />
<hr />
<template v-else-if="consensos.length > 0">
<template v-for="consenso in consensos">
<consenso :consenso="consenso" :barcaId="barcaId" :key="consenso.id" />
<hr />
</template>
<router-link
class="red btn-abandonar"
tag="button"
:to="`/barcas/${barcaId}/abandonar`"
v-if="barca.abordada"
>
Abandonar barca
</router-link>
</template>
<template v-else>
<h3>No hay ningun consenso creado.</h3>
......@@ -141,4 +153,8 @@ nav
hr
margin: 0 3em
color: var(--gray)
.btn-abandonar
display: block
margin: 10px auto
</style>
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment