基于Java+SSM+MySQL的水果商城系统

迷南。 2024-04-01 12:37 30阅读 0赞

目 录  
摘 要 I  
Abstract II  
目 录 IV  
第一章 引言 1  
1.1 系统开发背景 1  
1.2 系统开发意义 1  
1.3论文的主要结构 2  
第二章 系统设计工具介绍 3  
2.1 平台选择 3  
2.2 系统开发工具 3  
2.2.1 开发语言—JSP 3  
2.2.2 数据库—MySQL 4  
第三章 网上水果超市需求分析 5  
3.1 网上水果超市系统的现状 5  
3.2 可行性分析 6  
3.3 系统实现的目标 6  
3.4 系统功能需求 6  
3.4.1 功能概述 6  
3.4.2 功能描述 7  
3.4.3 功能划分 8  
3.4.3 功能用例 8  
第四章 网上水果超市系统设计 14  
4.1 项目规划 14  
4.1.1 系统功能结构图 14  
4.1.2 处理流程 15  
4.2 系统设计 16  
4.2.1 设计目标 16  
4.2.2 系统开发环境 16  
4.3 数据库设计 17  
第五章 网上水果超市系统实现 23  
5.1 系统各部分的实现方法 23  
5.1.1 创建与数据库的连接 23  
5.1.2 访问数据库的JavaBean 23  
5.2 网站前台设计 24  
5.2.1前台框架设计 24  
5.2.2 网站首页 25  
5.2.3 产品详情页 26  
5.2.4 评价 27  
5.3网站后台设计 27  
5.3.1 后台主页 27  
5.3.2 后台评价管理 28  
5.3.3 水果管理 29  
5.3.4水果信息修改 29  
5.3.5 水果分类管理 30  
5.3.6 订单管理 30  
5.3.7 购物车管理 31  
第六章 系统测试与评价分析 32  
6.1 测试环境简介 32  
6.2 系统的不足及修改方法 32  
6.3 系统的评价分析 33  
6.3.1 实用性 33  
6.3.2 可维护性 33  
6.3.3 可扩展性 33  
结论 34  
参考文献 35  
致谢 37  
3.4 系统功能需求  
3.4.1 功能概述  
本网站主要包括：前台水果展示及销售和后台网站管理  
(1) 前台水果展示：主要包括水果销售者在线注册为卖家会员、修改个人信息、管理账户余额、发布预售水果信息、销售水果。水果消费者在线注册为买家会员、修改个人信息、管理账户余额、浏览水果详细信息、支付购物、下订单、评价、投票。游客注册为卖家或者买家会员、浏览水果详细信息，搜索水果信息。  
(2) 后台网站管理：主要由管理员维护客户注册信息、维护水果信息、处理订定单信息、维护系统公告、网上售货、发布网站公告。  
3.4.2 功能描述  
开发一个基于Web的网上商城，采用结构化设计分析方法，该系统包括前台购物和后台管理两大总的模块，后台管理模块又包括分类录入水果（以及水果的相关信息，如名称、单价、摘要、目录等）和管理前台用户，前台管理模块包括用户登录，查询、浏览水果，以及购物功能。本网站的所有会员都可以特价水果，新用户可以通过注册成为本网站的会员，并可以定购水果和查询订单。本系统的各项功能需求如下：  
(1) 注册会员功能，该功能的优先级较高，要想正常使用本网站，就要首先进行注册，需要填写用户名、密码、确认密码、邮箱等问题。  
(2) 会员登录功能，该功能的优先级较高，使用已经注册过的用户名和密码进行登录，经过系统确认正确后，即可进入下一步操作。  
(3) 会员管理账户余额功能，该功能包括会员使用网银给账户充值，以及查看本账户当前可用余额和交易记录。  
(4) 浏览搜索水果功能，通过输入想要找的水果的关键字进行查询，然后从若干水果中进行浏览，挑选出自己想要的水果。  
(5) 查看水果相信信息功能，通过浏览到的水果，对水果进行详细信息浏览。  
(6) 购物车功能，在浏览网页和查找水果的过程中，如果选中某一水果，就可以随时将它添加到自己的购物车中，前提条件是这必须要在登录之后才能完成的操作。而且，还可以将购物车中的水果使用网上银行账户通过支付宝的操作进行递交付款。  
(7) 销售排行榜功能，该功能是将网站上的所有水果按照销售量进行排序显示，并将网站上的所有水果按照上传日期进行排序再显示。  
(8) 水果网站管理员对水果进行分类管理功能，该功能包括添加水果、修改水果、删除水果、添加水果类型、修改水果类型、删除水果类型并且显示出所有的水果类型和水果信息（如编号、名称等）。  
(9) 商城网站管理员对网站的会员进行管理功能，该功能是指管理员可以维护客户注册信息、维护水果信息、维护系统公告，同时，本文转载自http://www.biyezuopin.vip/onews.asp?id=12062还可以将一些使用不规范的用户或者长期不用的用户进行删除。店长管理员还可以给其他董事管理员分配管理权限，实现本网站的秩序。  
(10) 管理员的登录与注销功能，管理员进入后台进行操作也要经过最高层管理员的允许。  
3.4.3 功能划分  
根据功能需求分析，将本系统功能划分如下图：  
![在这里插入图片描述][4160ea5972944a6e884b6e5b964cc1a1.png]

图3.1 系统功能模块的层次框图

