购物车管理系统-优快云博客

本文链接：https://blog.youkuaiyun.com/weixin_39468277/article/details/77550057

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%
   String path = request.getContextPath();
   String basePath = request.getScheme() + "://"
           + request.getServerName() + ":" + request.getServerPort()
           + path + "/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<base href="<%=basePath%>">

<title>My JSP 'index.jsp' starting page</title>
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">

<link rel="stylesheet" type="text/css"
   href="css/bootstrap-theme.min.css">
<script type="text/javascript" src="jquery/angularjs.js"></script>
<script type="text/javascript" src="jquery/jquery-1.8.3.js"></script>
<script type="text/javascript" src="js/bootstrap.min.js"></script>
<link rel="stylesheet" type="text/css" href="css/bootstrap.min.css">
<style type="text/css">
</style>
</head>
<script type="text/javascript">
    var app = angular.module('DemoApp', []);
    app.controller('CartController', function ($scope, $http) {
            $http.post('http://localhost:8080/shopping/shop/selectShop')
            .success(function (response) {
             $scope.ShoppingCar = response;
            });
    $scope.reduce=function(index){
       --$scope.ShoppingCar[index].count;
       if($scope.ShoppingCar[index].count>0){
       $http.post("http://localhost:8080/shopping/shop/reduceShop?product.id="+$scope.ShoppingCar[index].product.id+"&id="+$scope.ShoppingCar[index].id+"&product.price="+$scope.ShoppingCar[index].product.price);
       }
    }
    $scope.add=function(index){
       ++$scope.ShoppingCar[index].count;
       if($scope.ShoppingCar[index].count>0){
       $http.post("http://localhost:8080/shopping/shop/addShop?product.id="+$scope.ShoppingCar[index].product.id+"&id="+$scope.ShoppingCar[index].id+"&product.price="+$scope.ShoppingCar[index].product.price);
       }
    }
   $scope.remove=function(index){
       if(confirm("是否删除该商品")){
          $http.post('http://localhost:8080/shopping/shop/deleteShop?sid='+$scope.ShoppingCar[index].id);
          $scope.ShoppingCar.splice(index,1);
       }
   }
   $scope.totleprice=function(){
       var totle=0;
       angular.forEach($scope.ShoppingCar,function(obj,key){
           totle += obj.product.price*obj.count;
       });
       return totle;
   }

   $scope.$watch("ShoppingCar",function(newValue,oldValue){
       angular.forEach($scope.ShoppingCar,function(obj,key){
           if(obj.count<1){
               if(confirm("是否删除该商品")){
               $http.post('http://localhost:8080/shopping/shop/deleteShop?sid='+$scope.ShoppingCar[key].id);
              $scope.ShoppingCar.splice(key,1);
               }else {
               $scope.ShoppingCar[key].count=oldValue[key].count;
           }
           }
       })
   },true)
   $scope.clear=function(){
       if(confirm("是否清空购物车")){
       $http.post('http://localhost:8080/shopping/shop/deleteShop?sid=0');
           $scope.ShoppingCar={};
       }
   }
   $scope.buyche=function(){
       if(confirm("是否购买")){
       var ids = [];
       $(".ids:checked").each(function(){
           ids.push($(this).val());
       });
       location.href="http://localhost:8080/shopping/shop/buycheShop?ids="+ids.join(",");

       }
   }


        });

</script>

<body>
   <div class="container" ng-app="DemoApp" ng-controller='CartController'>
   <div align="right"><button type="button" ng-click="clear()" class="btn btn-danger">清空购物车</button></div>
       <table class="table table-striped table-bordered table-hover">
           <thead>
               <tr>
                   <td><input type="checkbox" ng-model="checked" ></td>
                   <th>名称</th>
                   <th>价格</th>
                   <th>个数</th>
                   <th>价格小计</th>
                   <th>操作</th>
               </tr>
           </thead>
           <tbody>
               <tr ng-repeat="item in ShoppingCar">
                   <td><input type="checkbox" class="ids" value="{{item.id}}" ng-checked="checked"></td>
                   <td>{{item.product.name}}</td>
                   <td>{{item.product.price}}</td>
                   <td>
                   <button type="button" class="btn btn-success" ng-click="(reduce($index))">-</button>
                   <input value="{{item.count}}" ng-model="item.count" style=" text-align:center; width: 30px">
                   <button type="button" class="btn btn-success" ng-click="(add($index))">+</button>
                   </td>
                   <td>{{item.product.price*item.count}}</td>
                   <td>
                       <button type="button" ng-click="(remove($index))" class="btn btn-danger">删除</button>
                   </td>
               </tr>
               <tr >
                   <td colspan="5">共计：￥{{totleprice()}}</td>
                   <td>
               <button type="button" ng-click="buyche()" class="btn btn-success">购买</button></td>
               </tr>
           </tbody>

       </table>
       <div ng-show="!ShoppingCar.length">购物车空空，快去<a href="product/selectProduct">逛逛</a>吧</div>
   </div>
</body>
</html>

购物车系类_前台也面