Cleanup new list creation component
This commit is contained in:
parent
822028e4b7
commit
ccee8e9591
|
@ -5,15 +5,27 @@
|
||||||
:shadow="false"
|
:shadow="false"
|
||||||
:padding="false"
|
:padding="false"
|
||||||
class="has-text-left"
|
class="has-text-left"
|
||||||
|
:has-close="true"
|
||||||
|
close-icon="times"
|
||||||
>
|
>
|
||||||
<div class="p-4">
|
<div class="p-4">
|
||||||
<slot></slot>
|
<slot></slot>
|
||||||
</div>
|
</div>
|
||||||
<footer class="modal-card-foot is-flex is-justify-content-flex-end">
|
<footer class="modal-card-foot is-flex is-justify-content-flex-end">
|
||||||
<x-button :shadow="false" type="secondary" @click="$router.back()">
|
<x-button
|
||||||
|
:shadow="false"
|
||||||
|
type="secondary"
|
||||||
|
@click.prevent.stop="$router.back()"
|
||||||
|
>
|
||||||
Cancel
|
Cancel
|
||||||
</x-button>
|
</x-button>
|
||||||
<x-button :shadow="false" type="primary" @click="$emit('create')" icon="plus">
|
<x-button
|
||||||
|
:shadow="false"
|
||||||
|
type="primary"
|
||||||
|
@click.prevent.stop="$emit('create')"
|
||||||
|
icon="plus"
|
||||||
|
:disabled="createDisabled"
|
||||||
|
>
|
||||||
{{ createLabel }}
|
{{ createLabel }}
|
||||||
</x-button>
|
</x-button>
|
||||||
</footer>
|
</footer>
|
||||||
|
@ -33,6 +45,10 @@ export default {
|
||||||
type: String,
|
type: String,
|
||||||
default: 'Create',
|
default: 'Create',
|
||||||
},
|
},
|
||||||
|
createDisabled: {
|
||||||
|
type: Boolean,
|
||||||
|
default: false,
|
||||||
|
}
|
||||||
},
|
},
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
|
@ -1,7 +1,7 @@
|
||||||
<template>
|
<template>
|
||||||
<transition name="modal">
|
<transition name="modal">
|
||||||
<div class="modal-mask">
|
<div class="modal-mask">
|
||||||
<div class="modal-container" @click.prevent.stop="$emit('close')">
|
<div class="modal-container" @click.self.prevent.stop="$emit('close')">
|
||||||
<div class="modal-content">
|
<div class="modal-content">
|
||||||
<slot>
|
<slot>
|
||||||
<div class="header">
|
<div class="header">
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
<template>
|
<template>
|
||||||
<create title="Create a new list" @create="newList()">
|
<create title="Create a new list" @create="newList()" :create-disabled="list.title === ''">
|
||||||
<div class="field">
|
<div class="field">
|
||||||
<label class="label" for="listTitle">List Title</label>
|
<label class="label" for="listTitle">List Title</label>
|
||||||
<div
|
<div
|
||||||
|
@ -9,7 +9,7 @@
|
||||||
<input
|
<input
|
||||||
:class="{ disabled: listService.loading }"
|
:class="{ disabled: listService.loading }"
|
||||||
@keyup.enter="newList()"
|
@keyup.enter="newList()"
|
||||||
@keyup.esc="back()"
|
@keyup.esc="$router.back()"
|
||||||
class="input"
|
class="input"
|
||||||
placeholder="The list's title goes here..."
|
placeholder="The list's title goes here..."
|
||||||
type="text"
|
type="text"
|
||||||
|
@ -26,7 +26,6 @@
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
import router from '../../router'
|
|
||||||
import ListService from '../../services/list'
|
import ListService from '../../services/list'
|
||||||
import ListModel from '../../models/list'
|
import ListModel from '../../models/list'
|
||||||
import Create from '@/components/misc/create'
|
import Create from '@/components/misc/create'
|
||||||
|
@ -66,7 +65,7 @@ export default {
|
||||||
{ message: 'The list was successfully created.' },
|
{ message: 'The list was successfully created.' },
|
||||||
this
|
this
|
||||||
)
|
)
|
||||||
router.push({
|
this.$router.push({
|
||||||
name: 'list.index',
|
name: 'list.index',
|
||||||
params: { listId: r.id },
|
params: { listId: r.id },
|
||||||
})
|
})
|
||||||
|
@ -75,9 +74,6 @@ export default {
|
||||||
this.error(e, this)
|
this.error(e, this)
|
||||||
})
|
})
|
||||||
},
|
},
|
||||||
back() {
|
|
||||||
router.go(-1)
|
|
||||||
},
|
|
||||||
},
|
},
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
Reference in New Issue