As a "paste code" to promote the practice of a CRUD project PasteTemplate, in the existing three projects for combat after the effect is very comfortable! PasteForm for why I would like to be called the best CRUD to do some answers.
Where can I download this PasteForm project example?
At present, "Paste Code" external use of PasteForm projects are "Paste Builder (PasteSpider)" and the case of the project (PasteTemplate), in which the case of the project you can in the
/pastecode/paste-template attainment
What are the features of PasteForm's CRUD mode?
Engage in this at first because I have a project to implement a large number of forms on the line in the small program, think about it, a whole lot of similar code, is not the way you can use that component to achieve it, then you need to pass into the model, think about it in a different way, then we often use the CRUD can also be so engaged?
So there is this implementation of PasteForm using the principles of multiple data models Dto and reflection, the main advantages are as follows
The output is an idea that the admin side of the page is controlled by the backend, both in terms of security and data representation
2. The front-end write once after the subsequent do not have to write, if you use my case project, then you can not write the front-end, including the back-end to add a new table, modify the fields, etc., the front-end no longer need to modify the code!
3. Front-end page of the ultra-clean, whether your back-end is 30 tables or 100 tables, for the front-end are almost about 4 pages to get it done! Of course, some special needs, or need to write down!
4. No language restrictions, the above said output is a thought, the case of this article is the use of .netcore + html form of realization, you can also use, for example, java + vue pattern
5. uniformity, for example, you 30 tables of image upload, in the form of their styles are the same, because they are actually using the same management side of the page
6. back-end co-ordination of all, such as the display order of fields, fields whether to display, the default value of the field, etc., etc., by the back-end corresponding to the Dto to limit and control, for example, the same new, due to the role of the current logged-in user is different, you can limit a certain field Zhang San must be filled in, while Li Si can be optional!
Seeing the code on the admin side, it feels like JSP's?
The principle of the entire PasteForm is the back-end of the data model properties, fields and so on back to the front-end, front-end based on the data returned to the back-end and then rendered to the UI on the UI, in order to facilitate the preparation of the template pattern, in fact, it is not a JSP, it looks like it!
My project has 120 data tables, so is that a lot of backend files to write?
PasteForm in principle only 3 pages pasteform/,pasteform/,pasteform/, just some special cases, will add some pages, this depends on the actual needs of your project, in fact, no matter how many tables, PasteForm pages are just so many, such as the rights of the page for pasteform/?path=roleInfo and the user's table for pasteform/?path=userInfo, you will find that in fact they are the same page, just the parameters of the path is not the same, you will find that they are the same page. /?path=roleInfo and the user's form for pasteform/?path=userInfo, you will find that they are in fact the same page, just the parameters of the path is not the same , the path is WebApi Service!
In fact, you can not write a page at all, and use the files of pasteform in the case project PasteTemplate that I provided!
I see the case PasteTemplate project is written using html,js,css, can I use vue to write the admin side?
mentioned above, PasteForm main output is an idea, that is, by the back-end Dto control the front-end page rendering and interaction, etc., so from the WebApi request to get the template attribute fields and other information, you can use other languages to achieve the management of the end of the page, not limited to native, vue, angular and so on.
What is pasteform/ for?
As the corresponding data table data display, generally for the table table presentation, corresponding to the model for the XXXListDto, but also includes a search area, the search area by the corresponding InputQueryXXX data model decision, generally only three fields page, size, word! Of course, this page also contains new data, edit, details, delete and other operations interaction!
What does pasteform/ do?
Add data, or edit data when using this page, but they read the data model is not the same, such as the authority of the table roleInfo, there are added when the pasteform/?path=roleInfo, corresponding to the data model for the roleInfoAddDto, and in the edit time for the pasteform/?path=roleInfo&id=3, corresponding to the data model for the roleInfoUpdateDto. path=roleInfo&id=3, the corresponding data model is roleInfoUpdateDto. The overall logic of the page is to get the corresponding model from WebApi, then based on the rules of rendering to the UI, including the default value, the current value, etc., and then read the value from the page form to submit to the back-end when submitting, so the main control is still in the back-end! So the main control is still in the backend!
What does pasteform/ do?
There are times when our data can not be displayed in the pasteform/page to complete, such as the list of articles, mainly some of the fields are too long, this time we want to have a page to show the details of the content, so detail is to do this with, corresponding to the data model for the XXXDto!
I don't know .netcore can I write pasteform in other languages?
PasteForm output is a thought, so it is possible to use other languages, but you have to write a whole set of it is, for example, you can use vue + java pattern to get a set! Back-end core code examples
/// <summary>
/// retrieveAddDtodata model
/// </summary>
/// <returns></returns>
[HttpGet]
[TypeFilter(typeof(RoleAttribute), Arguments = new object[] { "root", "root" })]
public ReadAddModel()
{
var _model = <RoleInfoAddDto>(new RoleInfoAddDto());
return _model;
}
/// <summary>
/// retrieveUpdateDtodata model
/// </summary>
/// <returns></returns>
[HttpGet]
[TypeFilter(typeof(RoleAttribute), Arguments = new object[] { "root", "root" })]
public async Task<> ReadUpdateModel(int id)
{
var _query = from a in _dbContext.RoleInfo
join b in _dbContext.RoleInfo on equals into c
from rol in ()
select new RoleInfoUpdateDto
{
Id = ,
Desc = ,
FatherId = ,
Icon = ,
IsEnable = ,
Model = ,
Name = ,
Path = ,
Role = ,
RoleType = ,
Sort = ,
ExtendRole = rol != null ? new RoleShortModel
{
Id = ,
Model = ,
Name = ,
Path = ,
Role = ,
RoleType =
} : null
};
var _info = await _query.Where(x => == id).AsNoTracking().FirstOrDefaultAsync();
if (_info == null || _info == default)
{
throw new PasteCodeException("The query does not exist，Unable to perform editing operations！");
}
var _dataModel = <RoleInfoUpdateDto>(_info);
return _dataModel;
}
/// <summary>
/// retrieveUpdateDtodata model
/// </summary>
/// <returns></returns>
[HttpGet]
[TypeFilter(typeof(RoleAttribute), Arguments = new object[] { "root", "root" })]
public async Task<> ReadDetailModel(int id)
{
var _query = from a in _dbContext.RoleInfo
join b in _dbContext.RoleInfo on equals into c
from rol in ()
select new RoleInfoDto
{
Id = ,
Desc = ,
FatherId = ,
Icon = ,
IsEnable = ,
Model = ,
Name = ,
Path = ,
Role = ,
RoleType = ,
SortStr = ,
FatherStr = ,
Level = ,
RootId = ,
Sort = ,
ExtendRole = rol != null ? new RoleShortModel
{
Id = ,
Model = ,
Name = ,
Path = ,
Role = ,
RoleType =
} : null
};
var _info = await _query.Where(x => == id).AsNoTracking().FirstOrDefaultAsync();
if (_info == null || _info == default)
{
throw new PasteCodeException("The query does not exist，Unable to perform editing operations！");
}
var _dataModel = <RoleInfoDto>(_info);
return _dataModel;
}
/// <summary>
/// retrieveListDtodata model
/// </summary>
/// <returns></returns>
[HttpGet]
[TypeFilter(typeof(RoleAttribute), Arguments = new object[] { "root", "root" })]
public ReadListModel()
{
var _model = <RoleInfoListDto>(new RoleInfoListDto());
var _query_model = (new InputQueryRoleInfo());
if (_query_model != null)
{
_model.QueryProperties = _query_model.Properties;
}
return _model;
}
What is the purpose of each model used by PasteForm, Dto
My earliest contact with the Dto is ABPvNext, talking about this Dto have to say ObjectMapper, for example, permissions table RoleInfo, the corresponding RoleInfoAddDto, RoleInfoUpdateDto, RoleInfoDto and RoleInfoListDto, the actual current development you may also derive more Dto, such as my commonly used RoleMenuDto, RoleAuthDto, etc., PasteForm in the main use of the first four, generally accompanied by an InputQueryRoleInfo! For example, when adding a new time, the user to submit the data model is RoleInfoAddDto, the API after submission to the API, the API will be used to add a new data model. Submitted to the API, the API at the data validation is legal and then use AutoMapper to RoleInfoAddDto into RoleInfo, and then write to the database!
XXXAddDto: data model for when adding, corresponds to pasteform/page use
XXXUpdateDto: data model for data editing and modification, corresponding to pasteform/page use
XXXDto: here I usually use the data model when displaying details, that is, pasteform/ page use
XXXListDto: here is generally used in the data form display when the data model, that is, pasteform / the page to use
InputQueryXXX: This is generally used for the data model of the search item on top of the form, that is, the search area of the pasteform/ is used
How do I upload a picture?
Picture sub-new editing and display, display, here is the pasteform/ and pasteform/ page, in fact, in the editing time pasteform/ page is also displayed, as long as the corresponding field to add attributes [ColumnDataTypeAttribute("image", "1", "image", "60 *60")].
/// <summary>
/// Multi-image Returns multiple values, separated by ,.
/// </summary>
[ColumnDataType("image", "3", "img", "60*60")]
public string Img2 { get; set; }
/// <summary>
/// Images The use of the string[] pattern for passbacks.
/// </summary> /// Images.
[ColumnDataType("image", "3", "img", "60*60")]
public string[] Img3 { get; set; }
How to make data left leaning in a table
////<summary>
//// Textarea Simulates input in a textarea.
///</summary>
[ColumnDataType("class", "fleft")]
public string Desc { get; set; }
How to customize the display in a table
///<summary>
//// Single choice Generally indicates state, built-in, kind of like Enum, which will be supported in the future.
///</summary> /// General, state, built-in, sort of like Enum, which will be supported later.
[ColumnDataType("html", "<div>{{:=}}-{{:=}}</div>")]
public int DateType { get; set; }
How to display buttons on a form
/// <summary>
/// General Menu
/// </summary>
[ColumnDataType("menu", "Menu 1", "open_window('Access to user band references','./?path=userInfo&xxid={{:=}}');", "Hui-iconfont-menu")]
public string Menu2 { get; set; }
How to display conditional buttons in a form
There are times when we need to make a judgment based on the current row of data, whether or not to display a particular button, then there are
/// <summary>
/// General Conditions Menu
/// </summary>
[ColumnDataType("ifmenu", "==7", "<a href=\"javascript:;\" onclick=\"open_window(`111`,`./?path=userInfo&goid={{:=}}`)\">prerequisite1</a>", "")]
public string Menu3 { get; set; }
Too many buttons, how to use a button box
/// <summary>
/// Menu Box Menu
/// </summary>
[ColumnDataType("menu", "Menu 2", "open_window('Access to user band references','./?path=userInfo&xxid={{:=}}');", "Hui-iconfont-menu", "box")]
public string Menu5 { get; set; }
/// <summary>
/// Conditional menu in the menu box
/// </summary>
[ColumnDataType("ifmenu", "==8", "<a href=\"javascript:;\" onclick=\"open_window(`222`,`./?path=userInfo&goid={{:=}}`)\">prerequisite2</a>", "box")]
public string Menu4 { get; set; }
Check by sorting, some fields support ascending and descending order
The front-end is just based on this attribute, when checking down will return the orderby field to the back-end, the subsequent need to be based on the return of this field for orderby queries
///<summary>
///arrange in order
///</summary>
[ColumnDataType("orderby", "Sort","Sort desc")]
public int Sort { get; set; }
--- unfinished business, to be continued in the next issue ---