What has been done: - TT#31810, CallForwarding: Implement api requests - TT#32002, CallForwarding: Implement store - TT#32001, CallForwarding: Implement UI component - TT#32003, CallForwarding: Create test Change-Id: I2c858ea73bde7ec8a71127dd48d3e8de6121fd37changes/60/18760/15
parent
57a26ca298
commit
f345683357
@ -0,0 +1,64 @@
|
||||
<template>
|
||||
<q-field class="time-field">
|
||||
<div class="row no-wrap">
|
||||
<q-input class="col-8"
|
||||
v-model="weekday"
|
||||
readonly />
|
||||
<q-datetime
|
||||
class="col-2"
|
||||
color="primary"
|
||||
v-model="from"
|
||||
align="right"
|
||||
type="time"
|
||||
format24h
|
||||
readonly />
|
||||
<q-datetime
|
||||
class="col-2"
|
||||
color="primary"
|
||||
v-model="to"
|
||||
align="right"
|
||||
type="time"
|
||||
format24h
|
||||
readonly />
|
||||
</div>
|
||||
</q-field>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { QField, QInput, QDatetime, date } from 'quasar-framework'
|
||||
export default {
|
||||
name: 'csc-call-forward-time',
|
||||
props: [
|
||||
'time'
|
||||
],
|
||||
data () {
|
||||
return {
|
||||
}
|
||||
},
|
||||
components: {
|
||||
QField,
|
||||
QInput,
|
||||
QDatetime
|
||||
},
|
||||
computed: {
|
||||
weekday() {
|
||||
return this.time.weekday;
|
||||
},
|
||||
from() {
|
||||
return date.buildDate({
|
||||
hours: this.time.from.split(':')[0],
|
||||
minutes: this.time.from.split(':')[1]
|
||||
});
|
||||
},
|
||||
to() {
|
||||
return date.buildDate({
|
||||
hours: this.time.to.split(':')[0],
|
||||
minutes: this.time.to.split(':')[1]
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="stylus">
|
||||
</style>
|
@ -0,0 +1,83 @@
|
||||
<template>
|
||||
<q-card class="times-card">
|
||||
<q-card-title class="times-title">
|
||||
Times
|
||||
</q-card-title>
|
||||
<q-card-main>
|
||||
<div class="row no-wrap">
|
||||
<p class="col-8 ">{{ $t('pages.callForward.times.weekday') }}</p>
|
||||
<p class="col-2 hour-label">{{ $t('pages.callForward.times.from') }}</p>
|
||||
<p class="col-2 hour-label">{{ $t('pages.callForward.times.to') }}</p</p>
|
||||
</div>
|
||||
<csc-call-forward-time v-if="times.length > 0" v-for="(time, index) in times" :time="time">
|
||||
</csc-call-forward-time>
|
||||
</q-card-main>
|
||||
<q-card-actions>
|
||||
<q-field v-if="!addFormEnabled">
|
||||
<q-btn color="primary"
|
||||
class="add-time"
|
||||
icon="fa-plus" flat
|
||||
@click="enableAddForm()">{{ $t('pages.callForward.times.addTimeButton') }}</q-btn>
|
||||
</q-field>
|
||||
</q-card-actions>
|
||||
</q-card>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import numberFormat from '../../../filters/number-format'
|
||||
import CscCallForwardTime from './CscCallForwardTime'
|
||||
import { mapState } from 'vuex'
|
||||
import { QCard, QCardTitle, QCardMain, QCardActions,
|
||||
QField, QBtn } from 'quasar-framework'
|
||||
export default {
|
||||
name: 'csc-call-forward-times',
|
||||
props: [
|
||||
'times'
|
||||
],
|
||||
data () {
|
||||
return {
|
||||
addFormEnabled: false
|
||||
}
|
||||
},
|
||||
components: {
|
||||
CscCallForwardTime,
|
||||
QCard,
|
||||
QCardTitle,
|
||||
QCardMain,
|
||||
QCardActions,
|
||||
QField,
|
||||
QBtn
|
||||
},
|
||||
methods: {
|
||||
enableAddForm() {
|
||||
console.log('enableAddForm()');
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="stylus">
|
||||
@import '~variables'
|
||||
.times-title
|
||||
color $primary
|
||||
padding-left 5px
|
||||
padding-bottom 8px
|
||||
.times-card
|
||||
padding 0 15px
|
||||
.q-field
|
||||
margin 5px 0
|
||||
.q-card-actions
|
||||
padding-top 0
|
||||
padding-left 10px
|
||||
.q-card-main
|
||||
padding-bottom 8px
|
||||
.add-time
|
||||
margin-left 14px
|
||||
.row
|
||||
p
|
||||
font-size 0.9 rem
|
||||
color $secondary
|
||||
margin-bottom 0
|
||||
.hour-label
|
||||
text-align right
|
||||
</style>
|
Loading…
Reference in new issue