2378
ActivitiesProductId
AddOnProductList VFUK-VADR-Data-Product SubscriptionId
ProductId
GetTariffProductList  activity looks for Handset Product type in the selected Recommendation and appends it to the GPL Request and
invokes GetProductListWrapper activity which invokes GPL API and the response is stored in the TariffProductList Dataset and appended to
the upgrade case property to be consumed by UI.
Applies ToVFUK-VADR-Work-Upgrade
Ruleset VADR-Rules
Input
Parameter
sN/A
Output
Parameter
sN/A
Error
HandlingPrimary Catch-all Error Handler: Catches all the unhandled exceptions or errors in the activityGetTariffProductList
GetHandsetProductList activity appends selected Recommendation to the GPL Request and invokes GetProductListWrapper activity which
invokes GPL API and the response is stored in the HandsetProductList Dataset and appended to the upgrade case property to be consumed
by UI.
Applies ToVFUK-VADR-Work-Upgrade
Ruleset VADR-Rules
Input
Parameter
sN/A
Output
Parameter
sN/A
Error
HandlingPrimary Catch-all Error Handler: Catches all the unhandled exceptions or errors in the activityGetHandsetProductList
GetInsuranceProductList activity looks for Handset Product type in the selected Recommendation and appends it to the GPL Request and
invokes GetProductListWrapper activity which invokes GPL API and the response is stored in the InsuranceProductList Dataset and
appended to the upgrade case property to be consumed by UI.GetInsuranceProductList


2379

 Applies ToVFUK-VADR-Work-Upgrade
Ruleset VADR-Rules
Input
Parameter
sN/A
Output
Parameter
sN/A
Error
HandlingPrimary Catch-all Error Handler: Catches all the unhandled exceptions or errors in the activity
GetDiscountProductList activity looks for Insurance, Tariff, and AddOn Product types in the selected Recommendation and appends them to
the GPL Request and invokes GetProductListWrapper activity which invokes GPL API and the response is appended to the upgrade case
property to be consumed by UI.
Applies ToVFUK-VADR-Work-Upgrade
Ruleset VADR-Rules
Input
Parameter
sN/A
Output
Parameter
sN/A
Error
HandlingPrimary Catch-all Error Handler: Catches all the unhandled exceptions or errors in the activityGetDiscountProductList
GetAddOnProductList  activity looks for Tariff Product type in the selected Recommendation and appends it to the GPL Request and invokes
GetProductListWrapper activity which invokes GPL API and the response is stored in the AddOnProductList Dataset and appended to the
upgrade case property to be consumed by UI.
Applies ToVFUK-VADR-Work-Upgrade
Ruleset VADR-Rules
Input
Parameter
sN/A
Output
Parameter
sN/AGetAddOnProductList


2380
Error
HandlingPrimary Catch-all Error Handler: Catches all the unhandled exceptions or errors in the activity
GetProductListWrapper activity is the common activity that prepares the request for GPL API & populates response data in GPL page.
Applies ToVFUK-VADR-Work-Upgrade
Ruleset VADR-Rules
Input
Parameter
sProductType
Output
Parameter
sN/A
Error
HandlingN/A (Managed by parent activities)GetProductListWrapper


2381
Pinning the Selected Products Card
A new functionality allowing the Agent to pin the Card prior to performing a 'Refine By'

IsPinned True/False  VFUK-VADR-UI-Deal
IsPinned True/False VFUK-VADR-Int-GR-RecommendationProperty Name Type Class Name
webwb pin-hover-icon png
webwb pinned-icon png
webwb unpinned-icon pngBinary Files


2382

 This Section displays the  Recommendations screen.
Applies To VFUK-VADR-UI-Deal
Ruleset VADR-UI
 Add 3 icons (next to saved banner) with visiblilty condition. Icon with IsPinned true or saved =true
Pinned(Saved)
Hover
Unpinned
These icons should have click option
When all three of recommendation are pinned, RefineBy button become disableSection - DisplaySubscriptionBundles
Manage to increase or decrease for number of recommendation when the icon is clicked
Applies To VFUK-VADR-UI-Deal
Ruleset VADR-UI
 On click action (to pin), it sets true for IsPinned and Saved
On click action (to unpin), it sets false for IsPinned and SavedDataTransform- SetPinConfiguration (New Rule Creation)
Manage to Ispinned and Saved property mapping between Work-Upgrade and UI-Deal classes
Applies To VFUK-VADR-UI-Deal
Ruleset VADR-UI
 Add mapping for Saved and IspinnedDataTransform- PopulateDealFromServiceData


2383
UI Artefacts
The layout flow which initiates the Recommendations screen:

M a p D a t a F o r U I activity calls a data transform of the same name which is responsible for converting the data from the Customer API into
easily traversable structures for the UI to use directly.  This in turn calls other data transforms to convert the individual items for the screens:
S e t A c c o u n t H o v e r D a t a (does the mapping and logic for what to display in the hovers on the Account Header)
S e t E x i s t i n g D e a l (does the mapping for the existing deal data)
S e t R e c o m m e n d a t i o n s (does the mapping for the recommendations)
These data transforms populate the UI data structures, that are detailed here.
More detail by screen function:
Customer Account
Recommendations
Edit Deal


2384
Customer Account

Sections of note
VFUK-VADR-Work-Upgrade.AccountHeader
Contains the account header and the refine by areas.
On click of the pop-out icon a flow in modal dialog is started (the Customer Detail screen):
CustomerDetail flow has one assignment, which displays the CustomerDetail section.


2385
CustomerDetail
This is s design template split into 3 distinct areas each implemented by sections:


2386
VFUK-VADR-UI-Customer.AccountHoldingDetail
Displays the results from OpenLines list of CustomerForUI which are the subscriptions for Customer.
IsVFTogether icon is set to true when there are OfferDetails for a subscription.


2387
VFTogether icon is displayed when IsVFTogether is true for each open line. On hover of this image VFDescription which is derived from the
OfferDescription of OfferDetails is displayed.


2388
Existing Deal
Existing Deal Body:
This section displays details about the customer's current deal plan.  CustomerForUI.ExistingDeal data page is used to display contents.
From MapDataForUI Data tranform SetExistingDeal data trasform is called. SetExistingDeal creates & populates
CustomerForUI.ExistingDeal data page.


2389
This section has many Dynamic layouts just to align the display with the recommendation screen.
ie:
It Displays blank space.


2390

Dynamic layout 1.1.6, 1.1.6, 1.1.6 displays AddOns/Discounts/Insurance/Accessory related data. The same repetitive dynamic layout is
called with different data pages.


2392
Existing Deal Footer:


2393
VFTogether :
VFTogether icon and MoreInfo embedded section (MoreInfoExistingDeal) is included in dynamic layout 1.1.2 of DisplayExistingDeal
section.


2394
VFTogether icon is displayed when  CustomerForUI.ExistingDeal.IsVFTogether is true and MoreInfoList in CustomerForUI.ExistingDeal
is displayed when MoreInfo is clicked.


2396
Update the Customer Address in the Customer Profile Panel
VFUK-VADR-UI-Customer.CustomerContactDetail Section Update
FlatNo, Building, Street and City lines have been removed
AddressLine1, AddressLine2, AddressLine3, AddressLine4 and Country have been added.
VFUK-VADR-UI-Customer.AddressLine1, AddressLine2, AddressLine3 and AddressLine4 Properties Creation
These new properties will be able to hold multiple properties of the response. Check below for more detail.
VFUK-VADR-UI-Customer.Country Property Creation
If the combination of County and Country will be longer than 26 characters, Country property will hold country information.
VFUK-VADR-Work-Upgrade.MapDataForUI Data Transform Update
Removed steps that are related to customer address.
Added Apply MapCustomerAddress data transform step instead.
VFUK-VADR-Work-Upgrade.MapCustomerAddress Data Transform Creation
AddressLine1 may hold FlatNumber, BuildingName, BuildingNumber and Street.
If the line gets more than 26 characters other values will be passed to AddressLine2 with the same order.
AddressLine3 will hold Locality and City
AddressLine4 will hold County information, and if the combination of County and Country is shorter than 26 characters, AddressLine4
will hold both.
VFUK-AOM-Int-Address.County, Country Property Creation
These two new properties have been created to hold relevant information with GetCustomer response.
VFUK-AOM-Int-Services.Prepare Customer API Response Activity Update
Added new mappings to Primary.GetCustomerResponse.Address page from Address Page for County and Country.


2397
Recommendations
Sections of note
VFUK-VADR-UI-Deal.DisplaySubscriptionBundles


2398

Dynamic Layout 1 and Dynamic Layout 2 contain the same object. Dynamic Layout 1 has a Non-promotional border layout, whereas
Dynamic Layout 2 has a Promotional border layout. It’s a Pega restriction that we can not have when conditions around the container
option.
Pencil Icon:

This will display when the deal is Non-Promotional This will display when the deal is Promotional
The normal border will display around the deal A promotional border will display around the deal.
 Dynamic Layout 1 Dynamic Layout 2


2399

It calls CopySelectedDeal data transform and opens the edit deal section. This is defined in the action tab of the icon.
4G/5G Icon:
  5G 4G


2400
VFTogether Icon :
VFTogether icon and MoreInfo embedded section is included in dynamic layout 1 and 2.
IsVFTogether is set to true when there are Offers in Recommendations.
Displayed when.Is5G is true. Displayed when.Is4G is true.


2401

VFTogether icon is displayed when IsVFTogether is true for a recommendation and MoreInfoList in RecommendedBundlesForUI  is
derived from the Offers and Detail in Recommendations which displays along with  Why Recommend? when MoreInfo is clicked.


2402
Device Detail:

Dynamic Layout 1.3.1, 1.3.2 ,1.5 get displayed  Dynamic Layout  1.3.3 , 1.3.4 get displayed

Delete Icon is displayed in ‘Edit deal’ when Deal is selected for
editing.  Handset Deal SIMO Deal


2403
Device delete Icon:
This icon is only displayed for the selected deal in the edit deal window.
It runs SetEditDealRefreshFlags DataTransform which sets the flags of respective sections to refresh after delete.
After that it runs DeleteSelectedDevice Activity which deletes the selected device line item as well as any insurance item related to the
device.


2404
In stock / Pre order / Unknown Icon:
These icons are displayed when the deal is a Handset deal, they are displayed both in Recommended deal and Selected deal sections.
When we hover over the icons it displays the plain text or stock status and stock quantity in units.
  In stock Pre order Unknown


2405
Note : Hovering on Stock is available only in Recommendation deal, In Selected deal the hover is available only when select another device
from Device tab other than the one in the Selected deal.
Handset detail:

An ‘Embedded Section’ is added to display the handset detail depending on the handset deal or SIMO deal.Displayed when .StockStatus is “In stock” Displayed when .StockStatus is “Pre order” /
“Back order“Displayed when .StockStatus is “Unknown”

On hover of this image a InStockToolTip
tooltip is displayed to display the stock status
in units
 On hover of this image a PreOrderToolTip
tooltip is displayed to display the stock
status in units
 On hover of this image a plain text is
displayed


2406
VFUK-VADR-UI-Deal.DeviceSpecs


2407
Section contain DeviceLineItem. properties.


2408

HandSet deal section allows users to edit Device upfront cost and Device tenure. On edit any property.
1. It recalculates totals
2. Refresh current  section with newly calculated values
3. Refresh footer section with newly calculated values


2409
Calculated totals are:
Device Fixed Icon :


2410
Fixed icon will be displayed in both recommended deal and selected deal sections when .DeviceLineItem.FixedPrice is true. Layout
1.3.1.6 will be always visible and 1.3.1.7 will be visible when stock status is empty to align the icon.
On hover of this image a plain text ‘Fixed Product’ is displayed.


