Browse Source

put Settings to off-canvas;

poc/redesign-trackers
stingl 4 years ago
parent
commit
5fde5543b3
  1. 3
      src/App.vue
  2. 15
      src/views/Menu.vue
  3. 123
      src/views/Settings.vue

3
src/App.vue

@ -12,6 +12,7 @@ @@ -12,6 +12,7 @@
<CustomBookForTracker/>
<TasksForTracker/>
<History/>
<Settings/>
</template>
<script>
@ -23,10 +24,12 @@ import History from "./views/History"; @@ -23,10 +24,12 @@ import History from "./views/History";
import TasksForTracker from "./views/TasksForTracker";
import HistoryForTracker from "./views/HistoryForTracker";
import CustomBookForTracker from "./views/CustomBookForTracker";
import Settings from "./views/Settings";
export default {
el: '#root',
components: {
Settings,
CustomBookForTracker,
HistoryForTracker,
TasksForTracker,

15
src/views/Menu.vue

@ -56,13 +56,16 @@ @@ -56,13 +56,16 @@
</a>
</div>
<div class="left-menu-item">
<router-link to="/settings"
type="button"
class="btn btn-dark text-light bottom-menu-item"
data-bs-placement="left"
title="Einstellungen">
<a type="button"
class="btn btn-dark text-light bottom-menu-item"
data-bs-toggle="offcanvas"
data-bs-target="#settingsCanvas"
data-bs-placement="top"
title="Einstellungen">
<i class="fas fa-sliders-h"></i>
</router-link>
</a>
</div>
<div class="left-menu-item">
</div>
</div>
</template>

123
src/views/Settings.vue

@ -1,72 +1,73 @@ @@ -1,72 +1,73 @@
<template>
<h5><i class="fas fa-sliders-h"></i> Einstellungen</h5>
<hr/>
<div class="row">
<div class="col-md-6">
<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">
<label>Ticket-Link <small>Link zu einem Ticket ohne Ticketnummer</small></label>
<input type="text" v-model="trackerSystemUrl" class="form-control">
</div>
<br/>
<div class="form-group">
<label>
<input type="checkbox" class="form-control-checkbox" v-model="$store.state.settings.showPT">
Ab 8 Stunden nurmehr PT anzeigen
</label>
</div>
<br/>
<div class="form-group">
<label>
<input type="checkbox" class="form-control-checkbox" v-model="$store.state.settings.dontShowMinutes">
Zeit immer in Stunden anzeigen
</label>
</div>
<br/>
<!-- <div class="form-group">-->
<!-- <label>Design</label>-->
<!-- <select v-model="theme" class="form-control">-->
<!-- <option v-for="(availableTheme, themeIndex) in themes" :value="availableTheme.name.toLowerCase()"-->
<!-- v-bind:key="themeIndex">{{ availableTheme.name }}-->
<!-- </option>-->
<!-- </select>-->
<!-- </div>-->
<!-- <br/>-->
<div class="offcanvas offcanvas-end" id="settingsCanvas"
aria-hidden="true">
<div class="offcanvas-header">
<h5><i class="fas fa-sliders-h"></i> Einstellungen</h5>
<button type="button" v-on:click="updateStorage()" class="btn-close" data-bs-dismiss="offcanvas" aria-label="Close"></button>
</div>
<div class="col-md-6">
<!-- <h5>Zurücksetzen & Löschen</h5>-->
<!-- <div class="row">-->
<!-- <div class="col-md-6">-->
<!-- <button class="btn btn-outline-danger btn-full-width" @click="deleteAllData()">Alle Daten-->
<!-- löschen-->
<!-- </button>-->
<!-- </div>-->
<!-- </div>-->
<!-- <br/>-->
<h5>Import & Export</h5>
<div class="offcanvas-body">
<div class="row">
<div class="col-md-6">
<h6>Export-Json</h6>
<textarea class="form-control" id="exportJsonInput" v-model="exportJson"></textarea>
<button class="btn btn-success tracker-action-button" @click="copy2Clipboard">Export-String kopieren
</button>
<div class="col-md-12">
<h5>Allgemeine Einstellungen</h5>
<div class="form-group">
<label>Ticket-Link <small>Link zu einem Ticket ohne Ticketnummer</small></label>
<input type="text" v-model="trackerSystemUrl" class="form-control">
</div>
<br/>
<div class="form-group">
<label>
<input type="checkbox" class="form-control-checkbox" v-model="$store.state.settings.showPT">
Ab 8 Stunden nurmehr PT anzeigen
</label>
</div>
<br/>
<div class="form-group">
<label>
<input type="checkbox" class="form-control-checkbox"
v-model="$store.state.settings.dontShowMinutes">
Zeit immer in Stunden anzeigen
</label>
</div>
<br/>
<!-- <div class="form-group">-->
<!-- <label>Design</label>-->
<!-- <select v-model="theme" class="form-control">-->
<!-- <option v-for="(availableTheme, themeIndex) in themes" :value="availableTheme.name.toLowerCase()"-->
<!-- v-bind:key="themeIndex">{{ availableTheme.name }}-->
<!-- </option>-->
<!-- </select>-->
<!-- </div>-->
<!-- <br/>-->
</div>
<div class="col-md-6">
<h6>Import</h6>
<textarea class="form-control" v-model="importJson"></textarea>
<button class="btn btn-success tracker-action-button" @click="importData">Import</button>
<div class="col-md-12">
<!-- <h5>Zurücksetzen & Löschen</h5>-->
<!-- <div class="row">-->
<!-- <div class="col-md-6">-->
<!-- <button class="btn btn-outline-danger btn-full-width" @click="deleteAllData()">Alle Daten-->
<!-- löschen-->
<!-- </button>-->
<!-- </div>-->
<!-- </div>-->
<!-- <br/>-->
<h5>Import & Export</h5>
<div class="row">
<div class="col-md-6">
<h6>Export-Json</h6>
<textarea class="form-control" id="exportJsonInput" v-model="exportJson"></textarea>
<button class="btn btn-success tracker-action-button" @click="copy2Clipboard">Export-String
kopieren
</button>
</div>
<div class="col-md-6">
<h6>Import</h6>
<textarea class="form-control" v-model="importJson"></textarea>
<button class="btn btn-success tracker-action-button" @click="importData">Import</button>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button class="btn btn-primary" v-on:click="updateStorage()" data-bs-dismiss="offcanvas" >Speichern</button>
<button type="button" class="btn btn-secondary" data-bs-dismiss="offcanvas" >Schließen</button>
</div>
</template>
<script>

Loading…
Cancel
Save