（附源码）node.js+mysql+基于JavaScript网上商城开发设计计算机毕设261620

╰半夏微凉° 2024-03-17 18:12 12阅读 0赞

## **Node.js网上商城的开发** ##

## **摘 要** ##

随着Internet的使用越来越广泛，在传统的商业模式中，对于日常各类商品，人们习惯于到各种商家店铺购买。然而在快节奏的新时代中，人们不一定能为购买各类商品腾出时间，更不会耐心挑选自己想要的商品。所以设计一个网上商城，既是迎合电子商务的大潮流，也是传统商品销售行业的一个突破口，可以给传统销售行业带来转变和机遇。

本系统主要是提供给用户一个购买各类商品的平台，通过价格优势吸引众多消费者来购买，实现正常运营。该系统采取面对对象的开发模式进行软件的开发和硬体的架设，能很好的满足实际使用的需求，完善了对应的软体架设以及程序编码的工作系统采取Mysql作为后台数据的主要存储单元，运用软件工程原理和开发方法，采用node.js的koa技术构建的一个管理系统，实现了本系统的全部功能。目标是实现一个以销售为中心的计算机系统，构建用户信息与账号，账号与订单信息有机结合的业务系统。

关键词：网上商城；网上购物；Node.js

## **Node. Development of JS online mall** ##

## **ABSTRACT** ##

With the more and more extensive use of the Internet, in the traditional business model, people are used to buying all kinds of daily goods from various stores. However, in the fast-paced new era, people may not be able to make time for buying all kinds of goods, let alone patiently choose the goods they want. Therefore, designing an online mall is not only to meet the general trend of e-commerce, but also a breakthrough in the traditional commodity sales industry, which can bring changes and opportunities to the traditional sales industry.

This system is mainly to provide users with a platform to buy all kinds of goods, attract many consumers to buy through price advantage, and realize normal operation. The system adopts the object-oriented development mode for software development and hardware erection, which can well meet the needs of practical use, and improve the corresponding software erection and program coding. The system adopts MySQL as the main storage unit of background data, applies the principles and development methods of software engineering, and adopts node JS koa technology to build a management system, to achieve all the functions of the system. The goal is to realize a sales centered computer system and build a business system with the organic combination of user information and account number, account number and order information.

**Key words****:**E-Shop; Online shopping; Node. js

目 录

摘 要

ABSTRACT

第1章 绪论

1.1研究背景

1.2研究意义

1.3系统目标

1.4本文的结构

第2章 关键技术介绍

2.1 koa框架

2.2 Vue.js主要功能

2.3 MVVM模式介绍

2.4 B/S体系工作原理

2.5 Mysql数据库

2.6 koa框架优点

2.7JavaScript 运行模式

第3章 系统分析

3.1可行性分析

3.1.1操作可行性

3.1.2技术可行性

3.1.3经济可行性

3.2功能需求分析

3.3用例分析

3.4数据流分析

3.5数据字典

第4章 系统设计

4.1结构设计

4.2功能设计

4.3数据库设计

4.3.1概念设计

4.3.2逻辑设计

4.3.3表设计

第5章 系统详细设计

5.1Node.jsEE连接数据库

5.2登录模块

5.3商城资讯模块

5.4商品评论模块

5.5购买商品模块

5.6系统用户管理模块

5.7商城管理模块

5.8商城资讯管理模块

5.9物流配送管理模块

第6章 系统测试

6.1测试目的

6.2测试用例

第7章 结论

参考文献

致 谢

1.  **绪论**

1.1研究背景

各种物品是人们日常的消费品，物品供应与消费者需求有着极为重要的关系。社会压力造成工作日渐繁忙，时间观念越来越强，简化事务、方便消费，使网络化销售逐渐成为消费社会化的需要。同时，由于人们生活消费质量的不断提高，各种物品消费需要由“数量型”向“质量型”转变，物品消费的消耗性、多样化也成为一种消费需求。

线上购物在当今发达国家已经显示出较强的发展势头，它在推动国家经济增长方面可以说又是一支崭新的力量。相比之下，在我国线上购物还是比较滞后，但是，经过近几年的发展，有越来越多的人认识到“网上订货、送货上门”的方便，也有越来越多的人也开始接受线上商城购物。CNNIC在其发布的《中国互联网络热点调查报告》中显示:在我国有17．9%的网民在半年内有过网络购物经历，在浏览过购物网站的网民中，有29．6%的人在半年内有过网络购物经历，有过网络购物经历的被访者中有超过90%的人今后会继续进行网络购物;有63.7%没有购物经历的网民表示今后会尝试网络购物。

虽然我国的互联网发展迅速,但是我国线上购物比例与发达国家相比相差甚远,网上购物人数发展潜力巨大，市场空间很大。

1.2研究意义

随着移动互联网时代繁盛的今天，国家也发布了“互联网+”战略，意在利用互联网改造各个传统行业，通过使用信息管理系统以及互联网平台，让互联网与传统行业进行深层次的融合发展，实现1+1>2的效果。互联网战略可谓是我国当前时代发展中众多战略的重中之重，搭载着互联网时代的顺风快车，连锁商场业务的数字信息化发展可谓是如鱼得水。中国计算机网络的发展已有数十年，基础网络早已在各大城市普及。可以说，无论在零售业、生活服务、信息服务等等的方方面面，互联网信息化起到了中流砥柱的作用。

中国近几年来互联网发展迅速，甚至领先全球多数发达国家，到达全球领先的地步。零移动互联网的出现更是迅速改造了传统行业，人们日常购买食品，服装，护肤品等都可以通过各式各样的线上商城进行购买。线上网上商城作为当今人们都市生活接触最多的产业，各大互联网公司平台渗透度高，因此本文研究的“网上商城”的发展应该顺应时代的需求，

1.3系统目标

对于典型的数据库系统，尤其是对于像网上商城这样的数据流量特别大的网络系统，必须要满足使用方便、操作灵活等要求。本系统在设计时应该满足以下几个目标

（1）采用人机对话的操作方式，界面美观、友好，信息查询灵活、方便，数据存储准确、安全可靠；

（2）全面展示所有商品，并可展示主要商品；

（3）便于顾客快捷地进行商品信息查询；

（4）用户可以随时修改自己的基本资料；

（5）实现下单的功能；

（6）顾客可以随时查看自己的订单信息；

（7）对客户输入的数据，系统进行严格的数据检验，尽可能排除人为的错误；

（8）系统最大限度地实现了易维护性和易操作性；

（9）系统运行稳定、安全可靠。

1.4本文的结构

本文具体内容包括：绪论、系统采用的关键技术、系统分析、系统设计、系统实现和系统测试。本文着重描述了系统的组成与结构，阐述了系统的设计方案、实现方法以及所采用的开发工具和相关技术，另外，重点剖析了部分环节的开发过程。本系统在一定的环境下对系统的重要模块进行了模拟测试，证实了系统的可用性、可靠性。

1.  **关键技术介绍**

### **2.1koa框架** ###

Node.js是一个异步的世界，官方API支持的都是callback形式的异步编程模型，这会带来许多问题，例如:1、callback嵌套问题；2、异步函数中可能同步调用callback返回数据，带来不一致性。为了解决以上问题Koa出现了。

koa是由Express原班人马打造的，致力于成为一个更小、更富有表现力、更健壮的Web框架。使用koa编写web应用，可以免除重复繁琐的回调函数嵌套，并极大地提升错误处理的效率。koa不在内核方法中绑定任何中间件，它仅仅提供了一个轻量优雅的函数库，使得编写Web应用变得得心应手。开发思路和express差不多，最大的特点就是可以避免异步嵌套。

阿里内部就在使用Koa框架，并在Koa基础上面做了一些扩展和封装。并且基于koa开发了一个开源框架egg。

2.2 Vue.js 主要功能：

Vue.js是一套构建用户界面的渐进式框架。与其他重量级框架不同的是，Vue采用自底向上增量开发的设计。Vue 的核心库只关注视图层，并且非常容易学习，非常容易与其它库或已有项目整合。另一方面，Vue 完全有能力驱动采用单文件组件和Vue生态系统支持的库开发的复杂单页应用。

Vue.js 的目标是通过尽可能简单的 API 实现响应的[数据绑定][Link 1]和组合的视图组件。

Vue.js 自身不是一个全能框架——它只聚焦于视图层。因此它非常容易学习，非常容易与其它库或已有项目整合。另一方面，在与相关工具和支持库一起使用时，Vue.js 也能驱动复杂的单页应用。

2.3 MVVM模式介绍：

MVVM是Model-View-ViewModel的简写。它本质上就是MVC 的改进版。MVVM 就是将其中的View 的状态和行为抽象化，让我们将视图 UI 和业务逻辑分开。当然这些事 ViewModel 已经帮我们做了，它可以取出 Model 的数据同时帮忙处理 View 中由于需要展示内容而涉及的业务逻辑。微软的WPF带来了新的技术体验，如Silverlight、[音频][Link 2]、[视频][Link 3]、[3D][]、[动画][Link 4]……，这导致了软件UI层更加细节化、可定制化。同时，在技术层面，WPF也带来了 诸如Binding、Dependency Property、Routed Events、Command、DataTemplate、ControlTemplate等新特性。MVVM（Model-View-ViewModel）框架的由来便是MVP（Model-View-Presenter）[模式][Link 5]与WPF结合的应用方式时发展演变过来的一种新型架构[框架][Link 6]。它立足于原有MVP框架并且把WPF的新特性糅合进去，以应对客户日益复杂的需求变化。

