77 lines
1.8 KiB
Vue
77 lines
1.8 KiB
Vue
<template>
|
|
<div>
|
|
<v-layout v-for="staff in xstaffs">
|
|
<v-flex xs12 mb-2 >
|
|
<v-card
|
|
color="white"
|
|
>
|
|
<v-card-title style="padding: 7px;" class="title text-sm-center">
|
|
<v-btn block depressed color="info">{{staff.M_StaffName}}</v-btn>
|
|
</v-card-title>
|
|
<v-divider color="#2196f3"></v-divider>
|
|
<v-card-text style="padding:10px" class="white text--primary">
|
|
|
|
<v-layout row>
|
|
<v-flex xs6>
|
|
<div class="subheading font-weight-bold text-sm-left pl-1">jam</div>
|
|
</v-flex>
|
|
<v-flex xs6>
|
|
<div class="subheading font-weight-bold text-sm-right">area</div>
|
|
</v-flex>
|
|
</v-layout>
|
|
<v-layout row>
|
|
<v-flex mt-1 mb-2 xs6>
|
|
<v-btn v-for="time in staff.times"
|
|
color="error"
|
|
dark
|
|
depressed
|
|
small
|
|
class="btn-time"
|
|
>
|
|
{{time.xtime}}
|
|
</v-btn>
|
|
</v-flex>
|
|
<v-flex mt-1 xs6 class="text-sm-right">
|
|
<v-btn v-for="area in staff.areas"
|
|
color="info"
|
|
dark
|
|
outline
|
|
small
|
|
class="btn-time"
|
|
>
|
|
{{area.xarea}}
|
|
</v-btn>
|
|
</v-flex>
|
|
</v-layout>
|
|
</v-card-text>
|
|
</v-card>
|
|
</v-flex>
|
|
</v-layout>
|
|
|
|
</div>
|
|
</template>
|
|
|
|
<style scoped>
|
|
.btn-time{
|
|
margin: 3px 1px!important;
|
|
min-width: 50px!important;
|
|
}
|
|
</style>
|
|
|
|
<script>
|
|
module.exports = {
|
|
data() {
|
|
return {
|
|
}
|
|
},
|
|
computed: {
|
|
xstaffs(){
|
|
return this.$store.state.order.staffs
|
|
}
|
|
},
|
|
methods : {
|
|
|
|
}
|
|
}
|
|
</script>
|