TT#81174 CF: Can see the title "If online and call from nameOfTheSourceList" after saving the new source list initially

Change-Id: If5bf1d1fb24a05dfea3a02a47a6e664ae4500c71

src/api/call-forward.js

@@ -804,6 +804,18 @@ export function appendTimeToTimeset(options) {
     });
 }
 
+
+export function getSourcesetById(id) {
+    return new Promise((resolve, reject)=>{
+        Vue.http.get('api/cfsourcesets/' + id).then((res)=>{
+            let sourceset = getJsonBody(res.body);
+            resolve(sourceset);
+        }).catch((err) => {
+            reject(err);
+        });
+    });
+}
+
 export function getSourcesBySourcesetId(id) {
     return new Promise((resolve, reject)=>{
         Vue.http.get('api/cfsourcesets/' + id).then((res)=>{

src/components/pages/NewCallForward/CscCallForwardGroup.vue

@@ -9,16 +9,40 @@
                 <div
                     class="col col-xs-12 col-md-4 text-right csc-cf-group-title"
                 >
+
                     {{groupTitle}}
+
                     <span
-                        v-if="isOnlineFromGroup"
+                        class="csc-cf-destination-add-condition"
-                        class="csc-cf-from-link"
+                        v-if="!groupSourceset"
                     >
-                        {{$t('pages.newCallForward.titles.timeoutGroupFromPost')}}
+                        <q-icon
+                            name="add"
+                            color="primary"
+                            size="20px"
+                        />
+
+                        {{ $t('pages.newCallForward.conditionBtnLabel') }}
+
+                        <q-popover
+                            ref="conditions"
+                            class="csc-cf-number-form"
+                            @open="showConditions()"
+                            @close="showConditionForm()"
+                        >
+                            <csc-new-call-forward-condition-type-select
+                                ref="addCondition"
+                                :enabled="true"
+                                :groupName="group.name"
+                                :groupId="group.id"
+                            />
+                        </q-popover>
                         <q-popover
-                            ref="onlineSourcest"
+                            ref="onlineSourceset"
                             class="csc-cf-number-form"
+                            v-bind:class="{ 'csc-cf-popover-hide': toggleConditionFromForm }"
                             @open="showSourcesetForm()"
+                            @close="resetToggleCondition()"
                         >
                             <csc-new-call-forward-add-sourceset-form
                                 ref="addSourceSet"
@@ -28,19 +52,13 @@
                             />
                         </q-popover>
                     </span>
+
                     <span
-                        v-if="isOfflineFromGroup"
+                        v-if="groupSourceset"
-                        class="csc-cf-from-link"
-                        @click=""
-                    >
-                        {{$t('pages.newCallForward.titles.timeoutGroupFromPost')}}
-                    </span>
-                    <span
-                        v-if="isBusyFromGroup"
                         class="csc-cf-from-link"
-                        @click=""
                     >
-                        {{$t('pages.newCallForward.titles.timeoutGroupFromPost')}}
+                        {{ $t('pages.newCallForward.fromLabelShort') +'"'+ groupSourceset +'"'}}
+
                     </span>
                 </div>
                 <div class="col text-left col-xs-12 col-md-2 csc-cf-dest-number-cont">
@@ -139,6 +157,7 @@
     import CscNewCallForwardDestination from './CscNewCallForwardDestination'
     import CscNewCallForwardAddDestinationForm from './CscNewCallForwardAddDestinationForm'
     import CscNewCallForwardAddSourcesetForm from './CscNewCallForwardAddSourcesetForm'
+    import CscNewCallForwardConditionTypeSelect from './CscNewCallForwardConditionTypeSelect'
     import CscNewCallForwardDestinationTypeForm from './CscNewCallForwardDestinationTypeForm'
     export default {
         name: 'csc-cf-group',
@@ -158,6 +177,7 @@
             CscNewCallForwardDestination,
             CscNewCallForwardAddDestinationForm,
             CscNewCallForwardAddSourcesetForm,
+            CscNewCallForwardConditionTypeSelect,
             CscNewCallForwardDestinationTypeForm
         },
         data () {
@@ -165,7 +185,9 @@
                 toggleGroup: true,
                 isEnabled: true,
                 toggleNumberForm: true,
-                toggleGroupInProgress: false
+                toggleConditionFromForm: true,
+                toggleGroupInProgress: false,
+                sourceSet: null
             };
         },
         async mounted(){
@@ -174,7 +196,7 @@
                     const isGroupEnabled =  await this.$store.dispatch('newCallForward/isGroupEnabled', {groupName: this.group.name, id: this.group.id});
                     this.isEnabled = isGroupEnabled;
                 }
-
+                this.updateSourcesetNames()
             }
             catch(err){
                 console.log(err)
@@ -184,7 +206,8 @@
             ...mapGetters('newCallForward', [
                 'getOwnPhoneTimeout',
                 'destinationInCreation',
-                'groupsCount'
+                'groupsCount',
+                'getMappings'
             ]),
             showAddDestBtn(){
                 const destinations = this.group.destinations;
@@ -216,16 +239,15 @@
                 }
                 return title;
             },
-            isOnlineFromGroup(){
+            groupSourceset(){
-                return this.group.name.includes('timeout-from') || this.group.name.includes('unconditional-from');
+                return this.sourceSet ? this.sourceSet.name : false;
-            },
-            isOfflineFromGroup(){
-                return this.group.name.includes('offline-from');
-            },
-            isBusyFromGroup(){
-                return this.group.name.includes('offline-busy');
             }
         },
+        watch: {
+             group: function () {
+                 this.updateSourcesetNames();
+            },
+        },
         methods: {
             // we need to generate key because destinations have no id
             genKey(){
@@ -248,6 +270,14 @@
                     break;
                 }
             },
+            async showConditionForm(){
+                switch(this.$refs.addCondition.action){
+                    case 'addFromCondition':
+                        this.toggleConditionFromForm = false;
+                        this.$refs.onlineSourceset.open();
+                    break;
+                }
+            },
             showDestTypeForm(){
                 this.toggleNumberForm = true;
                 this.$refs.selectDestinationType.add();
@@ -271,9 +301,29 @@
                 });
                 this.toggleGroupInProgress = false;
             },
-
+            showConditions(){
+                this.$refs.addCondition.add();
+                this.$refs.addSourceSet.cancel();
+            },
             showSourcesetForm(){
                 this.$refs.addSourceSet.add();
+            },
+            resetToggleCondition(){
+                this.toggleConditionFromForm = true;
+            },
+            async updateSourcesetNames(){
+                const mappings = this.getMappings;
+                const groupMappingId = await this.$store.dispatch('newCallForward/getMappingIdByGroupName', this.group.name);
+                let groupMapping, sourceSet;
+                if(mappings[groupMappingId]){
+                    groupMapping =  mappings[groupMappingId].filter(($mapping)=>{
+                        return $mapping.destinationset_id == this.group.id;
+                    });
+                    sourceSet = groupMapping[0] ? await this.$store.dispatch('newCallForward/getSourcesetById', groupMapping[0].sourceset_id) :  null;
+                    if(sourceSet){
+                        this.sourceSet = sourceSet
+                    }
+                }
             }
         }
     }
