写一个古诗词管理平台的程序,要求功能主要包括古诗词朝代管理、古诗词题材管理、古诗词的增删改查
时间: 2023-12-29 13:01:56 浏览: 67
为了实现古诗词管理平台的功能,我们可以使用 Java Web 技术,如 Spring MVC、MyBatis 等来实现后端部分,同时使用 HTML、CSS、JavaScript 等技术来实现前端部分。下面是一个简单的实现示例:
1. 设计数据库表结构:我们可以设计三个表,分别为 `dynasty`(朝代)、`topic`(题材)和 `poetry`(古诗词),每个表包含相应的字段。以下是表结构设计:
```sql
CREATE TABLE `dynasty` (
`id` int(11) NOT NULL AUTO_INCREMENT,
`name` varchar(50) NOT NULL COMMENT '朝代名称',
`description` varchar(200) NOT NULL COMMENT '朝代简介',
PRIMARY KEY (`id`)
) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4;
CREATE TABLE `topic` (
`id` int(11) NOT NULL AUTO_INCREMENT,
`name` varchar(50) NOT NULL COMMENT '题材名称',
`description` varchar(200) NOT NULL COMMENT '题材简介',
PRIMARY KEY (`id`)
) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4;
CREATE TABLE `poetry` (
`id` int(11) NOT NULL AUTO_INCREMENT,
`title` varchar(100) NOT NULL COMMENT '古诗词标题',
`author` varchar(50) NOT NULL COMMENT '古诗词作者',
`content` text NOT NULL COMMENT '古诗词内容',
`dynasty_id` int(11) NOT NULL COMMENT '朝代ID',
`topic_id` int(11) NOT NULL COMMENT '题材ID',
PRIMARY KEY (`id`),
KEY `idx_poetry_dynasty_id` (`dynasty_id`),
KEY `idx_poetry_topic_id` (`topic_id`),
CONSTRAINT `fk_poetry_dynasty_id` FOREIGN KEY (`dynasty_id`) REFERENCES `dynasty` (`id`) ON DELETE CASCADE,
CONSTRAINT `fk_poetry_topic_id` FOREIGN KEY (`topic_id`) REFERENCES `topic` (`id`) ON DELETE CASCADE
) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4;
```
2. 实现 DAO 层:我们可以使用 MyBatis 框架来实现 DAO 层,以下是 `dynasty` 表的 DAO 层示例:
```java
public interface DynastyMapper {
Dynasty getById(Integer id);
List<Dynasty> getAll();
void insert(Dynasty dynasty);
void update(Dynasty dynasty);
void deleteById(Integer id);
}
```
3. 实现 Service 层:在 Service 层中,我们可以调用 DAO 层的方法来实现业务逻辑,以下是 `DynastyService` 类的示例:
```java
public class DynastyService {
@Autowired
private DynastyMapper dynastyMapper;
public Dynasty getById(Integer id) {
return dynastyMapper.getById(id);
}
public List<Dynasty> getAll() {
return dynastyMapper.getAll();
}
public void insert(Dynasty dynasty) {
dynastyMapper.insert(dynasty);
}
public void update(Dynasty dynasty) {
dynastyMapper.update(dynasty);
}
public void deleteById(Integer id) {
dynastyMapper.deleteById(id);
}
}
```
4. 实现 Controller 层:在 Controller 层中,我们可以处理 HTTP 请求,并调用 Service 层的方法来实现业务逻辑,以下是 `DynastyController` 类的示例:
```java
@RestController
@RequestMapping("/dynasty")
public class DynastyController {
@Autowired
private DynastyService dynastyService;
@GetMapping("/{id}")
public Dynasty getById(@PathVariable Integer id) {
return dynastyService.getById(id);
}
@GetMapping
public List<Dynasty> getAll() {
return dynastyService.getAll();
}
@PostMapping
public void insert(@RequestBody Dynasty dynasty) {
dynastyService.insert(dynasty);
}
@PutMapping
public void update(@RequestBody Dynasty dynasty) {
dynastyService.update(dynasty);
}
@DeleteMapping("/{id}")
public void deleteById(@PathVariable Integer id) {
dynastyService.deleteById(id);
}
}
```
5. 实现前端页面:我们可以使用 HTML、CSS、JavaScript 等技术实现前端页面,并通过 AJAX 调用后端接口来实现数据的增删改查。以下是一个简单的前端页面示例:
```html
<html>
<head>
<meta charset="UTF-8">
<title>古诗词管理平台</title>
<script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<script>
$(function () {
// 获取所有朝代列表
$.get("/dynasty", function (data) {
var html = "";
for (var i = 0; i < data.length; i++) {
html += "<tr><td>" + data[i].id + "</td><td>" + data[i].name + "</td><td>" + data[i].description + "</td><td><button onclick='editDynasty(" + data[i].id + ")'>编辑</button> <button onclick='deleteDynasty(" + data[i].id + ")'>删除</button></td></tr>";
}
$("#dynastyTable tbody").html(html);
});
// 新增朝代
$("#addDynastyButton").click(function () {
var name = $("#dynastyNameInput").val();
var description = $("#dynastyDescriptionInput").val();
$.ajax({
url: "/dynasty",
type: "POST",
contentType: "application/json",
data: JSON.stringify({name: name, description: description}),
success: function () {
location.reload();
}
});
});
});
// 编辑朝代
function editDynasty(id) {
$.get("/dynasty/" + id, function (data) {
$("#editDynastyModal #editDynastyIdInput").val(data.id);
$("#editDynastyModal #editDynastyNameInput").val(data.name);
$("#editDynastyModal #editDynastyDescriptionInput").val(data.description);
$("#editDynastyModal").modal("show");
});
}
// 提交编辑朝代
$("#editDynastyButton").click(function () {
var id = $("#editDynastyIdInput").val();
var name = $("#editDynastyNameInput").val();
var description = $("#editDynastyDescriptionInput").val();
$.ajax({
url: "/dynasty",
type: "PUT",
contentType: "application/json",
data: JSON.stringify({id: id, name: name, description: description}),
success: function () {
location.reload();
}
});
});
// 删除朝代
function deleteDynasty(id) {
if (confirm("确定要删除该朝代吗?")) {
$.ajax({
url: "/dynasty/" + id,
type: "DELETE",
success: function () {
location.reload();
}
});
}
}
</script>
</head>
<body>
<h1>古诗词管理平台</h1>
<h2>朝代管理</h2>
<table id="dynastyTable">
<thead>
<tr>
<th>ID</th>
<th>名称</th>
<th>简介</th>
<th>操作</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
<br>
<button data-toggle="modal" data-target="#addDynastyModal">新增朝代</button>
<!-- 新增朝代模态框 -->
<div class="modal fade" id="addDynastyModal" tabindex="-1" role="dialog" aria-labelledby="addDynastyModalLabel" aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="addDynastyModalLabel">新增朝代</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
<form>
<div class="form-group">
<label for="dynastyNameInput">名称</label>
<input type="text" class="form-control" id="dynastyNameInput" required>
</div>
<div class="form-group">
<label for="dynastyDescriptionInput">简介</label>
<textarea class="form-control" id="dynastyDescriptionInput" required></textarea>
</div>
</form>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal">关闭</button>
<button type="button" class="btn btn-primary" id="addDynastyButton">保存</button>
</div>
</div>
</div>
</div>
<!-- 编辑朝代模态框 -->
<div class="modal fade" id="editDynastyModal" tabindex="-1" role="dialog" aria-labelledby="editDynastyModalLabel" aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="editDynastyModalLabel">编辑朝代</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
<form>
<div class="form-group">
<label for="editDynastyIdInput">ID</label>
<input type="text" class="form-control" id="editDynastyIdInput" readonly>
</div>
<div class="form-group">
<label for="editDynastyNameInput">名称</label>
<input type="text" class="form-control" id="editDynastyNameInput" required>
</div>
<div class="form-group">
<label for="editDynastyDescriptionInput">简介</label>
<textarea class="form-control" id="editDynastyDescriptionInput" required></textarea>
</div>
</form>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal">关闭</button>
<button type="button" class="btn btn-primary" id="editDynastyButton">保存</button>
</div>
</div>
</div>
</div>
</body>
</html>
```
6. 部署程序:最后,我们需要将程序部署到服务器上,配置相应的数据库连接信息,然后启动程序即可。
需要注意的是,以上示例只是一个简单的实现,并没有考虑到安全、性能等问题,实际开发中需要考虑更多的细节和需求。
阅读全文