2.4 B/S体系工作原理：

B/S架构采取浏览器请求，服务器响应的工作模式。

用户可以通过浏览器去访问Internet上由Web服务器产生的文本、数据、图片、动画、视频点播和声音等信息；

而每一个Web服务器又可以通过各种方式与数据库服务器连接，大量的数据实际存放在数据库服务器中；

从[Web服务][Web]器上下载程序到本地来执行，在下载过程中若遇到与数据库有关的指令，由Web服务器交给数据库服务器来解释执行，并返回给Web服务器，Web服务器又返回给用户。在这种结构中，将许许多多的网连接到一块，形成一个巨大的网，即全球网。而各个企业可以在此结构的基础上建立自己的Internet。

在 B/S 模式中，用户是通过浏览器针对许多分布于网络上的服务器进行请求访问的，浏览器的请求通过服务器进行处理，并将处理结果以及相应的信息返回给浏览器，其他的数据加工、请求全部都是由Web Server完成的。通过该框架结构以及植入于操作系统内部的浏览器，该结构已经成为了当今软件应用的主流结构模式。

### **2.5 MySQL数据库** ###

Mysql的语言是非结构化的，用户可以在数据上进行工作。MySQL因为其速度、可靠性和适应性而备受关注。大多数人都认为在不需要[事务][Link 7]化处理的情况下，MySQL是管理内容最好的选择。并且因为Mysql的语言和结构比较简单，但是功能和存储信息量很强大，所以得到了普遍的应用。

Mysql数据库在编程过程中的作用是很广泛的，为用户进行数据查询带来了方便。Mysql数据库的应用因其灵活性强，功能强大，所以在实现某功能时只需要一小段代码，而不像其他程序需要编写大段代码。总体来说，Mysql数据库的语言相对要简洁很多。

数据流程分析主要就是数据存储的储藏室，它是在计算机上进行的，而不是现实中的储藏室。数据的存放是按固定格式，而不是无序的，其定义就是：长期有固定格式，可以共享的存储在计算机存储器上。数据库管理主要是数据存储、修改和增加以及数据表的建立。为了保证系统数据的正常运行，一些有能力的处理者可以进行管理而不需要专业的人来处理。数据表的建立，可以对数据表中的数据进行调整，数据的重新组合及重新构造，保证数据的安全性。介于数据库的功能强大等特点，本系统的开发主要应用了Mysql进行对数据的管理。

### **2.6 koa框架优点** ###

首先，借助promise和generator的能力，丢掉了callback，完美解决异步组合问题和异步异常捕获问题。

其次，koa 把express中内置的router、view 等功能都移除了，使得框架本身更轻量化。该设计有如下好处：1、把express各种中间件移植到koa是很简单的一件事；2、express 中内置的功能件未必好，比如view，想添加自己的view engine进入得做较深层次的hack，又比如router，它的效率不是最好的。koa没有内置这些，给了开发者很大的自由度，开发者都能自由发挥制作出更精细更专业的中间件。

### **2.7 JavaScript 运行模式** ###

JavaScript是一种属于网络的高级脚本语言,已经被广泛用于Web应用开发,常用来为网页添加各式各样的动态功能,为用户提供更流畅美观的浏览效果。通常JavaScript脚本是通过嵌入在HTML中来实现自身的功能的。

1.1是一种解释性脚本语言（代码不进行[预编译][Link 8]）。

1.2主要用来向[HTML][]（[标准通用标记语言][Link 9]下的一个应用）页面添加交互行为。

1.3可以直接嵌入HTML页面，但写成单独的[js][]文件有利于结构和行为的[分离][Link 10]。

1.4跨平台特性，在绝大多数浏览器的支持下，可以在多种平台下运行（如[Windows][]、[Linux][]、[Mac][]、[Android][]、[iOS][]等）。

1.5 JavaScript脚本语言同其他语言一样，有它自身的基本数据类型，表达式和[算术运算符][Link 11]及程序的基本程序框架。JavaScript提供了四种基本的数据类型和两种特殊数据类型用来处理数据和文字。而变量提供存放信息的地方，表达式则可以完成较复杂的信息处理。

。

1.  **系统分析**

3.1可行性分析

本系统操作简单，易理解。网上商城与大部分电子商务系统的操作流程类似，避免了用户学习使用系统的时间和负担。

#### 3.1.1操作可行性 ####

本系统使用的是现流行的开发语言，即Node.js技术。同时所有的信息都是以网页的形式展示，系统中的信息都可以在后台操作数据库达到数据更新的效果。用户只需要会计算机的基本操作或者会上网就可以使用本系统，系统管理员只需要懂得文件上传，处理文本即可操作管理后台。系统布局较简单，功能操作不复杂，完全符合现代市场需求。因此本系统具有操作可行性。

#### 3.1.2技术可行性 ####

本系统在Windows7开发环境下，利用Myeclipse10开发工具，并使用Mysql作为数据库管理系统来实现系统的各种功能。Mysql属于主从式的数据库服务器这也是主从式数据库服务器的特点，服务器本身重在数据的管理，为用户端应用程序提供一致的接口。可以提高系统的性能，降低它的局限性。

#### 3.1.3经济可行性 ####

本系统是一个在线的网上商城，顾客可以直接在商城上购买商品，同时计算机的价格十分低廉，性能却有了长足的进步。而此系统的开发可以有效的提高工作效率，降低管理成本，节省管理费用，为企业的工作效率带来了一个质的飞跃。因此，本系统在经济上是完全具有可行性的。

3.2功能需求分析

通过本系统，商户节省了用于交易场所、服务质量、维护商铺杂支开销等方面的投入，从而降低了价格；买家方面，不仅节约了时间成本，同时降低了购买成本，可以“货比三家”地随意挑选性价比高的产品。加快了交易和货币流通速度，而进而推动经济的增长。

根据条件需要，系统结构主要由二大用户组成。一是用户，二是管理员用户。

1用户登录及身份要求

验证买家、管理员等用户的信息

2本系统销售功能需求（面向买家用户）

允许用户可以在线对商品进行问题投诉。

允许用户评论商品。

允许用户查询商品的信息。

允许用户对购买订单的管理。

自动生成订单。

用户在线支付订单费用。

选择商品，进行购买，填写发货地址、联系电话等信息。

3本系统管理功能需求（面向管理员用户）

对用户的订单的管理（删除，修改，查询）。

对商城中心的管理（删除，修改，查询）。

对商城列表的管理（删除，修改，查询）。

对物流信息的管理（添加、删除、修改商品类别）。

3.3用例分析

1.管理员主要负责系统管理、商城管理、商品订单管理、用户信息管理、物流配送管理、账务信息管理，下图所示描述管理员的用例。

![d8d1cf9128744f1a9965dfbfd8015b32.png][]

图3-1管理员用例图

2.用户主要使用系统的在线购买业务，下图所示为用户用例图。

![7a0c79b7d6444ef6b282b82199e35e0a.png][]

图3-2用户用例图

3.4数据流分析

数据流图的设计主要是由于系统目前功能还没有确定，可以先描述可能要使用到的功能内容，并且向用户了解“系统从外界接受什么数据”和“系统向外界送出什么数据”等信息，根据用户所给的答复进行设计数据流图。

如下为系统的0层数据流图，系统用户分为管理员和普通用户。

![86da7cc1cb054956917acbb0c2a938bc.png][]

图3-4系统数据流图（0层）

如下图所示为系统1层数据流图。

![37d4ece15b0b4d1284a2a27801438bc1.png][]

图3-5系统数据流图（1层）

网上商城第二层数据流图主要详细反应各功能模块对应的操作与数据进行交互的原理。并且更详细的显示出各角色对功能模块操作的数据流向，让开发人员能了解该系统的开发方向，能够更准确的开发出系统模型。

将商品信息维护进行细化得到商品信息管理二层数据流程图，如下图所示。

![b8a23f0991cc424e9d5fc338d98a1ee3.png][]

图3-6商品管理数据流图（2层）

将订单信息管理进行细化得到订单信息管理二层数据流程图，如下图所示。

![0729c80f4d754342bf29b8b9c8cc12aa.png][]

图3-7订单管理数据流图（2层）

3.5数据字典

1.数据存储描述

下表描述了用户信息的数据流、数据来源、数据去向和数据流组成的词条。

表3-1用户信息描述

<table> 
 <tbody> 
 <tr> 
 <td style="vertical-align:top;width:140.35pt;"> 数据流 </td> 
 <td style="vertical-align:top;width:287.45pt;"> 用户信息 </td> 
 </tr> 
 <tr> 
 <td style="vertical-align:top;width:140.35pt;"> 数据流来源 </td> 
 <td style="vertical-align:top;width:287.45pt;"> Mysql数据库中用户信息表，用户详细信息表 </td> 
 </tr> 
 <tr> 
 <td style="vertical-align:top;width:140.35pt;"> 数据去向 </td> 
 <td style="vertical-align:top;width:287.45pt;"> 系统界面，用户信息管理界面 </td> 
 </tr> 
 <tr> 
 <td style="vertical-align:top;width:140.35pt;"> 数据流组成 </td> 
 <td style="vertical-align:top;width:287.45pt;"> 用户名、用户密码、添加时间、编号 </td> 
 </tr> 
 </tbody> 
</table>