2411
Tariff Detail:
This section displays details about the tariff of a deal using TariffLineItem


2412
Dynamic Layout 1.6 is displayed Dynamic Layout 1.7 is displayed and more ever we could see this
only in Selected Deal than in the Recommendation screen

 When the Tariff is incompatible with the selected deal, the text is
greyed out to have a disabled look and an warning icon appears Tariff Status is Not INCOMPATIBLE Tariff Status is INCOMPATIBLE


2413
Add Ons, Insurance, Extra:
This section displays details about the AddOn of a deal using AddOnLineItem. There will be multiple AddOns, Insurance records.

 besides the the name of Tariff. When we click on the warning icon,
the message is displayed as follows
Fixed icon will be displayed in both recommended deal and selected
deal sections when .TariffLineItem.FixedPrice is true.Fixed icon will be displayed in both recommended deal and selected
deal sections when .TariffLineItem.FixedPrice is true.


2414
As there are multiple records to display these repeating dynamic layout (1.8.2, 1.8.3).
1.8.2 - displays on recommendation screen
1.8.3 - displays on a selected recommendation screen


2415
With the above page list following screen has been called as many times as the page list count.
Note: “DisplayProductCost” is used multiple times with AddOn, Discount, and Accessories page
list.
Discounts:
This section displays details about the Discount of a deal using DiscountLineItem. There will be single Discount record.

1.9.2 - displays on recommendation screen
1.9.3 - displays on a selected recommendation screen


2416

With the above page list following screen has been called as many times as the page list count.


2417
Note: “DisplayProductCost” is used multiple times with AddOn, Discount, and Accessories page
list.
VFUK-VADR-UI-Product.DisplayProductCost
This section repeatedly used with different pages.
1.1 Dynamic layout has been used to display non-promotional product.
1.2 Dynamic layout has been used to display promotional products. Different colour.


2418
1.3 Dynamic layout has been used to display when there are no product,i.e. name of product is null.
Summary Section
This section displays summary totals.


2419

Select Section


2420
This section displays ‘Select’ button. Once user selects the reccomendation it changes in ‘Selected’ button.

It calles RecoomendFooter screen
Normal display till any reccomentdation not selected  Displayed once the  reccomentdation is selected


2421

It opens selected the recommendation in the basket screen.


2422
1. Calls ‘CopyDealIntoBasket’ data tarform. This data tasforms copies data in BasketDealForUI data page. also make .IsInBasket property
true.
2.  Refesh recommedation section. This will  display ‘Selected’ botton.
3. It opens Model window for basket. This is explained in basket section of confluence.

Displaying Empty Deal:
We can get up to 3 recommendations from logic. If we get less, then the following section will be displayed, + the sign will allow the user to
customise the deal.
In case zero deals have been provided, all deals can be build from the start.


2426
Edit Deal
Sections of Notes:
VFUK-VADR-UI-Deal.DisplaySubscriptionBundles
Contains the 3 recommendations returned after the refine by.
On click of the pencil icon, a data transform runs to copy selected deal and a flow in the modal dialogue is started (the Edit Deal screen):
EditDeal flow has one assignment, which displays the EditDealContainer section.
EditDealContainer
This is a design template split into 2 distinct areas each implemented by sections:
1. EditDealSelectedDeal
2. EditDeal


2427
EditDealSelectedDeal
This section shows detail similar detail as the recommendation screen but only with the selected deal’s data. On this screen, the user is
given the option for deleting or changing the device, deleting any non-promotional AddOns, Discounts, Insurance, Accessories or adding
new AddOns, Discounts, Insurance, Accessories.

 Selected Device detail After Deleting Device


2428
  User can select New device.
EditDeal
This section is of Layout Group which includes the following individual sections each has a specific purpose.
1.EditDealDevice
2.EditDealAirtime
3.EditDealAddons
4.EditDealDiscounts
5.EditDealInsurance
6.EditDealAccessories
7.EditDealBars
EditDealDevice
Section of Notes:
VFUK-VADR-UI-Deal.EditDealDevice


2429
On Click on EditDealDevice Section, the following action runs:
Refresh-Other section: It refreshes the RefineDeviceResults section, after running the DataTransform called SortDevices which sorts the
devices in Device Tab, based on device selected and then the position returned in HandsetProductsList and places those records at the top
and so on.
EditDealDevice Section consists of 2 sections:
1. DisplayProdListErrorMessage
  2. RefineDeviceResults
1. DisplayProdListErrorMessage Section is displayed if GetProductList activty in (GetHandsetsProductList) fails i.e
pyWorkPage.DisplayMessage is not null, when we click on pencil icon as follows.


2430

DisplayProdListErrorMessage has a visibility condition on it for when it need to be displayed, It is displayed only when
pyWorkPage.DisplayMessage is not null i.e, when it has Service errors from GetProductList.
2. RefineDeviceResults Section consists of 2 areas each displayed when visibility conditions set on it is true
1. Device Results
2. Information Message
RefineDeviceResults section has a visibility condition on it for when it need to be displayed, It is displayed only when
pyWorkPage.DisplayMessage is null i.e, when it has no Service errors from GetProductList.


2431

RefineDeviceResults Uses the UI Class:
VFUK-VADR-UI-Device
(Selected) .Selected This is set to true when we select a row i.e
Device in Device Tab. We can select only
one row (device) at a time.
Model .Model
(BigDataRecommended) .BigDataRecommended This is set to true when Device in Device Tab
is recommended by Big Data to display a
logo.
Code .Code Displays the Product ID of the device
Manufacturer .Manufacturer
Speed .Speed
Storage .Storage
Colour .Colour
DeviceCost .Cost
Fixed .IsFixed
StockLevel .StockStatus For all devices displayed after the top 5
(rows/ devices), then a 'Check' box is
presented by setting Stock Status=”Check”,
when clicked on it Stock Status changes to
either of the possible values such as In
stock or Pre order or Back order  or Out of
stock which will be displayed either in green Column Name Property Name Notes


2432
On Click of Device Tab, from Edit Deal Section,
 Device Results are displayed when customer is eligible for any loan due to loan eligibility  i.e EligibleForLoan== true
The  Device Results are displayed as below :

else if the customer is not eligible for any more loan due to the loan ineligibility i.e EligibleForLoan== false the following information
message is shown when Device Tab is selected.
The tab that is selected i.e Device Tab will be highlighted in blue colour underlined.
The first row will be highlighted by default if the Product ID of device in the selected deal is equal to the Product ID of device in first row.
The row i.e the device gets highlighted wherever we click on the row.
If the device is recommended by Big data i.e. if BigDataRecommended==true then a logo displayed beside the model.
On selecting any device, a radio button highlighted in blue is appeared to indicate  the selection. The selected device will be copied to
Selected deal section on the left hand side pyWorkPage.SelectedDealForUI.DeviceLineItem property.
Only one device can be selected at a time.
The Selected device from Device Tab will be copied into Selected deal section as shown below
 or red or black colour  based on Stock
Status.


2433

Stock Status will be displayed in different colours based on stock availability like green(if In stock), red(if out of stock / Back order / Pre
order).
If Stock Status is “Out of stock“ then the record is not selectable by agent and the previous selection remains as is either in Selected Deal
or Edit Deal.

If the device Stock Status is “Out of Stock“, when we hover above the text, a smart tip is displayed showing the Stock Status as “0 units“
If the device Stock Status is other than “Out of Stock“, when we hover above the text, a smart tip is displayed showing the Stock Status as
present:


2434
For the top 5 devices i.e rows the stock status is displayed as In stock / Pre order/Out of stock, for the next records, a ‘Check’ box will be
displayed
On click of the “Check“ button the Stock Status is changed to either “In stock“ or “Pre order“ or “Out of stock“ or “Back order“based on stock
availability as displayed below
Note: If we select a record without clicking on “Check“ box then a stock check validation is performed on selection of the continue button on
the Basket summary screen.
Sections of Notes:
VFUK-VADR-UI-Deal.DisplayProdListErrorMessage
In Dynamic Layout 1, we are using VF Red Background container format to display the background colour as red.
VFUK-VADR-UI-Deal.RefineDeviceResults


2435
In Dynamic Layout 1, we are using VF Purple Background container format to display the background colour as purple.
For highlighting the selected record in peach colour we are using a RefineDeviceResultsCustom HTML section in the header as follows:


2436

To populate the Device Tab we use a pagelist property called .DevicesForUI which is of VFUK-VADR-UI-Device Class as source which
is populated from VFUK-VADR-Work-Upgrade.SetDevices Datatransform which inturn gets called from VFUK-VADR-UI-
Deal.GetProductData activity.
For Refreshing the rows, a condition is added which refreshes the row when .Selected Property Changes.
On selecting a device, i.e. on click of a row (On grid click) the following actions runs:


2437

1. RunDataTransform: It runs ClearDeviceCurrentSelection DataTransform which posts the ID and Position of device that is being selected
2. SetFocus: Sets Focus on CurrentItem
3. RunDataTransform: It runs SetSelectedDevice DataTransform which forcefully clears all the rows that are being selected.
4. Refresh-Other section: It refreshes the EditDealSelectedDeal section which needs to  be refreshed when device is
swapped/added/selected.
Here we run a DataTransform called SetEditDealRefreshFlags which sets the required flags of sections to refresh to true, based on
which refreshing the respective sections in Edit deal happens, when we click on respective Tabs like Insurance.
Also we run a activity called EditDealDeviceSelected which copies the device that is being selected in Device Tab into Selected deal
section (DeviceLineItem page of SelectedDealForUI)
5. Run Script: It runs a script to stop the user from writing any text in “Check“ box when user clicks on it .
For the Stock  Status Column an inline style is applied to display the StockStatus in different colours based on the availability.
For Stock Status column, we are using some conditions like making it read-only in case if StockStatus!=”Check ”and control formats
Editable Gray Background to make the the text input look like a button.


2438
On click of the text “Check“ some two sets of events are applied :
On Click Events:
These events runs only when the Stock Status control is editable i.e when StockStatus is “Check”.
Set Focus : maintains focus on pyWorkPage.DevicesForUI
Run Activity : It runs the CallStockCheck activity which inturn calls the API activity to display the Stock Status availability when user
clicks on “Check“ button.
Set Value :  Is used to set the Stock Status to either “In stock“or “Pre order“ or “Back order“ based on stock availability returned from
CallStockCheck activity.
After posting the value to the clipboard it refreshes the current row.
Run Script: It runs the “callAfterStockCheck” script.
On Hover Events:
These events runs when the Stock Status control is either Read-only / Editable:
Show smart tip: It is used to display the stock level in units when agent hovers over it and when Stock Status is not equal to neither
Check nor Out of stock.
Show smart tip: It is used to display the stock level in units as “0 units” when agent hovers over it and when Stock Status is equal to Out
of stock.


2439
EditDealAirtime
On Click on EditDealAirtime Section, the following actions runs:
1. RunActivity: It runs RefreshTariffs activity which is used to populate the .TariffsForUI property to populate Tariff Tab based on latest
selections like Addons / Discounts.
2. Refresh-Other section: It refreshes the EditDealAirtime section, after running the DataTransform called SortTariff which sorts the Tariffs in
Tariff Tab, based on Tariff selected and then based on position retrieved in TariffProductList and places those rows at the top.
3. Run data transform: It runs the ResetEditDealRefreshFlags datatransform which is used to reset the respective flag values passed as
parameters as false to control refreshing of sections.
EditDealAirtime section consists of another 3 sections as follows:
1. DisplayProdListErrorMessage
2. RefineTariffResults
3. RefineTariffResultsForWatch
1. DisplayProdListErrorMessage Section is displayed if GetProductList activty in (GetTariffProductList  activty) fails i.e
pyWorkPage.DisplayMessage is not null, when we click on Tariff Tab as follows.


