TT#88206 CSC: As a PbxAdmin, I want to toggle visibility of the number towards the callee for myself

√ Can see a "PBXSettings" item in menu if user is allowed to
√ Can go to separate page "PBXSettings"
√ Can toggle the setting "clir_intrapbx" by a Quasar toggle button
√ Can see a success toast for both cases (on/off)
√ Can see a spinner until the settings are loaded

Change-Id: I98a4328dbf5a23ae159009d22e3bc172306d5f62

src/api/pbx-seats.js

@@ -8,7 +8,8 @@ import {
     setPbxWebPassword,
     setPbxGroupIds,
     setSubscriberNumbers,
-    setPreferenceIntraPbx
+    setPreferenceIntraPbx,
+    getPreferences
 } from "./subscriber";
 import _ from "lodash";
 import {
@@ -296,3 +297,15 @@ export function setSeatSoundSet(options) {
         });
     });
 }
+
+/**
+ * @param seatId
+ */
+export async function getSeatPreferences(seatId) {
+    try {
+        return await getPreferences(seatId);
+    }
+    catch(err){
+        return err;
+    }
+}

src/components/layouts/Default.vue

@@ -141,6 +141,7 @@
             :is-call-forward="isCallForward"
             :is-call-blocking="isCallBlocking"
             :is-pbx-admin="isPbxAdmin"
+            :is-pbx-enabled="isPbxEnabled"
             :is-pbx-configuration="isPbxConfiguration"
         />
         <router-view />
@@ -308,6 +309,7 @@
                 'hasUser',
                 'getUsername',
                 'isPbxAdmin',
+                'isPbxEnabled',
                 'hasSmsCapability',
                 'hasFaxCapability',
                 'hasSendSmsFeature',

src/components/layouts/MainMenu.vue

@@ -228,6 +228,18 @@
                 />
             </q-side-link>
         </q-collapsible>
+        <q-side-link
+            item
+            to="/user/pbx-settings"
+            v-if="isPbxEnabled"
+        >
+            <q-item-side
+                icon="build"
+            />
+            <q-item-main
+                :label="$t('navigation.pbxSettings.title')"
+            />
+        </q-side-link>
     </q-list>
 </template>
 
@@ -260,6 +272,7 @@
             'isCallForward',
             'isCallBlocking',
             'isPbxAdmin',
+            'isPbxEnabled',
             'isPbxConfiguration'
         ],
         computed: {

src/components/pages/PbxSettings/CscPbxSettings.vue

@@ -0,0 +1,117 @@
+
+<template>
+    <csc-page
+        class="csc-simple-page">
+        <div
+            class="row"
+        >
+            <div
+                class="col col-xs-12 col-md-12"
+            >
+                <q-toggle
+                    :disabled="isLoading"
+                    class="csc-pbx-settings-toggle"
+                    :label="clirIntrapbx ? $t('pbxConfig.selfPbxHidden') : $t('pbxConfig.selfPbxVisible')"
+                    v-model="clirIntrapbx"
+                    @change="changeIntraPbx"
+                    checked-icon="visibility_off"
+                    unchecked-icon="visibility"
+                />
+                <q-spinner-dots
+                    v-if="isLoading"
+                    class="csc-pbx-settings-spinner"
+                    color="primary"
+                    :size="24"
+                />
+            </div>
+        </div>
+    </csc-page>
+</template>
+
+<script>
+    import {
+        QToggle,
+        QSpinnerDots
+    } from 'quasar-framework'
+    import { mapState, mapActions, mapGetters } from 'vuex'
+    import CscPage from '../../CscPage'
+    import {
+        showGlobalError,
+        showToast
+    } from '../../../helpers/ui'
+    import {
+        RequestState
+    } from "../../../store/common";
+    export default {
+        data () {
+            return {
+                clirIntrapbx: false,
+                isLoading: false
+            }
+        },
+        components: {
+            QToggle,
+            QSpinnerDots,
+            CscPage
+        },
+        async mounted() {
+            this.requestInProgress(true);
+            const subscriberId = localStorage.getItem('subscriberId');
+            const preferences = await this.loadPreferences(subscriberId);
+            this.clirIntrapbx = preferences.clir_intrapbx;
+            this.requestInProgress(false);
+        },
+        computed: {
+            ...mapGetters('pbxSeats', [
+                'getIntraPbx'
+            ]),
+            ...mapState('pbxSeats', [
+                'seatUpdateState',
+                'seatUpdateError'
+            ]),
+        },
+        watch: {
+            seatUpdateState(state) {
+                switch(state){
+                    case RequestState.requesting:
+                        this.requestInProgress(true);
+                    break;
+                    case RequestState.succeeded :
+                        showToast(this.clirIntrapbx ? this.$t('pbxConfig.selfPbxHidden') : this.$t('pbxConfig.selfPbxVisible'));
+                        this.requestInProgress(false);
+                    break;
+                    case RequestState.failed :
+                        showGlobalError(this.seatUpdateError, 5000);
+                        this.requestInProgress(false);
+                    break;
+                }
+            },
+        },
+        methods: {
+            ...mapActions('pbxSeats', [
+                'setIntraPbx',
+                'loadPreferences'
+            ]),
+            changeIntraPbx(){
+                const msg = this.clirIntrapbx ? this.$t('pbxConfig.selfPbxHidden') : this.$t('pbxConfig.selfPbxVisible');
+                this.setIntraPbx({
+                    seatId: localStorage.getItem('subscriberId'),
+                    intraPbx: this.clirIntrapbx,
+                    message: msg
+                });
+            },
+            requestInProgress(loading){
+                this.isLoading = loading;
+            }
+        }
+    }
+</script>
+
+<style lang="stylus" rel="stylesheet/stylus">
+    @import '../../../themes/quasar.variables';
+    .csc-pbx-settings-toggle
+        margin-top 18px
+    .csc-pbx-settings-spinner
+        margin-left 10px
+        padding-top 18px
+</style>

src/locales/en.json

@@ -109,6 +109,10 @@
             "soundSets": "Sound Sets",
             "msConfigs": "Manager Secretary"
         },