下表描述了订单信息的数据流、数据来源、数据去向和数据流组成的词条。

表3-2订单信息描述

<table> 
 <tbody> 
 <tr> 
 <td style="vertical-align:top;width:139.85pt;"> 数据流 </td> 
 <td style="vertical-align:top;width:287.45pt;"> 订单信息 </td> 
 </tr> 
 <tr> 
 <td style="vertical-align:top;width:139.85pt;"> 数据流来源 </td> 
 <td style="vertical-align:top;width:287.45pt;"> Mysql数据库中订单表，订单详情表 </td> 
 </tr> 
 <tr> 
 <td style="vertical-align:top;width:139.85pt;"> 数据去向 </td> 
 <td style="vertical-align:top;width:287.45pt;"> 用户订单界面，订单管理界面 </td> 
 </tr> 
 <tr> 
 <td style="vertical-align:top;width:139.85pt;"> 数据流组成 </td> 
 <td style="vertical-align:top;width:287.45pt;"> 用户ID、订单ID、商品ID、下单时间、订单金额 </td> 
 </tr> 
 </tbody> 
</table>

下表描述了商品管理的数据流、数据来源、数据去向和数据流组成的词条。

表3-3商品信息描述

<table> 
 <tbody> 
 <tr> 
 <td style="vertical-align:top;width:140.25pt;"> 数据流 </td> 
 <td style="vertical-align:top;width:287.45pt;"> 商品信息 </td> 
 </tr> 
 <tr> 
 <td style="vertical-align:top;width:140.25pt;"> 数据流来源 </td> 
 <td style="vertical-align:top;width:287.45pt;"> Mysql数据库中商品表、商品类别表 </td> 
 </tr> 
 <tr> 
 <td style="vertical-align:top;width:140.25pt;"> 数据去向 </td> 
 <td style="vertical-align:top;width:287.45pt;"> 商品查询界面、商品详情界面、购买订单界面、商品管理界面 </td> 
 </tr> 
 <tr> 
 <td style="vertical-align:top;width:140.25pt;"> 数据流组成 </td> 
 <td style="vertical-align:top;width:287.45pt;"> 商品名、商品价格、库存数量、商品类别 </td> 
 </tr> 
 </tbody> 
</table>

2.数据处理描述

下表描述用户通过输入用户名和密码进行身份验证处理，验证成功后将返回的信息显示在界面上。

表3-4用户身份验证

<table> 
 <tbody> 
 <tr> 
 <td style="vertical-align:top;width:140.5pt;"> 处理逻辑名称 </td> 
 <td style="vertical-align:top;width:287.45pt;"> 用户身份验证 </td> 
 </tr> 
 <tr> 
 <td style="vertical-align:top;width:140.5pt;"> 简述 </td> 
 <td style="vertical-align:top;width:287.45pt;"> 检查输入信息的合法性 </td> 
 </tr> 
 <tr> 
 <td style="vertical-align:top;width:140.5pt;"> 输入的数据流 </td> 
 <td style="vertical-align:top;width:287.45pt;"> 用户名+密码 </td> 
 </tr> 
 <tr> 
 <td style="vertical-align:top;width:140.5pt;"> 处理过程 </td> 
 <td style="vertical-align:top;width:287.45pt;"> 根据输入的用户名和密码，检索用户，显示查询信息 </td> 
 </tr> 
 <tr> 
 <td style="vertical-align:top;width:140.5pt;"> 输出的数据流 </td> 
 <td style="vertical-align:top;width:287.45pt;"> 用户信息、商品信息 </td> 
 </tr> 
 </tbody> 
</table>

下表描述用户成功登录系统后通过商品名查询商品信息，根据查询后返回的数据显示在界面上。

表3-5商品信息查询

<table> 
 <tbody> 
 <tr> 
 <td style="vertical-align:top;width:116.5pt;"> 处理逻辑名称 </td> 
 <td style="vertical-align:top;width:308.95pt;"> 商品信息查询 </td> 
 </tr> 
 <tr> 
 <td style="vertical-align:top;width:116.5pt;"> 简述 </td> 
 <td style="vertical-align:top;width:308.95pt;"> 检查输入信息的合法性 </td> 
 </tr> 
 <tr> 
 <td style="vertical-align:top;width:116.5pt;"> 输入的数据流 </td> 
 <td style="vertical-align:top;width:308.95pt;"> 商品名或商品编号或商品类别 </td> 
 </tr> 
 <tr> 
 <td style="vertical-align:top;width:116.5pt;"> 处理过程 </td> 
 <td style="vertical-align:top;width:308.95pt;"> 登录成功的用户，通过商品名查询用户所需的商品，还可查询用户的订单及评论。 </td> 
 </tr> 
 <tr> 
 <td style="vertical-align:top;width:116.5pt;"> 输出的数据流 </td> 
 <td style="vertical-align:top;width:308.95pt;"> 用户订单信息，购买订单信息 </td> 
 </tr> 
 </tbody> 
</table>

下表描述管理员用户成功登录系统后可以对物流配送进行管理，。

表3-6物流配送

<table> 
 <tbody> 
 <tr> 
 <td style="vertical-align:top;width:116.5pt;"> 处理逻辑名称 </td> 
 <td style="vertical-align:top;width:308.95pt;"> 物流配送 </td> 
 </tr> 
 <tr> 
 <td style="vertical-align:top;width:116.5pt;"> 简述 </td> 
 <td style="vertical-align:top;width:308.95pt;"> 检查输入信息的合法性 </td> 
 </tr> 
 <tr> 
 <td style="vertical-align:top;width:116.5pt;"> 输入的数据流 </td> 
 <td style="vertical-align:top;width:308.95pt;"> 物流配送 </td> 
 </tr> 
 <tr> 
 <td style="vertical-align:top;width:116.5pt;"> 处理过程 </td> 
 <td style="vertical-align:top;width:308.95pt;"> 登录成功的管理员用户，往数据库添加一条物流配送数据。 </td> 
 </tr> 
 <tr> 
 <td style="vertical-align:top;width:116.5pt;"> 输出的数据流 </td> 
 <td style="vertical-align:top;width:308.95pt;"> 物流信息，物流状态 </td> 
 </tr> 
 </tbody> 
</table>

下表描述管理员用户成功登录系统后，购买商品，填写订单收货人、收货地址、联系电话等，生成购买订单后，重新查询订单表，返回的订单数据显示在界面上。

表3-7订单生成

<table> 
 <tbody> 
 <tr> 
 <td style="vertical-align:top;width:116.5pt;"> 处理逻辑名称 </td> 
 <td style="vertical-align:top;width:308.95pt;"> 订单生成 </td> 
 </tr> 
 <tr> 
 <td style="vertical-align:top;width:116.5pt;"> 简述 </td> 
 <td style="vertical-align:top;width:308.95pt;"> 检查输入信息的合法性 </td> 
 </tr> 
 <tr> 
 <td style="vertical-align:top;width:116.5pt;"> 输入的数据流 </td> 
 <td style="vertical-align:top;width:308.95pt;"> 订单信息 </td> 
 </tr> 
 <tr> 
 <td style="vertical-align:top;width:116.5pt;"> 处理过程 </td> 
 <td style="vertical-align:top;width:308.95pt;"> 登录成功的用户，往数据库添加一条订单信息数据。 </td> 
 </tr> 
 <tr> 
 <td style="vertical-align:top;width:116.5pt;"> 输出的数据流 </td> 
 <td style="vertical-align:top;width:308.95pt;"> 订单信息 </td> 
 </tr> 
 </tbody> 
</table>

1.  **系统设计**

4.1结构设计

本系统的设计是基于Node.js技术+Mysql数据库+Tomcat服务器的方式设计，以Myeclipse10为开发工具，并运用Photoshop CS6技术美化网页，辅之以CSS技术。本系统使用的角色主要有系统管理员和普通用户，系统分为前台和后台，前台主要用于商品的展示和购买，后台用于商城信息和订单信息的管理，首先以普通用户通过账号注册后登录系统前台，可以进行各种商品的信息浏览和搜索，用户可以将需要的商品进行下单购买，用户可以查询订单是否已经被管理员确认，订单生成后表示用户购买成功，前台系统除了可以进行商品的下单还可以对商品进行收藏，进行商品投诉，用户同时可以修改个人的信息资料，查看订单物流配送；以管理员的身份登录系统后台可以进行商品维护、订单维护、物流配送管理等。

系统功能结构图如下所示。

![db65c588933f49318f452c937e6d6708.png][]

图4-1系统功能结构图

4.2功能设计

1.用户登录模块:确保用户注册信息的真实度是提高系统效率和盈利的重要因素。真实的用户才能带来价值，注册是保证真实用户使用系统主要业务的第一步，通过对用户注册信息的审核，可防止机器注册。使用现如今较为流行的管理员进行账号激活的验证方式，对用户注册信息进行过滤，未激活用户信息将不能使用系统主要功能。

如下图所示为用户登录流程图。

![a4b0739ff7d14fab8ed1f60df8b2e690.png][]

图4-2用户登录流程图

2.商品浏览模块:没有登录的用户和登录的用户都可以在系统前台进行商品浏览，用户可以查看商品的详细信息和选择相应的商品类别进行该类别下的商品查看，用户还可以通过商品名称的关键字进行搜索。

如下图所示为商品浏览流程图。

![a2f0781ef5da4ebfaa40ff6ffc9e79d3.png][]