2440
DisplayProdListErrorMessage has a visibility condition on it for when it need to be displayed, It is displayed only when
pyWorkPage.DisplayMessage is not null i.e, when it has Service errors from GetProductList.
2. RefineTariffResults Section consists of 2 areas each displayed when visibility conditions set on it is true
1. Information Message
2. Information Message
3. Tariff Results
RefineTariffResults section has a visibility condition on it for when it need to be displayed, It is displayed only when
pyWorkPage.DisplayMessage is null i.e, when it has no Service errors from GetProductList and the customer is not a watch customer.


2441
RefineTariffResults Uses the UI Class:
VFUK-VADR-UI-Tariff
(Selected) .Selected This is set to true when we select a row i.e
Tariff in Tariff Tab. We can select only one
row (Tariff) at a time.
Tariff .Name
(BigDataRecommended) .BigDataRecommended This is set to true when Tariff in Tariff Tab is
recommended by Big Data to display a logo.
Code .Code Displays the ProductID of Tariff
Data .Data
Tenure .Tenure
Entertainment .Entertainment This is set to true when Tariff selected has
Entertainment available to display a tick
circle icon and a dash if not available
VT .VFTogether This is set to true when Tariff selected has
Discount available to display a VFTogether
Discount icon and a dash if not available
TariffType .TariffType
MaxDiscount .MaxDiscount If the Tariff has a discount provided /
promotional discount then MaxDiscount is
set otherwise a dash is displayedColumn Name Property Name Notes


2442
On Click of Tariff Tab, from Edit Deal Section,
The  RefineTariffResults section is displayed as below:

The tab that is selected i.e Tariff Tab will be highlighted in blue colour underlined.
The first row will be highlighted by default, when it is the Tariff in the selected deal.
The row i.e the tariff gets highlighted wherever we click on the row.
If the Tariff is recommended by Big data i.e. if BigDataRecommended==true then a logo displayed beside the Tariff.
On selecting any Tariff, a radiobutton highlighted in blue colour is appeared to indicate  the selection. The selected tariff will be copied to
Selected deal section on the left hand side to pyWorkPage.SelectedDealForUI.TariffLineItem property.
Only one Tariff can be selected at a time.
The Selected Tariff from Tariff Tab will be copied into Selected deal section as shown below:TariffCost .Cost This is the cost Inc. VAT from product
catalogue
Fixed .IsFixed


2443

The entire row in Tariff Tab will be displayed in purple colour if Tariff is a promotional Tariff.
If we select the promotional Tariff from Tariff Tab,then  in the Selected Deal section a Purple colour banner appears on the top right
corner as shown below.
When the Tariff is swapped the Addons and Discounts associated with the Tariff are removed if not relevant with the currently selected
Tariff as shown below.
Before Swapping Tariff After Swapping Tariff


2444
Sections of Notes:
VFUK-VADR-UI-Deal.RefineTariffResults
RefineTariffResults section consists of a information message in purple colour which is displayed when addon that is being deleted in
selected deal has some deviations to customers post S15 value as follows.
Delete icon appears near Addon in Selected Deal and no information
message appears in Tariff TabWarning icon appears near Addon(instead of delete icon)in Selected
Deal , the addon doesn’t get deleted and information message
appears in Tariff Tab

 Before Deleting Addon After Deleting Addon


2445
RefineTariffResults section consists of another information message in purple colour which is displayed the Tariff that is selected is
incompatible with the selected deal /  selected device as follows:

For highlighting the selected record in peach colour we are using a RefineTariffResultsCustom HTML section in the header as follows:
To populate the Tariff Tab we use a pagelist property called .TariffsForUI which is of VFUK-VADR-UI-Tariff Class as source which is
populated from VFUK-VADR-Work-Upgrade.SetTariffs Datatransform which inturn gets called from VFUK-VADR-UI-Deal.RefreshTariffs
activity.
For Refreshing the rows, a condition is added which refreshes the row when .Selected Property Changes.


2446
On selecting a Tariff, i.e. on click of a row (On grid click) the following actions runs:
1. RunDataTransform: It runs ClearTariffCurrentSelection DataTransform which posts the ID and position of the Tariff that is selected.
2. SetFocus: Sets Focus on CurrentItem
3. RunDataTransform: It runs SetTariffSelected DataTransform which clears the selection of Tariff that is previously selected
4. Refresh-Other section: It refreshes the EditDealSelectedDeal section which needs to  be refreshed when Tariff is
swapped/added/selected.
Here we run a DataTransform called SetEditDealRefreshFlags which sets the required flags of sections to refresh to true, based on
which refreshing the respective sections in Edit deal happens when we click on respective Tab like Addons / Discounts.
Also we run a activity called EditDealTariffSelected which copies the tariff that is being selected in Tariff Tab into Selected deal section
(TariffLineItem page of SelectedDealForUI)
An Inline style is added at row level to change the text color of row to purple when the Tariff is a promotional Tariff.


2447
EditDealAddons
On Click on EditDealAddons Section, the following actions runs:

1. RunActivity: It runs RefreshAddOns activity which is used to populate the .AddonsForUI property to populate Addons Tab based on latest
selections like Tariff / Discounts.
2. Refresh-Other section: It refreshes the EditDealAddons section, after running the DataTransform called SortAddons datatransform
which sorts the Add ons and keeps the Add ons results in such a way that the Add on that is selected at last is placed at the top i.e. the
first position and so on.
3. Run data transform: It runs the ResetEditDealRefreshFlags datatransform which is used to reset the respective flag values passed as
parameters as false to control refreshing of sections
EditDealAddons section consists of another 3 sections as follows:
1. DisplayProdListErrorMessage
2. RefineAddonResults
3.  RefineAddonsResultsForWatch


2448

1. DisplayProdListErrorMessage Section is displayed if GetProductList activty in (GetAddonsProductList  activty) fails i.e
pyWorkPage.DisplayMessage is not null, when we click on Addons Tab as follows.
DisplayProdListErrorMessage has a visibility condition on it for when it need to be displayed, It is displayed only when
pyWorkPage.DisplayMessage is not null i.e, when it has Service errors from GetProductList.


2449
EditDealAddons section consists of another section called RefineAddonsResults.
2. RefineAddonsResults section has a visibility condition on it for when it need to be displayed, It is displayed only when
pyWorkPage.DisplayMessage is null i.e, when it has no Service errors from GetProductList and the customer is not a watch customer.
RefineAddonsResults Uses the UI Class:
VFUK-VADR-UI-Product
(Selected) .Selected This is set to true when we select a row i.e
Add on in Add ons Tab. We can select Column Name Property Name Notes


2450
On Click of Add ons Tab, from Edit Deal Section,
The  RefineAddonsResults section is displayed as below :
The tab that is selected i.e Add ons Tab will be highlighted in blue colour underlined.
The selected rows will be highlighted by default, if those are the Add ons in the selected deal.
The row i.e the Add on gets highlighted wherever we click on the row.
On selecting any Add on, a checkbox with a blue tick is appeared to indicate  the selection. The selected Add on will be copied to
Selected deal section on the left hand side to pyWorkPage.SelectedDealForUI.AddOns property.
Multiple Add ons  can be selected in Addons Tab.
The Selected Add on from Add on Tab will be copied into Selected deal section as shown below:
The entire row in Add ons Tab  will be displayed in purple colour if Add on is a part of promotion.
If we select the promotional Add on from Add ons Tab, then in the Selected Deal section the Add on text is also in Purple colour as
shown below.multiple rows (Add ons) .
Add on name .Name
Code .Code It displays the Product ID of Addon
Category .Category
Add on cost .MonthlyCost


2451
Sections of Notes:
VFUK-VADR-UI-Deal.RefineAddonsResults
For highlighting the selected record in peach colour we are using a RefineAddonResultsCustom HTML section in the header as follows:


2452

To populate the Add ons Tab we use a pagelist property called .AddonsForUI which is of VFUK-VADR-UI-Product Class as source which
is populated from VFUK-VADR-Work-Upgrade.SetAddons Datatransform which inturn gets called from VFUK-VADR-UI-
Deal.RefreshAddons activity.
For Refreshing the rows, a condition is added which refreshes the row when .Selected Property Changes.
On selecting a Add on, i.e. on click of a row (On grid click) the following actions runs:


2453
1. SetFocus: Sets Focus on CurrentItem
2. RunDataTransform: It runs SetLastSelectedID DataTransform which sets the ID of Add on that is last selected to
pyWorkPage.SelectedAddonID
3. Refresh-Other section: It refreshes the EditDealSelectedDeal section which needs to  be refreshed when Add on is added/selected.
Here we run a DataTransform called SetEditDealRefreshFlags which sets the required flags of sections to refresh to true, based on
which refreshing the respective sections in Edit deal happens when we click on respective Tab like Tariff / Discounts.
Also we run a activity called EditDealAddOnSelected which copies the addons that are being selected in Addons Tab into Selected deal
section (AddOns pagelist property of SelectedDealForUI)
An Inline style is added at row level to change the text color of row to purple when the Add on is a promotional Add on.
EditDealDiscounts
On Click on EditDealDiscounts Section, the following actions runs:


2454
1. RunActivity: It runs RefreshDiscounts activity which is used to populate the .DiscountsForUI property to populate Discounts Tab based
on latest selections like Addons / Tariff.
2. Refresh-Other section: It refreshes the EditDealDiscounts section, after running the DataTransform called SortDiscounts which sorts the
Discounts and keeps the Discounts results in such a way that the Discount that is selected at last is placed at the top i.e. the first position
and so on
3. Run data transform: It runs the ResetEditDealRefreshFlags datatransform which is used to reset the respective flag values passed as
parameters as false to control refreshing of sections.
EditDealDiscounts section consists of another 3 sections as follows:
1. DisplayProdListErrorMessage
2. RefineDiscountsResults
3.  RefineDiscountsResultsForWatch
1. DisplayProdListErrorMessage Section is displayed if GetProductList activty in (GetDiscountsProductList  activty) fails i.e
pyWorkPage.DisplayMessage is not null, when we click on Discounts Tab as follows.


2455
DisplayProdListErrorMessage has a visibility condition on it for when it need to be displayed, It is displayed only when
pyWorkPage.DisplayMessage is not null i.e, when it has Service errors from GetProductList.
EditDealDiscounts section consists of another section called RefineDiscountsResults.
2. RefineDiscountsResults section has a visibility condition on it for when it need to be displayed, It is displayed only when
pyWorkPage.DisplayMessage is null i.e, when it has no Service errors from GetProductList and the customer is not a watch customer.


2456
RefineDiscountsResults Uses the UI Class:
VFUK-VADR-UI-Product
On Click of Discounts Tab, from Edit Deal Section,
The  RefineDiscountsResults  section is displayed as below when the Customer has eligible discounts :

The tab that is selected i.e Discounts Tab will be highlighted in blue colour underlined.
The first row will be highlighted by default, if it is Discount in the selected deal.
The row i.e the Discount gets highlighted wherever we click on the row.
On selecting any Discount, a radio button highlighted in blue colour is appeared to indicate  the selection. The selected Discount will be
copied to Selected deal section on the left hand side to pyWorkPage.SelectedDealForUI.Discounts property.
We can add only one Discount at a time.
The Selected Discount from Discounts Tab will be copied into Selected deal section as shown below:(Selected) .Selected This is set to true when we select a row i.e
Discount  in Discounts Tab. We can select
only one Discount at a time.
Discount name .Name
Code .Code Displays the Product ID of discount
Amount .MonthlyCost  Column Name Property Name Notes


