remove statistik example, statistics examples removed, status display revised

This commit is contained in:
ogerly 2021-10-20 15:07:18 +02:00
parent 3728b4ff0c
commit 16f3901eeb
13 changed files with 20 additions and 507 deletions

View File

@ -18,7 +18,6 @@
"@babel/preset-env": "^7.13.12",
"@vue/cli-plugin-unit-jest": "^4.5.12",
"@vue/test-utils": "^1.1.3",
"apexcharts": "^3.28.3",
"apollo-boost": "^0.4.9",
"axios": "^0.21.1",
"babel-core": "^7.0.0-bridge.0",
@ -62,7 +61,6 @@
"sweetalert2": "^9.5.4",
"vee-validate": "^3.4.5",
"vue": "^2.6.11",
"vue-apexcharts": "^1.6.2",
"vue-apollo": "^3.0.7",
"vue-bootstrap-typeahead": "^0.2.6",
"vue-cli-plugin-i18n": "^1.0.1",

View File

@ -1,112 +0,0 @@
<template>
<div class="appChartExample">
<apexchart width="100%" height="400" type="line" :options="chartOptions" :series="series" />
<apexchart
width="100%"
height="150"
type="area"
:options="chartOptionsMinimap"
:series="series"
/>
<div></div>
</div>
</template>
<script>
import { series } from './series.js'
export default {
data: function () {
const chartId = 'priceHistoryChart' + Date.now()
const chartIdMinimap = 'priceHistoryChartMinimap' + Date.now()
const dateFrom = new Date('2018-09-26')
const dateTo = new Date('2018-10-01')
const chartOptions = {
chart: {
background: '#efe',
id: chartId,
animations: {
enabled: false,
},
toolbar: {
autoSelected: 'pan',
show: false,
},
},
legend: {
position: 'right',
},
stroke: {
curve: 'smooth',
width: [4],
dashArray: [10],
},
tooltip: {
followCursor: true,
x: {
show: false,
},
},
xaxis: {
type: 'datetime',
},
}
const chartOptionsMinimap = {
chart: {
id: chartIdMinimap,
animations: {
enabled: false,
},
brush: {
enabled: true,
target: chartId,
},
selection: {
xaxis: {
min: dateFrom.getTime(),
max: dateTo.getTime(),
},
},
type: 'line',
},
fill: {
gradient: {
enabled: true,
opacityFrom: 0.91,
opacityTo: 0.1,
},
},
legend: {
show: false,
},
xaxis: {
type: 'datetime',
},
}
return {
chartOptions,
chartOptionsMinimap,
series,
}
},
methods: {
updateChart() {
this.chartOptionsMinimap = {
chart: {
foreColor: '#' + Math.floor(Math.random() * 16777215).toString(16),
selection: {
xaxis: {
min: new Date('2018-09-28').getTime(),
max: new Date('2018-09-30').getTime(),
},
},
},
}
},
},
}
</script>

View File