图4-3商品浏览流程图

3.订单管理模块:用户购买商品后，填写收货地址、收货人、电话等信息，生成订单信息，管理员可以审核订单，删除、修改订单，对订单信息进行相应的商品发货。

如下图所示为订单管理流程图。

![94b720c9a38440b08dc598f7d13c53bf.png][]

图4-4订单管理流程图

4.商品管理模块

系统管理员可以对商品信息进行增、删、改、查的操作。

5.用户管理模块

系统管理员可以对用户信息进行增、删、改、查的操作。

6.订单模块

用户对个人添加至购买订单里面的商品进行增删改查等操作。

4.3数据库设计

#### 4.3.1概念设计 ####

本系统的E-R图表现了系统中各个实体之间的联系，经过分析，系统的实体有商品、商城、订单、物流配送、用户等。

商品订单的实体图如下图所示。

![aee122cb6bfc4de3b4d13d68ec7c8576.png][]

图4-6商品订单实体图

商品类别实体图如下图所示。

![67a6c3873b3f4cbf8db90e13521ba789.png][]

图4-7商品类别信息实体图

用户信息实体图如下图所示。

![5d40486c84a247f3995555396f9205a9.png][]

图4-8用户信息实体图

物流配送的实体图如下图所示。

![169c754183ca4559b57b45493502e601.png][]

图4-9物流配送实体图

系统总体的实体图如下图所示。

![030e941e62bf4434bf4d7852601837d6.png][]

图4-10系统E-R图

#### 4.3.2逻辑设计 ####

Allusers表是系统用户的信息表，存储系统用户真实姓名、性别、年龄、电话、地址、备注、编号、姓名、用户密码以及其相对应的密码等相关信息。

Dingdan表是订单信息表，存储用户的订单的相关信息，其中包括编号、订单号、金额、订单内容、用户名、姓名、手机号码、添加时间、是否审核等相关信息。

yonghuzhuce表是用户注册信息表，存储用户的注册信息，其中包括编号、用户名、密码、姓名、性别、出生年月、QQ、邮箱、电话、头像、等相关信息。

shangpinxinxi表是商品信息表，存储商品内容的信息，其中包括编号、商品编号、商品名称、类别、价格、发布人、图片、简介、添加时间等相关信息。

wuliuxinxi表是物流配送表，存储用户订单的物流配送信息，其中包括物流号、物品名称、发货地址、物流状态、收货地址、收货用户、物流状态、用户签收等相关信息。

#### 4.3.3表设计 ####

数据库表设计：经过前期的需求分析、可执行分析、数据流分析等各个流程分析，结合软件工程的高内聚、低耦合规则，并考虑到以后的程序功能扩展，设计如下几张表。

<table style="margin-left:4.8pt;width:433.35pt;"> 
 <tbody> 
 <tr> 
 <td style="background-color:#aeaaaa;width:87.8pt;"> 名称 </td> 
 <td style="background-color:#aeaaaa;width:60.3pt;"> 类型 </td> 
 <td style="background-color:#aeaaaa;width:48.6pt;"> 长度 </td> 
 <td style="background-color:#aeaaaa;width:40.8pt;"> 不是null </td> 
 <td style="background-color:#aeaaaa;width:43.8pt;"> 主键 </td> 
 <td style="background-color:#aeaaaa;width:152.05pt;"> 注释 </td> 
 </tr> 
 <tr> 
 <td> member_user_id </td> 
 <td> int </td> 
 <td> 11 </td> 
 <td> 是 </td> 
 <td> 是 </td> 
 <td style="width:152.05pt;"> 会员用户ID </td> 
 </tr> 
 <tr> 
 <td> member_name </td> 
 <td> varchar </td> 
 <td> 64 </td> 
 <td> 否 </td> 
 <td> 否 </td> 
 <td style="width:152.05pt;"> 会员姓名 </td> 
 </tr> 
 <tr> 
 <td> member_gender </td> 
 <td> varchar </td> 
 <td> 64 </td> 
 <td> 否 </td> 
 <td> 否 </td> 
 <td style="width:152.05pt;"> 会员性别 </td> 
 </tr> 
 <tr> 
 <td> member_number </td> 
 <td> varchar </td> 
 <td> 64 </td> 
 <td> 是 </td> 
 <td> 否 </td> 
 <td style="width:152.05pt;"> 会员编号 </td> 
 </tr> 
 <tr> 
 <td> examine_state </td> 
 <td> varchar </td> 
 <td> 16 </td> 
 <td> 是 </td> 
 <td> 否 </td> 
 <td style="width:152.05pt;"> 审核状态 </td> 
 </tr> 
 <tr> 
 <td> recommend </td> 
 <td> int </td> 
 <td> 11 </td> 
 <td> 是 </td> 
 <td> 否 </td> 
 <td style="width:152.05pt;"> 智能推荐 </td> 
 </tr> 
 <tr> 
 <td> user_id </td> 
 <td> int </td> 
 <td> 11 </td> 
 <td> 是 </td> 
 <td> 否 </td> 
 <td style="width:152.05pt;"> 用户ID </td> 
 </tr> 
 <tr> 
 <td> create_time </td> 
 <td> datetime </td> 
 <td> 0 </td> 
 <td> 是 </td> 
 <td> 否 </td> 
 <td style="width:152.05pt;"> 创建时间 </td> 
 </tr> 
 <tr> 
 <td> update_time </td> 
 <td> timestamp </td> 
 <td> 0 </td> 
 <td> 是 </td> 
 <td> 否 </td> 
 <td style="width:152.05pt;"> 更新时间 </td> 
 </tr> 
 </tbody> 
</table>

##  ##

<table style="margin-left:4.8pt;width:432.95pt;"> 
 <tbody> 
 <tr> 
 <td style="background-color:#aeaaaa;width:98.8pt;"> 名称 </td> 
 <td style="background-color:#aeaaaa;width:60.3pt;"> 类型 </td> 
 <td style="background-color:#aeaaaa;width:48.6pt;"> 长度 </td> 
 <td style="background-color:#aeaaaa;width:40.8pt;"> 不是null </td> 
 <td style="background-color:#aeaaaa;width:43.8pt;"> 主键 </td> 
 <td style="background-color:#aeaaaa;width:140.65pt;"> 注释 </td> 
 </tr> 
 <tr> 
 <td> shopping_mall_id </td> 
 <td> int </td> 
 <td> 11 </td> 
 <td> 是 </td> 
 <td> 是 </td> 
 <td style="width:140.65pt;"> 商城ID </td> 
 </tr> 
 <tr> 
 <td> remarks </td> 
 <td> varchar </td> 
 <td> 64 </td> 
 <td> 否 </td> 
 <td> 否 </td> 
 <td style="width:140.65pt;"> 备注 </td> 
 </tr> 
 <tr> 
 <td> hits </td> 
 <td> int </td> 
 <td> 11 </td> 
 <td> 是 </td> 
 <td> 否 </td> 
 <td style="width:140.65pt;"> 点击数 </td> 
 </tr> 
 <tr> 
 <td> recommend </td> 
 <td> int </td> 
 <td> 11 </td> 
 <td> 是 </td> 
 <td> 否 </td> 
 <td style="width:140.65pt;"> 智能推荐 </td> 
 </tr> 
 <tr> 
 <td> cart_title </td> 
 <td> varchar </td> 
 <td> 125 </td> 
 <td> 否 </td> 
 <td> 否 </td> 
 <td style="width:140.65pt;"> 标题 </td> 
 </tr> 
 <tr> 
 <td> cart_img </td> 
 <td> text </td> 
 <td> 0 </td> 
 <td> 否 </td> 
 <td> 否 </td> 
 <td style="width:140.65pt;"> 封面图 </td> 
 </tr> 
 <tr> 
 <td> cart_description </td> 
 <td> varchar </td> 
 <td> 255 </td> 
 <td> 否 </td> 
 <td> 否 </td> 
 <td style="width:140.65pt;"> 描述 </td> 
 </tr> 
 <tr> 
 <td> cart_price_ago </td> 
 <td> double </td> 
 <td> 8 </td> 
 <td> 是 </td> 
 <td> 否 </td> 
 <td style="width:140.65pt;"> 原价 </td> 
 </tr> 
 <tr> 
 <td> cart_price </td> 
 <td> double </td> 
 <td> 8 </td> 
 <td> 是 </td> 
 <td> 否 </td> 
 <td style="width:140.65pt;"> 卖价 </td> 
 </tr> 
 <tr> 
 <td> cart_inventory </td> 
 <td> int </td> 
 <td> 11 </td> 
 <td> 是 </td> 
 <td> 否 </td> 
 <td style="width:140.65pt;"> 商品库存 </td> 
 </tr> 
 <tr> 
 <td> cart_type </td> 
 <td> varchar </td> 
 <td> 64 </td> 
 <td> 是 </td> 
 <td> 否 </td> 
 <td style="width:140.65pt;"> 商品分类： </td> 
 </tr> 
 <tr> 
 <td> cart_content </td> 
 <td> longtext </td> 
 <td> 0 </td> 
 <td> 否 </td> 
 <td> 否 </td> 
 <td style="width:140.65pt;"> 正文 </td> 
 </tr> 
 <tr> 
 <td> cart_img_1 </td> 
 <td> text </td> 
 <td> 0 </td> 
 <td> 否 </td> 
 <td> 否 </td> 
 <td style="width:140.65pt;"> 主图1： </td> 
 </tr> 
 <tr> 
 <td> cart_img_2 </td> 
 <td> text </td> 
 <td> 0 </td> 
 <td> 否 </td> 
 <td> 否 </td> 
 <td style="width:140.65pt;"> 主图2： </td> 
 </tr> 
 <tr> 
 <td> cart_img_3 </td> 
 <td> text </td> 
 <td> 0 </td> 
 <td> 否 </td> 
 <td> 否 </td> 
 <td style="width:140.65pt;"> 主图3： </td> 
 </tr> 
 <tr> 
 <td> cart_img_4 </td> 
 <td> text </td> 
 <td> 0 </td> 
 <td> 否 </td> 
 <td> 否 </td> 
 <td style="width:140.65pt;"> 主图4： </td> 
 </tr> 
 <tr> 
 <td> cart_img_5 </td> 
 <td> text </td> 
 <td> 0 </td> 
 <td> 否 </td> 
 <td> 否 </td> 
 <td style="width:140.65pt;"> 主图5： </td> 
 </tr> 
 <tr> 
 <td> create_time </td> 
 <td> datetime </td> 
 <td> 0 </td> 
 <td> 是 </td> 
 <td> 否 </td> 
 <td style="width:140.65pt;"> 创建时间 </td> 
 </tr> 
 <tr> 
 <td> update_time </td> 
 <td> timestamp </td> 
 <td> 0 </td> 
 <td> 是 </td> 
 <td> 否 </td> 
 <td style="width:140.65pt;"> 更新时间 </td> 
 </tr> 
 </tbody> 