2457
The entire row in Discounts Tab  will be displayed in purple colour if Discount  is a part of promotion.
If we select the promotional Discount from Discounts Tab, then in the Selected Deal section the Discount text is also in Purple colour as
shown below.

If the Customer has no eligible discounts the following information message is displayed:


2458
Sections of Notes:
VFUK-VADR-UI-Deal.RefineDiscountsResults
For highlighting the selected record in peach colour we are using a RefineDiscountResultsCustom HTML section in the header as follows:


2459
To populate the Discounts Tab we use a pagelist property called .DiscountsForUI which is of VFUK-VADR-UI-Product Class as source
which is populated from VFUK-VADR-Work-Upgrade.SetDiscounts Datatransform which inturn gets called from VFUK-VADR-UI-
Deal.RefreshDiscounts activity.
For Refreshing the rows, a condition is added which refreshes the row when .Selected Property Changes.
On selecting a Discount, i.e. on click of a row (On grid click) the following actions runs:

1. RunDataTransform: It runs ClearDiscountCurrentSelection DataTransform which posts the ID of the Discount that is selected to
clipboard
2. SetFocus: Sets Focus on CurrentItem


2460
3. RunDataTransform: It runs SetSelected DataTransform which clears the discounts that are previously selected/
4. Refresh-Other section: It refreshes the EditDealSelectedDeal section which needs to  be refreshed when Discount is added/selected.
Here we run a DataTransform called SetEditDealRefreshFlags which sets the required flags of sections to refresh to true, based on
which refreshing the respective sections in Edit deal happens when we click on respective Tab like Tariff/Addons
Also we run a activity called EditDealDiscountSelected which copies the Discount that is being selected in Discounts Tab into Selected
deal section (Discounts pagelist property of SelectedDealForUI)
An Inline style is added at row level to change the text color of row to purple when the Discount is a promotional Discount.
EditDealInsurance
On Click on EditDealInsurance Section, the following actions runs:
1. RunActivity: It runs RefreshInsurances activity which is used to populate the .InsuranceForUI property to populate Insurance Tab based
on latest selections like Device.
2. Refresh-Other section: It refreshes the RefineInsuranceResults section, after running the DataTransform called SortInsurance
datatransform which sorts the Insurances and keeps the Insurance results in such a way that the Insurance that is selected at last is
placed at the top i.e. the first position and so on.
3. Run data transform: It runs the ResetEditDealRefreshFlags datatransform which is used to reset the respective flag values passed as
parameters as false to control refreshing of sections.
EditDealInsurance section consists of another 3 sections as follows:
1. DisplayProdListErrorMessage


2461
2. RefineInsuranceResults
3. RefineInsuranceResultsForWatch
1. DisplayProdListErrorMessage Section is displayed if GetProductList activty in (GetInsuranceProductList activty) fails i.e
pyWorkPage.DisplayMessage is not null, when we click on Insurance Tab as follows.
DisplayProdListErrorMessage has a visibility condition on it for when it need to be displayed, It is displayed only when
pyWorkPage.DisplayMessage is not null i.e, when it has Service errors from GetProductList.


2462
EditDealInsurance section consists of another section called RefineInsuranceResults .
1. RefineInsuranceResults section has a visibility condition on it for when it need to be displayed, It is displayed only when
pyWorkPage.DisplayMessage is null i.e, when it has no Service errors from GetProductList and the customer is not a watch customer.

RefineInsuranceResults Uses the UI Class:
VFUK-VADR-UI-Product
Coulmn Name Property Name Notes


2463
On Click of Insurance Tab, from Edit Deal Section,
 RefineInsuranceResults section is displayed when deal that is selected is a not a SIMO deal  i.e
pyWorkPage.SelectedDealForUI.IsSIMO == false
The  RefineInsuranceResults  section is displayed as below :

else if the deal that is selected is a SIMO deal  i.e pyWorkPage.SelectedDealForUI.IsSIMO == true the following information message is
shown when Insurance Tab is selected.
The tab that is selected i.e Insurance Tab will be highlighted in blue colour underlined.
The first row will be highlighted by default , if it is the Insurance in the selected deal.
The row i.e the Insurance gets highlighted wherever we click on the row.(Selected) .Selected This is set to true when we select a row i.e
Insurance in Insurance Tab. We can select
only one Insurance at a time.
Insurance Type .Type
Code .Code Displays the Product ID of Insurance
Cost .MonthlyCost


2464
On selecting any Insurance, a radio button highlighted in blue colour is appeared to indicate  the selection. The selected Insurance will
be copied to Selected deal section on the left hand side to pyWorkPage.SelectedDealForUI.AddOns property.
We can add only one Insurance at a time.
The Selected Insurance from Insurance Tab will be copied into Selected deal section as shown below:
Sections of Notes:
VFUK-VADR-UI-Deal.RefineInsuranceResults

For highlighting the selected record in peach colour we are using a RefineInsuranceResultsCustom HTML section in the header as follows:


2465
To populate the Insurance Tab we use a pagelist property called .InsuranceForUI which is of VFUK-VADR-UI-Product Class as source
which is populated from VFUK-VADR-Work-Upgrade.SetInsurance Datatransform which inturn gets called from VFUK-VADR-UI-
Deal.RefreshInsurances activity.
For Refreshing the rows, a condition is added which refreshes the row when .Selected Property Changes.
On selecting a Insurance, i.e. on click of a row (On grid click) the following actions runs:


2466
1. RunDataTransform: It runs ClearInsuranceCurrentSelection DataTransform which posts the ID of the Insurance that is being selected.
2. SetFocus: Sets Focus on CurrentItem
3. RunDataTransform: It runs SetInsuranceSelected DataTransform which clears the insurances that are previously selected
4. Refresh-Other section: It refreshes the EditDealSelectedDeal section which needs to  be refreshed when Insurance is added/selected.
Here we run a DataTransform called SetEditDealRefreshFlags which sets the required flags of sections to refresh to true, based on
which refreshing the respective sections in Edit deal happens when we click on respective Tab like Device
Also we run a activity called EditDealInsuranceSelected which copies the Insurance that is being selected in Insurances Tab into
Selected deal section (AddOns pagelist property of SelectedDealForUI)
EditDealAccessories
On Click on EditDealAccessories Section, the following actions runs:
1. RunActivity: It runs RefreshAccessories activity which is used to populate the .AccessoriesForUI property to populate Accessories Tab .
2. Refresh-Other section: It refreshes the EditDealAccessories section, after running the DataTransform called SortAccessories
datatransform which sorts the Accessories and keeps the accessory results in such a way that the accessory that is selected at last is
placed at the top i.e. the first position and so on.
EditDealAccessories section consists of another 2 sections as follows:


2467
1. DisplayProdListErrorMessage
2. RefineAccessoryResults
1. DisplayProdListErrorMessage Section is displayed if GetProductList activty in (GetInsuranceProductList activty) fails i.e
pyWorkPage.DisplayMessage is not null, when we click on Accessories Tab as follows.
DisplayProdListErrorMessage has a visibility condition on it for when it need to be displayed, It is displayed only when
pyWorkPage.DisplayMessage is not null i.e, when it has Service errors from GetProductList.


2468
EditDealAccessories section consists of another section called RefineAccessoryResults.
1. RefineAccessoryResults section has a visibility condition on it for when it need to be displayed, It is displayed only when
pyWorkPage.DisplayMessage is null i.e, when it has no Service errors from GetProductList and the customer is not a watch customer.
RefineAccessoryResults Uses the UI Class:
VFUK-VADR-UI-Product
(Selected) .Selected This is set to true when we select a row i.e
accessory in Accessories Tab. We can select
multiple accessories
Accessory .Name
Device Type .Type  Coulmn Name Property Name Notes


2469
On Click of Accessories Tab, from Edit Deal Section,
 RefineAccessoryResults section is displayed when RefreshAccessories activity returns results i.e products.
The  RefineAccessoryResults section is displayed as below :
The tab that is selected i.e Accessories Tab will be highlighted in blue colour underlined.
The row will be highlighted by default if the Product ID of Accessory in the selected deal is equal to the Product ID of Accesory in  row.
The row i.e the accessory gets highlighted wherever we click on the row.
On selecting any accessory, a radio button highlighted in blue is appeared to indicate  the selection. The selected accessory will be
copied to Selected deal section on the left hand side pyWorkPage.SelectedDealForUI.Accessories property.
Multiple accessories can be selected at a time.
The Selected accessory from Accessories Tab will be copied into Selected deal section as shown belowOffer .Offer
SKU .Code Displays the Product ID of Accessory
Cost .MonthlyCost
Stock Level .StockLevel For all accessories  'Check' box is presented
by setting Stock Status=”Check”, when
clicked on it Stock Status changes to either
of the possible values such as In stock or
Pre order or Back order  or Out of stock
which will be displayed either in green or red
or black colour  based on Stock Availability.


2470

Stock Level will be displayed in different colours based on stock availability like green(if In stock), red(if Pre order) otherwise it will be
displayed as black(for Out of stock/Back order).
If Stock Level is “Out of stock“ then the record is not selectable by agent and the previous selection remains as is either in Selected Deal or
Edit Deal.
If the accessory Stock Level is “Out of Stock“, when we hover above the text, a smart tip is displayed showing the Stock Status as “0 units“
If the accessory Stock Level is other than “Out of Stock“, when we hover above the text, a smart tip is displayed showing the Stock quantity
as  present:
For all the accessories i.e rows the stock level is displayed as a ‘Check’ box initially.


2471
On click of the “Check“ button the Stock Status is changed to either “In stock“ or “Pre order“ or “Out of stock“ or “Back order“ based on stock
availability as displayed below
Note: If we select a record without clicking on “Check“ box then a stock check validation is performed on selection of the continue button on
the Basket summary screen.
Sections of Notes:
VFUK-VADR-UI-Deal.RefineAccessoryResults
For highlighting the selected record in peach colour we are using a RefineAccessoryResultsCustomHTML section in the header as follows:


2472
To populate the Accessories Tab we use a pagelist property called .AccessoriesForUI which is of VFUK-VADR-UI-Product Class as
source which is populated from VFUK-VADR-Work-Upgrade.SetAccessories Datatransform which inturn gets called from VFUK-VADR-
UI-Deal.RefreshAccessories activity.
For Refreshing the rows, a condition is added which refreshes the row when .Selected Property Changes.

On selecting a Accessory, i.e. on click of a row (On grid click) the following actions runs:


2473
1. SetFocus: Sets Focus on CurrentItem
2. RunDataTransform: It runs SetAccessorySelectedID DataTransform which posts the ID of Accessory that is currently selected.
3. Refresh-Other section: It refreshes the EditDealSelectedDeal section which needs to  be refreshed when Accessory is added/selected.
We run a activity called EditDealAccessorySelected which copies the Accessory that is being selected in Accessories Tab into Selected
deal section (Accessories pagelist property of SelectedDealForUI).

For Stock Level column, we are using some conditions like making it read-only in case if StockStatus!=”Check ”and control formats
Editable Gray Background to make the the text input look like a button.
On click of the text “Check“ two sets of events are applied :


2474
On Click Events:
These events runs only when the Stock Level control is editable i.e when StockLevel  is “Check”.
1. Set Focus : maintains focus on pyWorkPage.AccessoriesForUI.
  2. Run Activity : It runs the CallStockCheck activity which inturn calls the API activity to display the Stock         Status availability when user
clicks on “Check“ button.
  3. Set Value : Is used to set the Stock Status to either “In stock“or “Pre order“ or “Back order“ based on stock availability returned from
