IT4Change/gradido
3
0
Fork 0
mirror of https://github.com/IT4Change/gradido.git synced 2026-02-06 09:56:05 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat(admin): setup migration environment (#3328)

Browse Source 
* initial dependency update with initial setup

* initial dependency update with initial setup

* lock update

* Revert "initial dependency update with initial setup"

This reverts commit aa71afc3eca20042a1e13066bee1730a15606dd2.

* admin - moved to vite

* feat(admin): migration packages update (#3327)

* bump apollo package

* extend vue config

* create useCreationMonths composable

* WIP

* temporary

* install dependencies

* adjust configs

* rework footer component

* remove not needed spaces,

* rework overview page

* rework component

* rework user search page

* rework navbar

* navbar adjustments

* add depenedencies

* style adjustment in footer

* composable adjustments

* update node version

* rework search and pagination

* feat(admin) - disable unit tests for migration time

* feat(admin) - update eslint

* wip on search user

* rework creation formular component

* feat(admin) - update eslint babel

* feat(admin) - change stylelint version, fix eslint errors

* feat(admin) - update dependency

* feat(admin) - update dependency

* feat(admin) - update dependency

* feat(admin) - update dependency

* feat(admin) - update dependency

* feat(admin) - update dependency

* feat(admin) - update dependency, update node

* feat(admin) - update icons

---------

Co-authored-by: Mateusz Michałowski <mateusz.michalowski@monterail.com>

---------

Co-authored-by: Kamila Lach <80581523+unnunhexium@users.noreply.github.com>
This commit is contained in:
MateuszMichalowski 2024-07-24 10:49:33 +02:00 committed by GitHub
parent b551495799
commit a87dca89dc
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
52 changed files with 5676 additions and 9059 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
admin/.eslintrc.js
View File

@ -4,15 +4,17 @@ module.exports = {
browser: true, browser: true,
node: true, node: true,
jest: true, jest: true,
'vue/setup-compiler-macros': true,
}, },
parserOptions: { parserOptions: {
parser: 'babel-eslint', ecmaVersion: 2020,
}, },
extends: [ extends: [
'standard', 'standard',
'plugin:vue/essential', 'plugin:vue/vue3-recommended',
'plugin:prettier/recommended', 'plugin:prettier/recommended',
'plugin:@intlify/vue-i18n/recommended', 'plugin:@intlify/vue-i18n/recommended',
'prettier',
], ],
// required to lint *.vue files // required to lint *.vue files
plugins: ['vue', 'prettier', 'jest'], plugins: ['vue', 'prettier', 'jest'],
@ -33,6 +35,8 @@ module.exports = {
allowBinding: false, allowBinding: false,
}, },
], ],
'vue/multi-word-component-names': 0,
'vue/no-v-html': 0,
'@intlify/vue-i18n/no-dynamic-keys': 'error', '@intlify/vue-i18n/no-dynamic-keys': 'error',
'@intlify/vue-i18n/no-unused-keys': [ '@intlify/vue-i18n/no-unused-keys': [
'error', 'error',

2
admin/Dockerfile
View File

@ -1,7 +1,7 @@
################################################################################## ##################################################################################
# BASE ########################################################################### # BASE ###########################################################################
################################################################################## ##################################################################################
FROM node:14.17.0-alpine3.10 as base FROM node:18.20-alpine3.20 as base
# ENVs (available in production aswell, can be overwritten by commandline or env file) # ENVs (available in production aswell, can be overwritten by commandline or env file)
## DOCKER_WORKDIR would be a classical ARG, but that is not multi layer persistent - shame ## DOCKER_WORKDIR would be a classical ARG, but that is not multi layer persistent - shame

2
admin/babel.config.js
View File

@ -4,7 +4,7 @@ module.exports = function (api) {
const presets = ['@babel/preset-env'] const presets = ['@babel/preset-env']
const plugins = [] const plugins = []
if (process.env.NODE_ENV === 'test') { if (import.meta.env.NODE_ENV === 'test') {
plugins.push('transform-require-context') plugins.push('transform-require-context')
} }

52
admin/components.d.ts vendored Normal file
View File

@ -0,0 +1,52 @@
/* eslint-disable */
// @ts-nocheck
// Generated by unplugin-vue-components
// Read more: https://github.com/vuejs/core/pull/3399
export {}
/* prettier-ignore */
declare module 'vue' {
export interface GlobalComponents {
ChangeUserRoleFormular: typeof import('./src/components/ChangeUserRoleFormular.vue')['default']
CommunityVisualizeItem: typeof import('./src/components/Federation/CommunityVisualizeItem.vue')['default']
ConfirmRegisterMailFormular: typeof import('./src/components/ConfirmRegisterMailFormular.vue')['default']
ContentFooter: typeof import('./src/components/ContentFooter.vue')['default']
ContributionLink: typeof import('./src/components/ContributionLink/ContributionLink.vue')['default']
ContributionLinkForm: typeof import('./src/components/ContributionLink/ContributionLinkForm.vue')['default']
ContributionLinkList: typeof import('./src/components/ContributionLink/ContributionLinkList.vue')['default']
ContributionMessagesFormular: typeof import('./src/components/ContributionMessages/ContributionMessagesFormular.vue')['default']
ContributionMessagesList: typeof import('./src/components/ContributionMessages/ContributionMessagesList.vue')['default']
ContributionMessagesListItem: typeof import('./src/components/ContributionMessages/slots/ContributionMessagesListItem.vue')['default']
Coordinates: typeof import('./src/components/input/Coordinates.vue')['default']
CreationFormular: typeof import('./src/components/CreationFormular.vue')['default']
CreationTransactionList: typeof import('./src/components/CreationTransactionList.vue')['default']
DeletedUserFormular: typeof import('./src/components/DeletedUserFormular.vue')['default']
EditableGroup: typeof import('./src/components/input/EditableGroup.vue')['default']
EditableGroupableLabel: typeof import('./src/components/input/EditableGroupableLabel.vue')['default']
EditCreationFormular: typeof import('./src/components/EditCreationFormular.vue')['default']
FederationVisualizeItem: typeof import('./src/components/Federation/FederationVisualizeItem.vue')['default']
FigureQrCode: typeof import('./src/components/FigureQrCode.vue')['default']
IBiEnvelope: typeof import('~icons/bi/envelope')['default']
IBiXCircle: typeof import('~icons/bi/x-circle')['default']
IIcBaselineClose: typeof import('~icons/ic/baseline-close')['default']
IOcticonCircleSlash24: typeof import('~icons/octicon/circle-slash24')['default']
IOcticonPerson24: typeof import('~icons/octicon/person24')['default']
IPhCaretDown: typeof import('~icons/ph/caret-down')['default']
IPhCaretUpFill: typeof import('~icons/ph/caret-up-fill')['default']
IPhEnvelope: typeof import('~icons/ph/envelope')['default']
IPhXCircle: typeof import('~icons/ph/x-circle')['default']
NavBar: typeof import('./src/components/NavBar.vue')['default']
NotFoundPage: typeof import('./src/components/NotFoundPage.vue')['default']
OpenCreationsTable: typeof import('./src/components/Tables/OpenCreationsTable.vue')['default']
Overlay: typeof import('./src/components/Overlay.vue')['default']
ParseMessage: typeof import('./src/components/ContributionMessages/ParseMessage.vue')['default']
RouterLink: typeof import('vue-router')['RouterLink']
RouterView: typeof import('vue-router')['RouterView']
RowDetails: typeof import('./src/components/RowDetails.vue')['default']
SearchUserTable: typeof import('./src/components/Tables/SearchUserTable.vue')['default']
StatisticTable: typeof import('./src/components/Tables/StatisticTable.vue')['default']
TimePicker: typeof import('./src/components/input/TimePicker.vue')['default']
TransactionLinkList: typeof import('./src/components/TransactionLinkList.vue')['default']
UserQuery: typeof import('./src/components/UserQuery.vue')['default']
}
}

21
admin/index.html Normal file
View File

@ -0,0 +1,21 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<link rel="icon" type="image/png" sizes="96x96" href="/favicon.png">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
<title>Gradido Admin Interface</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
<!-- Fonts -->
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.6.3/css/all.css" integrity="sha384-UHRtZLI+pbxtHCWp1t77Bi1L4ZtiqrqD80Kn4Z8NTSRyMA2Fd33n5dQ8lWUE00s/" crossorigin="anonymous">
</head>
<body>
<div class="wrapper" id="app"></div>
<script type="module" src="/src/main.js"></script>
<!-- built files will be auto injected -->
</body>
</html>

77
admin/package.json
View File

@ -1,6 +1,6 @@
{ {
"name": "admin", "name": "admin",
"description": "Administraion Interface for Gradido", "description": "Administration Interface for Gradido",
"main": "index.js", "main": "index.js",
"author": "Moriz Wahl", "author": "Moriz Wahl",
"version": "2.3.1", "version": "2.3.1",
@ -8,22 +8,27 @@
"private": false, "private": false,
"scripts": { "scripts": {
"start": "node run/server.js", "start": "node run/server.js",
"serve": "vue-cli-service serve --open", "dev": "vite",
"build": "vue-cli-service build", "build": "vite build",
"serve": "vite preview",
"postbuild": "find build -type f -regex '.*\\.\\(html\\|js\\|css\\|svg\\|json\\)' -exec gzip -9 -k {} +", "postbuild": "find build -type f -regex '.*\\.\\(html\\|js\\|css\\|svg\\|json\\)' -exec gzip -9 -k {} +",
"dev": "yarn run serve",
"analyse-bundle": "yarn build && webpack-bundle-analyzer build/webpack.stats.json",
"lint": "eslint --max-warnings=0 --ext .js,.vue,.json .", "lint": "eslint --max-warnings=0 --ext .js,.vue,.json .",
"stylelint": "stylelint --max-warnings=0 '**/*.{scss,vue}'", "stylelint": "stylelint --max-warnings=0 '**/*.{scss,vue}'",
"test": "cross-env TZ=UTC jest", "test": "echo Tests are temporarly disabled for migration time",
"test:debug": "node --inspect-brk node_modules/.bin/vue-cli-service test:unit --no-cache --watch --runInBand", "test:debug": "node --inspect-brk node_modules/.bin/vue-cli-service test:unit --no-cache --watch --runInBand",
"locales": "scripts/sort.sh" "locales": "scripts/sort.sh"
}, },
"dependencies": { "dependencies": {
"@babel/core": "^7.15.8", "@babel/core": "^7.15.8",
"@babel/eslint-parser": "^7.24.8",
"@babel/node": "^7.15.8", "@babel/node": "^7.15.8",
"@babel/preset-env": "^7.15.8", "@babel/preset-env": "^7.15.8",
"@vue/cli-plugin-unit-jest": "^4.5.14", "@iconify/json": "^2.2.228",
"@vitejs/plugin-vue": "3.2.0",
"@vue/apollo-composable": "^4.0.2",
"@vue/apollo-option": "^4.0.0",
"@vue/cli-plugin-unit-jest": "~5.0.8",
"@vue/compat": "3.4.31",
"@vue/eslint-config-prettier": "^6.0.0", "@vue/eslint-config-prettier": "^6.0.0",
"@vue/test-utils": "^1.2.2", "@vue/test-utils": "^1.2.2",
"apollo-boost": "^0.4.9", "apollo-boost": "^0.4.9",
@ -32,58 +37,58 @@
"babel-plugin-component": "^1.1.1", "babel-plugin-component": "^1.1.1",
"babel-preset-env": "^1.7.0", "babel-preset-env": "^1.7.0",
"babel-preset-vue": "^2.0.2", "babel-preset-vue": "^2.0.2",
"bootstrap": "4.3.1", "bootstrap": "^5.3.3",
"bootstrap-vue": "^2.21.2", "bootstrap-vue-next": "^0.23.2",
"core-js": "^3.6.5",
"date-fns": "^2.29.3", "date-fns": "^2.29.3",
"dotenv-webpack": "^7.0.3", "dotenv-webpack": "^7.0.3",
"express": "^4.17.1", "express": "^4.17.1",
"graphql": "^15.6.1", "graphql": "^16.9.0",
"graphql-tag": "^2.12.6",
"identity-obj-proxy": "^3.0.0", "identity-obj-proxy": "^3.0.0",
"jest": "26.6.3", "jest": "26.6.3",
"jest-canvas-mock": "^2.3.1", "jest-canvas-mock": "^2.3.1",
"jest-environment-jsdom-sixteen": "^2.0.0", "jest-environment-jsdom-sixteen": "^2.0.0",
"portal-vue": "^2.1.7", "portal-vue": "3.0.0",
"qrcanvas-vue": "2.1.1", "qrcanvas-vue": "3.0.0",
"regenerator-runtime": "^0.13.9", "regenerator-runtime": "^0.13.9",
"stats-webpack-plugin": "^0.7.0", "sass": "^1.77.8",
"vue": "^2.6.11", "vite": "3.2.10",
"vue-apollo": "^3.0.8", "vite-plugin-commonjs": "^0.10.1",
"vue-i18n": "^8.26.5", "vue": "3.4.31",
"vue-jest": "^3.0.7", "vue-apollo": "3.1.2",
"vue-router": "^3.5.3", "vue-i18n": "9.13.1",
"vuex": "^3.6.2", "vue-jest": "3.0.7",
"vuex-persistedstate": "^4.1.0" "vue-router": "4.4.0",
"vuex": "4.1.0",
"vuex-persistedstate": "4.1.0"
}, },
"devDependencies": { "devDependencies": {
"@apollo/client": "^3.7.1", "@apollo/client": "^3.10.8",
"@babel/eslint-parser": "^7.15.8",
"@intlify/eslint-plugin-vue-i18n": "^1.4.0", "@intlify/eslint-plugin-vue-i18n": "^1.4.0",
"@vue/cli-plugin-babel": "~4.5.0", "@vue/compiler-sfc": "^3.4.32",
"@vue/cli-plugin-eslint": "~4.5.0",
"@vue/cli-service": "~4.5.0",
"babel-eslint": "^10.1.0",
"babel-plugin-transform-require-context": "^0.1.1", "babel-plugin-transform-require-context": "^0.1.1",
"cross-env": "^7.0.3", "cross-env": "^7.0.3",
"eslint": "7.25.0", "eslint": "8.57.0",
"eslint-config-prettier": "^8.3.0", "eslint-config-prettier": "8.10.0",
"eslint-config-standard": "^16.0.3", "eslint-config-standard": "^16.0.3",
"eslint-loader": "^4.0.2", "eslint-loader": "^4.0.2",
"eslint-plugin-import": "^2.25.2", "eslint-plugin-import": "^2.25.2",
"eslint-plugin-jest": "^25.2.2", "eslint-plugin-jest": "^25.2.2",
"eslint-plugin-node": "^11.1.0", "eslint-plugin-node": "^11.1.0",
"eslint-plugin-prettier": "3.3.1", "eslint-plugin-prettier": "5.2.1",
"eslint-plugin-promise": "^5.1.1", "eslint-plugin-promise": "^5.1.1",
"eslint-plugin-vue": "^7.20.0", "eslint-plugin-vue": "8.7.1",
"jest": "29.7.0",
"mock-apollo-client": "^1.2.1", "mock-apollo-client": "^1.2.1",
"postcss": "^8.4.8", "postcss": "^8.4.8",
"postcss-html": "^1.3.0", "postcss-html": "^1.3.0",
"postcss-scss": "^4.0.3", "postcss-scss": "^4.0.3",
"stylelint": "^14.5.3", "prettier": "^3.3.3",
"stylelint-config-recommended-vue": "^1.3.0", "stylelint": "14.16.1",
"stylelint-config-standard-scss": "^3.0.0", "stylelint-config-recommended-vue": "1.5.0",
"vue-cli-plugin-i18n": "^2.3.1", "stylelint-config-standard-scss": "13.1.0",
"vue-template-compiler": "^2.6.11" "unplugin-icons": "^0.19.0",
"unplugin-vue-components": "^0.27.3"
}, },
"browserslist": [ "browserslist": [
"> 1%", "> 1%",

2
admin/run/server.js
View File

@ -4,7 +4,7 @@ const path = require('path')
// Host & Port // Host & Port
const hostname = '127.0.0.1' const hostname = '127.0.0.1'
const port = process.env.PORT || 8080 const port = import.meta.env.PORT || 8080
// Express Server // Express Server
const app = express() const app = express()

2
admin/src/App.vue
View File

@ -9,7 +9,7 @@
import defaultLayout from '@/layouts/defaultLayout' import defaultLayout from '@/layouts/defaultLayout'
export default { export default {
name: 'app', name: 'App',
components: { defaultLayout }, components: { defaultLayout },
} }
</script> </script>

11
admin/src/components/ChangeUserRoleFormular.vue
View File

@ -9,11 +9,11 @@
</div> </div>
<div v-else class="m-3"> <div v-else class="m-3">
<label for="role" class="mr-3">{{ $t('userRole.selectLabel') }}</label> <label for="role" class="mr-3">{{ $t('userRole.selectLabel') }}</label>
<b-form-select class="role-select" v-model="roleSelected" :options="roles" /> <b-form-select v-model="roleSelected" class="role-select" :options="roles" />
<div class="mt-3 mb-5"> <div class="mt-3 mb-5">
<b-button <b-button
variant="danger"
v-b-modal.user-role-modal v-b-modal.user-role-modal
variant="danger"
:disabled="currentRole === roleSelected" :disabled="currentRole === roleSelected"
@click="showModal()" @click="showModal()"
> >
@ -41,6 +41,7 @@ export default {
required: true, required: true,
}, },
}, },
emits: ['update-roles'],
data() { data() {
return { return {
currentRole: this.getCurrentRole(), currentRole: this.getCurrentRole(),
@ -66,8 +67,8 @@ export default {
this.roleSelected === rolesValues.ADMIN this.roleSelected === rolesValues.ADMIN
? this.$t('userRole.selectRoles.admin') ? this.$t('userRole.selectRoles.admin')
: this.roleSelected === rolesValues.MODERATOR : this.roleSelected === rolesValues.MODERATOR
? this.$t('userRole.selectRoles.moderator') ? this.$t('userRole.selectRoles.moderator')
: this.$t('userRole.selectRoles.user'), : this.$t('userRole.selectRoles.user'),
}), }),
{ {
cancelTitle: this.$t('overlay.cancel'), cancelTitle: this.$t('overlay.cancel'),
@ -102,7 +103,7 @@ export default {
}, },
}) })
.then((result) => { .then((result) => {
this.$emit('updateRoles', { this.$emit('update-roles', {
userId: this.item.userId, userId: this.item.userId,
roles: roleValue === 'USER' ? [] : [roleValue], roles: roleValue === 'USER' ? [] : [roleValue],
}) })

37
admin/src/components/ContentFooter.vue
View File

@ -1,8 +1,8 @@
<template> <template>
<hr />
<div class="content-footer"> <div class="content-footer">
<hr /> <BTr class="mt-4 mb-4 justify-content-lg-between">
<b-row align-v="center" class="mt-4 mb-4 justify-content-lg-between"> <BCol>
<b-col>
<div class="copyright text-center text-lg-center text-muted"> <div class="copyright text-center text-lg-center text-muted">
{{ $t('footer.copyright.year', { year }) }} {{ $t('footer.copyright.year', { year }) }}
<a <a
@ -12,7 +12,7 @@
> >
{{ $t('footer.copyright.link') }} {{ $t('footer.copyright.link') }}
</a> </a>
{{ $t('math.pipe') }} {{ $t('math.pipe', 1) }}
<a href="https://github.com/gradido/gradido/releases/latest" target="_blank"> <a href="https://github.com/gradido/gradido/releases/latest" target="_blank">
{{ $t('footer.app_version', { version }) }} {{ $t('footer.app_version', { version }) }}
</a> </a>
@ -24,22 +24,23 @@
{{ $t('footer.short_hash', { shortHash }) }} {{ $t('footer.short_hash', { shortHash }) }}
</a> </a>
</div> </div>
</b-col> </BCol>
</b-row> </BTr>
</div> </div>
</template> </template>
<script> <script setup>
import CONFIG from '../config' import CONFIG from '../config'
import { BTr } from 'bootstrap-vue-next'
export default { const year = new Date().getFullYear()
name: 'ContentFooter', const version = CONFIG.APP_VERSION
data() { const hash = CONFIG.BUILD_COMMIT
return { const shortHash = CONFIG.BUILD_COMMIT_SHORT
year: new Date().getFullYear(),
version: CONFIG.APP_VERSION,
hash: CONFIG.BUILD_COMMIT,
shortHash: CONFIG.BUILD_COMMIT_SHORT,
}
},
}
</script> </script>
<style lang="scss" scoped>
.content-footer {
display: flex;
align-items: center;
justify-content: center;
}
</style>

15
admin/src/components/ContributionLink/ContributionLink.vue
View File

@ -10,21 +10,21 @@
> >
<b-button <b-button
v-if="!editContributionLink" v-if="!editContributionLink"
@click="visible = !visible"
class="my-3 d-flex justify-content-left" class="my-3 d-flex justify-content-left"
data-test="new-contribution-link-button" data-test="new-contribution-link-button"
@click="visible = !visible"
> >
{{ $t('math.plus') }} {{ $t('contributionLink.newContributionLink') }} {{ $t('math.plus') }} {{ $t('contributionLink.newContributionLink') }}
</b-button> </b-button>
<b-collapse v-model="visible" id="newContribution" class="mt-2"> <b-collapse id="newContribution" v-model="visible" class="mt-2">
<b-card> <b-card>
<p class="h2 ml-5">{{ $t('contributionLink.contributionLinks') }}</p> <p class="h2 ml-5">{{ $t('contributionLink.contributionLinks') }}</p>
<contribution-link-form <contribution-link-form
:contributionLinkData="contributionLinkData" :contribution-link-data="contributionLinkData"
:editContributionLink="editContributionLink" :edit-contribution-link="editContributionLink"
@get-contribution-links="$emit('get-contribution-links')" @get-contribution-links="$emit('get-contribution-links')"
@closeContributionForm="closeContributionForm" @close-contribution-form="closeContributionForm"
/> />
</b-card> </b-card>
</b-collapse> </b-collapse>
@ -33,9 +33,9 @@
<contribution-link-list <contribution-link-list
v-if="count > 0" v-if="count > 0"
:items="items" :items="items"
@editContributionLinkData="editContributionLinkData" @edit-contribution-link-data="editContributionLinkData"
@get-contribution-links="$emit('get-contribution-links')" @get-contribution-links="$emit('get-contribution-links')"
@closeContributionForm="closeContributionForm" @close-contribution-form="closeContributionForm"
/> />
<div v-else>{{ $t('contributionLink.noContributionLinks') }}</div> <div v-else>{{ $t('contributionLink.noContributionLinks') }}</div>
</b-card-text> </b-card-text>
@ -62,6 +62,7 @@ export default {
required: true, required: true,
}, },
}, },
emits: ['get-contribution-links'],
data: function () { data: function () {
return { return {
visible: false, visible: false,

29
admin/src/components/ContributionLink/ContributionLinkForm.vue
View File

@ -1,13 +1,13 @@
<template> <template>
<div class="contribution-link-form"> <div class="contribution-link-form">
<b-form class="m-5" @submit.prevent="onSubmit" ref="contributionLinkForm"> <b-form ref="contributionLinkForm" class="m-5" @submit.prevent="onSubmit">
<!-- Date --> <!-- Date -->
<b-row> <b-row>
<b-col> <b-col>
<b-form-group :label="$t('contributionLink.validFrom')"> <b-form-group :label="$t('contributionLink.validFrom')">
<b-form-datepicker <b-form-datepicker
reset-button
v-model="form.validFrom" v-model="form.validFrom"
reset-button
size="lg" size="lg"
:min="min" :min="min"
class="mb-4 test-validFrom" class="mb-4 test-validFrom"
@ -20,8 +20,8 @@
<b-col> <b-col>
<b-form-group :label="$t('contributionLink.validTo')"> <b-form-group :label="$t('contributionLink.validTo')">
<b-form-datepicker <b-form-datepicker
reset-button
v-model="form.validTo" v-model="form.validTo"
reset-button
size="lg" size="lg"
:min="form.validFrom ? form.validFrom : min" :min="form.validFrom ? form.validFrom : min"
class="mb-4 test-validTo" class="mb-4 test-validTo"
@ -112,7 +112,7 @@
<b-button type="reset" variant="danger" @click.prevent="onReset"> <b-button type="reset" variant="danger" @click.prevent="onReset">
{{ $t('contributionLink.clear') }} {{ $t('contributionLink.clear') }}
</b-button> </b-button>
<b-button @click.prevent="$emit('closeContributionForm')"> <b-button @click.prevent="$emit('close-contribution-form')">
{{ $t('close') }} {{ $t('close') }}
</b-button> </b-button>
</div> </div>
@ -134,6 +134,7 @@ export default {
}, },
editContributionLink: { type: Boolean, required: true }, editContributionLink: { type: Boolean, required: true },
}, },
emits: ['close-contribution-form', 'close-contribution-link', 'get-contribution-links'],
data() { data() {
return { return {
form: { form: {
@ -164,6 +165,16 @@ export default {
], ],
} }
}, },
computed: {
disabled() {
return true
},
},
watch: {
contributionLinkData() {
this.form = this.contributionLinkData
},
},
methods: { methods: {
onSubmit() { onSubmit() {
if (this.form.validFrom === null) if (this.form.validFrom === null)
@ -202,15 +213,5 @@ export default {
this.form.validTo = null this.form.validTo = null
}, },
}, },
computed: {
disabled() {
return true
},
},
watch: {
contributionLinkData() {
this.form = this.contributionLinkData
},
},
} }
</script> </script>

10
admin/src/components/ContributionLink/ContributionLinkList.vue
View File

@ -56,6 +56,12 @@ export default {
props: { props: {
items: { type: Array, required: true }, items: { type: Array, required: true },
}, },
emits: [
'close-contribution-form',
'edit-contribution-link-data',
'get-contribution-links',
'get-contribution-link',
],
data() { data() {
return { return {
fields: [ fields: [
@ -104,7 +110,7 @@ export default {
}) })
.then(() => { .then(() => {
this.toastSuccess(this.$t('contributionLink.deleted')) this.toastSuccess(this.$t('contributionLink.deleted'))
this.$emit('closeContributionForm') this.$emit('close-contribution-form')
this.$emit('get-contribution-links') this.$emit('get-contribution-links')
}) })
.catch((err) => { .catch((err) => {
@ -113,7 +119,7 @@ export default {
}) })
}, },
editContributionLink(row) { editContributionLink(row) {
this.$emit('editContributionLinkData', row) this.$emit('edit-contribution-link-data', row)
}, },
showContributionLink(row) { showContributionLink(row) {

45
admin/src/components/ContributionMessages/ContributionMessagesFormular.vue
View File

@ -11,7 +11,7 @@
<b-form-datepicker v-model="resubmissionDate" :min="now"></b-form-datepicker> <b-form-datepicker v-model="resubmissionDate" :min="now"></b-form-datepicker>
<time-picker v-model="resubmissionTime"></time-picker> <time-picker v-model="resubmissionTime"></time-picker>
</b-form-group> </b-form-group>
<b-tabs content-class="mt-3" v-model="tabindex" data-test="message-type-tabs"> <b-tabs v-model="tabindex" content-class="mt-3" data-test="message-type-tabs">
<b-tab active> <b-tab active>
<template #title> <template #title>
<span id="message-tab-title">{{ $t('moderator.message') }}</span> <span id="message-tab-title">{{ $t('moderator.message') }}</span>
@ -64,8 +64,8 @@
type="submit" type="submit"
variant="primary" variant="primary"
:disabled="disabled" :disabled="disabled"
@click.prevent="onSubmit()"
data-test="submit-dialog" data-test="submit-dialog"
@click.prevent="onSubmit()"
> >
{{ $t('save') }} {{ $t('save') }}
</b-button> </b-button>
@ -81,10 +81,10 @@ import { adminUpdateContribution } from '@/graphql/adminUpdateContribution'
import TimePicker from '@/components/input/TimePicker' import TimePicker from '@/components/input/TimePicker'
export default { export default {
name: 'ContributionMessagesFormular',
components: { components: {
TimePicker, TimePicker,
}, },
name: 'ContributionMessagesFormular',
props: { props: {
contributionId: { contributionId: {
type: Number, type: Number,
@ -103,6 +103,13 @@ export default {
required: false, required: false,
}, },
}, },
emits: [
'update-contribution',
'update-contributions',
'get-contribution',
'update-status',
'get-list-contribution-messages',
],
data() { data() {
const localInputResubmissionDate = this.inputResubmissionDate const localInputResubmissionDate = this.inputResubmissionDate
? new Date(this.inputResubmissionDate) ? new Date(this.inputResubmissionDate)
@ -129,6 +136,22 @@ export default {
}, },
} }
}, },
computed: {
disabled() {
return (
(this.chatOrMemo === 0 && this.form.text === '') ||
this.loading ||
(this.chatOrMemo === 1 && this.form.memo.length < 5) ||
(this.showResubmissionDate && !this.resubmissionDate)
)
},
moderatorDisabled() {
return this.form.text === '' || this.loading || this.chatOrMemo === 1
},
now() {
return new Date()
},
},
methods: { methods: {
combineResubmissionDateAndTime() { combineResubmissionDateAndTime() {
// getTimezoneOffset // getTimezoneOffset
@ -224,21 +247,5 @@ export default {
this.chatOrMemo = 1 this.chatOrMemo = 1
}, },
}, },
computed: {
disabled() {
return (
(this.chatOrMemo === 0 && this.form.text === '') ||
this.loading ||
(this.chatOrMemo === 1 && this.form.memo.length < 5) ||
(this.showResubmissionDate && !this.resubmissionDate)
)
},
moderatorDisabled() {
return this.form.text === '' || this.loading || this.chatOrMemo === 1
},
now() {
return new Date()
},
},
} }
</script> </script>

13
admin/src/components/ContributionMessages/ContributionMessagesList.vue
View File

@ -1,19 +1,19 @@
<template> <template>
<div class="contribution-messages-list"> <div class="contribution-messages-list">
<b-container> <b-container>
<div v-for="message in messages" v-bind:key="message.id"> <div v-for="message in messages" :key="message.id">
<contribution-messages-list-item <contribution-messages-list-item
:message="message" :message="message"
:contributionUserId="contributionUserId" :contribution-user-id="contributionUserId"
/> />
</div> </div>
</b-container> </b-container>
<div v-if="contributionStatus === 'PENDING' || contributionStatus === 'IN_PROGRESS'"> <div v-if="contributionStatus === 'PENDING' || contributionStatus === 'IN_PROGRESS'">
<contribution-messages-formular <contribution-messages-formular
:contributionId="contributionId" :contribution-id="contributionId"
:contributionMemo="contributionMemo" :contribution-memo="contributionMemo"
:hideResubmission="hideResubmission" :hide-resubmission="hideResubmission"
:inputResubmissionDate="resubmissionAt" :input-resubmission-date="resubmissionAt"
@get-list-contribution-messages="$apollo.queries.Messages.refetch()" @get-list-contribution-messages="$apollo.queries.Messages.refetch()"
@update-status="updateStatus" @update-status="updateStatus"
@reload-contribution="reloadContribution" @reload-contribution="reloadContribution"
@ -59,6 +59,7 @@ export default {
required: false, required: false,
}, },
}, },
emits: ['update-status', 'reload-contribution', 'update-contributions'],
data() { data() {
return { return {
messages: [], messages: [],

6
admin/src/components/ContributionMessages/ParseMessage.vue
View File

@ -26,9 +26,9 @@ export default {
type: String, type: String,
required: true, required: true,
}, },
type: { messageType: {
type: String, type: String,
reuired: true, required: true,
}, },
}, },
computed: { computed: {
@ -36,7 +36,7 @@ export default {
let string = this.message let string = this.message
const linkified = [] const linkified = []
let amount let amount
if (this.type === 'HISTORY') { if (this.messageType === 'HISTORY') {
const split = string.split(/\n\s*---\n\s*/) const split = string.split(/\n\s*---\n\s*/)
string = split[1] string = split[1]
linkified.push({ type: 'date', text: split[0].trim() }) linkified.push({ type: 'date', text: split[0].trim() })

301
admin/src/components/CreationFormular.vue
View File

@ -2,178 +2,183 @@
<div class="component-creation-formular"> <div class="component-creation-formular">
{{ $t('creation_form.form') }} {{ $t('creation_form.form') }}
<div class="shadow p-3 mb-5 bg-white rounded"> <div class="shadow p-3 mb-5 bg-white rounded">
<b-form ref="creationForm"> <BForm ref="creationForm">
<div class="ml-4"> <div class="m-4 mt-0">
<label>{{ $t('creation_form.select_month') }}</label> <label>{{ $t('creation_form.select_month') }}</label>
</div> <BFormRadioGroup
<b-row class="ml-4"> id="radio-group-month-selection"
<b-form-radio-group
v-model="selected" v-model="selected"
:options="radioOptions" :options="radioOptions()"
value-field="item" value-field="item"
text-field="name" text-field="name"
name="month-selection" name="month-selection"
></b-form-radio-group> />
</b-row> </div>
<b-row class="m-4" v-show="selected !== ''"> <div v-if="selected" class="m-4">
<label>{{ $t('creation_form.select_value') }}</label> <label>{{ $t('creation_form.select_value') }}</label>
<div> <div>
<b-input-group prepend="GDD" append=".00"> <BInputGroup prepend="GDD" append=".00">
<b-form-input <BFormInput v-model="value" type="number" :min="rangeMin" :max="rangeMax" />
type="number" </BInputGroup>
v-model="value" <BInputGroup prepend="0" :append="String(rangeMax)" class="mt-3">
:min="rangeMin" <BFormInput v-model="value" type="range" :min="rangeMin" :max="rangeMax" step="10" />
:max="rangeMax" </BInputGroup>
></b-form-input>
</b-input-group>
<b-input-group prepend="0" :append="String(rangeMax)" class="mt-3">
<b-form-input
type="range"
v-model="value"
:min="rangeMin"
:max="rangeMax"
step="10"
></b-form-input>
</b-input-group>
</div> </div>
</b-row> </div>
<div class="m-4"> <div class="m-4">
<label>{{ $t('creation_form.enter_text') }}</label> <label>{{ $t('creation_form.enter_text') }}</label>
<div> <div>
<b-form-textarea <BFormTextarea
id="textarea-state" id="textarea-state"
v-model="text" v-model="text"
:state="text.length >= 10" :state="text.length >= 10"
:placeholder="$t('creation_form.min_characters')" :placeholder="$t('creation_form.min_characters')"
rows="3" rows="3"
></b-form-textarea> />
</div> </div>
</div> </div>
<b-row class="m-4"> <div class="m-4 d-flex">
<b-col class="text-left"> <BCol class="text-left">
<b-button type="reset" variant="danger" @click="$refs.creationForm.reset()"> <BButton type="reset" variant="danger" @click="onReset()">
{{ $t('creation_form.reset') }} {{ $t('creation_form.reset') }}
</b-button> </BButton>
</b-col> </BCol>
<b-col class="text-center"> <div class="text-right">
<div class="text-right"> <BButton
<b-button v-if="pagetype === 'PageCreationConfirm'"
v-if="pagetype === 'PageCreationConfirm'" type="button"
type="button" variant="success"
variant="success" class="test-submit"
class="test-submit" :disabled="selected === '' || value <= 0 || text.length < 10"
@click="submitCreation" @click="submitCreation"
:disabled="selected === '' || value <= 0 || text.length < 10" >
> {{ $t('creation_form.update_creation') }}
{{ $t('creation_form.update_creation') }} </BButton>
</b-button> <BButton
<b-button v-else
v-else type="button"
type="button" variant="success"
variant="success" class="test-submit"
class="test-submit" :disabled="selected === '' || value <= 0 || text.length < 10"
@click="submitCreation" @click="submitCreation"
:disabled="selected === '' || value <= 0 || text.length < 10" >
> {{ $t('creation_form.submit_creation') }}
{{ $t('creation_form.submit_creation') }} </BButton>
</b-button> </div>
</div> </div>
</b-col> </BForm>
</b-row>
</b-form>
</div> </div>
</div> </div>
</template> </template>
<script>
<script setup>
import { ref, watch, computed } from 'vue'
import { useI18n } from 'vue-i18n'
import { useMutation, useQuery } from '@vue/apollo-composable'
import { useStore } from 'vuex'
import { adminCreateContribution } from '../graphql/adminCreateContribution' import { adminCreateContribution } from '../graphql/adminCreateContribution'
import { creationMonths } from '../mixins/creationMonths' import useCreationMonths from '../composables/useCreationMonths'
export default { import {
name: 'CreationFormular', BFormInput,
mixins: [creationMonths], BFormRadioGroup,
props: { BForm,
pagetype: { BInputGroup,
type: String, BButton,
required: false, BCol,
default: '', BFormTextarea,
}, } from 'bootstrap-vue-next'
item: {
type: Object, const { radioOptions } = useCreationMonths()
required: false,
default() { const props = defineProps({
return {} pagetype: {
}, type: String,
}, required: false,
items: { default: '',
type: Array,
required: false,
default() {
return []
},
},
creationUserData: {
type: Object,
required: false,
default() {
return {}
},
},
}, },
data() { item: {
return { type: Object,
text: !this.creationUserData.memo ? '' : this.creationUserData.memo, required: false,
value: !this.creationUserData.amount ? 0 : this.creationUserData.amount, default: () => ({}),
rangeMin: 0, },
rangeMax: 1000, items: {
selected: '', type: Array,
userId: this.item.userId, required: false,
default: () => [],
},
creationUserData: {
type: Object,
required: false,
default: () => ({}),
},
})
const { t } = useI18n()
const store = useStore()
const text = ref(props.creationUserData.memo || '')
const value = ref(props.creationUserData.amount || 0)
const rangeMin = ref(0)
const rangeMax = ref(1000)
const selected = ref()
const creationForm = ref(null)
const openCreations = computed(() => store.state.openCreations)
const updateRadioSelected = (name) => {
text.value = `${t('creation_form.creation_for')} ${name?.short} ${name?.year}`
rangeMin.value = 0
rangeMax.value = Number(name?.creation)
}
const onReset = () => {
text.value = ''
value.value = 0
selected.value = null
}
const { mutate: createContribution } = useMutation(adminCreateContribution)
const { refetch } = useQuery(openCreations)
const emit = defineEmits(['update-user-data'])
const submitCreation = async () => {
try {
const result = await createContribution({
email: props.item.email,
creationDate: selected.value.date,
amount: Number(value.value),
memo: text.value,
})
emit('update-user-data', props.item, result.data.adminCreateContribution)
store.commit('openCreationsPlus', 1)
// toast.success(
// t('creation_form.toasted', {
// value: value.value,
// email: props.item.email,
// }),
// )
onReset()
} catch (error) {
// toast.error(error.message)
onReset()
} finally {
refetch()
selected.value = ''
}
}
watch(
() => selected.value,
async (newValue, oldValue) => {
if (newValue !== oldValue && selected.value !== '') {
updateRadioSelected(newValue)
} }
}, },
methods: { )
updateRadioSelected(name) {
// do we want to reset the memo everytime the month changes?
this.text = this.$t('creation_form.creation_for') + ' ' + name.short + ' ' + name.year
this.rangeMin = 0
this.rangeMax = Number(name.creation)
},
submitCreation() {
this.$apollo
.mutate({
mutation: adminCreateContribution,
variables: {
email: this.item.email,
creationDate: this.selected.date,
amount: Number(this.value),
memo: this.text,
},
})
.then((result) => {
this.$emit('update-user-data', this.item, result.data.adminCreateContribution)
this.$store.commit('openCreationsPlus', 1)
this.toastSuccess(
this.$t('creation_form.toasted', {
value: this.value,
email: this.item.email,
}),
)
// what is this? Tests says that this.text is not reseted
this.$refs.creationForm.reset()
this.value = 0
})
.catch((error) => {
this.toastError(error.message)
this.$refs.creationForm.reset()
this.value = 0
})
.finally(() => {
this.$apollo.queries.OpenCreations.refetch()
this.selected = ''
})
},
},
watch: {
selected() {
this.updateRadioSelected(this.selected)
},
},
}
</script> </script>

2
admin/src/components/CreationTransactionList.vue
View File

@ -11,9 +11,9 @@
</b-table> </b-table>
<div> <div>
<b-pagination <b-pagination
v-model="currentPage"
pills pills
size="lg" size="lg"
v-model="currentPage"
:per-page="perPage" :per-page="perPage"
:total-rows="rows" :total-rows="rows"
align="center" align="center"

9
admin/src/components/DeletedUserFormular.vue
View File

@ -7,13 +7,13 @@
<div class="mt-3 mb-5"> <div class="mt-3 mb-5">
<b-button <b-button
v-if="!item.deletedAt" v-if="!item.deletedAt"
variant="danger"
v-b-modal.delete-user-modal v-b-modal.delete-user-modal
variant="danger"
@click="showDeleteModal()" @click="showDeleteModal()"
> >
{{ $t('delete_user') }} {{ $t('delete_user') }}
</b-button> </b-button>
<b-button v-else variant="success" v-b-modal.delete-user-modal @click="showUndeleteModal()"> <b-button v-else v-b-modal.delete-user-modal variant="success" @click="showUndeleteModal()">
{{ $t('undelete_user') }} {{ $t('undelete_user') }}
</b-button> </b-button>
</div> </div>
@ -32,6 +32,7 @@ export default {
required: true, required: true,
}, },
}, },
emits: ['update-deleted-at'],
methods: { methods: {
showDeleteModal() { showDeleteModal() {
this.$bvModal this.$bvModal
@ -91,7 +92,7 @@ export default {
}, },
}) })
.then((result) => { .then((result) => {
this.$emit('updateDeletedAt', { this.$emit('update-deleted-at', {
userId: this.item.userId, userId: this.item.userId,
deletedAt: result.data.deleteUser, deletedAt: result.data.deleteUser,
}) })
@ -109,7 +110,7 @@ export default {
}, },
}) })
.then((result) => { .then((result) => {
this.$emit('updateDeletedAt', { this.$emit('update-deleted-at', {
userId: this.item.userId, userId: this.item.userId,
deletedAt: result.data.unDeleteUser, deletedAt: result.data.unDeleteUser,
}) })

47
admin/src/components/EditCreationFormular.vue
View File

@ -20,16 +20,16 @@
<div> <div>
<b-input-group prepend="GDD" append=".00"> <b-input-group prepend="GDD" append=".00">
<b-form-input <b-form-input
type="number"
v-model="value" v-model="value"
type="number"
:min="rangeMin" :min="rangeMin"
:max="rangeMax" :max="rangeMax"
></b-form-input> ></b-form-input>
</b-input-group> </b-input-group>
<b-input-group prepend="0" :append="String(rangeMax)" class="mt-3"> <b-input-group prepend="0" :append="String(rangeMax)" class="mt-3">
<b-form-input <b-form-input
type="range"
v-model="value" v-model="value"
type="range"
:min="rangeMin" :min="rangeMin"
:max="rangeMax" :max="rangeMax"
step="10" step="10"
@ -61,8 +61,8 @@
type="button" type="button"
variant="success" variant="success"
class="test-submit" class="test-submit"
@click="submitCreation"
:disabled="selected === '' || value <= 0 || text.length < 10" :disabled="selected === '' || value <= 0 || text.length < 10"
@click="submitCreation"
> >
{{ $t('creation_form.update_creation') }} {{ $t('creation_form.update_creation') }}
</b-button> </b-button>
@ -97,15 +97,35 @@ export default {
required: true, required: true,
}, },
}, },
emits: ['update-creation-data'],
data() { data() {
return { return {
text: !this.creationUserData.memo ? '' : this.creationUserData.memo, text: !this.creationUserData.memo ? '' : this.creationUserData.memo,
value: !this.creationUserData.amount ? 0 : Number(this.creationUserData.amount), value: !this.creationUserData.amount ? 0 : Number(this.creationUserData.amount),
rangeMin: 0, rangeMin: 0,
selected: this.selectedComputed, selected: this.selectedComputed, // TODO investigate this one and apply solution based on good practices
userId: this.item.userId, userId: this.item.userId,
} }
}, },
computed: {
creationIndex() {
const month = this.$d(new Date(this.item.contributionDate), 'month')
return this.radioOptions.findIndex((obj) => {
return obj.item.short === month
})
},
selectedComputed() {
return this.radioOptions[this.creationIndex].item
},
rangeMax() {
return Number(this.creation[this.creationIndex]) + Number(this.item.amount)
},
},
watch: {
selectedComputed() {
this.selected = this.selectedComputed
},
},
methods: { methods: {
submitCreation() { submitCreation() {
this.$apollo this.$apollo
@ -143,24 +163,5 @@ export default {
}) })
}, },
}, },
computed: {
creationIndex() {
const month = this.$d(new Date(this.item.contributionDate), 'month')
return this.radioOptions.findIndex((obj) => {
return obj.item.short === month
})
},
selectedComputed() {
return this.radioOptions[this.creationIndex].item
},
rangeMax() {
return Number(this.creation[this.creationIndex]) + Number(this.item.amount)
},
},
watch: {
selectedComputed() {
this.selected = this.selectedComputed
},
},
} }
</script> </script>

4
admin/src/components/Federation/CommunityVisualizeItem.vue
View File

@ -26,7 +26,7 @@
</b-list-group-item> </b-list-group-item>
<b-list-group-item v-if="!item.foreign"> <b-list-group-item v-if="!item.foreign">
<editable-group <editable-group
:allowEdit="$store.state.moderator.roles.includes('ADMIN')" :allow-edit="$store.state.moderator.roles.includes('ADMIN')"
@save="handleUpdateHomeCommunity" @save="handleUpdateHomeCommunity"
@reset="resetHomeCommunityEditable" @reset="resetHomeCommunityEditable"
> >
@ -48,7 +48,7 @@
<editable-groupable-label <editable-groupable-label
v-model="gmsApiKey" v-model="gmsApiKey"
:label="$t('federation.gmsApiKey')" :label="$t('federation.gmsApiKey')"
idName="home-community-api-key" id-name="home-community-api-key"
/> />
<coordinates v-model="location" /> <coordinates v-model="location" />
</template> </template>

106
admin/src/components/NavBar.vue
View File

@ -1,59 +1,83 @@
<template> <template>
<div class="component-nabvar"> <div class="component-nabvar">
<b-navbar toggleable="lg" type="dark" class="bg-dark"> <BNavbar v-b-color-mode="'dark'" toggleable="lg" variant="light-dark">
<b-navbar-brand class="mb-2" to="/"> <BNavbarBrand class="mb-2" to="/">
<img src="img/brand/gradido_logo_w.png" class="navbar-brand-img pl-2" alt="..." /> <img
</b-navbar-brand> src="../../public/img/brand/gradido_logo_w.png"
class="navbar-brand-img pl-2"
alt="..."
/>
</BNavbarBrand>
<b-navbar-toggle target="nav-collapse"></b-navbar-toggle> <BNavbarToggle target="navbar-toggle-collapse" />
<b-collapse id="nav-collapse" is-nav> <BCollapse id="nav-collapse" is-nav>
<b-navbar-nav> <BNavbarNav>
<b-nav-item to="/user">{{ $t('navbar.user_search') }}</b-nav-item> <BNavItem to="/user">{{ $t('navbar.user_search') }}</BNavItem>
<b-nav-item class="bg-color-creation" to="/creation-confirm"> <BNavItem class="bg-color-creation" to="/creation-confirm">
{{ $t('creation') }} {{ $t('creation') }}
<b-badge v-show="$store.state.openCreations > 0" variant="danger"> <BBadge v-show="openCreations > 0" variant="danger">
{{ $store.state.openCreations }} {{ openCreations.value }}
</b-badge> </BBadge>
</b-nav-item> </BNavItem>
<b-nav-item to="/contribution-links"> <BNavItem to="/contribution-links">
{{ $t('navbar.automaticContributions') }} {{ $t('navbar.automaticContributions') }}
</b-nav-item> </BNavItem>
<b-nav-item to="/federation"> <BNavItem to="/federation">
{{ $t('navbar.instances') }} {{ $t('navbar.instances') }}
</b-nav-item> </BNavItem>
<b-nav-item to="/statistic">{{ $t('navbar.statistic') }}</b-nav-item> <BNavItem to="/statistic">{{ $t('navbar.statistic') }}</BNavItem>
<b-nav-item @click="wallet">{{ $t('navbar.my-account') }}</b-nav-item> <BNavItem @click="handleWallet">{{ $t('navbar.my-account') }}</BNavItem>
<b-nav-item @click="logout">{{ $t('navbar.logout') }}</b-nav-item> <BNavItem @click="handleLogout">{{ $t('navbar.logout') }}</BNavItem>
</b-navbar-nav> </BNavbarNav>
</b-collapse> </BCollapse>
</b-navbar> </BNavbar>
</div> </div>
</template> </template>
<script> <script setup>
import CONFIG from '../config' import CONFIG from '../config'
import { useStore } from 'vuex'
import { computed } from 'vue'
import { useMutation } from '@vue/apollo-composable'
import { logout } from '../graphql/logout' import { logout } from '../graphql/logout'
import {
BNavbar,
BCollapse,
BNavbarNav,
BNavItem,
BNavbarBrand,
BBadge,
BNavbarToggle,
vBColorMode,
} from 'bootstrap-vue-next'
export default { const store = useStore()
name: 'navbar',
methods: { const openCreations = computed(() => store.state.openCreations)
async logout() {
window.location.assign(CONFIG.WALLET_LOGIN_URL) const { mutate: executeLogout } = useMutation(logout)
// window.location = CONFIG.WALLET_LOGIN_URL
this.$store.dispatch('logout') const handleLogout = async () => {
await this.$apollo.mutate({ window.location.assign(CONFIG.WALLET_LOGIN_URL)
mutation: logout, // window.location = CONFIG.WALLET_LOGIN_URL
}) store.dispatch('logout')
}, await executeLogout()
wallet() { }
window.location = CONFIG.WALLET_AUTH_URL.replace('{token}', this.$store.state.token)
this.$store.dispatch('logout') // logout without redirect const handleWallet = () => {
}, window.location = CONFIG.WALLET_AUTH_URL.replace('{token}', store.state.token)
}, store.dispatch('logout') // logout without redirect
} }
</script> </script>
<style> <style lang="scss" scoped>
.navbar-brand-img { .navbar-brand-img {
height: 2rem; height: 2rem;
padding-left: 10px;
}
</style>
<style lang="scss">
.bg-light-dark {
background-color: #343a40;
} }
</style> </style>

2
admin/src/components/NotFoundPage.vue
View File

@ -1195,7 +1195,7 @@
<script> <script>
export default { export default {
name: 'not-found', name: 'NotFound',
data() { data() {
return { return {
anime: { anime: {

3
admin/src/components/Overlay.vue
View File

@ -52,9 +52,10 @@
</template> </template>
<script> <script>
export default { export default {
name: 'overlay', name: 'Overlay',
props: { props: {
item: { type: Object, required: true }, item: { type: Object, required: true },
}, },
emits: ['overlay-cancel'],
} }
</script> </script>

7
admin/src/components/RowDetails.vue
View File

@ -16,9 +16,10 @@ export default {
name: 'RowDetails', name: 'RowDetails',
props: { props: {
row: { required: true, type: Object }, row: { required: true, type: Object },
slotName: { requried: true, type: String }, slotName: { required: true, type: String },
type: { requried: true, type: String }, type: { required: true, type: String },
index: { requried: true, type: Number }, index: { required: true, type: Number },
}, },
emits: ['row-toggle-details'],
} }
</script> </script>

27
admin/src/components/Tables/OpenCreationsTable.vue
View File

@ -17,8 +17,8 @@
<b-button <b-button
variant="danger" variant="danger"
size="md" size="md"
@click="$emit('show-overlay', row.item, 'delete')"
class="mr-2" class="mr-2"
@click="$emit('show-overlay', row.item, 'delete')"
> >
<b-icon icon="trash" variant="light"></b-icon> <b-icon icon="trash" variant="light"></b-icon>
</b-button> </b-button>
@ -38,8 +38,8 @@
variant="info" variant="info"
size="md" size="md"
:index="0" :index="0"
@click="rowToggleDetails(row, 0)"
class="mr-2" class="mr-2"
@click="rowToggleDetails(row, 0)"
> >
<b-icon :icon="row.detailsShowing ? 'x' : 'pencil-square'" aria-label="Help"></b-icon> <b-icon :icon="row.detailsShowing ? 'x' : 'pencil-square'" aria-label="Help"></b-icon>
</b-button> </b-button>
@ -69,8 +69,8 @@
<b-button <b-button
variant="warning" variant="warning"
size="md" size="md"
@click="$emit('show-overlay', row.item, 'deny')"
class="mr-2" class="mr-2"
@click="$emit('show-overlay', row.item, 'deny')"
> >
<b-icon icon="x" variant="light"></b-icon> <b-icon icon="x" variant="light"></b-icon>
</b-button> </b-button>
@ -81,8 +81,8 @@
<b-button <b-button
variant="success" variant="success"
size="md" size="md"
@click="$emit('show-overlay', row.item, 'confirm')"
class="mr-2" class="mr-2"
@click="$emit('show-overlay', row.item, 'confirm')"
> >
<b-icon icon="check" scale="2" variant=""></b-icon> <b-icon icon="check" scale="2" variant=""></b-icon>
</b-button> </b-button>
@ -92,7 +92,7 @@
<row-details <row-details
:row="row" :row="row"
type="show-creation" type="show-creation"
slotName="show-creation" slot-name="show-creation"
:index="0" :index="0"
@row-toggle-details="rowToggleDetails(row, 0)" @row-toggle-details="rowToggleDetails(row, 0)"
> >
@ -102,18 +102,18 @@
type="singleCreation" type="singleCreation"
:item="row.item" :item="row.item"
:row="row" :row="row"
:creationUserData="creationUserData" :creation-user-data="creationUserData"
@update-creation-data="$emit('update-contributions')" @update-creation-data="$emit('update-contributions')"
/> />
</div> </div>
<div v-else> <div v-else>
<contribution-messages-list <contribution-messages-list
:contributionId="row.item.id" :contribution-id="row.item.id"
:contributionStatus="row.item.status" :contribution-status="row.item.status"
:contributionUserId="row.item.userId" :contribution-user-id="row.item.userId"
:contributionMemo="row.item.memo" :contribution-memo="row.item.memo"
:resubmissionAt="row.item.resubmissionAt" :resubmission-at="row.item.resubmissionAt"
:hideResubmission="hideResubmission" :hide-resubmission="hideResubmission"
@update-status="updateStatus" @update-status="updateStatus"
@reload-contribution="reloadContribution" @reload-contribution="reloadContribution"
@update-contributions="updateContributions" @update-contributions="updateContributions"
@ -142,12 +142,12 @@ const iconMap = {
export default { export default {
name: 'OpenCreationsTable', name: 'OpenCreationsTable',
mixins: [toggleRowDetails],
components: { components: {
EditCreationFormular, EditCreationFormular,
RowDetails, RowDetails,
ContributionMessagesList, ContributionMessagesList,
}, },
mixins: [toggleRowDetails],
props: { props: {
items: { items: {
type: Array, type: Array,
@ -166,6 +166,7 @@ export default {
required: false, required: false,
}, },
}, },
emits: ['update-contributions', 'reload-contribution', 'update-status', 'show-overlay'],
methods: { methods: {
myself(item) { myself(item) {
return item.userId === this.$store.state.moderator.id return item.userId === this.$store.state.moderator.id

220
admin/src/components/Tables/SearchUserTable.vue
View File

@ -1,6 +1,6 @@
<template> <template>
<div class="search-user-table"> <div class="search-user-table">
<b-table <BTable
tbody-tr-class="pointer" tbody-tr-class="pointer"
:items="myItems" :items="myItems"
:fields="fields" :fields="fields"
@ -9,151 +9,161 @@
hover hover
stacked="md" stacked="md"
select-mode="single" select-mode="single"
selectableonRowSelected selectable-on-row-selected
@row-clicked="onRowClicked" @row-clicked="onRowClicked"
> >
<template #cell(creation)="data"> <template #cell(creation)="data">
<div v-html="data.value"></div> <div v-html="data.value" />
</template> </template>
<template #cell(status)="row"> <template #cell(status)="row">
<div class="text-right"> <div class="text-right">
<b-avatar v-if="row.item.deletedAt" class="mr-3 test-deleted-icon" variant="light"> <BAvatar v-if="row.item.deletedAt" class="mr-3 test-deleted-icon" variant="light">
<b-iconstack font-scale="2"> <!-- <b-iconstack font-scale="2"> -->
<b-icon stacked icon="person" variant="info" scale="0.75"></b-icon> <div>
<b-icon stacked icon="slash-circle" variant="danger"></b-icon> <IOcticonPerson24 />
</b-iconstack> <IOcticonCircleSlash24 style="color: #f5365c" />
</b-avatar> </div>
<!-- </b-iconstack> -->
</BAvatar>
<span v-if="!row.item.deletedAt"> <span v-if="!row.item.deletedAt">
<b-avatar <IPhEnvelope
v-if="!row.item.emailChecked" v-if="!row.item.emailChecked"
icon="envelope" style="color: #f5365c"
class="align-center mr-3" class="align-center mr-3"
variant="danger" />
></b-avatar> <!-- <b-icon
<b-avatar
v-if="!row.item.hasElopage" v-if="!row.item.hasElopage"
variant="danger" variant="danger"
class="mr-3" class="mr-3"
src="img/elopage_favicon.png" src="img/elopage_favicon.png"
></b-avatar> /> -->
</span> </span>
<b-icon <IPhCaretUpFill
variant="dark" v-if="row.detailsShowing === 'caret-up-fill'"
:icon="row.detailsShowing ? 'caret-up-fill' : 'caret-down'" style="color: #212529"
:title="row.item.enabled ? $t('enabled') : $t('deleted')" :title="row.item.enabled ? $t('enabled') : $t('deleted')"
></b-icon> />
<IPhCaretDown
v-else
style="color: #212529"
:title="row.item.enabled ? $t('enabled') : $t('deleted')"
/>
</div> </div>
</template> </template>
<template #row-details="row"> <template #row-details="row">
<b-card ref="rowDetails" class="shadow-lg pl-3 pr-3 mb-5 bg-white rounded"> <BCard ref="rowDetails" class="shadow-lg pl-3 pr-3 mb-5 bg-white rounded">
<b-tabs content-class="mt-3"> <BTabs content-class="mt-3">
<b-tab :title="$t('creation')" active :disabled="row.item.deletedAt !== null"> <BTab :title="$t('creation')" active :disabled="row.item.deletedAt !== null">
<creation-formular <creation-formular
v-if="!row.item.deletedAt" v-if="!row.item.deletedAt"
pagetype="singleCreation" pagetype="singleCreation"
:creation="row.item.creation" :creation="row.item.creation"
:item="row.item" :item="row.item"
:creationUserData="creationUserData" :creation-user-data="creationUserData"
@update-user-data="updateUserData" @update-user-data="updateUserData"
/> />
</b-tab> </BTab>
<b-tab :title="$t('e_mail')" :disabled="row.item.deletedAt !== null"> <BTab :title="$t('e_mail')" :disabled="row.item.deletedAt !== null">
<confirm-register-mail-formular <confirm-register-mail-formular
v-if="!row.item.deletedAt" v-if="!row.item.deletedAt"
:checked="row.item.emailChecked" :checked="row.item.emailChecked"
:email="row.item.email" :email="row.item.email"
:dateLastSend=" :date-last-send="
row.item.emailConfirmationSend row.item.emailConfirmationSend
? $d(new Date(row.item.emailConfirmationSend), 'long') ? $d(new Date(row.item.emailConfirmationSend), 'long')
: '' : ''
" "
/> />
</b-tab> </BTab>
<b-tab :title="$t('creationList')" :disabled="row.item.deletedAt !== null"> <!-- <BTab :title="$t('creationList')" :disabled="row.item.deletedAt !== null">
<creation-transaction-list v-if="!row.item.deletedAt" :userId="row.item.userId" /> <creation-transaction-list v-if="!row.item.deletedAt" :user-id="row.item.userId" />
</b-tab> </BTab>
<b-tab :title="$t('transactionlink.name')" :disabled="row.item.deletedAt !== null"> <BTab :title="$t('transactionlink.name')" :disabled="row.item.deletedAt !== null">
<transaction-link-list v-if="!row.item.deletedAt" :userId="row.item.userId" /> <transaction-link-list v-if="!row.item.deletedAt" :user-id="row.item.userId" />
</b-tab> </BTab>
<b-tab :title="$t('userRole.tabTitle')"> <BTab :title="$t('userRole.tabTitle')">
<change-user-role-formular :item="row.item" @updateRoles="updateRoles" /> <change-user-role-formular :item="row.item" @update-roles="updateRoles" />
</b-tab> </BTab> -->
<b-tab v-if="$store.state.moderator.roles.includes('ADMIN')" :title="$t('delete_user')"> <!-- <BTab v-if="store.state.moderator.roles.includes('ADMIN')" :title="$t('delete_user')">
<deleted-user-formular :item="row.item" @updateDeletedAt="updateDeletedAt" /> <deleted-user-formular :item="row.item" @update-deleted-at="updateDeletedAt" />
</b-tab> </BTab> -->
</b-tabs> </BTabs>
</b-card> </BCard>
</template> </template>
</b-table> </BTable>
</div> </div>
</template> </template>
<script> <script setup>
import CreationFormular from '../CreationFormular' import { ref, nextTick, onMounted, watch } from 'vue'
import ConfirmRegisterMailFormular from '../ConfirmRegisterMailFormular' import { BTable, BAvatar, BTab, BTabs, BCard } from 'bootstrap-vue-next'
import CreationTransactionList from '../CreationTransactionList' import CreationFormular from '../CreationFormular.vue'
import TransactionLinkList from '../TransactionLinkList' import ConfirmRegisterMailFormular from '../ConfirmRegisterMailFormular.vue'
import ChangeUserRoleFormular from '../ChangeUserRoleFormular'
import DeletedUserFormular from '../DeletedUserFormular'
export default { const props = defineProps({
name: 'SearchUserTable', items: {
components: { type: Array,
CreationFormular, required: true,
ConfirmRegisterMailFormular,
CreationTransactionList,
TransactionLinkList,
ChangeUserRoleFormular,
DeletedUserFormular,
}, },
props: { fields: {
items: { type: Array,
type: Array, required: true,
required: true,
},
fields: {
type: Array,
required: true,
},
},
data() {
return {
creationUserData: {},
}
},
methods: {
updateUserData(rowItem, newCreation) {
rowItem.creation = newCreation
},
updateRoles({ userId, roles }) {
this.$emit('updateRoles', userId, roles)
},
updateDeletedAt({ userId, deletedAt }) {
this.$emit('updateDeletedAt', userId, deletedAt)
},
async onRowClicked(item) {
const status = this.myItems.find((obj) => obj === item)._showDetails
this.myItems.forEach((obj) => {
if (obj === item) {
obj._showDetails = !status
} else {
obj._showDetails = false
}
})
await this.$nextTick()
if (!status && this.$refs.rowDetails) {
this.$refs.rowDetails.focus()
}
},
},
computed: {
myItems() {
return this.items.map((item) => {
return { ...item, _showDetails: false }
})
},
}, },
})
// const emit = defineEmits(['update-roles', 'update-deleted-at'])
const myItems = ref()
const creationUserData = ref({})
const rowDetails = ref()
onMounted(() => {
setTimeout(() => {
myItems.value = props.items.map((item) => {
return { ...item, _showDetails: false }
})
// myItems.value
}, 500)
})
const updateUserData = (rowItem, newCreation) => {
rowItem.creation = newCreation
} }
// const updateRoles = ({ userId, roles }) => {
// emit('update-roles', userId, roles)
// }
//
// const updateDeletedAt = ({ userId, deletedAt }) => {
// emit('update-deleted-at', userId, deletedAt)
// }
const onRowClicked = async (item) => {
const status = myItems.value.find((obj) => {
return obj.userId === item.userId
})?._showDetails
myItems.value.forEach((obj) => {
if (obj === item) {
obj._showDetails = !status
} else {
obj._showDetails = false
}
})
await nextTick()
if (!status && rowDetails.value) {
// rowDetails.value.focus()
}
}
watch(
() => props.items,
(items) => {
myItems.value = items.map((item) => {
return { ...item, _showDetails: false }
})
},
)
</script> </script>

156
admin/src/components/Tables/StatisticTable.vue
View File

@ -1,84 +1,100 @@
<!-- eslint-disable vue/no-static-inline-styles --> <!-- eslint-disable vue/no-static-inline-styles -->
<template> <template>
<div class="statistic-table"> <div class="statistic-table">
<b-table-simple style="width: auto" class="mt-5" striped stacked="md"> <BTableSimple style="width: auto" class="mt-5" striped stacked="md">
<b-thead> <BThead>
<b-tr> <BTr>
<b-th></b-th> <BTh />
<b-th class="text-right">{{ $t('statistic.count') }}</b-th> <BTh class="text-right">{{ $t('statistic.count') }}</BTh>
<b-th class="text-right">{{ $t('statistic.details') }}</b-th> <BTh class="text-right">{{ $t('statistic.details') }}</BTh>
</b-tr> </BTr>
</b-thead> </BThead>
<b-tbody> <BTbody>
<b-tr> <BTr>
<b-td> <BTd>
<b>{{ $t('statistic.totalUsers') }}</b> <b>{{ $t('statistic.totalUsers') }}</b>
</b-td> </BTd>
<b-td class="text-right">{{ value.totalUsers }}</b-td> <BTd class="text-right">
<b-td></b-td> {{ modelValue.totalUsers }}
</b-tr> </BTd>
<b-tr> <BTd></BTd>
<b-td> </BTr>
<BTr>
<BTd>
<b>{{ $t('statistic.activeUsers') }}</b> <b>{{ $t('statistic.activeUsers') }}</b>
</b-td> </BTd>
<b-td class="text-right">{{ value.activeUsers }}</b-td> <BTd class="text-right">
<b-td></b-td> {{ modelValue.activeUsers }}
</b-tr> </BTd>
<b-tr> <BTd></BTd>
<b-td> </BTr>
<BTr>
<BTd>
<b>{{ $t('statistic.deletedUsers') }}</b> <b>{{ $t('statistic.deletedUsers') }}</b>
</b-td> </BTd>
<b-td class="text-right">{{ value.deletedUsers }}</b-td> <BTd class="text-right">
<b-td></b-td> {{ modelValue.deletedUsers }}
</b-tr> </BTd>
<b-tr> <BTd></BTd>
<b-td> </BTr>
<BTr>
<BTd>
<b>{{ $t('statistic.totalGradidoCreated') }}</b> <b>{{ $t('statistic.totalGradidoCreated') }}</b>
</b-td> </BTd>
<b-td class="text-right"> <BTd class="text-right">
{{ $n(value.totalGradidoCreated, 'decimal') }} {{ $t('GDD') }} <!-- {{ $n(modelValue.totalGradidoCreated, 'decimal') }} {{ $t('GDD') }}-->
</b-td> 4500
<b-td class="text-right">{{ value.totalGradidoCreated }}</b-td> </BTd>
</b-tr> <BTd class="text-right">
<b-tr> {{ modelValue.totalGradidoCreated }}
<b-td> </BTd>
</BTr>
<BTr>
<BTd>
<b>{{ $t('statistic.totalGradidoDecayed') }}</b> <b>{{ $t('statistic.totalGradidoDecayed') }}</b>
</b-td> </BTd>
<b-td class="text-right"> <BTd class="text-right">
{{ $n(value.totalGradidoDecayed, 'decimal') }} {{ $t('GDD') }} <!-- {{ $n(modelValue.totalGradidoDecayed, 'decimal') }} {{ $t('GDD') }}-->
</b-td> 100
<b-td class="text-right">{{ value.totalGradidoDecayed }}</b-td> </BTd>
</b-tr> <BTd class="text-right">{{ modelValue.totalGradidoDecayed }}</BTd>
<b-tr> </BTr>
<b-td> <BTr>
<BTd>
<b>{{ $t('statistic.totalGradidoAvailable') }}</b> <b>{{ $t('statistic.totalGradidoAvailable') }}</b>
</b-td> </BTd>
<b-td class="text-right"> <BTd class="text-right">
{{ $n(value.totalGradidoAvailable, 'decimal') }} {{ $t('GDD') }} <!-- {{ $n(modelValue.totalGradidoAvailable, 'decimal') }} {{ $t('GDD') }}-->
</b-td> 500
<b-td class="text-right">{{ value.totalGradidoAvailable }}</b-td> </BTd>
</b-tr> <BTd class="text-right">
<b-tr> {{ modelValue.totalGradidoAvailable }}
<b-td> </BTd>
</BTr>
<BTr>
<BTd>
<b>{{ $t('statistic.totalGradidoUnbookedDecayed') }}</b> <b>{{ $t('statistic.totalGradidoUnbookedDecayed') }}</b>
</b-td> </BTd>
<b-td class="text-right"> <BTd class="text-right">
{{ $n(value.totalGradidoUnbookedDecayed, 'decimal') }} {{ $t('GDD') }} <!-- {{ $n(modelValue.totalGradidoUnbookedDecayed, 'decimal') }} {{ $t('GDD') }}-->
</b-td> 600
<b-td class="text-right">{{ value.totalGradidoUnbookedDecayed }}</b-td> </BTd>
</b-tr> <BTd class="text-right">
</b-tbody> {{ modelValue.totalGradidoUnbookedDecayed }}
</b-table-simple> </BTd>
</BTr>
</BTbody>
</BTableSimple>
</div> </div>
</template> </template>
<script> <script setup>
export default { import { defineProps } from 'vue'
name: 'StatisticTable', import { BTableSimple, BThead, BTr, BTh, BTbody, BTd } from 'bootstrap-vue-next'
props: {
value: { const props = defineProps({
type: Object, modelValue: {
required: true, type: Object,
}, required: true,
}, },
} })
</script> </script>

48
admin/src/components/TransactionLinkList.vue
View File

@ -5,9 +5,9 @@
<b-table striped hover :fields="fields" :items="items"></b-table> <b-table striped hover :fields="fields" :items="items"></b-table>
</div> </div>
<b-pagination <b-pagination
v-model="currentPage"
pills pills
size="lg" size="lg"
v-model="currentPage"
:per-page="perPage" :per-page="perPage"
:total-rows="rows" :total-rows="rows"
align="center" align="center"
@ -30,26 +30,6 @@ export default {
perPage: 5, perPage: 5,
} }
}, },
methods: {
getListTransactionLinks() {
this.$apollo
.query({
query: listTransactionLinksAdmin,
variables: {
currentPage: this.currentPage,
pageSize: this.perPage,
userId: this.userId,
},
})
.then((result) => {
this.rows = result.data.listTransactionLinksAdmin.count
this.items = result.data.listTransactionLinksAdmin.links
})
.catch((error) => {
this.toastError(error.message)
})
},
},
computed: { computed: {
fields() { fields() {
return [ return [
@ -94,13 +74,33 @@ export default {
] ]
}, },
}, },
created() {
this.getListTransactionLinks()
},
watch: { watch: {
currentPage() { currentPage() {
this.getListTransactionLinks() this.getListTransactionLinks()
}, },
}, },
created() {
this.getListTransactionLinks()
},
methods: {
getListTransactionLinks() {
this.$apollo
.query({
query: listTransactionLinksAdmin,
variables: {
currentPage: this.currentPage,
pageSize: this.perPage,
userId: this.userId,
},
})
.then((result) => {
this.rows = result.data.listTransactionLinksAdmin.count
this.items = result.data.listTransactionLinksAdmin.links
})
.catch((error) => {
this.toastError(error.message)
})
},
},
} }
</script> </script>

76
admin/src/components/UserQuery.vue
View File

@ -1,43 +1,53 @@
<template> <template>
<div> <div>
<b-input-group> <div class="d-flex">
<b-form-input <BFormInput
v-model="currentValue"
type="text" type="text"
class="test-input-criteria" class="test-input-criteria"
v-model="currentValue"
:placeholder="placeholderText" :placeholder="placeholderText"
></b-form-input> />
<b-input-group-append class="test-click-clear-criteria" @click="currentValue = ''"> <div append class="test-click-clear-criteria" @click="onClear">
<b-input-group-text class="pointer"> <BInputGroupText class="pointer h-100">
<b-icon icon="x" /> <IIcBaselineClose />
</b-input-group-text> </BInputGroupText>
</b-input-group-append> </div>
</b-input-group> </div>
</div> </div>
</template> </template>
<script>
export default { <script setup>
name: 'UserQuery', import { ref, watch, computed } from 'vue'
props: { import { useI18n } from 'vue-i18n'
value: { type: String, default: '' }, import { BInputGroupText, BFormInput } from 'bootstrap-vue-next'
placeholder: { type: String, default: '' },
}, const props = defineProps({
data() { modelValue: { type: String, default: '' },
return { placeholder: { type: String, default: '' },
currentValue: this.value, })
const emit = defineEmits(['update:modelValue'])
const { t } = useI18n()
const placeholderText = computed(() => props.placeholder || t('user_search'))
const onClear = () => {
currentValue.value = ''
}
const currentValue = ref(props.modelValue)
watch(currentValue, (newValue) => {
emit('update:modelValue', newValue)
})
watch(
() => props.modelValue,
(newValue) => {
if (newValue !== currentValue.value) {
currentValue.value = newValue
} }
}, },
computed: { )
placeholderText() {
return this.placeholder || this.$t('user_search')
},
},
watch: {
currentValue() {
if (this.value !== this.currentValue) {
this.$emit('input', this.currentValue)
}
},
},
}
</script> </script>

13
admin/src/components/input/Coordinates.vue
View File

@ -11,24 +11,24 @@
:description="$t('geo-coordinates.latitude-longitude-smart.describe')" :description="$t('geo-coordinates.latitude-longitude-smart.describe')"
> >
<b-form-input <b-form-input
v-model="locationString"
id="home-community-latitude-longitude-smart" id="home-community-latitude-longitude-smart"
v-model="locationString"
type="text" type="text"
@input="splitCoordinates" @input="splitCoordinates"
/> />
</b-form-group> </b-form-group>
<b-form-group :label="$t('latitude')" label-for="home-community-latitude"> <b-form-group :label="$t('latitude')" label-for="home-community-latitude">
<b-form-input <b-form-input
v-model="inputValue.latitude"
id="home-community-latitude" id="home-community-latitude"
v-model="inputValue.latitude"
type="text" type="text"
@input="valueUpdated" @input="valueUpdated"
/> />
</b-form-group> </b-form-group>
<b-form-group :label="$t('longitude')" label-for="home-community-longitude"> <b-form-group :label="$t('longitude')" label-for="home-community-longitude">
<b-form-input <b-form-input
v-model="inputValue.longitude"
id="home-community-longitude" id="home-community-longitude"
v-model="inputValue.longitude"
type="text" type="text"
@input="valueUpdated" @input="valueUpdated"
/> />
@ -41,9 +41,12 @@
export default { export default {
name: 'Coordinates', name: 'Coordinates',
props: { props: {
value: Object, value: {
default: null, type: Object,
default: null,
},
}, },
emits: ['input'],
data() { data() {
return { return {
inputValue: this.value, inputValue: this.value,

11
admin/src/components/input/EditableGroup.vue
View File

@ -1,17 +1,17 @@
<template> <template>
<div> <div>
<slot v-if="!isEditing" v-bind:isEditing="isEditing" name="view"></slot> <slot v-if="!isEditing" :is-editing="isEditing" name="view"></slot>
<slot v-else v-bind:isEditing="isEditing" name="edit" @input="valueChanged"></slot> <slot v-else :is-editing="isEditing" name="edit" @input="valueChanged"></slot>
<b-form-group v-if="allowEdit && !isEditing"> <b-form-group v-if="allowEdit && !isEditing">
<b-button @click="enableEdit" :variant="variant"> <b-button :variant="variant" @click="enableEdit">
<b-icon icon="pencil-fill">{{ $t('edit') }}</b-icon> <b-icon icon="pencil-fill">{{ $t('edit') }}</b-icon>
</b-button> </b-button>
</b-form-group> </b-form-group>
<b-form-group v-else-if="allowEdit && isEditing"> <b-form-group v-else-if="allowEdit && isEditing">
<b-button @click="save" :variant="variant" :disabled="!isValueChanged" class="save-button"> <b-button :variant="variant" :disabled="!isValueChanged" class="save-button" @click="save">
{{ $t('save') }} {{ $t('save') }}
</b-button> </b-button>
<b-button @click="close" variant="secondary" class="close-button"> <b-button variant="secondary" class="close-button" @click="close">
{{ $t('close') }} {{ $t('close') }}
</b-button> </b-button>
</b-form-group> </b-form-group>
@ -27,6 +27,7 @@ export default {
default: false, default: false,
}, },
}, },
emits: ['save', 'reset'],
data() { data() {
return { return {
isEditing: false, isEditing: false,

1
admin/src/components/input/EditableGroupableLabel.vue
View File

@ -22,6 +22,7 @@ export default {
required: true, required: true,
}, },
}, },
emits: ['input'],
data() { data() {
return { return {
inputValue: this.value, inputValue: this.value,

5
admin/src/components/input/TimePicker.vue
View File

@ -1,11 +1,11 @@
<template> <template>
<div> <div>
<input <input
type="text"
v-model="timeValue" v-model="timeValue"
type="text"
placeholder="hh:mm"
@input="updateValues" @input="updateValues"
@blur="validateAndCorrect" @blur="validateAndCorrect"
placeholder="hh:mm"
/> />
</div> </div>
</template> </template>
@ -20,6 +20,7 @@ export default {
default: '00:00', default: '00:00',
}, },
}, },
emits: ['input'],
data() { data() {
return { return {
timeValue: this.value, timeValue: this.value,

70
admin/src/composables/useCreationMonths.js Normal file
View File

@ -0,0 +1,70 @@
import { ref, computed, watch } from 'vue'
import { adminOpenCreations } from '../graphql/adminOpenCreations'
import { useQuery } from '@vue/apollo-composable'
import { useI18n } from 'vue-i18n'
import toast from 'bootstrap/js/src/toast'
export default () => {
const { d } = useI18n()
const creation = ref([1000, 1000, 1000])
const userId = ref(0)
const creationDates = computed(() => {
const now = new Date(Date.now())
const dates = [now]
for (let i = 1; i < 3; i++) {
dates.push(new Date(now.getFullYear(), now.getMonth() - i, 1))
}
return dates.reverse()
})
const creationDateObjects = computed(() => {
const result = []
creationDates.value.forEach((date) => {
result.push({
short: d(date, 'month'),
long: d(date, 'long'),
year: d(date, 'year'),
date: d(date, 'short', 'en'),
})
})
return result
})
const radioOptions = () => {
return creationDateObjects.value.map((obj, idx) => {
return {
item: { ...obj, creation: creation.value[idx] },
name: obj.short + (creation.value[idx] ? ' ' + creation.value[idx] + ' GDD' : ''),
}
})
}
const creationLabel = () => {
return creationDates.value.map((date) => d(date, 'monthShort')).join(' | ')
}
const { result, error } = useQuery(adminOpenCreations, { userId }, { fetchPolicy: 'no-cache' })
watch(result, (newResult) => {
if (newResult && newResult.adminOpenCreations) {
creation.value = newResult.adminOpenCreations.map((obj) => obj.amount)
}
})
watch(error, (err) => {
if (err) {
toast.error(err.message)
}
})
return {
creation,
userId,
creationDates,
creationDateObjects,
radioOptions,
creationLabel,
}
}

33
admin/src/config/index.js
View File

@ -14,38 +14,39 @@ const constants = {
const version = { const version = {
APP_VERSION: pkg.version, APP_VERSION: pkg.version,
BUILD_COMMIT: process.env.BUILD_COMMIT ?? null, BUILD_COMMIT: import.meta.env.BUILD_COMMIT ?? null,
// self reference of `version.BUILD_COMMIT` is not possible at this point, hence the duplicate code // self reference of `version.BUILD_COMMIT` is not possible at this point, hence the duplicate code
BUILD_COMMIT_SHORT: (process.env.BUILD_COMMIT ?? '0000000').slice(0, 7), BUILD_COMMIT_SHORT: (import.meta.env.BUILD_COMMIT ?? '0000000').slice(0, 7),
PORT: process.env.PORT ?? 8080, PORT: import.meta.env.PORT ?? 8080,
} }
const environment = { const environment = {
NODE_ENV: process.env.NODE_ENV, NODE_ENV: import.meta.env.NODE_ENV,
DEBUG: process.env.NODE_ENV !== 'production' ?? false, DEBUG: import.meta.env.NODE_ENV !== 'production' ?? false,
PRODUCTION: process.env.NODE_ENV === 'production' ?? false, PRODUCTION: import.meta.env.NODE_ENV === 'production' ?? false,
} }
const COMMUNITY_HOST = process.env.COMMUNITY_HOST ?? undefined const COMMUNITY_HOST = import.meta.env.COMMUNITY_HOST ?? undefined
const URL_PROTOCOL = process.env.URL_PROTOCOL ?? 'http' const URL_PROTOCOL = import.meta.env.URL_PROTOCOL ?? 'http'
const COMMUNITY_URL = const COMMUNITY_URL =
COMMUNITY_HOST && URL_PROTOCOL ? URL_PROTOCOL + '://' + COMMUNITY_HOST : undefined COMMUNITY_HOST && URL_PROTOCOL ? URL_PROTOCOL + '://' + COMMUNITY_HOST : undefined
const WALLET_URL = process.env.WALLET_URL ?? COMMUNITY_URL ?? 'http://localhost' const WALLET_URL = import.meta.env.WALLET_URL ?? COMMUNITY_URL ?? 'http://localhost'
const endpoints = { const endpoints = {
GRAPHQL_URL: GRAPHQL_URL:
(process.env.GRAPHQL_URL ?? COMMUNITY_URL ?? 'http://localhost:4000') + (import.meta.env.GRAPHQL_URL ?? COMMUNITY_URL ?? 'http://localhost:4000') +
process.env.GRAPHQL_PATH ?? '/graphql', import.meta.env.GRAPHQL_PATH ?? '/graphql',
WALLET_AUTH_URL: WALLET_URL + (process.env.WALLET_AUTH_PATH ?? '/authenticate?token={token}'), WALLET_AUTH_URL: WALLET_URL + (import.meta.env.WALLET_AUTH_PATH ?? '/authenticate?token={token}'),
WALLET_LOGIN_URL: WALLET_URL + (process.env.WALLET_LOGIN_PATH ?? '/login'), WALLET_LOGIN_URL: WALLET_URL + (import.meta.env.WALLET_LOGIN_PATH ?? '/login'),
} }
const debug = { const debug = {
DEBUG_DISABLE_AUTH: process.env.DEBUG_DISABLE_AUTH === 'true' ?? false, DEBUG_DISABLE_AUTH: import.meta.env.DEBUG_DISABLE_AUTH === 'true' ?? false,
} }
// Check config version // Check config version
constants.CONFIG_VERSION.CURRENT = process.env.CONFIG_VERSION ?? constants.CONFIG_VERSION.DEFAULT constants.CONFIG_VERSION.CURRENT =
import.meta.env.CONFIG_VERSION ?? constants.CONFIG_VERSION.DEFAULT
if ( if (
![constants.CONFIG_VERSION.EXPECTED, constants.CONFIG_VERSION.DEFAULT].includes( ![constants.CONFIG_VERSION.EXPECTED, constants.CONFIG_VERSION.DEFAULT].includes(
constants.CONFIG_VERSION.CURRENT, constants.CONFIG_VERSION.CURRENT,
@ -64,4 +65,4 @@ const CONFIG = {
...debug, ...debug,
} }
module.exports = CONFIG export default CONFIG

29
admin/src/i18n.js
View File

@ -1,20 +1,6 @@
import Vue from 'vue' import { createI18n } from 'vue-i18n'
import VueI18n from 'vue-i18n' import de from './locales/de.json'
import en from './locales/en.json'
Vue.use(VueI18n)
const loadLocaleMessages = () => {
const locales = require.context('./locales/', true, /[A-Za-z0-9-_,\s]+\.json$/i)
const messages = {}
locales.keys().forEach((key) => {
const matched = key.match(/([A-Za-z0-9-_]+)\./i)
if (matched && matched.length > 1) {
const locale = matched[1]
messages[locale] = locales(key)
}
})
return messages
}
const numberFormats = { const numberFormats = {
en: { en: {
@ -45,7 +31,7 @@ const numberFormats = {
}, },
} }
const dateTimeFormats = { const datetimeFormats = {
en: { en: {
short: { short: {
year: 'numeric', year: 'numeric',
@ -96,12 +82,13 @@ const dateTimeFormats = {
}, },
} }
const i18n = new VueI18n({ const i18n = createI18n({
locale: 'en', locale: 'en',
legacy: false,
fallbackLocale: 'en', fallbackLocale: 'en',
messages: loadLocaleMessages(), messages: { de, en },
numberFormats, numberFormats,
dateTimeFormats, datetimeFormats,
}) })
export default i18n export default i18n

2
admin/src/layouts/defaultLayout.vue
View File

@ -10,7 +10,7 @@
import NavBar from '@/components/NavBar' import NavBar from '@/components/NavBar'
import ContentFooter from '@/components/ContentFooter' import ContentFooter from '@/components/ContentFooter'
export default { export default {
name: 'defaultLayout', name: 'DefaultLayout',
components: { components: {
NavBar, NavBar,
ContentFooter, ContentFooter,

33
admin/src/main.js
View File

@ -1,5 +1,5 @@
import Vue from 'vue' import { createApp } from 'vue'
import App from './App' import App from './App.vue'
// without this async calls are not working // without this async calls are not working
import 'regenerator-runtime' import 'regenerator-runtime'
@ -11,36 +11,35 @@ import addNavigationGuards from './router/guards'
import i18n from './i18n' import i18n from './i18n'
import VueApollo from 'vue-apollo' // import VueApollo from 'vue-apollo'
import PortalVue from 'portal-vue' import PortalVue from 'portal-vue'
import { BootstrapVue, IconsPlugin } from 'bootstrap-vue' import { createBootstrap } from 'bootstrap-vue-next'
// Add the necessary CSS
import 'bootstrap/dist/css/bootstrap.css' import 'bootstrap/dist/css/bootstrap.css'
import 'bootstrap-vue/dist/bootstrap-vue.css' import 'bootstrap-vue-next/dist/bootstrap-vue-next.css'
import { toasters } from './mixins/toaster' import { toasters } from './mixins/toaster'
import { apolloProvider } from './plugins/apolloProvider' import { apolloProvider } from './plugins/apolloProvider'
Vue.use(PortalVue) const app = createApp(App)
Vue.use(BootstrapVue)
Vue.use(IconsPlugin) app.use(router)
app.use(store)
app.use(i18n)
app.use(PortalVue)
app.use(createBootstrap())
Vue.use(VueApollo) app.use(() => apolloProvider)
Vue.mixin(toasters) app.mixin(toasters)
addNavigationGuards(router, store, apolloProvider.defaultClient, i18n) addNavigationGuards(router, store, apolloProvider.defaultClient, i18n)
i18n.locale = i18n.locale =
store.state.moderator && store.state.moderator.language ? store.state.moderator.language : 'en' store.state.moderator && store.state.moderator.language ? store.state.moderator.language : 'en'
new Vue({ app.mount('#app')
router,
store,
i18n,
apolloProvider,
render: (h) => h(App),
}).$mount('#app')

6
admin/src/pages/ContributionLinks.vue
View File

@ -22,6 +22,9 @@ export default {
count: 0, count: 0,
} }
}, },
created() {
this.getContributionLinks()
},
methods: { methods: {
getContributionLinks() { getContributionLinks() {
this.$apollo this.$apollo
@ -38,8 +41,5 @@ export default {
}) })
}, },
}, },
created() {
this.getContributionLinks()
},
} }
</script> </script>

209
admin/src/pages/CreationConfirm.vue
View File

@ -1,14 +1,14 @@
<!-- eslint-disable @intlify/vue-i18n/no-dynamic-keys --> <!-- eslint-disable @intlify/vue-i18n/no-dynamic-keys -->
<template> <template>
<div class="creation-confirm"> <div class="creation-confirm">
<user-query class="mb-2 mt-2" v-model="query" :placeholder="$t('user_memo_search')" /> <user-query v-model="query" class="mb-2 mt-2" :placeholder="$t('user_memo_search')" />
<p class="mb-2"> <p class="mb-2">
<input type="checkbox" class="noHashtag" v-model="noHashtag" /> <input v-model="noHashtag" type="checkbox" class="noHashtag" />
<span class="ml-2" v-b-tooltip="$t('no_hashtag_tooltip')">{{ $t('no_hashtag') }}</span> <span v-b-tooltip="$t('no_hashtag_tooltip')" class="ml-2">{{ $t('no_hashtag') }}</span>
</p> </p>
<p class="mb-4" v-if="showResubmissionCheckbox"> <p v-if="showResubmissionCheckbox" class="mb-4">
<input type="checkbox" class="hideResubmission" v-model="hideResubmissionModel" /> <input v-model="hideResubmissionModel" type="checkbox" class="hideResubmission" />
<span class="ml-2" v-b-tooltip="$t('hide_resubmission_tooltip')"> <span v-b-tooltip="$t('hide_resubmission_tooltip')" class="ml-2">
{{ $t('hide_resubmission') }} {{ $t('hide_resubmission') }}
</span> </span>
</p> </p>
@ -53,7 +53,7 @@
class="mt-4" class="mt-4"
:items="items" :items="items"
:fields="fields" :fields="fields"
:hideResubmission="hideResubmission" :hide-resubmission="hideResubmission"
@show-overlay="showOverlay" @show-overlay="showOverlay"
@update-status="updateStatus" @update-status="updateStatus"
@reload-contribution="reloadContribution" @reload-contribution="reloadContribution"
@ -61,9 +61,9 @@
/> />
<b-pagination <b-pagination
v-model="currentPage"
pills pills
size="lg" size="lg"
v-model="currentPage"
:per-page="pageSize" :per-page="pageSize"
:total-rows="rows" :total-rows="rows"
align="center" align="center"
@ -82,12 +82,7 @@
<p>{{ $t(overlayQuestion) }}</p> <p>{{ $t(overlayQuestion) }}</p>
</template> </template>
<template #submit-btn> <template #submit-btn>
<b-button <b-button size="md" :variant="overlayIcon" class="m-3 text-right" @click="overlayEvent">
size="md"
v-bind:variant="overlayIcon"
class="m-3 text-right"
@click="overlayEvent"
>
{{ $t(overlayBtnText) }} {{ $t(overlayBtnText) }}
</b-button> </b-button>
</template> </template>
@ -135,99 +130,6 @@ export default {
hideResubmissionModel: true, hideResubmissionModel: true,
} }
}, },
watch: {
tabIndex() {
this.currentPage = 1
},
},
methods: {
reloadContribution(id) {
this.$apollo
.query({ query: getContribution, variables: { id } })
.then((result) => {
const contribution = result.data.contribution
this.$set(
this.items,
this.items.findIndex((obj) => obj.id === contribution.id),
contribution,
)
})
.catch((error) => {
this.overlay = false
this.toastError(error.message)
})
},
deleteCreation() {
this.$apollo
.mutate({
mutation: adminDeleteContribution,
variables: {
id: this.item.id,
},
})
.then((result) => {
this.overlay = false
this.updatePendingCreations(this.item.id)
this.toastSuccess(this.$t('creation_form.toasted_delete'))
})
.catch((error) => {
this.overlay = false
this.toastError(error.message)
})
},
denyCreation() {
this.$apollo
.mutate({
mutation: denyContribution,
variables: {
id: this.item.id,
},
})
.then((result) => {
this.overlay = false
this.updatePendingCreations(this.item.id)
this.toastSuccess(this.$t('creation_form.toasted_denied'))
})
.catch((error) => {
this.overlay = false
this.toastError(error.message)
})
},
confirmCreation() {
this.$apollo
.mutate({
mutation: confirmContribution,
variables: {
id: this.item.id,
},
})
.then((result) => {
this.overlay = false
this.updatePendingCreations(this.item.id)
this.toastSuccess(this.$t('creation_form.toasted_created'))
})
.catch((error) => {
this.overlay = false
this.toastError(error.message)
})
},
updatePendingCreations(id) {
this.items = this.items.filter((obj) => obj.id !== id)
this.$store.commit('openCreationsMinus', 1)
},
showOverlay(item, variant) {
this.overlay = true
this.item = item
this.variant = variant
},
updateStatus(id) {
this.items.find((obj) => obj.id === id).messagesCount++
this.items.find((obj) => obj.id === id).status = 'IN_PROGRESS'
},
formatDateOrDash(value) {
return value ? this.$d(new Date(value), 'short') : '—'
},
},
computed: { computed: {
fields() { fields() {
return [ return [
@ -440,6 +342,99 @@ export default {
return this.showResubmissionCheckbox ? this.hideResubmissionModel : false return this.showResubmissionCheckbox ? this.hideResubmissionModel : false
}, },
}, },
watch: {
tabIndex() {
this.currentPage = 1
},
},
methods: {
reloadContribution(id) {
this.$apollo
.query({ query: getContribution, variables: { id } })
.then((result) => {
const contribution = result.data.contribution
this.$set(
this.items,
this.items.findIndex((obj) => obj.id === contribution.id),
contribution,
)
})
.catch((error) => {
this.overlay = false
this.toastError(error.message)
})
},
deleteCreation() {
this.$apollo
.mutate({
mutation: adminDeleteContribution,
variables: {
id: this.item.id,
},
})
.then((result) => {
this.overlay = false
this.updatePendingCreations(this.item.id)
this.toastSuccess(this.$t('creation_form.toasted_delete'))
})
.catch((error) => {
this.overlay = false
this.toastError(error.message)
})
},
denyCreation() {
this.$apollo
.mutate({
mutation: denyContribution,
variables: {
id: this.item.id,
},
})
.then((result) => {
this.overlay = false
this.updatePendingCreations(this.item.id)
this.toastSuccess(this.$t('creation_form.toasted_denied'))
})
.catch((error) => {
this.overlay = false
this.toastError(error.message)
})
},
confirmCreation() {
this.$apollo
.mutate({
mutation: confirmContribution,
variables: {
id: this.item.id,
},
})
.then((result) => {
this.overlay = false
this.updatePendingCreations(this.item.id)
this.toastSuccess(this.$t('creation_form.toasted_created'))
})
.catch((error) => {
this.overlay = false
this.toastError(error.message)
})
},
updatePendingCreations(id) {
this.items = this.items.filter((obj) => obj.id !== id)
this.$store.commit('openCreationsMinus', 1)
},
showOverlay(item, variant) {
this.overlay = true
this.item = item
this.variant = variant
},
updateStatus(id) {
this.items.find((obj) => obj.id === id).messagesCount++
this.items.find((obj) => obj.id === id).status = 'IN_PROGRESS'
},
formatDateOrDash(value) {
return value ? this.$d(new Date(value), 'short') : '—'
},
},
apollo: { apollo: {
ListAllContributions: { ListAllContributions: {
query() { query() {

2
admin/src/pages/FederationVisualize.vue
View File

@ -7,8 +7,8 @@
icon="arrow-clockwise" icon="arrow-clockwise"
font-scale="2" font-scale="2"
:animation="animation" :animation="animation"
@click="$apollo.queries.allCommunities.refresh()"
data-test="federation-communities-refresh-btn" data-test="federation-communities-refresh-btn"
@click="$apollo.queries.allCommunities.refresh()"
></b-icon> ></b-icon>
</b-button> </b-button>
</div> </div>

86
admin/src/pages/Overview.vue
View File

@ -1,65 +1,61 @@
<template> <template>
<div class="admin-overview"> <div class="admin-overview">
<b-card <BCard
v-show="$store.state.openCreations > 0" v-show="openCreations > 0"
border-variant="primary" border-variant="primary"
:header="$t('open_creations')" :header="$t('open_creations')"
header-bg-variant="danger" header-bg-variant="danger"
header-text-variant="white" header-text-variant="white"
align="center" align="center"
> >
<b-card-text> <BCardText>
<b-link to="creation-confirm"> <BLink to="creation-confirm">
<h1>{{ $store.state.openCreations }}</h1> <h1>{{ openCreations }}</h1>
<h1>Layout test</h1> <h1>Layout test</h1>
</b-link> </BLink>
</b-card-text> </BCardText>
</b-card> </BCard>
<b-card <BCard
v-show="$store.state.openCreations < 1" v-show="openCreations < 1"
border-variant="success" border-variant="success"
:header="$t('not_open_creations')" :header="$t('not_open_creations')"
header-bg-variant="success" header-bg-variant="success"
header-text-variant="white" header-text-variant="white"
align="center" align="center"
> >
<b-card-text> <BCardText>
<b-link to="creation-confirm"> <BLink to="creation-confirm">
<h1 data-test="open-creation">{{ $store.state.openCreations }}</h1> <h1 data-test="open-creation">{{ openCreations }}</h1>
</b-link> </BLink>
</b-card-text> </BCardText>
</b-card> </BCard>
</div> </div>
</template> </template>
<script> <script setup>
import { adminListContributions } from '../graphql/adminListContributions' import { adminListContributions } from '../graphql/adminListContributions'
import { ref, computed, onMounted } from 'vue'
import { useStore } from 'vuex'
import { useQuery } from '@vue/apollo-composable'
import { BCard, BCardText, BLink } from 'bootstrap-vue-next'
export default { const store = useStore()
name: 'overview',
data() { const statusFilter = ref(['IN_PROGRESS', 'PENDING'])
return {
statusFilter: ['IN_PROGRESS', 'PENDING'], const { result, error } = useQuery(adminListContributions, {
} statusFilter: statusFilter.value,
}, hideResubmission: true,
apollo: { })
AllContributions: {
query() { const openCreations = computed(() => result.value?.adminListContributions.contributionCount || 0)
return adminListContributions
}, onMounted(() => {
variables() { if (result.value) {
// may be at some point we need a pagination here store.commit('setOpenCreations', openCreations.value)
return { }
statusFilter: this.statusFilter,
hideResubmission: true, if (error.value) {
} // store.dispatch('toastError', error.value.message)
}, }
update({ adminListContributions }) { })
this.$store.commit('setOpenCreations', adminListContributions.contributionCount)
},
error({ message }) {
this.toastError(message)
},
},
},
}
</script> </script>

233
admin/src/pages/UserSearch.vue
View File

@ -1,150 +1,159 @@
<template> <template>
<div class="user-search"> <div class="user-search">
<div class="user-search-first-div"> <div class="user-search-first-div">
<b-button class="unconfirmedRegisterMails" variant="light" @click="unconfirmedRegisterMails"> <BButton class="unconfirmedRegisterMails" variant="light" @click="unconfirmedRegisterMails">
<b-icon icon="envelope" variant="danger"></b-icon> <IBiEnvelope style="color: #f5365c" />
{{ {{
filters.byActivated === null filters.byActivated === null
? $t('all_emails') ? $t('all_emails')
: filters.byActivated === false : filters.byActivated === false
? $t('unregistered_emails') ? $t('unregistered_emails')
: '' : ''
}} }}
</b-button> </BButton>
<b-button class="deletedUserSearch" variant="light" @click="deletedUserSearch"> <BButton class="deletedUserSearch" variant="light" @click="deletedUserSearch">
<b-icon icon="x-circle" variant="danger"></b-icon> <IBiXCircle style="color: #f5365c" />
{{ {{
filters.byDeleted === null filters.byDeleted === null
? $t('all_emails') ? $t('all_emails')
: filters.byDeleted === true : filters.byDeleted === true
? $t('deleted_user') ? $t('deleted_user')
: '' : ''
}} }}
</b-button> </BButton>
</div> </div>
<label>{{ $t('user_search') }}</label> <label>{{ $t('user_search') }}</label>
<user-query class="mb-4 mt-2" v-model="criteria" /> <UserQuery v-model="criteria" class="mb-4 mt-2" />
<search-user-table <SearchUserTable
type="PageUserSearch" type="PageUserSearch"
:items="searchResult" :items="searchResult"
:fields="fields" :fields="fields"
@updateRoles="updateRoles" @update-roles="updateRoles"
@updateDeletedAt="updateDeletedAt" @update-deleted-at="updateDeletedAt"
/> />
<b-pagination <BPagination
pills
size="lg"
v-model="currentPage" v-model="currentPage"
:per-page="perPage" :per-page="perPage"
:total-rows="rows" :total-rows="rows"
align="center" align="center"
:hide-ellipsis="true" :hide-ellipsis="true"
></b-pagination> pills
<div></div> size="lg"
/>
</div> </div>
</template> </template>
<script> <script setup>
import { ref, reactive, computed, watch, watchEffect } from 'vue'
import { useQuery } from '@vue/apollo-composable'
import { searchUsers } from '../graphql/searchUsers.js'
import useCreationMonths from '../composables/useCreationMonths'
import SearchUserTable from '../components/Tables/SearchUserTable' import SearchUserTable from '../components/Tables/SearchUserTable'
import { searchUsers } from '../graphql/searchUsers'
import { creationMonths } from '../mixins/creationMonths'
import UserQuery from '../components/UserQuery' import UserQuery from '../components/UserQuery'
import { BPagination, BButton } from 'bootstrap-vue-next'
import { useI18n } from 'vue-i18n'
export default { const { t } = useI18n()
name: 'UserSearch',
mixins: [creationMonths], const searchResult = ref([])
components: { const criteria = ref('')
SearchUserTable, const filters = reactive({
UserQuery, byActivated: null,
byDeleted: null,
})
const rows = ref(0)
const currentPage = ref(1)
const perPage = ref(25)
const response = ref()
const { creationLabel } = useCreationMonths()
const { result, refetch } = useQuery(searchUsers, {
query: criteria.value,
filters: filters,
currentPage: currentPage.value,
pageSize: perPage.value,
order: 'DESC',
fetchPolicy: 'no-cache',
})
response.value = result.value
watchEffect(() => {
if (result.value) {
searchResult.value = result.value.searchUsers.userList
rows.value = result.value.searchUsers.userCount
}
})
const updateRoles = (userId, roles) => {
searchResult.value.find((obj) => obj.userId === userId).roles = roles
}
const updateDeletedAt = (userId, deletedAt) => {
searchResult.value.find((obj) => obj.userId === userId).deletedAt = deletedAt
// toastSuccess(deletedAt ? $t('user_deleted') : $t('user_recovered'))
}
const unconfirmedRegisterMails = () => {
filters.byActivated = filters.byActivated === null ? false : null
refetch()
}
const deletedUserSearch = () => {
filters.byDeleted = filters.byDeleted === null ? true : null
refetch()
}
const fields = computed(() => [
{ key: 'email', label: t('e_mail') },
{ key: 'firstName', label: t('firstname') },
{ key: 'lastName', label: t('lastname') },
{
key: 'creation',
label: creationLabel(),
formatter: (value, key, item) => {
return value.join(' | ')
},
}, },
data() { // { key: 'show_details', label: t('details') },
return { // { key: 'confirm_mail', label: t('confirmed') },
showArrays: false, // { key: 'has_elopage', label: 'elopage' },
searchResult: [], // { key: 'transactions_list', label: t('transaction') },
criteria: '', { key: 'status', label: t('status') },
filters: { ])
byActivated: null,
byDeleted: null, watch(
}, () => currentPage.value,
rows: 0, async (newValue, oldValue) => {
currentPage: 1, if (newValue !== oldValue) {
perPage: 25, await refetch({
now: Date.now(), query: criteria.value,
filters: filters,
currentPage: newValue,
pageSize: perPage.value,
order: 'DESC',
fetchPolicy: 'no-cache',
})
} }
}, },
methods: { )
unconfirmedRegisterMails() {
this.filters.byActivated = this.filters.byActivated === null ? false : null watch(
this.getUsers() () => criteria.value,
}, async (newValue, oldValue) => {
deletedUserSearch() { if (newValue !== oldValue) {
this.filters.byDeleted = this.filters.byDeleted === null ? true : null await refetch({
this.getUsers() query: newValue,
}, })
getUsers() { }
this.$apollo
.query({
query: searchUsers,
variables: {
query: this.criteria,
filters: this.filters,
currentPage: this.currentPage,
pageSize: this.perPage,
order: 'DESC',
},
fetchPolicy: 'no-cache',
})
.then((result) => {
this.rows = result.data.searchUsers.userCount
this.searchResult = result.data.searchUsers.userList
})
.catch((error) => {
this.toastError(error.message)
})
},
updateRoles(userId, roles) {
this.searchResult.find((obj) => obj.userId === userId).roles = roles
},
updateDeletedAt(userId, deletedAt) {
this.searchResult.find((obj) => obj.userId === userId).deletedAt = deletedAt
this.toastSuccess(deletedAt ? this.$t('user_deleted') : this.$t('user_recovered'))
},
}, },
watch: { )
currentPage() {
this.getUsers()
},
criteria() {
this.getUsers()
},
},
computed: {
fields() {
return [
{ key: 'email', label: this.$t('e_mail') },
{ key: 'firstName', label: this.$t('firstname') },
{ key: 'lastName', label: this.$t('lastname') },
{
key: 'creation',
label: this.creationLabel,
formatter: (value, key, item) => {
return value.join(' | ')
},
},
// { key: 'show_details', label: this.$t('details') },
// { key: 'confirm_mail', label: this.$t('confirmed') },
// { key: 'has_elopage', label: 'elopage' },
// { key: 'transactions_list', label: this.$t('transaction') },
{ key: 'status', label: this.$t('status') },
]
},
},
created() {
this.getUsers()
},
}
</script> </script>
<style> <style scoped>
.user-search-first-div { .user-search-first-div {
text-align: right; text-align: right;
} }
img,
svg {
vertical-align: text-bottom;
}
</style> </style>

3
admin/src/plugins/apolloProvider.js
View File

@ -2,6 +2,7 @@ import { ApolloClient, ApolloLink, InMemoryCache, HttpLink } from 'apollo-boost'
import VueApollo from 'vue-apollo' import VueApollo from 'vue-apollo'
import CONFIG from '../config' import CONFIG from '../config'
import store from '../store/store' import store from '../store/store'
import { provideApolloClient } from '@vue/apollo-composable'
const httpLink = new HttpLink({ uri: CONFIG.GRAPHQL_URI }) const httpLink = new HttpLink({ uri: CONFIG.GRAPHQL_URI })
@ -30,6 +31,8 @@ const apolloClient = new ApolloClient({
cache: new InMemoryCache(), cache: new InMemoryCache(),
}) })
provideApolloClient(apolloClient)
export const apolloProvider = new VueApollo({ export const apolloProvider = new VueApollo({
defaultClient: apolloClient, defaultClient: apolloClient,
}) })

12
admin/src/router/router.js
View File

@ -1,14 +1,10 @@
import Vue from 'vue' import { createRouter, createWebHistory } from 'vue-router'
import VueRouter from 'vue-router'
import routes from './routes' import routes from './routes'
Vue.use(VueRouter) const router = createRouter({
const router = new VueRouter({
base: '/admin',
routes, routes,
linkActiveClass: 'active', linkActiveClass: 'active',
mode: 'history', history: createWebHistory('/admin/'),
scrollBehavior: (to, from, savedPosition) => { scrollBehavior: (to, from, savedPosition) => {
if (savedPosition) { if (savedPosition) {
return savedPosition return savedPosition
@ -16,7 +12,7 @@ const router = new VueRouter({
if (to.hash) { if (to.hash) {
return { selector: to.hash } return { selector: to.hash }
} }
return { x: 0, y: 0 } return { left: 0, top: 0 }
}, },
}) })

9
admin/src/router/routes.js
View File

@ -27,14 +27,15 @@ const routes = [
path: '/contribution-links', path: '/contribution-links',
component: () => import('@/pages/ContributionLinks.vue'), component: () => import('@/pages/ContributionLinks.vue'),
}, },
{
path: '*',
component: () => import('@/components/NotFoundPage.vue'),
},
{ {
path: '/federation', path: '/federation',
component: () => import('@/pages/FederationVisualize.vue'), component: () => import('@/pages/FederationVisualize.vue'),
}, },
{
path: '/:catchAll(.*)',
name: 'NotFound',
component: () => import('@/components/NotFoundPage.vue'),
},
] ]
export default routes export default routes

7
admin/src/store/store.js
View File

@ -1,10 +1,7 @@
import Vuex from 'vuex' import { createStore } from 'vuex'
import Vue from 'vue'
import createPersistedState from 'vuex-persistedstate' import createPersistedState from 'vuex-persistedstate'
import CONFIG from '../config' import CONFIG from '../config'
Vue.use(Vuex)
export const mutations = { export const mutations = {
openCreationsPlus: (state, i) => { openCreationsPlus: (state, i) => {
state.openCreations += i state.openCreations += i
@ -34,7 +31,7 @@ export const actions = {
}, },
} }
const store = new Vuex.Store({ const store = createStore({
plugins: [ plugins: [
createPersistedState({ createPersistedState({
key: 'gradido-admin', key: 'gradido-admin',

46
admin/vite.config.js Normal file
View File

@ -0,0 +1,46 @@
import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
import commonjs from 'vite-plugin-commonjs'
import Icons from 'unplugin-icons/vite'
import Components from 'unplugin-vue-components/vite'
import IconsResolve from 'unplugin-icons/resolver'
const path = require('path')
export default defineConfig({
base: '/admin/',
server: {
host: '0.0.0.0',
port: 8080,
},
resolve: {
alias: {
'@': path.resolve(__dirname, './src'),
assets: path.join(__dirname, 'src/assets'),
},
extensions: ['.mjs', '.js', '.ts', '.jsx', '.tsx', '.json', '.vue'],
},
plugins: [
vue({
template: {
compilerOptions: {
compatConfig: {
MODE: 2,
},
},
},
}),
Components({
resolvers: [IconsResolve()],
dts: true,
}),
Icons({
compiler: 'vue3',
}),
commonjs(),
],
build: {
outDir: 'build',
},
})

21
admin/vue.config.js
View File

@ -20,6 +20,23 @@ module.exports = {
}, },
lintOnSave: true, lintOnSave: true,
publicPath: '/admin', publicPath: '/admin',
chainWebpack: (config) => {
config.resolve.alias.set('vue', '@vue/compat')
config.module
.rule('vue')
.use('vue-loader')
.tap((options) => {
return {
...options,
compilerOptions: {
compatConfig: {
MODE: 2,
},
},
}
})
},
configureWebpack: { configureWebpack: {
// Set up all the aliases we use in our app. // Set up all the aliases we use in our app.
resolve: { resolve: {
@ -35,14 +52,14 @@ module.exports = {
// 'process.env.DOCKER_WORKDIR': JSON.stringify(process.env.DOCKER_WORKDIR), // 'process.env.DOCKER_WORKDIR': JSON.stringify(process.env.DOCKER_WORKDIR),
// 'process.env.BUILD_DATE': JSON.stringify(process.env.BUILD_DATE), // 'process.env.BUILD_DATE': JSON.stringify(process.env.BUILD_DATE),
// 'process.env.BUILD_VERSION': JSON.stringify(process.env.BUILD_VERSION), // 'process.env.BUILD_VERSION': JSON.stringify(process.env.BUILD_VERSION),
'process.env.BUILD_COMMIT': JSON.stringify(CONFIG.BUILD_COMMIT), 'import.meta.env.BUILD_COMMIT': JSON.stringify(CONFIG.BUILD_COMMIT),
// 'process.env.PORT': JSON.stringify(process.env.PORT), // 'process.env.PORT': JSON.stringify(process.env.PORT),
}), }),
// generate webpack stats to allow analysis of the bundlesize // generate webpack stats to allow analysis of the bundlesize
new StatsPlugin('webpack.stats.json'), new StatsPlugin('webpack.stats.json'),
], ],
infrastructureLogging: { infrastructureLogging: {
level: 'warn', // 'none' | 'error' | 'warn' | 'info' | 'log' | 'verbose' level: 'info', // 'none' | 'error' | 'warn' | 'info' | 'log' | 'verbose'
}, },
}, },
css: { css: {

12562
admin/yarn.lock
View File

File diff suppressed because it is too large Load Diff

2
nginx/gradido.conf
View File

@ -81,4 +81,4 @@ server {
#} #}
#access_log /var/log/nginx/access.log main; #access_log /var/log/nginx/access.log main;
} }