SSM商城项目

最新推荐文章于 2024-05-04 20:45:40 发布

囂蘳

最新推荐文章于 2024-05-04 20:45:40 发布

阅读量784

点赞数 2

文章标签： maven idea java ssm

本文链接：https://blog.csdn.net/GJX00/article/details/121626878

版权

业务描述
管理员通过密码登录到系统中，选择商品管理后，会将数据库中的数据全部查询出来并分页显示到页面上。
管理员可以选择新增商品来添加一个商品的信息，包括商品名称，价格，描述，数量，图片，当选择商品的图片，利用ajax来回显你刚刚添加的商品图片
管理员也可以选择修改（修改时要判断你是否修改了图片）
管理员可以删除商品，删除包括单个删除和批量删除
查询包括多条件查询

SSM中的配置文件

pom.xml：

<?xml version="1.0" encoding="UTF-8"?>

<project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
  xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd">
  <modelVersion>4.0.0</modelVersion>

  <groupId>com.gjx</groupId>
  <artifactId>SSMxiangmu</artifactId>
  <version>1.0</version>
  <packaging>war</packaging>

  <!-- 集中定义依赖版本号 -->
  <properties>
    <junit.version>4.12</junit.version>
    <spring.version>5.2.5.RELEASE</spring.version>
    <mybatis.version>3.5.1</mybatis.version>
    <mybatis.spring.version>1.3.1</mybatis.spring.version>
    <mybatis.paginator.version>1.2.15</mybatis.paginator.version>
    <mysql.version>5.1.9</mysql.version>
    <slf4j.version>1.6.4</slf4j.version>
    <druid.version>1.1.12</druid.version>
    <pagehelper.version>5.1.2</pagehelper.version>
    <jstl.version>1.2</jstl.version>
    <servlet-api.version>3.0.1</servlet-api.version>
    <jsp-api.version>2.0</jsp-api.version>
    <jackson.version>2.9.6</jackson.version>
  </properties>
  <dependencies>

    <!-- spring -->
    <dependency>
      <groupId>org.springframework</groupId>
      <artifactId>spring-context</artifactId>
      <version>${spring.version}</version>
    </dependency>
    <dependency>
      <groupId>org.springframework</groupId>
      <artifactId>spring-beans</artifactId>
      <version>${spring.version}</version>
    </dependency>
    <dependency>
      <groupId>org.springframework</groupId>
      <artifactId>spring-webmvc</artifactId>
      <version>${spring.version}</version>
    </dependency>
    <dependency>
      <groupId>org.springframework</groupId>
      <artifactId>spring-jdbc</artifactId>
      <version>${spring.version}</version>
    </dependency>
    <dependency>
      <groupId>org.springframework</groupId>
      <artifactId>spring-aspects</artifactId>
      <version>${spring.version}</version>
    </dependency>
    <dependency>
      <groupId>org.springframework</groupId>
      <artifactId>spring-jms</artifactId>
      <version>${spring.version}</version>
    </dependency>
    <dependency>
      <groupId>org.springframework</groupId>
      <artifactId>spring-context-support</artifactId>
      <version>${spring.version}</version>
    </dependency>
    <dependency>
      <groupId>org.springframework</groupId>
      <artifactId>spring-test</artifactId>
      <version>${spring.version}</version>
    </dependency>
    <!-- Mybatis -->
    <dependency>
      <groupId>org.mybatis</groupId>
      <artifactId>mybatis</artifactId>
      <version>${mybatis.version}</version>
    </dependency>
    <dependency>
      <groupId>org.mybatis</groupId>
      <artifactId>mybatis-spring</artifactId>
      <version>${mybatis.spring.version}</version>
    </dependency>
    <dependency>
      <groupId>com.github.miemiedev</groupId>
      <artifactId>mybatis-paginator</artifactId>
      <version>${mybatis.paginator.version}</version>
    </dependency>
    <dependency>
      <groupId>com.github.pagehelper</groupId>
      <artifactId>pagehelper</artifactId>
      <version>${pagehelper.version}</version>
    </dependency>
    <!-- MySql -->
    <dependency>
      <groupId>mysql</groupId>
      <artifactId>mysql-connector-java</artifactId>
      <version>${mysql.version}</version>
    </dependency>
    <!-- 连接池 -->
    <dependency>
      <groupId>com.alibaba</groupId>
      <artifactId>druid</artifactId>
      <version>${druid.version}</version>
    </dependency>

    <!-- junit -->
    <dependency>
      <groupId>junit</groupId>
      <artifactId>junit</artifactId>
      <version>${junit.version}</version>
      <scope>test</scope>
    </dependency>


    <!-- JSP相关 -->
    <dependency>
      <groupId>jstl</groupId>
      <artifactId>jstl</artifactId>
      <version>${jstl.version}</version>
    </dependency>
    <dependency>
      <groupId>javax.servlet</groupId>
      <artifactId>javax.servlet-api</artifactId>
      <version>3.0.1</version>
      <scope>provided</scope>
    </dependency>
    <dependency>
      <groupId>javax.servlet</groupId>
      <artifactId>jsp-api</artifactId>
      <scope>provided</scope>
      <version>${jsp-api.version}</version>
    </dependency>
    <!-- Jackson Json处理工具包 -->
    <dependency>
      <groupId>com.fasterxml.jackson.core</groupId>
      <artifactId>jackson-databind</artifactId>
      <version>${jackson.version}</version>
    </dependency>
    <dependency>
      <groupId>commons-io</groupId>
      <artifactId>commons-io</artifactId>
      <version>2.4</version>
    </dependency>
    <dependency>
      <groupId>commons-fileupload</groupId>
      <artifactId>commons-fileupload</artifactId>
      <version>1.3.1</version>
    </dependency>
    <dependency>
      <groupId>org.json</groupId>
      <artifactId>json</artifactId>
      <version>20140107</version>
    </dependency>
<!--    导出excel-->
    <!--POI-->
    <dependency>
      <groupId>org.apache.poi</groupId>
      <artifactId>poi-ooxml-schemas</artifactId>
      <version>3.14-beta1</version>
    </dependency>

  </dependencies>

  <!-- 插件配置 -->
  <build>
    <plugins>
      <plugin>
        <groupId>org.apache.maven.plugins</groupId>
        <artifactId>maven-compiler-plugin</artifactId>
        <version>3.8.1</version>
        <configuration>
          <source>1.8</source>
          <target>1.8</target>
          <encoding>UTF-8</encoding>
        </configuration>
      </plugin>
    </plugins>
    <!--识别所有的配置文件-->
    <resources>
      <resource>
        <directory>src/main/java</directory>
        <includes>
          <include>**/*.properties</include>
          <include>**/*.xml</include>
        </includes>
        <filtering>false</filtering>
      </resource>
      <resource>
        <directory>src/main/resources</directory>
        <includes>
          <include>**/*.properties</include>
          <include>**/*.xml</include>
        </includes>
        <filtering>false</filtering>
      </resource>
    </resources>
  </build>

</project>

web.xml

<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns="http://xmlns.jcp.org/xml/ns/javaee"
         xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
         xsi:schemaLocation="http://xmlns.jcp.org/xml/ns/javaee http://xmlns.jcp.org/xml/ns/javaee/web-app_4_0.xsd"
         version="4.0">
