关于爱购

关于项目

项目开始

项目人员

    本次项目参与人员两名，一位负责前台页面的动态显示与功能，一位负责后台页面的动态显示和增删改。（我是负责后台页面的）

项目规划

    简单模拟了下数据库需要录入的数据，以及一些表的外键关联。（项目后期发现数据库不够完善）也简单分配了下任务（每个人需要写的页面）

项目进行

    分配好任务后，两个人开始自己写自己的。过程中并没有进行过多交流

项目整合

   因为编写过程中几乎没什么交流，导致整合后出现了不少bug，大多数为数据库bug。

项目展示

项目总结

1.开始一个项目之前，一定要先对这个项目进行完整的计划。（数据库建立，页面联动以及后台的增删改的同时前台也要动态增删改）

2.编写代码的过程中，项目的结构一定要清晰，Dao层，service,servlet,util应该分开放在不同的文件夹,servlet的命名也需要加以修饰以分类。

servlet层也需要根据页面来进行分类（不同文件夹）。由于编写过程中未分类，导致servlet层过于冗长。

（附：servlet层截图）

项目过程中遇到的问题

图片显示

项目开始之前对于ImageServlet的使用不是很熟练，导致无法在网页显示本地的图片。经过本次项目已经完全掌握了图片显示与上传的步骤。

图片上传

 var uploadInst = upload.render({
                elem: '#test1' //绑定元素
                ,url: '${path}/UploadServlet' //上传接口
                ,before: function(obj){
                    //预读本地文件示例
                    obj.preview(function(index, file, result){
                        $('#demo1').attr('src', result); //图片链接（base64）
                    });
                }

test1为上传按钮的id
上传的servlet

	@MultipartConfig
	@WebServlet("/UploadServlet")
	public class UploadServlet extends HttpServlet {

    @Override
    public void service(HttpServletRequest req, HttpServletResponse res) throws ServletException, IOException {


        List<String> fileName = FileUtils.uploadFile(req);

        JSONObject obj = new JSONObject();
        obj.put("code", 0);
        obj.put("msg", ""); // 无数据显示的内容

        JSONObject data = new JSONObject();

        data.put("src", "ImageServlet?imageName="+fileName.get(0));
        data.put("imgName",fileName.get(0));
        直接把集合转成json数组
        obj.put("data", data);

        res.getWriter().write(obj.toString());
    }

图片显示

将图片的src属性改为 imageservlet？imageName =需要显示的图片名称
图片显示的Servlet

	@WebServlet("/admin/ImageServlet")
	public class ImageServlet extends BaseServlet {
        public void showImage(HttpServletRequest req, HttpServletResponse res) throws Exception{
            String imageName =req.getParameter("imageName");
            showImage(req,res,imageName);
        }

        public void showCodeImage(HttpServletRequest req, HttpServletResponse res) throws Exception {
            String s = CodeUtils.generateCodeStream(res);
            req.getSession().setAttribute(Constants.USER_LOGIN_CODE,s);
            showImage(req,res,"code_img.png");
        }

        private void showImage(HttpServletRequest req, HttpServletResponse res,String fileName) throws Exception {
			//Constants.IMAGE_PATH为某个文件夹（文件所在的文件夹）
            File file = new File(Constants.IMAGE_PATH+fileName);
            FileInputStream fis = new FileInputStream(file);
            ServletOutputStream outputStream = res.getOutputStream();
            byte [] bs = new byte[1024*1024] ;
            int i = -1 ;
            while ((i = fis.read(bs)) != -1){
                outputStream.write(bs);
                outputStream.flush();
            }
            outputStream.close();
            fis.close();
        }
	}

select二级联动

 $.ajax({
                url:'${path}/admin/GoodsTypeServlet?m=insertPage',
                success:function(data){
                    $.each(data.data,function(index,item){
                        $('#goodsTypeId').append(new Option(item.typeName,item.typeId));//往下拉菜单里添加元素
                    })
                    form.render();
                }
            });
            //二级联动，动态下拉框,查找分类对应的品牌
            form.on('select(tp)',function (data) {
                $("#selectBrand").empty();
                if (data.value){
                    $.ajax({
                        url:'${path}/admin/BrandServlet?m=selectBrand&typeId='+data.value,
                        dataType:'json',
                        success:function(data){
                            $.each(data.data,function(index,item){
                                $('#selectBrand').append(new Option(item.brandName,item.brandId));//往下拉菜单里添加元素
                                // $('#selectId').val($("#bId").val());
                            })
                            form.render(); //更新全部表单内容
                        }
                    });
                }
            })