vue|仓管系统设计 vue.js|es6|javascript

登录功能：要点：
登录界面已优化

文章图片

输入账号密码后
this.$http.post('login', this.loginForm)
发送表单给后台，后台根据这个方法去数据库查询

getUserByMassage(user.getUsername(), user.getPassword());

文章图片

数据库查询时还要加上state=1，即状态为激活才可以登录成功
登录成功后直接跳转home页面，将用户信息储存sessionStorage，后期路由导航要用到

文章图片

文章图片

如此朴素的home页面，后期可以稍作修改。
退出功能：一个简单朴素的按钮

文章图片

文章图片

把sessionStorage清除然后跳转login页面
路由：目前采用先import后使用，后期可以切换路由懒加载~
home作为主要路由嵌套各个页面的路径及页面。

文章图片

路由导航

文章图片

不能没登录就访问改系统其他功能模块，所以前期登录加个sessionStorage来存储用户信息，全局的导航守卫保证用户已登录，不过这种方法可以升级为jwt。
home页面主要分为3个部分

文章图片

头部信息区。左侧导航区，右侧主体内容区，有待优化！

文章图片

左侧的导航内容从数据库读取，采用一对多映射。嵌套数据分一级菜单和二级菜单

文章图片

后台xml文件

SELECT mm.*,sm.id as sid ,sm.title as stitle,sm.path as spath FROM mainmenu mm ,submenu sm WHERE mm.id = sm.mid;

查询语句，有个缺点，就是二级菜单没有的时候不会显示一级菜单，而我后面有个分类嵌套商品也是模仿这个做的导致了很多问题，后面细说。
图标存储在前端动态获取

文章图片

关于F5或刷新页面后，重定向的问题，将当前页面存入sessionStorage，在加载页面时候在取出完美解决这个问题

文章图片

用户管理功能：这个模块到时候要做权限控制，只允许超级管理员控制！！看要不要做角色列表，新增页面做角色分配，根据角色分配权限，考虑做吧。！！！！！！！！！！！！！！！！！！！！！！！！！！！！！！！！

文章图片

文章图片

包括

新增用户功能（用户名不可修改）
搜索用户功能（采用分页xml见上图2）
修改用户功能（做得比较简单，还有要不要涉及权限的问题）
删除用户功能
编辑用户功能
分配角色功能
修改用户状态功能（state为0不可登录）

其他的没有遇到什么特别的困难
商品功能：简述：大体分为两部分功能1商品列表2商品分类

文章图片

1商品列表
用来展示商品信息，包括（新增，修改，删除，搜索）
其中修改和新增中的分类从数据库分类里获取，保证每个商品都对应一个分类
新增的商品中商品的名称从供应商能供应的货物（做数据剔除：已经存在的商品要剔除）中选择，新增商品其实就是一个进货的过程，由管理员输入数据。
新增商品中优化用户体验，可直接在此页面新增分类！
删除之前先判断订单中是否包含该商品，订单含有该商品不予删除
2分类

文章图片

用来展示分类列表（包括新增，编辑，查询）和属于他的商品
新增注意新增id不可重复，作为分类id

文章图片

编辑时，编辑一个分类时，如果这个分类下面有商品，那么这些商品的所属分类也要跟着改变。根据要修改的分类id获取原先的名称（作为查询条件），先去更改product表中商品的分类信息，再去修改分类表中的信息。

文章图片

删除时，若一个分类下有商品，那么不予删除，先要求删除子分类

文章图片

