【JAVAWEB开发】黑马程序员java web案例资料（含Element的删除与修改） |
您所在的位置：网站首页 › javaweb项目完整案例视频 › 【JAVAWEB开发】黑马程序员java web案例资料（含Element的删除与修改） |
【JAVAWEB开发】黑马程序员java web案例资料（含Element的删除与修改）
|
CSDN话题挑战赛第2期 参赛话题：学习笔记 哈喽~大家好呀，本篇视频教程来自于黑马程序员的——黑马程序员最新版JavaWeb基础教程，Java web从入门到企业实战完整版，对最后的项目教程添加了删除与修改功能，基于Java+Servlet+Axios+Vue+Element+Maven+Mybatis 下面来看看。 🥇个人主页：个人主页 🥈 系列专栏：【JAVAWEB开发】 目录 一、效果展示 首页 分类查询 批量删除 单个删除 修改 新建 二、部分代码展示 前台页面 Servlet展示 Mapper 三、源码获取 一、效果展示 首页
 二、部分代码展示
前台页面
Title
.el-table .warning-row {
background: oldlace;
}
.el-table .success-row {
background: #f0f9eb;
}
查询
批量删除
新建
提交
取消
修改
删除
提交
取消
new Vue({
el: "#app",
// 页面加载完之后，执行的方法
mounted() {
this.selectAll();
}
,
methods: {
// 查询分页数据
selectAll() {
axios({
method: "post",
url: "http://localhost:8080/brand-demo/brand/selectByPageAndCondition?currentPage=" + this.currentPage + "&pageSize=" + this.pageSize,
//url: "http://localhost:8080/brand-demo/brand/selectByPage?currentPage=" + _this.currentPage + "&pageSize=" + _this.pageSize,
data: this.brand
}).then(resp => {
this.tableData = resp.data.rows;
this.totalCount = resp.data.totalCount;
})
},
tableRowClassName({row, rowIndex}) {
if (rowIndex === 1) {
return 'warning-row';
} else if (rowIndex === 3) {
return 'success-row';
}
return '';
},
handleSelectionChange(val) {
this.multipleSelection = val;
},
onSubmit() {
// console.log(this.brand);
this.selectAll();
},
// 添加数据
addBrand() {
axios({
method: "post",
url: "http://localhost:8080/brand-demo/brand/add",
data: this.brands
}).then(resp => {
// 判断响应数据是否为 success
if (resp.data == "success") {
this.dialogVisible = false;
this.selectAll();
this.$message({
showClose: true,
message: '恭喜你，添加成功',
type: 'success'
});
}
})
},
deleteByIds() {
// 删除前判断
this.$confirm('此操作将永久删除被选数据, 是否继续?', '删除', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
for (var i = 0; i < this.multipleSelection.length; i++) {
var selectIds = this.multipleSelection[i];
this.selectedIds[i] = selectIds.id;
}
axios({
method: "post",
url: "http://localhost:8080/brand-demo/brand/deleteByIds",
data: this.selectedIds
}).then(resp => {
// 判断响应数据是否为 success
if (resp.data == "success") {
this.selectAll();
this.$message({
message: '恭喜你，删除成功',
type: 'success'
});
}
})
}).catch(() => {
this.$message({
type: 'info',
message: '已取消删除'
});
});
},
deleteById(index, row) {
// 删除前判断
this.$confirm('此操作将永久删除被选数据, 是否继续?', '删除', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
axios({
method: "post",
url: "http://localhost:8080/brand-demo/brand/deleteById",
data: row.id
}).then( resp => {
// 判断响应数据是否为 success
if (resp.data == "success") {
this.selectAll();
this.$message({
message: '恭喜你，删除成功',
type: 'success'
});
}
})
}).catch(() => {
this.$message({
type: 'info',
message: '已取消删除'
});
});
},
update_No1(index, row){
this.dialogVisibleUpdate = true;
this.brand = row;
},
update_No2(){
axios({
method: "post",
url: "http://localhost:8080/brand-demo/brand/update",
data: this.brand
}).then( resp => {
// 判断响应数据是否为 success
if (resp.data == "success") {
this.dialogVisibleUpdate = false;
this.selectAll();
this.$message({
showClose: true,
message: '恭喜你，修改成功',
type: 'success'
});
}
})
},
// 分页
handleSizeChange(val) {
this.pageSize = val;
this.selectAll();
},
handleCurrentChange(val) {
// console.log(`当前页: ${val}`);
this.currentPage = val;
this.selectAll();
}
},
data() {
return {
totalCount: 100,
pageSize: 5,
// 搜索表单数据
brand: {
status: '',
brandName: '',
companyName: '',
id: '',
ordered: '',
description: ''
},
// 新增表单数据
brands: {
status: '',
brandName: '',
companyName: '',
id: '',
ordered: '',
description: ''
},
// 修改表单数据
brandss: {
status: '',
brandName: '',
companyName: '',
id: '',
ordered: '',
description: ''
},
// 被选中的id
selectedIds: []
,
// 添加对话框是否标记
dialogVisible: false,
// 修改对话框是否标记
dialogVisibleUpdate: false,
// 数据模型，复选框选中几何
multipleSelection: [],
// 分页
currentPage: 1,
// 表格数据
tableData: [{
brandName: '',
companyName: '',
ordered: '',
status: '',
description: ''
}]
}
}
})
Servlet展示
private BrandService brandService = new BrandServiceImpl();
public void selectAll(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException{
List brands = brandService.selectAll();
String json = JSON.toJSONString(brands);
response.setContentType("text/json;charset=utf-8");
response.getWriter().write(json);
}
Mapper
// 查询所有
@Select("select * from tb_brand")
@ResultMap("brandResultMap")
List selectAll();
三、源码获取
链接：https://pan.baidu.com/s/1j3K5fqb0hhVeYfp7jisFfg 提取码：zhui 不积跬步无以至千里，趁年轻，使劲拼，给未来的自己一个交代！向着明天更好的自己前进吧！
|
【本文地址】
今日新闻 |
推荐新闻 |