Giter Club home page Giter Club logo

lexianmanager's Introduction

LexianManager

乐鲜电商平台全套系统开发,涉及技术java SpringMVC+MyBatis+Angualr1.3+jQuery+bootstrap3.0+Android+ReatNative

goal: 实现后端+前端+安卓端+ios

所用技术

后端:

  • java springMVC

前端:

  • angular1.3
  • bootstrap3.0
  • React-Native

数据库:

  • myBatis

项目运行界面

后台登录界面:

http://osnk57csd.bkt.clouddn.com/%E7%81%AB%E7%8B%90%E6%88%AA%E5%9B%BE_2017-07-10T15-53-43.329Z.png

后台系统界面

http://osnk57csd.bkt.clouddn.com/%E7%81%AB%E7%8B%90%E6%88%AA%E5%9B%BE_2017-07-10T15-53-06.419Z.pn

目前进度:

完成数据库搭建,后端与前端基本框架搭建。 前端使用angular构建单页应用,登录界面基本完成,实现登录功能

项目会不断更新直至完成,预计工时1周内完成网页版与后台,一周半完成安卓与ios端开发

7.10 更新:

后端:

  1. 完善登录功能,登录之后,后退回到登录界面,后端会清除相关session,避免影响下一次登录的状态
  2. 登录成功后,再进入其他链接(如登录界面),登录状态下,会自动被过滤器捕获并跳到后台登录界面
  3. 修改数据库数据,因为需求是每个不同的角色登录进入后台系统之后,菜单栏只会显示其角色的权限对应的菜单列表,但是后台查询返回的数据中,除了超级管理员角色外,其他角色都只是直接返回子项,并没有返回子项对应的大项。经过前后端协调沟通,决定修改数据库数据。增加相应的父项映射。

前端:

  1. 完成左侧菜单栏的动态创建,根据用户的权限(后端返回的权限列表)进行动态的创建(angular实现)
  2. 完成左侧菜单栏的动画交互,包括手风琴效果(bootstrap实现),点击某项active,并展开该项,同时其他大项折叠。一开始实现的想的是像jq实现选项卡,进行dom操作,后来发现bootstrap的手风琴插件,默认的就会为其他折叠项添加collapsed类,而展开项没有,就可以根据这个进行选中样式的设置(选中的项不会有collapsed类)。 而且如果按原来思路进行dom操作,要添加active类比较麻烦,因为html结构较为复杂,点击事件的target可能是a标签,strong标签,或者i标签(图标)。
  3. 完善左列菜单栏的高度问题。因为父div与左右两个子div都是内容撑开,当其中一方超长时,会把父div撑开,希望另一个子div也跟着适应父div的高度。就用到了双飞翼布局与圣杯布局里的手法。具体解决方法是:
  • 父div设置为overflow:hidden;
  • 子div分别设置padding-bottom:9999px; margin-bottom:-9999px;

7.11更新

前端:

  1. 与后端协调后决定代码重构,将管理端后台界面左侧并为一个controller,并重新设计接口,方便获取数据;
  2. 将常用方法设封装成service,如http,还有一些数据转换等,controller代码减轻很多,赏心悦目;(顺便弄懂了angular中的$q的使用)
  3. 完成退出登录,修改密码功能开发。包括修改密码时的输入验证(使用angular)
  4. 完成权限模块的一级界面的数据展示,数据从数据库获取。
  5. 将模块页面中的style抽离,整体完善html代码。

后端:

  1. 配合前端完善接口设计
  2. 完成分页功能

7.12更新

前端:

  1. 基本完成所有模块的一级路由界面的数据展示,完成各个一级路由与界面的连接。
  2. 为每个模块添加分页。封装成指令。
  3. 添加模态框,封装成指令
  4. 增加welcome页面。
  5. 因为order模块的几个获取数据都是类似的,只是返回数值的state不同(未付款,已付款,已发货等)故封装成一个service。

今日遇到的小坑:angular的指令,元素的话不能含有大写(不能驼峰),注释的话注意空格!

如: <confirmdeletemodal></confirmdeletemodal> ,

 <!-- directive:confirmdeletemodal -->
 <div></div>

7.13 更新

前端:

  1. 完成查看角色信息模块的添加,修改,和添加菜单功能。
  2. 搭建查看后台用户的二级路由。
  3. 完成板块管理的一级交互