CallStockCheck activity.
 4.Refresh Current Row: After posting the value to the clipboard it refreshes the current row.
 5. Run Script: It runs the “callAfterStockCheck” script.
 6. Refresh-This section: It refreshes the current section
On Hover Events:
These events runs when the Stock Status control is either Read-only / Editable:
Show smart tip: It is used to display the stock status in units when agent hovers over it and when Stock Status is not equal to neither
Check nor Out of stock nor Unknown.
Show smart tip: It is used to display the stock status in units as “0 units” when agent hovers over it and when Stock Status is equal to
Out of stock.


2475
Basket

ProcessBasketDeal:
This activity looks for dada in Tariff BenfitProducts, Tariff BenfitAdvertisments, Device BenfitProducts, Device BenfitAdvertisments
Depending on data dynamically create a list of benefits.  This list of benefits is used to display icons in the basket.


2478
Basket Body:


2479
H e a d e r

Dynamic layout 1.1 displays column heading


2480
D e v i c e


2481
Dynamic layout 1.1 displays device-related data. In the case of SIMO, this Dynamic layout is not displayed.
A i r t i m e
Dynamic layout 1.3 displays tariff related data.
A d d O n s / D i s c o u n t s / I n s u r a n c e / A c c e s o r y
Dynamic layout 1.4, 1.5, 1.5 displays AddOns/Discounts/Insurance/Accessory related data. The same repetitive dynamic layout is called
with different data pages.


2482

Basket Footer:


2483

Above section get displayed when selected deal for basket is a handset deal and the bundle containt insurance as add on.


2484

Edit/Continue Button.
In case, User selects the Edit button ‘Edit Deal’ screen will be displayed & the user can edit the selected deal.


2485

Data transform SetBasketDirectionEdit sets .BasketDirection property to “Edit”
Edit Deal screen will be called


2486

In Case, the User selects the Continue button. It will proceed to the final checkout (not developed yet.).


2488
UI Classes
In order to make the UI development as smooth and simple as possible we have created our own simple class structures to hold the data to
be displayed.  Basically removing as much complexity (e.g. where exactly to find specific LineItems) of the data model as possible from the
UI artefacts themselves.
VFUK-VADR-UI-Customer
AddOnCount Integer
Building Text
City Text
ContractEndDate Text
CustomerLoanAcceptanceIndicator Text
DeviceType Text It will be populated as Watch in case of
Watch customer else it will be populated as
Handset
EligibleForDiscount TrueFalse This flag is set to true if the customer is has
any discounts provided
EligibleForLoan TrueFalse This flag is set to true if the customer is
eligible for loan.
ExistingDeal Single Page(VFUK-VADR-UI-Deal) This pageis used to hold the information of
customer existing deal which is retrieved
from GetCustomerAPI.
ExpiryHoverTextLine1 Text
ExpiryHoverTextLine2 Text
FlatNo Text
IsWatchCustomer True It will populated as true in case of a watch
customer else it will be populated as false
PhoneNo Text
PostCode Text
PrimaryEmail Text
PrimaryPhone Text
PrimarySubscriptionId Text
Street Text
UpgradeHoverTextLine1 Text
UpgradeHoverTextLine2 Text  Property Name Type Notes


2489
VFUK-VADR-UI-OpenLine
VFUK-VADR-UI-DealUpgradeTodayFree Text
ContractEndDate Date
ContractEndDateUpgradeText Text
Discount Decimal
EarlyUpgradeCost Decimal
IsVFTogether TrueFalse
Price Decimal
VFDescription Text  Property Name Type Notes
Accessories PageList (VFUK-VADR-UI-Product )
AccessoriesCount Integer Stores total count of Accessories
PageList
AddOnCount Integer Stores total count of AddOns
PageList
AddOns PageList (VFUK-VADR-UI-Product ) Used by UI to hold rows of Add-On
products and Insurance products
which are selected in Edit Add-On
tab and Insurance tab
AirtimeBenefitsMessage Text
DataStorage Integer
Device Single Page(VFUK-VADR-UI-Product )
DeviceBenefitsList Single Page(VFUK-VADR-UI-Product )
DeviceBenefitsMessage Text
DeviceLineItem Single Page(VFUK-VADR-Int-LineItem) The device being selected in
Device Tab is copied to this page
DeviceMonthlyCost Decimal
Discounts PageList (VFUK-VADR-UI-Product ) Used by UI to hold row of  Discount
which is selected in Edit Discounts
tab
DiscountsCount Integer
DisplayOutOfStockMessage TrueFalse It is set to true whenever we want
to display Out of Stock message Property Name Type Notes


2490
when the device is out of stock.
DisplayOutOfStockMessageForAccessory TrueFalse It is set to true whenever we want
to display Out of Stock message
when the Accessory is out of stock.
EnrichmentPositive TrueFalse Used to display green box or red
box on recommendation
Fees Page List(VFUK-VADR-UI-Product)
FeesCount Integer
HaveEligibleDiscounts TrueFalse This is set to True/False based on
eligibile discounts available for the
customer
ID Text
Is4G TrueFalse
Is5G TrueFalse
IsAllowAddonDelete TrueFalse This flag is set to true if Add on can
be deleted and delete icon appears
IsBatteryRefresh TrueFalse
IsCommercial TrueFalse
IsDeviceCare TrueFalse
IsEmpty TrueFalse
IsDeviceEligible TrueFalse This flag is set to true if we need to
display hover over StockStatus
either in Recommended deal or
Selected deal
IsHandSet TrueFalse
IsInBasket TrueFalse This is set to true when the deal is
added to basket
IsInsured TrueFalse This is set to true when the deal
that has been added to the basket
has an insurance available
IsPromo TrueFalse If the tariff in the selected deal is a
promotional tariff then this is set to
true to display the promotional
banner.
IsSelectedDeal TrueFalse This is set to true when this
recommended deal is being Edited.
IsSIMO TrueFalse
IsSmartWatchConnectivityPlan TrueFalse


2491
IsStockCheckBeenDone TrueFalse This is set to true when the stock
check is being done for Device
IsTariffCompatible TrueFalse
IsTotalCareWarranty TrueFalse
IsUnlimitedMMS TrueFalse
IsVFTogether TrueFalse When the Recommended deal has
VF Offers avaialble then this is set
to true
IsZeroAccessories TrueFalse
IsZeroAddOn TrueFalse
IsZeroBar TrueFalse
IsZeroDiscount TrueFalse
IsZeroFees TrueFalse
MoreInfoList Text
Position Integer The index of the selected
recommendation is being set with
prefix 'P'
Saved TrueFalse When a recommended deal is
being selected for editing this
property is being set to yes
SetAccessoryOOSMessage TrueFalse This is set to true whenever we
need to display Out of stock
message for accessories
StockQuantity Integer Used to display quantity of device
in deal in units
StockStatus Text Used to display status of device in
deal, The values could be Instock /
Preorder/ Backorder
Tariff Single Page(VFUK-VADR-UI-Product)
TariffBenefitsList Page List(VFUK-VADR-UI-ProductBenefit)
TariffComplimentaryBenefitsList Page List(VFUK-VADR-UI-ProductBenefit)
TariffLineItem Single Page (VFUK-VADR-Int-LineItem) The tariff being selected in Tariff
Tab is copied to this page
TempStock Text Temporary variable to hold device
stock status in basket
TotalAirtimeBenefit Decimal
TotalComplimentaryBenefit Decimal


2492
VFUK-VADR-UI-DeviceTotalDeviceBenefit Decimal
TotalDeviceCost Decimal
TotalDiscount Decimal
TotalMonthlyCost Decimal
TotalNetRevenue Decimal
TotalUpfrontCost Decimal
TotalVFTogetherBenefit Decimal
VFTogetherBenefitsList Page List(VFUK-VADR-UI-ProductBenefit)
BigDataRecommended TrueFalse This is set to true when Device in Device Tab
is recommended by Big Data to display a
logo.
Code Text Displays the ProductID of the device
Colour Text specifies colour of the device
Cost Decimal specifies the cost of the device
ID Text It is a unique value which can be used as a
primary key
IsFixed TrueFalse This property is set to true when FixedPrice
is true on LineItem to indicate that the device
is fixed
Manufacturer Text specifies the manufacturer of the device
Model Text specifies the model of the device
Position Integer This is used to sort the devices in Device Tab
based on the position retrieved in
GetProductList
Selected TrueFalse This is set to true whenever we select a
row/device from Device Tab, only one device
is set to true at a time.
Speed Text
StockLevel Integer returns the number of devices when
StockStatus != “Check“ which could be either
0 / greater than 0.
StockStatus Text StockStatus is being set to “Check“ for the
devices which are not recommended by Big
Data, on Click of “Check“ the Stock Level is
displayed.
Storage Text specifies the manufacturer of the device
TempStockStatus Text This is used to temporarily store the
StockStatus of device which restores Property Name Type Notes


2493
VFUK-VADR-UI-TariffStockStatus when user click on “Check“
button on StockStatus
Band Text
BigDataRecommended TrueFalse This is set to true when tariff in tariff Tab is
recommended by Big Data to display a logo.
Code Text Displays the ProductID of the Tariff
Cost Decimal This is the price Inc. VAT from product
catalogue
Data Text
Entertainment TrueFalse A tick circle icon is displayed  if
Entertainment is true and a dash if
Entertainment is false
ID Text It is a unique value which can be used as a
primary key
IsFixed TrueFalse This property is set to true when FixedPrice
is true on LineItem to indicate that the Tariff
is fixed
IsPromo TrueFalse This is being set to true when the Tariff is a
promotional tariff
IsRegulatoryTariff TrueFasle This is set to true when the Promotional
Detail from the LineItem is populated as
Regulatory
MaxDiscount Text If the Tariff has a discount provided /
promotional discount then MaxDiscount is
set
MaxDiscountHover Text This is being used to hold the display text
when hovered over MaxDiscount Value in
Tariff Tab.
Position Integer This is used to sort the Tariffs in Tariff Tab
based on the position retrieved in
GetProductList
Selected TrueFalse This is set to true whenever we select a
row/tariff from Tariff Tab, only one Tariff is set
to true at a time.
TariffType Text
Tenure Text
VFTogether TrueFalse VFTogether logo is displayed when
IncludesCombiBundleOffer is being true Property Name Type Notes


2494
VFUK-VADR-UI-Product
 otherwise a dash is being displayed.
Category Text
Code Text It is used to display the ProductID of Addon /
Discount / Insurance
ID Text
IsDelete TrueFalse This flag is set to true when Delete (Trash
icon) need to be shown in Selected deal.
IsPromo TrueFalse It is being set to true when the AddOn in
Addons Tab or Discount in Discounts Tab is a
promotional one.
MonthlyCost Decimal
Offer Text
ProductType Text
Selected TrueFalse This is set to true whenever we select a
addon / discount  / insurance from respective
tabs
Status Text Status is set to “INCOMPATIBLE“ when any
one of the Addon / Discount / Insurance
selected is not compatible with the device or
tariff in Selected Deal
StatusDetail Text Contains the error message when Status is
set to “INCOMPATIBLE“
StockLevel Text This value is set to Check when the stock
check has not been done in Accessories
otherwise it is being set to In stock / Out of
stock / Pre order / Back order based on the
stock availability
StockQuantity Integer returns the number of accessories available
when StockLevel != “Check“ which could be
either 0 / greater than 0.
TempStockLevel Text This is used to temporarily store the
StockLevel of accessory which restores
StockLevel when user click on “Check“
button on StockLevel column in Accessories
Tab
Type Text
UpfrontCost Decimal  Property Name Type Notes


2496
ReNegotiation
Class : VFUK-VADR-UI-Deal
Section : DisplaySubscriptionBundles

