近期，用了将近一个月的时间，完成了一个仓储请领系统的设计，功能包括购物车、excel自动生成打印、系统内搜索、多用户访问和流程控制。虽然完成了所有功能，但是一方面由于php，jquery，css和html都写在了一起，一个页面多达千行，另一方面由于数据库设计的不合理，导致整个系统难以维护，几乎变成了一个一次性的玩意，教训极为深刻。我觉得很有必要总结一下。
技术栈 php+mysql+jquery
1、购物车：购物车涉及到跨页数据交换问题，前端之间数据交换两种方法：cookie和localStorage，前端向后端传递数据有一种方法：submit，后端向前端传递数据有一种方法：echo，后端之间传递数据两种方法：数据库与session。localStorage是h5的新特性，调用和维护十分方便，cookie应用时间比较久，更加成熟，操作起来就是简单赋值。开始我很天真的选择使用cookie保存购物车数据，选用localStorage维护登录用户，cookie还好，除了url和json编码解码经常被绕晕之外一切顺利，localStorage就很无语了，因为涉及到大量后台操作，我测试发现php根本不支持localStorage，所以取得登录用户之后几乎每个页面都必须要设计一个隐藏的form来submit给后端，十分肉痛。事后想想，其实除了主界面使用静态页面提高响应速度之外，其他的界面应该统一标准，使用session统一管理就没有这些问题了。还有就是图省事，没解码把购物车json数据直接丢数据库里了，导致购物车数据库结构只有我能看懂，估计过几个月连我也看不懂了，悲剧。
请领界面
cookie中保存的购物车数据
localStorage中保存的用户登录信息
购物车界面
购物车数据库，cart项居然是个json，也不知道当时怎么想的
2、excel自动生成打印：管理员审核通过之后，可以自动生成申请单。这个主要是链接数据库，调用phpexcel类库，按照公文格式设置excel，比较简单。最复杂的是根据流水单号生成条形码，我使用的是国际通用的39号条形编码，（听起来高大上，但是很简单，对着官网API抄就行了，根本不需要理解为什么叫39），生成条形码的思路就是在phpexcel类库中把流水单号先转成图片格式，存在本地，然后再插入到excel中去，因为网上基本上没有这方面资料，就是凭着感觉试，还好试成功了。下图的红框是关键步骤。还有一个坑点就是为了图省事，我流水单号用的是中文的，因为好识别嘛，一看就知道是谁，然后过程中转码之蛋疼，谁试谁知道，“二维码最好用英文或数字来编码”，这是多么痛的领悟。。。
点击请领后进度条刷新，此处可生成excel表格
自动生成的excel，已经输入好了所有信息
生成excel中调用数据库的关键代码
设置excel格式
自动合成的条形码图片
插入条形码图片的关键步骤
中文条形码的操作极为不便
3、搜索功能：界面很简单就是类似于百度那样，一个奇丑无比的长方形框。原理也不难，如果搜索本地数据库，使用ajax链接数据库，
SELECT * from table where
concat(ifnull(type,''),ifnull(name,''),ifnull(director,''),ifnull(state,''),
ifnull(unit,''),ifnull(place,'')) like'%".$inputData."%' ;
关键在于使用concat(ifnull()),这样可以对多个字段进行模糊查询，
concat(ifnull())控制返回搜索结果的数量，使用like %控制搜索规模。如果搜索全网，就要使用jsonp设置callback来接收数据，如果能链接到外部网络，就能让用户用百度来搜索他们想要的数据。如下图，用百度搜索我的名字，百度用了160毫秒返回一个名叫jQuery18208871294147486224_1513418664343的结果，其中包含10个搜索结果，结果被封装为一个叫做s的数组，那么你使用event.data.s就可以了。
使用jsonp跨域调用百度
4多用户访问和流程控制：对于涉及到多种操作的后端界面，我建议每次提交都交给自己，然后在php中设置判断，这能有效减轻工作量，缺点就是代码太长，不好维护，仁者见仁吧。还有就是美工问题，就是那个绿的进度条，css中的背景定位position和float简直是两大神坑，变化太多又找不到规律，按书上给的公式算又不准，无比纠结，如下图，你们应该知道我经历了什么吧。
流程控制
多类型响应的自身调用
对于position的无奈
网友评论