79 lines
1.5 KiB
Vue
79 lines
1.5 KiB
Vue
<template>
|
|
<div class="single-ticket">
|
|
<div class="header-bar">
|
|
<button @click="back">
|
|
{{ t('upschooling', 'Ticket Schließen') }}
|
|
</button>
|
|
<button @click="save">
|
|
{{ t('upschooling', 'Speichern') }}
|
|
</button>
|
|
</div>
|
|
<h2>Ticket "ding"</h2>
|
|
<KeyValueTable :data-rows="{Id: ticket.ticketId, Name: ticket.title, Status: ticket.status, Geaendert: toLocaleDate(ticket.lastModified)}" />
|
|
<br>
|
|
<label for="description">{{ t('upschooling', 'Beschreibung') }}</label>
|
|
<textarea id="description" v-model.trim.lazy="description" rows="15" />
|
|
<br>
|
|
<button @click="save">
|
|
{{ t('upschooling', 'Speichern') }}
|
|
</button>
|
|
<hr>
|
|
<div class="placeholder" />
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import KeyValueTable from './components/KeyValueTable'
|
|
export default {
|
|
name: 'Ticket',
|
|
components: { KeyValueTable },
|
|
props: {
|
|
ticket: {
|
|
type: Object,
|
|
default() {
|
|
return {}
|
|
},
|
|
},
|
|
},
|
|
data() {
|
|
return {
|
|
description: this.ticket.description,
|
|
}
|
|
},
|
|
methods: {
|
|
toLocaleDate(timestamp) {
|
|
const date = new Date(timestamp)
|
|
return date.toLocaleString()
|
|
},
|
|
|
|
save() {
|
|
this.$emit('save-ticket', this.ticket.ticketId, {}) // TODO: give it only the changed data
|
|
},
|
|
|
|
back() {
|
|
this.$emit('show-ticket-list')
|
|
},
|
|
},
|
|
}
|
|
</script>
|
|
|
|
<style scoped>
|
|
textarea {
|
|
width: 100%;
|
|
margin: 0;
|
|
resize: vertical;
|
|
}
|
|
|
|
.placeholder {
|
|
height: 400px;
|
|
width: 100%;
|
|
background: #f0f0f0;
|
|
}
|
|
|
|
.header-bar {
|
|
display: flex;
|
|
width: 100%;
|
|
flex-direction: row-reverse;
|
|
}
|
|
</style>
|