</table>

<table style="margin-left:4.8pt;width:431pt;"> 
 <tbody> 
 <tr> 
 <td style="background-color:#aeaaaa;width:93.3pt;"> 名称 </td> 
 <td style="background-color:#aeaaaa;width:60.3pt;"> 类型 </td> 
 <td style="background-color:#aeaaaa;width:48.6pt;"> 长度 </td> 
 <td style="background-color:#aeaaaa;width:40.8pt;"> 不是null </td> 
 <td style="background-color:#aeaaaa;width:43.8pt;"> 主键 </td> 
 <td style="background-color:#aeaaaa;width:144.2pt;"> 注释 </td> 
 </tr> 
 <tr> 
 <td> order_id </td> 
 <td> int </td> 
 <td> 11 </td> 
 <td> 是 </td> 
 <td> 是 </td> 
 <td style="width:144.2pt;"> 订单ID： </td> 
 </tr> 
 <tr> 
 <td> order_number </td> 
 <td> varchar </td> 
 <td> 64 </td> 
 <td> 否 </td> 
 <td> 否 </td> 
 <td style="width:144.2pt;"> 订单号： </td> 
 </tr> 
 <tr> 
 <td> goods_id </td> 
 <td> mediumint </td> 
 <td> 8 </td> 
 <td> 是 </td> 
 <td> 否 </td> 
 <td style="width:144.2pt;"> 商品id </td> 
 </tr> 
 <tr> 
 <td> title </td> 
 <td> varchar </td> 
 <td> 32 </td> 
 <td> 否 </td> 
 <td> 否 </td> 
 <td style="width:144.2pt;"> 商品标题： </td> 
 </tr> 
 <tr> 
 <td> img </td> 
 <td> varchar </td> 
 <td> 255 </td> 
 <td> 否 </td> 
 <td> 否 </td> 
 <td style="width:144.2pt;"> 商品图片： </td> 
 </tr> 
 <tr> 
 <td> price </td> 
 <td> double </td> 
 <td> 10 </td> 
 <td> 是 </td> 
 <td> 否 </td> 
 <td style="width:144.2pt;"> 价格： </td> 
 </tr> 
 <tr> 
 <td> price_ago </td> 
 <td> double </td> 
 <td> 10 </td> 
 <td> 是 </td> 
 <td> 否 </td> 
 <td style="width:144.2pt;"> 原价： </td> 
 </tr> 
 <tr> 
 <td> num </td> 
 <td> int </td> 
 <td> 8 </td> 
 <td> 是 </td> 
 <td> 否 </td> 
 <td style="width:144.2pt;"> 数量： </td> 
 </tr> 
 <tr> 
 <td> price_count </td> 
 <td> double </td> 
 <td> 8 </td> 
 <td> 是 </td> 
 <td> 否 </td> 
 <td style="width:144.2pt;"> 总价： </td> 
 </tr> 
 <tr> 
 <td> norms </td> 
 <td> varchar </td> 
 <td> 255 </td> 
 <td> 否 </td> 
 <td> 否 </td> 
 <td style="width:144.2pt;"> 规格： </td> 
 </tr> 
 <tr> 
 <td> type </td> 
 <td> varchar </td> 
 <td> 64 </td> 
 <td> 是 </td> 
 <td> 否 </td> 
 <td style="width:144.2pt;"> 商品分类： </td> 
 </tr> 
 <tr> 
 <td> contact_name </td> 
 <td> varchar </td> 
 <td> 32 </td> 
 <td> 否 </td> 
 <td> 否 </td> 
 <td style="width:144.2pt;"> 联系人姓名： </td> 
 </tr> 
 <tr> 
 <td> contact_email </td> 
 <td> varchar </td> 
 <td> 125 </td> 
 <td> 否 </td> 
 <td> 否 </td> 
 <td style="width:144.2pt;"> 联系人邮箱： </td> 
 </tr> 
 <tr> 
 <td> contact_phone </td> 
 <td> varchar </td> 
 <td> 11 </td> 
 <td> 否 </td> 
 <td> 否 </td> 
 <td style="width:144.2pt;"> 联系人手机： </td> 
 </tr> 
 <tr> 
 <td> contact_address </td> 
 <td> varchar </td> 
 <td> 255 </td> 
 <td> 否 </td> 
 <td> 否 </td> 
 <td style="width:144.2pt;"> 收件地址： </td> 
 </tr> 
 <tr> 
 <td> postal_code </td> 
 <td> varchar </td> 
 <td> 9 </td> 
 <td> 否 </td> 
 <td> 否 </td> 
 <td style="width:144.2pt;"> 邮政编码： </td> 
 </tr> 
 <tr> 
 <td> user_id </td> 
 <td> int </td> 
 <td> 10 </td> 
 <td> 是 </td> 
 <td> 否 </td> 
 <td style="width:144.2pt;"> 买家ID： </td> 
 </tr> 
 <tr> 
 <td> merchant_id </td> 
 <td> mediumint </td> 
 <td> 8 </td> 
 <td> 是 </td> 
 <td> 否 </td> 
 <td style="width:144.2pt;"> 商家ID： </td> 
 </tr> 
 <tr> 
 <td> create_time </td> 
 <td> timestamp </td> 
 <td> 0 </td> 
 <td> 是 </td> 
 <td> 否 </td> 
 <td style="width:144.2pt;"> 创建时间： </td> 
 </tr> 
 <tr> 
 <td> update_time </td> 
 <td> timestamp </td> 
 <td> 0 </td> 
 <td> 是 </td> 
 <td> 否 </td> 
 <td style="width:144.2pt;"> 更新时间： </td> 
 </tr> 
 <tr> 
 <td> description </td> 
 <td> varchar </td> 
 <td> 255 </td> 
 <td> 否 </td> 
 <td> 否 </td> 
 <td style="width:144.2pt;"> 描述 </td> 
 </tr> 
 <tr> 
 <td> state </td> 
 <td> varchar </td> 
 <td> 16 </td> 
 <td> 是 </td> 
 <td> 否 </td> 
 <td style="width:144.2pt;"> 订单状态 </td> 
 </tr> 
 </tbody> 
</table>

