67 lines
1.6 KiB
Vue
67 lines
1.6 KiB
Vue
<script setup lang="ts">
|
|
import { SeatGroupModel } from '@/data/models/locations/seatGroupModel';
|
|
import seatGroupSheet from './seatGroupSheet.vue';
|
|
|
|
let props = defineProps({
|
|
seatGroups: Array<SeatGroupModel>
|
|
})
|
|
|
|
function findSeatCategory(name: string): SeatGroupModel {
|
|
return props.seatGroups.find(category =>
|
|
category.name == name
|
|
)
|
|
}
|
|
|
|
const seatGroupA = findSeatCategory("A")
|
|
const seatGroupB = findSeatCategory("B")
|
|
const seatGroupC = findSeatCategory("C")
|
|
const seatGroupD = findSeatCategory("D")
|
|
const seatGroupE = findSeatCategory("E")
|
|
const seatGroupF = findSeatCategory("F")
|
|
</script>
|
|
|
|
<template>
|
|
<v-row>
|
|
<v-col></v-col>
|
|
|
|
<v-col>
|
|
<v-sheet
|
|
color="grey-darken-3"
|
|
height="50"
|
|
class="px-5 py-2 d-flex justify-center align-center"
|
|
>
|
|
{{ $t('stage') }}
|
|
</v-sheet>
|
|
</v-col>
|
|
|
|
<v-col></v-col>
|
|
</v-row>
|
|
|
|
<v-row>
|
|
<v-col>
|
|
<seat-group-sheet :seat-group="seatGroupC" background-color="cyan-darken-4" />
|
|
</v-col>
|
|
|
|
<v-col>
|
|
<seat-group-sheet :seat-group="seatGroupA" background-color="grey" />
|
|
</v-col>
|
|
|
|
<v-col>
|
|
<seat-group-sheet :seat-group="seatGroupB" background-color="cyan-darken-4" />
|
|
</v-col>
|
|
</v-row>
|
|
|
|
<v-row>
|
|
<v-col>
|
|
<seat-group-sheet :seat-group="seatGroupF" background-color="deep-purple-darken-4" />
|
|
</v-col>
|
|
|
|
<v-col>
|
|
<seat-group-sheet :seat-group="seatGroupD" background-color="indigo-darken-4" />
|
|
</v-col>
|
|
|
|
<v-col>
|
|
<seat-group-sheet :seat-group="seatGroupE" background-color="deep-purple-darken-4" />
|
|
</v-col>
|
|
</v-row>
|
|
</template> |