TT#39926 Fix add source vue-warn prop error

What has been done:
- TT#39821, [Issue] Call: Vuex dev error appears when caller ends call
- TT#39926, [Issue] CallForwarding: Form for adding a source results in
- TT#40501, [Issue] Global: Vue-warn dev error regarding use of Dialog
  as component id
- TT#39925, [Issue] CallForwarding: TypeError errors appear when deleting
  sourceset vue-warn prop error
- TT#40517, [Issue] CallForwarding: Readonly not working for q-datetime

Change-Id: Ie1ad1c4ce094f070f8fd24fa35fa2f9024f1c3a3

src/components/CscCall.vue

@@ -83,12 +83,26 @@
     import _ from 'lodash';
     import { mapGetters } from 'vuex'
     import CscMedia from './CscMedia'
-    import { QLayout, QCard, QCardTitle, QCardSeparator, QCardMain, QField, QInput,
-        QCardActions, QBtn, QIcon, QSpinnerRings, Dialog, Platform, QAlert } from 'quasar-framework'
     import { normalizeNumber, rawNumber } from '../filters/number-format'
     import numberFormat from '../filters/number-format'
     import { showCallNotification } from '../helpers/ui'
     import { getChromeExtensionUrl } from '../helpers/cdk-lib'
+    import {
+        QLayout,
+        QCard,
+        QCardTitle,
+        QCardSeparator,
+        QCardMain,
+        QField,
+        QInput,
+        QCardActions,
+        QBtn,
+        QIcon,
+        QSpinnerRings,
+        Dialog,
+        Platform,
+        QAlert
+    } from 'quasar-framework'
 
     export default {
         name: 'csc-call',
@@ -113,7 +127,6 @@
             QIcon,
             QSpinnerRings,
             CscMedia,
-            Dialog,
             QAlert
         },
         methods: {

src/components/pages/CallBlocking/CscCallBlocking.vue

@@ -67,8 +67,29 @@
     import { showToast } from '../../../helpers/ui'
     import CscPage  from '../../CscPage'
     import CscToggle from '../../form/CscToggle'
-    import { QInput, QCard, QBtn, QField, QIcon, QCardTitle, QCardActions, Dialog, QSpinnerMat, QToggle,
+    import {
-        Toast, QList, QItem, QItemSide, QItemMain, QItemTile, QCardMain, QInnerLoading, QOptionGroup, QSelect, QRadio } from 'quasar-framework'
+        QInput,
+        QCard,
+        QBtn,
+        QField,
+        QIcon,
+        QCardTitle,
+        QCardActions,
+        Dialog,
+        QSpinnerMat,
+        QToggle,
+        Toast,
+        QList,
+        QItem,
+        QItemSide,
+        QItemMain,
+        QItemTile,
+        QCardMain,
+        QInnerLoading,
+        QOptionGroup,
+        QSelect,
+        QRadio
+    } from 'quasar-framework'
     export default {
         name: 'csc-call-blocking',
         props: [
@@ -116,7 +137,6 @@
             QIcon,
             QCardTitle,
             QCardActions,
-            Dialog,
             QInnerLoading,
             QSpinnerMat,
             CscToggle,

src/components/pages/CallForward/CscAddTimeForm.vue

@@ -35,9 +35,19 @@
 
 <script>
     import { mapState } from 'vuex'
-    import { QField, QSelect, QDatetime, QList, QItem, QItemMain, QItemTile,
-        QBtn, date } from 'quasar-framework'
     import { showGlobalError } from '../../../helpers/ui'
+    import {
+        QField,
+        QSelect,
+        QDatetime,
+        QList,
+        QItem,
+        QItemMain,
+        QItemTile,
+        QBtn,
+        date
+    } from 'quasar-framework'
+
     export default {
         name: 'csc-add-time-form',
         props: [
@@ -68,8 +78,7 @@
             QItem,
             QItemMain,
             QItemTile,
-            QBtn,
+            QBtn
-            date
         },
         computed: {
             ...mapState('callForward', [

src/components/pages/CallForward/CscCallForwardTime.vue

@@ -1,11 +1,12 @@
 <template>
     <q-item>
         <q-item-main>
-            <q-item-tile class="row no-wrap">
+            <q-item-tile class="row no-wrap csc-time">
                 <q-input
                     class="col"
                     v-model="weekday"
-                    readonly />
+                    readonly
+                />
                 <q-datetime
                     class="col"
                     color="primary"
@@ -13,7 +14,8 @@
                     align="right"
                     type="time"
                     format24h
-                    readonly />
+                    disable
+                />
                 <q-datetime
                     class="col"
                     color="primary"
@@ -21,7 +23,8 @@
                     align="right"
                     type="time"
                     format24h
-                    readonly />
+                    disable
+                />
             </q-item-tile>
         </q-item-main>
         <q-item-side class="csc-call-forward-time-btn-container">
@@ -36,11 +39,23 @@
 </template>
 
 <script>
-    import { QField, QInput, QDatetime, Dialog,
-        QBtn, QItem, QItemMain, QItemTile, QItemSide, Alert, date } from 'quasar-framework'
     import { mapGetters } from 'vuex'
     import 'quasar-extras/animate/bounceInRight.css'
     import 'quasar-extras/animate/bounceOutRight.css'
+    import {
+        QField,
+        QInput,
+        QDatetime,
+        Dialog,
+        QBtn,
+        QItem,
+        QItemMain,
+        QItemTile,
+        QItemSide,
+        Alert,
+        date
+    } from 'quasar-framework'
+
     export default {
         name: 'csc-call-forward-time',
         props: [
@@ -55,7 +70,6 @@
             QField,
             QInput,
             QDatetime,
-            Dialog,
             QBtn,
             QItem,
             QItemMain,
@@ -133,10 +147,17 @@
 </script>
 
 <style lang="stylus" rel="stylesheet/stylus">
+    @import '../../../themes/quasar.variables.styl'
 
     .q-item-side.csc-call-forward-time-btn-container
         margin-left 0
         .q-btn.csc-call-forward-time-btn
             .q-icon
                 margin-right 0
+
+    .csc-time
+        .q-if-disabled::before
+            background-image none
+            background-color currentColor
+
 </style>

src/components/pages/CallForward/CscCallForwardTimeset.vue

@@ -71,7 +71,6 @@
 
 <script>
     import { mapGetters } from 'vuex'
-    import { QAlert, QCard } from 'quasar-framework'
     import {
         startLoading,
         stopLoading,
@@ -82,6 +81,11 @@
     import CscCallForwardTimes from './CscCallForwardTimes'
     import CscAddTimeForm from './CscAddTimeForm'
     import CscSourcesets from './CscSourcesets'
+    import {
+        QAlert,
+        QCard
+    } from 'quasar-framework'
+
     export default {
         name: 'csc-call-forward-timeset',
         props: [

src/components/pages/CallForward/CscDestination.vue

@@ -91,8 +91,19 @@
     import _ from 'lodash'
     import { startLoading, stopLoading,
         showGlobalError } from '../../../helpers/ui'
-    import { QItem, QItemMain, QItemSide, QItemTile,
+    import {
-        Dialog, QBtn, QTooltip, QPopover, QList, Platform } from 'quasar-framework'
+        QItem,
+        QItemMain,
+        QItemSide,
+        QItemTile,
+        Dialog,
+        QBtn,
+        QTooltip,
+        QPopover,
+        QList,
+        Platform
+    } from 'quasar-framework'
+
     export default {
         name: 'csc-destination',
         props: [
@@ -106,7 +117,6 @@
             QItemMain,
             QItemSide,
             QItemTile,
-            Dialog,
             QBtn,
             QTooltip,
             QPopover,

src/components/pages/CallForward/CscSourcesets.vue

@@ -204,9 +204,7 @@
             QInput,
             QIcon,
             QSelect,
-            QBtn,
+            QBtn
-            Dialog,
-            Alert
         },
         computed: {
             ...mapGetters('callForward', [
@@ -280,10 +278,11 @@
                 this.tab = 'Everybody';
             },
             sourcesetSources(id) {
-                if (this.sourcesets[0]) {
+                let sourceset = this.sourcesets.filter((sourceset) => {
-                    return this.sourcesets.filter((sourceset) => {
+                    return sourceset.id === id;
-                        return sourceset.id === id;
+                })[0];
-                    })[0].sources;
+                if (this.sourcesets[0] && sourceset) {
+                    return sourceset.sources;
                 }
                 else {
                     return [];

src/components/pages/CallForward/CscSourcesetsForm.vue

@@ -36,7 +36,7 @@
     export default {
         name: 'csc-sourcesets-form',
         props: {
-            sourcesetId: String
+            sourcesetId: Number
         },
         data() {
             return {

src/components/pages/PbxConfiguration/CscPbxDevices.vue

@@ -86,8 +86,17 @@
     import CscPbxDevice from './CscPbxDevice'
     import CscPbxDeviceAddForm from './CscPbxDeviceAddForm'
     import CscPbxModelSelect from './CscPbxModelSelect'
-    import { QSpinnerDots, QPagination, QList, Dialog, QItem, QItemMain, QBtn, QSelect } from 'quasar-framework'
     import { showToast, showGlobalError } from '../../../helpers/ui'
+    import {
+        QSpinnerDots,
+        QPagination,
+        QList,
+        Dialog,
+        QItem,
+        QItemMain,
+        QBtn,
+        QSelect
+    } from 'quasar-framework'
 
     export default {
         data () {
@@ -108,7 +117,6 @@
             QSpinnerDots,
             QPagination,
             QList,
-            Dialog,
             QItem,
             QBtn,
             QSelect,

src/components/pages/PbxConfiguration/CscPbxGroups.vue

@@ -28,23 +28,57 @@
     import CscPage  from '../../CscPage'
     import CscPbxGroup  from './CscPbxGroup'
     import CscPbxGroupAddForm  from './CscPbxGroupAddForm'
-    import { QChip, QCard, QCardSeparator, QCardTitle, QCardMain,
-        QCardActions, QIcon, QPopover, QList, QItem, QItemMain,
-        QField, QInput, QBtn, QSelect, QInnerLoading, QSpinnerDots,
-        QSpinnerMat, Dialog, QPagination
-    } from 'quasar-framework'
     import aliasNumberOptions from '../../../mixins/alias-number-options'
     import itemError from '../../../mixins/item-error'
     import { showToast } from '../../../helpers/ui'
+    import {
+        QChip,
+        QCard,
+        QCardSeparator,
+        QCardTitle,
+        QCardMain,
+        QCardActions,
+        QIcon,
+        QPopover,
+        QList,
+        QItem,
+        QItemMain,
+        QField,
+        QInput,
+        QBtn,
+        QSelect,
+        QInnerLoading,
+        QSpinnerDots,
+        QSpinnerMat,
+        Dialog,
+        QPagination
+    } from 'quasar-framework'
 
     export default {
         mixins: [aliasNumberOptions, itemError],
         components: {
-            CscPage, CscPbxGroup, CscPbxGroupAddForm,
+            CscPage,
-            QChip, QCard, QCardSeparator, QCardTitle, QCardMain,
+            CscPbxGroup,
-            QCardActions, QIcon, QPopover, QList, QItem, QItemMain,
+            CscPbxGroupAddForm,
-            QField, QInput, QBtn, QSelect, QInnerLoading, QSpinnerDots,
+            QChip,
-            QSpinnerMat, Dialog, QPagination
+            QCard,
+            QCardSeparator,
+            QCardTitle,
+            QCardMain,
+            QCardActions,
+            QIcon,
+            QPopover,
+            QList,
+            QItem,
+            QItemMain,
+            QField,
+            QInput,
+            QBtn,
+            QSelect,
+            QInnerLoading,
+            QSpinnerDots,
+            QSpinnerMat,
+            QPagination
         },
         mounted() {
             this.$store.dispatch('pbxConfig/listGroups', {

src/components/pages/PbxConfiguration/CscPbxSeats.vue

@@ -26,14 +26,32 @@
     import CscPage  from '../../CscPage'
     import CscPbxSeatAddForm  from './CscPbxSeatAddForm'
     import CscPbxSeat  from './CscPbxSeat'
-    import { QChip, QCard, QCardSeparator, QCardTitle, QCardMain,
-        QCardActions, QIcon, QPopover, QList, QItem, QItemMain,
-        QField, QInput, QBtn, QSelect, QInnerLoading, QSpinnerDots,
-        QSpinnerMat, Dialog, QPagination } from 'quasar-framework'
     import aliasNumberOptions from '../../../mixins/alias-number-options'
     import itemError from '../../../mixins/item-error'
     import { mapGetters } from 'vuex'
     import { showToast } from '../../../helpers/ui'
+    import {
+        QChip,
+        QCard,
+        QCardSeparator,
+        QCardTitle,
+        QCardMain,
+        QCardActions,
+        QIcon,
+        QPopover,
+        QList,
+        QItem,
+        QItemMain,
+        QField,
+        QInput,
+        QBtn,
+        QSelect,
+        QInnerLoading,
+        QSpinnerDots,
+        QSpinnerMat,
+        Dialog,
+        QPagination
+    } from 'quasar-framework'
 
     export default {
         mixins: [aliasNumberOptions, itemError],
@@ -48,11 +66,28 @@
             }
         },
         components: {
-            CscPage, CscPbxSeat, CscPbxSeatAddForm,
+            CscPage,
-            QChip, QCard, QCardSeparator, QCardTitle, QCardMain,
+            CscPbxSeat,
-            QCardActions, QIcon, QPopover, QList, QItem, QItemMain,
+            CscPbxSeatAddForm,
-            QField, QInput, QBtn, QSelect, QInnerLoading, QSpinnerDots,
+            QChip,
-            QSpinnerMat, Dialog, QPagination
+            QCard,
+            QCardSeparator,
+            QCardTitle,
+            QCardMain,
+            QCardActions,
+            QIcon,
+            QPopover,
+            QList,
+            QItem,
+            QItemMain,
+            QField,
+            QInput,
+            QBtn,
+            QSelect,
+            QInnerLoading,
+            QSpinnerDots,
+            QSpinnerMat,
+            QPagination
         },
         computed: {
             ...mapGetters('pbxConfig', [

src/store/call.js

@@ -165,6 +165,9 @@ export default {
         startRinging(state) {
             state.callState = CallState.ringing;
         },
+        stopRinging(state) {
+            state.callState = CallState.ended;
+        },
         establishCall(state, remoteMediaStream) {
             state.remoteMediaStream = remoteMediaStream;
             state.callState = CallState.established;