@ -1,224 +0,0 @@
export const series = [
{
name: 'obb.docker',
data: [
{
x: '2018-09-25',
y: 900,
},
{
x: '2018-09-26',
y: 900,
},
{
x: '2018-09-27',
y: 900,
},
{
x: '2018-09-28',
y: 900,
},
{
x: '2018-09-29',
y: 900,
},
{
x: '2018-09-30',
y: 900,
},
{
x: '2018-10-01',
y: 900,
},
{
x: '2018-10-02',
y: 1125,
},
],
},
{
name: 'filato.dk',
data: [
{
x: '2018-09-25',
y: 1251.45,
},
{
x: '2018-09-26',
y: 984.94,
},
{
x: '2018-09-27',
y: 1170.34,
},
{
x: '2018-09-28',
y: 1193.51,
},
{
x: '2018-09-29',
y: 1251.45,
},
{
x: '2018-09-30',
y: 1147.16,
},
{
x: '2018-10-01',
y: 1263.04,
},
{
x: '2018-10-02',
y: 1158.75,
},
],
},
{
name: 'rito.dk',
data: [
{
x: '2018-09-25',
y: 1193.06,
},
{
x: '2018-09-26',
y: 1193.06,
},
{
x: '2018-09-27',
y: 1068.08,
},
{
x: '2018-09-28',
y: 909,
},
{
x: '2018-09-29',
y: 965.81,
},
{
x: '2018-09-30',
y: 965.81,
},
{
x: '2018-10-01',
y: 1022.63,
},
{
x: '2018-10-02',
y: 1136.25,
},
],
},
{
name: 'fruhyasinth.dk',
data: [
{
x: '2018-09-25',
y: 1064.7,
},
{
x: '2018-09-26',
y: 1146.6,
},
{
x: '2018-09-27',
y: 1216.8,
},
{
x: '2018-09-28',
y: 959.4,
},
{
x: '2018-09-29',
y: 1193.4,
},
{
x: '2018-09-30',
y: 1017.9,
},
{
x: '2018-10-01',
y: 1275.3,
},
{
x: '2018-10-02',
y: 1170,
},
],
},
{
name: 'bilka.dk',
data: [
{
x: '2018-09-25',
y: 973.35,
},
{
x: '2018-09-26',
y: 1147.16,
},
{
x: '2018-09-27',
y: 1263.04,
},
{
x: '2018-09-28',
y: 927,
},
{
x: '2018-09-29',
y: 950.18,
},
{
x: '2018-09-30',
y: 1123.99,
},
{
x: '2018-10-01',
y: 1158.75,
},
{
x: '2018-10-02',
y: 1158.75,
},
],
},
{
name: 'hobbii.dk',
data: [
{
x: '2018-09-25',
y: 963.9,
},
{
x: '2018-09-26',
y: 1136.03,
},
{
x: '2018-09-27',
y: 1216.35,
},
{
x: '2018-09-28',
y: 1067.18,
},
{
x: '2018-09-29',
y: 952.43,
},
{
x: '2018-09-30',
y: 929.48,
},
{
x: '2018-10-01',
y: 1204.88,
},
{
x: '2018-10-02',
y: 1147.5,
},
],
},
]

View File