前面提到那个语句不能搜索出不包含商品的分类，那么要提供多一个接口，获取所有分类名字，给前端做对比，把没有的分类加进去展示（后端没有处理好，应该可以更简单一点）
供应商页面和product页面几乎完全一样。地址选择换了级联选择器。
并且稍加处理提升用户体验。
供应商页面：供应商id，名称，地址，电话，可供应的商品（一种）。每一个销售单应该由一个供应商提供
供应商的商品可以随便填吧，相当于找供应商，那是可以随便的，但是商品管理中，你要添加商品，那必须先有供应商，不然哪里来的商品呢？商品页面的添加商品，相当于就是在进货的过程，从供应商获取的商品列表应该先做剔除，只允许添加还未添加的商品，存在两个一模一样的商品不合适。
【vue|仓管系统设计】首先要进货才能销售，待销售单的数量如果大于商品数量，那不可以销售成功，销售单由待销售单转化而成。
删除供应商时，如果商品库还存在该供应商提供的商品，那么会导致商品点击查找供应商失败，还会导致完成订单时，无法插入供应商信息。
客户管理页面 customer_id
customer_name
customer_phone
customer_gender(下拉列表，男或女)
customer_email
customer_vip(客户vip等级)会员：白银vip，黄金vip，钻石vip，黑金vip。根据会员积分决定，刚注册时，默认为普通vip。
积分制度（消费一元可以获得1积分，每一笔订单额外+100）

会员等级	所需积分	会员特权
普通vip	0	9.8折
白银vip	888	9.5折
黄金vip	2888	9折
钻石vip	5888	8.8折
黑金vip	8888	8折

customer_order 该客户的订单列表，直接吧销售订单归在他的子集？scope row按钮显示详情。暂时还没做。。到时候看怎么关联
和product页面几乎完全一样。
销售单管理，待销售订单管理本系统由用户驱动~用户先下单（产生待销售单），这时候如果商品库中的商品满足客户需求（商品存在库存数量大于用户需求数量），这时候可以直接发货，等待订单完成即可。不满足，去进货（添加商品）,商品不存在？就去找供应商！
销售单管理:
应该和商品列表差不多，可以查询各个销售单的记录字段包括：销售订单id，操办人（在销售订单点击销售完成后记录session里取），销售时间（管理员填入），和待销售订单应该有关联，待销售订单点击销售完成后，待销售订单变为销售订单，点击完成时要记录销售人是谁。
待销售订单管理：
注意：销售单里的商品数量不能超过product表里的number，订单中的商品应该只有一种，因为是仓库又不是购物！所以一个
字段：

字段	类型	说明
order_id	string	订单编号，自动生成（主键），由时间+订单编号组成唯一订单编号
order_provider	string	（销售单）供应商名称，选择商品后自动带出（外键）不可编辑，根据商品自动去数据库搜索供应商并插入
order_admin1	string	经办人（管理员）名字，新增订单时从sessionStorage里取user名字（外键）（定死）
order_admin2	string	经办人（管理员）名字，完成订单时从sessionStorage里取user名字（外键）（销售单）（定死）
order_product	string	订单商品，随便输入
order_number	int	这里的产品不一定存在数据库中，所以可能导致无法自动计算出价格，那就由管理员手动输入订单金额（预估），后面，销售单里的产品肯定存在数据库，可以计算下成本价格，对比这里输入的金额来评估这份订单的盈利情况
order_price	double	下单时由管理员输入，可供计算盈亏
order_time1	date	取下单时系统时间（定死）
order_time2	date	取完成订单系统时间（定死）（销售单）
order_remark	string	订单备注。管理员输入
order_is_pay	1/0	标签形式展示，操作栏提供按钮给管理员操作，
order_is_sale	1/0	不展示给用户，用来区分是销售单还是待销售单
order_customer	string	下单的客户，要多做一个客户表单，从customer表获取

表格操作栏： 1.已付款显示完成订单按钮，未付款显示确认付款按钮，按了之后对应字段的值更新为1（order_is_pay,order_is_sale）
2.确认收货。改变order_is_sale为1，然后就变成销售单了
总结上面两个功能共用一张表order，根据order_is_sale字段判断他是销售单还是待销售单。两个表格要的数据好像差不多相同，只是各自展示不同字段
销售报表统计销售报表统计：这个放到最后做。准备用echarts做。到时候看看数据怎么导合适

文章图片

新增锁屏功能新加一个vuex的使用。存储锁屏状态和锁屏密码，锁屏后不可以访问其他页面（登录除外），要么输入密码返回锁屏前的界面，要么退出返回登录界面，全局路由拦截，只有密码正确，再去更改vuex的lock字段为false。
点击锁屏触发
用户有输入密码则更新vuex里锁屏状态，然后进行锁屏。