Component Reuse

Version

Application Scenarios

Do not know how to beautify a template? Do not want to spend too much time on style configuration? Do you need to fix common component styles or functions? Do you need components with data to quickly set up demo?

FineReport component reuse function can help you. You can download the components you want. After downloading, drag the components to your dashboard, change the data, size, background color, and so on.

If you can package your own components and save them to local components, you can also reuse them by dragging and dropping.

Using a Component

Drag the component directly from Local Components into the body of the dashboard. In absolute layout, you can adjust the position and size of the component.

1. Select the component, and Help Settings button will appear in the upper right corner. Click the button to enter the help settings page, and you can view the usage instructions of the component and the special setting items such as all the condition properties, JS and hyperlinks in the component. (If the component does not have a special setting item, it is not displayed.)

As is shown below:

2. When a component in the component library is displayed in the component settings list, a blue logo will appear in the upper right corner. Suffixes are automatically added to the encapsulated component name based on the existing component name in the dashboard. As is shown below:

3. When you drag a component from the component library to the template, if the template and the component have the same theme, settings in the component that are set to follow Theme will remain unchanged. If not, all the related settings will be in Custom state, and the style setting values remain the original component settings. As is shown below:

Creating a Component

To save your components for future use, you can click Create.

1. When creating a component, all data sets in the template are encapsulated as the built-in data sets of the component. Therefore, make sure there is no irrelevant data sets.

2. Select a component (multiple selection is supported), and go to Local Components page of the component library and click Add > Create to enter the configuration page for Component generation.

3. After setting relevant information, click OK to generate components. The generated components will show on Local Components page and be saved to %FR_HOME%\webapps\webroot\WEB-INF\assets\component. You can also copy the file with suffix .reu directly to others.

Note: Components you generate locally can not use themes.

As is shown below:

Adding a Group

Sometimes there are too many local components, and the whole page is messy. You can organize them into different groups to save time.

1. Click Add Group under Local Components page to add a group.

2. To move a component into a group, right-click a component and click Move Group.

As is shown below:

Operating in Batches

If there are many components, you can delete or move group in batches. Click Manage Components on the Local Components page to select multiple components. As is shown below:

Remote Design Error

1. Problems

When designing remotely, the server JAR package version is the same as the designer version, but an error will be reported when opening the component library: The remote design environment is inconsistent.

2. Cause analysis

Probably because components in the server component directory have special symbols in their names. In the following figure, for example, component names have a horizontal line.

If it is because of naming, there will also be a message in the fanruan.log: Incorrect file name, directory name, or grammar.

Solutions

Delete the special symbols.