skillbox/client/src/components/portfolio/ProjectForm.vue

77 lines
1.3 KiB
Vue

<template>
<page-form
:title="title"
@save="$emit('save', localProject)"
>
<page-form-input
label="Titel"
v-model="localProject.title"
/>
<page-form-input
label="Beschreibung"
type="textarea"
v-model="localProject.description"
/>
<template #footer>
<button
:class="{ 'button--disabled': !formValid }"
:disabled="!formValid"
type="submit"
class="button button--primary"
data-cy="save-project-button"
>
Speichern
</button>
<router-link
to="/portfolio"
class="button"
>
Abbrechen
</router-link>
</template>
</page-form>
</template>
<script>
import PageForm from '@/components/page-form/PageForm';
import PageFormInput from '@/components/page-form/PageFormInput';
export default {
props: {
project: {
type: Object,
default: () => {},
},
title: {
type: String,
default: 'Neues Projekt',
},
},
components: {
PageForm,
PageFormInput,
},
data() {
return {
localProject: Object.assign({}, this.project),
};
},
computed: {
formValid() {
return this.localProject.title;
},
},
};
</script>
<style scoped lang="scss">
@import '~styles/helpers';
.project-form {
@include widget-shadow;
}
</style>