商城系统需求分析

news2025/7/9 5:38:13

文章目录

  • 一、引言
    • 1.1项目背景
    • 1.2 前期工作
  • 二、技术概述
  • 三、功能需求
    • 3.1 功能块划分
    • 3.2 功能块描述
      • 3.2.1 面向用户部分功能:
      • 3.2.2 后台管理部分功能:
  • 四、性能需求
    • 4.1 数据精确度
    • 4.2 适应性
  • 五、系统流程图
    • 5.1 顾客与管理员流程图如下
    • 5.2 订单处理流程说明
  • 六、数据流图
    • 6.1数据流图如下
  • 七、需求分析图

一、引言

1.1项目背景

网上购物在线网站致力于提供产品展示及订购为核心的网上购物服务宣传自己商店的产品并将自己的产品展现给客户,让客户通过网站便能对自由的选择地购买产品。

分为两个系统模块:

  • 用户前台系统

该网站是通过用户注册、登录、浏览商品、按分类搜索、关键字搜索、购买、确定购买、购买等实现用户模块功能。

  • 商家后台系统
  1. 商品管理:品牌管理、平台属性管理、sku管理、分类管理、spu管理

  2. 权限管理:用户管理、角色管理、菜单管理

  3. 娱乐功能:贪吃蛇、扫雷等

  4. 数据可视化功能:即收集营业额情况,门店销售情况等

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-awbDqnGq-1666181981467)(C:\Users\86136\AppData\Roaming\Typora\typora-user-images\image-20221019200439054.png)]

1.2 前期工作

我们在编写该需求前,首先是对各大网上销售网站进行了调查,其中包括:网页排版、顾客消费流程、以及后台商家需要进行哪些操作可以更简便的操作商品,这三大块进行了调查。并总结出了有自己特色的设计思路。

二、技术概述

前端技术:将Vue2、ElementUI、html、javaScript、css、echarts等结合起来使用。

后端技术:Node.js,javaScript,SQL,npm的各种包

前后端交互:前端用axios发送请求获取后端数据,

远程代码仓库:Github、gitee

三、功能需求

3.1 功能块划分

网上商城共分两个部分,一部分是面向用户的部分,包括:顾客在线注册、购物、提交订单、付款等操作;另外一部分是商城管理部分,这部分的内容包括:产品的添加、删除、查询、订单的管理、操作员的管理、注册用户的管理等。

3.2 功能块描述

3.2.1 面向用户部分功能:

1. 进入首页

  • 用户通过输入首页网址进入首页。(操作手册中要提供首页网)
  • .在首页右上显示会员中心、登录、退出
  • 在首页中分页显示所有商品信息、每一项商品下面都有商品详情
    和购买两个功能按钮(或链接)。(提供商品信息数据20条以上)
  • 在首页左侧显示购物车简要信息和以树状图的方式商品类别
  • 后台登录的用户不能进入前台

2. 商品搜索

  • 进入首页后,默认分页显示所有商品。
  • 用户可根据商品大类、商品小类和关键字(即商品名称)三项或组合
    查询商品。关键字模糊匹配商品名称,如果没有商品则显示“查无
    商品”。
  • 查询后,保留上次查询条件。如选择了大类中的电脑,小类中的笔
    记本,输入关键字是lenovo进行查询后,条件依然存在。
  • 查得商品分页显示。每一项商品下面都有详细信息和购买两个功能
    按钮(或链接)。

3. 购买商品

  • 进入首页后,输入相应条件进行商品查询查得所要商品;
  • 在商品列表或者商品详细信息页上点击“购买”进行购买,(如果缺
    货不能购买,总购买数量不能大于该商品的库存)。

4. 商品类别显示

  • 进入首页后,在首页左侧显示商品类别:
    商品类别列表以树状图的方式显示。
  • 点击树状图中类别名,可根据商品类别查询商品。

5. 显示购物车简要信息

  • 进入首页后,在首页左侧显示购物车简要信息;
    简要信息可包括:购物中商品总个数,商品种类总数,总金额等:
    2用户可点“进入购物车”链接,直接进入购物车管理页:

6. 前台注册

  • 在首页点击“注册”进入用户注册页。
  • 在用户注册页面输入用户名、密码、确认密码、真实姓名、性别、出
    生日期、电子邮箱、电话号码、地址、邮编等信息后,点提交按钮,
    进行客户端验证,验证通过后进行注册,如注册失败提示失败原因及
    重新提交;

