c3lf/c3lf-system-3
9
0
Fork 0
Code Issues 55 Pull requests Projects 2 Releases Wiki Activity Actions

add text field to add comment to ticket

Browse source
This commit is contained in:
j3d1 2024-01-13 01:40:37 +01:00
parent 5a1de437b6
commit d1626d1777
6 changed files with 102 additions and 18 deletions
Download patch file Download diff file Expand all files Collapse all files

1
web/src/components/Navbar.vue
View file

@ -148,6 +148,7 @@ export default {
padding-bottom: 1rem !important;
border: var(--gray) solid 1px !important;
border-bottom: none !important;
color: var(--blue) !important;
&.active {
background: black !important;

52
web/src/components/Timeline.vue
View file

@ -23,12 +23,31 @@
<span class="timeline-item-icon | faded-icon">
<font-awesome-icon icon="comment"/>
</span>
<div class="new-comment">
<div class="input-group">
<textarea placeholder="reply mail..." v-model="newMail">
<div class="new-comment card bg-dark">
<div class="">
<textarea placeholder="add comment..." v-model="newComment" class="form-control">
</textarea>
<button class="btn btn-primary" @click="sendMailandClear">
Send
<button class="btn btn-primary float-right" @click="addCommentAndClear">
<font-awesome-icon icon="comment"/>
Save Comment
</button>
</div>
</div>
</li>
<li class="timeline-item">
<span class="timeline-item-icon | faded-icon">
<font-awesome-icon icon="envelope"/>
</span>
<div class="new-mail card bg-dark">
<div class="card-header">
{{ newestMailSubject }}
</div>
<div>
<textarea placeholder="reply mail..." v-model="newMail" class="form-control">
</textarea>
<button class="btn btn-primary float-right" @click="sendMailAndClear">
<font-awesome-icon icon="envelope"/>
Send Mail
</button>
</div>
</div>
@ -52,18 +71,27 @@ export default {
default: () => []
}
},
emits: ['sendMail'],
emits: ['sendMail', 'addComment'],
data: () => ({
newMail: ""
newMail: "",
newComment: ""
}),
computed: {
...mapGetters(['stateInfo']),
newestMailSubject() {
const mail = this.timeline.filter(item => item.type === 'mail').pop();
return mail ? mail.subject : "";
},
},
methods: {
sendMailandClear: function () {
sendMailAndClear: function () {
this.$emit('sendMail', this.newMail);
this.newMail = "";
},
addCommentAndClear: function () {
this.$emit('addComment', this.newComment);
this.newComment = "";
}
},
};
</script>
@ -117,14 +145,14 @@ img {
}
}
.new-comment {
.new-comment, .new-mail {
width: 100%;
input {
textarea, input {
border: 1px solid var(--gray);
border-radius: 6px;
height: 48px;
padding: 0 16px;
height: 5em;
padding: 8px 16px;
&::placeholder {
color: var(--gray-dark);