mindboost/mindboost-rnbo-test-project
6
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Initial commit

Browse Source
This commit is contained in:
Mindboost
2025-07-01 10:53:26 +00:00
commit 38050e5c69
416 changed files with 48708 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

310
pages/settings/donation.vue Normal file
View File

@@ -0,0 +1,310 @@
<template>
<div>
<div class="row justify-content-center">
<div class="col-12 col-lg-9 col-md-11 col-sm-12 col-xl-8">
<h1 class="h3 fw-bold text-center pt-3">
{{ t("Donation") }}
</h1>
<div class="row">
<div class="col-12">
<p class="fw-light text-center py-3">
{{ t("DonationHeading") }}
</p>
</div>
</div>
<div class="d-flex flex-column flex-md-row gap-3">
<div class="col-12 py-1 flex-auto">
<div class="card" :class="{'active-sub':oneMonth,'sub-card':!oneMonth}" @click="oneMonth=true;twoMonth=false;threeMonth=false">
<div class="card-body py-4">
<h2 class="text-center fw-bolder">
€3.00
</h2>
<p class="text-center">
{{ t("SmallAmount") }}
</p>
</div>
</div>
</div>
<div class="col-12 py-1 flex-auto">
<div class="card" :class="{'active-sub':twoMonth,'sub-card':!twoMonth}" @click="twoMonth=true;oneMonth=false;threeMonth=false">
<div class="card-body py-4">
<h2 class="text-center fw-bolder">
€10.00
</h2>
<p class=" text-center">
{{ t("MediumAmount") }}
</p>
</div>
</div>
</div>
<div class="col-12 py-1 flex-auto">
<div class="card" :class="{'active-sub':threeMonth,'sub-card':!threeMonth}" @click="threeMonth=true;twoMonth=false;oneMonth=false">
<div class="card-body py-4">
<h2 class="text-center fw-bolder">
€15.00
</h2>
<p class=" text-center">
{{ t("BigAmount") }}
</p>
</div>
</div>
</div>
</div>
<div class="row pt-5">
<div class="col-12 px-md-5 px-0">
<p class="text-center text-muted">
{{ t("EndStatement") }}
</p>
</div>
<div class="col-12 text-end" />
</div>
<div class="row pt-5 justify-content-center ">
<div class="col-12 col-md-6 col-lg-6 text-center">
<div class="row">
<div class="col-12">
<p class="fw-medium text-center"><strong>{{ t("bankaccount") }}:</strong><br></p>
<p class="fw-light text-center">
{{ t("Name") }}: Robert Rapp<br>
</p>
<p class="fw-light text-center">
IBAN: DE42 1001 1001 2629 4590 53
<span class="tooltip-container">
<i class="fas fa-copy ml-2 cursor-pointer" title="In die Zwischenablage kopieren" @click="copyIBANToClipboard('DE42 1001 1001 2629 4590 53')" />
<span class="tooltiptext" :class="{ 'show': showTooltip }">Kopiert!</span>
</span>
</p>
<p class="fw-light text-center">
BIC: NTSBDEB1XXX
</p>
<p class="fw-light text-center">
{{ userVerwendungszweck }}
<span class="tooltip-container">
<i class="fas fa-copy ml-2 cursor-pointer" title="In die Zwischenablage kopieren" @click="copyToClipboard(userVerwendungszweck)" />
<span class="tooltiptext" :class="{ 'show': showTooltip1 }">Kopiert!</span>
</span>
</p>
</div>
</div>
</div>
<!-- <StripeElements-->
<!-- v-if="stripeLoaded"-->
<!-- v-slot="{ elements, instance }" ref="elms"-->
<!-- :stripe-key="stripeKey"-->
<!-- :instance-options="instanceOptions"-->
<!-- :elements-options="elementsOptions"-->
<!-- >-->
<!-- <StripeElement-->
<!-- ref="card"-->
<!-- :elements="elements"-->
<!-- :options="cardOptions"-->
<!-- />-->
<!-- </StripeElements>-->
<!-- <button type="button" class="btn text-white fs-5 col-12 fw-bold py-2" @click="pay" style="background-color: #e9c046">Pay</button>-->
</div>
</div>
</div>
</div>
</template>
<script>
import { mapActions, mapStores } from 'pinia'
import { useUserStore } from '~/stores/user'
export default {
setup () {
const { t } = useI18n()
const localePath = useLocalePath()
const userVerwendungszweck = ref(useUserStore().user.email)
const usermail = useUserStore().user.email
return { t, localePath, userVerwendungszweck, usermail }
},
data () {
return {
oneMonth: false,
twoMonth: false,
threeMonth: false,
loading: false,
cancel_loading: false,
showTooltip: false,
showTooltip1: false,
subscription: '',
form: {
type: 'one'
}
}
},
computed: {
// ...mapState(useUserStore, ['user']),
...mapStores(useUserStore)
},
mounted () {
this.fetchSubscription()
},
methods: {
...mapActions(useUserStore, ['updateUser', 'logout']),
copyToClipboard (text) {
navigator.clipboard.writeText(text).then(() => {
this.showTooltip1 = true
setTimeout(() => {
this.showTooltip1 = false
}, 2000) // Tooltip verschwindet nach 2 Sekunden
}).catch((err) => {
useNuxtApp().$logger.error('Fehler beim Kopieren: ', err)
})
},
copyIBANToClipboard (text) {
navigator.clipboard.writeText(text).then(() => {
this.showTooltip = true
setTimeout(() => {
this.showTooltip = false
}, 2000) // Tooltip verschwindet nach 2 Sekunden
}).catch((err) => {
useNuxtApp().$logger.error('Fehler beim Kopieren: ', err)
})
},
updateUserNow () {
this.$axios.post('/api/auth/me').then(({ data }) => {
this.updateUser(data.user)
}).catch(() => {
this.logout()
this.$router.push(this.localePath('/auth/login'))
})
},
paypal () {
window.open('https://www.paypal.com/pools/c/93YzF9GqEP', '_blank')
},
fetchSubscription () {
this.$axios.post('/api/fetch-subscription').then(({ data }) => {
this.subscription = data.name
if (data.name === 'monthly') {
this.oneMonth = true
this.twoMonth = false
this.threeMonth = false
}
if (data.name === 'sixmonth') {
this.oneMonth = false
this.twoMonth = true
this.threeMonth = false
}
if (data.name === 'yearly') {
this.oneMonth = false
this.twoMonth = false
this.threeMonth = true
}
})
}
}
}
// export default {
// name: 'CardOnly',
// data() {
// return {
// stripeKey: 'pk_test_0S0H9CTYtkhPlArgg4KkPFcZ',
// instanceOptions: {},
// elementsOptions: {},
// cardOptions: {},
// stripeLoaded: false,
// card: null,
// elms: null,
// oneMonth:false,
// twoMonth:false,
// threeMonth:false,
// };
// },
// components: {
// StripeElements,
// StripeElement,
// },
// beforeMount() {
// const stripePromise = loadStripe(this.stripeKey);
// stripePromise.then(() => {
// this.stripeLoaded = true;
// });
// },
// methods: {
// pay() {
// const cardElement = this.$refs.card.stripeElement;
//
// this.$refs.elms.instance
// .createPaymentMethod({ type: 'card', card: cardElement })
// .then((result) => {
// // useNuxtApp().$logger.log(result);
// // useNuxtApp().$logger.log(result.paymentMethod);
// this.$axios.post('/api/subscribe', result).then((response) => {
// // useNuxtApp().$logger.log(response.data);
// });
// });
// },
// },
// computed: {
//
// },
// created() {
//
// },
// };
</script>
<style>
.flex-auto {
flex: 1 1 auto;
}
.active-sub{
background: #E9C046;
box-shadow: 0px 0px 16px 1px rgba(108, 97, 97, 0.05);
border-radius: 12px;
color:white;
background-color:#E9C046 !important;
}
.sub-card{
background: #FFFFFF;
box-shadow: 0px 0px 16px 1px rgba(108, 97, 97, 0.05);
border-radius: 12px;
color:black;
height: 100%;
transition: 250ms ease-in-out;
}
.sub-card:hover, .sub-card:focus{
background: #E9C046;
box-shadow: 0px 0px 16px 1px rgba(108, 97, 97, 0.05);
border-radius: 12px;
color:white;
border-color: #E9C046;
background-color:#E9C046 !important;
}
.tooltip-container {
margin-left: 10px;
font-size: smaller;
position: relative;
display: inline-block;
}
.tooltiptext {
visibility: hidden;
font-family: 'Montserrat', sans-serif;
font-size: 14px;
width: auto;
background-color: #e9c046;
color: #000000;
text-align: center;
border-radius: 6px;
padding: 5px;
position: absolute;
z-index: 1;
bottom: 125%;
left: 20%;
margin-left: -30px;
opacity: 0;
transition: opacity 0.3s;
}
.tooltiptext.show {
visibility: visible;
opacity: 1;
}
</style>