Egalware/cms_thermo_active
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix notes

Browse Source
This commit is contained in:
Paolo Possanzini
2019-01-04 12:03:17 +01:00
parent 0e406f6982
commit ecdf8479fa
4 changed files with 109 additions and 22 deletions
Download Patch File Download Diff File Expand all files Collapse all files
Step/wwwroot/assets/styles/base/alarms.less
+2 -2
View File
@@ -325,7 +325,7 @@
.all-message-box{
max-height: 310px;
.message-box{
width: 408px;
width: 390px;
min-height: 96px;
display: flex;
flex-flow: column;
@@ -341,7 +341,7 @@
textarea{
border: none;
resize: none;
background-color: transparent;
// background-color: transparent;
padding: 3px;
box-sizing: border-box;
cursor: pointer;
Step/wwwroot/assets/styles/style.css
+1 -2
View File
@@ -3828,7 +3828,7 @@ footer .container button.big:before {
max-height: 310px;
}
.accordion section .dropdown .all-message-box .message-box {
width: 408px;
width: 390px;
min-height: 96px;
display: flex;
flex-flow: column;
@@ -3846,7 +3846,6 @@ footer .container button.big:before {
.accordion section .dropdown .all-message-box .message-box .message-box-header textarea {
border: none;
resize: none;
background-color: transparent;
padding: 3px;
box-sizing: border-box;
cursor: pointer;
Step/wwwroot/src/app_modules/alarms/components/alarm-detail.ts
+65 -8
View File
@@ -6,6 +6,8 @@ import Component from "vue-class-component";
import { Prop } from "vue-property-decorator";
import { alarmsService } from "src/services/alarmsService";
import { ModalHelper } from "src/components/modals";
import { getColorFromName, isDarkColor } from "src/_base/utils";
import moment from "moment";
@Component({ components: { accordion: Accordion } })
export default class AlarmDetail extends Vue {
@@ -16,8 +18,11 @@ export default class AlarmDetail extends Vue {
attaches = [];
notes = [];
newAttach: any = null;
selectedAttachMaintenance: any = null;
newNote: any = {};
selectedAttach: any = null;
selectedNote: any = null;
limitationList: number = 3;
enableModifyNote = true;
get currentUser() {
return this.$store.state.currentUser;
@@ -39,6 +44,10 @@ export default class AlarmDetail extends Vue {
return this.attaches.filter((v, idx) => idx < this.limitationList);
}
get filteredNotes() {
return this.notes.filter((v, idx) => idx < this.limitationList);
}
async mounted() {
this.attaches = await alarmsService.getAttachments(this.alarm.id);
this.notes = await alarmsService.getNote(this.alarm.id);
@@ -52,12 +61,11 @@ export default class AlarmDetail extends Vue {
// new MaintenanceService().uploadFile(this.selectedMaintenance, this.state.file);
}
updateLimitation(limitationList) {
if (this.limitationList == this.attaches.length) {
this.limitationList = 3;
} else {
this.limitationList = this.attaches.length;
}
updateLimitation() {
if (this.limitationList > 3)
this.limitationList == 3;
else
this.limitationList = Math.max(this.attaches.length, this.notes.length, 3);
}
isimage(name) {
@@ -86,8 +94,43 @@ export default class AlarmDetail extends Vue {
}
}
deselectNote() {
if (!this.enableModifyNote) return;
this.selectedNote = {};
}
onClickSelectAttach(attach) {
this.selectedAttachMaintenance = attach;
this.selectedAttach = attach;
}
onClickSelectNote(note) {
this.selectedNote = note;
}
onClickModifyNote(note) {
if (this.selectedNote == note) {
this.enableModifyNote = false;
this.isDisabled(note);
}
this.enableModifyNote = false;
this.selectedNote = note;
}
onClickCancelModifyNote() {
this.enableModifyNote = true;
}
getColor(nome, cognome) {
return getColorFromName(nome, cognome);
}
isDarkColor(color) {
return isDarkColor(color);
}
isDisabled(note) {
if (this.selectedNote && this.selectedNote.id == note.id && !this.enableModifyNote) {
return false;
}
else {
return true;
}
}
async openAttach(attach) {
@@ -95,4 +138,18 @@ export default class AlarmDetail extends Vue {
await alarmsService.OpenModal(attach, this.isimage(attach.fileName));
}
}
async saveNote(note) {
if (!note) return;
let result = await alarmsService.postNote(this.alarm.id, note.message);
this.notes.push(result);
this.newNote = {};
}
convertDate(date) {
return moment(date).format('L');
}
convertDateToTime(date) {
return moment(date).format('LT');
}
};
Step/wwwroot/src/app_modules/alarms/components/alarm-detail.vue
+41 -10
View File
@@ -46,34 +46,65 @@
<accordion :title="'Allegati'" :counter="attaches.length">
<div class="dropdown">
<div class="filename" v-for="a in filteredAttaches" :key="a.id" :class="{selected: selectedAttachMaintenance == a}" @click="onClickSelectAttach(a)">
<div class="filename" v-for="a in filteredAttaches" :key="a.id" :class="{selected: selectedAttach == a}" @click="onClickSelectAttach(a)">
<i class="fa fa-file-text-o" v-if="!isimage(a.fileName) && !ispdf(a.fileName)"></i>
<i class="fa fa-file-image-o" v-if="isimage(a.fileName)"></i>
<i class="fa fa-file-pdf-o" v-if="ispdf(a.fileName)"></i>
<span>{{a.fileName}}</span>
<div class="right">
<button class="btn-hidden" v-if="selectedAttachMaintenance == a" @click="openAttach(a)"><i class="fa fa-file-o"></i></button>
<button class="btn-hidden" v-if="selectedAttachMaintenance == a && a.userId == currentUser.id" @click="deleteAttach(a)"><i class="fa fa-trash" ></i></button>
<button class="btn-hidden" v-if="selectedAttach == a" @click="openAttach(a)"><i class="fa fa-file-o"></i></button>
<button class="btn-hidden" v-if="selectedAttach == a && a.userId == currentUser.id" @click="deleteAttach(a)"><i class="fa fa-trash" ></i></button>
</div>
</div>
<div class="allattach" v-if="attaches.length>3">
<button class="btn-hidden" @click="updateLimitation(limitationList)">
<span v-if="limitationList == attaches.length">{{'maintenance_card_btn_hide_all_attach' | localize("Nascondi tutti gli allegati")}}</span>
<span v-if="limitationList != attaches.length">{{'maintenance_card_btn_view_all_attach' | localize("Mostra tutti gli allegati")}}</span>
<span v-if="limitationList > 3">{{'maintenance_card_btn_hide_all_attach' | localize("Nascondi tutti gli allegati")}}</span>
<span v-if="limitationList < attaches.length">{{'maintenance_card_btn_view_all_attach' | localize("Mostra tutti gli allegati")}}</span>
</button>
</div>
<div class="addattach">
<div class="group-button-add-attach"><label for="input">{{'alarm_btn_add_attach' | localize("Aggiungi un allegato")}}<label for="input" class="btn"><i class="fa fa-plus"><input id="input" type="file" accept="application/pdf,image/jpeg,image/png" @change="onChange" style="display: none"/></i></label></label></div>
</div>
</div>
<!-- <div class="item text-success">
<div class="group-button-add-attach"><label for="input">{{'alarm_btn_add_attach' | localize("Aggiungi un allegato")}}<label for="input" class="btn"><span class="button btn text-22"><i class="fa fa-plus"><input id="input" type="file" accept="application/pdf,image/jpeg,image/png" @change="onChange" style="display: none"/></i></span></label></label></div>
</div> -->
</accordion>
<accordion :title="'Note'" :counter="notes.length">
<div class="item text-success">
<strong> Aggiungi una nota</strong> <button class="btn text-22"><i class="fa fa-plus"></i></button>
<div class="dropdown">
<div class="all-message-box scrollable_auto">
<div class="message-box" v-for="(n, index) in filteredNotes" :key="index" @click="onClickSelectNote(n)">
<div class="message-box-header">
<div v-if="currentUser && n.user.username != currentUser.username" :class="{'colorWhite':isDarkColor(getColor(n.user.lastName,n.user.firstName))}" :style="{'background-color':getColor(n.user.lastName,n.user.firstName) }" class="avatar">{{n.user.firstName.split(' ').map(function (s) { return s.charAt(0); }).join('')}}{{n.user.lastName.split(' ').map(function (s) { return s.charAt(0); }).join('')}}</div>
<textarea :disabled="isDisabled(n)" class="text-message" v-model="n.message"></textarea>
<div v-if="currentUser && n.user.username == currentUser.username" :class="{'colorWhite':isDarkColor(getColor(n.user.lastName,n.user.firstName))}" :style="{'background-color':getColor(n.user.lastName,n.user.firstName) }" class="avatar"> {{n.user.firstName.split(' ').map(function (s) { return s.charAt(0); }).join('')}}{{n.user.lastName.split(' ').map(function (s) { return s.charAt(0); }).join('')}}</div>
</div>
<div class="message-box-body" :class="{'my':(currentUser && n.user.username == currentUser.username)}">
<label class="text-date">{{'maintenance_card_label_date_timestamp' | localize("Aggiunta il %s alle %s",convertDate(n.dateTime),convertDateToTime(n.dateTime))}}</label>
</div>
<div class="groupbutton" :class="{'enablemodify':!enableModifyNote}">
<button class="btn-hidden" v-if="selectedNote == n && enableModifyNote && currentUser && n.user.username == currentUser.username" @click="onClickModifyNote(n)"><i class="fa fa-pencil-square-o"></i></button>
<button class="btn-hidden" v-if="selectedNote == n && enableModifyNote && currentUser && n.user.username == currentUser.username" @click="onClickDeleteNote(n)"><i class="fa fa-trash" ></i></button>
<div class="modify-padding">
<button class="btn" v-if="selectedNote == n && !enableModifyNote" @click="onClickCancelModifyNote">{{'maintenance_card_btn_cancel_modify_note' | localize("Cancel")}}</button>
<button class="btn" v-if="selectedNote == n && !enableModifyNote" @click="onClickModifyNoteMaintenance(n)">{{'maintenance_card_btn_save_modify_note' | localize("Save")}}</button>
</div>
</div>
</div>
</div>
<div class="allnotes">
<button class="btn-hidden" @click="updateLimitation(limitationList)">
<span v-if="limitationList > 3">{{'maintenance_card_btn_hide_all_note' | localize("Nascondi tutte le note")}}</span>
<span v-if="limitationList < notes.length">{{'maintenance_card_btn_view_all_note' | localize("Mostra tutte le note")}}</span>
</button>
</div>
<div class="addnote" @click="deselectNote()">
<div class="addnote-header">
<textarea @focus="deselectNote()" v-validate.initial="{required: true}" class="text-add-note" v-model="newNote.message" :disabled="!enableModifyNote"></textarea>
<div class="avatar" v-if="currentUser" :class="{'colorWhite':isDarkColor(getColor(currentUser.lastName,currentUser.firstName))}" :style="{'background-color':getColor(currentUser.lastName,currentUser.firstName) }" >{{currentUser.firstName.split(' ').map(function (s) { return s.charAt(0); }).join('')}}{{currentUser.lastName.split(' ').map(function (s) { return s.charAt(0); }).join('')}}</div>
</div>
<div class="addnote-buttons">
<button class="btn" :disabled="!enableModifyNote" @click="saveNote(newNote)">{{'maintenance_card_btn_save_note' | localize("Save")}}</button>
</div>
</div>
</div>
</accordion>
<button class="btn btn-back" @click="close()">