If a deal is still valid, a “Saved” banner will be shown upon the deal. (ADO# 750494)
Property ‘Saves’ if true, Display Saved banner Dynamic layout (1.1.1.1)
Look for ‘StatusDetail’ Property in lineitem  (ADO#780884)
  display in CL: VFUK-VADR-Work-Upgrade  Section:AccountHeader
create new dynamic section for display error ( ‘StatusDetail’ Property) in CL: VFUK-VADR-Work-Upgrade
Section:AccountHeader
If a deal is no longer valid (ADO#749710)
create a new property in deal class ‘IsValidDeal’ make it false
 When Status is  INCOMPATIBLE
And case sub- type is Renegotiation
Add a new icon next to the pencil icon with the display condition
 When ‘IsValidDeal’ is false
Change pencil icon display condition
on Click of new Icon
delete recommendation for that position
create a empty recommendation for the position
If the Customer is EVO customer, add disable condition in CL: VFUK-VADR-UI-Deal  Section: DeviceSpecs for Device Upfront & Device
Tenure (ADO#749710)
is IsEvoCustomer is true
and case sub type is Renegotiation
In action button of refresh button RecommendedSubscriptionBundles
Recreate WorkingRecommendation from recommendation DT  i.e. SetRecommendation.

DisplaySubscriptionBundles:
Added Following section with visiblility condition
.IsSelectedDeal != true && .IsCompatible = false


2497

RecommendFooter:
Added new grey button with visibility condition
DeviceSpecs:
Added disabled input box with grey colour for upfront cost & tenure.  Following is the visibility condition
DisableTenureUpfront: When rule


2498

DisplayProductCost:
Added warning icon with display condition.
InCompatibleProduct: when rule


2499
RefineRecommendation
Added new section for display message with visibility condition
HasInCompatibleDisplayErrors: when rule

Final Screens:


2502
MBB Recommendation Updates
ADO 899247 - Display MBB Recommendation on UI
If a product is MBB, then the property LineItems.DealProductType will be set to Bundled. (existing implementation for Mobile is EVO).
For MBB CTN, the following is required on the Recommendations UI (changes to screen in blue):
The Title Card is presented  with the full name of the product displayed with a pencil icon above.
The device type i.e. SIMO, Dongle, Giga cube, Mobile Wifi, Laptops and Tablets are displayed below the peach-coloured banner as a
purple banner on each selected product if applicable.
5G logo:  This is not relevant for MBB - do not display.
Enrichment Icon (as is)
VT logo - display where applicable (more info???)
More Info (as is)
Storage: (as is). If no data available then display as dash with exception of SIMO. For SIMO the entire section for storage, colour and
stock is removed.
Colour: (as is). If no data available then display as dash with exception of SIMO. For SIMO the entire section for storage, colour and
stock is removed.
Stock: (as is). If no data available then display as dash with exception of SIMO. For SIMO the entire section for storage, colour and
stock is removed.
Device benefits (as is)
Device upfront: Display as per artefact for MBB products except for SIMO. For SIMO, there are no upfront cost so display as dash. The
upfront cost is calculated as per (ADO-899481).
Tariffs- Display AS IS for Mobile.
Airtime benefits- Display as per AS IS for Mobile.
Add ons- Display as per AS IS for Mobile


Airtime benefits- Display as per AS IS for Mobile.
Add ons- Display as per AS IS for Mobile
Discounts- Display as per AS IS for Mobile
Accessories- Display as per AS IS for Mobile
Fees : As per ADO- 863509 - Display Early Upgrade Fee except for Gigacubes customer - do not display for Gigacubes customers.
Summary: Display as per AS IS for Mobile
Tiers: AS IS

Class: VFUK-VADR-UI-Deal
New property: isMBB - truefalse
Data Transform: PopulateDealFromServiceData
Check if LineItem.DealProductType = “Bundled“, then set isMBB property to true.

Class : VFUK-VADR-UI-Deal
Section : DisplaySubscriptionBundles
For MBB products, create new WHEN rule isMBB - this will return true if  LineItems.DealProductType = “Bundled”.
For MBB products:
Display purple banned below peach-coloured banned. Purple banner displays device type (LineItems.DeviceType)


2503
Hide 5G logo for MBB.
Display Device Upfront for MBB products expect SIMO. For SIMO, display as dashes.
900620 - Display Device Upfront Cost in the Device tab on the Edit screen for bundled Device and Tariff
For an MBB Proposition, add Upfront Cost column to Device tab on Recommendations Edit screen.
Class : VFUK-VADR-UI-Deal
New Section : RefineMBBResults
Table as below with new column for Upfront Cost. This column should be after Type in the table.
The Upfront Cost value is displayed as £xx.xx
Add new property to VFUK-VADR-UI-Device - UpfrontCost (Decimal). Display this property in new column.
New property UpfrontCost to be mapped from Recommendations.LineItems.UpfrontCost.


2504
MBB


2505
Display Tariff Tab
Description
If an Agent navigates to the Tariff tab in the edit deal for MBB CTN, then display the new section with new columns as per Implementation.
Implementation
If an Agent navigates to the Tariff tab in the edit deal for MBB CTN, then display the new section which is for MBB customers as below:
If the customer is MBB, display this section by checking ShowMBBDeal when rule.
Applies ToVFUK-VADR-UI-Deal
Ruleset VADR-UI
Table
Column
NamesTariff, Fixed, Code, Tenure, Data, Offer, Tariff type, Max Discount,Upfront Cost, Monthly Cost
Input
Parameter
sN/A
Output
Parameter
sN/ARefineTariffResultsForMBB


2506
Usage tab
Description
We would like to display MBB bundled Device and Tariff usage on Agent screen when AOM loads for upgrade
Implementation
If an Agent navigates to the Usage tab MBB CTN, then display the new section which is for MBB customers as below
On the right hand side, display the average usage over 3months as shown on the UI.

If the customer is MBB,  this section will be invoked by DisplayCustomerProfilePanel by checking IsMBBCustomer when rule.
Applies ToVFUK-VADR-Work-Upgrade
Ruleset VADR-UI
Table
Column
NamesFor the horizontal section of the screen, display below columns,
Month- This is the month abbreviated and year formatted as yyyy for the usage i.e. Jan 2021, Feb 2021.
UK Data - This is the total data GB usage
Roaming data- This is the total roaming data used in GB
For the vertical section of the screen, then display below rows,
Total monthly allowance-The total monthly allowance is highlighted on first launch of the usage tab, this is also displayed
below the Month column. For the Data usage, display the data in GB rounded up to the nearest 1 decimal place. The total
monthly allowance is made up of the plan monthly allowance and any extra addon(s) allowances available on the customer
product holding.
Input
Parameter
sN/A
Output
Parameter
sN/ADisplayCustomerUsagesForMBB


2507
Changes required on the Refine by
The 'Device Type' is displayed first followed by Manufacturer, Model, Storage and Device cost.
Remove “Entertainment” check flag for MBB customers. Keep the followings: SIMO, 5G Ready, Unlimited, Nearly new
Conditions:
If an Agent selects a Tablet from the 'Refine by', then the Manufacturer and Model drop down is enabled as per AS IS for Mobile. The Agent
must select a combination of manufacturer and model for the Refine button to be enabled
If an Agent selects a Laptop from the 'Refine by', then the Manufacturer and Model drop down is enabled as per AS IS for Mobile. The
Agent must select a combination of manufacturer and model for the Refine button to be enabled
If an Agent selects a Giga from the 'Refine by', then the Manufacturer and Model drop down is disabled and greyed out and the Refine
button is enabled
If an Agent selects a Dongle from the 'Refine by', then the Manufacturer and Model drop down is disabled and the Agent cannot select from
this field
If an Agent selects a Mobile Wi-Fi from the 'Refine by', then the Manufacturer and Model drop down is disabled (Disabled =greyed out and
not selectable), and the refine button is enabled
If an Agent selects the SIMO flags from the Refine by list, then grey out the Manufacturer, Model and Device costs and the Refine button is
enabled
If an Agent selects the Clear selection, this will reset the Refine by options and remove the SIMO flag initially selected, as well as re-
displaying the Manufacturer and Model field. The Agent is then able to proceed to selecting any combinations from the device type.
This data transform updates the related properties to apply the conditions stated above based on the DeviceType.
Applies To VFUK-VADR-Work-Upgrade


Applies To VFUK-VADR-Work-Upgrade
Ruleset VADR-UI
Parameters -
Details Updates DeviceManufacturersDisabled, DeviceModelDisabled based on the DeviceType and SIMOOption.
Resets DeviceManufacturers and DeviceModels.Data Transform - DeviceTypeSelected
This Section displays the refining conditions.
Applies To VFUK-VADR-Work-Upgrade
Ruleset VADR-UI
Sections included -
Updates Added DeviceType dropdownSection - RefineRecommendation


2508
Added greyed dropdowns for DeviceManufacturers and DeviceModels with visibility conditions
Entartainment checkboxes condition for visibility is updated to “!IsMBBCustomer”.
This data transform sets the related properties when “SIMO” checkbox is clicked.
Applies To VFUK-VADR-Work-Upgrade
Ruleset VADR-UI
Parameters -
Updates Added a when condition that blocks DeviceManufacturers and DeviceModel properties to be enabled when
SIMO checkbox is unclicked but the DeviceType is one of these: Giga Cube, Dongle, Mobile Wifi.Data Transform - SIMOSelected
This data transform resets the properties when “Clear selection” button clicked.
Applies To VFUK-VADR-Work-Upgrade
Ruleset VADR-UI
Parameters -
Updates Added DeviceType.Data Transform - ClearSectionSelected
This when rule check the states of the related properties and disables the Refine button accordingly.
Applies To VFUK-VADR-Work-Upgrade
Ruleset VADR-UI
Parameters -
Updates Added DeviceModelDisabled and DeviceManufacturersDisabled to enable the Refine button when these
properties are true (which occurs when the DeviceType is one of these: Giga Cube, Dongle, Mobile Wifi)When - DisableRefineBy
This data page returns the distinct DeviceTypes for in HandsetManufacturerModelMap.
Structure Page
Object Type VFUK-VADR-Data-HandsetManufacturerModelMap
Mode Read-Only
Ruleset VADR-Rules
Scope Node
Data Source GetUniqueHandsetDeviceTypeData Page - D_DeviceTypes


2509
Changes required on the Refine by page
Model and Manufacturer dropdowns need to be disabled(greyed out) if the SIMO is selected.
 Input Parameters -
Load Management - Reload
if older than8 hours
This Section displays the refining conditions.
Applies To VFUK-VADR-Work-Upgrade
Ruleset VADR-UI
Sections included -
Updates Added greyed dropdowns for DeviceManufacturers and DeviceModels dropdowns with visibility conditions that
check if the SIMO checkbox is selectedSection - RefineRecommendation


2510
944633 - Display Device tab
An Agent edits a deal by selecting the pencil icon on the Selected product card and lands on the Device Tab
A list of MBB products are presented in scrollable list as per AS IS for Mobile (ADO-359889).
We would like to add two new columns in the Device tab called:
Type- This is the device type i.e. laptop, tablet, Dongle, Giga cube or Mobile Wi-Fi. The Device type is displayed between colour and upfront
cost
Upfront cost -The Upfront cost is displayed between the device 'Type' and Device cost. The calculation of the upfront cost is documented in
(ADO-854004). Upfront cost is displayed only when a Bundled tariff is selected in the basket.
If its not a bundled device then display as dash
As per AS IS for mobile, the 1st device in the Device list, is the device in the Selected basket.
We would like to reuse the existing columns list as per AS IS for MBB products such as:
Model
Fixed
Manufacturer
Storage
Colour
Type - New
Upfront- New
Device cost
Stock
The Agent is able to filter as per AS IS for Mobile
An Agent launches VADR as per AS IS for Mobile
Acceptance Criteria from User story:
Selects the pencil icon to load the Edit screen
The Device tab is displayed on first launch of the Edit screen as per AS IS for Mobile
Scenario 1:
If the Selected basket contains a bundled device and Tariff, then below rules apply:
For Devices which are compatible with the Tariff in the basket, the upfront cost will be the Handset cost from the Handset-to-tariff
compatibility table for the respective combination. The cost is displayed in '£xx.xx'


compatibility table for the respective combination. The cost is displayed in '£xx.xx'
For incompatible devices, the upfront cost will contain the minimum Handset cost from the Handset-to-tariff compatibility table for the
respective device, in combination with all other compatible tariffs. The upfront value will be displayed as 'From £xx.xx' cost in the upfront
cost column.
Scenario 2:
If the Selected basket contains a SIMO Tariff, then below rule applies:
For all devices, the upfront cost will contain the minimum Handset cost from the Handset-to-tariff compatibility table for the respective
device, in combination with all other compatible tariffs. All upfront values will be displayed as 'From £xx.xx'  cost in the upfront cost
column.
Scenario 3:


2511
If the Selected basket doesn't contain a Tariff (i.e. add new products to compare using the '+'), then below rule applies:
For all devices, the upfront cost will contain the minimum Handset cost from the Handset-to-tariff compatibility table for the respective
device, in combination with all other compatible tariffs. All upfront values will be displayed as 'From £xx.xx' cost in the upfront cost
column.


2512
908854 - MBB-UI changes on the Edit screen to Add a Chevron tab button on
the Selected basket
 My initial idea for the design of this was to use a harness screen layout but there are 3 pretty large problems with this approach:
1. It doesn’t work.  I tried changing the modal window template to use a harness, this wasn’t possible and even in the modal flow, normally
you can update the assignment shape with a custom harness and that would be used, but whatever I did it would not recognise the
harness.  My conclusion on this is that modal windows cannot be configured with a harness, they can only display sections.
2. Of all the different combinations Pega has made available for screen layouts “Footer Left” (ie footer with left collapsible menu) is not one.
Although we could probably use “Header Footer Left” and somehow remove the header, it still is not ideal.
3. The look and feel of a Pega expand/collapse menu is very different to the requirements and I don’t know how easy it would be to
customise.
So, Plan B is the way to go:
Custom HTML/CSS/JS to create the expand/collapse functionality.  On the face of it this is some quite basic stuff to achieve the
requirement.  The basic expand/collapse function is working by changing the section EditDealContainer into custom HTML which splits the
screen up into 3 parts (left, main & footer) and re-uses all the existing edit deal sections to populate them.  Then adds the vertical sidebar
which expands/collapses as required:
Once finished I don’t expect this will need much on-going work, all the hard work is still done inside all the normal pega sections.  How it
currently looks:


2513
The TODO list (to get the screen above looking like the invision screen below) with estimates:
Test this hasn't broken anything major with the communication between tables and selected deal - 0.5 day.
There is 1 part that probably is broken: The updating of the summary section.  That might no longer happen since it has moved out of the
selected deal section.  A refresh of this section will need to be added to the action of the row selection for each table & when deleting items
from selected deal I guess - 1 day.
Responsiveness so it looks as good as possible on both resolutions, assuming its still 1024x768 (100%) & 1920x1080 (150%) that need to
be supported - 1 day.
Move scroll of selected deal from top level of selected deal to inside the selected deal after device type banner - this will be much more
painful than it sounds - 3 days.
Padding-left of selected deal a bit smaller - 0.5 day
Make row heights of tables smaller than 55px & look at the headers which are hard coded with ellipsis (e.g. “Spe…” for Speed column - can
they be dynamic with the ellipsis?) Again, this might be more painful than it sounds - 3 days. (a tip here - I have changed the row heights for
the device table, the only way I could do this was to 1) Copy & Paste the entire layout, 2) remove all property references from the Copy, 3)
Then Pega allowed me to change the row height from 55 to 36px (seemed to match invision but please confirm if you can inspect the
invision?), 4) Then copy the properties back into the columns from the original table! 5) Remove original


