Browse Source

put Settings to off-canvas;

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

3
src/App.vue

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

11
src/views/Menu.vue

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

61
src/views/Settings.vue

@ -1,13 +1,14 @@
<template> <template>
<div class="offcanvas offcanvas-end" id="settingsCanvas"
aria-hidden="true">
<div class="offcanvas-header">
<h5><i class="fas fa-sliders-h"></i> Einstellungen</h5> <h5><i class="fas fa-sliders-h"></i> Einstellungen</h5>
<hr/> <button type="button" v-on:click="updateStorage()" class="btn-close" data-bs-dismiss="offcanvas" aria-label="Close"></button>
</div>
<div class="offcanvas-body">
<div class="row"> <div class="row">
<div class="col-md-6"> <div class="col-md-12">
<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>Ticket-Link <small>Link zu einem Ticket ohne Ticketnummer</small></label> <label>Ticket-Link <small>Link zu einem Ticket ohne Ticketnummer</small></label>
<input type="text" v-model="trackerSystemUrl" class="form-control"> <input type="text" v-model="trackerSystemUrl" class="form-control">
@ -22,37 +23,39 @@
<br/> <br/>
<div class="form-group"> <div class="form-group">
<label> <label>
<input type="checkbox" class="form-control-checkbox" v-model="$store.state.settings.dontShowMinutes"> <input type="checkbox" class="form-control-checkbox"
v-model="$store.state.settings.dontShowMinutes">
Zeit immer in Stunden anzeigen Zeit immer in Stunden anzeigen
</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-12">
<!-- <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" id="exportJsonInput" v-model="exportJson"></textarea> <textarea class="form-control" id="exportJsonInput" v-model="exportJson"></textarea>
<button class="btn btn-success tracker-action-button" @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">
@ -63,9 +66,7 @@
</div> </div>
</div> </div>
</div> </div>
<div class="modal-footer"> </div>
<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> </div>
</template> </template>

Loading…
Cancel
Save