mirror of
https://github.com/IT4Change/gradido.git
synced 2025-12-13 07:45:54 +00:00
remove useravatar, add qrcode from user email
This commit is contained in:
ogerly
parent
8e71fd74cc
commit
bda18fdf9c
@ -20,6 +20,12 @@
|
||||
</b-card>
|
||||
</b-collapse>
|
||||
</b-list-group-item>
|
||||
<b-list-group-item>
|
||||
<b-alert v-if="count < 5" show variant="secondary">
|
||||
Die letzten <strong>{{count}}</strong> Transaktionen
|
||||
</b-alert>
|
||||
<router-link to="/activity" > mehr (+ {{count}})</router-link>
|
||||
</b-list-group-item>
|
||||
|
||||
|
||||
</b-list-group>
|
||||
@ -36,7 +42,8 @@ export default {
|
||||
return {
|
||||
form: [],
|
||||
fields: [ 'balance', 'date', 'memo', 'name', 'transaction_id', 'type','details'],
|
||||
items: []
|
||||
items: [],
|
||||
count: 0
|
||||
};
|
||||
},
|
||||
|
||||
@ -54,6 +61,7 @@ export default {
|
||||
//commit('transactions', result.data.transactions)
|
||||
this.$store.state.user.balance_gdt = result.data.gdtSum
|
||||
this.items = result.data.transactions
|
||||
this.count = result.data.count
|
||||
|
||||
}, (error) => {
|
||||
console.log(error);
|
||||
@ -75,11 +83,8 @@ export default {
|
||||
},
|
||||
setComma(int){
|
||||
return int / 10000
|
||||
|
||||
}
|
||||
},
|
||||
|
||||
|
||||
}
|
||||
};
|
||||
</script>
|
||||
<style>
|
||||
|
||||
@ -38,7 +38,7 @@
|
||||
<b-media no-body class="align-items-center">
|
||||
|
||||
<span class="avatar avatar-sm rounded-circle">
|
||||
<img alt="Image placeholder" src="img/theme/team-4.jpg">
|
||||
<vue-qrcode :value="$store.state.email" />
|
||||
</span>
|
||||
<b-media-body class="ml-2 d-none d-lg-block">
|
||||
<span class="mb-0 text-sm font-weight-bold">{{this.$store.state.email}}</span>
|
||||
@ -84,13 +84,14 @@
|
||||
</template>
|
||||
<script>
|
||||
import { CollapseTransition } from 'vue2-transitions';
|
||||
import { BaseNav, Modal } from '@/components';
|
||||
import { BaseNav } from '@/components';
|
||||
import VueQrcode from 'vue-qrcode'
|
||||
|
||||
export default {
|
||||
components: {
|
||||
// CollapseTransition,
|
||||
CollapseTransition,
|
||||
BaseNav,
|
||||
// Modal
|
||||
VueQrcode
|
||||
},
|
||||
props: {
|
||||
type: {
|
||||
|
||||
71
frontend/src/views/Pages/UserProfile/ImageUploaderAvatar.vue
Normal file
71
frontend/src/views/Pages/UserProfile/ImageUploaderAvatar.vue
Normal file
@ -0,0 +1,71 @@
|
||||
<template>
|
||||
<div>
|
||||
<!-- slot for parent component to activate the file changer -->
|
||||
<div @click="launchFilePicker()">
|
||||
<slot name="activator"></slot>
|
||||
</div>
|
||||
<!-- image input: style is set to hidden and assigned a ref so that it can be triggered -->
|
||||
<input type="file"
|
||||
ref="file"
|
||||
:name="uploadFieldName"
|
||||
@change="onFileChange(
|
||||
$event.target.name, $event.target.files)"
|
||||
style="display:none">
|
||||
<!-- error dialog displays any potential errors -->
|
||||
<v-dialog v-model="errorDialog" max-width="300">
|
||||
<v-card>
|
||||
<v-card-text class="subheading">{{errorText}}</v-card-text>
|
||||
<v-card-actions>
|
||||
<v-spacer></v-spacer>
|
||||
<v-btn @click="errorDialog = false" flat>Got it!</v-btn>
|
||||
</v-card-actions>
|
||||
</v-card>
|
||||
</v-dialog>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
name: 'avatar-uploader',
|
||||
data: ()=> ({
|
||||
errorDialog: null,
|
||||
errorText: '',
|
||||
uploadFieldName: 'file',
|
||||
maxSize: 1024
|
||||
}),
|
||||
props: {
|
||||
// Use "value" here to enable compatibility with v-model
|
||||
value: Object,
|
||||
},
|
||||
methods: {
|
||||
launchFilePicker(){
|
||||
this.$refs.file.click();
|
||||
},
|
||||
onFileChange(fieldName, file) {
|
||||
const { maxSize } = this
|
||||
let imageFile = file[0]
|
||||
|
||||
//check if user actually selected a file
|
||||
if (file.length>0) {
|
||||
let size = imageFile.size / maxSize / maxSize
|
||||
if (!imageFile.type.match('image.*')) {
|
||||
// check whether the upload is an image
|
||||
this.errorDialog = true
|
||||
this.errorText = 'Please choose an image file'
|
||||
} else if (size>1) {
|
||||
// check whether the size is greater than the size limit
|
||||
this.errorDialog = true
|
||||
this.errorText = 'Your file is too big! Please select an image under 1MB'
|
||||
} else {
|
||||
// Append file into FormData & turn file into image URL
|
||||
let formData = new FormData()
|
||||
let imageURL = URL.createObjectURL(imageFile)
|
||||
formData.append(fieldName, imageFile)
|
||||
// Emit FormData & image URL to the parent component
|
||||
this.$emit('input', { formData, imageURL })
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style></style>
|
||||
@ -4,7 +4,7 @@
|
||||
<b-col lg="3" class="order-lg-2">
|
||||
<div class="card-profile-image">
|
||||
<a href="#">
|
||||
<b-img src="img/theme/team-4.jpg" rounded="circle" />
|
||||
<vue-qrcode :value="$store.state.email" />
|
||||
</a>
|
||||
</div>
|
||||
</b-col>
|
||||
@ -12,8 +12,7 @@
|
||||
|
||||
<b-card-header class="text-center border-0 pt-8 pt-md-4 pb-0 pb-md-4">
|
||||
<div class="d-flex justify-content-between">
|
||||
<a href="#" class="btn btn-sm btn-info mr-4">Connect</a>
|
||||
<a href="#" class="btn btn-sm btn-default float-right">Message</a>
|
||||
<br>
|
||||
</div>
|
||||
</b-card-header>
|
||||
|
||||
@ -23,15 +22,15 @@
|
||||
<div class="card-profile-stats d-flex justify-content-center mt-md-5">
|
||||
<div>
|
||||
<span class="heading">22</span>
|
||||
<span class="description">Friends</span>
|
||||
<span class="description">Transactions</span>
|
||||
</div>
|
||||
<div>
|
||||
<span class="heading">10</span>
|
||||
<span class="description">Photos</span>
|
||||
<span class="description">Community</span>
|
||||
</div>
|
||||
<div>
|
||||
<span class="heading">89</span>
|
||||
<span class="description">Comments</span>
|
||||
<span class="heading"> {{ setComma(this.$store.state.user.balance) }} </span>
|
||||
<span class="description">GDD</span>
|
||||
</div>
|
||||
</div>
|
||||
</b-col>
|
||||
@ -58,6 +57,19 @@
|
||||
</b-card>
|
||||
</template>
|
||||
<script>
|
||||
export default {};
|
||||
import VueQrcode from 'vue-qrcode'
|
||||
|
||||
export default {
|
||||
name: "profilecard",
|
||||
components: {
|
||||
VueQrcode,
|
||||
},
|
||||
methods: {
|
||||
setComma(int){
|
||||
console.log("setComma", int)
|
||||
return int / 10000
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
<style></style>
|
||||
|
||||
@ -21,17 +21,22 @@
|
||||
<edit-profile-form></edit-profile-form>
|
||||
</b-col>
|
||||
</b-row>
|
||||
<b-row>
|
||||
<b-col xl="12" class="order-xl-1">
|
||||
<image-uploader-avatar> </image-uploader-avatar>
|
||||
</b-col>
|
||||
</b-row>
|
||||
</b-container>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import EditProfileForm from './UserProfile/EditProfileForm.vue';
|
||||
import UserCard from './UserProfile/UserCard.vue';
|
||||
import ImageUploaderAvatar from './UserProfile/ImageUploaderAvatar.vue';
|
||||
|
||||
export default {
|
||||
components: {
|
||||
EditProfileForm,
|
||||
UserCard
|
||||
ImageUploaderAvatar
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
@ -1983,6 +1983,11 @@ buffer-indexof@^1.0.0:
|
||||
resolved "https://registry.yarnpkg.com/buffer-indexof/-/buffer-indexof-1.1.1.tgz#52fabcc6a606d1a00302802648ef68f639da268c"
|
||||
integrity sha512-4/rOEg86jivtPTeOUUT61jJO1Ya1TrR/OkqCSZDyq84WJh3LuuiphBYJN+fm5xufIk4XAFcEwte/8WzC8If/1g==
|
||||
|
||||
buffer-json@^2.0.0:
|
||||
version "2.0.0"
|
||||
resolved "https://registry.yarnpkg.com/buffer-json/-/buffer-json-2.0.0.tgz#f73e13b1e42f196fe2fd67d001c7d7107edd7c23"
|
||||
integrity sha512-+jjPFVqyfF1esi9fvfUs3NqM0pH1ziZ36VP4hmA/y/Ssfo/5w5xHKfTw9BwQjoJ1w/oVtpLomqwUHKdefGyuHw==
|
||||
|
||||
buffer-xor@^1.0.3:
|
||||
version "1.0.3"
|
||||
resolved "https://registry.yarnpkg.com/buffer-xor/-/buffer-xor-1.0.3.tgz#26e61ed1422fb70dd42e6e36729ed51d855fe8d9"
|
||||
@ -2086,6 +2091,18 @@ cache-loader@^2.0.1:
|
||||
normalize-path "^3.0.0"
|
||||
schema-utils "^1.0.0"
|
||||
|
||||
cache-loader@^4.1.0:
|
||||
version "4.1.0"
|
||||
resolved "https://registry.yarnpkg.com/cache-loader/-/cache-loader-4.1.0.tgz#9948cae353aec0a1fcb1eafda2300816ec85387e"
|
||||
integrity sha512-ftOayxve0PwKzBF/GLsZNC9fJBXl8lkZE3TOsjkboHfVHVkL39iUEs1FO07A33mizmci5Dudt38UZrrYXDtbhw==
|
||||
dependencies:
|
||||
buffer-json "^2.0.0"
|
||||
find-cache-dir "^3.0.0"
|
||||
loader-utils "^1.2.3"
|
||||
mkdirp "^0.5.1"
|
||||
neo-async "^2.6.1"
|
||||
schema-utils "^2.0.0"
|
||||
|
||||
call-bind@^1.0.0, call-bind@^1.0.2:
|
||||
version "1.0.2"
|
||||
resolved "https://registry.yarnpkg.com/call-bind/-/call-bind-1.0.2.tgz#b1d4e89e688119c3c9a903ad30abb2f6a919be3c"
|
||||
@ -4404,7 +4421,7 @@ find-cache-dir@^2.1.0:
|
||||
make-dir "^2.0.0"
|
||||
pkg-dir "^3.0.0"
|
||||
|
||||
find-cache-dir@^3.3.1:
|
||||
find-cache-dir@^3.0.0, find-cache-dir@^3.3.1:
|
||||
version "3.3.1"
|
||||
resolved "https://registry.yarnpkg.com/find-cache-dir/-/find-cache-dir-3.3.1.tgz#89b33fad4a4670daa94f855f7fbe31d6d84fe880"
|
||||
integrity sha512-t2GDMt3oGC/v+BMwzmllWDuJF/xcDtE5j/fCGbqDD7OLuJkj0cfh1YSA5VKPvwMeLFLNDBkwOKZ2X85jGLVftQ==
|
||||
@ -8194,7 +8211,7 @@ schema-utils@^1.0.0:
|
||||
ajv-errors "^1.0.0"
|
||||
ajv-keywords "^3.1.0"
|
||||
|
||||
schema-utils@^2.6.5:
|
||||
schema-utils@^2.0.0, schema-utils@^2.6.5:
|
||||
version "2.7.1"
|
||||
resolved "https://registry.yarnpkg.com/schema-utils/-/schema-utils-2.7.1.tgz#1ca4f32d1b24c590c203b8e7a50bf0ea4cd394d7"
|
||||
integrity sha512-SHiNtMOUGWBQJwzISiVYKu82GiV4QYGePp3odlY1tuKO7gPtphAT5R/py0fA6xtbgLL/RvtJZnU9b8s0F1q0Xg==
|
||||
@ -9566,7 +9583,7 @@ vue-i18n@^8.17.0, vue-i18n@^8.22.4:
|
||||
resolved "https://registry.yarnpkg.com/vue-i18n/-/vue-i18n-8.23.0.tgz#4a65681a1dfe716d47e1d00ddbd6e0b88ea36735"
|
||||
integrity sha512-mXgniaumwca8tKdp55fmvqIcW658vQQXq0zEyRHp8sgZ6t+Md+Whhu6CCPg9/erVNlvpKzsGsucGjt2N8GrFCA==
|
||||
|
||||
vue-loader@^15.7.0:
|
||||
vue-loader@^15.7.0, vue-loader@^15.9.6:
|
||||
version "15.9.6"
|
||||
resolved "https://registry.yarnpkg.com/vue-loader/-/vue-loader-15.9.6.tgz#f4bb9ae20c3a8370af3ecf09b8126d38ffdb6b8b"
|
||||
integrity sha512-j0cqiLzwbeImIC6nVIby2o/ABAWhlppyL/m5oJ67R5MloP0hj/DtFgb0Zmq3J9CG7AJ+AXIvHVnJAPBvrLyuDg==
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user