Sort out footer - I know this is technically a different story but I’ll put it here - 2 days.
Improve styling of vertical bar with border and radius and images for expand/collapse - 1 day.
Total = 12 days (for both stories)


2514
Selected Basket Edit Screen UI
These changes are related to the changes to the Edit Selected Basket screen which is accessed via the pencil icon on the
Recommendations screen.
On the Edit Selected Basket screen, a side bar divides the left panel and main panel. This side bar includes a chevron arrow button which
hides and shows the left panel, effectively a slider for panels.
On the first click of the chevron button, the left panel width reduces to 0% so that the panel is hidden. The right panel fills the space. When
the chevron button is clicked again, the left panel expands to its original size.
The Summary section at the bottom of the screen will display Total Upfront and Total Monthly fields as shown, with TNR below. The
Cancel and Save and Close buttons are right aligned.
The black panel with the Summary details is static. When the clicks the Chevron button (<<) to expand/reduce the table section, then the
Summary panel remains as it is.
This is applicable for all Upgrade AOM journeys i.e. deliver these for Watch, handset and MBB.

Left side expanded
Left side collapsed
This Section displays the panels on the Selected Basket Edit screen
Applies To VFUK-VADR-UI-Deal
Ruleset VADR-UISection - EditDealContainer


2515
  This Section is now custom HTML. which splits the screen up into 3 parts (left, main & footer) and re-uses
all the existing edit deal sections to populate them. Then adds the vertical sidebar which expands/collapses
as required.
Sections that make up the screen:
EditDealSelectedDeal (left panel)
EditDeal (main panel with tabs)
EditDealFooter (Summary and buttons)
The side bar includes the chevron button image.
The Chevron toggle button calls a js function toggleSidebar() which resizes the panels when clicked:
If EditDealSelectedDeal width is not 0%, then set EditDealSelectedDeal size to 0% and EditDeal to
98%. Set chevron image to webwb/chevron-right.png?99
Otherwise, set EditDealSelectedDeal size to 29% and EditDeal to 68%. Set chevron image to
webwb/chevron-left.png?99
This Section displays the left hand panel within the Selected basket border on the Edit screen .
Applies To VFUK-VADR-UI-Deal
Ruleset VADR-UI
Sections included DisplaySubscriptionBundles
Updates Remove section EditDealSelectedDealFooter - this displays the summary section and buttons. It should no
longer be part of the left panel.Section - EditDealSelectedDeal
New Section which contains the Summary panel and Cancel & Save and Close buttons
Applies To VFUK-VADR-UI-Deal
Ruleset VADR-UI
Sections included EditDealSelectedDealFooter
EditDealButtons
Details Template used - VF 2 Column 30 | 70
EditDealSelectedDealFooter on left hand side
EditDealButtons on right hand sideSection - EditDealFooter
This Section makes up the Selected Basket Edit screen left hand panel.
Applies To VFUK-VADR-UI-Deal


Applies To VFUK-VADR-UI-Deal
Ruleset VADR-UI
Sections included EditDealSelectedDeal
EditDealSection - EditDealContainer


2516
The summary panel and buttons need to refresh when selections are made on the Edit Summary screen tables. This was previously
achieved with the Refresh-Other section → EditDealSelectedDeal action on Click of each table in the following Sections:
RefineDeviceResults
RefineDeviceResultsForWatch
RefineDeviceResultsForMBB
RefineTariffResults
RefineTariffResultsForWatch
RefineTariffResultsForMBB
RefineAddonsResults
RefineDiscountsResults
RefineDiscountsResultsForWatch
RefineInsuranceResults
RefineInsuranceResultsForWatch
RefineAccessoryResults
RefineBarResults
Update these Sections to include the Refresh-Other section →  EditDealFooter action on Click of each table .
The summary panel and buttons also need to refresh when items are deleted from the Selected Basket screen. This should be done with
the Refresh-Other section →  EditDealFooter action on Click of the delete buttons in the following Sections:
DisplaySubscriptionBundles
DisplaySelectedProductCostEditDealFooter
Details This Section has been changed to custom HTML to include the Slider bar ( Add a Chevron tab button on the
Selected Basket Edit screen - Vodafone - Confluence (atlassian.net) ).


2517
Display Device Tab
Description
If an Agent navigates to the Device tab in the edit deal for MBB CTN, then display the new section with new columns as per
Implementation.
Implementation
If an Agent navigates to the Device tab in the edit deal for MBB CTN, then display the new section which is for MBB customers as below:
If the customer is MBB, display this section by checking ShowMBBDeal when rule.
Applies ToVFUK-VADR-UI-Deal
Ruleset VADR-UI
Table
Column
NamesModel, Fixed, Manufacturer, Speed, Storage, Colour, Type, Upfront Cost, Device Cost, Stock Level
Input
Parameter
sN/A
Output
Parameter
sN/ARefineDeviceResultsForMBB


2518
953555 - Display Data Roaming Usage
For all customers, regardless of usage, the Roaming data column displays after the UK data column and before the Mins column.

The information icon 'i' displays in the Roaming data title field. When the Agent hovers over the icon the following message is shown:
 'Please check the customer's tariff to find out what roaming zones are included in this plan'.

The Roaming data allowance is populated as follows:
If the customer has a Total UK data allowance more than 25GB (in the plan or with any extra UK data add on) then display a roaming
data allowance of 25GB
If the customer has a total UK data allowance less than 25GB (in the plan or with any extra UK data add on) then display the roaming
data allowance as the same value than the Total UK data allowance
The individual monthly Roaming data usage values are populated in the data table in xx.x GB for each month the customer used roaming
data (rounded up to the nearest 1 decimal as per 'As Is').
If the customer did not roam for the month, then display '-'

This Section displays the Usage panel and table at the top of the Recommendations screen.
Applies To VFUK-VADR-Work-Upgrade
Ruleset VADR-UI
 Add new column with header Roaming data to the right of UK data column.
Add information icon 'i' with hover text set to: Please check the customer's tariff to find out what
roaming zones are included in this planSection - DisplayCustomerUsages
This Section displays the Title and Information icon used in the Usage table (Section - DisplayCustomerUsages)
Applies To VFUK-VADR-Work-Upgrade
Ruleset VADR-UI
 Dynamic LayoutSection - RoamingDataHeader


2519
Label with text as Roaming data
Image with icon webwb/InfoCircle.png
Action on hover event - Show Smart Tip with text set as “Please check the customer's tariff to find
out what roaming zones are included in this plan.“
Property Name Type Notes
RoamingData Text
IsRoamingDataOverAllowance TrueFalse  Class Name VFUK-VADR-UI-MonthlyUsage
This activity gets the Customer Usage data and maps it for display in UI.
It first creates the first row for displaying Total monthly allowances. This is displayed highlighted in yellow on the UI.
Add new for Roaming data here. Set RoamingData property.
For each Usage record, set new property RoamingData.
Applies To VFUK-VADR-Work-Upgrade
Ruleset VADR-UI
Input
ParametersNA
Output
ParametersNA
Error
HandlingPrimary Catch-all Error Handler
Logs to Error LogActivity - MapUsageDataForUI
This Section displays the first row is the Usage table for Total monthly allowances.
The row is displayed in table highlighted in yellow.
This Section is custom HTML.
Applies To VFUK-VADR-Work-Upgrade
Ruleset VADR-UI
 Add new row here for Roaming data column / RoamingData property.Section - DisplayCustomerUsagesCustom