今日遇到的坑:

  1. angular 里面的forEach是不能跳出循环的,无论是break还是return,都不生效,也不报错。(据说是因为所有的条件语句都会降低指令缓存和流水线的性能,听说c#也是如此。迭代过程不允许更改容器本身(删减元素),不允许break

解决办法, 设置一个布尔值,只有满足某条件,进入if,然后在if中设置布尔值,然后此后,因为不满足布尔值,所以无法进入if,变相实现了“跳出循环” 因为此后的循环都没有意义,进入不了if。

  1. js数组方法:splice()slice(),前者会改变原数组,而后者不会,前者接收三个参数,实现替换,操作等功能,而后者主要实现的是删除,接收两个参数。

7.14 更新

  1. 使用angular的过滤器重构一些循环,优化代码
  2. 测试调bug添加角色菜单功能,修复添加菜单角色功能后不生效的问题

7.17 更新

  1. 修复bug,用户被禁用后无法登陆。
  2. 修复bug,用户角色菜单修改后,登录时会实时更新角色菜单
  3. 修复添加管理员时,管理员描述中文乱码问题
  4. 关联角色时,会先获取其已有的角色。
  5. 完成关联角色功能。并且角色是实时获取
  6. 修复删除用户时,服务器500的问题
  7. 完成后台用户修改功能,完成后台用户的重置密码为123456功能,完成用户禁用与激活功能
  8. 完成会员vip的禁用激活功能
  9. 完成订单管理模块
  10. 完善表单验证。
  11. 完成板块管理功能

7.18 更新

  1. 完成订单模块,引入日历插件,实现按时间范围搜索订单。
  2. 优化板块管理模块代码
  3. 完成门店管理的激活禁用功能
  4. 修复bug

7.20更新

  1. 完成商品管理修改页面的表单验证。
  2. 完成商品管理修改页面的动态添加规格组
  3. 完成商品管理页面的富文本编辑器ckeditor插件的引入
  4. 完成商品管理页面主图上传,配图的上传。上传成功后显示。
  5. 完成商品管理页面所有功能。

注意点:见bug调试记录

  • ajax上传文件问题(使用formData)
  • 插件ckeditor的引入

7.26更新

  1. 完成所有模块的分页功能
  2. 完成代码合并,开发基本完成
  3. 分页功能因为写成组件,与所在scope通信是个头痛的问题:

经过长时间摸爬打滚,主要是:

  • 使用$watch监听,则pageNo,和pageSize初始化也被监听到,则会陷入死循环,如何避开初始化,而且设置监听器不太好
  • 手动触发脏检查,$apply(), $evalApply()等,虽然可以,但是会有$apply() alreadt in progress的错误信息,不爽
  • 双向绑定一个很麻烦的问题,就是指令里的selected也好,啥也好,在指令里修改ng-model的值,之后,在所在scope的controller里调用方法获取数据时,总是不能根据ng-model最新的值去获取,总是在方法执行完之后,才会刷新所在scope的ng-model,这点很头疼。

最后想到一个折中的办法,就是把获取数据的整个方法体用$timeout包裹起来。

就可以创造一个干净的脏检查环境,确保每次在请求数据时,都进行脏检查,将所有参数ng-model都更新到最新值

8.5完结更新

  1. 修复各种bug,
  2. 增添各种表单验证
  3. 引入百度地图,根据商店信息中经纬度,显示门店所在位置
  4. 完成大数据模块,利用hadoop,读取数据库资料计算分析后返回结果写入到数据库,然后提供接口,前端通过echart对数据进行可视化,实现柱形图和饼状图,可查看整体或个别门店的数据统计情况
  5. 安卓的前后台也po上来了。
  6. ios端完成基本页面,使用react-native。但是要投身秋招了,所以可能要告一段落。😶

bug调试修复记录

环境搭建

为了方便大家导入我们的项目并跑起来:

开发的环境是eclipse java ee + mysql

注意修改数据库配置文件,在java资源下config的db.properies文件,修改用户名密码为自己的数据库的。

记得导入数据,数据文件在db目录下的.sql文件中,在数据库中执行sql脚本即可完成数据导入。

最后如果项目导入报错,有可能是由于.class文件问题,只需要把build目录下的.class文件删掉即可(毕竟是编译文件,重新编译即可,而且在我的环境下编译的.class文件下可能到了各位的电脑中环境不一样,而会导致报错。)

希望能帮到各位~

欢迎star与关注( ̄▽ ̄)~

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.