saas-export项目-页面结构与company的添加-查询-删除功能

绝地灬酷狼 2022-11-21 07:03 85阅读 0赞

# 学习目标 #

*  （1）页面结构
 *  （2）完成企业管理的CRUD（\*\*\*）
 *  （3）技巧

# 部署export项目的UI #

*  （1）将资料里面的项目页面的内容复制到webapp下面
 *  （2）设置项目路径$\{path\} 重新部署
 *  （3）WEB-INF下的内容不能直接访问，可以使用控制器方法访问
 *  （4）学习重点在后台，前台页面不是重点内容

如果页面杂乱，一定是css没有引入有问题 点击有问题，是js引入有问题 图片显示不正常，是img引入有问题

# main 页面分析 #

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3UwMTM2MjEzOTg_size_16_color_FFFFFF_t_70_pic_center]

*  （1）页面结构  
    header footer left\_menu  
    内容区域iframe  
    使用include标签合在一起
 *  （2）iframe标签  
    》a标签读href的内容  
    》target将内容给iframe  
    》iframe显示内容
 *  （3）示例  
    ![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3UwMTM2MjEzOTg_size_16_color_FFFFFF_t_70_pic_center 1]  
    ![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3UwMTM2MjEzOTg_size_16_color_FFFFFF_t_70_pic_center 2]

## demo01\_iframe.jsp ##

<body>
            <a href="http://www.baidu.com" target="f1">读百度主页</a>
            <a href="http://www.iqiyi.com" target="f2">读iqi主页</a>
    
            <iframe name="f1" width="30%" height="50%" style="background-color: blue" ></iframe>
            <iframe name="f2" width="30%" height="50%" style="background-color: green" ></iframe>
    </body>

# web.xml设置主页 #

*  （1）web.xml配置自动打开页面

<welcome-file-list>
        <welcome-file>home/toMain.do</welcome-file>
      </welcome-file-list>

# 添加功能 #

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3UwMTM2MjEzOTg_size_16_color_FFFFFF_t_70_pic_center 3]

## CompanyController ##

//添加 1 打开添加页面
        @RequestMapping(path="/toAdd",method = RequestMethod.GET)
        public String toAdd(){ 
            return "company/company-add";
        }

# 后台代码 #

## TestCompanyService ##

@Test
        public void test02(){ 
            //1:将表单数据通过Service正确写入到数据库
            // public Company(String id, String name, Date expirationDate, String address, String licenseId, String representative, String phone, String companySize, String industry, String remarks, Integer state, Double balance, String city)
            Company company = new Company("id1","name1",new Date(),"address1","licenseId","representative","phone","companySize","industry","remarks",0,100.0,"city");
            //保存
            companyService.saveCompany(company);
        }

## ICompanyService ##

void saveCompany(Company company);

## CompanyServiceImpl ##

@Override
        public void saveCompany(Company company) { 
            //当前数据库的id不是自增长的。
            //02e1da04-43f8-42e1-a4c2-66e162c6f4a5 uuid 全球唯一
            String id = UUID.randomUUID().toString();
            company.setId(id);
            iCompanyDao.save(company);
        }

## ICompanyDao ##

void save(Company company);

## ICompanyDao.xml ##

<insert id="save" parameterType="company">
                insert into ss_company
                (
                id              ,
                name            ,
                expiration_date ,
                address         ,
                license_id      ,
                representative  ,
                phone           ,
                company_size    ,
                industry        ,
                remarks         ,
                state           ,
                balance         ,
                city
    
                )
                values
                (
    
                #{id              },
                #{name            },
                #{expirationDate },
                #{address         },
                #{licenseId      },
                #{representative  },
                #{phone           },
                #{companySize    },
                #{industry        },
                #{remarks         },
                #{state           },
                #{balance         },
                #{city}
    
    
                )
    
        </insert>

运行，先从domain->dao->service->web 先clean再install，否则会出现`符号找不到`

# 前台代码 #

## company-add.jsp ##

》springmvc要求表单 提交的数据的参数名，要跟实现类中的变量名一致。  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3UwMTM2MjEzOTg_size_16_color_FFFFFF_t_70_pic_center 4]

## CompanyController ##