@ -4,9 +4,6 @@ import VueI18n from 'vue-i18n'
import en from 'vee-validate/dist/locale/en'
import de from 'vee-validate/dist/locale/de'
import enCharts from 'apexcharts/dist/locales/en'
import deCharts from 'apexcharts/dist/locales/de'
Vue.use(VueI18n)
function loadLocaleMessages() {
@ -20,14 +17,12 @@ function loadLocaleMessages() {
if (locale === 'de') {
messages[locale] = {
validations: de,
charts: deCharts,
...messages[locale],
}
}
if (locale === 'en') {
messages[locale] = {
validations: en,
charts: enCharts,
...messages[locale],
}
}

View File

@ -7,8 +7,6 @@ import { ApolloClient, ApolloLink, InMemoryCache, HttpLink } from 'apollo-boost'
import VueApollo from 'vue-apollo'
import CONFIG from './config'
import VueApexCharts from 'vue-apexcharts'
import addNavigationGuards from './routes/guards'
import { store } from './store/store'
@ -55,9 +53,6 @@ loadAllRules(i18n)
addNavigationGuards(router, store)
Vue.use(VueApexCharts)
Vue.component('apexchart', VueApexCharts)
/* eslint-disable no-new */
new Vue({
el: '#app',

View File

@ -26,10 +26,12 @@ describe('AccountOverview', () => {
wrapper = Wrapper()
})
it('has a status line', () => {
expect(wrapper.find('div.gdd-status').exists()).toBeTruthy()
it('has a status gdd-status-gdd', () => {
expect(wrapper.find('div.gdd-status-gdd').exists()).toBeTruthy()
})
it('has a status gdd-status-gdt', () => {
expect(wrapper.find('div.gdd-status-gdt').exists()).toBeTruthy()
})
it('has a transactions table', () => {
expect(wrapper.find('div.gdd-transaction-list').exists()).toBeTruthy()
})

View File

@ -6,11 +6,11 @@
<b-row>
<b-col class="col-11 bg-gray text-white p-3">
<gdd-status
class="gdd-status-gdd"
v-if="showContext"
:pending="pending"
:balance="balance"
:gdt-balance="GdtBalance"
:gdt="false"
status-text="GDD"
/>
</b-col>
</b-row>
@ -19,11 +19,11 @@
<b-row>
<b-col class="bg-white text-gray p-3">
<gdd-status
class="gdd-status-gdt"
v-if="showContext"
:pending="pending"
:balance="balance"
:gdt-balance="GdtBalance"
:gdd="false"
:balance="GdtBalance"
status-text="GDT"
/>
</b-col>
</b-row>
@ -31,22 +31,6 @@
</b-row>
<br />
<b-row>
<b-col class="col-12 col-md-6">
GDD Bar
<div>
<apexchart type="bar" :options="chartOptions" :series="series"></apexchart>
</div>
</b-col>
<b-col class="col-12 col-md-6">
GDD Line
<div>
<apexchart type="line" :options="chartOptions" :series="series"></apexchart>
</div>
</b-col>
</b-row>
<hr />
<template #transaction-form>
<transaction-form :balance="balance" @set-transaction="setTransaction"></transaction-form>
</template>
@ -61,16 +45,12 @@
/>
<gdd-transaction-list-footer v-if="showContext" :count="transactionCount" />
</b-container>
<hr />
example
<chart-example />
</div>
</template>
<script>
import GddStatus from './GddGdtStatus.vue'
import GddTransactionList from './AccountOverview/GddTransactionList.vue'
import GddTransactionListFooter from './AccountOverview/GddTransactionListFooter.vue'
import ChartExample from '../../components/charts/ChartExample.vue'
export default {
name: 'Overview',
@ -78,7 +58,6 @@ export default {
GddStatus,
GddTransactionList,
GddTransactionListFooter,
ChartExample,
},
data() {
return {
@ -89,30 +68,6 @@ export default {
loading: false,
datacollectionGdd: null,
datacollectionGdt: null,
chartOptions: {
chart: {
class: 'vuechart',
},
xaxis: {
categories: ['Mär', 'Apr', 'Mai', 'Jun', 'Jul', 'Aug', 'Sep', 'Okt'],
},
},
series: [
{
name: this.$t('decay.received'),
data: [30, 40, 35, 50, 49, 60, 70, 91],
},
{
name: this.$t('decay.sent'),
data: [20, 10, 45, 60, 59, 30, 50, 81],
},
{
name: this.$t('decay.created'),
data: [1000, 500, 700, 1000, 800, 500, 1000, 810],
},
],
}
},
props: {

View File

@ -12,7 +12,7 @@ describe('GddStatus', () => {
const propsData = {
balance: 1234,
GdtBalance: 9876,
statusText: 'GDD',
}
const Wrapper = () => {
@ -24,16 +24,6 @@ describe('GddStatus', () => {
wrapper = Wrapper()
})
describe('balance is loading', () => {
it('it displays em-dash as the ammount of GDD', () => {
expect(wrapper.find('div.gdd-status-gdd').text()).toEqual('— GDD')
})
it('it displays em-dash as the ammount of GDT', () => {
expect(wrapper.find('div.gdd-status-gdt').text()).toEqual('— GDT')
})
})
describe('balance is loaded', () => {
beforeEach(() => {
wrapper.setProps({
@ -42,11 +32,7 @@ describe('GddStatus', () => {
})
it('it displays the ammount of GDD', () => {
expect(wrapper.find('div.gdd-status-gdd').text()).toEqual('1234 GDD')
})
it('it displays the ammount of GDT', () => {
expect(wrapper.find('div.gdd-status-gdt').text()).toEqual('9876 GDT')
expect(wrapper.find('div.gdd-status-div').text()).toEqual('1234 GDD')
})
})
})

View File

@ -1,10 +1,7 @@
<template>
<div class="gdd-status">
<div class="p-0 gdd-status-gdd" v-if="gdd">
{{ pending ? '—' : $n(balance, 'decimal') }} GDD
</div>
<div :class="gdd ? 'p-0 text-right gdd-status-gdt' : 'p-0 gdd-status-gdt'" v-if="gdt">
{{ pending ? '—' : $n(GdtBalance, 'decimal') }} GDT
<div class="p-0 gdd-status-div">
{{ pending ? '—' : $n(balance, 'decimal') }} {{ statusText }}
</div>
</div>
</template>
@ -14,18 +11,13 @@ export default {
name: 'GddStatus',
props: {
balance: { type: Number, default: 0 },
GdtBalance: { type: Number, default: 0 },
pending: {
type: Boolean,
default: true,
},
gdd: {
type: Boolean,
default: true,
},
gdt: {
type: Boolean,
default: true,
statusText: {
type: String,
default: '',
},
},
}

View File

@ -38,7 +38,7 @@ describe('SendOverview', () => {
wrapper = Wrapper()
})
it('has a status GDD line', () => {
it('has a status GDD line gdd-status-gdd', () => {
expect(wrapper.find('div.gdd-status-gdd').exists()).toBeTruthy()
})

View File

@ -4,11 +4,11 @@
<b-row>
<b-col class="bg-gray text-white text-center p-3">
<gdd-status
class="gdd-status-gdd"
v-if="showContext"
:pending="pending"
:balance="balance"
:gdt-balance="GdtBalance"
:gdt="false"
status-text="GDD"
/>
</b-col>
</b-row>

View File

@ -12,7 +12,6 @@ import SideBar from '@/components/SidebarPlugin'
import VueQrcode from 'vue-qrcode'
import VueMoment from 'vue-moment'
import VueApexCharts from 'vue-apexcharts'
// import clickOutside from '@/directives/click-ouside.js'
import { focus } from 'vue-focus'
@ -45,7 +44,6 @@ global.localVue.use(RegeneratorRuntime)
global.localVue.use(SideBar)
global.localVue.use(VueQrcode)
global.localVue.use(VueMoment)
global.localVue.use(VueApexCharts)
global.localVue.component('validation-provider', ValidationProvider)
global.localVue.component('validation-observer', ValidationObserver)
// global.localVue.directive('click-outside', clickOutside)

View File

@ -2615,18 +2615,6 @@ anymatch@^3.0.3, anymatch@~3.1.1:
normalize-path "^3.0.0"
picomatch "^2.0.4"
apexcharts@^3.28.3:
version "3.28.3"
resolved "https://registry.yarnpkg.com/apexcharts/-/apexcharts-3.28.3.tgz#22a6d9b234c82f6c2e1dd4aebba05b7603e2b1d2"
integrity sha512-EhghB2P27/Gjhwct8sSS0V63mdpRMx/ikH34dwUTqZQnkAEyOS/RKDmYjXBNA7zsAKBE/pThOdoTya6ADyk6zQ==
dependencies:
svg.draggable.js "^2.2.2"
svg.easing.js "^2.0.0"
svg.filter.js "^2.0.2"
svg.pathmorphing.js "^0.1.3"
svg.resize.js "^1.4.3"
svg.select.js "^3.0.1"
apollo-boost@^0.4.9:
version "0.4.9"
resolved "https://registry.yarnpkg.com/apollo-boost/-/apollo-boost-0.4.9.tgz#ab3ba539c2ca944e6fd156583a1b1954b17a6791"
@ -12612,61 +12600,6 @@ svg-tags@^1.0.0:
resolved "https://registry.yarnpkg.com/svg-tags/-/svg-tags-1.0.0.tgz#58f71cee3bd519b59d4b2a843b6c7de64ac04764"
integrity sha1-WPcc7jvVGbWdSyqEO2x95krAR2Q=
svg.draggable.js@^2.2.2:
version "2.2.2"
resolved "https://registry.yarnpkg.com/svg.draggable.js/-/svg.draggable.js-2.2.2.tgz#c514a2f1405efb6f0263e7958f5b68fce50603ba"
integrity sha512-JzNHBc2fLQMzYCZ90KZHN2ohXL0BQJGQimK1kGk6AvSeibuKcIdDX9Kr0dT9+UJ5O8nYA0RB839Lhvk4CY4MZw==
dependencies:
svg.js "^2.0.1"
svg.easing.js@^2.0.0:
version "2.0.0"
resolved "https://registry.yarnpkg.com/svg.easing.js/-/svg.easing.js-2.0.0.tgz#8aa9946b0a8e27857a5c40a10eba4091e5691f12"
integrity sha1-iqmUawqOJ4V6XEChDrpAkeVpHxI=
dependencies:
svg.js ">=2.3.x"
svg.filter.js@^2.0.2:
version "2.0.2"
resolved "https://registry.yarnpkg.com/svg.filter.js/-/svg.filter.js-2.0.2.tgz#91008e151389dd9230779fcbe6e2c9a362d1c203"
integrity sha1-kQCOFROJ3ZIwd5/L5uLJo2LRwgM=
dependencies:
svg.js "^2.2.5"
svg.js@>=2.3.x, svg.js@^2.0.1, svg.js@^2.2.5, svg.js@^2.4.0, svg.js@^2.6.5:
version "2.7.1"
resolved "https://registry.yarnpkg.com/svg.js/-/svg.js-2.7.1.tgz#eb977ed4737001eab859949b4a398ee1bb79948d"
integrity sha512-ycbxpizEQktk3FYvn/8BH+6/EuWXg7ZpQREJvgacqn46gIddG24tNNe4Son6omdXCnSOaApnpZw6MPCBA1dODA==
svg.pathmorphing.js@^0.1.3:
version "0.1.3"
resolved "https://registry.yarnpkg.com/svg.pathmorphing.js/-/svg.pathmorphing.js-0.1.3.tgz#c25718a1cc7c36e852ecabc380e758ac09bb2b65"
integrity sha512-49HWI9X4XQR/JG1qXkSDV8xViuTLIWm/B/7YuQELV5KMOPtXjiwH4XPJvr/ghEDibmLQ9Oc22dpWpG0vUDDNww==
dependencies:
svg.js "^2.4.0"
svg.resize.js@^1.4.3:
version "1.4.3"
resolved "https://registry.yarnpkg.com/svg.resize.js/-/svg.resize.js-1.4.3.tgz#885abd248e0cd205b36b973c4b578b9a36f23332"
integrity sha512-9k5sXJuPKp+mVzXNvxz7U0uC9oVMQrrf7cFsETznzUDDm0x8+77dtZkWdMfRlmbkEEYvUn9btKuZ3n41oNA+uw==
dependencies:
svg.js "^2.6.5"
svg.select.js "^2.1.2"
svg.select.js@^2.1.2:
version "2.1.2"
resolved "https://registry.yarnpkg.com/svg.select.js/-/svg.select.js-2.1.2.tgz#e41ce13b1acff43a7441f9f8be87a2319c87be73"
integrity sha512-tH6ABEyJsAOVAhwcCjF8mw4crjXSI1aa7j2VQR8ZuJ37H2MBUbyeqYr5nEO7sSN3cy9AR9DUwNg0t/962HlDbQ==
dependencies:
svg.js "^2.2.5"
svg.select.js@^3.0.1:
version "3.0.1"
resolved "https://registry.yarnpkg.com/svg.select.js/-/svg.select.js-3.0.1.tgz#a4198e359f3825739226415f82176a90ea5cc917"
integrity sha512-h5IS/hKkuVCbKSieR9uQCj9w+zLHoPh+ce19bBYyqF53g6mnPB8sAtIbe1s9dh2S2fCmYX2xel1Ln3PJBbK4kw==
dependencies:
svg.js "^2.6.5"
svgo@^1.0.0:
version "1.3.2"
resolved "https://registry.yarnpkg.com/svgo/-/svgo-1.3.2.tgz#b6dc511c063346c9e415b81e43401145b96d4167"
@ -13441,11 +13374,6 @@ vm-browserify@^1.0.1:
resolved "https://registry.yarnpkg.com/vm-browserify/-/vm-browserify-1.1.2.tgz#78641c488b8e6ca91a75f511e7a3b32a86e5dda0"
integrity sha512-2ham8XPWTONajOR0ohOKOHXkm3+gaBmGut3SRuu75xLd/RRaY6vqgh8NBYYk7+RW3u5AtzPQZG8F10LHkl0lAQ==
vue-apexcharts@^1.6.2:
version "1.6.2"
resolved "https://registry.yarnpkg.com/vue-apexcharts/-/vue-apexcharts-1.6.2.tgz#0547826067f97e8ea67ca9423e524eb6669746ad"
integrity sha512-9HS3scJwWgKjmkcWIf+ndNDR0WytUJD8Ju0V2ZYcjYtlTLwJAf2SKUlBZaQTkDmwje/zMgulvZRi+MXmi+WkKw==
vue-apollo@^3.0.7:
version "3.0.7"
resolved "https://registry.yarnpkg.com/vue-apollo/-/vue-apollo-3.0.7.tgz#97a031d45641faa4888a6d5a7f71c40834359704"