7. 前台用户登录

  • 在首页单击登录进入登录页面。
  • 输入用户名、密码、验证码后单击登录按钮,首先进行客户验证,验
    证通过后进行登录;如登录失败进行相应提示并重新登录;
  • 不管登录成功与否,都记住登录的用户名,下次登录自动输入用户名。

8. 前台用户退出

  • 已登录的用户在首页上单击“退出”实现登录用户的安全退出。
    只有用户登录后在网页的菜单栏才显示“退出”。
  • 安全退出后,进入首页

9. 购物车管理

  • 在购物车管理页中,以友好方式显示购物车的商品信息和汇总信息:如
    购物车中无商品,则提示:
    商品信息包括:商品名称,商品缩略图,商品单价,商品数量,商品小

    汇总信息包括:商品总价,商品总个数,商品种类数:
  • 可以修改购物车中某种商品的数量,用户输入的新商品数量需是大于0
    的数字,并且不能大于商品库存数。
  • 可以删除购物车中某种商品。
  • 单击“清空购物车”可以清空购物车。
  • 单击“继续购物”可以回到首页继续购物。
  • 单击“结算中心”去结算下订单。

10.订单确认

  • 在购物车管理页中点击“结算并下订单”:如已登录进入结算确认页:
    如未登录则进入登录页,用户登录成功后直接进入结算确认页。
  • 选择付款方式、收货方式后,用户可点击“确认结算”进入下单页,也
    可点击“返回购物车”回到购物车管理页;
    注:付款方式、收货方式必选
  • 如点击“确认结算”进入下单页,下单页收货人信息默认来自登录用户
    的信息但可进行修改;在下单页中点提交订单,进行下订单:
  • 如下单失败则提示失败原因;下订成功提示成功信息(信息中包括订
    单编号,下订单日期)可进入会员中心我的订单页;

3.2.2 后台管理部分功能:

  1. 管理人员部分

    该部分的用户有一个超级管理员。超级管理员拥有最高权限,可访问所有订单,可浏览、查询订单,可浏览、修改与新增工作人员。可操作工作人员对于后台系统的可视模块,比如商家只允许查看到商品管理,财务人员可以查看数据可视化模块,分类管理人员可以查看分类模块等等

  2. 管理订单功能

    顾客可通过Web方式取消、修改自己提交的订单(在管理员确认前),查询自己提交的订单(随时)。如订单的状态在一定时限(如12个小时)后仍没有发生变化(“订单关闭”状态除外),系统自动提醒管理员(如该订单变色,弹出提醒窗口等方式。订单状态发生变化,系统自动发E-mail给顾客,“无效订单”、“订单关闭”状态除外)。

  3. 管理商品功能

    品牌管理、平台属性管理、sku管理、分类管理、spu管理

四、性能需求

4.1 数据精确度

价格单位保留到分。

4.2 适应性

购物流程要简单明了,产品图片要清楚,产品信息描述准确。

五、系统流程图

5.1 顾客与管理员流程图如下

顾客流程图:
在这里插入图片描述
管理员流程图:
在这里插入图片描述

5.2 订单处理流程说明

  1. 顾客提交订单。

  2. 页面显示:“感谢您在网上商城购物,您的订单已成功提交,我们会在12小时内 与您联系。如有问题可拨打网上商城客服热线”。 (3) 订单信息进入系统审核,若审核通过,则将订单入库,并通知顾客付款,若审核失 败(如填写的信息无效或无库存),则将失败原因发给顾客,同时删除订单。

  3. 订单具备以下几种状态:“提交成功、尚未审核”、“用户取消”、“无效订单”、“已审核,尚未付款”、“付款成功、尚未发货”、“付款不成功”、“已发货”、“订单关闭”等。

  4. 顾客提交订单,订单入库即为“提交成功、尚未审核”状态;订单管理员在后台 浏览到顾客提交的订单,在确认订单信息有效后,订单的状态为“已审核,尚未付款”,如是无效信息(如收货人信息虚假),则置其状态为“无效订单”;在订单审核前,消费者可在线修改或取消其提交的订单。

  5. 管理员审核订单后,再由其系统联系顾客,通知他付款,根据结果置订单的状态为“付款成功、尚未发货”、“付款不成功”,付款不成功则继续通知顾客付款,若一定时间内没有付款(如24小时内),则将订单状态置为“订单取消”。

  6. 付款成功后,由销售方发货,订单接下来依次经过“已发货”、“订单关闭”两个状态。

