Item Number: BS-SC-012
Operating environment description
Development tools: IDEA / ECLLIPSE
Application server: TOMCAT8.5.31
Back-end development technology: SSM framework mainly
Front-end development technology: Jquery+ajax+BootStrap
The increasing level of living materials has also caused people to pay more and more attention to health elements, especially in terms of diet. People are paying more and more attention to food safety and prefer healthy organic green food. How can people find it more quickly and conveniently? Green healthy food? The development and application of Internet information technology gives us a better answer. We can meet people's needs by building an online shopping mall that analyzes healthy food, and realize that we can buy the green health we want online without leaving home. Food.
In the development technology of SSM health food retail website, JSP is selected to develop the system dynamic page, the system development tool uses IDEA, an excellent integrated development tool, the back-end development of the system uses the SSM framework, and the front-end development framework is selected. BootStrap is the main technology of front-end page layout, and the database of this system uses My SQL for data storage. This system currently mainly uses these technologies and tools to develop an online shopping mall trading website. The main system function implemented is to include the system front desk and the system backend. The front desk of the SSM health food retail website needs to realize that the user can log in and browse the products after registration. There are also functions for realizing online product information query, shopping cart adding function, order query function, user enters the personal center to publish the product function, online message function, and the query and management of already sold orders. The main functions of the back-end of the SSM health food retail website include user information management, product category management, product management, order management, etc., as well as website news management and other information management functions, realizing an online shopping website based on buyers and sellers.
The SSM health food retail website uses Internet mobile Internet application technology to realize the sharing of resources. With the help of various forms of product display forms on the network platform, online customers can more easily accept the transaction website of this online mall and break the past. The limitation of online purchase of goods shortens the difficulty and time for users to find goods, and has better interaction, so that the website can realize the informatization, standardization and systemization of goods.
6.1 Display of front-end user function modules
6.1.1 Front-end users browse the product module
After entering the mall, users at the front desk of the SSM health food retail website can view the corresponding product information of the mall without registering and logging in. The specific operation interface is shown in Figure 6-1 below.
Figure 6-1 Front-end user browsing product interface
6.1.2 Front-end user shopping cart module
The front desk user of the SSM health food retail website can add the products that need to be purchased to the shopping cart after entering the account password and logging in to the system. The add shopping cart operation interface is shown in Figure 6-2.
Figure 6-2 The front-end user adds shopping cart operation interface
6.1.3 The front-end user purchases the product module
After the front desk users log on to the SSM health food retail website, they can add their favorite products to the shopping cart and then submit an order and pay for the purchase. After completing the product purchase, you can rate the system's service, logistics speed, customer service attitude, etc., and make relevant comments on the product. The relevant management operation interface is shown in Figure 6-3.
Figure 6-3 Front-end user shopping operation interface
6.1.4 Front-end user personal order management module
SSM health food retail website front-end users can manage personal order information in the personal order management module after logging in to the system. The system will automatically display the current order status according to the processing status of the order. There are mainly several statuses such as unpaid, paid for delivery, received for evaluation, received and evaluated. The front-end user personal order management operation interface is shown in Figure 6-4.
Figure 6-4 Front-end user personal order management operation interface
6.1.5 Front-end user product evaluation management module
After logging in to the system, the front-end users of the SSM health food retail website can evaluate the information of the products they have received and express their feelings, so that more customers have a deeper understanding of their products and services. The front-end user personal order management operation interface is shown in Figure 6-5.
Figure 6-5 The front-end user order evaluation operation interface
The product after evaluation shows the evaluation information.
Figure 6-6 The front-end user order evaluation operation interface
6.1.6 Full-text search module for front-end users
The front-end users of the SSM health food retail website can query products through the full-text search function provided by the system without logging in to the system. It matches product information based on fuzzy query. Enter the product-related information you want to search in the input box at the top of the website to search. The operation interface of the front-end user full-text retrieval module is shown in Figure 6-7 below.
Figure 6-7 The front-end user order evaluation operation interface
6.1.7 Product recommendation function module for front-end users
The front-end user of the SSM health food retail website, after logging in to the system, the back-end of the system will recommend the corresponding product information to the user based on the user's browsing history and purchase history. The front-end user product recommendation interface is shown in Figure 6-8.
Figure 6-8 The front-end user product recommendation display interface
6.1.8 Front-end user announcement viewing module
Front-end users of the SSM health food retail website can view the announcement information released by the system on the front-end of the system. The front-end user product announcement query interface is shown in Figure 6-9.
Figure 6-9 Front-end user viewing system announcement interface
6.2 Display of background function modules
6.2.1 User login function
If the back-end user of the SSM health food retail website wants to manage the relevant information of the mall, he must first log in to the system before starting the relevant operation. The user login interface is shown in Figure 6-10.
Figure 6-10 User login operation interface
6.2.2 User management function
This module is mainly to manage the users of the system. After the SSM health food retail website administrator user logs in to the system, click on the user management menu on the left to enter the user information management interface. The user management interface is shown in Figure 6-11:
Figure 6-11 Interface diagram of back-end user management function
6.2.3 First-level classification management function
After logging in to the system, SSM health food retail website administrator users can enter the first-level menu to manage the corresponding menu information. The first-level menu operation interface is shown in Figure 6-12.
Figure 6-12 The UI interface of the first-level menu management function of the background commodity
6.2.4 Back-end product secondary classification management operation UI
After logging in to the system, SSM health food retail website administrator users can enter the secondary menu to manage the corresponding menu information. The operation interface of the secondary menu is shown in Figure 6-13.
Figure 6-13 UI interface of the background commodity secondary menu management function
6.2.5 Background product management operation UI
After SSM health food retail website administrator users log in to the system, they can enter the product management menu to manage corresponding product information. It mainly includes operations such as adding, modifying, querying, and deleting goods. When adding goods, you can upload pictures of goods for display. The operation interface of commodity information management is shown in Figure 6-14.
Figure 6-14 UI interface of background commodity management function
6.2.6 Background product order management operation UI
After SSM health food retail website administrator users log in to the system, they can enter the product order management menu to manage the corresponding product order information. It mainly includes product order query, order details view, order delivery, order comment response and response to ratings, etc. You can upload product pictures for display when adding products. The operation interface of commodity information management is shown in Figure 6-15 below.
Figure 6-15 UI interface of background commodity management function
6.2.7 Background product sales statistics management operation UI
After logging in to the system, the administrator of the SSM health food retail website can enter the sales statistics management menu to check the corresponding product sales statistics. It is mainly displayed in the form of graphical reports, mainly in the form of pie charts and column state charts. The displayed pictures can be downloaded or printed online. The commodity information statistics view interface is shown in Figure 6-16 and 6-17 below.
Figure 6-16 Pie chart showing the UI interface of the sales statistics function
Figure 6-17 The histogram shows the UI interface of the sales statistics function
6.2.8 Background system announcement management operation UI
After the SSM health food retail website administrator user logs in to the system, click on the announcement management menu on the left to manage the corresponding announcement information. Mainly carry out the operation of adding, modifying, deleting and viewing announcements. The announcement management interface is shown in Figure 6-18 below.
Figure 6-18 UI interface of system announcement management function
This project has complete functions, simple and generous interface, and good system interaction. It is more suitable for graduation design. This system is equipped with a complete opening report and thesis.