Sharing a ligerui-based system application case: ligerrm V2 (permission management system) (download available) general permission management design-Database Structure Design

ArticleDirectory

• Modules with permission Control

Reading directory

• Introduction
• System features
• System introduction-Homepage
• System introduction-list page
• System introduction-Details page (form)
• System introduction-menu/button
• System introduction-Permission Center
• System introduction-data permission
• System introduction-field Permissions
• System introduction-application details in the drop-down list
• Conclusion

Introduction

Ligerrm V2 is a ligerui-based Web application system. With permission management as the design focus, northwind is introduced as the main data demonstration module. In terms of permissions, data permission control is added on the basis of the previous version. The background is developed using the dot net 3.5 framework.

• System Demo: http://case.ligerui.com
• Front-End Plug-ins: jquery, jquery. ligerui, jquery. Form. JS, and jquery. Validation
• Data Interaction: liger. Data (a small ORM Component)
• Download source code: ligerrmv2

Demo account:

Account	Name	Title	Password
Test3	Recorder 1	Basic Data Recorder 1	1
Test2	Recorder 2	Customer Data Recorder 2	1
Test1	Advanced demo account 1	Advanced demo account 1	1
Test4	Order viewer 1	Order viewer 1-Sales Representative	1
Test5	Supplier 1	Supplier 1-exotic liquids44	1

System features

1. The Code-behind mechanism is not used, and no server controls are used. The work is fully implemented at the front-end, and only the data is processed at the backend. The page still uses the aspx suffix to inherit from the Unified page base class (to facilitate permission control ).

2, greatly avoidedCodeRedundancy. Whether it's a list page or a detail page, the code you see is extremely concise. Even forms do not even need any HTML code, but define [useful information ], the data structure that is useful for [layout] and [data]. Of course, this is true for tables and search boxes.