<!--    添加字符编码过滤器-->
    <filter>
        <filter-name>encode</filter-name>
        <filter-class>org.springframework.web.filter.CharacterEncodingFilter</filter-class>
        <init-param>
            <param-name>encoding</param-name>
            <param-value>UTF-8</param-value>
        </init-param>
        <init-param>
            <param-name>forRequestEncoding</param-name>
            <param-value>true</param-value>
        </init-param>
        <init-param>
            <param-name>forResponseEncoding</param-name>
            <param-value>true</param-value>
        </init-param>
    </filter>
    <filter-mapping>
        <filter-name>encode</filter-name>
        <url-pattern>/*</url-pattern>
    </filter-mapping>
<!--    注册springmvc框架-->
    <servlet>
        <servlet-name>springmvc</servlet-name>
        <servlet-class>org.springframework.web.servlet.DispatcherServlet</servlet-class>
        <init-param>
            <param-name>contextConfigLocation</param-name>
            <param-value>classpath:springmvc.xml</param-value>
        </init-param>
    </servlet>
<servlet-mapping>
<!--    /admin/login.action
        /admin/main.jsp
-->
    <servlet-name>springmvc</servlet-name>
    <url-pattern>*.action</url-pattern>

</servlet-mapping>
<!--    注册spring框架-->
<listener>
    <listener-class>org.springframework.web.context.ContextLoaderListener</listener-class>
</listener>
    <context-param>
        <param-name>contextConfigLocation</param-name>
        <param-value>classpath:applicationContext_*.xml</param-value>
    </context-param>
</web-app>

spring的两个配置文件：
applicationContext_dao.xml：

<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns="http://xmlns.jcp.org/xml/ns/javaee"
         xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
         xsi:schemaLocation="http://xmlns.jcp.org/xml/ns/javaee http://xmlns.jcp.org/xml/ns/javaee/web-app_4_0.xsd"
         version="4.0">
<!--    添加字符编码过滤器-->
    <filter>
        <filter-name>encode</filter-name>
        <filter-class>org.springframework.web.filter.CharacterEncodingFilter</filter-class>
        <init-param>
            <param-name>encoding</param-name>
            <param-value>UTF-8</param-value>
        </init-param>
        <init-param>
            <param-name>forRequestEncoding</param-name>
            <param-value>true</param-value>
        </init-param>
        <init-param>
            <param-name>forResponseEncoding</param-name>
            <param-value>true</param-value>
        </init-param>
    </filter>
    <filter-mapping>
        <filter-name>encode</filter-name>
        <url-pattern>/*</url-pattern>
    </filter-mapping>
<!--    注册springmvc框架-->
    <servlet>
        <servlet-name>springmvc</servlet-name>
        <servlet-class>org.springframework.web.servlet.DispatcherServlet</servlet-class>
        <init-param>
            <param-name>contextConfigLocation</param-name>
            <param-value>classpath:springmvc.xml</param-value>
        </init-param>
    </servlet>
<servlet-mapping>
<!--    /admin/login.action
        /admin/main.jsp
-->
    <servlet-name>springmvc</servlet-name>
    <url-pattern>*.action</url-pattern>

</servlet-mapping>
<!--    注册spring框架-->
<listener>
    <listener-class>org.springframework.web.context.ContextLoaderListener</listener-class>
</listener>
    <context-param>
        <param-name>contextConfigLocation</param-name>
        <param-value>classpath:applicationContext_*.xml</param-value>
    </context-param>
</web-app>

applicationContext_service.xml:

<?xml version="1.0" encoding="UTF-8"?>
<beans xmlns="http://www.springframework.org/schema/beans"
       xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
       xmlns:context="http://www.springframework.org/schema/context" xmlns:tx="http://www.springframework.org/schema/tx"
       xmlns:aop="http://www.springframework.org/schema/aop"
       xsi:schemaLocation="http://www.springframework.org/schema/beans http://www.springframework.org/schema/beans/spring-beans.xsd http://www.springframework.org/schema/context https://www.springframework.org/schema/context/spring-context.xsd http://www.springframework.org/schema/tx http://www.springframework.org/schema/tx/spring-tx.xsd http://www.springframework.org/schema/aop https://www.springframework.org/schema/aop/spring-aop.xsd">

<!--    设定业务逻辑层的包扫描器，目的是在指定的路径下使用@service注解的类，spring创建对象,并添加依赖-->
    <context:component-scan base-package="com.gjx.service"/>

<!--    设置事务管理器-->
    <bean id="transactionManager" class="org.springframework.jdbc.datasource.DataSourceTransactionManager">
        <property name="dataSource" ref="dataSource"/>
    </bean>


<!--    添加事务的切面-->
    <tx:advice id="myadvice" transaction-manager="transactionManager">
        <tx:attributes>
            <tx:method name="*select*" read-only="true"/>
            <tx:method name="*find*" read-only="true"/>
            <tx:method name="*get*" read-only="true"/>
            <tx:method name="*search*" read-only="true"/>
            <tx:method name="*insert*" propagation="REQUIRED"/>
            <tx:method name="*save*" propagation="REQUIRED"/>
            <tx:method name="*add*" propagation="REQUIRED"/>
            <tx:method name="*delete*" propagation="REQUIRED"/>
            <tx:method name="*remove*" propagation="REQUIRED"/>
            <tx:method name="*clear*" propagation="REQUIRED"/>
            <tx:method name="*update*" propagation="REQUIRED"/>
            <tx:method name="*modify*" propagation="REQUIRED"/>
            <tx:method name="*change*" propagation="REQUIRED"/>
            <tx:method name="*set*" propagation="REQUIRED"/>
            <tx:method name="*" propagation="SUPPORTS"/>
        </tx:attributes>
    </tx:advice>
<!--    完成切面和切入点的织入-->
    <aop:config>
        <aop:pointcut id="mypointcut" expression="execution(* com.gjx.service.*.*(..))"/>
        <aop:advisor advice-ref="myadvice" pointcut-ref="mypointcut"/>
    </aop:config>
</beans>

springmvc配置文件：

<?xml version="1.0" encoding="UTF-8"?>
<beans xmlns="http://www.springframework.org/schema/beans"
       xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
       xmlns:context="http://www.springframework.org/schema/context"
       xmlns:mvc="http://www.springframework.org/schema/mvc"
       xsi:schemaLocation="http://www.springframework.org/schema/beans http://www.springframework.org/schema/beans/spring-beans.xsd http://www.springframework.org/schema/context https://www.springframework.org/schema/context/spring-context.xsd http://www.springframework.org/schema/mvc https://www.springframework.org/schema/mvc/spring-mvc.xsd">

<!--    设置包扫描器-->
    <context:component-scan base-package="com.gjx.controller"/>
<!--    设置视图解析器-->
    <bean id="viewResolver" class="org.springframework.web.servlet.view.InternalResourceViewResolver">
        <property name="prefix" value="/admin/"/>
        <property name="suffix" value=".jsp"/>
    </bean>
<!--    设置文件上传核心组件-->
    <bean id="multipartResolver" class="org.springframework.web.multipart.commons.CommonsMultipartResolver">

    </bean>

<!--    设置注解驱动-->
    <mvc:annotation-driven/>

<!--    &lt;!&ndash; 配置文件上传解析器 &ndash;&gt;-->
<!--    &lt;!&ndash; id 的值是固定的&ndash;&gt;-->
<!--    <bean id="multipartResolver"-->
<!--          class="org.springframework.web.multipart.commons.CommonsMultipartResolver">-->
<!--        &lt;!&ndash; 设置上传文件的最大尺寸为 5MB &ndash;&gt;-->
<!--        <property name="maxUploadSize">-->
<!--            <value>5242880</value>-->
<!--        </property>-->
<!--    </bean>-->
</beans>

外部文件（properties）为了连接数据库：

jdbc.driver=com.mysql.jdbc.Driver
jdbc.url=jdbc:mysql://localhost:3306/xiaomissm?characterEncoding=utf-8
jdbc.username=root
jdbc.password=

分页插件（mybatis）：

<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE configuration PUBLIC "-//mybatis.org//DTD Config 3.0//EN"
        "http://mybatis.org/dtd/mybatis-3-config.dtd">
<configuration>
        <!--分页插件的配置-->
    <plugins>
        <plugin interceptor="com.github.pagehelper.PageInterceptor"></plugin>
    </plugins>
</configuration>

逆向生成工具

利用MyBatisGeneratorTools来生成对应的dao层接口和mapper文件
简单介绍一下这个工具：利用这个工具能够直接根据你的数据库和表里面的字段来直接生成实体类，和dao层接口和mapper文件
generatorConfig.xml：

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE generatorConfiguration
  PUBLIC "-//mybatis.org//DTD MyBatis Generator Configuration 1.0//EN"
  "http://mybatis.org/dtd/mybatis-generator-config_1_0.dtd">

<generatorConfiguration>
	<context id="testTables" targetRuntime="MyBatis3">
		<commentGenerator>
			<!-- 是否去除自动生成的注释 true：是 ： false:否 -->
			<property name="suppressAllComments" value="true" />
		</commentGenerator>
		<!--数据库连接的信息：驱动类、连接地址、用户名、密码 -->
		<jdbcConnection driverClass="com.mysql.jdbc.Driver"
			connectionURL="jdbc:mysql://localhost:3306/xiaomissm?useSSL=false&amp;serverTimezone=Asia/Shanghai&amp;allowPublicKeyRetrieval=true" userId="root"
			password="">
		</jdbcConnection>
		<!-- 默认false，把JDBC DECIMAL 和 NUMERIC 类型解析为 Integer，为 true时把JDBC DECIMAL 和 
			NUMERIC 类型解析为java.math.BigDecimal -->
		<javaTypeResolver>
			<property name="forceBigDecimals" value="false" />
		</javaTypeResolver>

		<!-- targetProject:生成PO类的位置 -->
		<javaModelGenerator targetPackage="com.gjx.pojo"
			targetProject=".\src">
			<!-- enableSubPackages:是否让schema作为包的后缀 -->
			<property name="enableSubPackages" value="false" />
			<!-- 从数据库返回的值被清理前后的空格 -->
			<property name="trimStrings" value="true" />
		</javaModelGenerator>
        <!-- targetProject:mapper映射文件生成的位置 -->
		<sqlMapGenerator targetPackage="com.gjx.mapper"
			targetProject=".\src">
			<!-- enableSubPackages:是否让schema作为包的后缀 -->
			<property name="enableSubPackages" value="false" />
		</sqlMapGenerator>
		<!-- targetPackage：mapper接口生成的位置 -->
		<javaClientGenerator type="XMLMAPPER"
			targetPackage="com.gjx.mapper"
			targetProject=".\src">
			<!-- enableSubPackages:是否让schema作为包的后缀 -->
			<property name="enableSubPackages" value="false" />
		</javaClientGenerator>
		<!-- 指定数据库表 -->
		<table schema="" tableName="admin"></table>
		<table schema="" tableName="product_info"></table>
		<table schema="" tableName="product_type"></table>



	</context>
</generatorConfiguration>

MyBatisGeneratorTools主方法：

package com.oracle.mybatis.tools;


import java.io.File;
import java.io.IOException;
import java.util.ArrayList;
import java.util.List;

import org.mybatis.generator.api.MyBatisGenerator;
import org.mybatis.generator.config.Configuration;
import org.mybatis.generator.config.xml.ConfigurationParser;
import org.mybatis.generator.exception.XMLParserException;
import org.mybatis.generator.internal.DefaultShellCallback;

public class GeneratorSqlmap {

	public void generator() throws Exception{

		List<String> warnings = new ArrayList<String>();
		boolean overwrite = true;
		//指定 逆向工程配置文件
		File configFile = new File("generatorConfig.xml"); 
		ConfigurationParser cp = new ConfigurationParser(warnings);
		Configuration config = cp.parseConfiguration(configFile);
		DefaultShellCallback callback = new DefaultShellCallback(overwrite);
		MyBatisGenerator myBatisGenerator = new MyBatisGenerator(config,
				callback, warnings);
		myBatisGenerator.generate(null);

	} 
	public static void main(String[] args) throws Exception {
		try {
			GeneratorSqlmap generatorSqlmap = new GeneratorSqlmap();
			generatorSqlmap.generator();
		} catch (Exception e) {
			e.printStackTrace();
		}
		
	}

}

需要的jar包：
在这里插入图片描述

登录模块：

因为是管理员所以不能进行注册，管理员的用户名和密码是直接写入到数据库当中的。为了保证安全开发人员不能直接看见密码，给开发人员的密码应该是经过加密之后得到的这里我们需要用到一个加密的工具类MD5

package com.gjx.utils;

import java.security.MessageDigest;
import java.security.NoSuchAlgorithmException;

public class MD5Util {
    /**
     * 1.MD5（message-digest algorithm 5）信息摘要算法，
     *   它的长度一般是32位的16进制数字符串（如81dc9bdb52d04dc20036dbd8313ed055）
     * 2.由于系统密码明文存储容易被黑客盗取
     * 3.应用：注册时，将密码进行md5加密，存到数据库中，防止可以看到数据库数据的人恶意篡改。
     *       登录时,将密码进行md5加密,与存储在数据库中加密过的密码进行比对
     * 4.md5不可逆，即没有对应的算法，从产生的md5值逆向得到原始数据。
     *   但是可以使用暴力破解，这里的破解并非把摘要还原成原始数据，如暴力枚举法。
     *
     */
    public final static String getMD5(String str){
        try {
            MessageDigest md = MessageDigest.getInstance("SHA");//创建具有指定算法名称的摘要
            md.update(str.getBytes());                    //使用指定的字节数组更新摘要
            byte mdBytes[] = md.digest();                 //进行哈希计算并返回一个字节数组

            String hash = "";
            for(int i= 0;i<mdBytes.length;i++){           //循环字节数组
                int temp;
                if(mdBytes[i]<0)                          //如果有小于0的字节,则转换为正数
                    temp =256+mdBytes[i];
                else
                    temp=mdBytes[i];
                if(temp<16)
                    hash+= "0";
                hash+=Integer.toString(temp,16);         //将字节转换为16进制后，转换为字符串
            }
            return hash;
        } catch (NoSuchAlgorithmException e) {
            e.printStackTrace();
        }
        return null;
    }
}

