java:邮箱配置,点击配置,弹出弹窗,弹窗中可以对邮箱输入框进行动态的增加和删除,通过easyui+ssm实现,前后端具体代码
时间: 2024-03-16 08:44:29 浏览: 16
好的,这里是一个 Java 邮箱配置的示例代码,使用了 EasyUI 和 SSM 框架,前端代码使用了 jQuery:
### 后端代码
#### Controller
```java
@Controller
@RequestMapping("/email")
public class EmailController {
@Autowired
private EmailService emailService;
@RequestMapping("/config")
public String config() {
return "email/config";
}
@RequestMapping("/save")
@ResponseBody
public Result save(@RequestParam("emailList[]") List<String> emailList) {
emailService.saveEmailList(emailList);
return new Result(true, "保存成功");
}
}
```
#### Service
```java
@Service
public class EmailServiceImpl implements EmailService {
@Autowired
private EmailMapper emailMapper;
@Override
public void saveEmailList(List<String> emailList) {
emailMapper.deleteEmailList();
emailList.forEach(email -> emailMapper.insertEmail(email));
}
@Override
public List<String> getEmailList() {
return emailMapper.selectEmailList();
}
}
```
#### Mapper
```java
@Mapper
public interface EmailMapper {
@Insert("INSERT INTO email (email) VALUES (#{email})")
void insertEmail(String email);
@Delete("DELETE FROM email")
void deleteEmailList();
@Select("SELECT email FROM email")
List<String> selectEmailList();
}
```
### 前端代码
#### config.jsp
```html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>邮箱配置</title>
<link rel="stylesheet" href="https://cdn.bootcdn.net/ajax/libs/jquery-easyui/1.9.19/themes/bootstrap/easyui.css">
<link rel="stylesheet" href="https://cdn.bootcdn.net/ajax/libs/jquery-easyui/1.9.19/themes/icon.css">
</head>
<body>
<div style="margin:20px 0 10px 0;">
<a href="#" class="easyui-linkbutton" iconCls="icon-add" plain="true" onclick="addEmail()">添加邮箱</a>
<a href="#" class="easyui-linkbutton" iconCls="icon-remove" plain="true" onclick="deleteEmail()">删除邮箱</a>
<a href="#" class="easyui-linkbutton" iconCls="icon-save" plain="true" onclick="saveEmail()">保存</a>
</div>
<table id="emailTable" class="easyui-datagrid" style="width:100%;height:auto"
data-options="
url: '/email/getEmailList',
fitColumns: true,
rownumbers: true,
singleSelect: true,
pagination: false,
columns: [[
{field:'email',title:'邮箱',width:100,editor:'text'}
]],
toolbar: '#toolbar'
">
<thead>
<tr>
<th data-options="field:'email',width:100,editor:'text'">邮箱</th>
</tr>
</thead>
</table>
<script src="https://cdn.bootcdn.net/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script src="https://cdn.bootcdn.net/ajax/libs/jquery-easyui/1.9.19/jquery.easyui.min.js"></script>
<script src="https://cdn.bootcdn.net/ajax/libs/jquery-easyui/1.9.19/plugins/jquery.datagrid.js"></script>
<script>
function addEmail() {
$('#emailTable').datagrid('appendRow', {});
var lastIndex = $('#emailTable').datagrid('getRows').length - 1;
$('#emailTable').datagrid('beginEdit', lastIndex);
}
function deleteEmail() {
var row = $('#emailTable').datagrid('getSelected');
if (row) {
var index = $('#emailTable').datagrid('getRowIndex', row);
$('#emailTable').datagrid('deleteRow', index);
}
}
function saveEmail() {
var rows = $('#emailTable').datagrid('getRows');
var emailList = [];
for (var i = 0; i < rows.length; i++) {
var email = rows[i].email;
if (email) {
emailList.push(email);
}
}
$.ajax({
url: '/email/save',
type: 'POST',
data: {emailList: emailList},
success: function (result) {
if (result.success) {
$.messager.show({
title: '提示',
msg: result.msg,
icon: 'info'
});
}
}
});
}
</script>
</body>
</html>
```
#### EmailController
```java
public class EmailController {
@Autowired
private EmailService emailService;
@RequestMapping("/getEmailList")
@ResponseBody
public List<Email> getEmailList() {
List<String> emailList = emailService.getEmailList();
return emailList.stream().map(Email::new).collect(Collectors.toList());
}
}
```
#### Email
```java
public class Email {
private String email;
public Email(String email) {
this.email = email;
}
public String getEmail() {
return email;
}
public void setEmail(String email) {
this.email = email;
}
}
```
这是一个简单的 Java 邮箱配置示例,使用了 EasyUI 和 SSM 框架,前端使用了 jQuery。前端代码中,使用了 Datagrid 插件来展示邮箱列表,并且可以动态增加和删除邮箱。后端代码中,使用了 MyBatis 注解来实现数据库操作。