dashboard/shell/components/fleet/FleetNoWorkspaces.vue

67 lines
1.3 KiB
Vue

<script>
import { FLEET } from '@shell/config/types';
import { NAME } from '@shell/config/product/fleet';
export default {
name: 'NoWorkspaces',
props: {
canView: {
type: Boolean,
default: false,
},
},
data() {
const formRoute = {
name: `c-cluster-product-resource-create`,
params: { resource: FLEET.WORKSPACE, product: NAME }
};
return { hasWorkspaces: false, formRoute };
},
};
</script>
<template>
<div
class="intro-box"
:data-testid="'fleet-no-workspaces'"
>
<i class="icon icon-repository" />
<div class="title">
<span v-clean-html="t('fleet.gitRepo.repo.noWorkspaces', null, true)" />
</div>
<div
v-if="canView"
class="actions"
>
<router-link
:to="formRoute"
class="btn role-secondary"
>
{{ t('fleet.gitRepo.workspace.addWorkspace') }}
</router-link>
</div>
</div>
</template>
<style lang="scss" scoped>
.intro-box {
height: calc(100vh - var(--header-height)*2);
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
}
.title {
margin-bottom: 15px;
font-size: $font-size-h2;
text-align: center;
max-width: 600px;
}
.icon-repository {
font-size: 96px;
margin-bottom: 32px;
}
</style>