在管理员输入真正的密码后接收输入的密码进行加密与数据库中存的加密的算法一样后成功登陆系统
AdminService：

package com.gjx.service;

import com.gjx.pojo.Admin;

public interface AdminService {
    //完成登录判断
    Admin login(String name, String pwd);
}

AdminServiceImpl：

package com.gjx.service.impl;

import com.gjx.mapper.AdminMapper;
import com.gjx.pojo.Admin;
import com.gjx.pojo.AdminExample;
import com.gjx.service.AdminService;
import com.gjx.utils.MD5Util;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Service;

import java.util.List;

@Service
public class AdminServiceImpl implements AdminService {
    //在业务逻辑层中一定会有访问数据层的对象
    @Autowired
    AdminMapper adminMapper;
    @Override
    public Admin login(String name, String pwd) {
        //根据传入的用户名到数据库中查询相应的对象
        //如果有条件则一定要创建AdminExample的对象，用来封装条件
        AdminExample example=new AdminExample();
        /**
         * 如何进行条件添加
         * select * from admin where a_name="admin"
         */
        //添加用户名a_name条件
        example.createCriteria().andANameEqualTo(name);
        List<Admin> list=adminMapper.selectByExample(example);
        if(list.size()>0){
            Admin admin=list.get(0);
            //如果查询到用户对象，进行密码比对,注意密码是密文
            /**
             * admin.getApass（）拿到的是密文
             * pwd是000000
             * 在进行密码对比时要将传入的密码进行md5加密，在与数据库中查到的密码进行处理
             */
            String mipwd= MD5Util.getMD5(pwd);
            if(mipwd.equals(admin.getaPass())){
                return admin;
            }
        }

        return null;
    }
}

controller层：
AdminAction：

package com.gjx.controller;

import com.gjx.pojo.Admin;
import com.gjx.service.AdminService;
//import com.gjx.utils.OutExcel;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.ResponseBody;

import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.FileOutputStream;
import java.io.OutputStream;
import java.text.SimpleDateFormat;
import java.util.*;

@Controller
@RequestMapping("/admin")
public class AdminAction {
    //切记：在所有的界面层一定会有业务逻辑层的对象
    @Autowired
    AdminService adminService;
    //实现登录判断,进行相应的跳转
    @RequestMapping("/login")
    public String login(String name, String pwd, HttpServletRequest request){
        Admin admin=adminService.login(name, pwd);
        if(admin!=null){
            //成功
            request.setAttribute("admin",admin);
            return "main";
        }else{
            request.setAttribute("errmsg","用户名或密码不正确");
           return "login" ;
        }

    }
//    // 以excel的形式导出
//    @RequestMapping("/derivedExcel")
//    @ResponseBody
//    public ResultObject derivedExcel(Integer age, Integer bacth, Integer recordType, String competentAuthority,
//                                     String startTime, String endTime, Integer leadingLevel, String username) {
//        ResultObject retObj = ResultObject.getFailResultObject();
//        int pageNum = 0;
//        int num = 20000;
//        List<BusinessSwitch> bs = businessSwitchService.findEnterpriseByBussiness(age, bacth, recordType,
//                competentAuthority, startTime, endTime, leadingLevel, username, pageNum, num);
//        int count = businessSwitchService.countEnterpriseNum(age, bacth, recordType, competentAuthority, startTime,
//                endTime, leadingLevel, username);
//        Map<String, Object> modelList = new HashMap<>();
//        SimpleDateFormat formatter = new SimpleDateFormat("yyyyMMddHHmmss");
//        SimpleDateFormat annual = new SimpleDateFormat("yyyy");
//        SimpleDateFormat time = new SimpleDateFormat("yyyy-MM-dd");
//        int total = count / num + 1;
//        List<String> header = new ArrayList<>();
//        header.add("区域");
//        header.add("名称");
//        header.add("级别");
//        header.add("年度");
//        header.add("批次");
//        header.add("类型");
//        header.add("时间");
//        modelList.put("total", total);
//        modelList.put("number", count);
//        modelList.put("enterprises", bs);
//        List<List<String>> body = new ArrayList<>();
//        for (int i = 0; i < bs.size(); i++) {
//            List<String> data = new ArrayList<>();
//            data.add(bs.get(i).getCompetentAuthority());
//            data.add(bs.get(i).getUsername());
//            if ("0".equals(bs.get(i).getLeadingLevel())) {
//                bs.get(i).setLeadingLevel("国家级");
//            } else if ("1".equals(bs.get(i).getLeadingLevel())) {
//                bs.get(i).setLeadingLevel("市级");
//            } else if ("2".equals(bs.get(i).getLeadingLevel())) {
//                bs.get(i).setLeadingLevel("非");
//            } else if ("3".equals(bs.get(i).getLeadingLevel())) {
//                bs.get(i).setLeadingLevel("区级");
//            } else if ("2".equals(bs.get(i).getLeadingLevel())) {
//                bs.get(i).setLeadingLevel("省级");
//            }
//            data.add(bs.get(i).getLeadingLevel());
//            data.add(annual.format(bs.get(i).getTimeOfSubmission().getTime()));
//            data.add(bs.get(i).getBacth() + "");
//            data.add(bs.get(i).getRecordType());
//            data.add(time.format(bs.get(i).getTimeOfSubmission().getTime()));
//            body.add(data);
//        }
//        Date date = new Date();
//
//        String dateString = formatter.format(date);
//        try (OutputStream out = new FileOutputStream("D:/" + dateString + "test.xls") // 输出目的地
//
//        ) {
//            OutExcel.generateExcel("sheetName", header, body, out);
//        } catch (Exception e) {
//            e.printStackTrace();
//        }
//
//        retObj.setData(modelList);
//        return retObj;
//    }
    /**
     * 导出Excel
     * @param request
     * @param response
     */
//    @RequestMapping("/exportExcel")
//    @ResponseBody
//    public void exportExcel(HttpServletRequest request, HttpServletResponse response){
//        try {
//            //获取数据源
//            List<User> userList = service.queryUserAll();
//            //导出excel
//            response.setHeader("Content-Disposition","attachment;filename="+new String("用户信息.xls".getBytes(),"ISO-8859-1"));
//            response.setContentType("application/x-excel;charset=UTF-8");
//            OutputStream outputStream = response.getOutputStream();
//            //导出
//            service.exportExcel(userList,outputStream);
//            outputStream.close();
//        } catch (IOException e) {
//            e.printStackTrace();
//        }
//    }
}

