1nicerOli
/
timetrack-router
1
0
Fork 0
Code Issues 26 Pull Requests Projects Releases Wiki Activity
Browse Source

WIP

poc/redesign-trackers
Nero Ignis 4 years ago
parent
2250cd7666
commit
7df019e540
12 changed files with 202 additions and 246 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 21
      src/App.vue
  2. 157
      src/css/app.scss
  3. 1
      src/store/index.js
  4. 2
      src/views/Archive.vue
  5. 2
      src/views/CustomBookForTracker.vue
  6. 2
      src/views/HistoryForTracker.vue
  7. 133
      src/views/Menu.vue
  8. 58
      src/views/Settings.vue
  9. 59
      src/views/Switcher.vue
  10. 2
      src/views/TasksForTracker.vue
  11. 9
      src/views/Trackers.vue
  12. 2
      src/views/TrackersDetail.vue

21
src/App.vue
Unescape View File

@ -1,11 +1,15 @@
<template> <template>
<div class="container" id="content"> <div class="container-fluid">
<router-view/> <div class="row" id="main-wrapper">
<Menu/>
<div class="col" id="page-wrapper">
<router-view/>
</div>
</div>
</div> </div>
<TasksForTracker/> <TasksForTracker/>
<History/> <History/>
<Menu/>
</template> </template>
<script> <script>
@ -328,5 +332,16 @@ function playSound(sound, extension = null) {
</script> </script>
<style> <style>
.main-wrapper div {
padding-top: 10px;
}
.menu-wrapper col {
padding: 0;
margin: 0;
}
#page-wrapper {
padding-top: 15px;
}
</style> </style>

157
src/css/app.scss
Unescape View File

