2023-06-11 20:22:41 +00:00
|
|
|
|
<template>
|
|
|
|
|
<div>
|
|
|
|
|
<div class="row">
|
|
|
|
|
<div class="col-12 ">
|
|
|
|
|
<h4 class="text-center fw-bold pt-5">{{t("How is your audio hardware connected?")}}</h4>
|
|
|
|
|
<p class="text-center mb-0 pb-0 text-muted">As input, please select the microphone of your laptop or mobile device – not of your headphones.</p>
|
|
|
|
|
<p class="text-center mt-0 pt-0 text-muted">To use Mindboost, headphones are required.</p>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="row justify-content-center">
|
|
|
|
|
<div class="col-11 pt-md-4">
|
|
|
|
|
<form>
|
2023-10-11 20:07:28 +00:00
|
|
|
|
<div class="row justify-content-center ">
|
2023-06-11 20:22:41 +00:00
|
|
|
|
<div class="col-md-3 text-center">
|
|
|
|
|
<h6 class="pb-0 mb-0">Input device:</h6>
|
|
|
|
|
<p class="pt-0 mt-0 text-muted pb-0 mb-0" style="font-size: 14px;font-weight: 500">(select laptop or mobile device microphone)</p>
|
|
|
|
|
<select class="form-select pt-1 mt-0 select-box ">
|
|
|
|
|
<option>Internal Microphone</option>
|
|
|
|
|
</select>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<div class="row justify-content-center pt-3">
|
|
|
|
|
<div class="col-md-3 text-center">
|
|
|
|
|
<h6 class="pb-0 mb-0 " >Output device:</h6>
|
|
|
|
|
<p class="pt-0 mt-0 text-muted pb-0 mb-0" style="font-size: 14px;font-weight: 500">(select headphones or headphone output)</p>
|
|
|
|
|
<select class="form-select pt-1 mt-0 select-box ">
|
|
|
|
|
<option>Audio Output</option>
|
|
|
|
|
</select>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<div class="row justify-content-center pt-3">
|
2023-10-11 20:07:28 +00:00
|
|
|
|
<div class="col-md-3 text-center" style="z-index: 1000000;">
|
|
|
|
|
<NuxtLink :to="localePath('onboarding')" style="z-index: 1000000" class="btn col-4 next-btn" >NEXT</NuxtLink>
|
2023-06-11 20:22:41 +00:00
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</form>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
</template>
|
|
|
|
|
<script>
|
|
|
|
|
import {useCounterStore} from '@/stores/counter';
|
|
|
|
|
import {mapState,mapActions} from "pinia";
|
|
|
|
|
export default {
|
|
|
|
|
setup() {
|
|
|
|
|
const { t } = useI18n()
|
|
|
|
|
const localePath = useLocalePath()
|
|
|
|
|
|
|
|
|
|
return {
|
|
|
|
|
t,
|
|
|
|
|
localePath,
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
mounted() {
|
|
|
|
|
this.increment(100);
|
|
|
|
|
},
|
|
|
|
|
computed:{...mapState(useCounterStore,['count'])},
|
|
|
|
|
|
|
|
|
|
data(){
|
|
|
|
|
return{
|
|
|
|
|
bar_val:100,
|
|
|
|
|
form:{
|
|
|
|
|
soundscape:'',
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
methods:{
|
|
|
|
|
...mapActions(useCounterStore,['increment']),
|
|
|
|
|
...mapActions(useCounterStore,['decrement']),
|
|
|
|
|
saveSetting(value){
|
|
|
|
|
this.form.soundscape=value;
|
|
|
|
|
this.$axios.post('/api/update-setting',this.form).then(({data})=>{
|
|
|
|
|
console.log(data);
|
|
|
|
|
if(data.success){
|
|
|
|
|
// this.$toast.success(data.message);
|
2023-10-11 20:07:28 +00:00
|
|
|
|
this.$router.push(this.localePath('onboarding'));
|
2023-06-11 20:22:41 +00:00
|
|
|
|
}
|
|
|
|
|
}).catch((e)=>{
|
|
|
|
|
this.$toast.error("something went wrong while saving...");
|
|
|
|
|
})
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
}
|
|
|
|
|
</script>
|
|
|
|
|
|
|
|
|
|
<style scoped>
|
|
|
|
|
.bar{
|
|
|
|
|
background-color: #e9c046;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.select-box{
|
|
|
|
|
border: 2px solid #e9c046;
|
|
|
|
|
box-shadow: none;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.select-box:focus{
|
|
|
|
|
border: 2px solid #e9c046;
|
|
|
|
|
box-shadow: none;
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
.next-btn{
|
|
|
|
|
background: #e9c046;
|
|
|
|
|
color: white;
|
|
|
|
|
font-weight: 600;
|
|
|
|
|
font-size: 18px;
|
|
|
|
|
padding: 8px 10px;
|
|
|
|
|
}
|
|
|
|
|
.next-btn:hover{
|
|
|
|
|
background: #e9c046;
|
|
|
|
|
color: white;
|
|
|
|
|
}
|
2023-10-11 20:07:28 +00:00
|
|
|
|
</style>
|