dao层和mapper文件直接使用逆向工具生成的
工程目录的图片：
在这里插入图片描述

登录界面：

在这里插入图片描述

当管理员选择商品管理后这是利用ajax查询到所有的商品信息渲染到页面中
在这里插入图片描述

分页用的是PageHelper

在这里插入图片描述
简单介绍一下里面属性的意思：
1.pageNum：指的是当前的页数
2.pageSize：每页存放几条数据
分页用到的就是这两个属性

商品的Service层

ProductInfoService：

package com.gjx.service;

import com.github.pagehelper.PageInfo;
import com.gjx.pojo.ProductInfo;

import java.util.List;

public interface ProductInfoService {
    //显示全部商品不分页
    List<ProductInfo> getAll();
    //分页功能显示
    PageInfo spliPage(int pageNum,int pageSize);
//增加商品
    int save(ProductInfo info);
    //按主键id查询
    ProductInfo getByID(int pid);
    //更新商品
    int update(ProductInfo info);
//    //删除商品
//    int delete(int id);

    //删除单个商品
    int delete(int pid);

    //批量删除商品
    int deleteBatch(String []ids);
}

ProductInfoimpl：

package com.gjx.service.impl;
import com.github.pagehelper.PageHelper;
import com.github.pagehelper.PageInfo;
import com.gjx.mapper.ProductInfoMapper;
import com.gjx.pojo.ProductInfo;
import com.gjx.pojo.ProductInfoExample;
import com.gjx.service.ProductInfoService;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Service;
import java.util.List;
@Service
public class ProductInfoServiceImpl implements ProductInfoService {
    @Autowired
    ProductInfoMapper productInfoMapper;
    @Override
    public List<ProductInfo> getAll() {
        return productInfoMapper.selectByExample(new ProductInfoExample());
    }

    @Override
    public PageInfo spliPage(int pageNum, int pageSize) {
        //pageNum当前页      pageSize每页放多少数据
        //分页插件PageHelper工具类完成分页设置
        PageHelper.startPage(pageNum,pageSize);

        //进行PageInfo的数据封装
        //进行有条件查询操作，必须创建ProductInfoExampel
        ProductInfoExample example=new ProductInfoExample();
        //设置排序，按当前主键降序排序，
        example.setOrderByClause("p_id desc");
        //设置完排序后取集合  一定在取集合之前设置PageHelper.startPage(pageNum,pageSize);
        List<ProductInfo> list=productInfoMapper.selectByExample(example);
        //将查到的集合分装到PageInfo
        PageInfo<ProductInfo> pageInfo=new PageInfo<>(list);
        return pageInfo;
    }

    @Override
    public int save(ProductInfo info) {
        return productInfoMapper.insert(info);
    }

    @Override
    public ProductInfo getByID(int pid) {
        return productInfoMapper.selectByPrimaryKey(pid);
    }

    @Override
    public int update(ProductInfo info) {
        return productInfoMapper.updateByPrimaryKey(info);
    }

    @Override
    public int delete(int pid) {
        return productInfoMapper.deleteByPrimaryKey(pid);
    }

    @Override
    public int deleteBatch(String[] ids) {
        return productInfoMapper.deleteBatch(ids);
    }

//    @Override
//    public int delete(int id) {
//        return productInfoMapper.deleteByPrimaryKey(id);
//    }


}

商品的controller层

ProductInfoController：

package com.gjx.controller;
import com.github.pagehelper.PageInfo;
import com.gjx.pojo.ProductInfo;
import com.gjx.service.ProductInfoService;
import com.gjx.utils.FileNameUtil;
import org.json.JSONObject;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.ResponseBody;
import org.springframework.web.multipart.MultipartFile;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpSession;
import java.io.File;
import java.io.IOException;
import java.util.Date;
import java.util.List;
@Controller
@RequestMapping("/prod")
public class ProductInfoAction {
    //每页显示的记录数
    public static final int  PAGE_SIZE=5;
    //异步上传的文件名称
    String saveFileName="";
    @Autowired
    ProductInfoService productInfoService;
    //显示全部商品不分页
    @RequestMapping("/getALl")
    public String getAll(HttpServletRequest request){
        List<ProductInfo> list=productInfoService.getAll();
        request.setAttribute("list",list);
        return "product";
    }
    //显示第一页的5条记录
    @RequestMapping("/split")
    public String split(HttpServletRequest request){
        //得到第一页的数据
        PageInfo info=productInfoService.spliPage(1,PAGE_SIZE);
        request.setAttribute("info",info);
        return "product";
    }
    //ajax分页的翻页处理
    @ResponseBody
    @RequestMapping("/ajaxSplit")
    public void ajaxSplit(int page, HttpSession session){
        //取得当前page参数页面数据
        PageInfo info=productInfoService.spliPage(page,PAGE_SIZE);
        session.setAttribute("info",info);
    }
    //异步ajax文件上传的处理
    @ResponseBody
    @RequestMapping("/ajaxImg")
    public Object ajaxImg(MultipartFile pimage,HttpServletRequest request){
        //提取生成文件名UUID+上传图片的后缀
        saveFileName= FileNameUtil.getUUIDFileName()+FileNameUtil.getFileType(pimage.getOriginalFilename());
        //得到项目中图片存储的路径
        String path=request.getServletContext().getRealPath("image_big");
       System.out.println(path);
        //转存 E:\idea_workspace\mimissm\image_big\23454546545f.jpg
        try {
            pimage.transferTo(new File(path+File.separator+saveFileName));
        } catch (IOException e) {
            e.printStackTrace();
        }
        //返回客户端JSON对象，封装图片路径，为了在页面实现立即回显
        JSONObject object=new JSONObject();
        object.put("imgurl",saveFileName);
        return object.toString();
    }
    @RequestMapping("/save")
    public String save(ProductInfo info,HttpServletRequest request){
        info.setpImage(saveFileName);
        info.setpDate(new Date());
        System.out.println(info);
        //info对象中有表单提交上来的5个数据，有异步ajax上来的图片名称的数据，有上架时间的数据
        int num=-1;
        try {
            num=productInfoService.save(info);
        } catch (Exception e) {
            e.printStackTrace();
        }
        if(num>0){
            //成功
            request.setAttribute("msg","增加成功！");
        }else {
            request.setAttribute("msg","增加失败！");
        }
        //清空saveFileName变量的内容，为了下次增加或修改的异步ajax的上传处理
        saveFileName="";
        //增加成功后，重新访问数据库，跳转到分页显示的action上
        return "forward:/prod/split.action";
    }
    @RequestMapping("/one")
    public String one(int pid, Model model){
        ProductInfo info=productInfoService.getByID(pid);
        model.addAttribute("prod",info);
        System.out.println(info);
        return "update";
    }