<table style="margin-left:4.8pt;width:431.8pt;"> 
 <tbody> 
 <tr> 
 <td style="background-color:#aeaaaa;width:148.3pt;"> 名称 </td> 
 <td style="background-color:#aeaaaa;width:60.3pt;"> 类型 </td> 
 <td style="background-color:#aeaaaa;width:48.6pt;"> 长度 </td> 
 <td style="background-color:#aeaaaa;width:40.8pt;"> 不是null </td> 
 <td style="background-color:#aeaaaa;width:43.8pt;"> 主键 </td> 
 <td style="background-color:#aeaaaa;width:90pt;"> 注释 </td> 
 </tr> 
 <tr> 
 <td> logistics_distribution_id </td> 
 <td> int </td> 
 <td> 11 </td> 
 <td> 是 </td> 
 <td> 是 </td> 
 <td style="width:90pt;"> 物流配送ID </td> 
 </tr> 
 <tr> 
 <td> logistics_number </td> 
 <td> varchar </td> 
 <td> 64 </td> 
 <td> 否 </td> 
 <td> 否 </td> 
 <td style="width:90pt;"> 物流号 </td> 
 </tr> 
 <tr> 
 <td> item_name </td> 
 <td> varchar </td> 
 <td> 64 </td> 
 <td> 否 </td> 
 <td> 否 </td> 
 <td style="width:90pt;"> 物品名称 </td> 
 </tr> 
 <tr> 
 <td> item_quantity </td> 
 <td> int </td> 
 <td> 11 </td> 
 <td> 否 </td> 
 <td> 否 </td> 
 <td style="width:90pt;"> 物品数量 </td> 
 </tr> 
 <tr> 
 <td> shipping_address_ </td> 
 <td> varchar </td> 
 <td> 64 </td> 
 <td> 否 </td> 
 <td> 否 </td> 
 <td style="width:90pt;"> 发货地址 </td> 
 </tr> 
 <tr> 
 <td> receiving_address </td> 
 <td> varchar </td> 
 <td> 64 </td> 
 <td> 否 </td> 
 <td> 否 </td> 
 <td style="width:90pt;"> 收货地址 </td> 
 </tr> 
 <tr> 
 <td> receiving_user </td> 
 <td> int </td> 
 <td> 11 </td> 
 <td> 否 </td> 
 <td> 否 </td> 
 <td style="width:90pt;"> 收货用户 </td> 
 </tr> 
 <tr> 
 <td> user_mobile_number </td> 
 <td> varchar </td> 
 <td> 64 </td> 
 <td> 否 </td> 
 <td> 否 </td> 
 <td style="width:90pt;"> 用户手机号 </td> 
 </tr> 
 <tr> 
 <td> logistics_status </td> 
 <td> varchar </td> 
 <td> 64 </td> 
 <td> 否 </td> 
 <td> 否 </td> 
 <td style="width:90pt;"> 物流状态 </td> 
 </tr> 
 <tr> 
 <td> user_sign_in </td> 
 <td> varchar </td> 
 <td> 64 </td> 
 <td> 否 </td> 
 <td> 否 </td> 
 <td style="width:90pt;"> 用户签收 </td> 
 </tr> 
 <tr> 
 <td> recommend </td> 
 <td> int </td> 
 <td> 11 </td> 
 <td> 是 </td> 
 <td> 否 </td> 
 <td style="width:90pt;"> 智能推荐 </td> 
 </tr> 
 <tr> 
 <td> create_time </td> 
 <td> datetime </td> 
 <td> 0 </td> 
 <td> 是 </td> 
 <td> 否 </td> 
 <td style="width:90pt;"> 创建时间 </td> 
 </tr> 
 <tr> 
 <td> update_time </td> 
 <td> timestamp </td> 
 <td> 0 </td> 
 <td> 是 </td> 
 <td> 否 </td> 
 <td style="width:90pt;"> 更新时间 </td> 
 </tr> 
 </tbody> 
</table>

<table style="margin-left:4.8pt;width:431.4pt;"> 
 <tbody> 
 <tr> 
 <td style="background-color:#aeaaaa;width:76.8pt;"> 名称 </td> 
 <td style="background-color:#aeaaaa;width:60.3pt;"> 类型 </td> 
 <td style="background-color:#aeaaaa;width:48.6pt;"> 长度 </td> 
 <td style="background-color:#aeaaaa;width:40.8pt;"> 不是null </td> 
 <td style="background-color:#aeaaaa;width:43.8pt;"> 主键 </td> 
 <td style="background-color:#aeaaaa;width:161.1pt;"> 注释 </td> 
 </tr> 
 <tr> 
 <td> type_id </td> 
 <td> int </td> 
 <td> 11 </td> 
 <td> 是 </td> 
 <td> 是 </td> 
 <td style="width:161.1pt;"> 商品分类ID： </td> 
 </tr> 
 <tr> 
 <td> father_id </td> 
 <td> smallint </td> 
 <td> 5 </td> 
 <td> 是 </td> 
 <td> 否 </td> 
 <td style="width:161.1pt;"> 上级分类ID </td> 
 </tr> 
 <tr> 
 <td> name </td> 
 <td> varchar </td> 
 <td> 255 </td> 
 <td> 否 </td> 
 <td> 否 </td> 
 <td style="width:161.1pt;"> 商品名称： </td> 
 </tr> 
 <tr> 
 <td> desc </td> 
 <td> varchar </td> 
 <td> 255 </td> 
 <td> 否 </td> 
 <td> 否 </td> 
 <td style="width:161.1pt;"> 描述： </td> 
 </tr> 
 <tr> 
 <td> icon </td> 
 <td> varchar </td> 
 <td> 255 </td> 
 <td> 否 </td> 
 <td> 否 </td> 
 <td style="width:161.1pt;"> 图标： </td> 
 </tr> 
 <tr> 
 <td> source_table </td> 
 <td> varchar </td> 
 <td> 255 </td> 
 <td> 否 </td> 
 <td> 否 </td> 
 <td style="width:161.1pt;"> 来源表： </td> 
 </tr> 
 <tr> 
 <td> source_field </td> 
 <td> varchar </td> 
 <td> 255 </td> 
 <td> 否 </td> 
 <td> 否 </td> 
 <td style="width:161.1pt;"> 来源字段： </td> 
 </tr> 
 <tr> 
 <td> create_time </td> 
 <td> timestamp </td> 
 <td> 0 </td> 
 <td> 是 </td> 
 <td> 否 </td> 
 <td style="width:161.1pt;"> 创建时间： </td> 
 </tr> 
 <tr> 
 <td> update_time </td> 
 <td> timestamp </td> 
 <td> 0 </td> 
 <td> 是 </td> 
 <td> 否 </td> 
 <td style="width:161.1pt;"> 更新时间： </td> 
 </tr> 
 </tbody> 
</table>

<table style="margin-left:4.8pt;width:430.25pt;"> 
 <tbody> 
 <tr> 
 <td style="background-color:#aeaaaa;width:148.3pt;"> 名称 </td> 
 <td style="background-color:#aeaaaa;width:60.3pt;"> 类型 </td> 
 <td style="background-color:#aeaaaa;width:48.6pt;"> 长度 </td> 
 <td style="background-color:#aeaaaa;width:40.8pt;"> 不是null </td> 
 <td style="background-color:#aeaaaa;width:43.8pt;"> 主键 </td> 
 <td style="background-color:#aeaaaa;width:88.45pt;"> 注释 </td> 
 </tr> 
 <tr> 
 <td> accounting_information_id </td> 
 <td> int </td> 
 <td> 11 </td> 
 <td> 是 </td> 
 <td> 是 </td> 
 <td style="width:88.45pt;"> 帐务信息ID </td> 
 </tr> 
 <tr> 
 <td> trade_name </td> 
 <td> varchar </td> 
 <td> 64 </td> 
 <td> 否 </td> 
 <td> 否 </td> 
 <td style="width:88.45pt;"> 商品名称 </td> 
 </tr> 
 <tr> 
 <td> today_sales </td> 
 <td> int </td> 
 <td> 11 </td> 
 <td> 否 </td> 
 <td> 否 </td> 
 <td style="width:88.45pt;"> 本日销量 </td> 
 </tr> 
 <tr> 
 <td> sales_amount </td> 
 <td> int </td> 
 <td> 11 </td> 
 <td> 否 </td> 
 <td> 否 </td> 
 <td style="width:88.45pt;"> 销售金额 </td> 
 </tr> 
 <tr> 
 <td> bookkeeping_date </td> 
 <td> date </td> 
 <td> 0 </td> 
 <td> 否 </td> 
 <td> 否 </td> 
 <td style="width:88.45pt;"> 记账日期 </td> 
 </tr> 
 <tr> 
 <td> recommend </td> 
 <td> int </td> 
 <td> 11 </td> 
 <td> 是 </td> 
 <td> 否 </td> 
 <td style="width:88.45pt;"> 智能推荐 </td> 
 </tr> 
 <tr> 
 <td> create_time </td> 
 <td> datetime </td> 
 <td> 0 </td> 
 <td> 是 </td> 
 <td> 否 </td> 
 <td style="width:88.45pt;"> 创建时间 </td> 
 </tr> 
 <tr> 
 <td> update_time </td> 
 <td> timestamp </td> 
 <td> 0 </td> 
 <td> 是 </td> 
 <td> 否 </td> 
 <td style="width:88.45pt;"> 更新时间 </td> 
 </tr> 
 </tbody> 
</table>

1.    
    **系统详细设计**

5.1登录模块

本系统主要的用户有系统管理员、用户，一个系统最基本的功能就是登录功能，本系统可以进行系统登录的角色有用户、管理员，用户对应前台登录界面，管理员对应后台登录界面，首先进入登录页，输入用户名和密码，然后提交至服务端进行数据库数据验证，通过Node.jsEE逻辑代码判断数据库是否存在用户输入的这一个记录，如果存在，则判断用户身份，如果是用户，则进入用户前台，如果是管理员用户，则进入系统主页，并把用户对象存放在session中，如果不存在这样一条记录，则返回登录界面。

登录界面如下所示。

![79a7a81622f7484dad2afc2aeba28402.png][]

图5-1前台登录界面

![11132cc0c9ff4e908b8a398394f31707.png][]

图5-3用户注册界面

5.3商城资讯模块

系统为用户提供商城资讯推荐，方便用户浏览推荐信息。在shangchenzixunlist.jsp实现商城资讯列表的展示，用户点击浏览，通过推荐id传递值，找到数据表的该商城资讯信息。

如下图所示为商城资讯界面。

![84e4ebec61764178b0060f8acbb393d9.png][]

图5-4商城资讯界面

5.4商品评论模块

系统提供商品评论功能，在pinglunadd.jsp实现商品的评论，添加评论后，存入数据库的评论表。管理员管理商品的评论信息。

如下图所示为评论的部分界面。

![6d57a55da79e49d188f907cc498d075f.png][]

图5-5评论界面

5.5购买商品模块

用户在浏览商品后，登录系统前台，进行商品购买，将商品添加至购买车，在个人后台可以查看购买车里面的商品，确定商品之后可以生成订单，然后支付。

