Format Timerecord related things

This commit is contained in:
Marcel Schwarz 2020-07-21 21:26:49 +02:00
parent e13d157dd6
commit 286d1c7fda
5 changed files with 317 additions and 345 deletions

View File

@ -1,4 +1,4 @@
<template >
<template>
<v-container id="createRecordListen">
<v-card align-center>
<p class="text-center logowhite--text" style="font-size:30pt">Details</p>
@ -47,9 +47,7 @@
v-on="on"
></v-text-field>
</template>
<v-date-picker v-model="newstartdate" @input="menu = false" no-title scrollable>
</v-date-picker>
<v-date-picker v-model="newstartdate" @input="menu = false" no-title scrollable></v-date-picker>
</v-menu>
</v-col>
<v-col cols="12" sm="6">
@ -71,9 +69,7 @@
v-on="on"
></v-text-field>
</template>
<v-date-picker v-model="newenddate" @input="menu2 = false" no-title scrollable>
</v-date-picker>
<v-date-picker v-model="newenddate" @input="menu2 = false" no-title scrollable></v-date-picker>
</v-menu>
</v-col>
</v-row>
@ -146,8 +142,9 @@
</v-container>
</template>
<script>
import { baseUri } from "../variables";
export default {
import {baseUri} from "../variables";
export default {
name: "CreateTimeTrackAccount",
data: () => ({
timestart: null,
@ -156,7 +153,7 @@ export default {
menutime2: false,
menu: false,
menu2: false,
types: [ "PAID" ,"BREAK"],
types: ["PAID", "BREAK"],
accounts: "",
user: sessionStorage.getItem("timeTrackAccountListUserId"),
newstartdate: "",
@ -170,7 +167,7 @@ export default {
var account = "";
var accountxhttp = new XMLHttpRequest();
accountxhttp.onreadystatechange = function() {
accountxhttp.onreadystatechange = function () {
if ((this.status == 200) & (this.readyState == 4)) {
account = JSON.parse(accountxhttp.responseText);
account = account._links.self.href;
@ -186,11 +183,7 @@ export default {
false
);
accountxhttp.setRequestHeader("Content-Type", "application/json");
accountxhttp.setRequestHeader(
"Authorization",
sessionStorage.getItem("jwt")
);
accountxhttp.setRequestHeader("Authorization", sessionStorage.getItem("jwt"));
accountxhttp.send(null);
if (this.newstartdate != "" && this.newenddate != "" && this.newdate != "" && account != "") {
@ -198,7 +191,7 @@ export default {
var suc;
this.newstartdate = this.newstartdate + "T" + this.timestart;
this.newenddate = this.newenddate + "T" + this.timeend;
xhttp.onreadystatechange = function() {
xhttp.onreadystatechange = function () {
if ((this.status == 201) & (this.readyState == 4)) {
suc = true;
}
@ -224,36 +217,30 @@ export default {
}
}
},
created (){
created() {
var accountsxhttp = new XMLHttpRequest();
var accounts;
accountsxhttp.onreadystatechange = function() {
accountsxhttp.onreadystatechange = function () {
if ((this.status == 200) & (this.readyState == 4)) {
accounts = JSON.parse(accountsxhttp.responseText);
accounts = accounts._embedded.accounts;
}
};
accountsxhttp.open(
"GET",
baseUri +
"/accounts/search/findByUsername?username=" +
sessionStorage.getItem("username") ,
sessionStorage.getItem("username"),
false
);
accountsxhttp.setRequestHeader("Content-Type", "application/json");
accountsxhttp.setRequestHeader(
"Authorization",
sessionStorage.getItem("jwt")
);
accountsxhttp.setRequestHeader("Authorization", sessionStorage.getItem("jwt"));
accountsxhttp.send(null);
var accountnames =[];
var accountnames = [];
for (let index = 0; index < accounts.length; index++) {
accountnames[index] = accounts[index].name;
}
this.accounts =accountnames;
this.accounts = accountnames;
},
mounted() {
var listen = document.getElementById("createRecordListen");
@ -261,10 +248,9 @@ export default {
listen.addEventListener("keyup", e => {
if (e.keyCode === 13) {
e.preventDefault();
this.addRecord();
}
});
}
};
};
</script>

View File

@ -1,4 +1,4 @@
<template >
<template>
<v-container id="editRecordListen">
<v-card align-center>
<p class="text-center logowhite--text" style="font-size:30pt">Details</p>
@ -15,7 +15,7 @@
></v-select>
</v-col>
<v-row>
<v-col cols="12" sm="6" >
<v-col cols="12" sm="6">
<v-menu
ref="menu"
v-model="menu"
@ -39,7 +39,7 @@
</v-date-picker>
</v-menu>
</v-col>
<v-col cols="12" sm="6" >
<v-col cols="12" sm="6">
<v-menu
ref="menu2"
v-model="menu2"
@ -58,9 +58,7 @@
v-on="on"
></v-text-field>
</template>
<v-date-picker v-model="newenddate" @input="menu2 = false" no-title scrollable>
</v-date-picker>
<v-date-picker v-model="newenddate" @input="menu2 = false" no-title scrollable></v-date-picker>
</v-menu>
</v-col>
</v-row>
@ -132,8 +130,9 @@
</v-card>
</v-container>
</template>
<script>
export default {
export default {
name: "EditTimeTrackAccount",
data: () => ({
timestart: null,
@ -142,7 +141,7 @@ export default {
menutime2: false,
menu: false,
menu2: false,
types: [ "PAID" ,"BREAK"],
types: ["PAID", "BREAK"],
type: "",
stardate: "",
enddate: "",
@ -160,7 +159,7 @@ export default {
this.newenddate = this.newenddate + "T" + this.timeend;
var xhttp = new XMLHttpRequest();
var suc;
xhttp.onreadystatechange = function() {
xhttp.onreadystatechange = function () {
if ((this.status == 200) & (this.readyState == 4)) {
suc = true;
}
@ -189,17 +188,12 @@ export default {
var recordxhttp = new XMLHttpRequest();
var record;
recordxhttp.onreadystatechange = function() {
recordxhttp.onreadystatechange = function () {
if (this.readyState == 4 && this.status == 200) {
record = JSON.parse(recordxhttp.responseText);
}
};
recordxhttp.open(
"GET",
sessionStorage.getItem("timeRecordEditSelfLink"),
false
);
recordxhttp.open("GET", sessionStorage.getItem("timeRecordEditSelfLink"), false);
recordxhttp.setRequestHeader("Authorization", sessionStorage.getItem("jwt"));
recordxhttp.send(null);
@ -225,10 +219,9 @@ export default {
listen.addEventListener("keyup", e => {
if (e.keyCode === 13) {
e.preventDefault();
this.editRecord();
}
});
}
};
};
</script>

View File

@ -2,16 +2,14 @@
<v-card outlined>
<v-list-item class="main_accent">
<v-list-item-content>
<!-- <v-col cols="2" >
<v-card color="background" elevation="0">
<pre><v-icon color="primary">mdi-calendar-range</v-icon>{{" " + timeRecord.date}}</pre>
</v-card>
</v-col> -->
<h3 justify-center>{{timeRecord.date}}</h3>
<v-row no-gutters align="center">
<v-col cols="2">
<v-card color="background" elevation="0">
<pre><v-icon color="green" v-bind:class="{'d-none':timeRecord.type == 'BREAK'}">mdi-currency-usd</v-icon><v-icon color="red" v-bind:class="{'d-none':timeRecord.type == 'PAID'}">mdi-currency-usd-off</v-icon>{{" " + timeRecord.type}}</pre>
<pre>
<v-icon color="green" v-bind:class="{'d-none':timeRecord.type == 'BREAK'}">mdi-currency-usd</v-icon>
<v-icon color="red" v-bind:class="{'d-none':timeRecord.type == 'PAID'}">mdi-currency-usd-off</v-icon>{{" " + timeRecord.type}}
</pre>
</v-card>
</v-col>
<v-col></v-col>
@ -54,7 +52,8 @@
<v-icon v-else>mdi-pencil</v-icon>
</v-btn>
</template>
<v-btn fab dark small color="green" @click="$emit('edit-timeRecord', timeRecord._links.self.href, timeRecord.enddate)">
<v-btn fab dark small color="green"
@click="$emit('edit-timeRecord', timeRecord._links.self.href, timeRecord.enddate)">
<v-icon>mdi-file-document-edit</v-icon>
</v-btn>
<v-btn fab dark small color="red" @click="$emit('del-timeRecord', timeRecord._links.self.href)">
@ -67,16 +66,16 @@
</template>
<script>
export default {
export default {
name: "TimeRecordItem",
props: ["timeRecord"]
};
};
</script>
<style scoped>
.v-card {
.v-card {
border-color: #131313 !important;
border-width: 3px !important;
border-radius: 10000px !important;
}
}
</style>

View File

@ -28,17 +28,16 @@
<v-icon>mdi-plus</v-icon>
</v-btn>
</v-col>
<v-col cols="5"></v-col>
</v-row>
</v-container>
</template>
<script>
import TimeRecordItem from "./TimeRecordItem.vue";
import { baseUri } from "../variables.js";
import TimeRecordItem from "./TimeRecordItem.vue";
import {baseUri} from "../variables.js";
export default {
export default {
name: "TimeRecords",
components: {
TimeRecordItem
@ -55,7 +54,7 @@ export default {
methods: {
deleteTimeRecord(selfLink) {
var userxhttp = new XMLHttpRequest();
userxhttp.onreadystatechange = function() {
userxhttp.onreadystatechange = function () {
if (this.readyState == 4 && this.status == 204) {
location.reload();
}
@ -103,10 +102,9 @@ export default {
this.page = 0;
}
sessionStorage.removeItem("page");
xhttp.onreadystatechange = function() {
xhttp.onreadystatechange = function () {
if (this.readyState == 4 && this.status == 200) {
var recordsDB = JSON.parse(xhttp.responseText);
records = recordsDB._embedded.records;
recordLinks = recordsDB._links;
}
@ -154,10 +152,9 @@ export default {
records[index].enddate = "pending";
}
}
this.timeRecords = records;
}
};
};
</script>
<style scoped>

View File

@ -24,22 +24,19 @@
</v-row>
</v-list-item-content>
<v-list-item-action>
<v-speed-dial
v-model="fab"
transition="slide-x-reverse-transition"
direction="left"
open-on-hover
>
<v-speed-dial v-model="fab" transition="slide-x-reverse-transition" direction="left" open-on-hover>
<template v-slot:activator>
<v-btn v-model="fab" color="background" elevation="0" dark fab>
<v-icon v-if="fab">mdi-close</v-icon>
<v-icon v-else>mdi-pencil</v-icon>
</v-btn>
</template>
<v-btn fab dark small color="green" @click="$emit('edit-timeTrackAccount', timeTrackAccount._links.self.href)">
<v-btn fab dark small color="green"
@click="$emit('edit-timeTrackAccount', timeTrackAccount._links.self.href)">
<v-icon>mdi-file-document-edit</v-icon>
</v-btn>
<v-btn fab dark small color="red" @click="$emit('del-timeTrackAccount', timeTrackAccount._links.self.href)">
<v-btn fab dark small color="red"
@click="$emit('del-timeTrackAccount', timeTrackAccount._links.self.href)">
<v-icon>mdi-delete</v-icon>
</v-btn>
</v-speed-dial>
@ -49,19 +46,19 @@
</template>
<script>
export default {
export default {
name: "TimeTrackAccountItem",
props: ["timeTrackAccount"],
data: () => ({
fab: undefined
}),
};
};
</script>
<style scoped>
.v-card {
.v-card {
border-color: #131313 !important;
border-width: 3px !important;
border-radius: 10000px !important;
}
}
</style>