    @RequestMapping("/update")
    public String update(ProductInfo info,HttpServletRequest request){
        //因为ajax异步的图片上传，如果有上传则saveFileName里有上传的图片名称，
        // 如果没有则saveFileName为空，实体类info使用隐藏表单域pImage原始图片名称；
        if(!saveFileName.equals("")){
            info.setpImage(saveFileName);
        }
        int num=-1;
        try {
            num=productInfoService.update(info);
        } catch (Exception e) {
            e.printStackTrace();
        }
        if(num>0){
            //更新成功
         request.setAttribute("msg","更新成功");
        }else {
            //更新失败
            request.setAttribute("msg","更新失败");

        }
        //处理完更新后saveFileName有可能有数据，
        // 而下一次更新要使用这个变量判断就会出错所以要清空
        saveFileName="";
        return "forward:/prod/split.action";
    }
    @RequestMapping("/delete")
//    public String delete(String id,HttpServletRequest request){
//        id= request.getParameter("pid");
//        System.out.println("id========="+id);
//        int n=Integer.parseInt(id);
//        int m=productInfoService.delete(n);
//        if(m>0){
//            request.setAttribute("msg","删除成功");
//        }else {
//            request.setAttribute("msg","删除失败");
//        }
//
//        return "forward:/prod/split.action";
//    }
    public String delete(int pid,HttpServletRequest request){
        int num=-1;
        try {
            num=productInfoService.delete(pid);
        } catch (Exception e) {
            e.printStackTrace();
        }
        if (num>0){
            request.setAttribute("msg","删除成功");
        }else {
            request.setAttribute("msg","删除失败");
        }
        //删除结束后跳到分页显示
        return "forward:/prod/deleteAjaxSplit.action";
    }
    @ResponseBody
    @RequestMapping(value = "/deleteAjaxSplit",produces = "text/html;charset=UTF-8")
    public Object deleteAjaxSplit(HttpServletRequest request){
        //取得第一页的数据
        PageInfo info=productInfoService.spliPage(1,PAGE_SIZE);
        request.getSession().setAttribute("info",info);
        return request.getAttribute("msg");
    }

    //批量删除商品
    @RequestMapping("/deleteBatch")
    //pids="1,4,5"   ps[1,4,5]
    public String deleteBacth(String pids,HttpServletRequest request){
        //将上传上来的字符串，形成商品id的字符数组
        String []ps=pids.split(",");
        int num=productInfoService.deleteBatch(ps);
        try {
            if (num>0){
                request.setAttribute("msg","批量删除成功");
            }else {
                request.setAttribute("msg","批量删除失败");
            }
        } catch (Exception e) {
            e.printStackTrace();
            request.setAttribute("msg","商品不可删除");
        }
        return "forward:/prod/deleteAjaxSplit.action";
    }
}

商品添加：

当你选择一个商品图片后回显到当前的页面上
实现的步骤：
1.选择增加商品后跳转到增加商品的页面上，当选择上传图片后会触发ajax事件去到用controller层中的方法去添加图片（注意此时的图片因为还没有提交所以是存在服务器当中的并没有存在数据库中，从服务器中取出来回显到此页面，当提交了之后再存在数据库当中。）为了防止有重名的图片我们要自动给图片生成一个名字。
在这里插入图片描述

生成图片名称的工具类

FileNameUtil：

package com.gjx.utils;

import java.util.UUID;

public class FileNameUtil {
	//根据UUID生成文件名
	public static String getUUIDFileName() {
		UUID uuid = UUID.randomUUID();
		return uuid.toString().replace("-", "");
	}
	//从请求头中提取文件名和类型
	public static String getRealFileName(String context) {
		// Content-Disposition: form-data; name="myfile"; filename="a_left.jpg"
		int index = context.lastIndexOf("=");
		String filename = context.substring(index + 2, context.length() - 1);
		return filename;
	}
	//根据给定的文件名和后缀截取文件名
	public static String getFileType(String fileName){
		//9527s.jpg
		int index = fileName.lastIndexOf(".");
		return fileName.substring(index);
	}
}

在添加商品信息的时候商品的类别不是在前端写死的，是从数据库的字典表中获取的，实现的方式是，声明了一个作用于全局的监听类将商品的类型封装到一个集合中在页面中遍历这个集合取出所有的类型
ProductTypeListener：

package com.gjx.listener;

import com.gjx.pojo.ProductType;
import com.gjx.service.ProductTypeService;
import org.springframework.context.ApplicationContext;
import org.springframework.context.support.ClassPathXmlApplicationContext;

import javax.servlet.ServletContextEvent;
import javax.servlet.ServletContextListener;
import javax.servlet.annotation.WebListener;
import java.util.List;

@WebListener
public class ProductTypeListener implements ServletContextListener {
    @Override
    public void contextInitialized(ServletContextEvent sce) {
        //手工从spring容器中取出ProductTypeServiceImpl的对象。
        ApplicationContext ctx=new ClassPathXmlApplicationContext("applicationContext_*.xml");
        ProductTypeService service=(ProductTypeService) ctx.getBean("productTypeServiceImpl");
        List<ProductType> typeList=service.getAll();
        //放入全局应用作用域，供新增页面，修改页面，前台查询功能提供全部商品类别集合
        sce.getServletContext().setAttribute("typeList",typeList);
    }

    @Override
    public void contextDestroyed(ServletContextEvent sce) {

    }
}

商品修改：

在这里插入图片描述
当选中一个商品后会获取该商品的所有信息并且赋值到页面当中（这个时候就出现了一个问题，我们没有修改这个图片的时候应该是原先的图片，如果我们修改了图片那么就应该回显当前的图片到页面当中，在提交后修改数据，还有如果用户是先添加了了之后再修改那么saveFileName就会保留之前的文件名，因为他是全局变量）我们要判断是否修改了图片（如果修改了，那么就应该将saveFileName赋值为空，ajax重新调用ajax回显的方法）会获得修改后商品的图片
在这里插入图片描述

单个商品删除：

在这里插入图片描述
当点击了删除后会得当前商品的id，通过id删除商品并重新渲染删除后的页面
通过ajax请求controller层调用service的方法实现删除

批量删除

通过复选框将选择中的商品的id拼接到一个字符串的变量当中然后通过字符串中的split（）方法分隔，存到一个数组中，利用动态sql删除选择的所有的商品

<!--  批量删除商品-->
  <delete id="deleteBatch" >
    delete from product_info where p_id in
<foreach collection="array" item="pid" separator="," open="(" close=")">
  #{pid}
</foreach>

  </delete>

动态sql的知识点：

foreach

foreach 标签
foreach标签主要有以下参数：
item ：循环体中的具体对象。支持属性的点路径访问，如item.age,item.info.details，在list和数组中是其中的对象，在map中是value。
index ：在list和数组中,index是元素的序号，在map中，index是元素的key，该参数可选。
open ：表示该语句以什么开始
close ：表示该语句以什么结束
separator ：表示元素之间的分隔符，例如在in()的时候，separator=","会自动在元素中间用“,“隔开，避免手动输入逗号导致sql错误，如in(1,2,)这样。该参数可选。

where and

where, 有了我，SQL语句拼接条件神马的都是浮云！
咱们通过where改造一下上面的例子：

select * from user id=#{id} and deleteFlag=0;

有些人就要问了： “你这都是些什么玩意儿！跟上面的相比，不就是多了个where标签嘛！那这个还会不会出现 select * from user where and deleteFlag=0 ？”

where会去掉相邻的and或者or

例如：

</delete>
<!--  多条件查询-->
  <select id="selectCondition" parameterType="com.gjx.pojo.vo.ProductInfoVo" resultMap="BaseResultMap">
    select <include refid="Base_Column_List"></include>
    from product_info
          <!--拼接条件 -->
                <where>
          <!--商品名称不为空，拼接商品名称模糊查询 -->
                  <if test="pname !=null and pname !=''">
                    and p_name like '%${pname}%'
                  </if>
                  <!--商品类型不为空，拼接商品类型模糊查询 -->
                    <if test="typeid !=null and typeid != ''">
                      and type_id =#{typeid}
                    </if>
                  <!--如果最低价格不为空，最高价格为空，则查询大于最低价格的所有商品 -->
                    <if test="(lprice !=null and lprice != '') and (hprice ==null or hprice == '')">
                      and p_price &gt;=#{lprice}
                    </if>
                  <!--如果最高价格不为空，最低价格为空，则查询小于最高价格的所有商品 -->
                    <if test="(hprice !=null and hprice !='') and (lprice ==null or lprice == '')">
                      and p_price &lt;= #{hprice}
                    </if>
                  <!--如果最高价格不为空，最低价格不为空，则查询介于最高和最低价格之间的所有商品 -->
                    <if test="(lprice !=null and lprice !='') and (lprice != null and lprice !='')">
                      and p_price between #{lprice} and #{hprice}
                    </if>
                </where>
            order by p_id desc

上述if全部满足那么sql变为：

select <include refid="Base_Column_List"></include>
    from product_info where p_name like '%${pname}%' and type_id =#{typeid} and p_price &gt;=#{lprice}

 and p_price &lt;= #{hprice} and p_price between #{lprice} and #{hprice}