如下图所示为购买商品的部分界面。

![81990163248d43c385ca87f9d8e3dbe1.png][]

图5-6购买商品界面

5.6系统用户管理模块

过去传统的手工登记管理系统人员信息很不方便，也很容易造成数据出错，所以本系统需要一个可以管理登记人员信息的功能，管理员登入系统，可以添加新的管理员用户，删除现有的管理员，也可以对自己的密码和管理员用户的密码进行修改。修改密码是经过跟数据库的原来的密码字段的数据进行判断，如果输入两次的新密码一致，则更新密码这属性对应的一条数据。

如下图所示为系统用户管理的部分界面。

![38a03f53a3ad4dc29d59dde57e93c924.png][]

图5-7系统用户管理界面

5.7商城管理模块

用户在系统前台浏览商城，管理员登录系统后，可以对添加、删除、修改商城信息，系统前台的商城信息时随系统后台变化而变化的。

商城管理的界面如下图所示。

![329e6ccd70c44b9aa637cc8cabcfef5b.png][]

图5-8商城管理界面

5.8商城资讯管理模块

如下图所示为商城资讯管理界面。

![23170e903a3f4bd69daf2c2c8f190380.png][]

图5-9商城资讯管理界面

5.9物流配送管理模块

管理人员可以对物流配送进行发布管理的操作，这些操作将在物流配送管理界面进行。

如下图为物流配送管理界面。

![ad7a699a056f4389867ba545aa21017a.png][]

图5-10物流配送管理界面

1.  **系统测试**

6.1测试目的

该系统能够完成商城资讯浏览、商品购买，物流配送管理，账务信息管理，用户管理等功能，做到所开发的系统操作简单，尽量使系统操作不受用户对电脑知识水平的限制，符合系统可维护性，由于系统涉及的信息比较广，数据库中的数据需定期修改，系统可利用的空间及性能也随之下降，为了使系统更好地运转，系统可以对系统数据及一些简单的功能进行独立的维护及调整；符合系统开放性要求，该系统能够在开放的硬件体系结构中运行，并且能与其他系统顺利连接。

6.2测试用例

1.注册测试

表6-1注册测试用例

<table style="margin-left:6.75pt;"> 
 <tbody> 
 <tr> 
 <td style="vertical-align:top;width:213.05pt;"> 字段名称 </td> 
 <td style="vertical-align:top;width:213.05pt;"> 描述 </td> 
 </tr> 
 <tr> 
 <td style="vertical-align:top;width:213.05pt;"> 测试项 </td> 
 <td style="vertical-align:top;width:213.05pt;"> 首页注册功能测试 </td> 
 </tr> 
 <tr> 
 <td style="vertical-align:top;width:213.05pt;"> 输入数据 </td> 
 <td style="vertical-align:top;width:213.05pt;"> 1、输入正确的邮箱、用户名、密码、确认密码、以及验证码之后点击“注册”按钮 2、输入错误的用户名或密码、邮箱、验证码等，单击“注册”按钮 3、不输入邮箱、用户名、密码、确认密码、以及验证码之后点击“注册”按钮 </td> 
 </tr> 
 <tr> 
 <td style="vertical-align:top;width:213.05pt;"> 预计输出数据 </td> 
 <td style="vertical-align:top;width:213.05pt;"> 1、用户能正确注册账号，成功插入数据库用户的账户资料，提示注册成功。 2、无法注册用户信息，注册失败。 3、无法注册用户信息，注册失败。 </td> 
 </tr> 
 </tbody> 
</table>

使用上述测试用例对前台首页注册界面进行测试，当在输入正确的邮箱、用户名、密码、确认密码、以及验证码之后，系统将弹出注册成功信息提示对话框。

使用上述测试用例对前台首页注册界面进行测试，当在输入错误的用户名或密码、邮箱、验证码之后，系统将提示错误。

使用上述测试用例对前台首页注册界面进行测试，当在不输入用户名、密码、邮箱、验证码之后，点击注册按钮。

2.登录界面进行测试

表6-2登录测试用例

<table style="margin-left:6.75pt;"> 
 <tbody> 
 <tr> 
 <td style="vertical-align:top;width:213.05pt;"> 测试项 </td> 
 <td style="vertical-align:top;width:213.05pt;"> 首页登录功能测试 </td> 
 </tr> 
 <tr> 
 <td style="vertical-align:top;width:213.05pt;"> 输入数据 </td> 
 <td style="vertical-align:top;width:213.05pt;"> 1、输入正确的用户名和密码，单击“登录”按钮 2、输入错误的用户名和密码，单击“登录”按钮 3、不输入用户名和密码，单击“登录”按钮 </td> 
 </tr> 
 <tr> 
 <td style="vertical-align:top;width:213.05pt;"> 预计输出数据 </td> 
 <td style="vertical-align:top;width:213.05pt;"> 1、数据库中存在的用户能正确登录,。结果弹出主界面。 2、错误的或者无效用户登录，登录系统失败。 3、输入用户名或密码信息为空，登录系统失败。 </td> 
 </tr> 
 </tbody> 
</table>

3.商品管理进行测试

名称：用户管理测试 目的：测试商品管理界面

内容：口令的输入，合法性检查，合理性检查，界面的显示控制。

下表描述了商品表中目前所存在的记录。

表6-5商品表预存数据

添加时应注意事项：

管理员添加商品时必须添加已存在的商品类别，若该商品不属于现有的所有类别，则应该先添加商品类别。

下表描述了添加商品进行测试的用例，主要是为了防止添加商品时出现异常和存在的漏洞。

表6-6添加商品测试用例

<table> 
 <tbody> 
 <tr> 
 <td colspan="3" style="vertical-align:top;width:229.5pt;"> 输入 </td> 
 <td style="width:174pt;"> 输出 </td> 
 </tr> 
 <tr> 
 <td style="vertical-align:top;width:95.5pt;"> 商品名 </td> 
 <td style="vertical-align:top;width:67.25pt;"> 商品价格 </td> 
 <td style="vertical-align:top;width:66.75pt;"> 商品图片 </td> 
 </tr> 
 <tr> 
 <td style="vertical-align:top;width:95.5pt;"> &nbsp;&nbsp;&nbsp;空 </td> 
 <td style="vertical-align:top;width:67.25pt;"> </td> 
 <td style="vertical-align:top;width:66.75pt;"> </td> 
 <td style="vertical-align:top;width:174pt;"> 参数错误 </td> 
 </tr> 
 <tr> 
 <td style="vertical-align:top;width:95.5pt;"> </td> 
 <td style="vertical-align:top;width:67.25pt;"> 空 </td> 
 <td style="vertical-align:top;width:66.75pt;"> </td> 
 <td style="vertical-align:top;width:174pt;"> 参数错误 </td> 
 </tr> 
 <tr> 
 <td style="vertical-align:top;width:95.5pt;"> </td> 
 <td style="vertical-align:top;width:67.25pt;"> </td> 
 <td style="vertical-align:top;width:66.75pt;"> 空 </td> 
 <td style="vertical-align:top;width:174pt;"> 请选择上传图片 </td> 
 </tr> 
 <tr> 
 <td style="vertical-align:top;width:95.5pt;"> A </td> 
 <td style="vertical-align:top;width:67.25pt;"> 1 </td> 
 <td style="vertical-align:top;width:66.75pt;"> a.jpg </td> 
 <td style="vertical-align:top;width:174pt;"> 添加成功 </td> 
 </tr> 
 </tbody> 
</table>

4.购买商品测试

名称：购买商品测试 目的：测试购买商品界面

内容：口令的输入，合法性检查，合理性检查，界面的显示控制。

下表描述了购买商品的测试用例，防止购买时出错。

表6-7购买商品测试用例

<table> 
 <tbody> 
 <tr> 
 <td colspan="3" style="vertical-align:top;width:293.95pt;"> 输入 </td> 
 <td style="width:109.55pt;"> 输出 </td> 
 </tr> 
 <tr> 
 <td style="vertical-align:top;width:67.15pt;"> 用户ID </td> 
 <td style="vertical-align:top;width:106.3pt;"> 商品ID </td> 
 <td style="vertical-align:top;width:120.5pt;"> 商品数量 </td> 
 </tr> 
 <tr> 
 <td style="vertical-align:top;width:67.15pt;"> 11 </td> 
 <td style="vertical-align:top;width:106.3pt;"> 1 </td> 
 <td style="vertical-align:top;width:120.5pt;"> 1 </td> 
 <td style="vertical-align:top;width:109.55pt;"> 购买商品成功 </td> 
 </tr> 
 <tr> 
 <td style="vertical-align:top;width:67.15pt;"> 22 </td> 
 <td style="vertical-align:top;width:106.3pt;"> 电视 </td> 
 <td style="vertical-align:top;width:120.5pt;"> </td> 
 <td style="vertical-align:top;width:109.55pt;"> 请填写商品数量 </td> 
 </tr> 
 <tr> 
 <td style="vertical-align:top;width:67.15pt;"> 33 </td> 
 <td style="vertical-align:top;width:106.3pt;"> 电视 </td> 
 <td style="vertical-align:top;width:120.5pt;"> a </td> 
 <td style="vertical-align:top;width:109.55pt;"> 购买失败 </td> 
 </tr> 
 </tbody> 
</table>

用户购买商品时，首先判断商品数量是否小于库存，若超出库存数量，则提示商品数量不足。

