1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465 |
- <template>
- <div>
- <v-container grid-list-md text-xs-center fluid>
- <v-layout row wrap>
- <!-- Experiment header -->
- <v-flex xs12>
- <v-layout justify-start>
- <v-btn flat exact :to="`/experiments/${experimentName}`">
- <v-icon left>arrow_back</v-icon>
- Back to scene selection
- </v-btn>
- </v-layout>
- <h2>Experiment "{{ $route.meta.fullName }}"</h2>
- <h3>{{ sceneName }}</h3>
- <slot name="header"></slot>
- </v-flex>
- <!--/ Experiment header -->
- <!-- Loading screen -->
- <loader v-if="loadingMessage" :message="loadingMessage" />
- <!--/ Loading screen -->
- <!-- Experiment -->
- <template v-else-if="!loadingErrorMessage">
- <slot name="content"></slot>
- </template>
- <!--/ Experiment -->
- </v-layout>
- </v-container>
- </div>
- </template>
- <script>
- import Loader from '@/components/Loader.vue'
- export default {
- name: 'ExperimentBlock',
- components: {
- Loader
- },
- props: {
- experimentName: {
- type: String,
- required: true
- },
- sceneName: {
- type: String,
- required: true
- },
- loadingMessage: {
- type: String,
- required: false,
- default: null
- },
- loadingErrorMessage: {
- type: String,
- required: false,
- default: null
- }
- }
- }
- </script>
|