多条件查询

利用动态sql实现

<!--  多条件查询-->
  <select id="selectCondition" parameterType="com.gjx.pojo.vo.ProductInfoVo" resultMap="BaseResultMap">
    select <include refid="Base_Column_List"></include>
    from product_info
          <!--拼接条件 -->
                <where>
          <!--商品名称不为空，拼接商品名称模糊查询 -->
                  <if test="pname !=null and pname !=''">
                    and p_name like '%${pname}%'
                  </if>
                  <!--商品类型不为空，拼接商品类型模糊查询 -->
                    <if test="typeid !=null and typeid != ''">
                      and type_id =#{typeid}
                    </if>
                  <!--如果最低价格不为空，最高价格为空，则查询大于最低价格的所有商品 -->
                    <if test="(lprice !=null and lprice != '') and (hprice ==null or hprice == '')">
                      and p_price &gt;=#{lprice}
                    </if>
                  <!--如果最高价格不为空，最低价格为空，则查询小于最高价格的所有商品 -->
                    <if test="(hprice !=null and hprice !='') and (lprice ==null or lprice == '')">
                      and p_price &lt;= #{hprice}
                    </if>
                  <!--如果最高价格不为空，最低价格不为空，则查询介于最高和最低价格之间的所有商品 -->
                    <if test="(lprice !=null and lprice !='') and (lprice != null and lprice !='')">
                      and p_price between #{lprice} and #{hprice}
                    </if>
                </where>
            order by p_id desc
  </select>

最后一个简单的SSM项目就完成了，主要是熟悉使用SSM框架，用到了ajax，逆向生成工具，mybatis提供的分页功能，加深对sql语句的理解

项目中用到的jsp文件：

login.jsp：

<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>

<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<link rel="stylesheet" href="${pageContext.request.contextPath}/css/bootstrap.css" />
		<link rel="stylesheet" href="${pageContext.request.contextPath}/css/login.css" />
		<script type="text/javascript" src="${pageContext.request.contextPath}/js/jquery-3.3.1.js"></script>
		<script type="text/javascript" src="${pageContext.request.contextPath}/js/bootstrap.js"></script>
		<title></title>
		
	</head>

	<body>
		<div id="login">
			<div id="top">
				<img height="100px" width="100px" src="${pageContext.request.contextPath}/images/cloud.gif" /><span>登录</span>
			</div>
			<div id="bottom">
				<form  action="${pageContext.request.contextPath}/admin/login.action" method="post">
					<table border="0px" id="table">
						<tr>
							<td class="td1">用户名：</td>
							<td><input type="text" value="admin" placeholder="Username" class="td2" name="name"></td>
						</tr>
						<tr>
							<td></td>
							<td><span id="nameerr"></span></td>
						</tr>
						<tr>
							<td class="td1">密码：</td>
							<td><input type="password"  value="000000" placeholder="Password" class="td2" name="pwd"></td>
						</tr>
						<tr>
							<td></td>
							<td><span id="pwderr"></span></td>
						</tr>
						<tr>
							<td></td>
							<td><input type="submit" value="登录" class="td3">
								<a href="${pageContext.request.contextPath}/regist.jsp"><input type="button" value="注册" class="td3	"></a>
							</td>
						</tr>
					</table>
				</form>
				${errmsg}
			</div>

		</div>
	</body>

</html>

main.jsp：

<%@ page language="java" contentType="text/html; charset=UTF-8"
		 pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<link rel="stylesheet" href="${pageContext.request.contextPath}/css/bootstrap.css" />
		<link rel="stylesheet" href="${pageContext.request.contextPath}/css/index.css" />
		<script type="text/javascript" src="${pageContext.request.contextPath}/js/jquery-3.3.1.js"></script>
		<script type="text/javascript" src="${pageContext.request.contextPath}/js/bootstrap.js"></script>
		<title></title>
		<%--<link href="${pageContext.request.contextPath}/css/main.css" rel="stylesheet" >--%>
		<style type="text/css">
		
		</style>
	</head>

	<body>
		<!--整体部分-->
		<div id="all">
			<!--上部分-->
			<div id="top">
				<div id="top1">
					<span>商品管理系统</span>
				</div>
				<div id="top2"></div>
				<div id="top3">
					<span>欢迎您，${admin.aName}</span>
				</div>
			</div>
			<!--下部分-->
			<div id="bottom">
				<!--下部分左边-->
				<div id="bleft">
					<div id="ltop">
						<div id="lts">
							<img height="196px" width="196px" src="${pageContext.request.contextPath}/images/logo.jpg" /><br />
							<p style="text-align: center;">随机访客</p>
						</div>
					</div>
					<div id="lbottom">
						<ul>
							<a href="${pageContext.request.contextPath}/prod/split.action" target="myright" >
								<li class="two"><span class="glyphicon glyphicon-book" style="color: white;"></span>&nbsp;&nbsp;&nbsp;&nbsp;商品管理&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="glyphicon glyphicon-play" style="color: white;"></span> </li>
							</a>
							<a href="${pageContext.request.contextPath}/admin/err.jsp" target="myright">
								<li class="one"><span class="glyphicon glyphicon-sort" style="color: white;"></span>&nbsp;&nbsp;&nbsp;&nbsp;订单管理&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="glyphicon glyphicon-play" style="color: white;"></span> </li>
							</a>
							<a href="${pageContext.request.contextPath}/admin/err.jsp" target="myright">
								<li class="one"><span class="glyphicon glyphicon-user" style="color: white;"></span>&nbsp;&nbsp;&nbsp;&nbsp;用户管理&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="glyphicon glyphicon-play" style="color: white;"></span> </li>
							</a>
							<a href="${pageContext.request.contextPath}/admin/err.jsp" target="myright">
								<li class="one"><span class="glyphicon glyphicon-bullhorn" style="color: white"></span>&nbsp;&nbsp;&nbsp;&nbsp;通知公告&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="glyphicon glyphicon-play" style="color: white;"></span> </li>
							</a>
						</ul>
					</div>
				</div>
				<!--下部分右边-->
				<div id="bright">
					<iframe frameborder="0" scrolling="no" name="myright" width="1235px" height="700px" ></iframe>
				</div>
			</div>
		</div>
	</body>

</html>

product.jsp：

<%@ page contentType="text/html;charset=UTF-8" language="java" %>

<%@page import="java.util.*" %>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">

    <script type="text/javascript">
        if ("${msg}" != "") {
            alert("${msg}");
        }
    </script>

    <c:remove var="msg"></c:remove>

    <link rel="stylesheet" href="${pageContext.request.contextPath}/css/bootstrap.css"/>
    <link rel="stylesheet" href="${pageContext.request.contextPath}/css/bright.css"/>
    <link rel="stylesheet" href="${pageContext.request.contextPath}/css/addBook.css"/>
    <script type="text/javascript" src="${pageContext.request.contextPath}/js/jquery-3.3.1.js"></script>
    <script type="text/javascript" src="${pageContext.request.contextPath}/js/bootstrap.js"></script>
    <title></title>
</head>
<script type="text/javascript">
    function allClick() {
       //获取当前点击后全选按钮的状态
        var flag=$("#all").prop("checked");
        //将此状态赋值给下边五个复选框
        $("input[name='ck']").each(function (){
            this.checked=flag;
        });
    }

    function ckClick() {
        //得到下面五个复选框的个数
        var fiveLength=$("input[name='ck']").length;
        //得到下面五个复选框被选中的个数
        var checkedLength=$("input[name='ck']:checked").length;
        //进行对比，改变全选复选框的状态
        if (fiveLength==checkedLength){
            $("#all").prop("checked",true);
        }else {
            $("#all").prop("checked",false);
        }
    }