<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
    <%
    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>水果超市</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">
    	
    	
    	  <meta name="viewport" content="width=device-width, initial-scale=1">
        
        <link rel="shortcut icon" type="image/x-icon" href="img/favicon.png">
    
     
    	    
    	    
    	     <link rel="stylesheet" type="text/css" href="<%=basePath%>home/css/font-awesome.min.css" />
      <link rel="stylesheet" type="text/css" href="<%=basePath%>home/css/bootstrap.css" />
      <link rel="stylesheet" type="text/css" href="<%=basePath%>home/css/style.css">
      <link rel="stylesheet" type="text/css" href="<%=basePath%>home/css/magnific-popup.css">
      <link rel="stylesheet" type="text/css" href="<%=basePath%>home/css/owl.carousel.css">
    	
    	
    	  <script type="text/javascript">
    	  
    	 
    	
    	 
    	
    	
    	function getprofenlei()
    	{
         
    		
    		 var html = ""; 
    		    $.ajax({
        
    		        url: "leixing.action?list&page=0&rows=30",
    		        type: "POST",
    		        async: false, 
    		        contentType: "application/x-www-form-urlencoded;charset=UTF-8",
    		        success: function (data) {
         
    		            $.each(data.rows, function (i, val) {
         
    		            	
    		            
    		            	 
    
    		            	  html += ' <li ><a href="home/search.jsp?fenlei='+val.id+'" >'+val.a1+'	</a></li>';
    		                
    		            })
    
    		        }
    
    		    }); 
     
    		   $("#fenlei").html(html);
    		      
    		
    	}
    	    
    	  
    	  function gettop1()
    	  {
        
    	  	 
    	  	  
    	  	 var html = "";
    	  	    $.ajax({
        
    	  	        url: "leixing.action?list&page=0&rows=10",
    	  	        type: "POST",
    	  	        async: false,
    	  	        success: function (data) {
        
    	   
    	  	        	
    	  	        	var total='';
    	  	        	//<div class="tab-pane active" id="nArrivals">
    	                
    	               // <div class="nArrivals owl-carousel" id="top1">
    	                $.each(data.rows, function (i, valmm) {
         
    	  	                	  
    	  	              html+='<div class="nArrivals owl-carousel" id="'+valmm.id+'">';
    	  	            	
    	  	                $.ajax({
        
    	  	        	        url: "shangpin.action?list&page=0&rows=10",
    	  	        	        type: "POST",
    	  	        	        async: false,
    	  	        	        data: {
         fenlei:valmm.id },
    	  	        	        success: function (data) {
         
    	  	        	            $.each(data.rows, function (i, val) {
          
    	  	        	            	 html+='<div class="product-grid">'+
    	  	  		            	 '<div class="item">'+
    	  	  	                     ' <div class="product-thumb">'+
    	  	  	                      '  <div class="image product-imageblock"> <a href="home/details.jsp?ids='+val.id+'"> <img data-name="product_image"  style="width:223px;height:285px;" src="<%=basePath%>'+val.tupian1+'" alt="iPod Classic" title="iPod Classic" class="img-responsive"> <img style="width:223px;height:285px;" src="<%=basePath%>'+val.tupian1+'" alt="iPod Classic" title="iPod Classic" class="img-responsive"> </a> </div>'+
    	  	  	                       ' <div class="caption product-detail text-left">'+
    	  	  	                        '  <h6 data-name="product_name" class="product-name mt_20"><a href="home/details.jsp?ids='+val.id+'" title="Casual Shirt With Ruffle Hem">'+val.biaoti+'</a></h6>'+
    	  	  	                         ' <div class="rating"> <span class="fa fa-stack"><i class="fa fa-star-o fa-stack-1x"></i><i class="fa fa-star fa-stack-1x"></i></span> <span class="fa fa-stack"><i class="fa fa-star-o fa-stack-1x"></i><i class="fa fa-star fa-stack-1x"></i></span> <span class="fa fa-stack"><i class="fa fa-star-o fa-stack-1x"></i><i class="fa fa-star fa-stack-1x"></i></span> <span class="fa fa-stack"><i class="fa fa-star-o fa-stack-1x"></i><i class="fa fa-star fa-stack-1x"></i></span> <span class="fa fa-stack"><i class="fa fa-star-o fa-stack-1x"></i><i class="fa fa-star fa-stack-x"></i></span> </div>'+
    	  	  	                          '<span class="price"><span class="amount"><span class="currencySymbol">$</span>'+val.jiage+'</span>'+
    	  	  	                          '</span>'+
    	  	  	                          '<div class="button-group text-center">'+
    	  	  	                           ' <div class="wishlist"><a href="home/details.jsp?ids='+val.id+'"><span>wishlist</span></a></div>'+
    	  	  	                            '<div class="quickview"><a href="home/details.jsp?ids='+val.id+'"><span>Quick View</span></a></div>'+
    	  	  	                            '<div class="compare"><a href="home/details.jsp?ids='+val.id+'"><span>Compare</span></a></div>'+
    	  	  	                            '<div class="add-to-cart"><a href="home/details.jsp?ids='+val.id+'"><span>Add to cart</span></a></div>'+
    	  	  	                          '</div>'+
    	  	  	                        '</div>'+
    	  	  	                      '</div>'+
    	  	  	                    '</div>'+
    	  	  	                 ' </div>'; 
    	  	        	             
    	  	        	            })
    	  	        	          html+='</div>'; 
    	  	        	            
    	  	        	    }
    	  	                })
    	  	                 
    	  	               
    	  	                
    	  	            }) 
    	  	          $("#nArrivals").html(html);  
    	  	        }
    
    	  	    }); 
    
    	    
    	  	
    	  	
    	  	}
    
    	  
    	  
    	  
    	  
    	  
    	  function gettop2()
    	  {
        
    		  
    		  
    		  var html = ""; 
    		    $.ajax({
        
    		    	  url: "shangpin.action?list&page=3&rows=10",
    		        type: "POST",
    		        async: false, 
    		        contentType: "application/x-www-form-urlencoded;charset=UTF-8",
    		        success: function (data) {
         
    		        	
    		        	var lasthtml='';
    		        	var totalhtml='<ul class="row ">';
    		        	  var html = ""; 
    		        	
    		            $.each(data.rows, function (i, val) {
          
    		            	
    		            	if(i!=0)
    		            		{
        
    		            		
    		            		
    		            	 html+= '<li class="item product-layout-left mb_20">'+
    		                    '<div class="product-list col-xs-4">'+
    		                     ' <div class="product-thumb">'+
    		                      '  <div class="image product-imageblock"> <a href="home/details.jsp?ids='+val.id+'"> <img class="img-responsive"    title="iPod Classic" alt="iPod Classic" src="<%=basePath%>'+val.tupian1+'"> <img class="img-responsive" title="iPod Classic" alt="iPod Classic"   src="<%=basePath%>'+val.tupian2+'"> </a> </div>'+
    		                      '</div>'+
    		                    '</div>'+
    		                    '<div class="col-xs-8">'+
    		                     ' <div class="caption product-detail">'+
    		                        '<h6 class="product-name"><a href="home/details.jsp?ids='+val.id+'">'+val.biaoti+'</a></h6>'+
    		                        '<div class="rating"> <span class="fa fa-stack"><i class="fa fa-star-o fa-stack-1x"></i><i class="fa fa-star fa-stack-1x"></i></span> <span class="fa fa-stack"><i class="fa fa-star-o fa-stack-1x"></i><i class="fa fa-star fa-stack-1x"></i></span> <span class="fa fa-stack"><i class="fa fa-star-o fa-stack-1x"></i><i class="fa fa-star fa-stack-1x"></i></span> <span class="fa fa-stack"><i class="fa fa-star-o fa-stack-1x"></i><i class="fa fa-star fa-stack-1x"></i></span> <span class="fa fa-stack"><i class="fa fa-star-o fa-stack-1x"></i><i class="fa fa-star fa-stack-x"></i></span> </div>'+
    		                        '<span class="price"><span class="amount"><span class="currencySymbol">$</span>'+val.jiage+'</span>'+
    		                        '</span>'+
    		                      '</div>'+
    		                    '</div>'+
    		                  '</li>';
    		                  
    		                 
    		                  
    		                  if(i%3==0)
    		            	   {
        
    		            	   
    		            	   
    		            	   lasthtml=lasthtml+totalhtml+html+'</ul>';
    		            	 
    		            	   html=""; 
    		            	   
    		            	   }
    		                  }
    		            })
    		            
    		            $("#featu-pro").html(lasthtml);  
    
    		        }
    
    		    });
    
    
    		   
    		  
    	  }
    	  
    	  
    	  
    	  
    	  
    	  
    	  
    	  
    	  function gettop3()
    	  {
        
    		  
    		  
    		  var html = ""; 
    		    $.ajax({
        
    		    	  url: "shangpin.action?list&page=0&rows=10",
    		        type: "POST",
    		        async: false, 
    		        contentType: "application/x-www-form-urlencoded;charset=UTF-8",
    		        success: function (data) {
        
    		        	var lasthtml='';
    		        	var totalhtml='<ul class="row ">';
    		        	  var html = ""; 
    		        	 
    		        	
    		            $.each(data.rows, function (i, val) {
          
    		            	
    		            	if(i!=0)
    	            		{
        
    			        	
    		            	 html+='<li class="item product-layout-left mb_20">'+
    		                 '<div class="product-list col-xs-4">'+
    		                  ' <div class="product-thumb">'+
    		                     '<div class="image product-imageblock"> <a href="home/details.jsp?ids='+val.id+'"> <img  class="img-responsive" title="iPod Classic" alt="iPod Classic" src="<%=basePath%>'+val.tupian1+'"> <img  class="img-responsive" title="iPod Classic" alt="iPod Classic" src="<%=basePath%>'+val.tupian2+'"> </a> </div>'+
    		                  ' </div>'+
    		                ' </div>'+
    		                ' <div class="col-xs-8">'+
    		                  ' <div class="caption product-detail">'+
    		                   '  <h6 class="product-name"><a href="home/details.jsp?ids='+val.id+'">'+val.biaoti+'</a></h6>'+
    		                    ' <div class="rating"> <span class="fa fa-stack"><i class="fa fa-star-o fa-stack-1x"></i><i class="fa fa-star fa-stack-1x"></i></span> <span class="fa fa-stack"><i class="fa fa-star-o fa-stack-1x"></i><i class="fa fa-star fa-stack-1x"></i></span> <span class="fa fa-stack"><i class="fa fa-star-o fa-stack-1x"></i><i class="fa fa-star fa-stack-1x"></i></span> <span class="fa fa-stack"><i class="fa fa-star-o fa-stack-1x"></i><i class="fa fa-star fa-stack-1x"></i></span> <span class="fa fa-stack"><i class="fa fa-star-o fa-stack-1x"></i><i class="fa fa-star fa-stack-x"></i></span> </div>'+
    		                    ' <span class="price"><span class="amount"><span class="currencySymbol">$</span>'+val.jiage+'</span>'+
    		                    ' </span>'+
    		                  ' </div>'+
    		                 '</div>'+
    		               '</li>';
    		             
    		            	 if(i%3==0)
    		            	   {
        
    		            	   
    		            	   
    		            	   lasthtml=lasthtml+totalhtml+html+'</ul>';
    		            	 
    		            	   html=""; 
    		            	   
    		            	   }
    		                  }
    		            })
    		            $("#bests-pro").html(lasthtml);  
    		        }
    
    		    });
    
    
    		 
    		  
    	  }
    	  
    	  
    	  
    	   
         
         
         
    	  
    	  
    	  
    	  function gettop4()
    	  {
        
    		  
    		 
    		    $.ajax({
        
    		    	  url: "shangpin.action?list&page=6&rows=10",
    		        type: "POST",
    		        async: false, 
    		        contentType: "application/x-www-form-urlencoded;charset=UTF-8",
    		        success: function (data) {
         
    		        	
    		        	var lasthtml='';
    		        	var totalhtml='<ul class="row ">';
    		        	  var html = ""; 
    		        	 
    		            $.each(data.rows, function (i, val) {
          
    		            	if(i!=0)
    	            		{
        
    			        	
    		            	 html+='<li class="item product-layout-left mb_20">'+
    		                 '<div class="product-list col-xs-4">'+
    		                  ' <div class="product-thumb">'+
    		                     '<div class="image product-imageblock"> <a href="home/details.jsp?ids='+val.id+'"> <img  class="img-responsive" title="iPod Classic" alt="iPod Classic" src="<%=basePath%>'+val.tupian1+'"> <img  class="img-responsive" title="iPod Classic" alt="iPod Classic" src="<%=basePath%>'+val.tupian2+'"> </a> </div>'+
    		                  ' </div>'+
    		                ' </div>'+
    		                ' <div class="col-xs-8">'+
    		                  ' <div class="caption product-detail">'+
    		                   '  <h6 class="product-name"><a href="home/details.jsp?ids='+val.id+'">'+val.biaoti+'</a></h6>'+
    		                    ' <div class="rating"> <span class="fa fa-stack"><i class="fa fa-star-o fa-stack-1x"></i><i class="fa fa-star fa-stack-1x"></i></span> <span class="fa fa-stack"><i class="fa fa-star-o fa-stack-1x"></i><i class="fa fa-star fa-stack-1x"></i></span> <span class="fa fa-stack"><i class="fa fa-star-o fa-stack-1x"></i><i class="fa fa-star fa-stack-1x"></i></span> <span class="fa fa-stack"><i class="fa fa-star-o fa-stack-1x"></i><i class="fa fa-star fa-stack-1x"></i></span> <span class="fa fa-stack"><i class="fa fa-star-o fa-stack-1x"></i><i class="fa fa-star fa-stack-x"></i></span> </div>'+
    		                    ' <span class="price"><span class="amount"><span class="currencySymbol">$</span>'+val.jiage+'</span>'+
    		                    ' </span>'+
    		                  ' </div>'+
    		                 '</div>'+
    		               '</li>';
    		             
    		            	 if(i%3==0)
    		            	   {
        
    		            	   
    		            	   
    		            	   lasthtml=lasthtml+totalhtml+html+'</ul>';
    		            	 
    		            	   html=""; 
    		            	   
    		            	   }
    		                  }
    		            })
    		            $("#new-pro").html(lasthtml);  
    		        }
    
    		    });
    
    
    		 
    		  
    	  }
    	  
    	  
    	  
    	  
    	  function getbottom()
    	  {
        
    		  
    		 
    		    $.ajax({
        
    		    	  url: "shangpin.action?list&page=0&rows=10",
    		        type: "POST",
    		        async: false, 
    		        contentType: "application/x-www-form-urlencoded;charset=UTF-8",
    		        success: function (data) {
         
    		        	 
    		         
    		        	  var html = "";  
    		            $.each(data.rows, function (i, val) {
          
    		            	 
    			        	
    		            	 html+='<div class="item">'+
    		            	      '<div class="box-holder">'+
    		                 '<div class="thumb post-img"><a href="home/details.jsp?ids='+val.id+'"> <img style="width:470px;height:249px;" src="<%=basePath%>'+val.tupian1+'" > </a> </div>'+
    		                 '<div class="post-info mtb_20 ">'+
    		                   '<h6 class="mb_10 text-uppercase"> <a href="home/details.jsp?ids='+val.id+'">'+val.biaoti+'</a> </h6>'+
    		                   '<p>'+val.xiangxi.substring(0,100)+'</p>'+
    		                   '<div class="date-time">'+
    		                     '<div class="day"> 热销</div>'+
    		                     '<div class="month">抢购</div>'+
    		                   '</div>'+
    		                 '</div>'+
    		               '</div>'+
    		             '</div>';
    		              
    		            })
    		            $("#bottom").html(html);  
    		        }
    
    		    });
    
    
    		 
    		  
    	  }
    	  
    	  
    	  
    	  
    	  
     
    	  
    	  
    	  
    	  function getleft2()
    	  {
        
    		  
    		  
    		  $.ajax({
        
    	    	  url: "shangpin.action?list&page=0&rows=20",
    	        type: "POST",
    	        async: false, 
    	        contentType: "application/x-www-form-urlencoded;charset=UTF-8",
    	        success: function (data) {
         
    	        	 
    	        	var lasthtml='';
    	        	var totalhtml='<ul class="row ">';
    	        	  var html = ""; 
    	        	
    	        	$.each(data.rows, function (i, val) {
          
    	            	 
    	            	if(i!=0)
    	            		{
        
    	            		
    	            		
    	            	 html+='<li class="item product-layout-left mb_20">'+
    	                 '<div class="product-list col-xs-4">'+
    	                  ' <div class="product-thumb">'+
    	                     '<div class="image product-imageblock"> <a href="home/details.jsp?ids='+val.id+'"> <img  class="img-responsive" title="iPod Classic" alt="iPod Classic" src="<%=basePath%>'+val.tupian1+'"> <img  class="img-responsive" title="iPod Classic" alt="iPod Classic" src="<%=basePath%>'+val.tupian2+'"> </a> </div>'+
    	                  ' </div>'+
    	                ' </div>'+
    	                ' <div class="col-xs-8">'+
    	                  ' <div class="caption product-detail">'+
    	                   '  <h6 class="product-name"><a href="home/details.jsp?ids='+val.id+'">'+val.biaoti+'</a></h6>'+
    	                    ' <div class="rating"> <span class="fa fa-stack"><i class="fa fa-star-o fa-stack-1x"></i><i class="fa fa-star fa-stack-1x"></i></span> <span class="fa fa-stack"><i class="fa fa-star-o fa-stack-1x"></i><i class="fa fa-star fa-stack-1x"></i></span> <span class="fa fa-stack"><i class="fa fa-star-o fa-stack-1x"></i><i class="fa fa-star fa-stack-1x"></i></span> <span class="fa fa-stack"><i class="fa fa-star-o fa-stack-1x"></i><i class="fa fa-star fa-stack-1x"></i></span> <span class="fa fa-stack"><i class="fa fa-star-o fa-stack-1x"></i><i class="fa fa-star fa-stack-x"></i></span> </div>'+
    	                    ' <span class="price"><span class="amount"><span class="currencySymbol">$</span>70.00</span>'+
    	                    ' </span>'+
    	                  ' </div>'+
    	                 '</div>'+
    	               '</li>';
    	              
    	               if(i%3==0)
    	            	   {
        
    	            	   
    	            	   
    	            	   lasthtml=lasthtml+totalhtml+html+'</ul>';
    	            	 
    	            	   html=""; 
    	            	   
    	            	   }
    	              
    	            		}
    	            })
    	             
    	            
    	            $("#left-special").html(lasthtml);  
    
    	        }
    
    	    });
    
    	  }
    	  
    	  
    	  
    	  
    	  
    	  
    	  
    	  
    	  
    	  
    	  
    	  
    	  
    	  
    	   
    	     
    	
    	
    	    </script>
    	
      </head>
      
      <body>
       
              
      <div class="loder"></div>
      <div class="wrapper">
    
           <jsp:include   page="${basePath}/home/head.jsp" flush="true"/> 
        
        
        
        
        <div class="container">
          <div class="row ">
            <div id="column-left" class="col-sm-4 col-md-4 col-lg-3 ">
              <div id="category-menu" class="navbar collapse mb_40 hidden-sm-down in" aria-expanded="true" style="" role="button">
                <div class="nav-responsive">
                  <ul class="nav  main-navigation collapse in " id="fenlei">
                   
                   
                  </ul>
                </div>
              </div>
              <div class="left_banner left-sidebar-widget mt_30 mb_50"> <a href="#"><img src="<%=basePath%>home/images/left1.jpg" alt="Left Banner" class="img-responsive" /></a> </div>
              <div class="left-cms left-sidebar-widget mb_50">
                <ul>
                  <li>
                    <div class="feature-i-left ptb_40">
                      <div class="icon-right Shipping"></div>
                      <h6>免费送货</h6>
                      <p>全球免费送货</p>
                    </div>
                  </li>
                  <li>
                    <div class="feature-i-left ptb_40">
                      <div class="icon-right Order"></div>
                      <h6>在线订购</h6>
                      <p>营业时间 : 8am - 11pm</p>
                    </div>
                  </li>
                  <li>
                    <div class="feature-i-left ptb_40">
                      <div class="icon-right Save"></div>
                      <h6>购物保障</h6>
                      <p>质量可靠，信誉高</p>
                    </div>
                  </li>
                  <li>
                    <div class="feature-i-left ptb_40">
                      <div class="icon-right Safe"></div>
                      <h6>安全购物</h6>
                      <p>100% 正品</p>
                    </div>
                  </li>
                </ul>
              </div>
              <div class="left-special left-sidebar-widget mb_50">
                <div class="heading-part mb_20 ">
                  <h2 class="main_title">热销</h2>
                </div>
                <div id="left-special" class="owl-carousel" >
                  <ul class="row ">
                    <li class="item product-layout-left mb_20">
                      <div class="product-list col-xs-4">
                        <div class="product-thumb">
                          <div class="image product-imageblock"> <a href="#"> <img class="img-responsive" title="iPod Classic" alt="iPod Classic" src="<%=basePath%>home/images/product/product4.jpg"> <img class="img-responsive" title="iPod Classic" alt="iPod Classic" src="<%=basePath%>home/images/product/product4-1.jpg"> </a> </div>
                        </div>
                      </div>
                      <div class="col-xs-8">
                        <div class="caption product-detail">
                          <h6 class="product-name"><a href="#">Latin literature from 45 BC, making it over old.</a></h6>
                          <div class="rating"> <span class="fa fa-stack"><i class="fa fa-star-o fa-stack-1x"></i><i class="fa fa-star fa-stack-1x"></i></span> <span class="fa fa-stack"><i class="fa fa-star-o fa-stack-1x"></i><i class="fa fa-star fa-stack-1x"></i></span> <span class="fa fa-stack"><i class="fa fa-star-o fa-stack-1x"></i><i class="fa fa-star fa-stack-1x"></i></span> <span class="fa fa-stack"><i class="fa fa-star-o fa-stack-1x"></i><i class="fa fa-star fa-stack-1x"></i></span> <span class="fa fa-stack"><i class="fa fa-star-o fa-stack-1x"></i><i class="fa fa-star fa-stack-x"></i></span> </div>
                          <span class="price"><span class="amount"><span class="currencySymbol">$</span>70.00</span>
                          </span>
                        </div>
                      </div>
                    </li>
                    <li class="item product-layout-left mb_20">
                      <div class="product-list col-xs-4">
                        <div class="product-thumb">
                          <div class="image product-imageblock"> <a href="#"> <img class="img-responsive" title="iPod Classic" alt="iPod Classic" src="<%=basePath%>home/images/product/product1.jpg"> <img class="img-responsive" title="iPod Classic" alt="iPod Classic" src="<%=basePath%>home/images/product/product1-1.jpg"> </a> </div>
                        </div>
                      </div>
                      <div class="col-xs-8">
                        <div class="caption product-detail">
                          <h6 class="product-name"><a href="#">Latin literature from 45 BC, making it over old.</a></h6>
                          <div class="rating"> <span class="fa fa-stack"><i class="fa fa-star-o fa-stack-1x"></i><i class="fa fa-star fa-stack-1x"></i></span> <span class="fa fa-stack"><i class="fa fa-star-o fa-stack-1x"></i><i class="fa fa-star fa-stack-1x"></i></span> <span class="fa fa-stack"><i class="fa fa-star-o fa-stack-1x"></i><i class="fa fa-star fa-stack-1x"></i></span> <span class="fa fa-stack"><i class="fa fa-star-o fa-stack-1x"></i><i class="fa fa-star fa-stack-1x"></i></span> <span class="fa fa-stack"><i class="fa fa-star-o fa-stack-1x"></i><i class="fa fa-star fa-stack-x"></i></span> </div>
                          <span class="price"><span class="amount"><span class="currencySymbol">$</span>70.00</span>
                          </span>
                        </div>
                      </div>
                    </li>
                    <li class="item product-layout-left mb_20">
                      <div class="product-list col-xs-4">
                        <div class="product-thumb">
                          <div class="image product-imageblock"> <a href="#"> <img class="img-responsive" title="iPod Classic" alt="iPod Classic" src="<%=basePath%>home/images/product/product2.jpg"> <img class="img-responsive" title="iPod Classic" alt="iPod Classic" src="<%=basePath%>home/images/product/product2-1.jpg"> </a> </div>
                        </div>
                      </div>
                      <div class="col-xs-8">
                        <div class="caption product-detail">
                          <h6 class="product-name"><a href="#">Latin literature from 45 BC, making it over old.</a></h6>
                          <div class="rating"> <span class="fa fa-stack"><i class="fa fa-star-o fa-stack-1x"></i><i class="fa fa-star fa-stack-1x"></i></span> <span class="fa fa-stack"><i class="fa fa-star-o fa-stack-1x"></i><i class="fa fa-star fa-stack-1x"></i></span> <span class="fa fa-stack"><i class="fa fa-star-o fa-stack-1x"></i><i class="fa fa-star fa-stack-1x"></i></span> <span class="fa fa-stack"><i class="fa fa-star-o fa-stack-1x"></i><i class="fa fa-star fa-stack-1x"></i></span> <span class="fa fa-stack"><i class="fa fa-star-o fa-stack-1x"></i><i class="fa fa-star fa-stack-x"></i></span> </div>
                          <span class="price"><span class="amount"><span class="currencySymbol">$</span>70.00</span>
                          </span>
                        </div>
                      </div>
                    </li>
                  </ul>
              
               
               
                </div>
              </div>
              <div class="left_banner left-sidebar-widget mb_50"> <a href="javascript:void(0)"><img src="<%=basePath%>home/images/left2.jpg" alt="Left Banner" class="img-responsive" /></a> </div>
              <div class="Testimonial left-sidebar-widget mb_50">
                <div class="heading-part mb_20 ">
                  <h2 class="main_title">客户分享</h2>
                </div>
                <div class="client owl-carousel text-center pt_10">
                  <div class="item client-detail">
                    <div class="client-avatar"> <img alt="" src="<%=basePath%>home/images/user1.jpg"> </div>
                    <div class="client-title  mt_30"><strong>joseph Lui</strong></div>
                    <div class="client-designation mb_10">php Developer</div>
                    <p><i class="fa fa-quote-left" aria-hidden="true"></i>Lorem ipsum dolor sit amet, volumus oporteat his at sea in Rem ipsum dolor sit amet, sea in odio ..</p>
                  </div>
                  <div class="item client-detail">
                    <div class="client-avatar"> <img alt="" src="<%=basePath%>home/images/user2.jpg"> </div>
                    <div class="client-title  mt_30"><strong>joseph Lui</strong></div>
                    <div class="client-designation mb_10">php Developer</div>
                    <p><i class="fa fa-quote-left" aria-hidden="true"></i>Lorem ipsum dolor sit amet, volumus oporteat his at sea in Rem ipsum dolor sit amet, sea in odio ..</p>
                  </div>
                  <div class="item client-detail">
                    <div class="client-avatar"> <img alt="" src="<%=basePath%>home/images/user3.jpg"> </div>
                    <div class="client-title  mt_30"><strong>joseph Lui</strong></div>
                    <div class="client-designation mb_10">php Developer</div>
                    <p><i class="fa fa-quote-left" aria-hidden="true"></i>Lorem ipsum dolor sit amet, volumus oporteat his at sea in Rem ipsum dolor sit amet, sea in odio ..</p>
                  </div>
                </div>
              </div>
            
            </div>
            <div id="column-right" class="col-sm-8 col-md-8 col-lg-9 mtb_30">
              
              <div class="banner">
                <div class="main-banner owl-carousel">
                  <div class="item"><a href="#"><img src="<%=basePath%>home/images/main_banner1.jpg" alt="Main Banner" class="img-responsive" /></a></div>
                  <div class="item"><a href="#"><img src="<%=basePath%>home/images/main_banner2.png" alt="Main Banner" class="img-responsive" /></a></div>
                </div>
              </div>
              
              
            
              
              
              <div id="product-tab" class="mt_40">
                <div class="heading-part mb_20 ">
                  <h2 class="main_title">产品列表</h2>
                </div>
                <ul class="nav text-right" id="profenlei" style="visibility:hidden">
                
                  
                </ul>
                <div class="tab-content clearfix box">
                  <div class="tab-pane active" id="nArrivals">
                  
                    <div class="nArrivals owl-carousel" id="top1">
                    
                     
                    </div>
                  </div>
              
                            
                </div>
              </div>
              
              <div class="tlinks">Collect from <a href="http://www.cssmoban.com/" >建站模板</a></div>
              
              <div class="row">
                <div class="cms_banner mt_40 mb_50">
                  <div class="col-xs-12">
                    <div id="subbanner3" class="banner sub-hover"> <a href="javascript:void(0)"><img src="<%=basePath%>home/images/sub3.jpg" alt="Sub Banner3" class="img-responsive"></a> </div>
                  </div>
                </div>
              </div>
              
              
              <div id="sale-product">
             
               
              
              
         
              
              
              
              
              
              <div class="row">
                <div class="col-md-4">
                  <div class="heading-part mb_20 ">
                    <h2 class="main_title">新款机器</h2>
                  </div>
                  <div id="featu-pro" class="owl-carousel" >
                  
               
                
                
                
                
                
                
                  </div>
                </div>
                <div class="col-md-4">
                  <div class="heading-part mb_20 ">
                    <h2 class="main_title">办公首选</h2>
                  </div>
                  <div id="bests-pro" class="owl-carousel" >
                  
                  
                
                    
               
                  </div>
                </div>
                <div class="col-md-4">
                  <div class="heading-part mb_20 ">
                    <h2 class="main_title">店铺推荐</h2>
                  </div>
                  <div id="new-pro" class="owl-carousel" >
                   
                    <ul class="row ">
                      <li class="item product-layout-left mb_20">
                        <div class="product-list col-xs-4">
                          <div class="product-thumb">
                            <div class="image product-imageblock"> <a href="#"> <img class="img-responsive" title="iPod Classic" alt="iPod Classic" src="<%=basePath%>home/images/product/product4.jpg"> <img class="img-responsive" title="iPod Classic" alt="iPod Classic" src="<%=basePath%>home/images/product/product4-1.jpg"> </a> </div>
                          </div>
                        </div>
                        <div class="col-xs-8">
                          <div class="caption product-detail">
                            <h6 class="product-name"><a href="#">Latin literature from 45 BC, making it over old.</a></h6>
                            <div class="rating"> <span class="fa fa-stack"><i class="fa fa-star-o fa-stack-1x"></i><i class="fa fa-star fa-stack-1x"></i></span> <span class="fa fa-stack"><i class="fa fa-star-o fa-stack-1x"></i><i class="fa fa-star fa-stack-1x"></i></span> <span class="fa fa-stack"><i class="fa fa-star-o fa-stack-1x"></i><i class="fa fa-star fa-stack-1x"></i></span> <span class="fa fa-stack"><i class="fa fa-star-o fa-stack-1x"></i><i class="fa fa-star fa-stack-1x"></i></span> <span class="fa fa-stack"><i class="fa fa-star-o fa-stack-1x"></i><i class="fa fa-star fa-stack-x"></i></span> </div>
                            <span class="price"><span class="amount"><span class="currencySymbol">$</span>70.00</span>
                            </span>
                          </div>
                        </div>
                      </li>
                      <li class="item product-layout-left mb_20">
                        <div class="product-list col-xs-4">
                          <div class="product-thumb">
                            <div class="image product-imageblock"> <a href="#"> <img class="img-responsive" title="iPod Classic" alt="iPod Classic" src="<%=basePath%>home/images/product/product5.jpg"> <img class="img-responsive" title="iPod Classic" alt="iPod Classic" src="<%=basePath%>home/images/product/product5-1.jpg"> </a> </div>
                          </div>
                        </div>
                        <div class="col-xs-8">
                          <div class="caption product-detail">
                            <h6 class="product-name"><a href="#">Latin literature from 45 BC, making it over old.</a></h6>
                            <div class="rating"> <span class="fa fa-stack"><i class="fa fa-star-o fa-stack-1x"></i><i class="fa fa-star fa-stack-1x"></i></span> <span class="fa fa-stack"><i class="fa fa-star-o fa-stack-1x"></i><i class="fa fa-star fa-stack-1x"></i></span> <span class="fa fa-stack"><i class="fa fa-star-o fa-stack-1x"></i><i class="fa fa-star fa-stack-1x"></i></span> <span class="fa fa-stack"><i class="fa fa-star-o fa-stack-1x"></i><i class="fa fa-star fa-stack-1x"></i></span> <span class="fa fa-stack"><i class="fa fa-star-o fa-stack-1x"></i><i class="fa fa-star fa-stack-x"></i></span> </div>
                            <span class="price"><span class="amount"><span class="currencySymbol">$</span>70.00</span>
                            </span>
                          </div>
                        </div>
                      </li>
                      <li class="item product-layout-left mb_20">
                        <div class="product-list col-xs-4">
                          <div class="product-thumb">
                            <div class="image product-imageblock"> <a href="#"> <img class="img-responsive" title="iPod Classic" alt="iPod Classic" src="<%=basePath%>home/images/product/product6.jpg"> <img class="img-responsive" title="iPod Classic" alt="iPod Classic" src="<%=basePath%>home/images/product/product6-1.jpg"> </a> </div>
                          </div>
                        </div>
                        <div class="col-xs-8">
                          <div class="caption product-detail">
                            <h6 class="product-name"><a href="#">Latin literature from 45 BC, making it over old.</a></h6>
                            <div class="rating"> <span class="fa fa-stack"><i class="fa fa-star-o fa-stack-1x"></i><i class="fa fa-star fa-stack-1x"></i></span> <span class="fa fa-stack"><i class="fa fa-star-o fa-stack-1x"></i><i class="fa fa-star fa-stack-1x"></i></span> <span class="fa fa-stack"><i class="fa fa-star-o fa-stack-1x"></i><i class="fa fa-star fa-stack-1x"></i></span> <span class="fa fa-stack"><i class="fa fa-star-o fa-stack-1x"></i><i class="fa fa-star fa-stack-1x"></i></span> <span class="fa fa-stack"><i class="fa fa-star-o fa-stack-1x"></i><i class="fa fa-star fa-stack-x"></i></span> </div>
                            <span class="price"><span class="amount"><span class="currencySymbol">$</span>70.00</span>
                            </span>
                          </div>
                        </div>
                      </li>
                    </ul>
                 
                
                
                
                  </div>
                </div>
              </div>
              
              
              <div id="Blog" class="mt_40">
                <div class="heading-part mb_20 ">
                  <h2 class="main_title">猜你喜欢</h2>
                </div>
                <div class="blog-contain box">
                  <div class="blog owl-carousel" id="bottom">
                    <div class="item">
                      <div class="box-holder">
                        <div class="thumb post-img"><a href="#"> <img src="<%=basePath%>home/images/blog/blog_img_01.jpg" alt="HealthCare"> </a> </div>
                        <div class="post-info mtb_20 ">
                          <h6 class="mb_10 text-uppercase"> <a href="#">Unknown printer took a galley book.</a> </h6>
                          <p>Aliquam egestas pellentesque est. Etiam a orci Nulla id enim feugiat ligula ullamcorper scelerisque. Morbi eu luctus nisl.</p>
                          <div class="date-time">
                            <div class="day"> 11</div>
                            <div class="month">Aug</div>
                          </div>
                        </div>
                      </div>
                    </div>
                 
                 
                 
                 
                 
                 
                 
                  </div>
                </div>
                
              </div>
            </div>
          </div>
        </div>
        
        
                <jsp:include   page="${basePath}/home/foot.jsp" flush="true"/> 
        
      </div>
      <a id="scrollup">Scroll</a>
      <script src="<%=basePath%>home/js/jQuery_v3.1.1.min.js"></script>
      <script src="<%=basePath%>home/js/owl.carousel.min.js"></script>
      <script src="<%=basePath%>home/js/bootstrap.min.js"></script>
      <script src="<%=basePath%>home/js/jquery.magnific-popup.js"></script>
      <script src="<%=basePath%>home/js/jquery.firstVisitPopup.js"></script>
      <script src="<%=basePath%>home/js/custom.js"></script>        
        
        <script type="text/javascript">
        
        gettop1();
        gettop2();
        gettop3();
        gettop4();
        getleft2();
        //getfenlei();
        getbottom();
        getprofenlei();
        
        </script>
        
                         
        
      </body>
    </html>

