1 Introduction

The main technologies used in the project are: layui front-end UI framework, PHP language dynamic web page technology, Navicat database management client, and PhpStudy's PHP development integrated environment.

Realize a relatively complete simple news release and management system, including
login module and background management module,

The background management module implements:

1. News management: add news, view news;

2. News category management: add category, view category;

3. Administrator management: add administrators, view administrators;

4. The login module is implemented: login verification, identity verification;

2. Project overall system design function demonstration (video)

对于项目的展示和关键技术，我在b站上发了两个原创视频，不过声音有点小，需要带耳机。

function display

Key technology realization ideas

3. Realization of key technologies

Picture asynchronous upload function

1.1 Functional description and screenshots

Click the upload thumbnail to return the upload result information to the page after uploading.

1.2 Design steps and realization ideas

1. Place the associated ID button on the upload page of the front page, and get the upload information through js.

2. The layui framework uses the pre-set information to return res to the set upload interface processing such as elem, data, type, and the most important value url saves the interface information, such as upload.php in this example.

3. upload.php should also perform function processing for possible results of asynchronous messages in advance, upload error or success information, and return the code value as the judgment value returned by the interface.

4. Finally, the interface returns the result of the upload operation. The value of res and code is processed through the function defined by done:, and the result is processed to display the message message.

Infinitus classification function

2.1 Functional description and screenshots

Set the id and pid through the database to realize the classification of the child and the parent. For example, the volunteer association is the parent and the youth association is a subset.

2.2 Design steps and realization ideas

Through the idea of stack and queue, traverse the entire result set to find the same id and pid to form a child-parent relationship, and push it onto the stack. Then the information stored in the stack is taken out according to the queue first-in first-out idea to form a multi-level child-parent relationship. The idea is as follows:

$address = array(
    array('id'=>1  , 'address'=>'江西' , 'parent_id' => 0),
    array('id'=>2  , 'address'=>'江苏' , 'parent_id' => 0),
    array('id'=>3  , 'address'=>'赣州' , 'parent_id' => 1),
    array('id'=>4  , 'address'=>'安远县' , 'parent_id' => 3),
    array('id'=>5  , 'address'=>'欣山镇' , 'parent_id' => 4),
    array('id'=>6  , 'address'=>'南京' , 'parent_id' => 2),
    array('id'=>7  , 'address'=>'玄武区' , 'parent_id' => 6),
    array('id'=>8  , 'address'=>'梅园新村街道', 'parent_id' => 7),
    array('id'=>9  , 'address'=>'上海' , 'parent_id' => 0),
    array('id'=>10 , 'address'=>'黄浦区' , 'parent_id' => 9),
    array('id'=>11 , 'address'=>'外滩' , 'parent_id' => 10)
    array('id'=>12 , 'address'=>'安庆' , 'parent_id' => 1)
    );

Find the descendant node with id=0, put id=0 into the stack, find the node, which is
array('id'=>1,'address'=>'Jiangxi','parent_id' => 0)
At this time the stack is [ 0], and delete the node from the original data, and then put id=1 into the stack, look for the descendants of id=1, and find it as:
array('id'=>3,'address'=>'Ganzhou', 'parent_id' => 1),
at this time the stack [0][1], delete the node, id=3 into the stack, look for the descendants of id=3, and find:
array('id'=>4,'address '=>'Anyuan County','parent_id' => 3)
Stack [0][1][3], delete the node, put id=4 into the stack, look for descendant nodes with id=4, and find:
array( 'id'=>5,'address'=>'Xinshan Town','parent_id' => 4),
stack [0][1][3][4], delete the node, id=5 into the stack , Stack [0][1][3][4][5], and look for the child node with id=5. After traversal, no child node is found, so id=5 is popped from the stack, and the descendant nodes with id=4 are searched again, in turn get on. Finally complete the entire iteration.
The stack situation is as follows:

[0]
[0][1]
[0][1][3]
[0][1][3][4]
[0][1][3][4][5]
[0][1][3][4]
[0][1][3]
[0][1]
[0]

Editor functions

3.1 Function description and screenshots
Insert picture description here
Realize a multifunctional editor, which is saved in real time during the editing process

3.2 Design Steps and Implementation Ideas
Using ueditor rich text editor, an open source editor can realize a lightweight multifunctional editor,
download the project to the local and write html code, you can initially see the editor effect. The editor has custom parameter items. The content of the editor can be set and read through the getContent and setContent methods. The setContent sets the editor to obtain the content input by the user, then use getContent to obtain the user input and return, and finally pass the value to the database .

4. Problems

During the image upload operation, the upload interface is abnormal.
**Cause of error: **The upload folder was not created and placed in the correct location.
**Solution: **Check the error message by reviewing the element-network, and then use print $_SERVER['DOCUMENT_ROOT']; or on phpstudy, to view the server root directory and create an upload folder.

News Management System Based on LayUI