@@ -289,6 +339,10 @@
         text-align right
     .csc-cf-destination-value
         text-align center
+    .csc-cf-destination-add-condition
+        color $primary
+        cursor pointer
+        font-size 16px
     .csc-cf-destination-add-destination
         padding-left 25px
         width 250px

src/components/pages/NewCallForward/CscNewCallForwardAddSourcesetForm.vue

@@ -102,11 +102,6 @@
                 minLength: 1
             }
         },
-        updated(){
-            if(Number.isInteger(this.index)){
-                this.destinationIndex = this.index;
-            }
-        },
         computed: {
             ...mapGetters('newCallForward', [
                 'destinationInCreation'
@@ -121,21 +116,28 @@
                 const forwardGroupId = this.groupId;
                 const forwardGroupName = this.groupName;
                 const forwardGroup = await this.$store.dispatch('newCallForward/getForwardGroupById', forwardGroupId);
+                
                 if (this.numberError || this.nameError || this.saveDisabled) {
                     showGlobalError(this.$t('validationErrors.generic'));
                 }
                 switch(this.mode){
                     case 'create':
-                        // 1. create sourceset adding name , source and mode: "whitelist"
+                        try{
-                        sourceSetId = await this.$store.dispatch('newCallForward/createSourceSet', {
+                            sourceSetId = await this.$store.dispatch('newCallForward/createSourceSet', {
-                            name: this.name,
+                                name: this.name,
-                            source: this.number
+                                source: this.number
-                        });
+                            });
-                        await this.$store.dispatch('newCallForward/addSourcesetToGroup', {
+                            await this.$store.dispatch('newCallForward/addSourcesetToGroup', {
-                            name:   forwardGroupName,
+                                name:   forwardGroupName,
-                            id: forwardGroupId,
+                                id: forwardGroupId,
-                            sourceSetId: sourceSetId
+                                sourceSetId: sourceSetId
-                        });
+                            });
+                            await this.$store.dispatch('newCallForward/loadForwardGroups');
+                        }
+                        catch(err){
+                            console.log(err)
+                        }
+
 
                     break;
                     case 'edit':
@@ -145,10 +147,12 @@
             },
             cancel() {
                 this.number = '';
+                this.name = '';
                 this.enabled = false;
             },
             add() {
                 this.number = '';
+                this.name = '';
                 this.enabled = true;
             },
             close() {

src/components/pages/NewCallForward/CscNewCallForwardConditionTypeSelect.vue

@@ -0,0 +1,66 @@
+<template>
+    <div
+        v-if="enabled"
+    >
+        <div
+            class="csc-cf-dest-type"
+            @click="addFromCondition()"
+        >
+            {{ $t('pages.newCallForward.fromLabel') }}
+        </div>
+    </div>
+</template>
+
+<script>
+    import {
+        mapGetters,
+    } from 'vuex'
+    import CscSpinner from '../../CscSpinner'
+    import { } from 'quasar-framework'
+
+    export default {
+        name: 'csc-new-call-forward-condition-type-select',
+        components: {
+            CscSpinner
+        },
+        data () {
+            return {
+                enabled: true,
+                action: null
+            }
+        },
+        computed: {
+            ...mapGetters('newCallForward', [
+            ])
+        },
+        methods: {
+
+            async addFromCondition(){
+                this.action = "addFromCondition";
+                this.$parent.close()
+            },
+
+            cancel() {
+                this.action = null;
+                this.enabled = false;
+            },
+            add() {
+                this.enabled = true;
+            },
+            close() {
+                this.action = null;
+                this.enabled = false;
+            },
+        }
+    }
+</script>
+
+<style lang="stylus" rel="stylesheet/stylus">
+    @import '../../../themes/app.common.styl'
+    .csc-cf-dest-type
+        min-width 100px
+        padding 10px
+        cursor pointer
+    .csc-cf-dest-type:hover
+        background $main-menu-item-hover-background
+</style>

src/components/pages/NewCallForward/CscNewCallForwardDestinationsetTypeSelect.vue

@@ -4,28 +4,24 @@
     >
         <div
             class="csc-cf-dest-type"
-            v-if="!unconditionalGroupExists && !timeoutGroupExists"
             @click="addDestinationsetUnconditional()"
         >
             {{ $t('pages.newCallForward.unconditionalLabel') }}
         </div>
-        <div
+        <!-- <div
             class="csc-cf-dest-type"
-            v-if="!unconditionalGroupExists && !timeoutFromGroupExists"
             @click="addDestinationsetUnconditionalFrom()"
         >
             {{ $t('pages.newCallForward.unconditionalFromLabel') }}
-        </div>
+        </div> -->
         <div
             class="csc-cf-dest-type"
-            v-if="!offlineGroupExists"
             @click="addDestinationsetOffline()"
         >
             {{ $t('pages.newCallForward.offlineLabel') }}
         </div>
         <div
             class="csc-cf-dest-type"
-            v-if="!busyGroupExists"
             @click="addDestinationsetBusy()"
         >
             {{ $t('pages.newCallForward.busyLabel') }}

src/locales/en.json

@@ -221,6 +221,7 @@
             "primarNumberEnabled": "All calls go to the primary number",
             "primarNumberDisabled": "No call goes to primary number",
             "forwardBtnLabel": "Add forwarding",
+            "conditionBtnLabel": "add condition",
             "numberLabel": "Number",
             "voiceMailLabel": "Voicemail",
             "destinationTimeoutLabel": "Then after ",
@@ -232,7 +233,8 @@
             "cancelDialogTitle": "Delete from {groupName} forwarding",
             "cancelDialogText": "You are about to delete {destination} from {groupName} call forwarding",
             "unconditionalLabel": "If online",
-            "unconditionalFromLabel": "If online and call from ...",
+            "fromLabel": "If call from ...",
+            "fromLabelShort": " and call from ",
             "offlineLabel": "If offline",
             "busyLabel": "If busy",
             "sourcesetName": "List name"

src/store/new-call-forward.js

@@ -9,7 +9,9 @@ import {
     addNewMapping,
     updateOwnPhoneTimeout,
     updateDestinationsetName,
-    createSourcesetWithSource
+    createSourcesetWithSource,
+    getSourcesetById,
+    // getSourcesets
 } from '../api/call-forward';
 
 const ForwardGroup = {
@@ -190,12 +192,21 @@ export default {
                 const allMappings = context.getters.getMappings;
                 let groupMappings = allMappings[groupMappingId];
 
-                groupMappings.push({
+                if(data.replaceMapping){
-                    "destinationset_id": data.groupId,
+                    for(let mapping of groupMappings){
-                    "sourceset_id": data.sourceSetId || null,
+                        if(mapping.destinationset_id === data.groupId){
-                    "timeset_id":null
+                            mapping.sourceset_id = data.sourceSetId || null;
-                });
+                            break;
-
+                        }
+                    }
+                }
+                else{
+                    groupMappings.push({
+                        "destinationset_id": data.groupId,
+                        "sourceset_id": data.sourceSetId || null,
+                        "timeset_id":null
+                    });
+                }
                 await addNewMapping({
                     mappings: groupMappings,
                     group: groupMappingId,
@@ -558,12 +569,26 @@ export default {
             });
             return sourceSetId;
         },
-    async addSourcesetToGroup(context, data){
+        async addSourcesetToGroup(context, data){
-            await context.dispatch('editMapping', {
+            try{
-                name: data.name,
+                await context.dispatch('editMapping', {
-                groupId: data.id,
+                    name: data.name,
-                sourceSetId: data.sourceSetId
+                    groupId: data.id,
-            });
+                    sourceSetId: data.sourceSetId,
+                    replaceMapping: true
+                });
+            }
+            catch(err){
+                console.log(err)
+            }
+        },
+        // async getSourcesets(){
+        //     const sourceSets = await getSourcesets(localStorage.getItem('subscriberId'));
+        //     return sourceSet;
+        // },
+        async getSourcesetById(context, id){
+            const sourceSet = await getSourcesetById(id);
+            return sourceSet;
         }
     }
 };