Returns true if .IsRoamingDataOverAllowance property is true
Applies To VFUK-VADR-UI-MonthlyUsage
Ruleset VADR-UIWHEN rule - IsRoamingDataOverAllowance


2520
 Used in Section - DisplayCustomerUsagesCustom to set Roaming Data field to bold red text if value is over
allowance.
Returns true if .IsRoamingDataOverAllowance property is false
Applies To VFUK-VADR-UI-MonthlyUsage
Ruleset VADR-UI
 Used in Section - DisplayCustomerUsagesCustom to set Roaming Data field to black text if value is within
allowance.WHEN rule - IsRoamingDataWithinAllowance


2521
4.3 ADO


2522
US - 1083266 - Billing - Display Spend Manager in the Billing Panel
1169277 - Display Spend Manager in the Billing Panel

Description:
New Billing section to be displayed with spend manager limit

Potential conflicting rules in Billing branch:
DisplayCustomerProfile section - in trunk version, it exists in 01-01-18 RS.
DisplayCustomerProfilePanel section - 2 versions, 01-01-17 and 01-06-01 but are empty layouts. Billing branch has a table which has
columns that can be reused
DisplayMenu section - 2 versions, 01-01-18 and 01-05-03. Need to add Billing section so that it can be clicked
Remaining rules in the billing branch can be merged
Class, properties and Connect-Rest are already existing


2523
1172861 - Being able to refine by Device color and storage for Mobile
Update refine by to add two new filters between Model and Airtime( Tenure)
Colour
Storage
Data for both filters is source from Model-Manufacture datatype
Add two new columns
Colour
Storage
Create two datapages
D_ColourByModelAnd Manufacturer
Input :Model and Manufacturer
Output :List of Colours available
D_StorageByModelManufacturerAndColour
Input :Model and Manufacturer, Colour
Output :List of Storages available
Need to add UI Validations for on when to Enable or disable Refine By ( details in user story)
Update GetRecommendations API activity to pass the new filter values
Create Colour and Storage properties on the Upgrade Class

1172884 - Being able to refine by Device colour and Size for Watch

Need to add UI Validations for when to Enable or disable Refine By ( details in user story)
Update GetRecommendations API activity to pass the new filter values conditionally
Create Size property on the Upgrade Class
Update refine by adding two new filters between Model and Airtime( Tenure)
Size ( displayed only for Watch)
Data for both filters is sourced from Model-Manufacture datatype
Add new columns
Size
Create new datapage
D_SizeByWatchModelManufacturer
Input : Model and Manufacturer ( DeviceType=Watch)
Output:  List of Watch Sizes available
Data Model
DeviceType Text (single line) N/AName Type Options


2524
Manufacturer Text (single line) Key, Read-only
Model Text (single line) Key, Read-only
Colour Text (single line) Key, Read-only
Storage Text (single line) Key, Read-only
Size Text (single line)
This data page returns the different Colours available that are part of the HandsetManufacturerModelMap data type for a particular device
model and it’s manufacturer.
Structure List
Object Type VFUK-VADR-Data-HandsetManufacturerModelMap
Mode Read-Only
Ruleset VADR-Rules
Scope Node
Data Source GetColourByModelAndManufacturer
Input Parameters Model and Manufacturer
Load Management - Reload
if older than8 Hours
 D_ColourByModelAndManufacturer
This report definition searches the HandsetManufacturerModelMap data type and returns each available colour from the data type filtered by
a specific device model and it’s manufacturer, not returning duplicate colours.
Object Type VFUK-VADR-Data-HandsetManufacturerModelMap
Ruleset VADR-Rules
Filterable by Model and Manufacturer
Filter options Use null if empty
Output Parameters ColourGetColourByModelAndManufacturer Report Definition
This data page returns the different storage available that are part of the HandsetManufacturerModelMap data type for a particular
manufacturer and colour.
Structure List
Object Type VFUK-VADR-Data-HandsetManufacturerModelMap
Mode Read-Only
Ruleset VADR-RulesD_StorageByModelManufacturerAndColour


2525
Scope Node
Data Source GetStorageByModelManufacturerAndColour
Input Parameters Model and Manufacturer, Colour
Load Management - Reload
if older than8 Hours
This report definition searches the HandsetManufacturerModelMap data type and returns each available colour from the data type filtered by
a specific device model and it’s manufacturer, not returning duplicate storage.
Object Type VFUK-VADR-Data-HandsetManufacturerModelMap
Ruleset VADR-Rules
Filterable by Model and Manufacturer, Colour
Filter options Use null if empty
Output Parameters StorageGetStorageByModelManufacturerAndColour Report Definition
This data page returns the different sizes available that are part of the HandsetManufacturerModelMap data type for a particular
manufacturer and model when devicetype is watch.
Structure List
Object Type VFUK-VADR-Data-HandsetManufacturerModelMap
Mode Read-Only
Ruleset VADR-Rules
Scope Node
Data Source GetSizeByWatchModelManufacturer
Input Parameters Model and Manufacturer ( DeviceType=Watch)
Load Management - Reload
if older than8 HoursD_SizeByWatchModelManufacturer
This report definition searches the HandsetManufacturerModelMap data type and returns each available size from the data type filtered by a
specific device model and it’s manufacturer when devicetype is watch, not returning duplicate sizes.
Object Type VFUK-VADR-Data-HandsetManufacturerModelMap
Ruleset VADR-Rules
Filterable by Model and Manufacturer ( DeviceType=Watch)
Filter options Use null if emptyGetSizeByWatchModelManufacturer Report Definition


2526

Mobile customers journey:
An Agent (TSAR or Retail) launches VADR with a mobile CTN
The Agent lands on the Recommendation screen as per 'As Is'
The Recommendations displayed uses the 'As Is' recommendation logic and if the customer's pathway is handset, the highest in stock
propensity device from big data is presented as per 'As Is'
In the 'Refine by' 2 new drop down fields are presented after the 'Model' drop down and before the 'Airtime tenure' drop down:
Colour
Storage
1. The Agent selects a 'Manufacturer' and then a 'Model' based in the selected manufacturer as per 'As Is' . The 'Refine' button is available.
If the Agent selects the 'Refine' button VADR runs the recommendations as per 'As Is'
The 'Colour' drop down is populated with the relevant colour variants based on the manufacturer and model selected.  If there is only one
Colour for the device, then only one colour variant is available in the drop down. When only a Colour has been selected, then the 'Storage'
drop down is populated with the Storage available with that colour
The 'Storage' drop down is populated with the relevant memory variants based on the manufacturer and model selected.  If there is only
one Storage variant for the device, then only one Storage variant is available in the drop down. When only a Storage variant has been
selected, then the 'Colour' drop down is populated with the colour available for the storage
2. The Agent selects a 'Colour' only, leaves the 'Storage' empty and selects 'Refine'
The Logic re-runs the recommendation using the selected manufacturer, model and colour.  The Logic selects the highest propensity, in


stock, pre order or back order, selected device from the big data model. If the manufacturer, model, colour is not in the big data
recommended devices, the logic uses the product catalogue and recommends the lowest memory variant of the in stock, back order or pre
order device (for example iPhone 14, purple, 128GB)
If the device is out of stock (using the Retail vs TSAR stock rules), no update to recommendations are presented, the 'As Is' error message
is presented and the previous recommendations are still displayed as per 'As Is'
3. The Agent selects 'Storage' only, leaves the 'Colour' empty and selects 'Refine'
The Logic re-runs the recommendation using the selected manufacturer, model and storage.  The Logic selects the highest propensity, in
stock, pre order or back order, selected device from the big data model. If the manufacturer, model, storage is not in the recommended
devices, the logic uses the product catalogue and recommends the device's 1st colour in alphabetical order (for example iPhone 14, Blue,
128GB) as long as the device is in stock, back order or pre order
If the device is out of stock (using the Retail vs TSAR stock rules), no update to recommendations are presented, the 'As Is' error message
is presented and the previous recommendations are still displayed as per 'As Is'
4. The Agent selects a 'Colour' and a  'Storage' and selects 'Refine'
The Logic re-runs the recommendation using the selected manufacturer, model, colour and storage.  if the device is in stock, pre order or
back order then the logic uses the device to re run the recommendation
If the device is out of stock, no update to recommendations are presented, the 'As Is' error message is presented and the previous


recommendations are still displayed as per 'As Is'
 Output Parameters Size


2527

Watch customer journey:
An Agent (TSAR or Retail) launches VADR with a watch CTN
The Agent lands on the Recommendations screen as per 'As Is'
The Recommendations displayed use the 'As Is' recommendations logic
In the 'Refine by' 2 new drop down fields are presented after the 'Model' drop down and before the 'Airtime tenure' drop down:
Colour
Size
When 1st loading the screen the drop downs are empty
1. The Agent selects a 'Manufacturer' and then a 'Model' as per 'As Is' . The 'Refine' button is available. If the Agent selects the 'Refine'
button VADR runs the recommendations as per 'As Is'
The 'Colour' drop down is populated with the relevant colour variants based on the manufacturer and model selected.  If there is only one
Colour for the device, then only one colour variant is available in the drop down. When only colour has been selected, then the device Size
drop down is populated with Size available for that colour only
The 'Size' drop down is populated with the relevant size variants based on the manufacturer and model selected.  If there is only one size
for the device, then only one size variant is available in the drop down. When only a Size has been selected, then the colours in the 'Colour'
drop down are colours available for the selected size
2. The Agent selects a 'Colour' only, leaves the 'Size' empty and selects 'Refine'
The Logic re-runs the recommendation using the selected manufacturer, model and colour.  The logic uses the product catalogue and
recommends the lowest size variant of the in stock, back order or pre order device (for example Apple Watch Series 8, Silver,41 mm)


If the device is out of stock (using the Retail vs TSAR stock rules), no update to recommendations are presented, the 'As Is' error message
is presented and the previous recommendations are still displayed as per 'As Is'
3. The Agent selects a 'Size' only, leaves the 'Colour' empty and selects 'Refine'
The Logic re-runs the recommendation using the selected manufacturer, model and size.   The logic uses the product catalogue and
recommends the 1st colour in alphabetical order the in stock, back order or pre order device (for example Apple Watch Series 8,
Graphite,41 mm)


2528
If the device is out of stock (using the Retail vs TSAR stock rules), no update to recommendations are presented, the 'As Is' error message
is presented and the previous recommendations are still displayed as per 'As Is'

4. The Agent selects a 'Colour' and a  'Size' and selects 'Refine'
The Logic re-runs the recommendation using the selected manufacturer, model colour and size.
If the device is out of stock (using the Retail vs TSAR stock rules), no update to recommendations are presented, the 'As Is' error message
is presented and the previous recommendations are still displayed as per 'As Is'

MBB Customer
An Agent (TSAR or Retail) launches VADR with an MBB CTN
The Agent lands on the Recommendations screen as per 'As Is'
The Recommendations displayed uses the 'As Is' MBB recommendation logic based on the customer's current product holding and AOM
ADM data
In the 'Refine by' 1 new drop down field is presented after the 'Model' drop down and before the 'As Is'  'Storage' drop down:
Colour
When 1st loading the screen the 'Manufacturer', 'Model',  'Colour' and 'Storage' drop downs are empty
1.The Agent selects 'Tablet' or 'Laptop' in the  'Device Type' and then selects a 'Manufacturer' and then a 'Model' as per 'As Is' . The 'Refine'
button is available. If the Agent selects the 'Refine' button VADR runs the recommendations as per 'As Is'
The 'Colour' drop down is populated with the relevant colour variants based on the manufacturer and model selected. If there is only one


Colour for the device, then only one colour variant is available in the drop down. When only a Colour has been selected, then the 'Storage'
drop down is populated with the Storage available with that colour