Mercurial > gemma
changeset 1244:162a790120c2
removed separate importqueue folder. Moved component to imports
author | Thomas Junk <thomas.junk@intevation.de> |
---|---|
date | Wed, 21 Nov 2018 10:48:34 +0100 |
parents | 24797f66f268 |
children | 36e8470daba2 |
files | client/src/importqueue/Importqueue.vue client/src/imports/Importqueue.vue client/src/router.js |
diffstat | 3 files changed, 171 insertions(+), 171 deletions(-) [+] |
line wrap: on
line diff
--- a/client/src/importqueue/Importqueue.vue Wed Nov 21 10:23:53 2018 +0100 +++ /dev/null Thu Jan 01 00:00:00 1970 +0000 @@ -1,170 +0,0 @@ -<template> - <div class="d-flex flex-row"> - <div :class="spacerStyle"></div> - <div class="mt-3 mx-auto"> - <div class="card importqueuecard"> - <div class="card-header shadow-sm text-white bg-info mb-3">Importqueue</div> - <div class="card-body importcardbody"> - <div class="card-body importcardbody"> - <div class="searchandfilter d-flex flex-row"> - <div class="searchgroup input-group"> - <div class="input-group-prepend"> - <span class="input-group-text" id="search"> - <i class="fa fa-search"></i> - </span> - </div> - <input - type="text" - class="form-control" - placeholder="" - aria-label="Search" - aria-describedby="search" - > - </div> - <div class="filters"> - <button - @click="setFilter('successful')" - :class="successfulStyle" - >Successful</button> - <button @click="setFilter('failed')" :class="failedStyle">Failed</button> - <button @click="setFilter('pending')" :class="pendingStyle">Pending</button> - </div> - </div> - <table class="table"> - <thead> - <tr> - <th>Enqueued</th> - <th>Kind</th> - <th>User</th> - <th>State</th> - </tr> - </thead> - <tbody> - <tr v-for="job in imports" :key="job.id"> - <td>{{job.enqueued}}</td> - <td>{{job.kind}}</td> - <td>{{job.user}}</td> - <td>{{job.state}}</td> - </tr> - </tbody> - </table> - </div> - </div> - </div> - </div> - </div> -</template> - -<script> -import { displayError } from "../application/lib/errors.js"; -import { mapState } from "vuex"; - -export default { - name: "importqueue", - data() { - return { - successful: false, - failed: false, - pending: false - }; - }, - methods: { - setFilter(name) { - this[name] = !this[name]; - const allSet = this.successful && this.failed && this.pending; - if (allSet) { - this.all = false; - this.successful = false; - this.failed = false; - this.pending = false; - } - } - }, - computed: { - ...mapState("imports", ["imports"]), - ...mapState("application", ["showSidebar"]), - spacerStyle() { - return [ - "spacer ml-3", - { - "spacer-expanded": this.showSidebar, - "spacer-collapsed": !this.showSidebar - } - ]; - }, - successfulStyle() { - return { - btn: true, - "btn-light": !this.successful, - "btn-dark": this.successful - }; - }, - pendingStyle() { - return { - btn: true, - "btn-light": !this.pending, - "btn-dark": this.pending - }; - }, - failedStyle() { - return { - btn: true, - "btn-light": !this.failed, - "btn-dark": this.failed - }; - } - }, - mounted() { - this.$store.dispatch("imports/getImports").catch(error => { - const { status, data } = error.response; - displayError({ - title: "Backend Error", - message: `${status}: ${data.message || data}` - }); - }); - } -}; -</script> - -<style lang="sass" scoped> -.spacer - height: 100vh - -.spacer-collapsed - min-width: $icon-width + $offset - transition: $transition-fast - -.spacer-expanded - min-width: $sidebar-width + $offset - -.importqueuecard - width: 80vw - min-height: 20rem - -.card-body - width: 100% - margin-left: auto - margin-right: auto - -.searchandfilter - position: relative - margin-bottom: $xx-large-offset - -.filters - position: absolute - right: 0 - -.filters button - margin-right: $small-offset - -.table td, -.table th - border-top: 0 !important - text-align: left - padding: $small-offset !important - -.searchgroup - position: absolute - left: 0 - width: 50% -</style>
--- /dev/null Thu Jan 01 00:00:00 1970 +0000 +++ b/client/src/imports/Importqueue.vue Wed Nov 21 10:48:34 2018 +0100 @@ -0,0 +1,170 @@ +<template> + <div class="d-flex flex-row"> + <div :class="spacerStyle"></div> + <div class="mt-3 mx-auto"> + <div class="card importqueuecard"> + <div class="card-header shadow-sm text-white bg-info mb-3">Importqueue</div> + <div class="card-body importcardbody"> + <div class="card-body importcardbody"> + <div class="searchandfilter d-flex flex-row"> + <div class="searchgroup input-group"> + <div class="input-group-prepend"> + <span class="input-group-text" id="search"> + <i class="fa fa-search"></i> + </span> + </div> + <input + type="text" + class="form-control" + placeholder="" + aria-label="Search" + aria-describedby="search" + > + </div> + <div class="filters"> + <button + @click="setFilter('successful')" + :class="successfulStyle" + >Successful</button> + <button @click="setFilter('failed')" :class="failedStyle">Failed</button> + <button @click="setFilter('pending')" :class="pendingStyle">Pending</button> + </div> + </div> + <table class="table"> + <thead> + <tr> + <th>Enqueued</th> + <th>Kind</th> + <th>User</th> + <th>State</th> + </tr> + </thead> + <tbody> + <tr v-for="job in imports" :key="job.id"> + <td>{{job.enqueued}}</td> + <td>{{job.kind}}</td> + <td>{{job.user}}</td> + <td>{{job.state}}</td> + </tr> + </tbody> + </table> + </div> + </div> + </div> + </div> + </div> +</template> + +<script> +import { displayError } from "../application/lib/errors.js"; +import { mapState } from "vuex"; + +export default { + name: "importqueue", + data() { + return { + successful: false, + failed: false, + pending: false + }; + }, + methods: { + setFilter(name) { + this[name] = !this[name]; + const allSet = this.successful && this.failed && this.pending; + if (allSet) { + this.all = false; + this.successful = false; + this.failed = false; + this.pending = false; + } + } + }, + computed: { + ...mapState("imports", ["imports"]), + ...mapState("application", ["showSidebar"]), + spacerStyle() { + return [ + "spacer ml-3", + { + "spacer-expanded": this.showSidebar, + "spacer-collapsed": !this.showSidebar + } + ]; + }, + successfulStyle() { + return { + btn: true, + "btn-light": !this.successful, + "btn-dark": this.successful + }; + }, + pendingStyle() { + return { + btn: true, + "btn-light": !this.pending, + "btn-dark": this.pending + }; + }, + failedStyle() { + return { + btn: true, + "btn-light": !this.failed, + "btn-dark": this.failed + }; + } + }, + mounted() { + this.$store.dispatch("imports/getImports").catch(error => { + const { status, data } = error.response; + displayError({ + title: "Backend Error", + message: `${status}: ${data.message || data}` + }); + }); + } +}; +</script> + +<style lang="sass" scoped> +.spacer + height: 100vh + +.spacer-collapsed + min-width: $icon-width + $offset + transition: $transition-fast + +.spacer-expanded + min-width: $sidebar-width + $offset + +.importqueuecard + width: 80vw + min-height: 20rem + +.card-body + width: 100% + margin-left: auto + margin-right: auto + +.searchandfilter + position: relative + margin-bottom: $xx-large-offset + +.filters + position: absolute + right: 0 + +.filters button + margin-right: $small-offset + +.table td, +.table th + border-top: 0 !important + text-align: left + padding: $small-offset !important + +.searchgroup + position: absolute + left: 0 + width: 50% +</style>
--- a/client/src/router.js Wed Nov 21 10:23:53 2018 +0100 +++ b/client/src/router.js Wed Nov 21 10:48:34 2018 +0100 @@ -25,7 +25,7 @@ const Main = () => import("./application/Main.vue"); const Usermanagement = () => import("./usermanagement/Usermanagement.vue"); const Logs = () => import("./logs/logs.vue"); -const Importqueue = () => import("./importqueue/Importqueue.vue"); +const Importqueue = () => import("./imports/Importqueue.vue"); const Systemconfiguration = () => import("./systemconfiguration/systemconfiguration.vue");