六、数据流图

6.1数据流图如下

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-KHcF8e0C-1666181981468)(C:\Users\86136\AppData\Roaming\Typora\typora-user-images\image-20221019201904133.png)]
6.1.1 网上购物系统顶层图

在这里插入图片描述
6.1.2 网上购物系统一层图(会员)
在这里插入图片描述
6.1.3 网上购物系统一层图(购物系统)
在这里插入图片描述
6.1.4 网上购物系统二层图(订单管理系统)
在这里插入图片描述
6.1.5 网上购物系统三层图(商品管理系统)
在这里插入图片描述
6.1.6 网上购物系统三层图(广告及其它信息管理系统)
在这里插入图片描述

6.1.7 网上购物系统二层图(注册会员管理系统)
在这里插入图片描述
6.1.8 网上购物系统一层图(管理员系统)

七、需求分析图

在这里插入图片描述

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/408197.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

VUE动态切换皮肤 VUE动态切换背景图片 操作 / VUE 主题切换

上正文 使用:root ,var()函数实现 1. 创建皮肤或主题 css目录 一个公共主题文件 theme.css,一个main.js引入文件theme-all.css,一个单独的 主题样式文件 theme-12.css 2. 定义css文件中所要切换的主题的…

vue(绑定style属性)

以对象方式绑定style属性 <div id"app"> <!-- 在行内属性中书写样式 --> <div style"color:royalblue ; font-size: 48px;">黄绥睿真帅个鬼</div> <!-- 把行内属性改造成对象&#xff0c;以对象方式绑定style属性 外部增加{}&a…

【进阶】TS 中的 类型断言 和 泛型

类型断言 作用 : 手动指定值的具体类型 ( 缩写值的范围 ) 应用场景 1 获取 DOM 元素的时候指定具体元素 示例 : const box document.getElementById(img) console.log(box.src) // ts报错错误内容 : 解析 &#xff1a; 上述语法在 js 中可以直接使用, 但是 TS 中就不行…

vue 动态样式绑定 class/style

简介&#xff1a; 字符串写法&#xff1a;类名不确定&#xff0c;要动态获取 对象写法&#xff1a;要绑定多个样式&#xff0c;个数确定&#xff0c;名字确定&#xff0c;但不确定用不用。 数组写法&#xff1a;要绑定多个样式&#xff0c;个数不确定&#xff0c;名字不确定。…

HTML基础 - HTML表格

HTML基础 - HTML表格 1.无表头的表格 <table> <tr> <td> <table>标签代表的是表 <tr>标签代表的是行 <td>标签代表的是列 在html页面中的表格来着&#xff0c;就和excl的表格不一样喽&#xff0c;咱自己有自己的规则&#xff1a; 这就是…

这一次,彻底搞懂箭头函数

一、箭头函数的特点 1. 相比普通函数&#xff0c;箭头函数有更加简洁的语法。 普通函数 function add(num) {return num 10 }箭头函数 const add num > num 10;2. 箭头函数不绑定this&#xff0c;会捕获其所在上下文的this&#xff0c;作为自己的this。 这句话需要注意的…

若依(ruoyi)字典管理插件实现思路探究

一个UI表单的构成&#xff0c;避免不了下拉框&#xff0c;多选框等标签&#xff0c;在开发这些标签时&#xff0c;通常会请求后台接口获取字典值进行动态渲染。定制化开发虽然实现简单&#xff0c;但会产生大量重复工作&#xff0c;解决这类问题的思路有哪些&#xff1f;文章对…

chrome插件开发时跨域问题解决方案

这是一个没有套路的前端博主&#xff0c;热衷各种前端向的骚操作&#xff0c;经常想到哪就写到哪&#xff0c;如果有感兴趣的技术和前端效果可以留言&#xff5e;博主看到后会去代替大家踩坑的&#xff5e;接下来的几篇都是uni-app的小实战&#xff0c;有助于我们更好的去学习u…

Vue在HTML中如何使用

&#x1f440;Vue是什么 一套用于构建用户界面的渐进式JavaScript框架。 构建用户界面&#xff1a;数据变成界面渐进式&#xff1a;Vue可以自底向上逐层的应用&#x1f440;Vue如何使用 一、引入vue.js <script src"./js/vue.js"></script> 二、准备一个…

HBuilderX uni-app简单实现静态登录页面(实例)