3. Unified Data submission/receiving interfaces. All data requests are implemented through Ajax and processed by handler/*. ashx. There are 6 different types of foreground data requests:

Ajax. ashx ---- Common Data Request entries (Form submission entry, form loading entry, common data loading entry, etc)
Grid. ashx ---- General ligergrid table data loading entry
Treegrid. ashx ---- General ligergrid table tree format data loading entry
Tree. ashx ---- General ligertree tree format data loading entry
Select. ashx ---- General ligercombobox data loading entry
Validate. ashx ---- universal verification data verification entry (for jquery. Validation Remote verification)

4. Complete data permission control mechanism. In addition to the basic (User Role) => (module function) and other functional permission control functions, the data request portal also performs some minor actions, filter data based on the current user information and configured data permission rules.

5. automatic search box and automatic form. Forms and search boxes do not need a bunch of complex redundant HTML, but define the field information (field name, width, type, etc.) to automatically construct the page.

6. Automatic tables. In the same table, only some configuration information is required. The filter plug-in provides advanced custom query and history query functions.

System introduction-homepage with permission Control Module

When loading the home page, the system loads the menu module for permission based on the user information:

System introduction-list page (configured search box, table, Dynamic Button (permission Control ))

The search box and table are no longer a bunch of HTML elements, but only defined with [layout] and [data] configuration information.

The operation button is based on the permission control on the current page.

The specific method is to determine the page menuno (the unique menu encoding), load the permission button according to menuno and the current user information, and obtain the menuno rule:

Priority 1: If the page defines a hidden field whose ID is "menuno", read the value of this hidden field, for example: <ipnut type = "hidden" id = "menuno" value = "ordermanageorders"/>

Priority 2: Based on querystring of the page url, name is the value of menuno

Priority 3: match by page url,/ordermanage/orders. aspx, menuno is ordermanageorders

Interface effect:

Related code:

The form elements in the search box are not all in the form of text boxes, but support date, drop-down box, and so on. These editors can be expanded and are theoretically common. For example, you can select the shipping city from the drop-down list:

 display: "city", name: "shipcity", newline: True, labelwidth:  100 , width:  220 ,  space :  30 , type:"  select  ", cssclass:" field ", options: {
 URL :".. / handler /  select . ashx?  View  = orders & idfield = shipcity & textfield = shipcity &  distinct  = true" 
}

System introduction-Details page (automatic creation of forms, automatic loading of forms, and submission of forms)

A form consists of three parts: form structure, form data, and form submission:

Form Structure:For style unification and code conciseness, the form is also "configured" (using the ligerform plug-in)

Form data:After loading a view/table name, primary key field name, and primary key value to a record, use js to access each attribute and load it to the corresponding control, and update the style of the control.

Form submission:Use jquery. Validate for form verification, and use jquery. Form. js for Ajax to submit data

Note:

1. Update the style of the control: the text box and drop-down box of the form use the form Element component built in ligerui. These components all use the updatestyle method, that is, when the value changes, the interface does not respond in time, call this method

2. The unified entry for form submission is Ajax. ashx, we will pass in the type and method, use the reflection mechanism to find the corresponding method, the request data (request. form) to the method. For example, add the order Signature: ajaxresult addorders (namevaluecollection form)

The interface is as follows:

System introduction-menu/button

You can edit and save the menu in the row edit mode of the table and select the icon in the dialog to make the operation easier.

 

The editing mode of the button is the same as that of the menu, and the row editing mode of the table is used ]. There are not many fields. I also recommend this method instead of opening another page.

To edit the entire table at the same time, you can use the cell editing mode of the table, such as the order editing page-Order Details table in the system]

System introduction-Permission Center

The design concept is the same as that of the same version. It uses [user], [role] =, [module], and [function] Permission control. For more information, see my previous introduction: general permission management design-Database Structure Design

On the interface, you only use one page to complete all the permission control and perform simple operations.On the Design Rule, the role can authorize permissions. On the other hand, the user is set to allow or deny the role separately on the basis of the role.

 

 

You can separately set permissions for users (Permit or deny)

System introduction-data permission

The new features in this version allow further permission control extension based on the function permissions (as mentioned above). For example, a salesperson can only view his/her own sales orders.

The ligerfilter plug-in is used, which is a common condition query component. You can customize the editor type, for example, select the role drop-down box.

 

Is the editing page, defines the data permission rules: [order viewer can only view their own], [order administrator and demo role can see all ].

Administrators are never restricted by data permissions.

Note that five user information parameters are available, which can be expanded as needed

The following matching relationship is returned when the final database statement of the Organization executes the five user information parameters, which can be well expanded here.

 Restrictions on data permissions are always: {allowed field name conditions}

Lists all fields in the order table, and adds several user parameters to facilitate specific permission allocation.

The ligerfilter editor can be used to customize the features. The current user information can be selected in the drop-down box, and you can even select it in the pop-up window.

System introduction-field Permissions

If data permissions are extended vertically, field permissions are extended horizontally. You can disable access to certain fields by specified users/roles. This function is also added in the current version:

System introduction-application details in the drop-down list

The applications in the drop-down box in the system are classic, such as the drop-down box tree and drop-down box table. In the drop-down box, select data in the pop-up window. Here are the details of several applications.

In the department tree, select:

 

In fact, the system selects data from the drop-down list in all situations. You only need simple configuration information to select data from the specified data source. For example, you only need to configure the data as follows:

Is an example of the drop-down box tree, and then look at the ordinary drop-down box:

 

Both cases load all the data. If the drop-down box has a large data source, we certainly do not want to load all the data at once, instead, you can select data in pop-up, paging, and filtered tables, which makes the form application more user-friendly. Based on this requirement, the openselect method is extended to the drop-down box plug-in this system. You only need to specify the grid configuration parameters, the search configuration parameters (optional), and the returned field name, you can quickly implement this application. You can refer to [select customer in order] and [select supplier in product] in the system ].

 

Code:

 

Conclusion

This version encapsulates common operations for [add, delete, modify, and delete] more thoroughly, greatly enhancing the processing capability of the client JavaScript, while the server side only plays a role in data processing.

A large number of grid, tree, and various form plug-ins are used in the system to demonstrate many functions of ligerui.

There are also a lot of details and usage skills, such as the delayed loading of products and Tab options introduced in the order details editing table. They all need your experience and suggestions.

welcome: http://bbs.ligerui.com