![在这里插入图片描述][e4be6382f809423d9bd0037380ce153e.jpeg_pic_center]  
![在这里插入图片描述][ff0d179f669c44b3a0a801f4058d3908.jpeg_pic_center]  
![在这里插入图片描述][fa694832896946648b6f80e074efc017.jpeg_pic_center]  
![在这里插入图片描述][eb9e3655b44a4440818546778f47e466.jpeg_pic_center]  
![在这里插入图片描述][8627da149e9041c8a71463b4c938b4f8.jpeg_pic_center]  
![在这里插入图片描述][c4b11ebbe3254f5388d2cc58f34d1ba4.jpeg_pic_center]  
![在这里插入图片描述][6cea67e595f14c6bbc4f98c383fb864b.png_pic_center]  
![在这里插入图片描述][1644bd6e31ed4d2ebe8696a0e03f99d5.jpeg_pic_center]  
![在这里插入图片描述][eea019471a1e4307bef75f2041b22e5b.png_pic_center]  
![在这里插入图片描述][3670b86a955548b2948cadb10926929b.jpeg_pic_center]  
![在这里插入图片描述][243b5267230141159deec7c26bfa58d0.png_pic_center]  
![在这里插入图片描述][92ddcd38965444e8a3253407c5d0e8fb.png_pic_center]  
![在这里插入图片描述][429407de70484afa820d2899c06f371d.jpeg_pic_center]  
![在这里插入图片描述][56f420d117124a72b219caabe528cc61.png_pic_center]  
![在这里插入图片描述][a56504434a834bbb940b1c791014728e.png_pic_center]  
![在这里插入图片描述][56ae881c15ba4b6c808bbbdcb4133f21.jpeg_pic_center]  
![在这里插入图片描述][ece63fe35c954db8b1797a3cd72da61e.png_pic_center]  
![在这里插入图片描述][6196c57d90424f9c86c6190526e749c5.jpeg_pic_center]  
![在这里插入图片描述][0dbb986de22640bf8b8b832c433443c2.png_pic_center]  
![在这里插入图片描述][4b004f42c04c4827ad8e06e923c29856.jpeg_pic_center]  
![在这里插入图片描述][a551a9ab53ff40b394f2ebb15af7e921.jpeg_pic_center]  
![在这里插入图片描述][b04792e09e8f4c699f12c98ae0eea7c2.png_pic_center]  
![在这里插入图片描述][0f5b3b46946b4d289b38fbda4e0c4cb8.jpeg_pic_center]  
![在这里插入图片描述][7690e8c7480c4c49ace12f9a1fd95766.png_pic_center]  
![在这里插入图片描述][4d29ebc1a772468f80add872c8c491a3.png_pic_center]  
![在这里插入图片描述][7b42bd0b31df444680dc01243fde800a.jpeg_pic_center]  
![在这里插入图片描述][e9ffc56aff094d43885a02f027a0d6da.jpeg_pic_center]  
![在这里插入图片描述][2259d8a1270046b79d6b8c57c2da8ae0.jpeg_pic_center]  
![在这里插入图片描述][06067f5119e64d40860ce303a73dae87.png_pic_center]