+        "pbxSettings": {
+            "title": "PBX Settings",
+            "subTitle": "Set your PBX settings"
+        },
         "voicebox": {
             "title": "Voicebox",
             "subTitle": "Set your voicebox settings"
@@ -579,6 +583,8 @@
         "msConfigRemovalToast": "Removed manager secretary config for {msConfig} successfully",
         "noMsConfigs": "No manager secretary configuration created yet",
         "toggleIntraPbx": "Hide number within own PBX",
+        "selfPbxVisible": "Your number is visible to the callee within own PBX",
+        "selfPbxHidden": "Your number is hidden to the callee within own PBX",
         "intraPbx": "the visibility of the number within own PBX"
     },
     "callBlocking": {

src/routes.js

@@ -21,6 +21,7 @@ import PbxConfigurationDevices from './components/pages/PbxConfiguration/CscPbxD
 import PbxConfigurationCallQueues from './components/pages/PbxConfiguration/CscPbxCallQueues'
 import PbxConfigurationSoundSets from './components/pages/PbxConfiguration/CscPbxSoundSets'
 import PbxConfigurationMsConfigs from './components/pages/PbxConfiguration/CscPbxMsConfigs'
+import PbxSettings from './components/pages/PbxSettings/CscPbxSettings'
 import Voicebox from './components/pages/Voicebox/Voicebox';
 import Login from './components/Login'
 import CscUserSettings from './components/pages/CscUserSettings'
@@ -162,6 +163,14 @@ export default [
                     subtitle: i18n.t('navigation.pbxConfiguration.msConfigs')
                 }
             },
+            {
+                path: 'pbx-settings',
+                component: PbxSettings,
+                meta: {
+                    title: i18n.t('navigation.pbxSettings.title'),
+                    subtitle: i18n.t('navigation.pbxSettings.subTitle')
+                }
+            },
             {
                 path: 'voicebox',
                 component: Voicebox,

src/store/pbx-seats.js

@@ -19,7 +19,8 @@ import {
     setSeatNumbers,
     setSeatSoundSet,
     setSeatIntraPbx,
-    setSeatWebPassword
+    setSeatWebPassword,
+    getSeatPreferences
 } from "../api/pbx-seats";
 
 export default {
@@ -248,6 +249,9 @@ export default {
         }
     },
     actions: {
+        loadPreferences(context, seatId){
+            return getSeatPreferences(seatId);
+        },
         loadSeatListItems(context, options) {
             return new Promise((resolve, reject)=>{
                 let page = _.get(options, 'page', context.state.seatListCurrentPage);
@@ -398,7 +402,7 @@ export default {
         async setIntraPbx(context, options) {
             context.commit('seatUpdateRequesting', {
                 seatId: options.seatId,
-                seatField: i18n.t('pbxConfig.intraPbx')
+                seatField: options.message || i18n.t('pbxConfig.intraPbx')
             });
             try{
                 const result = await setSeatIntraPbx(options.seatId, options.intraPbx);

src/store/user.js

@@ -68,6 +68,9 @@ export default {
         isPbxAdmin(state, getters) {
             return getters.isAdmin && state.capabilities !== null && state.capabilities.cloudpbx;
         },
+        isPbxEnabled(state) {
+            return state.capabilities !== null && state.capabilities.cloudpbx;
+        },
         hasSmsCapability(state) {
             return state.capabilities !== null &&
                 state.capabilities.sms  === true;