Card View Enhancements

Enhancement Features In Framework Version 5.1.0.0 

In this release we have introduced export templates features. Added a new checkbox (top left corner) on the template as shown in below  Form image "Template Wizard (Card)" given below. This form is accessible by System Administrator Role.

User can export single and multiple card template. Mark the checkbox true of the template which wants to export.  

As the checkbox is marked as true then the “Export” button will appear with “Next” Button.  If more than one checkbox is marked as true then the “Next” button will disappear.  

 

Afterwards, click on Export Button it will open the Module List pop-up where system ask to select the respective module by which user wants to export these select template and click on “OK” button, as shown in image given below. 

In our example, we selected "Card View Template" module and clicked on the “OK” button. It will mark the selected template with selected module for export.  

 

Remove Card Template from Export data marking list 

System will show a new icon “Remove Export Icon” on the cards which are added in export data marking list while hovering mouse on the card template as shown in the image below: 

By clicking on the "Remove Export icon", the user can remove the data marking of the template.  

 

Generate Module Data XML Files 

Later on, the go to the “Generate Module Data XML” menu and select the particular module from the dropdown and then click on the “Ok” button and generated Data XML files can be deploy with module on the market. 

 

Enhancement Features In Framework Version 4.9.3.0 

  1. Card Dialog enhancement  

We added some new features in card dialog are given below: 

  1. Exclude group 

  2. Sort Order Field 

  3. Save And Apply 

  4. Save 

All above feature shown in below image  

  1. Exclude group 

 Here we provide the feature to exclude group from card view by uncheck the checkbox. 

For Example: 

Before exclude 

After excluded 

Now excluded “Rate 3” group as shown above and impact shown below 

Now you can see that “Rate 3” group is not displayed.

  1. Sort Order Field 

Vienna Provided option to set order of records in card view. For this Vienna has introduced new field on card view dialog having name "Sort Order Field". Sort Order Field dropdown have all the field of target window tab. You can choose any field according to requirement and then there are two icons to set sort order (Ascending OR Descending). User can click on any of these icons and then click on "ADD" button. Then that selected field will be displayed under "Sort Order Field" with its sort order and cross icon. User can remove field from sort order by click on cross icon. When user clicks on "Save" Or "Save and Apply" button, then sort order will be saved in database and will be reflected in respective card. 

NOTE:- Vienna Allowed maximum of 3 field to set sort order of data in card view. 

 

  1. Save And Apply  

Here Vienna give the functionality “Save And Apply” to save changes of card and then apply changes on card view. When user change something in existing card or create a new card and clicks on "Save and Apply" button, then changes of card view dialog will be saved in database and then dialog get closed and effect of these changes will be reflected on Card View in window. 

  

  1. Save 

 If User wants to edit or create multiple cards without closing and opening Card View Dialog again and again, then user can use Save button to save changes in database. On click of save button, System will save all the changes of card in Db and shows card view dropdown to choose another card for editing. 

 

4.Card View Enhancement

 

  1. Group Count 

In this version we provide Group Count on the header of group next to the group name as shown in image below. This count represents total number of record present in that group.  

  1. Show Empty Group 

In this version we provide the feature to show empty group as shown in below image if particular group don't have records in current page. User can drag any card from another group to empty group. 

 

7.Card View Window

We added two new field on card view window 

Field Name   

Description   

Excluded Group 

This column is use to hide group from card Layout. This field stores search keys of list item separated with comma(,). 

Sql Order by 

The ORDER BY Clause indicates the SQL ORDER BY clause to use for record selection.  

Enhancement Features In Framework Version 4.7.0.0 

Overview


Vienna Advantage has enhanced functionality of card view in window. Now user can create more attractive cards using card template and drag-drop functionality is also introduced in card view. End user can create their own cards from card dialog on window and System Administrator can also create cards for windows which will be available for all other users to use.  

This document contains information about Card view dialog, Card View window and Card Template. 

Tenant User can open the Card View as below steps  

Step to open Card view Dialog 

  1. Login 

  2. Search any window and Select any Tab 

  3. click on Setting Icon which is displayed on Top right corner and select card view as shown in below in red circle. 

 

8.Card View Dialog

  • Overview  

Card view dialog display is changed, the above UI shows the new Card view dialog comes in this version.  

We added some new feature which are given below 

  1. Group Sequence 

  2. Is Gradient Background 

  3. Default View 

  4. Shared 

  5. Copy card 

  6. Card Template 

  

User can create new card by select using (+) icon 

Select Field 

Select will shows all the filed related to current window – Tab 

Include Field 

user can move the field from selected field to Include Field which he/she wants to include in Card View. 

Group By:  

The purpose of group by dropdown is to categorized the card view on select group by field values. 