@ -2,175 +2,186 @@
@import "~bootswatch/dist/materia/bootstrap.min.css"; @import "~bootswatch/dist/materia/bootstrap.min.css";
body { body {
background-color: #e7e7e7; background-color: #e7e7e7;
}
.container {
margin: 20px auto 20px auto;
} }
.tracker-action-button { .tracker-action-button {
margin-top: 10px; margin-top: 10px;
padding: 1px 5px 1px 5px; padding: 1px 5px 1px 5px;
width: 100%; width: 100%;
} }
.delete-tracker-button { .delete-tracker-button {
margin-top: 10px; margin-top: 10px;
margin-bottom: 15px; margin-bottom: 15px;
padding: 1px 5px 1px 5px; padding: 1px 5px 1px 5px;
width: 100%; width: 100%;
} }
.side-button-right { .side-button-right {
font-size: 1.7em; font-size: 1.7em;
} }
.add-tracker-button { .add-tracker-button {
font-size: 1.7em; font-size: 1.7em;
} }
.navbar-brand { .navbar-brand {
width: 100%; width: 100%;
} }
.logo-nav { .logo-nav {
max-height: 35px; max-height: 35px;
margin: 5px; margin: 5px;
} }
nav { nav {
border-radius: 45px; border-radius: 45px;
} }
nav, .card { nav, .card {
margin-bottom: 20px; margin-bottom: 20px;
} }
.modal-content { .modal-content {
max-width: 1000px; max-width: 1000px;
} }
.btn-full-width { .btn-full-width {
width: 100%; width: 100%;
} }
.timeTracking { .timeTracking {
height: 635px; height: 635px;
overflow-y: scroll; overflow-y: scroll;
margin-bottom: 0; margin-bottom: 0;
padding-bottom: 0; padding-bottom: 0;
} }
.ticket-history { .ticket-history {
list-style: none; list-style: none;
padding-left: 0; padding-left: 0;
} }
.trackingNameField { .trackingNameField {
max-height: 1em; max-height: 1em;
margin-bottom: 1px; margin-bottom: 1px;
} }
#settingsModal .modal-dialog, #settingsModal .modal-dialog,
#showTicketsModal .modal-dialog, #showTicketsModal .modal-dialog,
#showArchivedTicketsModal .modal-dialog { #showArchivedTicketsModal .modal-dialog {
max-width: 900px; max-width: 900px;
} }
.btn { .btn {
text-transform: initial !important; text-transform: initial !important;
} }
.brand-title { .brand-title {
margin-left: 2em; margin-left: 2em;
margin-top: 0.5em; margin-top: 0.5em;
} }
#settingsModal .form-group { #settingsModal .form-group {
margin-bottom: 0.5em; margin-bottom: 0.5em;
} }
.search-field { .search-field {
display: inline-block; display: inline-block;
max-width: 85%; max-width: 85%;
margin-left: 5%; margin-left: 5%;
}
#left-menu {
position: fixed;
top: 0;
left: 0;
height: 100%;
width: 90px;
align-content: center;
background-color: #bdbdbd;
border-right: 1px solid grey;
padding: 0;
} }
#content { #content {
margin-left: 90px; margin-left: 90px;
max-width: 85vw; max-width: 85vw;
} }
.bottom-menu-item { .bottom-menu-item {
width: 100%; width: 100%;
margin-bottom: 1em; margin-bottom: 1em;
} }
.btn-switcher { .btn-switcher {
width: 100%; width: 100%;
} }
.container { .container {
margin-top: 1em; margin-top: 1em;
} }
.form-control { .form-control {
margin-bottom: 1em; margin-bottom: 1em;
} }
.switch-portal-button { .switch-portal-button {
margin-bottom: 0.5em; margin-bottom: 0.5em;
} }
.col-board-inner { .col-board-inner {
border-right: 1px solid grey; border-right: 1px solid grey;
} }
#board-view h5 { #board-view h5 {
text-align: center; text-align: center;
text-transform: uppercase; text-transform: uppercase;
color: dimgrey; color: dimgrey;
line-height: 0.7em; line-height: 0.7em;
word-spacing: 1px; word-spacing: 1px;
} }
.snippet-space-item { .snippet-space-item {
display: none; display: none;
} }
.CodeMirror { .CodeMirror {
border-radius: 5px; border-radius: 5px;
margin-top: 1em; margin-top: 1em;
} }
.btn-wide { .btn-wide {
width: 5em; width: 5em;
margin-top: 1em; margin-top: 1em;
margin-left: 1em; margin-left: 1em;
} }
.finished-task { .finished-task {
text-decoration: line-through; text-decoration: line-through;
} }
#trackerTasksModal a li { #trackerTasksModal a li {
color: black !important; color: black !important;
} }
#trackerTasksModal input[type=range] { #trackerTasksModal input[type=range] {
width: 100%; width: 100%;
}
#left-menu {
height: 100vh;
width: 90px;
display: inline-block;
background-color: #bdbdbd;
border-right: 1px solid grey;
padding: 15px 0;
margin: 0;
}
.menu-wrapper {
width: 90px;
}
.menu-wrapper col {
margin: 0;
padding: 0;
}
#left-menu:first-of-type(div) {
margin-top: 15px;
}
.left-menu-item {
margin: 0 10px;
} }

1
src/store/index.js
Unescape View File