</script>
<body>
<div id="brall">
    <div id="nav">
        <p>商品管理>商品列表</p>
    </div>
    <div id="condition" style="text-align: center">
        <form id="myform">
            商品名称：<input name="pname" id="pname">&nbsp;&nbsp;&nbsp;
            商品类型：<select name="typeid" id="typeid">
            <option value="-1">请选择</option>
            <c:forEach items="${ptlist}" var="pt">
                <option value="${pt.typeId}">${pt.typeName}</option>
            </c:forEach>
        </select>&nbsp;&nbsp;&nbsp;
            价格：<input name="lprice" id="lprice">-<input name="hprice" id="hprice">
            <input type="button" value="查询" onclick="ajaxsplit(${info.pageNum})">
        </form>
    </div>
    <br>
    <div id="table">

        <c:choose>
            <c:when test="${info.list.size()!=0}">

                <div id="top">
                    <input type="checkbox" id="all" onclick="allClick()" style="margin-left: 50px">&nbsp;&nbsp;全选
                    <a href="${pageContext.request.contextPath}/admin/addproduct.jsp">

                        <input type="button" class="btn btn-warning" id="btn1"
                               value="新增商品">
                    </a>
                    <input type="button" class="btn btn-warning" id="btn1"
                           value="批量删除" onclick="deleteBatch()">
                </div>
                <!--显示分页后的商品-->
                <div id="middle">
                    <table class="table table-bordered table-striped">
                        <tr>
                            <th></th>
                            <th>商品名</th>
                            <th>商品介绍</th>
                            <th>定价（元）</th>
                            <th>商品图片</th>
                            <th>商品数量</th>
                            <th>操作</th>
                        </tr>
                        <c:forEach items="${info.list}" var="p">
                            <tr>
                                <td valign="center" align="center"><input type="checkbox" name="ck" id="ck" value="${p.pId}" onclick="ckClick()"></td>
                                <td>${p.pName}</td>
                                <td>${p.pContent}</td>
                                <td>${p.pPrice}</td>
                                <td><img width="55px" height="45px"
                                         src="${pageContext.request.contextPath}/image_big/${p.pImage}"></td>
                                <td>${p.pNumber}</td>
                                    <%--<td><a href="${pageContext.request.contextPath}/admin/product?flag=delete&pid=${p.pId}" onclick="return confirm('确定删除吗？')">删除</a>--%>
                                    <%--&nbsp;&nbsp;&nbsp;<a href="${pageContext.request.contextPath}/admin/product?flag=one&pid=${p.pId}">修改</a></td>--%>
                                <td>
                                    <button type="button" class="btn btn-info "
                                            onclick="one(${p.pId})">编辑
                                    </button>
                                    <button type="button" class="btn btn-warning" id="mydel"
                                            onclick="del(${p.pId})">删除
                                    </button>
                                </td>
                            </tr>
                        </c:forEach>
                    </table>
                    <!--分页栏-->
                    <div id="bottom">
                        <div>
                            <nav aria-label="..." style="text-align:center;">
                                <ul class="pagination">
                                    <li>
                                            <%--                                        <a href="${pageContext.request.contextPath}/prod/split.action?page=${info.prePage}" aria-label="Previous">--%>
                                        <a href="javascript:ajaxsplit(${info.prePage})" aria-label="Previous">

                                            <span aria-hidden="true">«</span></a>
                                    </li>
                                    <c:forEach begin="1" end="${info.pages}" var="i">
                                        <c:if test="${info.pageNum==i}">
                                            <li>
                                                    <%--                                                <a href="${pageContext.request.contextPath}/prod/split.action?page=${i}" style="background-color: grey">${i}</a>--%>
                                                <a href="javascript:ajaxsplit(${i})"
                                                   style="background-color: grey">${i}</a>
                                            </li>
                                        </c:if>
                                        <c:if test="${info.pageNum!=i}">
                                            <li>
                                                    <%--                                                <a href="${pageContext.request.contextPath}/prod/split.action?page=${i}">${i}</a>--%>
                                                <a href="javascript:ajaxsplit(${i})">${i}</a>
                                            </li>
                                        </c:if>
                                    </c:forEach>
                                    <li>
                                        <%--  <a href="${pageContext.request.contextPath}/prod/split.action?page=1" aria-label="Next">--%>
                                        <a href="javascript:ajaxsplit(${info.nextPage})" aria-label="Next">
                                            <span aria-hidden="true">»</span></a>
                                    </li>
                                    <li style=" margin-left:150px;color: #0e90d2;height: 35px; line-height: 35px;">总共&nbsp;&nbsp;&nbsp;<font
                                            style="color:orange;">${info.pages}</font>&nbsp;&nbsp;&nbsp;页&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                                        <c:if test="${info.pageNum!=0}">
                                            当前&nbsp;&nbsp;&nbsp;<font
                                            style="color:orange;">${info.pageNum}</font>&nbsp;&nbsp;&nbsp;页&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                                        </c:if>
                                        <c:if test="${info.pageNum==0}">
                                            当前&nbsp;&nbsp;&nbsp;<font
                                            style="color:orange;">1</font>&nbsp;&nbsp;&nbsp;页&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                                        </c:if>
                                    </li>
                                </ul>
                            </nav>
                        </div>
                    </div>
                </div>
            </c:when>
            <c:otherwise>
                <div>
                    <h2 style="width:1200px; text-align: center;color: orangered;margin-top: 100px">暂时没有符合条件的商品！</h2>
                </div>
            </c:otherwise>
        </c:choose>
    </div>
</div>
</body>

<script type="text/javascript">
    function mysubmit() {
        $("#myform").submit();
    }

    //批量删除
    function deleteBatch() {
        //得到所有选择的复选框的对象，根据其长度判断是否有选择的商品
        var cks=$("input[name='ck']:checked");
        //如果有选择的商品，则获取其value的值，进行字符串拼接
        if (cks.length==0){
            alert("请先选择想要删除的商品！")
        }else {
            var str="";
            var id="";
            if (confirm("确定要删除"+cks.length+"条商品吗")){
                //进行提交商品的id的字符串的拼接
                $.each(cks,function (){
                    pid=$(this).val();//每一个被选中商品的id
                    //进行非空判断  避免出错
                    if(pid!=null){
                        str+=pid+",";//145   变成1,4,5
                    }
                });
                //发送ajax请求进行批量删除的提交
                $.ajax({
                    url:"${pageContext.request.contextPath}/prod/deleteBatch.action",
                    data:{
                        "pids":str
                    },
                    type:"post",
                    dataType:"text",
                    success:function (msg){
                        alert(msg);
                        $("#table").load("http://localhost:8080/SSMxiangmu_war_exploded/admin/product.jsp #table");
                    }
                });
            }

        }

    }
    //单个删除
    function del(pid) {
        <%--if (confirm("确定删除吗")) {--%>
        <%--  //向服务器提交请求完成删除--%>
        <%--    window.location="${pageContext.request.contextPath}/prod/delete.action?pid="+pid;--%>
        <%--    alert("${msg}");--%>
        <%--}--%>
        if(confirm("你确定删除吗？")){
            $.ajax({
                url:"${pageContext.request.contextPath}/prod/delete.action",
                data:{
                    "pid":pid
                },
                type:"post",
                dataType:"text",
                success:function (msg){
                    alert(msg);
                    $("#table").load("http://localhost:8080/SSMxiangmu_war_exploded/admin/product.jsp #table");
                }
            });
        }
    }

    function one(pid) {
        location.href = "${pageContext.request.contextPath}/prod/one.action?pid="+pid;
    }
</script>
<!--分页的AJAX实现-->
<script type="text/javascript">
    function ajaxsplit(page) {
        //异步ajax分页请求
        $.ajax({
        url:"${pageContext.request.contextPath}/prod/ajaxSplit.action",
            data:{"page":page},
            type:"post",
            success:function () {
                //重新加载分页显示的组件table
                //location.href---->http://localhost:8080/admin/login.action
                $("#table").load("http://localhost:8080/SSMxiangmu_war_exploded/admin/product.jsp #table");
            }
        })
    };

</script>

</html>