Group By dropdown shows all the fields linked with List/Table/Table Direct/Search and Yes/No.  

 

Group Sequence: 

Group Sequence indicate the sort order of card as Group Item wise 

By Default, this field disabled and show the message “Only for LOV Group by Field” and it will only enable in case of when LOV field selected in Group by filed. There are two buttons i.e. UP and Down next to Group Sequence. The purpose of these two buttons is to arrange the sequence. 

For example: 

In above two pic, 1st pic show the default sequence and 2nd pic show the arranged sequence 

 

 

  

Is Gradient Background 

This feature is used to provide the Gradient background to Card on the bases of condition. To achieve this user, have to Mark “Is Gradient Background” check box true otherwise normal background will apply. 

For example: 

In above pic we selected “Is Gradient Background” and 5 boxes are appeared. 

  • 1st color box represents the start color of Gradient 

  • 1st number box represents the ending of 1st color in percentage. 

  • 2nd color box represents the second color of Gradient 

  • 2nd number box represents the ending of 2nd color in percentage. 

  • Last dropdown box represents the direction of Gradient. User have 8 option to set the direction. 

  • The preview of the background will display in the grid. 

  

Default View 

This checkbox displays only in case of creating new Card. The purpose of this checkbox is user can set card as default and show that card on tab open.  

 

If the user has no default card then the admin's  default card will be shown. If there is also no default admin card then the super user's default card will be shown.  

Otherwise, the first card will be the show. 

 

Shared 

This checkbox displays only in case of Admin. The purpose of this check box is Admin can share own created card to everyone by check box mark as true otherwise that card is private card and No one can see that card. By default, it will True. 

 

Edit and Copy card 

From this release onwards, if user wants to change something in their card, then user must click on edit button to first otherwise all the fields in dialog will remain disables. 

We added new “Copy” button shown in below.  

This button will appear when user select shared card. The purpose of this button is that user want to copy of Admin/superuser card or want some modification in exist card. click on Ok button copy of that card saved as new card with that user as private. 

 9. Card Template

User can link card with any card template. Framework will match sequence no. Of fields in card with sequence no. Of items of card template. Based on settings of items of card template, fields will be displayed in card in window. Card templates can be designed from Card Template window. 

 

Card Template window is used to design templates for cards. User can create template in this window and then link that card template with card view using card view dialog OR card view window. This window contains three tabs which are used to set different settings for card. One card template can be linked with more than one cards. End user can create card templates without writing a single line of code. The only thing required is that user should be able to search CSS properties from google. All the guidelines are explained in this document. End Users must follow these guidelines to ensure the smooth working of application.  

 

Card template window contains 3 tabs. 

  1. Card Header  

  2. Card Section 

  3. Card Items 

 

Each of these tabs has specific purpose for card template creation. All the required information need to be inserted in these tabs for successful creation of cards. Fields of these tabs are explained below.  

  1. Card header 

This is the first tab of the card template window. Fill name and other information needed. The name of the card template will be displayed on the card view dialog popup.  

Field Name  

Description  

Name  

This field defines name of card template.  

Style  

User can use this field for styling of card. The defined style will be applied to the whole card.  User has to enter CSS properties here and these properties will be applied to header panel.   

Example: background:gray;font-size:20px;color:black  

  1. Card Section 

A card section defines a block that contains items. Here user defines the structure of each block of the card. Each block contain items.  

Field Name  

Description  

Card Layout  

This is foreign key of parent tab. It will display name of parent record.  

Sequence  

This field defines the sequence no. of block in card.  

Name  

Name of block to identify each block.  

Total Rows  

Defines the total no. of rows current block will have.  

Total Columns  

Defines the total no. of columns current block will have.  

Style  

User can use this field for styling of each block in card. The defined style will be applied to the current block of header panel.  User has to enter CSS properties here and these properties will be applied the items of block.   

Example: background:gray;font-size:20px;color:black  

Padding  

Padding defines the space between header panel border and its content. It can be defined in pixels. Padding can equal or different from all sides.  

Example for same padding from all side: 10px. This means padding from all sides is 10px.  

Example for different padding from all side: 10px 5px 10px 5px. This means 10px from top, 5px from right side, 10px from bottom, 5px from left side.  

  1. Card Items 

Field Name  

Description  

Grid Layout  

This is foreign key of parent tab. It will display name of parent record.  

Sequence  

This field defines the sequence no. of item in each block.  

Start At Row  

It defines the row number at which this item will be added.  

Row Span  

Defines the total no. of rows current item will cover.  

Start at Column  

It defines the column number at which this item will be added.  

Column Span  

Defines the total no. of columns current item will cover.  

Align Items  

