Overview
Version
Report Server Version | HTML5 Mobile Display Plugin Version | App Encapsulation Plugin Version |
11.0 | V11.0.85 | V1.0 |
Application Scenarios
App Encapsulation plugin can be used for the following scenarios.
Conduct pagination/Hierarchical designs for a template with multiple content levels.
View templates belonging to the same business/analysis subject in a combined way, rather than viewing them separately in the directory structure.
Through the App Encapsulation plugin, you can use templates to build simple business apps and organize them through a navigation structure. In this way, apps can have product forms, facilitating subsequent app reuse, implementation, promotion, and evaluation for app market ecology construction.
Function Description
You can set various styles and customize the effects of the plugin.
Top navigation effect is shown in the following figure.
Bottom navigation effect is shown in the following figure.
Introduction
Plugin Installation
Download the plugin in the FanRuan market: App Encapsulation Plugin.
For details about installing plugins in the designer, see Designer Plugin Management.
For details about installing plugins on the server, see Server Plugin Management.
Note:
Introduction
Entry
After installing the plugin, choose System Management > App Encapsulation to go to the app editing page.
Step | Description |
1 | Click Add App to go to the app editing page. |
2 | Manage added apps. You can view app information, edit, preview, rename, and delete apps, and copy app links. |
Content Configuration
Click Add App to go to the app editing page.
Settings | Description |
Content configuration | Configure template content displayed in apps. |
App configuration | Configure app navigation bar effects. |
Add pages and combinations on the left side of Content Configuration. Click the page/combination setting icon and modify the name. You can preview the effect on the right side.
No. | Settings | Description |
1 | Add pages | Allows you to add template resources and hyperlinks. For details, see the following additional description.
|
2 | Add combinations | Allows you to add multiple pages in a combination (equivalent to a folder). |
3 | All pages | Allows you to display the added pages and combinations, add pages/combinations at specified levels, drag and move content locations, and delete content.
|
4 | Content settings | Click the added combination or page to set the content.
|
5 | Preview | Allows you to view app effects and switch navigation pages with one click. 1. Empty combinations are not displayed. Only five level-1 directories can be displayed in the bottom tab bar. 2. Sample data is displayed on the preview page for demonstration only. |
Additional description.
Add pages | Description |
Template Resource | Allows you to add platform directories and template authentication reports (multiple selections supported).
|
Hyperlink | Enter a page name and a hyperlink to add a hyperlink. |
App Configuration
After content configuration, you can perform the app configuration.
No. | Settings | Description |
1 | Configure navigation bar styles. | Allows you to separately configure level-1 and level-2 navigation bars and configure their theme colors. If you choose Bottom Tab Style, at most five first-level directories (with navigation icons) can be displayed. |
2 | Preview | Allows you to preview app effects. If you choose Popup Style, the corresponding page pops up when you click the navigation bar. |
Click Save after completion.
Manage Apps
Return to the app encapsulation page to manage apps.
No. | Settings | Description |
1 | Edit apps | Click the editing icon to edit an app. For details, see sections "Content Configuration" and "App Configuration". |
2 | Preview apps |
|
3 | Copy links | Click the copying link icon to copy a link, which can be modified before being used. For details, see section "Viewing Apps". |
4 | Rename | Rename apps.
|
5 | Delete | Delete apps.
|
Permission Configuration
1. If other users need to use the App Encapsulation plugin, the super admin needs to enable Hierarchical Authorization and assign the system management permission of the plugin to them.
2. To ensure that users can add corresponding templates, the super admin needs to assign the directory editing permission to them.
Descriptions for permissions of different resources in apps:
Platform Directory: Only users with platform directory permissions can preview this node in the app.
My template - Template Authentication Report: Only users passing the template authentication can preview this node in the app.
My template - My analysis: Only users with collaboration permissions can preview this node in the app when they preview the link. Only users with directory permissions can preview this node when they publish it to directories.
When you publish resources to directories, the outermost layer of resources follows the directory permission of the platform where the app is located. Then the resources are determined based on their permissions by each node in the app again.
When you preview mounted links, resources are determined based on their permission by each node in the app.
Data permissions: takes effect based on the data permissions and data connection permissions used in templates.
Creating an App
Adding an App
Click Add App, enter the name, and click Confirm.
Editing an App
Content Configuration
1. Select App Pages, choose > Add Combination, and modify the icon.
2. Select Homepage and choose > Template Resource.
3. Adjust template positions.
4. Add another combination named Order. Choose > Hyperlink to add a hyperlink.
5. Configure the directory as needed.
App Configuration
After completion, go to App Configuration, as shown in the following figure.
Set Level-1 Navigation to Top Tab Style and Level-2 Navigation to Popup Style. Set Navigation Bar Background to white, Selected Style for Directory to blue, and Default Style for Directory to gray. The effect is shown as follows.
Note:
Click Save.
View Apps
After modifying the link of the created app, you can mount the link to platform directories, mobile integrations, lightweight apps, data portals, and so on.
1. Click the copying link icon to copy a link (format: http://localhost:8075/webroot/decision/url/mobile/packagedApp/?appId=xxx).
2. The project address in the link should match the one in the browser. You need to replace it with your project's actual domain name and port number.
Format: http://Domain name:Port number/webroot/decision/url/mobile/packagedApp/?appId=xxx
3. Mount the link to the desired location.
