This repository has been archived on 2024-02-08. You can view files and clone it, but cannot push or open issues or pull requests.
frontend/src/views/migrator/Migrate.vue
dpschen 5dcb1dd449
Some checks failed
continuous-integration/drone/push Build is failing
feature/move-styles-to-components (#874)
Co-authored-by: Dominik Pschenitschni <mail@celement.de>
Reviewed-on: #874
Co-authored-by: dpschen <dpschen@noreply.kolaente.de>
Co-committed-by: dpschen <dpschen@noreply.kolaente.de>
2021-10-21 19:11:17 +00:00

53 lines
1.1 KiB
Vue

<template>
<div class="content">
<h1>{{ $t('migrate.title') }}</h1>
<p>{{ $t('migrate.description') }}</p>
<div class="migration-services-overview">
<router-link
v-for="{name, identifier} in availableMigrators"
:key="identifier"
:to="{name: 'migrate.service', params: {service: identifier}}"
>
<img :alt="name" :src="serviceIconSources[identifier]"/>
{{ name }}
</router-link>
</div>
</div>
</template>
<script>
import {getMigratorFromSlug, SERVICE_ICONS} from '../../helpers/migrator'
export default {
name: 'migrate.service',
mounted() {
this.setTitle(this.$t('migrate.title'))
},
computed: {
availableMigrators() {
return this.$store.state.config.availableMigrators.map(getMigratorFromSlug)
},
serviceIconSources() {
return this.availableMigrators.map(({identifier}) => SERVICE_ICONS[identifier]())
},
},
}
</script>
<style lang="scss" scoped>
.migration-services-overview {
text-align: center;
a {
display: inline-block;
width: 100px;
text-transform: capitalize;
margin-right: 1rem;
img {
display: block;
}
}
}
</style>