This field defines the vertical alignment of item in parent block.  

Justify Items  

This field defines the horizontal alignment of item in parent block.  

Style  

User can use this field for styling of each item in parent block. Whatever the style is defined here, will be applied to current item. Style will be applied to field icon, field value and field label. “Field value style” can be override style of Field.  

User has to enter CSS properties here and these properties will be applied the items of block.   

Example: background:gray;font-size:20px;color:black  

Field Value Style  

This field is used to override properties defined in style field. It will override properties only for Field value. Field Text and Field Icon will get properties from Style Field Only. 

  

If User wants to set properties for both icon and field value then user can write properties in this format.  

FORMAT: @img::height:60px;width:60px;font-size:20px;border-radius:50%|<br>|@value::color:gray;font-size:10px 

@img:: is used for image formatting. In this example, height and width is defined for image. 

In order to separate properties of image and value tag, we have to use | symbol.   

<br> tells system that next item(image or value) of current field will be displayed under previous item.  

@value:: is used to set properties for value of that field in header panel. In this example, value will be displayed with gray color with 10px font size.  

Hide Field Icon 

If checked, icon will not be visible with field. 

Hide Field Text 

If checked, field Label will not be visible with field. 

 

10. Default Card View

This window is used to set the default card for the tab for that particular user.  Only System administrator can access this window. If system administrator wants set default card for any window whose access is not provided to system administrator, then that can be done from this window. User has to select tab on which default card is to set, card which will act as default card and user for which trying to set default card.  

Field Name  

Description  

Tab  

This field contains tab for which default card is set. 

Card 

This field contain card which is set default for the selected user and tab. 

User/Contact 

This field contain User for whom default card is set. 

 

11. Linking between card view and card template

Once user has created a card template,  user can link that card template with card view. Each card view contains some fields which are to  be displayed in card. System will match sequence number of field of card with sequence number of item of card template. Then based on settings of item, field in card will be displayed. 

 

12. Selecting Card from Window 

In this release, Vienna has provided option to select card in card view of window. User don't have to open card view dialog to change card view in window. In card view, 3 dots are displayed on top right corner. When user click on this icon, System will display list of cards available for that tab. User can select any card from that list. 

If user wants to set any card as default card for tab, click on square box displayed in front of card name in list. That card will become default card for tab. 

13. Drag and Drop 

We interduce new feature  Drag & Drop Card in this Version. We can drag and drop any card with the help of Mouse from one Group to another Group.  

Move the draggable Card by clicking on it with the mouse and dragging it to another  group. 

 

Limitation: 

  1. This drag drop only work for Group. 

  2. Callout will not work 

  3. We can only drop any card on another group card otherwise it will revert 

 

 14. Limitations

  1.  If user change anything in default card, then user must execute cache reset process to see changes in card. 

  2. If user have no default card and there is only one card in tab ,then also user must execute cache reset process to see changes in card. 

 

Creating Card From System Administrator Role 

Card view window is used to create cards by System Administrator. System Administrator has ability to create card for any window and user can send these cards to customers through Vienna market. System Administrator do not have access to open all the windows from menu, so system administrator cannot create cards by card view dialog for those windows. In order to create cards for all windows, System Administrator can use Card View window. All the cards created by System Administrator are shared by default. This window contains 4 tabs. 

  1. Card View 

  2. Card Access 

  3. Card View Fields 

  4. Card Condition 

Each of these tabs has specific functionality to create cards. 

  1. Card View 

This tab is contains information of card like tab linked, group field etc. 

Field Name   

Description   

Screen 

This field contains window with which card is linked 

Tab   

This field contains Tab of selected window with which current card is linked.   

Name 

Contains Name of card. 

Field 

Cards will be grouped based on selected field in this field. 

Template 

This filed contains card template linked with card. 

Group Sequence 

If cards are grouped on field whose reference is list, then user can define sequence of groups from this field. This field stores sequence of search keys of list item. 

  1. Card Access 

              ( Not in Used ) 

           All the Roles have access to window also have access to the card. 

  1. Card View Fields 

This tab contains information of all the fields which are included in card. 

  

 

Field Name   

Description   

Card 

This field contains card linked with fields. 

Field 

This field contains fields which are included in card. 

Sequence No. 

This field stores the order in which fields will be displayed in card. 

Field Value Style 

If user wants to override style of field value, then user can write style in this field. 

  1. Card Condition 

If user has applied some conditions on card, then these conditions are stored in this tab. 

Field Name   

Description   

Card 

This field contains card linked with fields. 

Color 

This field is used to store color of card. 

Condition Text 

Condition text is used to evaluate the condtion.\/]= 

Condition Value 

  

  

Condition value stores condition applied on card.