//${path}/company/add.do 技巧1：表单的name值对应实体类的变量名
        @RequestMapping(path="/add",method = RequestMethod.POST)
        public String add(Company company){ 
            l.info("add company="+company);
            iCompanyService.saveCompany(company);
            return "redirect:/company/...";//跳转到列表页面
        }

# 查询功能 #

## CompanyController ##

//查询 1 打开列表页面
        @RequestMapping(path="/toList",method = RequestMethod.GET)
        public String toList(){ 
            return "company/company-list";
        }

# 后台代码 #

## TestCompanyService ##

@Test
        public void test01(){ 
            //1:编写了业务逻辑的测试
            //等号 左边是接口 右边是实现类
            //ICompanyService service = new CompanyServiceImpl();
            List<Company> list = service.findAll();
            System.out.println(list);
        }

## ICompanyService ##

List<Company> findAll();

## CompanyServiceImpl ##

@Autowired
        ICompanyDao iCompanyDao;
        public List<Company> findAll() { //service要调用dao查询数据，所以要注入
            return iCompanyDao.findAll();
        }

## ICompanyDao ##

List<Company> findAll();

## ICompanyDao.xml ##

<select id="findAll" resultType="company">
    select
    	id,
    	name ,
    	expiration_date as expirationDate ,
    	address,
    	license_id as licenseId  ,
    	representative ,
    	phone  ,
    	company_size as companySize  ,
    	industry  ,
    	remarks ,
    	state,
    	balance ,
    	city
    from ss_company
        </select>

# 前台代码 #

## CompanyController ##

//查询 1 打开列表页面
        @RequestMapping(path="/toList",method = RequestMethod.GET)
        public String toList(Model model){ 
            //调service获取数据
            List<Company> list = iCompanyService.findAll();
            l.info("toList list="+list);
            model.addAttribute("list",list);
            //将数据发到页面，使用标签
            return "company/company-list";
        }

## company-list.jsp ##

使用foreach与el表达式等显示。

## 页面效果： ##

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM3OTI0OTA1_size_16_color_FFFFFF_t_70_pic_center]

# 删除功能 #

调用service删除指定id的数据

# 后台代码 #

## TestCompanyService ##

@Test
        public void test03(){ 
            //删除
            String id = "c6c32203-f35a-4e80-95fe-f878f6bf2007";
            service.deleteById(id);
        }

## ICompanyService ##

void deleteById(String id);

## CompanyServiceImpl ##

@Override
        public void deleteById(String id) { 
            iCompanyDao.deleteById(id);
        }

## ICompanyDao ##

void deleteById(String id);

## ICompanyDao.xml ##

<delete id="deleteById" parameterType="string">
            delete from ss_company where id = #{id}
        </delete>

# 前台 #

## company-list.jsp ##

location.href="${path}/company/delete.do?id="+id;

## CompanyController ##

//${path}/company/delete.do?id="+id
        @RequestMapping(path="/delete",method = RequestMethod.GET)
        public String delete(String id){ 
            l.info("delete id="+id);
            iCompanyService.deleteById(id);
            return "redirect:/company/toList.do";//跳转到列表页面
        }

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3UwMTM2MjEzOTg_size_16_color_FFFFFF_t_70_pic_center]: /images/20221120/14d78c94b0dc493eb4679c75c254c846.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3UwMTM2MjEzOTg_size_16_color_FFFFFF_t_70_pic_center 1]: /images/20221120/a1e49afaa9a740daae274eab62bd9cc9.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3UwMTM2MjEzOTg_size_16_color_FFFFFF_t_70_pic_center 2]: /images/20221120/2cdf0a0560ee404dbe4c590c258221eb.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3UwMTM2MjEzOTg_size_16_color_FFFFFF_t_70_pic_center 3]: /images/20221120/d1bca21ebdff483582d75ef1ac1e23e4.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3UwMTM2MjEzOTg_size_16_color_FFFFFF_t_70_pic_center 4]: /images/20221120/8700d8f353974a398d4c3ac4c1fa8802.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM3OTI0OTA1_size_16_color_FFFFFF_t_70_pic_center]: /images/20221120/f27ee75a080f45c2969f46178c158d31.png