@ -75,7 +75,6 @@ export default createStore({
state.trashed = {}; state.trashed = {};
state.trackers.pushToBeginning(restoredTracker); state.trackers.pushToBeginning(restoredTracker);
state.updateStorage();
}, },
archiveTracker(state, index) { archiveTracker(state, index) {
state.archive.pushToBeginning(state.trackers[index]); state.archive.pushToBeginning(state.trackers[index]);

2
src/views/Archive.vue
Unescape View File

@ -1,5 +1,5 @@
<template> <template>
<h5 class="modal-title"><i class="fas fa-archive"></i> Archivierte Tracker</h5> <h5><i class="fas fa-archive"></i> Archivierte Tracker</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button> <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
<div class="row"> <div class="row">
<div class="col-sm-6"></div> <div class="col-sm-6"></div>

2
src/views/CustomBookForTracker.vue
Unescape View File

@ -4,7 +4,7 @@
<div class="modal-dialog" role="document"> <div class="modal-dialog" role="document">
<div class="modal-content"> <div class="modal-content">
<div class="modal-header"> <div class="modal-header">
<h5 class="modal-title"><i class="fas fa-user-edit"></i> Buchung für {{selectedTracker.number}}</h5> <h5><i class="fas fa-user-edit"></i> Buchung für {{selectedTracker.number}}</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button> <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div> </div>
<div class="modal-body"> <div class="modal-body">

2
src/views/HistoryForTracker.vue
Unescape View File

@ -4,7 +4,7 @@
<div class="modal-dialog" role="document"> <div class="modal-dialog" role="document">
<div class="modal-content"> <div class="modal-content">
<div class="modal-header"> <div class="modal-header">
<h5 class="modal-title"><i class="fas fa-history"></i> History von <h5><i class="fas fa-history"></i> History von
{{ $store.state.selectedTracker.number }}</h5> {{ $store.state.selectedTracker.number }}</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button> <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div> </div>

133
src/views/Menu.vue
Unescape View File

@ -1,75 +1,68 @@
<template> <template>
<div id="left-menu"> <div id="left-menu">
<div class="container"> <div class="dropup left-menu-item">
<div class="row"> <button class="btn btn-success text-light bottom-menu-item" type="button"
<div class="col"> id="create-dropdown-menu" data-bs-toggle="dropdown" aria-expanded="false" title="Neu">
<div class="dropup"> <i class="fas fa-plus"></i>
<button class="btn btn-success text-light bottom-menu-item" type="button" </button>
id="create-dropdown-menu" data-bs-toggle="dropdown" aria-expanded="false" title="Neu"> <ul class="dropdown-menu" aria-labelledby="create-dropdown-menu">
<i class="fas fa-plus"></i> <li>
</button> <button class="btn btn-light dropdown-menu-button" type="button"
<ul class="dropdown-menu" aria-labelledby="create-dropdown-menu"> @click="createTracker()">Tracker
<li> </button>
<button class="btn btn-light dropdown-menu-button" type="button" </li>
@click="createTracker()">Tracker <li>
</button> <button class="btn btn-light dropdown-menu-button" type="button"
</li> @click="createTimeBox()">Timebox
<li> </button>
<button class="btn btn-light dropdown-menu-button" type="button" </li>
@click="createTimeBox()">Timebox </ul>
</button> </div>
</li> <div class="left-menu-item">
</ul> <router-link to="/"
</div> type="button"
</div> class="btn btn-dark text-light bottom-menu-item"
<div> data-bs-placement="left"
<router-link to="/" title="Home">
type="button" <i class="fas fa-home"></i>
class="btn btn-dark text-light bottom-menu-item" </router-link>
data-bs-placement="left" </div>
title="Home"> <div class="left-menu-item" v-if="$store.state.trackers.length > 0">
<i class="fas fa-home"></i> <router-link to="/trackers"
</router-link> type="button"
</div> class="btn btn-primary text-light bottom-menu-item"
<div class="" v-if="$store.state.trackers.length > 0"> data-bs-placement="left"
<router-link to="/trackers" title="Alle Tracker">
type="button" <i class="fas fa-clock"></i>
class="btn btn-primary text-light bottom-menu-item" </router-link>
data-bs-placement="left" </div>
title="Alle Tracker"> <div class="left-menu-item" v-if="$store.state.archive.length > 0">
<i class="fas fa-clock"></i> <router-link to="/archive"
</router-link> type="button"
</div> class="btn btn-warning bottom-menu-item"
<div class="" v-if="$store.state.archive.length > 0"> data-bs-placement="left"
<router-link to="/archive" title="Archivierte Tracker">
type="button" <i class="fas fa-archive"></i>
class="btn btn-warning bottom-menu-item" </router-link>
data-bs-placement="left" </div>
title="Archivierte Tracker"> <div class="left-menu-item" v-if="($store.state.trackers.length + $store.state.archive.length) > 0">
<i class="fas fa-archive"></i> <a type="button"
</router-link> class="btn btn-info text-light bottom-menu-item"
</div> data-bs-toggle="offcanvas"
<div class="" v-if="($store.state.trackers.length + $store.state.archive.length) > 0"> data-bs-target="#pastDaysModal"
<a type="button" data-bs-placement="top"
class="btn btn-info text-light bottom-menu-item" title="Buchungsverlauf">
data-bs-toggle="offcanvas" <i class="fas fa-history"></i>
data-bs-target="#pastDaysModal" </a>
data-bs-placement="top" </div>
title="Buchungsverlauf"> <div class="left-menu-item">
<i class="fas fa-history"></i> <router-link to="/settings"
</a> type="button"
</div> class="btn btn-dark text-light bottom-menu-item"
<div class=""> data-bs-placement="left"
title="Einstellungen">
<router-link to="/settings" <i class="fas fa-sliders-h"></i>
type="button" </router-link>
class="btn btn-dark text-light bottom-menu-item"
data-bs-placement="left"
title="Einstellungen">
<i class="fas fa-sliders-h"></i>
</router-link>
</div>
</div>
</div> </div>
</div> </div>
</template> </template>

58
src/views/Settings.vue
Unescape View File

@ -1,15 +1,15 @@
<template> <template>
<h5 class="modal-title"><i class="fas fa-sliders-h"></i> Einstellungen</h5> <h5><i class="fas fa-sliders-h"></i> Einstellungen</h5>
<hr/> <hr/>
<div class="row"> <div class="row">
<div class="col-md-6"> <div class="col-md-6">
<h5>Allgemeine Einstellungen</h5> <h5>Allgemeine Einstellungen</h5>
<!-- <div class="form-group">-->
<!-- <label>Logo-Pfad</label>-->
<!-- <input type="text" v-model="dashboardLogo" class="form-control">-->
<!-- </div>-->
<div class="form-group"> <div class="form-group">
<label>Logo-Pfad</label> <label>Ticket-Link <small>Link zu einem Ticket ohne Ticketnummer</small></label>
<input type="text" v-model="dashboardLogo" class="form-control">
</div>
<div class="form-group">
<label>Tracker-Link <small>Link zu einem Tracker ohne Trackernummer</small></label>
<input type="text" v-model="trackerSystemUrl" class="form-control"> <input type="text" v-model="trackerSystemUrl" class="form-control">
</div> </div>
<br/> <br/>
@ -27,38 +27,38 @@
</label> </label>
</div> </div>
<br/> <br/>
<div class="form-group"> <!-- <div class="form-group">-->
<label>Design</label> <!-- <label>Design</label>-->
<select v-model="theme" class="form-control"> <!-- <select v-model="theme" class="form-control">-->
<option v-for="(availableTheme, themeIndex) in themes" :value="availableTheme.name.toLowerCase()" <!-- <option v-for="(availableTheme, themeIndex) in themes" :value="availableTheme.name.toLowerCase()"-->
v-bind:key="themeIndex">{{ availableTheme.name }} <!-- v-bind:key="themeIndex">{{ availableTheme.name }}-->
</option> <!-- </option>-->
</select> <!-- </select>-->
</div> <!-- </div>-->
<br/> <!-- <br/>-->
</div> </div>
<div class="col-md-6"> <div class="col-md-6">
<h5>Zurücksetzen & Löschen</h5> <!-- <h5>Zurücksetzen & Löschen</h5>-->
<div class="row"> <!-- <div class="row">-->
<div class="col-md-6"> <!-- <div class="col-md-6">-->
<button class="btn btn-outline-danger btn-full-width" @click="deleteAllData()">Alle Daten <!-- <button class="btn btn-outline-danger btn-full-width" @click="deleteAllData()">Alle Daten-->
löschen <!-- löschen-->
</button> <!-- </button>-->
</div> <!-- </div>-->
</div> <!-- </div>-->
<br/> <!-- <br/>-->
<h5>Import & Export</h5> <h5>Import & Export</h5>
<div class="row"> <div class="row">
<div class="col-md-6"> <div class="col-md-6">
<h6>Export-Json</h6> <h6>Export-Json</h6>
<textarea class="form-control" rows="3" id="exportJsonInput" v-model="exportJson"></textarea> <textarea class="form-control" id="exportJsonInput" v-model="exportJson"></textarea>
<button class="btn btn-success btn-full-width" @click="copy2Clipboard">Export-String kopieren <button class="btn btn-success tracker-action-button" @click="copy2Clipboard">Export-String kopieren
</button> </button>
</div> </div>
<div class="col-md-6"> <div class="col-md-6">
<h6>Import</h6> <h6>Import</h6>
<textarea class="form-control" rows="3" v-model="importJson"></textarea> <textarea class="form-control" v-model="importJson"></textarea>
<button class="btn btn-success btn-full-width" @click="importData">Import</button> <button class="btn btn-success tracker-action-button" @click="importData">Import</button>
</div> </div>
</div> </div>
</div> </div>
@ -80,7 +80,7 @@ export default {
importJson: '', importJson: '',
theme: '', theme: '',
themes: null, themes: null,
dashboardLogo: 'assets/img/logo.png', // dashboardLogo: 'assets/img/logo.png',
trackerSystemUrl: '', trackerSystemUrl: '',
showPT: true, showPT: true,
dontShowMinutes: false, dontShowMinutes: false,

59
src/views/Switcher.vue
Unescape View File

@ -1,59 +0,0 @@
<template>
<div class="modal fade" id="switcherModal" tabindex="-1" role="dialog" aria-labelledby="switcherModalLabel"
aria-hidden="true" v-if="">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title"><i class="fas fa-random"></i> Portal Switcher</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<div class="row">
<div class="col-12">
<div class="form-group">
<label class="text-muted">Portalname:</label>
<input v-if="!portals || portals.length === 0" class="form-control" @change="updateStorage()" @keydown="updateStorage()" v-model="portal"/>
<select v-else v-model="portal" class="form-control">
<option v-for="selectablePortal in portals" :value="selectablePortal">{{ selectablePortal }}</option>
</select>
<div class="form-group" v-if="experimental.portalSwitcher">
<label>
<input type="checkbox" class="form-control-checkbox" v-model="publicDB">
Auf Standard-DB wechseln?
</label>
</div>
<br/>
</div>
</div>
<template v-if="portal && portal !== ''">
<div class="col-12 switch-portal-button">
<a class="btn btn-danger btn-switcher" href="javascript:" @click="sendPortalChangeRequest">
<i class="fas fa-random"></i> Wechsle Portal
</a>
</div>
<div class="col">
<a class="btn btn-info btn-switcher" href="https://my.vemap.docker" target="_blank">Docker</a>
</div>
<div class="col">
<a class="btn btn-warning btn-switcher" :href="getPortalLink(true)" target="_blank">Test</a>
</div>
<div class="col">
<a class="btn btn-success btn-switcher" :href="getPortalLink()" target="_blank">Live</a>
</div>
</template>
</div>
</div>
</div>
</div>
</div>
</template>
<script>
export default {
name: "Switcher"
}
</script>
<style scoped>
</style>

2
src/views/TasksForTracker.vue
Unescape View File

@ -7,7 +7,7 @@
aria-labelledby="showTrackerTasksModal" aria-labelledby="showTrackerTasksModal"
aria-hidden="true"> aria-hidden="true">
<div class="offcanvas-header"> <div class="offcanvas-header">
<h5 class="modal-title"><i class="fas fa-clock"></i> Tasks für {{ $store.state.selectedTracker.number }}</h5> <h5><i class="fas fa-clock"></i> Tasks für {{ $store.state.selectedTracker.number }}</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button> <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div> </div>
<div class="modal-body"> <div class="modal-body">

9
src/views/Trackers.vue
Unescape View File

@ -294,6 +294,7 @@ export default {
return number.indexOf('#') >= 0; return number.indexOf('#') >= 0;
}, },
deleteTracker(index, archive = false) { deleteTracker(index, archive = false) {
let component = this;
this.$store.commit("deleteTracker", index, archive); this.$store.commit("deleteTracker", index, archive);
let message = 'Tracker "' + this.$store.state.trashed.number + '" wurde gelöscht'; let message = 'Tracker "' + this.$store.state.trashed.number + '" wurde gelöscht';
@ -305,7 +306,8 @@ export default {
instance.hide({ instance.hide({
transitionOut: 'fadeOutUp', transitionOut: 'fadeOutUp',
onClosing: function(){ onClosing: function(){
this.$store.commit('restoreTrashed'); component.$store.commit('restoreTrashed');
component.$store.commit('saveTrackers');
} }
}, toast, 'buttonName'); }, toast, 'buttonName');
}, true] }, true]
@ -361,11 +363,6 @@ export default {
margin-bottom: 1px; margin-bottom: 1px;
} }
.bg-timebox {
background-color: black;
color: white;
}
.bg-timebox input { .bg-timebox input {
color: white; color: white;
} }

2
src/views/TrackersDetail.vue
Unescape View File

@ -1,6 +1,6 @@
<template> <template>
<div> <div>
<h5 class="modal-title"><i class="fas fa-clock"></i> Tracker</h5> <h5><i class="fas fa-clock"></i> Tracker</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button> <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div> </div>
<div class="row"> <div class="row">

Write Preview
Loading…
Cancel
Save