1.   **结论**

经过这几个月的设计和开发，“基于Node.js的网上商城”已经完成了，其功能符合设计需求，能够完成用户的注册、在线购买、订单管理、物流配送管理和订单审核、用户管理、信息维护、查询等功能。经过最后的使用，证明系统完全具有可行性与可扩充性。

在系统的分析阶段，主要是分析系统的需求，理解系统要完成的基本功能,找出系统的用例（Use Case）和角色（Actor）,画出系统的用例模型图，用例模型是此后系统建模的基础。在用例的基础上分析顺序图和协作图，得到系统的所有对象，然后建立对象模型。抽象出系统的类，并将系统中联系紧密的类划分为若干个包，画出包图。有了这些基础，就可以将系统划分为小单元功能模块。

整个过程中，我必须认可UML统一建模语言，它让我很清晰的知道自己想做什么，想实现什么，对系统后面的代码编写起到决定性的帮助，同时经过本次系统的设计与实现，让我积累了很多经验，提高了编写程序的能力，为以后的学习和工作打下了坚实的基础。

由于时间有限，本系统还有待继续完善和改进，因此需要进一步进行分析和修改，以使其更加完善！

## **参考文献** ##

1.  王江霖,黄彩霞,樊旭龙.基于Springboot框架的网络资源共享平台的研究与实现\[J\].电脑知识与技术,2021,17(28):76-78.
2.  曹华山.Springboot框架在Web应用开发中的设计与实现\[J\].无线互联科技,2021,18(11):108-109.
3.  程红琳. 网上商城品目扩容效果几何\[N\]. 中国政府采购报,2021-05-18(005).
4.  马君峰, 农产品自营网上商城智慧平台V1.0. 甘肃省,甘肃科博科技咨询有限责任公司,2021-02-01.

\[5\]王娟.基于Android系统的手机网上商城设计与实现\[J\].电子技术与软件工程,2021(03):43-44.

\[6\]韩己峰.综合性网上商城引领山东政府采购驶入高速路\[J\].中国政府采购,2020(12):39-41.

\[7\]袁江琛.基于MVC框架网上商城的设计与实现\[J\].信息与电脑(理论版),2020,32(20):126-128.

\[8\]袁江琛.Ajax+jQuery在网上商城购物车模块中的设计与实现\[J\].电脑编程技巧与维护,2020(10):34-35+68.

\[9\]王柯梦,王瑞平.基于B2C网上商城前台系统数据库设计与实现\[J\].广西质量监督导报,2020(09):70-71.

\[10\]薄志强. 基于Springboot框架的网上商城系统的设计与实现\[D\].西安电子科技大学,2020..

\[11\]张浩. 基于网上商城服务对话系统的研究与实现\[D\].黑龙江大学,2020.

\[12\]孙建英.分布式、集中式、区块链技术在网上商城中的应用\[J\].商场现代化,2020(01):13-15.

\[13\]李颖,方浪,武瑞婵.“Free-Try”虚拟试衣在网上商城中的实现\[J\].襄阳职业技术学院学报,2019,18(06):64-66.

\[14\]王一凡. 基于MOT的云南移动网上商城O2O手机营销策略优化研究\[D\].云南大学,2019.

\[15\]布祉颖.论B2C和O2O的进口零食营销的模式——关于零始科技有限公司的零始网研究\[J\].现代妇女(下旬),2018(12):75-76.

\[16\]老潘,花椰菜.零食控的购物车\[J\].宠物世界(狗迷),2018(12):50-55.

## **致 谢** ##

大学的学习生活总是感觉短暂的，总感到知识还没有学够，但大学毕业就在我们面前，即毕业设计即将的结束，意味着我们的大学生涯即将结束。毕业设计是我们在大学所学知识的一次总结，更是对我们过去所学知识的提炼和升华，通过毕业设计，我们认识到大学学习过程中还有那些知识没有掌握，那些知识需要我们进入深入研究。这次毕业设计让我学到了很多新的知识，研究了一些新的以前自己不熟悉的领域，使我处理问题的能力得到了一定的提升，同时也为今后的继续深造或踏入社会大门提供了很好的锻炼机会。

我也曾经沮丧过，失落过，想放弃过，可是因为你们这不厌其烦的鼓励和支持才使得我坚持了下来，这里我要对我的老师和同学们说句“谢谢你们”。因为我们的知识是有限的，所以本文将不可避免的会出现一些错误和不足之处，还请老师指正。

**请关注点赞+私信博主，免费领取项目源码**

[Link 1]: https://baike.baidu.com/item/%E6%95%B0%E6%8D%AE%E7%BB%91%E5%AE%9A/2884939
[Link 2]: https://baike.baidu.com/item/%E9%9F%B3%E9%A2%91/1197465
[Link 3]: https://baike.baidu.com/item/%E8%A7%86%E9%A2%91/321962
[3D]: https://baike.baidu.com/item/3D/25017
[Link 4]: https://baike.baidu.com/item/%E5%8A%A8%E7%94%BB/206564
[Link 5]: https://baike.baidu.com/item/%E6%A8%A1%E5%BC%8F/700029
[Link 6]: https://baike.baidu.com/item/%E6%A1%86%E6%9E%B6/1212667
[Web]: https://baike.baidu.com/item/Web%E6%9C%8D%E5%8A%A1/2837593
[Link 7]: https://baike.baidu.com/item/%E4%BA%8B%E5%8A%A1
[Link 8]: https://baike.baidu.com/item/%E9%A2%84%E7%BC%96%E8%AF%91
[HTML]: https://baike.baidu.com/item/HTML
[Link 9]: https://baike.baidu.com/item/%E6%A0%87%E5%87%86%E9%80%9A%E7%94%A8%E6%A0%87%E8%AE%B0%E8%AF%AD%E8%A8%80
[js]: https://baike.baidu.com/item/js/10687961
[Link 10]: https://baike.baidu.com/item/%E5%88%86%E7%A6%BB
[Windows]: https://baike.baidu.com/item/Windows
[Linux]: https://baike.baidu.com/item/Linux
[Mac]: https://baike.baidu.com/item/Mac/173
[Android]: https://baike.baidu.com/item/Android/60243
[iOS]: https://baike.baidu.com/item/iOS/45705
[Link 11]: https://baike.baidu.com/item/%E7%AE%97%E6%9C%AF%E8%BF%90%E7%AE%97%E7%AC%A6/9324947
[d8d1cf9128744f1a9965dfbfd8015b32.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/15/7c14f4eb435248749d40738a6db4f07e.png
[7a0c79b7d6444ef6b282b82199e35e0a.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/15/d2c66f863ccf4c18997d4e95bd578c19.png
[86da7cc1cb054956917acbb0c2a938bc.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/15/ed1a96a903044385af34c92e70eae8a8.png
[37d4ece15b0b4d1284a2a27801438bc1.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/15/90844a1b85ee46449bd3c2aebd798fa4.png
[b8a23f0991cc424e9d5fc338d98a1ee3.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/15/46f99dfedc7b47df8d8fa4d431e33082.png
[0729c80f4d754342bf29b8b9c8cc12aa.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/15/ec2087e9768548069d6051ecd8b72df9.png
[db65c588933f49318f452c937e6d6708.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/15/d1da8e29cbf94cd1b5c26ea8879e9bab.png
[a4b0739ff7d14fab8ed1f60df8b2e690.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/15/097d42018d7b4ed88795f8cd95214e19.png
[a2f0781ef5da4ebfaa40ff6ffc9e79d3.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/15/275d4821ddfc44aca00816efca105e76.png
[94b720c9a38440b08dc598f7d13c53bf.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/15/534ce8d481de4b4b93b4e0be7479424a.png
[aee122cb6bfc4de3b4d13d68ec7c8576.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/15/e9720ed86c8b4bf58bd4f4663ed73197.png
[67a6c3873b3f4cbf8db90e13521ba789.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/15/e0fc0892fb434ce8a354b1d663b903e2.png
[5d40486c84a247f3995555396f9205a9.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/15/d61ad0c1bf3c49ca8fae9e40165c2107.png
[169c754183ca4559b57b45493502e601.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/15/9daf340097a1475ca5c19ca065d006d1.png
[030e941e62bf4434bf4d7852601837d6.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/15/47c22ae83d5a432f80178bee4ace8214.png
[79a7a81622f7484dad2afc2aeba28402.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/15/16e860e2c3eb4f25a4aa0cba57ff559a.png
[11132cc0c9ff4e908b8a398394f31707.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/15/938d0bd4187d4143a5c393cb67554405.png
[84e4ebec61764178b0060f8acbb393d9.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/15/3aa9bb4b0f6043edb94e96cee5ed65ce.png
[6d57a55da79e49d188f907cc498d075f.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/15/654c347b982c445d8eda41581a7ed97c.png
[81990163248d43c385ca87f9d8e3dbe1.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/15/22262e34cb494369865717281f8d3c42.png
[38a03f53a3ad4dc29d59dde57e93c924.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/15/8738dff0f5e64947aaaf861d731ef388.png
[329e6ccd70c44b9aa637cc8cabcfef5b.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/15/d35b387ac3b64f73abc533a6e0138b08.png
[23170e903a3f4bd69daf2c2c8f190380.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/15/0f523321639749ab9ff67be50abc0080.png
[ad7a699a056f4389867ba545aa21017a.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/15/8170dfab67ab47ba8bfaec7c4f1ad2d5.png