addproduct.jsp：

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title></title>
		<link rel="icon" href="favicon.ico">
		<link rel="stylesheet" href="${pageContext.request.contextPath}/css/bootstrap.css" />
		<link rel="stylesheet" href="${pageContext.request.contextPath}/css/addBook.css" />
		<script type="text/javascript" src="${pageContext.request.contextPath}/js/jquery-3.3.1.js"></script>
		<script type="text/javascript" src="${pageContext.request.contextPath}/js/bootstrap.js"></script>
        <script type="text/javascript" src="${pageContext.request.contextPath }/js/jquery.js"></script>
        <script type="text/javascript" src="${pageContext.request.contextPath }/js/ajaxfileupload.js"></script>
	</head>
    <script type="text/javascript">
        function fileChange(){//注意：此处不能使用jQuery中的change事件，因此仅触发一次，因此使用标签的：onchange属性
           alert("change");
            $.ajaxFileUpload({
                url:"${pageContext.request.contextPath}/prod/ajaxImg.action",//用于文件上传的服务器端请求地址
                secureuri: false,//一般设置为false
                fileElementId: 'pimage',//文件上传控件的id属性  <input type="file" id="pimage" name="pimage" />
                dataType:"json",//返回值类型 一般设置为json
                success: function(obj) //服务器成功响应处理函数
                {
                	//创建一个图片的标签
                    $("#imgDiv").empty();  //清空原有数据
                    //创建img 标签对象
                    var imgObj = $("<img>");
                    //给img标签对象追加属性
                    imgObj.attr("src","${pageContext.request.contextPath}/image_big/"+obj.imgurl);
                    imgObj.attr("width","100px");
                    imgObj.attr("height","100px");
                    //将图片img标签追加到imgDiv末尾
                    $("#imgDiv").append(imgObj);
                    //将图片的名称（从服务端返回的JSON中取得）赋值给文件本框
                    //$("#imgName").html(data.imgName);
                },
                error: function (e)//服务器响应失败处理函数
                {
                    alert(e.message);
                }
            });
        }
    </script>
	<body>
	<!--取出上一个页面上带来的page的值-->

		<div id="addAll">
			<div id="nav">
				<p>商品管理>新增商品</p>
			</div>

			<div id="table">
				<form action="${pageContext.request.contextPath}/prod/save.action" enctype="multipart/form-data"
					  method="post" id="myform">
					<table>
						<tr>
							<td class="one">商品名称</td>
							<td><input type="text" name="pName" class="two"></td>
						</tr>
						<!--错误提示-->
						<tr class="three">
							<td class="four"></td>
							<td><span id="pnameerr"></span></td>
						</tr>
						<tr>
							<td class="one">商品介绍</td>
							<td><input type="text" name="pContent" class="two"></td>
						</tr>
						<!--错误提示-->
						<tr class="three">
							<td class="four"></td>
							<td><span id="pcontenterr"></span></td>
						</tr>
						<tr>
							<td class="one">定价</td>
							<td><input type="number" name="pPrice" class="two"></td>
						</tr>
						<!--错误提示-->
						<tr class="three">
							<td class="four"></td>
							<td><span id="priceerr"></span></td>
						</tr>
						
						<tr>
							<td class="three">图片介绍</td>
                            <td> <br><div id="imgDiv" style="display:block; width: 40px; height: 50px;"></div><br><br><br><br>
								<%--<input type="file" id="pimage" name="pimage" onchange="fileChange()">--%>
                            <input type="file" id="pimage" name="pimage" onchange="fileChange()" >
                                <span id="imgName" ></span><br>

                            </td>
						</tr>
						<tr class="three">
							<td class="four"></td>
							<td><span></span></td>
						</tr>
						
						<tr>
							<td class="one">总数量</td>
							<td><input type="number" name="pNumber" class="two"></td>
						</tr>
						<!--错误提示-->
						<tr class="three">
							<td class="four"></td>
							<td><span id="numerr"></span></td>
						</tr>
						
						
						<tr>
							<td class="one">类别</td>
							<td>
								<select name="typeId">
									<c:forEach items="${typeList}" var="type">
										<option value="${type.typeId}">${type.typeName}</option>
									</c:forEach>
								</select>
							</td>
						</tr>
						<!--错误提示-->
						<tr class="three">
							<td class="four"></td>
							<td><span></span></td>
						</tr>

						<tr>
							<td>
								<input type="submit" value="提交" class="btn btn-success">
							</td>
							<td>
								<input type="reset" value="取消" class="btn btn-default" onclick="myclose(${param.page})">
								<script type="text/javascript">
									function myclose(ispage) {
										window.location="${pageContext.request.contextPath}/prod/split.action?page="+ispage;
									}
								</script>
							</td>
						</tr>
					</table>
				</form>
			</div>
		</div>

	</body>

</html>

update.jsp：

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title></title>
		<link rel="stylesheet" href="${pageContext.request.contextPath}/css/bootstrap.css" />
		<link rel="stylesheet" href="${pageContext.request.contextPath}/css/addBook.css" />
		<script type="text/javascript" src="${pageContext.request.contextPath}/js/jquery-3.3.1.js"></script>
		<script type="text/javascript" src="${pageContext.request.contextPath}/js/bootstrap.js"></script>
		<script type="text/javascript" src="${pageContext.request.contextPath }/js/ajaxfileupload.js"></script>
	</head>

	<body>
		<div id="addAll">
			<div id="nav">
				<p>商品管理>更新商品</p>
			</div>
			<script type="text/javascript">
				function fileChange(){//注意：此处不能使用jQuery中的change事件，因此仅触发一次，因此使用标签的：onchange属性
					alert("change");
					$.ajaxFileUpload({
						url:"${pageContext.request.contextPath}/prod/ajaxImg.action",//用于文件上传的服务器端请求地址
						secureuri: false,//一般设置为false
						fileElementId: 'pimage',//文件上传控件的id属性  <input type="file" id="pimage" name="pimage" />
						dataType:"json",//返回值类型 一般设置为json
						success: function(obj) //服务器成功响应处理函数
						{
							//创建一个图片的标签
							$("#imgDiv").empty();  //清空原有数据
							//创建img 标签对象
							var imgObj = $("<img>");
							//给img标签对象追加属性
							imgObj.attr("src","${pageContext.request.contextPath}/image_big/"+obj.imgurl);
							imgObj.attr("width","100px");
							imgObj.attr("height","100px");
							//将图片img标签追加到imgDiv末尾
							$("#imgDiv").append(imgObj);
							//将图片的名称（从服务端返回的JSON中取得）赋值给文件本框
							//$("#imgName").html(data.imgName);
						},
						error: function (e)//服务器响应失败处理函数
						{
							alert(e.message);
						}
					});
				}
			</script>
<script type="text/javascript">
	<%--function myclose(ispage) {--%>
	<%--	window.location="${pageContext.request.contextPath}/admin/product?flag=split&ispage="+ispage;--%>
	<%--	//window.close();--%>
	<%--}--%>
</script>
			<div id="table">
				<form action="${pageContext.request.contextPath}/prod/update.action" enctype="multipart/form-data" method="post" id="myform">
					<input type="hidden" value="${prod.pId}" name="pId">
					<input type="hidden" value="${prod.pImage}" name="pImage">
<%--					<input type="hidden" value="${prod.pDate}" name="pDate">--%>
					<table>
						<tr>
							<td class="one">商品名称</td>
							<td><input type="text" name="pName" class="two" value="${prod.pName}"></td>
						</tr>
						<!--错误提示-->
						<tr class="three">
							<td class="four"></td>
							<td><span id="pnameerr"></span></td>
						</tr>
						<tr>
							<td class="one">商品介绍</td>
							<td><input type="text" name="pContent" class="two" value="${prod.pContent}"></td>
						</tr>
						<!--错误提示-->
						<tr class="three">
							<td class="four"></td>
							<td><span id="pcontenterr"></span></td>
						</tr>
						<tr>
							<td class="one">定价</td>
							<td><input type="number" name="pPrice" class="two" value="${prod.pPrice}"></td>
						</tr>
						<!--错误提示-->
						<tr class="three">
							<td class="four"></td>
							<td><span id="priceerr"></span></td>
						</tr>
						
						<tr>
							<td class="one">图片介绍</td>
							<td> <br><div id="imgDiv"  style="display:block; width: 40px; height: 50px;"><img src="${pageContext.request.contextPath}/image_big/${prod.pImage}" width="100px" height="100px" ></div><br><br><br><br>
								<input type="file" id="pimage" name="pimage" onchange="fileChange()">
								<span id="imgName"></span><br>

							</td>
						</tr>
						<tr class="three">
							<td class="four"></td>
							<td><span></span></td>
						</tr>
						
						<tr>
							<td class="one">总数量</td>
							<td><input type="number" name="pNumber" class="two"  value="${prod.pNumber}"></td>
						</tr>
						<!--错误提示-->
						<tr class="three">
							<td class="four"></td>
							<td><span id="numerr"></span></td>
						</tr>
						
						
						<tr>
							<td class="one">类别</td>
							<td>
								<select name="typeId">
									<c:forEach items="${typeList}" var="type">
										<option value="${type.typeId}"
												<c:if test="${type.typeId==prod.typeId}">
													selected="selected"
												</c:if>
										>${type.typeName}</option>

									</c:forEach>
								</select>
							</td>
						</tr>
						<!--错误提示-->
						<tr class="three">
							<td class="four"></td>
							<td><span></span></td>
						</tr>

						<tr>
							<td>
								<input type="submit" value="提交"  class="btn btn-success">
							</td>
							<td>
								<input type="reset" value="取消" class="btn btn-default" onclick="myclose(1)">
							</td>
						</tr>
					</table>
				</form>
			</div>
		</div>

	</body>

</html>

囂蘳

关注

2
点赞
踩
4

收藏

觉得还不错? 一键收藏
5
评论
SSM商城项目

业务描述   管理员通过密码登录到系统中，选择商品管理后，会将数据库中的数据全部查询出来并分页显示到页面上。管理员可以选择新增商品来添加一个商品的信息，包括商品名称，价格，描述，数量，图片，当选择商品的图片，利用ajax来回显你刚刚添加的商品图片管理员也可以选择修改（修改时要判断你是否修改了图片）管理员可以删除商品，删除包括单个删除和批量删除查询包括多条件查询SSM中的配置文件pom.xml：<?xml version="1.0" encoding="UT
复制链接

扫一扫