mirror of
https://github.com/IT4Change/gradido.git
synced 2026-01-20 20:01:31 +00:00
adminbereich, übersicht, usersuche, schöpfen, schöpfung bestätigen
This commit is contained in:
ogerly
parent
4cb7abdc9b
commit
7cc4d8e5e2
@ -1,66 +0,0 @@
|
||||
<template>
|
||||
<div>
|
||||
<b-form>
|
||||
<b-row class="m-4">
|
||||
<b-col>
|
||||
<b-form-radio name="radio-size" size="lg">{{ MonatBevorLast }}</b-form-radio>
|
||||
</b-col>
|
||||
<b-col>
|
||||
<b-form-radio name="radio-size" size="lg">{{ MonatLast }}</b-form-radio>
|
||||
</b-col>
|
||||
<b-col>
|
||||
<b-form-radio name="radio-size" size="lg">{{ MonatAktuell }}</b-form-radio>
|
||||
</b-col>
|
||||
</b-row>
|
||||
<b-row class="m-4">
|
||||
<div>
|
||||
<b-form-textarea
|
||||
id="textarea-state"
|
||||
v-model="text"
|
||||
:state="text.length >= 10"
|
||||
placeholder="Enter at least 10 characters"
|
||||
rows="3"
|
||||
></b-form-textarea>
|
||||
</div>
|
||||
</b-row>
|
||||
<b-row class="m-4">
|
||||
<label for="range-2 h4">
|
||||
Betrag Auswählen
|
||||
<span class="mt-2 h3" v-if="value > 0">{{ value }} GDD</span>
|
||||
</label>
|
||||
<b-input
|
||||
id="range-2"
|
||||
v-model="value"
|
||||
type="range"
|
||||
min="0"
|
||||
max="1000"
|
||||
step="10"
|
||||
class="mr-4 ml-4"
|
||||
></b-input>
|
||||
</b-row>
|
||||
<b-row class="m-4">
|
||||
<b-col class="text-center"><b-button type="reset" variant="danger">Reset</b-button></b-col>
|
||||
<b-col class="text-center">
|
||||
<div class="text-right">
|
||||
<b-button type="submit" variant="primary">Submit</b-button>
|
||||
</div>
|
||||
</b-col>
|
||||
</b-row>
|
||||
</b-form>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
name: 'CreateFormular',
|
||||
data() {
|
||||
return {
|
||||
text: 'datatext',
|
||||
value: 0,
|
||||
MonatAktuell: this.$moment().format('MMMM'),
|
||||
MonatLast: this.$moment().subtract(1, 'month').format('MMMM'),
|
||||
MonatBevorLast: this.$moment().subtract(2, 'month').format('MMMM'),
|
||||
}
|
||||
},
|
||||
created() {},
|
||||
}
|
||||
</script>
|
||||
22
admin/src/components/CreationFormular.spec.js
Normal file
22
admin/src/components/CreationFormular.spec.js
Normal file
@ -0,0 +1,22 @@
|
||||
import { mount } from '@vue/test-utils'
|
||||
import CreationFormular from './CreationFormular.vue'
|
||||
|
||||
const localVue = global.localVue
|
||||
|
||||
describe('CreationFormular', () => {
|
||||
let wrapper
|
||||
|
||||
const Wrapper = () => {
|
||||
return mount(CreationFormular, { localVue })
|
||||
}
|
||||
|
||||
describe('mount', () => {
|
||||
beforeEach(() => {
|
||||
wrapper = Wrapper()
|
||||
})
|
||||
|
||||
it('have a DIV element with the class.componente-creation-formular', () => {
|
||||
expect(wrapper.find('.componente-creation-formular').exists()).toBeTruthy()
|
||||
})
|
||||
})
|
||||
})
|
||||
114
admin/src/components/CreationFormular.vue
Normal file
114
admin/src/components/CreationFormular.vue
Normal file
@ -0,0 +1,114 @@
|
||||
<template>
|
||||
<div class="componente-creation-formular">
|
||||
<div class="shadow p-3 mb-5 bg-white rounded">
|
||||
<b-form>
|
||||
<b-row class="">
|
||||
<b-col>
|
||||
<b-form-radio
|
||||
v-model="radioSelected"
|
||||
:value="MonatBevorLast"
|
||||
size="lg"
|
||||
@change="updateRadioSelected(MonatBevorLast, 0, creation[0])"
|
||||
>
|
||||
{{ MonatBevorLast }} {{ creation[0] != null ? creation[0] + ' GDD' : '' }}
|
||||
</b-form-radio>
|
||||
</b-col>
|
||||
<b-col>
|
||||
<b-form-radio
|
||||
v-model="radioSelected"
|
||||
:value="MonatLast"
|
||||
size="lg"
|
||||
@change="updateRadioSelected(MonatLast, 1, creation[1])"
|
||||
>
|
||||
{{ MonatLast }} {{ creation[1] != null ? creation[1] + ' GDD' : '' }}
|
||||
</b-form-radio>
|
||||
</b-col>
|
||||
<b-col>
|
||||
<b-form-radio
|
||||
v-model="radioSelected"
|
||||
:value="MonatAktuell"
|
||||
size="lg"
|
||||
@change="updateRadioSelected(MonatAktuell, 2, creation[2])"
|
||||
>
|
||||
{{ MonatAktuell }} {{ creation[2] != null ? creation[2] + ' GDD' : '' }}
|
||||
</b-form-radio>
|
||||
</b-col>
|
||||
</b-row>
|
||||
<b-row class="m-4">
|
||||
<label for="range-2 h4">
|
||||
Betrag Auswählen
|
||||
<span class="mt-2 h3" v-if="value > 0">{{ value }} GDD</span>
|
||||
</label>
|
||||
<b-input
|
||||
id="range-2"
|
||||
v-model="value"
|
||||
type="range"
|
||||
:min="rangeMin"
|
||||
:max="rangeMax"
|
||||
step="10"
|
||||
class="mr-4 ml-4"
|
||||
></b-input>
|
||||
</b-row>
|
||||
<b-row class="m-4">
|
||||
<div>
|
||||
<b-form-textarea
|
||||
id="textarea-state"
|
||||
v-model="text"
|
||||
:state="text.length >= 10"
|
||||
placeholder="Enter at least 10 characters"
|
||||
rows="3"
|
||||
></b-form-textarea>
|
||||
</div>
|
||||
</b-row>
|
||||
<b-row class="m-4">
|
||||
<b-col class="text-center">
|
||||
<b-button type="reset" variant="danger">Reset</b-button>
|
||||
</b-col>
|
||||
<b-col class="text-center">
|
||||
<div class="text-right">
|
||||
<b-button type="submit" variant="primary">Submit ({{ type }})</b-button>
|
||||
</div>
|
||||
</b-col>
|
||||
</b-row>
|
||||
</b-form>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
name: 'CreationFormular',
|
||||
props: ['type', 'creation'],
|
||||
data() {
|
||||
return {
|
||||
radioSelected: '',
|
||||
text: 'datatext',
|
||||
value: 0,
|
||||
rangeMin: 0,
|
||||
rangeMax: 1000,
|
||||
MonatAktuell: this.$moment().format('MMMM'),
|
||||
MonatLast: this.$moment().subtract(1, 'month').format('MMMM'),
|
||||
MonatBevorLast: this.$moment().subtract(2, 'month').format('MMMM'),
|
||||
}
|
||||
},
|
||||
created() {},
|
||||
methods: {
|
||||
updateRadioSelected(name, index, openCreation) {
|
||||
// console.log(
|
||||
// 'CreationFormular.vue updateRadioSelected(' + name + ',' + index + ', ' + openCreation + ')',
|
||||
// )
|
||||
if (this.type === 'massCreation') {
|
||||
// console.log("updateRadioSelected type=> '", this.type)
|
||||
|
||||
this.$emit('update-radio-selected', [name, index])
|
||||
} else {
|
||||
// console.log("updateRadioSelected type=> '", this.type)
|
||||
|
||||
this.rangeMin = 0
|
||||
this.rangeMax = openCreation
|
||||
|
||||
// console.log("this.rangeMax => '", this.rangeMax)
|
||||
}
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
22
admin/src/components/NavBar.spec.js
Normal file
22
admin/src/components/NavBar.spec.js
Normal file
@ -0,0 +1,22 @@
|
||||
import { mount } from '@vue/test-utils'
|
||||
import NavBar from './NavBar.vue'
|
||||
|
||||
const localVue = global.localVue
|
||||
|
||||
describe('NavBar', () => {
|
||||
let wrapper
|
||||
|
||||
const Wrapper = () => {
|
||||
return mount(NavBar, { localVue })
|
||||
}
|
||||
|
||||
describe('mount', () => {
|
||||
beforeEach(() => {
|
||||
wrapper = Wrapper()
|
||||
})
|
||||
|
||||
it('have a DIV element with the class.componente-nabvar', () => {
|
||||
expect(wrapper.find('.componente-nabvar').exists()).toBeTruthy()
|
||||
})
|
||||
})
|
||||
})
|
||||
@ -1,19 +1,18 @@
|
||||
<template>
|
||||
<div>
|
||||
<div>
|
||||
<b-navbar toggleable="sm" type="dark" variant="info">
|
||||
<b-navbar-brand to="/">Adminbereich</b-navbar-brand>
|
||||
<div class="componente-nabvar">
|
||||
<b-navbar toggleable="sm" type="dark" variant="success">
|
||||
<b-navbar-brand to="/">Adminbereich</b-navbar-brand>
|
||||
|
||||
<b-navbar-toggle target="nav-collapse"></b-navbar-toggle>
|
||||
<b-navbar-toggle target="nav-collapse"></b-navbar-toggle>
|
||||
|
||||
<b-collapse id="nav-collapse" is-nav>
|
||||
<b-navbar-nav>
|
||||
<b-nav-item to="/user">User</b-nav-item>
|
||||
<b-nav-item to="/creation">Schöpfen</b-nav-item>
|
||||
</b-navbar-nav>
|
||||
</b-collapse>
|
||||
<b-navbar-brand href="http://localhost:3000/vue/login">Profilbereich</b-navbar-brand>
|
||||
</b-navbar>
|
||||
</div>
|
||||
<b-collapse id="nav-collapse" is-nav>
|
||||
<b-navbar-nav>
|
||||
<b-nav-item to="/user">Usersuche |</b-nav-item>
|
||||
<b-nav-item to="/creation">Schöpfen |</b-nav-item>
|
||||
<b-nav-item to="/creation-confirm">offene Schöpfungen</b-nav-item>
|
||||
</b-navbar-nav>
|
||||
</b-collapse>
|
||||
<b-navbar-brand href="http://localhost:3000/vue/login">Profilbereich</b-navbar-brand>
|
||||
</b-navbar>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
22
admin/src/components/UserTable.spec.js
Normal file
22
admin/src/components/UserTable.spec.js
Normal file
@ -0,0 +1,22 @@
|
||||
import { mount } from '@vue/test-utils'
|
||||
import UserTable from './UserTable.vue'
|
||||
|
||||
const localVue = global.localVue
|
||||
|
||||
describe('UserTable', () => {
|
||||
let wrapper
|
||||
|
||||
const Wrapper = () => {
|
||||
return mount(UserTable, { localVue })
|
||||
}
|
||||
|
||||
describe('mount', () => {
|
||||
beforeEach(() => {
|
||||
wrapper = Wrapper()
|
||||
})
|
||||
|
||||
it('have a DIV element with the class.componente-user-table', () => {
|
||||
expect(wrapper.find('.componente-user-table').exists()).toBeTruthy()
|
||||
})
|
||||
})
|
||||
})
|
||||
@ -1,24 +1,8 @@
|
||||
<template>
|
||||
<div>
|
||||
<b-table :items="items" :fields="fields" :filter="criteria" caption-top striped hover>
|
||||
<template #cell(checkbox)="row">
|
||||
<!-- As `row.showDetails` is one-way, we call the toggleDetails function on @change -->
|
||||
<b-form-checkbox v-model="row.detailsShowing" @change="row.toggleDetails">
|
||||
Details via check
|
||||
</b-form-checkbox>
|
||||
</template>
|
||||
<template #table-caption>
|
||||
<div>
|
||||
<b-form-input
|
||||
v-model="criteria"
|
||||
placeholder="User suche"
|
||||
class="bg-color-gray"
|
||||
></b-form-input>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<div class="componente-user-table">
|
||||
<b-table :items="itemsUser" :fields="fieldsTable" :filter="criteria" caption-top striped hover>
|
||||
<template #cell(show_details)="row">
|
||||
<b-button size="sm" @click="row.toggleDetails" class="mr-2">
|
||||
<b-button variant="info" size="sm" @click="row.toggleDetails" class="mr-2">
|
||||
{{ row.detailsShowing ? 'Hide' : 'Show' }} Details
|
||||
</b-button>
|
||||
</template>
|
||||
@ -26,63 +10,94 @@
|
||||
<template #row-details="row">
|
||||
<b-card>
|
||||
<b-row class="mb-2">
|
||||
<b-col sm="3" class="text-sm-right"><b>Age:</b></b-col>
|
||||
<b-col>{{ row.item.age }}</b-col>
|
||||
<b-col>
|
||||
<h3>{{ row.item.first_name }} {{ row.item.last_name }}</h3>
|
||||
</b-col>
|
||||
</b-row>
|
||||
|
||||
<b-row class="mb-2">
|
||||
<b-col sm="3" class="text-sm-right"><b>Is Active:</b></b-col>
|
||||
<b-col>{{ row.item.isActive }}</b-col>
|
||||
</b-row>
|
||||
<create-formular />
|
||||
<creation-formular
|
||||
type="singleCreation"
|
||||
:creation="getCreationInMonths(row.item.creation)"
|
||||
/>
|
||||
|
||||
<b-button size="sm" @click="row.toggleDetails">Hide Details</b-button>
|
||||
</b-card>
|
||||
</template>
|
||||
|
||||
<template #cell(bookmark)="row">
|
||||
<b-button
|
||||
variant="warning"
|
||||
v-show="type == 'UserListSearch'"
|
||||
size="sm"
|
||||
@click="bookmarkPush(row.item, row.index, $event.target)"
|
||||
class="mr-2"
|
||||
>
|
||||
merken
|
||||
</b-button>
|
||||
<b-button
|
||||
variant="danger"
|
||||
v-show="type == 'UserListMassCreation' || type == 'PageCreationConfirm'"
|
||||
size="sm"
|
||||
@click="bookmarkRemove(row.item, row.index, $event.target)"
|
||||
class="mr-2"
|
||||
>
|
||||
löschen
|
||||
</b-button>
|
||||
<b-button
|
||||
variant="success"
|
||||
v-show="type == 'PageCreationConfirm'"
|
||||
size="sm"
|
||||
@click="bookmarkConfirm(row.item, row.index, $event.target)"
|
||||
class="mr-2"
|
||||
>
|
||||
bestätigen
|
||||
</b-button>
|
||||
</template>
|
||||
</b-table>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import CreateFormular from '../components/CreateFormular.vue'
|
||||
import CreationFormular from '../components/CreationFormular.vue'
|
||||
|
||||
export default {
|
||||
name: 'UserTable',
|
||||
props: ['count', 'area'],
|
||||
props: ['type', 'itemsUser', 'fieldsTable', 'criteria', 'creation'],
|
||||
components: {
|
||||
CreateFormular,
|
||||
CreationFormular,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
criteria: '',
|
||||
fields: ['checkbox', 'email', 'first_name', 'last_name', 'creation', 'show_details'],
|
||||
items: [
|
||||
{
|
||||
email: 'dickerson@web.de',
|
||||
first_name: 'Dickerson',
|
||||
last_name: 'Macdonald',
|
||||
creation: '0,200, 1000',
|
||||
},
|
||||
{
|
||||
email: 'larsen@woob.de',
|
||||
first_name: 'Larsen',
|
||||
last_name: 'Shaw',
|
||||
creation: '0,200, 1000',
|
||||
},
|
||||
{
|
||||
email: 'geneva@tete.de',
|
||||
first_name: 'Geneva',
|
||||
last_name: 'Wilson',
|
||||
creation: '0,200, 1000',
|
||||
},
|
||||
{
|
||||
email: 'viewrter@asdfvb.com',
|
||||
first_name: 'Soledare',
|
||||
last_name: 'Takker',
|
||||
creation: '100,400, 800',
|
||||
},
|
||||
],
|
||||
}
|
||||
return {}
|
||||
},
|
||||
methods: {
|
||||
bookmarkPush(item, index, button) {
|
||||
// console.log('bookmarking item', item)
|
||||
// console.log('bookmarking index', index)
|
||||
// console.log('bookmarking button', button)
|
||||
|
||||
this.$emit('update-item', item, 'push')
|
||||
},
|
||||
bookmarkRemove(item, index, button) {
|
||||
// console.log('bookmarking item', item)
|
||||
// console.log('bookmarking index', index)
|
||||
// console.log('bookmarking button', button)
|
||||
if (this.type === 'UserListMassCreation') {
|
||||
this.$emit('update-item', item, 'remove')
|
||||
}
|
||||
|
||||
if (this.type === 'PageCreationConfirm') {
|
||||
this.$emit('update-confirm-result', item, 'remove')
|
||||
}
|
||||
},
|
||||
bookmarkConfirm(item, index, button) {
|
||||
alert('die schöpfung bestätigen und abschließen')
|
||||
alert(JSON.stringify(item))
|
||||
this.$emit('update-confirm-result', item, 'remove')
|
||||
},
|
||||
getCreationInMonths(creation) {
|
||||
// console.log('getCreationInMonths', creation)
|
||||
return creation.split(',')
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
@ -1,16 +1 @@
|
||||
{
|
||||
"monthNames": {
|
||||
"January": "",
|
||||
"February": "",
|
||||
"March": "",
|
||||
"April": "",
|
||||
"May": "",
|
||||
"June": "",
|
||||
"July": "",
|
||||
"August": "",
|
||||
"September": "",
|
||||
"October": "",
|
||||
"November": "",
|
||||
"December": ""
|
||||
}
|
||||
}
|
||||
{}
|
||||
|
||||
@ -13,9 +13,9 @@ import VueApollo from 'vue-apollo'
|
||||
|
||||
import CONFIG from './config'
|
||||
|
||||
import { BootstrapVue } from 'bootstrap-vue'
|
||||
import 'bootstrap-vue/dist/bootstrap-vue.css'
|
||||
import { BootstrapVue, IconsPlugin } from 'bootstrap-vue'
|
||||
import 'bootstrap/dist/css/bootstrap.css'
|
||||
import 'bootstrap-vue/dist/bootstrap-vue.css'
|
||||
|
||||
import moment from 'vue-moment'
|
||||
|
||||
@ -52,6 +52,8 @@ const apolloProvider = new VueApollo({
|
||||
})
|
||||
|
||||
Vue.use(BootstrapVue)
|
||||
Vue.use(IconsPlugin)
|
||||
|
||||
Vue.use(moment)
|
||||
|
||||
addNavigationGuards(router, store)
|
||||
|
||||
@ -5,10 +5,13 @@ import CONFIG from './config'
|
||||
import Vue from 'vue'
|
||||
import Vuex from 'vuex'
|
||||
import VueI18n from 'vue-i18n'
|
||||
import { BootstrapVue, IconsPlugin } from 'bootstrap-vue'
|
||||
import moment from 'vue-moment'
|
||||
|
||||
jest.mock('vue')
|
||||
jest.mock('vuex')
|
||||
jest.mock('vue-i18n')
|
||||
jest.mock('moment')
|
||||
|
||||
const storeMock = jest.fn()
|
||||
Vuex.Store = storeMock
|
||||
@ -25,6 +28,16 @@ jest.mock('apollo-boost', () => {
|
||||
}
|
||||
})
|
||||
|
||||
jest.mock('bootstrap-vue', () => {
|
||||
return {
|
||||
__esModule: true,
|
||||
BootstrapVue: jest.fn(),
|
||||
IconsPlugin: jest.fn(() => {
|
||||
return { concat: jest.fn() }
|
||||
}),
|
||||
}
|
||||
})
|
||||
|
||||
describe('main', () => {
|
||||
it('calls the HttpLink', () => {
|
||||
expect(HttpLink).toBeCalledWith({ uri: CONFIG.GRAPHQL_URI })
|
||||
@ -50,6 +63,18 @@ describe('main', () => {
|
||||
expect(VueI18n).toBeCalled()
|
||||
})
|
||||
|
||||
it('calls BootstrapVue', () => {
|
||||
expect(BootstrapVue).toBeCalled()
|
||||
})
|
||||
|
||||
it('calls IconsPlugin', () => {
|
||||
expect(IconsPlugin).toBeCalled()
|
||||
})
|
||||
|
||||
it('calls Moment', () => {
|
||||
expect(moment).toBeCalled()
|
||||
})
|
||||
|
||||
it.skip('creates a store', () => {
|
||||
expect(storeMock).toBeCalled()
|
||||
})
|
||||
|
||||
@ -27,6 +27,13 @@ const routes = [
|
||||
requiresAuth: true,
|
||||
},
|
||||
},
|
||||
{
|
||||
path: '/creation-confirm',
|
||||
component: () => import('@/views/CreationConfirm.vue'),
|
||||
meta: {
|
||||
requiresAuth: true,
|
||||
},
|
||||
},
|
||||
{
|
||||
path: '*',
|
||||
component: () => import('@/components/NotFoundPage.vue'),
|
||||
|
||||
@ -1,9 +1,178 @@
|
||||
<template>
|
||||
<div>
|
||||
<b-row>
|
||||
<b-col>
|
||||
<div>UserListe zum auswählen (itemsList)</div>
|
||||
<label>Usersuche</label>
|
||||
<b-input
|
||||
type="text"
|
||||
v-model="criteria"
|
||||
class="shadow p-3 mb-5 bg-white rounded"
|
||||
placeholder="User suche"
|
||||
></b-input>
|
||||
<user-table
|
||||
type="UserListSearch"
|
||||
:itemsUser="itemsList"
|
||||
:fieldsTable="Searchfields"
|
||||
:criteria="criteria"
|
||||
:creation="creation"
|
||||
@update-item="updateItem"
|
||||
/>
|
||||
</b-col>
|
||||
<b-col class="shadow p-3 mb-5 rounded bg-info">
|
||||
<div>UserListe zum schöpfen (massCreation)</div>
|
||||
<creation-formular
|
||||
type="massCreation"
|
||||
:creation="creation"
|
||||
@update-radio-selected="updateRadioSelected"
|
||||
/>
|
||||
<user-table
|
||||
class="shadow p-3 mb-5 bg-white rounded"
|
||||
type="UserListMassCreation"
|
||||
:itemsUser="massCreation"
|
||||
:fieldsTable="fields"
|
||||
:criteria="null"
|
||||
:creation="creation"
|
||||
@update-item="updateItem"
|
||||
/>
|
||||
</b-col>
|
||||
</b-row>
|
||||
<hr />
|
||||
Schöpfen
|
||||
<ul>
|
||||
<li>Input Usersuche</li>
|
||||
<li>radioSelectedMass = {{ radioSelectedMass }}</li>
|
||||
<li>Tabelle Creationen</li>
|
||||
</ul>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import CreationFormular from '../components/CreationFormular.vue'
|
||||
import UserTable from '../components/UserTable.vue'
|
||||
|
||||
export default {
|
||||
name: 'overview',
|
||||
components: {
|
||||
CreationFormular,
|
||||
UserTable,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
showArrays: false,
|
||||
Searchfields: [
|
||||
{ key: 'email', label: 'Email' },
|
||||
{ key: 'first_name', label: 'Firstname' },
|
||||
{ key: 'last_name', label: 'Lastname' },
|
||||
{ key: 'creation', label: 'Creation' },
|
||||
{ key: 'bookmark', label: 'Bookmark' },
|
||||
],
|
||||
fields: [
|
||||
{ key: 'email', label: 'Email' },
|
||||
{ key: 'first_name', label: 'Firstname' },
|
||||
{ key: 'last_name', label: 'Lastname' },
|
||||
{ key: 'creation', label: 'Creation' },
|
||||
{ key: 'show_details', label: 'Details' },
|
||||
{ key: 'bookmark', label: 'Bookmark' },
|
||||
],
|
||||
searchResult: [
|
||||
{
|
||||
id: 1,
|
||||
email: 'dickerson@web.de',
|
||||
first_name: 'Dickerson',
|
||||
last_name: 'Macdonald',
|
||||
creation: '450,200,700',
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
email: 'larsen@woob.de',
|
||||
first_name: 'Larsen',
|
||||
last_name: 'Shaw',
|
||||
creation: '300,200,1000',
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
email: 'geneva@tete.de',
|
||||
first_name: 'Geneva',
|
||||
last_name: 'Wilson',
|
||||
creation: '350,200,900',
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
email: 'viewrter@asdfvb.com',
|
||||
first_name: 'Soledare',
|
||||
last_name: 'Takker',
|
||||
creation: '100,400,800',
|
||||
},
|
||||
],
|
||||
itemsList: this.searchResult,
|
||||
massCreation: [],
|
||||
radioSelectedMass: '',
|
||||
criteria: '',
|
||||
creation: [null, null, null],
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.itemsList = this.searchResult
|
||||
},
|
||||
methods: {
|
||||
// updateMassCreation(newMassCreationItem, even) {
|
||||
// console.log('even', even)
|
||||
// console.log('>>>>>>>>>>>>>>>> newMassCreationItem overview: ', newMassCreationItem)
|
||||
// this.massCreation.push(newMassCreationItem)
|
||||
// },
|
||||
// getSearchResult() {
|
||||
// console.log('setSearchResult')
|
||||
// this.itemsList = this.searchResult
|
||||
// },
|
||||
|
||||
updateItem(e, event) {
|
||||
// console.log('even', even)
|
||||
// console.log('>>>>>>>>>>>>>>>> updateItem e: ', e)
|
||||
|
||||
let index = 0
|
||||
let findArr = {}
|
||||
|
||||
// console.log("array1.find((arr) => arr.id === 2).text ", array1.find((arr) => arr.id === 2))
|
||||
|
||||
// console.log('this.massCreation bevor: ', this.massCreation)
|
||||
if (event === 'push') {
|
||||
findArr = this.itemsList.find((arr) => arr.id === e.id)
|
||||
|
||||
// console.log('findArr ', findArr)
|
||||
|
||||
index = this.itemsList.indexOf(findArr)
|
||||
|
||||
// console.log('index ', index)
|
||||
|
||||
this.itemsList.splice(index, 1)
|
||||
|
||||
// console.log(this.itemsList)
|
||||
|
||||
this.massCreation.push(e)
|
||||
}
|
||||
if (event === 'remove') {
|
||||
findArr = this.massCreation.find((arr) => arr.id === e.id)
|
||||
|
||||
// console.log('findArr ', findArr)
|
||||
|
||||
index = this.massCreation.indexOf(findArr)
|
||||
|
||||
// console.log('index ', index)
|
||||
|
||||
this.massCreation.splice(index, 1)
|
||||
|
||||
// console.log(this.massCreation)
|
||||
|
||||
this.itemsList.push(e)
|
||||
}
|
||||
// console.log('this.massCreation after: ', this.massCreation)
|
||||
|
||||
// console.log('this items after', this.items)
|
||||
},
|
||||
|
||||
updateRadioSelected(obj) {
|
||||
// console.log('Creation.vue updateRadioSelected', obj)
|
||||
this.radioSelectedMass = obj[0]
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
108
admin/src/views/CreationConfirm.vue
Normal file
108
admin/src/views/CreationConfirm.vue
Normal file
@ -0,0 +1,108 @@
|
||||
<template>
|
||||
<div>
|
||||
<user-table
|
||||
type="PageCreationConfirm"
|
||||
:itemsUser="confirmResult"
|
||||
:fieldsTable="fields"
|
||||
:criteria="criteria"
|
||||
@update-confirm-result="updateConfirmResult"
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import UserTable from '../components/UserTable.vue'
|
||||
|
||||
export default {
|
||||
name: 'creation_confirm',
|
||||
components: {
|
||||
UserTable,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
showArrays: false,
|
||||
fields: [
|
||||
{ key: 'email', label: 'Email' },
|
||||
{ key: 'first_name', label: 'Firstname' },
|
||||
{ key: 'last_name', label: 'Lastname' },
|
||||
{ key: 'creation_gdd', label: 'Creation GDD' },
|
||||
{ key: 'creation_date', label: 'Datum' },
|
||||
{ key: 'creation_moderator', label: 'Moderator' },
|
||||
{ key: 'show_details', label: 'Details' },
|
||||
{ key: 'bookmark', label: 'Bookmark' },
|
||||
],
|
||||
confirmResult: [
|
||||
{
|
||||
id: 1,
|
||||
email: 'dickerson@web.de',
|
||||
first_name: 'Dickerson',
|
||||
last_name: 'Macdonald',
|
||||
creation_old: '450,200,700',
|
||||
creation_gdd: '1000',
|
||||
creation_date: '01/11/2021',
|
||||
creation_moderator: 'Manuela Gast',
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
email: 'larsen@woob.de',
|
||||
first_name: 'Larsen',
|
||||
last_name: 'Shaw',
|
||||
creation_old: '300,200,1000',
|
||||
creation_gdd: '1000',
|
||||
creation_date: '01/11/2021',
|
||||
creation_moderator: 'Manuela Gast',
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
email: 'geneva@tete.de',
|
||||
first_name: 'Geneva',
|
||||
last_name: 'Wilson',
|
||||
creation_old: '350,200,900',
|
||||
creation_gdd: '1000',
|
||||
creation_date: '01/11/2021',
|
||||
creation_moderator: 'Manuela Gast',
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
email: 'viewrter@asdfvb.com',
|
||||
first_name: 'Soledare',
|
||||
last_name: 'Takker',
|
||||
creation_gdd: '500',
|
||||
creation_date: '01/10/2021',
|
||||
creation_moderator: 'Evelyn Roller',
|
||||
},
|
||||
{
|
||||
id: 5,
|
||||
email: 'dickerson@web.de',
|
||||
first_name: 'Dickerson',
|
||||
last_name: 'Macdonald',
|
||||
creation_old: '100,400,800',
|
||||
creation_gdd: '200',
|
||||
creation_date: '01/09/2021',
|
||||
creation_moderator: 'Manuela Gast',
|
||||
},
|
||||
],
|
||||
massCreation: [],
|
||||
criteria: '',
|
||||
}
|
||||
},
|
||||
|
||||
methods: {
|
||||
updateConfirmResult(e, event) {
|
||||
if (event === 'remove') {
|
||||
let index = 0
|
||||
let findArr = {}
|
||||
|
||||
findArr = this.confirmResult.find((arr) => arr.id === e.id)
|
||||
|
||||
// console.log('findArr ', findArr)
|
||||
|
||||
index = this.confirmResult.indexOf(findArr)
|
||||
|
||||
// console.log('index ', index)
|
||||
|
||||
this.confirmResult.splice(index, 1)
|
||||
}
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
@ -1,26 +1,71 @@
|
||||
<template>
|
||||
<div>
|
||||
<create-formular />
|
||||
<b-card
|
||||
border-variant="primary"
|
||||
header="offene Schöpfungen"
|
||||
header-bg-variant="danger"
|
||||
header-text-variant="white"
|
||||
align="center"
|
||||
>
|
||||
<b-card-text>
|
||||
<b-link to="creation-confirm"><h1>3</h1></b-link>
|
||||
</b-card-text>
|
||||
</b-card>
|
||||
<br />
|
||||
<b-row>
|
||||
<b-col>
|
||||
<b-card border-variant="info" header="offene Registrierung" align="center">
|
||||
<b-card-text>Unbestätigte E-mail Registrierung</b-card-text>
|
||||
</b-card>
|
||||
</b-col>
|
||||
<b-col>
|
||||
<b-card border-variant="info" header="geschöpfte Stunden" align="center">
|
||||
<b-card-text>Wievile Stunden können noch von Mitgliedern geschöpft werden?</b-card-text>
|
||||
</b-card>
|
||||
</b-col>
|
||||
<b-col>
|
||||
<b-card border-variant="info" header="Gemeinschafts Konto" align="center">
|
||||
<b-card-text>
|
||||
Für jedes Mitglied kann für das Gemeinschaftskonto geschöpft werden. Pro Monat 1000 x
|
||||
Mitglieder
|
||||
</b-card-text>
|
||||
</b-card>
|
||||
</b-col>
|
||||
</b-row>
|
||||
<hr />
|
||||
<br />
|
||||
<b-list-group>
|
||||
<b-list-group-item class="bg-secondary text-light" href="user">
|
||||
zur Usersuche
|
||||
</b-list-group-item>
|
||||
<b-list-group-item class="d-flex justify-content-between align-items-center">
|
||||
Mitglieder
|
||||
<b-badge class="bg-success" pill>14</b-badge>
|
||||
</b-list-group-item>
|
||||
|
||||
<user-table count="5" area="overview" />
|
||||
<b-list-group-item class="d-flex justify-content-between align-items-center">
|
||||
aktive Mitglieder
|
||||
<b-badge class="bg-primary" pill>12</b-badge>
|
||||
</b-list-group-item>
|
||||
|
||||
Startübersicht Adminbereich
|
||||
<ul>
|
||||
<li>Unbestätigte E-mail Registrierung</li>
|
||||
<li>offene Schöpfungen</li>
|
||||
<li>letzte 10 Schöpfungen</li>
|
||||
</ul>
|
||||
<b-list-group-item class="d-flex justify-content-between align-items-center">
|
||||
nicht bestätigte Mitglieder
|
||||
<b-badge class="bg-warning text-dark" pill>2</b-badge>
|
||||
</b-list-group-item>
|
||||
</b-list-group>
|
||||
<hr />
|
||||
<br />
|
||||
<div class="text-center">
|
||||
Gradido Akademie Adminkonsole
|
||||
<div><small>Version: 0.0.1</small></div>
|
||||
</div>
|
||||
<br />
|
||||
<br />
|
||||
<hr />
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import CreateFormular from '../components/CreateFormular.vue'
|
||||
import UserTable from '../components/UserTable.vue'
|
||||
export default {
|
||||
name: 'overview',
|
||||
components: {
|
||||
CreateFormular,
|
||||
UserTable,
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
@ -1,9 +1,73 @@
|
||||
<template>
|
||||
<div>
|
||||
Usersuche
|
||||
<ul>
|
||||
<li>Input Usersuche</li>
|
||||
<li>Tabelle Ergenisse</li>
|
||||
</ul>
|
||||
<label>Usersuche</label>
|
||||
<b-input
|
||||
type="text"
|
||||
v-model="criteria"
|
||||
class="shadow p-3 mb-5 bg-white rounded"
|
||||
placeholder="User suche"
|
||||
></b-input>
|
||||
<user-table
|
||||
type="PageUserSearch"
|
||||
:itemsUser="searchResult"
|
||||
:fieldsTable="fields"
|
||||
:criteria="criteria"
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import UserTable from '../components/UserTable.vue'
|
||||
|
||||
export default {
|
||||
name: 'overview',
|
||||
components: {
|
||||
UserTable,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
showArrays: false,
|
||||
fields: [
|
||||
{ key: 'email', label: 'Email' },
|
||||
{ key: 'first_name', label: 'Firstname' },
|
||||
{ key: 'last_name', label: 'Lastname' },
|
||||
{ key: 'creation', label: 'Creation' },
|
||||
{ key: 'show_details', label: 'Details' },
|
||||
],
|
||||
searchResult: [
|
||||
{
|
||||
id: 1,
|
||||
email: 'dickerson@web.de',
|
||||
first_name: 'Dickerson',
|
||||
last_name: 'Macdonald',
|
||||
creation: '450,200,700',
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
email: 'larsen@woob.de',
|
||||
first_name: 'Larsen',
|
||||
last_name: 'Shaw',
|
||||
creation: '300,200,1000',
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
email: 'geneva@tete.de',
|
||||
first_name: 'Geneva',
|
||||
last_name: 'Wilson',
|
||||
creation: '350,200,900',
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
email: 'viewrter@asdfvb.com',
|
||||
first_name: 'Soledare',
|
||||
last_name: 'Takker',
|
||||
creation: '100,400,800',
|
||||
},
|
||||
],
|
||||
massCreation: [],
|
||||
criteria: '',
|
||||
}
|
||||
},
|
||||
|
||||
methods: {},
|
||||
}
|
||||
</script>
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user