[4160ea5972944a6e884b6e5b964cc1a1.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/01/a4b1719a89ad469dae57bad04aab05b6.png
[e4be6382f809423d9bd0037380ce153e.jpeg_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/01/8947bfc0244a48eb9fd1e92fcb98b8b9.jpeg
[ff0d179f669c44b3a0a801f4058d3908.jpeg_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/01/1b95a7bec3384188b57d49a7a423c350.jpeg
[fa694832896946648b6f80e074efc017.jpeg_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/01/7ba202df69a644b6b2a3557bc7ec63c2.jpeg
[eb9e3655b44a4440818546778f47e466.jpeg_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/01/ba613b2a08454033b956c7ef02ff7e26.jpeg
[8627da149e9041c8a71463b4c938b4f8.jpeg_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/01/70e4e745056b4afd85a15d067e00dcf1.jpeg
[c4b11ebbe3254f5388d2cc58f34d1ba4.jpeg_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/01/e385ba7a45f543e0bc79fdc4ca2ca415.jpeg
[6cea67e595f14c6bbc4f98c383fb864b.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/01/265035fea54b4822b56aa31cad8c0833.png
[1644bd6e31ed4d2ebe8696a0e03f99d5.jpeg_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/01/9a9c596795814f8db38f67b9de6b3303.jpeg
[eea019471a1e4307bef75f2041b22e5b.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/01/b5a8cec5db7d493d80adc9caebb5afa5.png
[3670b86a955548b2948cadb10926929b.jpeg_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/01/025d6d26a08c477b93eb2ed50a61d40c.jpeg
[243b5267230141159deec7c26bfa58d0.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/01/268e6552ccad4f22a1029ea03e33aaa0.png
[92ddcd38965444e8a3253407c5d0e8fb.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/01/b4b72e1489c341e1b9356c323536805d.png
[429407de70484afa820d2899c06f371d.jpeg_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/01/69f2c13a4aba43bea0c3c09fe6ddead2.jpeg
[56f420d117124a72b219caabe528cc61.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/01/158015edfc1f4f30b8eb189e97fe47eb.png
[a56504434a834bbb940b1c791014728e.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/01/dceb6a989d4244e7925dddb7c1f457d8.png
[56ae881c15ba4b6c808bbbdcb4133f21.jpeg_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/01/203f98a1e05b4eaabb5a8e030c67425e.jpeg
[ece63fe35c954db8b1797a3cd72da61e.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/01/9b10ce1ae4d849de9f9cdd14f8d07682.png
[6196c57d90424f9c86c6190526e749c5.jpeg_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/01/d64fb67717e548bead2d6bd358c6fd4e.jpeg
[0dbb986de22640bf8b8b832c433443c2.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/01/8885356d68d1407cafe8647f672dd543.png
[4b004f42c04c4827ad8e06e923c29856.jpeg_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/01/bb332036aeaa4d1e8d968e072f3ccf6e.jpeg
[a551a9ab53ff40b394f2ebb15af7e921.jpeg_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/01/802ec261bcd243199235f108b30ba638.jpeg
[b04792e09e8f4c699f12c98ae0eea7c2.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/01/a26915b51185468c9ab933657da46049.png
[0f5b3b46946b4d289b38fbda4e0c4cb8.jpeg_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/01/dfbae10db7ed422784719e7c1f225b70.jpeg
[7690e8c7480c4c49ace12f9a1fd95766.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/01/453ea6efb86c4913bb98d6f35c21c9e1.png
[4d29ebc1a772468f80add872c8c491a3.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/01/62e319ec7b9149c0a3e315911a6e7047.png
[7b42bd0b31df444680dc01243fde800a.jpeg_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/01/f251bef52e1340159e36ea20468d6e73.jpeg
[e9ffc56aff094d43885a02f027a0d6da.jpeg_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/01/1ec44d4c5246465685e1f457537dc8cb.jpeg
[2259d8a1270046b79d6b8c57c2da8ae0.jpeg_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/01/184a28f93e4a4cdcaa400354448077ef.jpeg
[06067f5119e64d40860ce303a73dae87.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/04/01/1a1af79da110487eba9f7080e694b660.png