本章用到......uni-app页面跳转uni.navigateTo方法、uni.navigateBack方法。uni-app简单实现邮箱验证码发送点击后读秒样式。登录账号、密码正则表达式验证等 适合刚入门的小伙伴&#xff0c;大佬就没必要看了 静态页面&#xff01;静态页面&#xff01;没有绑定后端数据接口…

拿来即用的前端登录页面(简洁清爽版)

1、使用bootstrap实现 代码&#xff1a; <!DOCTYPE html> <html lang"en"> <head><meta charset"UTF-8"><title>登录</title><link rel"stylesheet" href"/bootstrap-3.3.7-dist/css/bootstrap.m…

vue项目根据不同环境动态配置接口请求ip及全局变量(vue环境变量配置)

在项目的开发过程中&#xff0c;我们常常会遇到根据不同的环境需要切换不同的ip的问题&#xff0c;例如在项目部署到测试服时需要将接口请求ip替换成测试服的ip,部署到正式服时又需要将接口请求ip替换成正式服对应的ip,有些公司还有预发环境等&#xff0c;这样在每次部署不同环…

Vue实战篇三十五:实现滑动拼图验证登录

系列文章目录 Vue基础篇一&#xff1a;编写第一个Vue程序 Vue基础篇二&#xff1a;Vue组件的核心概念 Vue基础篇三&#xff1a;Vue的计算属性与侦听器 Vue基础篇四&#xff1a;Vue的生命周期&#xff08;秒杀案例实战&#xff09; Vue基础篇五&#xff1a;Vue的指令 Vue基础篇…

Please set spring.main.web-application-type=reactive or remove spring-boot-starter-web dependency.

一、问题在启动springcloud的gateway模块的时候报错Please set spring.main.web-application-typereactive or remove spring-boot-starter-web dependency.二、问题产生的原因gateway组件中的 spring-boot-starter-webflux 和 springboot作为web项目启动必不可少的 spring-boo…

前端如何将静态页面部署到服务器,并可以通过公网ip访问。

问题描述 作为卑微的前端页面仔。在我们公司项目上线的时候&#xff0c;一般都是我们前端 npm run build&#xff0c;然后直接把打出来的dist包丢给后端&#xff0c;后端上传到服务器完成前端的部署。这个时候我就很好奇&#xff0c;页面是怎么上传到服务器的呢&#xff1f;上…

vue使用pinia (vue2/vue3)

pinia是什么&#xff1f;Pinia 是 Vue.js 的轻量级状态管理库 官方网站&#xff1a;Pinia 中文文档: 介绍 | Pinia 中文文档 pinia与vuex4 相同 是vue 官方 状态管理工具(作者是 Vue 核心团队成员&#xff09;是vue开发者工具支持pinia 不同 pinia相比vuex4&#xff0c…

云E办Springboot+vue——前端项目完整版(含源码)

一、项目简介 项目背景&#xff1a;受疫情的影响&#xff0c;许多企业由线上办公转为线下办公。随着线上办公的人数的增多&#xff0c;线上办公的优点逐步凸显&#xff1a;通过实现工作流程的自动化、节省企业办公费用、实现绿色办公&#xff0c;同时提升办公效率。 项目介绍…

uniapp在小程序中登录,获取用户信息,获取手机号逻辑记录

这里写目录标题概述uniapp小程序的授权描述授权的详细说明及使用1、微信小程序通过uni.login()方法可以获取到微信提供的code2、通过登录获取的code码可以以获取用户唯一标识openid以及会话密钥sessionkey用于解密获取手机的加密信息3、通过微信提供的获取微信手机号的方法getp…

ELK企业级日志分析平台(二)

文章目录一、kibana数据可视化1.部署2.定制数据可视化&#xff08;1&#xff09;网站访问量&#xff08;2&#xff09;访问量排行榜&#xff08;3&#xff09;创建dashboard&#xff0c;大屏展示二、ES集群监控1.启用xpack认证2.metricbeat监控3.filebeat日志采集一、kibana数据…

【玩转CSS】一文带你了解浮动

&#x1f525;一个人走得远了&#xff0c;就会忘记自己为了什么而出发&#xff0c;希望你可以不忘初心&#xff0c;不要随波逐流&#xff0c;一直走下去&#x1f3b6; &#x1f98b; 欢迎关注&#x1f5b1;点赞&#x1f44d;收藏&#x1f31f;留言&#x1f43e; &#x1f984; …