Merge branch 'master' of http://gitlab.fox-hound.co.jp/shoei.kanno/Ecsite into 管理機能(商品新規登録、編集、削除)

# Conflicts:
#	src/main/java/com/example/service/ShoesService.java
#	src/main/resources/static/upload/スニーカー3.jpg

src/main/java/com/example/SecurityConfig.java

@@ -14,7 +14,7 @@ public class SecurityConfig extends WebSecurityConfigurerAdapter{
 	
 	@Override
 	public void configure(WebSecurity web) throws Exception{
-		web.debug(false).ignoring().antMatchers("/images/**", "/js/**", "/css/**", "/fonts/**");
+		web.debug(false).ignoring().antMatchers("/images/**", "/js/**", "/css/**", "/fonts/**", "/limited/inputCart");
 	}
 	
 	@Override

src/main/java/com/example/api/EcsiteRestController.java

@@ -3,33 +3,35 @@ package com.example.api;
 import java.sql.Date;
 import java.time.LocalDate;
 import java.util.ArrayList;
+import java.util.HashMap;
+
+import javax.servlet.http.HttpSession;
 
 import org.springframework.beans.factory.annotation.Autowired;
 import org.springframework.security.crypto.password.Pbkdf2PasswordEncoder;
 import org.springframework.ui.Model;
-import org.springframework.web.bind.annotation.ModelAttribute;
 import org.springframework.web.bind.annotation.PostMapping;
 import org.springframework.web.bind.annotation.RequestBody;
 import org.springframework.web.bind.annotation.RequestMapping;
 import org.springframework.web.bind.annotation.RestController;
 import org.springframework.web.bind.annotation.SessionAttributes;
 
-import com.example.domain.Cart;
-import com.example.domain.CartData;
+import com.example.domain.ItemData;
+import com.example.domain.Items;
 import com.example.domain.User;
+import com.example.service.ItemsService;
 import com.example.service.LoginUserDetailsService;
 
 @RestController
 @RequestMapping("limited")
-//@SessionAttributes(names ="cart")
+@SessionAttributes(names ="itemData")
 public class EcsiteRestController {
 	@Autowired
 	LoginUserDetailsService loginUserDetailsService;
-	
-	@ModelAttribute("cart") // (1)
-	public ArrayList<Cart> setSessionData(ArrayList<Cart> arrayList) {
-	    return arrayList;
-	}
+	@Autowired
+	ItemsService itemsService;
+	@Autowired
+	HttpSession session;
 	
 	@PostMapping("signUp")
 	public User createUser(@RequestBody User user) {
@@ -44,10 +46,15 @@ public class EcsiteRestController {
 	}
 	
 	@PostMapping("inputCart")
-	public void inputCart(@RequestBody CartData data, Model model) {
-		Cart cart = new Cart();
-		cart.setCart(data.getShoesId(), data.getQuantity());
-		//return cart.getCart();
+	public void inputCart(@RequestBody ItemData data, HashMap<String, Items> cart) {
+		if(session.getAttribute("cart") == null){
+			cart.put((data.getShoesId()).toString(), itemsService.findOne(data.getShoesId(),data.getQuantity()));
+			session.setAttribute("cart", cart);
+		}else{
+			cart = (HashMap<String, Items>) session.getAttribute("cart");
+			cart.put((data.getShoesId()).toString(), itemsService.findOne(data.getShoesId(),data.getQuantity()));
+			session.setAttribute("cart", cart);
+		}
 	}
 	
 }
\ No newline at end of file

src/main/java/com/example/domain/CartData.java → src/main/java/com/example/domain/ItemData.java

@@ -8,7 +8,7 @@ import lombok.Setter;
 @Component
 @Setter
 @Getter
-public class CartData{
+public class ItemData{
 	private Integer shoesId;
 	private Integer quantity;
 }
\ No newline at end of file

src/main/java/com/example/domain/Cart.java → src/main/java/com/example/domain/Items.java

 package com.example.domain;
 
 import java.io.Serializable;
-import java.util.ArrayList;
 
 import org.springframework.context.annotation.Scope;
 import org.springframework.context.annotation.ScopedProxyMode;
 import org.springframework.stereotype.Component;
 
-import com.example.service.ShoesService;
-
 import lombok.Getter;
 import lombok.Setter;
 
@@ -16,7 +13,7 @@ import lombok.Setter;
 @Scope(value= "session", proxyMode = ScopedProxyMode.TARGET_CLASS)
 @Getter
 @Setter
-public class Cart implements Serializable{
+public class Items implements Serializable{
 	/**
 	 * 
 	 */
@@ -29,33 +26,4 @@ public class Cart implements Serializable{
 	private Integer quantity;
 	private Integer price;
 	private Integer productStatus;
-	
-	
-	public void setCart(Integer shoesId, Integer quantity) {
-		System.out.println(shoesId);
-		Shoes shoes = new Shoes();
-		ShoesService shoesService = new ShoesService();
-		shoes = shoesService.findOne(shoesId);
-		//System.out.println(shoes);
-//		this.shoesId = shoesId;
-//		this.photo = shoes.getPhoto();
-//		this.shoesName = shoes.getName();
-//		this.shoesSize = shoes.getSize();
-//		this.quantity = quantity;
-//		this.price = shoes.getPrice() * quantity;
-//		System.out.print(this.price);
-	}
-	
-	public ArrayList<Cart> getCart(){
-		ArrayList<Cart> cartList = new ArrayList<Cart>();
-		Cart data = new Cart();
-		data.getShoesId();
-		data.getPhoto();
-		data.getShoesName();
-		data.getShoesSize();
-		data.getQuantity();
-		data.getPrice();
-		cartList.add(data);
-		return cartList;
-	}
 }
\ No newline at end of file

src/main/java/com/example/service/ItemsService.java

+package com.example.service;
+
+import org.springframework.beans.factory.annotation.Autowired;
+import org.springframework.stereotype.Service;
+
+import com.example.domain.Items;
+import com.example.domain.Shoes;
+import com.example.repository.ShoesRepository;
+
+import lombok.Data;
+
+@Service
+@Data
+public class ItemsService {
+	@Autowired
+	ShoesRepository shoesRepository;
+	
+	public Items findOne(Integer shoesId, Integer quantity){
+		Items items = new Items();
+		Shoes shoes = new Shoes();
+		shoes = shoesRepository.findOne(shoesId);
+		items.setShoesId(shoesId);
+		items.setPhoto(shoes.getPhoto());
+		items.setShoesName(shoes.getName());
+		items.setShoesSize(shoes.getSize());
+		items.setQuantity(quantity);
+		items.setPrice(shoes.getPrice() * quantity);
+		items.setProductStatus(shoes.getProductStatus());
+		return items;
+	}
+}

src/main/java/com/example/web/EcsiteController.java

@@ -4,8 +4,11 @@ import java.io.ByteArrayOutputStream;
 import java.io.FileInputStream;
 import java.sql.Date;
 import java.util.ArrayList;
+import java.util.HashMap;
 import java.util.List;
 
+import javax.servlet.http.HttpSession;
+
 import org.springframework.beans.factory.annotation.Autowired;
 import org.springframework.security.core.annotation.AuthenticationPrincipal;
 import org.springframework.stereotype.Controller;
@@ -14,6 +17,7 @@ import org.springframework.web.bind.annotation.GetMapping;
 import org.springframework.web.bind.annotation.PathVariable;
 import org.springframework.web.bind.annotation.RequestMapping;
 
+import com.example.domain.Items;
 import com.example.domain.SalesLog;
 import com.example.domain.Shoes;
 import com.example.domain.User;
@@ -29,6 +33,8 @@ public class EcsiteController {
 	
 	@Autowired
 	SalesLogService salesLogService;
+@Autowired
+HttpSession session;
 	
 	//写真の表示用メソッド
 	public String photoView(String Photo) {
@@ -78,15 +84,16 @@ public class EcsiteController {
 	public String list(Model model,  @AuthenticationPrincipal LoginUser userDetails) {
 		//靴の情報をすべて取得
 		List<Shoes> shoes = shoesService.findAll();
+		System.out.println(shoes);
 		//靴の情報を一括で取得するmodel(Idでの降順表示設定済み)
 		model.addAttribute("shoes", shoes);
 		//靴を表示するための処理を全画像にかける
-		List <String> shoesPhoto = new ArrayList<String> ();
-		for(int i = 0; i < shoes.size(); i++) {
-			shoesPhoto.add((shoes.get(i)).getPhoto());
-		}
+//		List <String> shoesPhoto = new ArrayList<String> ();
+//		for(int i = 0; i < shoes.size(); i++) {
+//			shoesPhoto.add((shoes.get(i)).getPhoto());
+//		}
 		//靴の処理した画像を一括で取得する
-		model.addAttribute("shoesPhoto", shoesPhoto);
+//		model.addAttribute("shoesPhoto", shoesPhoto);
 		
 		//user情報取得、格納
 		User user = userDetails.getUser();
@@ -116,9 +123,15 @@ public class EcsiteController {
 	}
 	
 	@GetMapping("cart")
-	public String Cart(Model model, @AuthenticationPrincipal LoginUser userDetails){
+	public String Cart(Model model, @AuthenticationPrincipal LoginUser userDetails, HashMap<String, Items> items, ArrayList <Items> cart){
 		User user = userDetails.getUser();
 		model.addAttribute("user", user);
+		items = (HashMap<String, Items>) session.getAttribute("cart");
+		for(int i = 0; i < items.size(); i++){
+			String key = String.valueOf(i);
+			cart.add(items.get(key));
+		}
+		System.out.println((cart.get(1)).getShoesName());
 		return "Cart";
 	}
 }

src/main/resources/static/css/style.css

@@ -1879,7 +1879,7 @@ th, td {
 
 /* list画面 */
 #listBox {
-    background-color: #FDF5E6;
+    /*background-color: #FDF5E6;*/
     height: 100%;
     display: flex;
     flex-direction: row;
@@ -1887,9 +1887,10 @@ th, td {
 }
 
 .productBox {
-    height: 30%;
+	background-color: #FDF5E6;
+    height: 400px;
     width: 30%;
-    border: 1px solid black;
+    /*border: 1px solid black;*/
     margin: 5px;
 }
 
@@ -1931,4 +1932,31 @@ th, td {
 .button-link:hover {
 	cursor: pointer ;
 	color: #f00 ;
+}
+
+.details {
+	width: 150px;
+    height: 50px;
+    font-weight: bold;
+    font-size: small;
+    background-color: #1abc9c;
+    border-radius: 3px;
+    border:none;
+    color: #000;	
+}
+
+.detailsBtn, .shoeImage, .shoeName, .shoePrice, .shoeImageDiv{
+	text-align: center;
+}
+
+.productBox {
+	margin: 0 auto;
+}
+
+.shoeImageDiv{	
+	margin-top: 45px;
+}
+
+.shoeName {
+	margin-top: 10px;
 }
\ No newline at end of file

src/main/resources/static/js/list.js

 $(function(){
-	$("#modal-open").click(function(event){
-    $('#showName').empty();
-    $('#showPrice').empty();
-    //以下デモ参照
-		//キーボード操作などにより、オーバーレイが多重起動するのを防止する
-		// $( this ).blur() ;	//ボタンからフォーカスを外す
-		// if( $( "#modal-overlay" )[0] ) return false ;		//新しくモーダルウィンドウを起動しない (防止策1)
-		// //if($("#modal-overlay")[0]) $("#modal-overlay").remove() ;		//現在のモーダルウィンドウを削除して新しく起動する (防止策2)
-
-		//オーバーレイを出現させる
-		$( "body" ).append( '<div id="modal-overlay"></div>' ) ;
-		$( "#modal-overlay" ).fadeIn( "slow" ) ;
-
-		//コンテンツをセンタリングする
-		centeringModalSyncer() ;
-
-		//コンテンツをフェードインする
-    $( "#modal-content" ).fadeIn( "slow" ) ;
-    
-
-    //一覧画面から情報取得
-    let nameField = document.createElement("a");
-    let priceField = document.createElement("a");
-    let name = $(event.target.parentNode.children[1].textContent);
-    let price =$(event.target.parentNode.children[2].textContent);
-    nameField.textContent = name.selector;
-    $('#showName').append(nameField);
-    priceField.textContent = price.selector;
-    $('#showPrice').append(priceField);
-
-		//[#modal-overlay]、または[#modal-close]をクリックしたら…
-		$( "#modal-overlay,#modal-close" ).unbind().click( function(){
-
-			//[#modal-content]と[#modal-overlay]をフェードアウトした後に…
-			$( "#modal-content,#modal-overlay" ).fadeOut( "slow" , function(){
-
-				//[#modal-overlay]を削除する
-				$('#modal-overlay').remove() ;
-
+	$(".details").each(function() {
+		
+		$(".details").click(function(event){
+		    $('#showName').empty();
+		    $('#showPrice').empty();
+		    $('#showId').empty();
+		    //以下デモ参照
+			//キーボード操作などにより、オーバーレイが多重起動するのを防止する
+			// $( this ).blur() ;	//ボタンからフォーカスを外す
+			// if( $( "#modal-overlay" )[0] ) return false ;		//新しくモーダルウィンドウを起動しない (防止策1)
+			// //if($("#modal-overlay")[0]) $("#modal-overlay").remove() ;		//現在のモーダルウィンドウを削除して新しく起動する (防止策2)
+	
+			//オーバーレイを出現させる
+			$( "body" ).append( '<div id="modal-overlay"></div>' ) ;
+			$( "#modal-overlay" ).fadeIn( "slow" ) ;
+	
+			//コンテンツをセンタリングする
+			centeringModalSyncer() ;
+		
+			//コンテンツをフェードインする
+		    $( "#modal-content" ).fadeIn( "slow" ) ;
+		    
+		
+		    //一覧画面から情報取得
+		    let nameField = document.createElement("p");
+		    let priceField = document.createElement("p");
+		    let idField = document.createElement("input");
+		    idField.setAttribute("type", "hidden");
+		    let name = $(event.target.parentNode.children[1].textContent);
+		    let price =$(event.target.parentNode.children[2].textContent);
+		    let id =$(event.target.parentNode.children[3].value);
+		    nameField.textContent = name.selector;
+		    $('#showName').append(nameField);
+		    priceField.textContent = price.selector;
+		    $('#showPrice').append(priceField);
+		    idField.value = id.selector;
+		    $('#showId').append(idField);
+		
+			//[#modal-overlay]、または[#modal-close]をクリックしたら…
+			$( "#modal-overlay,#modal-close" ).unbind().click( function(){
+	
+				//[#modal-content]と[#modal-overlay]をフェードアウトした後に…
+				$( "#modal-content,#modal-overlay" ).fadeOut( "slow" , function(){
+	
+					//[#modal-overlay]を削除する
+					$('#modal-overlay').remove() ;
+	
+				} ) ;
+	
 			} ) ;
-
 		} ) ;
-
-	} ) ;
+	
+	});
 
 	//リサイズされたら、センタリングをする関数[centeringModalSyncer()]を実行する
 	$( window ).resize( centeringModalSyncer ) ;
@@ -69,3 +78,28 @@ $(function(){
 } ) ;
 
 
+
+
+
+//モーダル表示
+//let details = document.getElementsByClassName("js-modal-open");
+//$(".js-modal-open").each(function() {	
+//	$(".js-modal-open").on("click", function(){
+//		$('.js-modal').fadeIn();
+//		return false;
+//	});
+//	$(".js-modal-close").on("click", function(){
+//		$('.js-modal').fadeIn();
+//		return false;
+//	});
+//});
+
+
+
+//モーダル内情報表示
+
+//モーダルフォーム送信
+//$('#ok-btn').on('click', function(){
+//	
+//});
+

src/main/resources/templates/index.html

@@ -9,8 +9,8 @@
         <meta name="viewport" content="width=device-width, initial-scale=1"/>
       	<link rel="icon" href="images/favicon.png" th:href="@{/images/favicon.png}"/>
         <link rel="stylesheet" href="css/style.css" th:href="@{/css/style.css}"/>
-		<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta/css/bootstrap.min.css" 
-            integrity="sha384-/Y6pD6FV/Vv2HJnA6t+vslU6fwYXjCFtcEpHbNJ0lyAFsXTsjBbfaDjzALeQsN6M" crossorigin="anonymous"/>
+		<!-- <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta/css/bootstrap.min.css" 
+            integrity="sha384-/Y6pD6FV/Vv2HJnA6t+vslU6fwYXjCFtcEpHbNJ0lyAFsXTsjBbfaDjzALeQsN6M" crossorigin="anonymous"/> -->
         <!--[if lt IE 9]>
             <script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script>
             <script>window.html5 || document.write('<script src="js/vendor/html5shiv.js"><\/script>')</script>
@@ -60,7 +60,14 @@
                         </button>
                         <a class="navbar-brand" href="#"><b>L</b>imited</a>
                     </div>
-
+					<!-- Collect the nav links, forms, and other content for toggling -->
+                    <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
+                        
+                        <ul class="nav navbar-nav navbar-right cart-menu">
+                        <li><a href="#" class="search-btn"><i class="fa fa-search" aria-hidden="true"></i></a></li>
+                        <li><a href="#"><span> Cart</span> <span class="shoping-cart">0</span></a></li>
+                    </ul>
+                    </div><!-- /.navbar-collapse -->
 
                     <!--検索機能のためいらないと判断(宮嶋)-->
                     <!-- Collect the nav links, forms, and other content for toggling -->

src/main/resources/templates/list.html

@@ -16,46 +16,48 @@
         <![endif]-->
     </head>
     <body>
-     <!-- モーダル中身 -->
-    <div id="modal-content">
-      <div id="modal-content-innar">
-        <!-- モーダルウィンドウのコンテンツ開始 -->
-        <img class="shoeImage" alt="productImage"/>
-        <div id="showName"></div>
-        <div id="showPrice"></div>
-        
-        <p><a id="modal-close" class="button-link">閉じる</a></p>
-        <button type="button" class="cartBtn">cartへ入れる</button>
-      </div>
-      <!-- モーダルウィンドウのコンテンツ終了 -->
+    
+	<!-- モーダル中身 -->
+   	<div id="modal-content">
+		<div id="modal-content-innar">
+	        <!-- モーダルウィンドウのコンテンツ開始 -->
+	        <img class="shoeImage" alt="productImage"/>
+	        <div id="showName"></div>
+	        <div id="showPrice"></div>
+	        <div id="showId"></div>
+	        <p><a id="modal-close" class="button-link">閉じる</a></p>
+	        <button type="button" class="cartBtn">cartへ入れる</button>
+	      </div>
     </div>
+    <!-- モーダルウィンドウのコンテンツ終了 -->
+   
 
-    <section class="header-top-section">
-        <div class="container">
-            <div class="row">
-                <div  class="col-md-6">
-                    <div class="header-top-content">
-                        <ul class="nav nav-pills navbar-left">
-                            <li><a href="#"><i class="pe-7s-call"></i><span>123-123456789</span></a></li>
-                            <li><a href="#"><i class="pe-7s-mail"></i><span> info@mart.com</span></a></li>
-                        </ul>
-                    </div>
-                </div>
-                <div  class="col-md-6">
-                    <div class="header-top-menu">
-                        <ul class="nav nav-pills navbar-right">
-                            <!-- 履歴ページへ遷移 -->
-                            <li><a th:href="@{/limited/log/{id}(id=${user.id})}">My Purchase Log</a></li>
-                            <!-- カートページへ遷移 -->
-                            <li><a th:href="@{/cart}">Cart</a></li>
-                            <!-- ログアウト -->
-                            <li><form th:action="@{/logout}" method="post"><input type="submit" value="logout" style="border:none;background-color:transparent;text-decoration:none;" class="logoutBtn"/></form></li>
-                        </ul>
-                    </div>
-                </div>
-            </div>
-        </div>
-    </section>
+	    <section class="header-top-section">
+	        <div class="container">
+	            <div class="row">
+	                <div  class="col-md-6">
+	                    <div class="header-top-content">
+	                        <ul class="nav nav-pills navbar-left">
+	                            <li><a href="#"><i class="pe-7s-call"></i><span>123-123456789</span></a></li>
+	                            <li><a href="#"><i class="pe-7s-mail"></i><span> info@mart.com</span></a></li>
+	                        </ul>
+	                    </div>
+	                </div>
+	                <div  class="col-md-6">
+	                    <div class="header-top-menu">
+	                        <ul class="nav nav-pills navbar-right">
+	                            <!-- 履歴ページへ遷移 -->
+	                            <li><a th:href="@{/limited/log/{id}(id=${user.id})}">My Purchase Log</a></li>
+	                            <!-- カートページへ遷移 -->
+	                            <li><a th:href="@{/cart}">Cart</a></li>
+	                            <!-- ログアウト -->
+	                            <li><form th:action="@{/logout}" method="post"><input type="submit" value="logout" style="border:none;background-color:transparent;text-decoration:none;" class="logoutBtn"/></form></li>
+	                        </ul>
+	                    </div>
+	                </div>
+	            </div>
+	        </div>
+	    </section>
 
         <header class="header-section">
             <nav class="navbar navbar-default">
@@ -70,6 +72,14 @@
                         </button>
                         <a class="navbar-brand" href="#"><b>L</b>imited</a>
                     </div>
+                    <!-- Collect the nav links, forms, and other content for toggling -->
+                    <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
+                        
+                        <ul class="nav navbar-nav navbar-right cart-menu">
+                        <li><a href="#" class="search-btn"><i class="fa fa-search" aria-hidden="true"></i></a></li>
+                        <li><a href="#"><span> Cart</span> <span class="shoping-cart">0</span></a></li>
+                    </ul>
+                    </div><!-- /.navbar-collapse -->
                 </div>
             </nav>
         </header>
@@ -92,24 +102,13 @@
         <div id="listBox">
             <!--each分でくりかえす(宮嶋)-->
             <div class="productBox" th:each="shoe : ${shoes}">
-                <img class="shoeImage" src="images/スニーカー3.jpg" alt="productImage"/>
-                <a th:text= "${shoe.name}" class="shoeName">AirMAX</a>
-                <a th:text = "${shoe.price}" class="shoePrice">￥10,000</a>
-                <button type="button" id="modal-open" class="button-link">詳細</button>
-            </div>
-            <!--デモ用のダミー-->
-            <div class="productBox" >
-                <img class="shoeImage" src="images/スニーカー3.jpg" alt="productImage"/>
-                <a class="shoeName">AirMAX</a>
-                <a  class="shoePrice">￥10,000</a>
-                <button type="button" id="modal-open" class="button-link">詳細</button>
+                <div class="shoeImageDiv"><img class="shoeImage" th:src="@{/upload/{photo}(photo=${shoe.photo})}" alt="productImage" width="300" height="200"/></div>
+                <p th:text= "${shoe.name}" class="shoeName">AirMAX</p>
+                <p th:text = "'&yen;' +${shoe.price}" class="shoePrice">￥10,000</p>
+                <input type="hidden" th:value="${shoe.id}"/>
+                <div class="detailsBtn"><button type="button" id="modal-open" class="details">Datails</button></div>
+                <!-- <button class="js-modal-open" id="sign-up">Details</button>-->
             </div>
-            <div class="productBox">box</div>
-            <div class="productBox">box</div>
-            <div class="productBox">box</div>
-            <div class="productBox">box</div>
-            <div class="productBox">box</div>
-            <div class="productBox">box</div>
         </div>
         <footer class="footer">
             <div class="container">