新增、修改、删除功能和页面

This commit is contained in:
wanggeng888 2021-04-22 12:19:15 +08:00
parent 45a7e3d9e1
commit 7207a243a4
9 changed files with 405 additions and 47 deletions

View File

@ -1,6 +1,7 @@
package ink.wgink.gateway.dao.route;
import ink.wgink.gateway.pojo.route.Route;
import org.springframework.core.annotation.Order;
import org.springframework.data.mongodb.repository.Query;
import org.springframework.data.mongodb.repository.ReactiveMongoRepository;
import org.springframework.stereotype.Repository;

View File

@ -2,13 +2,18 @@ package ink.wgink.gateway.handler.route;
import ink.wgink.gateway.dao.route.IRouteDao;
import ink.wgink.gateway.handler.BaseHandler;
import ink.wgink.gateway.pojo.result.SuccessResult;
import ink.wgink.gateway.pojo.route.Route;
import org.springframework.core.annotation.Order;
import org.springframework.data.domain.Example;
import org.springframework.data.domain.ExampleMatcher;
import org.springframework.data.domain.Page;
import org.springframework.http.MediaType;
import org.springframework.stereotype.Component;
import org.springframework.stereotype.Service;
import org.springframework.web.reactive.function.server.ServerRequest;
import org.springframework.web.reactive.function.server.ServerResponse;
import reactor.core.publisher.Flux;
import reactor.core.publisher.Mono;
import java.util.Arrays;
@ -25,7 +30,8 @@ import java.util.Optional;
* @Date: 2021/4/19 21:40
* @Version: 1.0
**/
@Component
@Service
@Order
public class RouteHandler extends BaseHandler {
private IRouteDao routeDao;
@ -45,7 +51,7 @@ public class RouteHandler extends BaseHandler {
return routeMono.flatMap(route -> {
setSave(route);
return routeDao.save(route);
}).then(ServerResponse.ok().build());
}).then(ServerResponse.ok().contentType(MediaType.APPLICATION_JSON).body(Flux.just(new SuccessResult()), SuccessResult.class));
}
/**
@ -59,7 +65,9 @@ public class RouteHandler extends BaseHandler {
List<String> idList = Arrays.asList(ids.split(","));
return routeDao.findAllById(idList).flatMap(
route -> routeDao.delete(route)
).then(ServerResponse.ok().contentType(MediaType.APPLICATION_JSON).build());
).then(ServerResponse.ok().headers(httpHeaders -> {
httpHeaders.setContentType(MediaType.APPLICATION_JSON_UTF8);
}).body(Mono.just(new SuccessResult()), SuccessResult.class));
}
/**
@ -73,13 +81,13 @@ public class RouteHandler extends BaseHandler {
Mono<Route> routeMono = serverRequest.bodyToMono(Route.class);
return routeDao.findById(id).flatMap(
route -> routeMono.flatMap(r -> {
route.setSystem(r.getSystem());
route.setTitle(r.getTitle());
route.setSummary(r.getSummary());
route.setPath(r.getPath());
route.setUri(r.getUri());
setUpdate(route);
return routeDao.save(route);
}).then(ServerResponse.ok().contentType(MediaType.APPLICATION_JSON).build())
}).then(ServerResponse.ok().contentType(MediaType.APPLICATION_JSON).body(Flux.just(new SuccessResult()), SuccessResult.class))
).switchIfEmpty(ServerResponse.notFound().build());
}
@ -95,11 +103,11 @@ public class RouteHandler extends BaseHandler {
Route route = new Route();
Example example = Example.of(route);
if (keywords.isPresent()) {
route.setSystem(keywords.get());
route.setTitle(keywords.get());
route.setSummary(keywords.get());
ExampleMatcher exampleMatcher = ExampleMatcher.matchingAny()
.withMatcher("system", ExampleMatcher.GenericPropertyMatcher::contains)
.withMatcher("title", ExampleMatcher.GenericPropertyMatcher::contains)
.withMatcher("summary", ExampleMatcher.GenericPropertyMatcher::contains)
.withIgnoreCase("id");
example = Example.of(route, exampleMatcher);

View File

@ -1,5 +1,9 @@
package ink.wgink.gateway.pojo.result;
import lombok.Data;
import lombok.ToString;
import org.springframework.data.mongodb.core.mapping.Document;
import java.io.Serializable;
/**
@ -9,14 +13,9 @@ import java.io.Serializable;
* @Date: 2019/3/2 11:52 PM
* @Version: 1.0
**/
public class SuccessResult implements Serializable {
@Data
@ToString
@Document
public class SuccessResult {
private static final long serialVersionUID = 2794583329290530150L;
@Override
public String toString() {
final StringBuilder sb = new StringBuilder("{");
sb.append('}');
return sb.toString();
}
}

View File

@ -24,7 +24,7 @@ import java.io.Serializable;
public class Route extends BasePOJO implements Serializable {
private static final long serialVersionUID = -4892456861969101733L;
private String system;
private String title;
private String summary;
private String path;
private String uri;

View File

@ -110,12 +110,16 @@ layui.define(function(exports) {
headers: headers,
data: ajaxData,
success: function (data, status, XMLHttpRequest) {
console.log('success')
console.log(XMLHttpRequest)
var responseCode = XMLHttpRequest.status;
successCallback(responseCode, data, args);
},
error: function (XMLHttpRequest) {
console.log('error')
console.log(XMLHttpRequest)
var responseCode = XMLHttpRequest.status;
var responseData = JSON.parse(XMLHttpRequest.responseText);
var responseData = JSON.parse(XMLHttpRequest.responseText ? XMLHttpRequest.responseText: "{}");
if (errorCallback != undefined && errorCallback != null && typeof(errorCallback) == 'function') {
errorCallback(responseCode, responseData);
}

View File

@ -4,6 +4,9 @@
<base href="/wg/">
<meta charset="UTF-8">
<title>网关管理</title>
<meta name="renderer" content="webkit">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
<link rel="stylesheet" href="assets/layui-v2.6.4/layui/css/layui.css"/>
<link rel="stylesheet" href="assets/layui-v2.6.4/layui/css/admin.css"/>
</head>

View File

@ -3,6 +3,9 @@
<head>
<base href="/wg/">
<meta charset="UTF-8">
<meta name="renderer" content="webkit">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
<link rel="stylesheet" href="assets/layui-v2.6.4/layui/css/layui.css">
<link rel="stylesheet" href="assets/layui-v2.6.4/layui/css/admin.css"/>
</head>
@ -12,13 +15,7 @@
<div class="layui-inline">
<input type="text" id="keywords" class="layui-input search-item" placeholder="输入关键字">
</div>
<div class="layui-inline">
<input type="text" id="startTime" class="layui-input search-item" placeholder="开始时间" readonly>
</div>
<div class="layui-inline">
<input type="text" id="endTime" class="layui-input search-item" placeholder="结束时间" readonly>
</div>
<button type="button" id="search" class="layui-btn layui-btn-sm">
<button type="button" id="search" class="layui-btn">
<i class="fa fa-lg fa-search"></i> 搜索
</button>
</div>
@ -53,18 +50,21 @@
var dataArray = [];
var dataTable = null;
function initTable() {
function initTable(currentPage) {
top.restAjax.get(top.restAjax.path(tableUrl, []), {
keywords: $('#keywords').val(),
startTime: $('#startTime').val(),
endTime: $('#endTime').val()
}, null, function(code, data) {
dataArray = [];
for(var i = 0, item; item = data[i++];) {
dataArray.push(item);
}
if(dataTable) {
table.reload('dataTable', {data: dataArray});
table.reload('dataTable', {
data: dataArray,
page: {
curr: currentPage ? currentPage : dataTable.config.page.curr
}
});
return;
}
dataTable = table.render({
@ -78,7 +78,43 @@
cols: [[
{type: 'checkbox', fixed: 'left'},
{field: 'rowNum', width: 80, title: '序号', fixed: 'left', align: 'center', templet: '<span>{{d.LAY_INDEX}}</span>'},
{field: 'system', width: 200, title: '系统名称', align: 'center', sort: true,
{field: 'title', width: 200, title: '名称', align: 'center', sort: true,
templet: function (row) {
var rowData = row[this.field];
if (typeof (rowData) === 'undefined' || rowData == null || rowData == '') {
return '-';
}
return rowData;
}
},
{field: 'summary', width: 200, title: '描述', align: 'center', sort: true,
templet: function (row) {
var rowData = row[this.field];
if (typeof (rowData) === 'undefined' || rowData == null || rowData == '') {
return '-';
}
return rowData;
}
},
{field: 'path', width: 200, title: '转发地址', align: 'center', sort: true,
templet: function (row) {
var rowData = row[this.field];
if (typeof (rowData) === 'undefined' || rowData == null || rowData == '') {
return '-';
}
return rowData;
}
},
{field: 'uri', width: 200, title: '目标服务地址', align: 'center', sort: true,
templet: function (row) {
var rowData = row[this.field];
if (typeof (rowData) === 'undefined' || rowData == null || rowData == '') {
return '-';
}
return rowData;
}
},
{field: 'gmtCreate', width: 180, title: '添加时间', align: 'center', sort: true,
templet: function (row) {
var rowData = row[this.field];
if (typeof (rowData) === 'undefined' || rowData == null || rowData == '') {
@ -91,26 +127,11 @@
data: dataArray,
page: true
});
console.log(table);
}, function(code, data) {
top.dialog.msg(data.msg);
})
}
// 初始化日期
function initDate() {
// 日期选择
laydate.render({
elem: '#startTime',
format: 'yyyy-MM-dd'
});
laydate.render({
elem: '#endTime',
format: 'yyyy-MM-dd'
});
}
initDate();
initTable();
// 事件 - 页面变化
$win.on('resize', function() {
@ -121,7 +142,84 @@
});
// 事件 - 搜索
$(document).on('click', '#search', function() {
initTable(1);
});
// 删除
function removeData(ids) {
top.dialog.msg(top.dataMessage.delete, {
time: 0,
btn: [top.dataMessage.button.yes, top.dataMessage.button.no],
shade: 0.3,
yes: function (index) {
top.dialog.close(index);
var layIndex;
top.restAjax.delete(top.restAjax.path('api/route/delete/{ids}', [ids]), {}, null, function (code, data) {
top.dialog.msg(top.dataMessage.deleteSuccess, {time: 1000});
initTable();
}, function (code, data) {
top.dialog.msg(data.msg);
}, function () {
layIndex = top.dialog.msg(top.dataMessage.deleting, {icon: 16, time: 0, shade: 0.3});
}, function () {
top.dialog.close(layIndex);
});
}
});
}
// 事件 - 增删改
table.on('toolbar(dataTable)', function(obj) {
var layEvent = obj.event;
var checkStatus = table.checkStatus('dataTable');
var checkDatas = checkStatus.data;
if(layEvent === 'saveEvent') {
layer.open({
type: 2,
title: false,
closeBtn: 0,
area: ['100%', '100%'],
shadeClose: true,
anim: 2,
content: top.restAjax.path('route/route/save.html', []),
end: function() {
initTable();
}
});
} else if(layEvent === 'updateEvent') {
if(checkDatas.length === 0) {
top.dialog.msg(top.dataMessage.table.selectEdit);
} else if(checkDatas.length > 1) {
top.dialog.msg(top.dataMessage.table.selectOneEdit);
} else {
layer.open({
type: 2,
title: false,
closeBtn: 0,
area: ['100%', '100%'],
shadeClose: true,
anim: 2,
content: top.restAjax.path('route/route/update.html?uuid={uuid}', [checkDatas[0].uuid]),
end: function() {
initTable();
}
});
}
} else if(layEvent === 'removeEvent') {
if(checkDatas.length === 0) {
top.dialog.msg(top.dataMessage.table.selectDelete);
} else {
var ids = '';
for(var i = 0, item; item = checkDatas[i++];) {
if(i > 1) {
ids += ',';
}
ids += item['uuid'];
}
removeData(ids);
}
} else if(layEvent === 'levelUpEvent') {
parent.layer.close(parent.layer.getFrameIndex(window.name));
}
});
});
</script>

View File

@ -0,0 +1,115 @@
<!doctype html>
<html lang="en">
<head>
<base href="/wg/">
<meta charset="utf-8">
<meta name="renderer" content="webkit">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
<link rel="stylesheet" href="assets/layui-v2.6.4/layui/css/layui.css">
<link rel="stylesheet" href="assets/layui-v2.6.4/layui/css/admin.css"/>
</head>
<body>
<div class="layui-anim layui-anim-fadein">
<div class="layui-card">
<div class="layui-card-header">
<span class="layui-breadcrumb" lay-filter="breadcrumb" style="visibility: visible;">
<a class="close" href="javascript:void(0);">上级列表</a><span lay-separator="">/</span>
<a href="javascript:void(0);"><cite>新增内容</cite></a>
</span>
</div>
<div class="layui-card-body" style="padding: 15px;">
<form class="layui-form layui-form-pane" lay-filter="dataForm">
<div class="layui-form-item">
<label class="layui-form-label">名称</label>
<div class="layui-input-block">
<input type="text" name="title" class="layui-input" lay-verify="required">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">描述</label>
<div class="layui-input-block">
<input type="text" name="summary" class="layui-input" lay-verify="required">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">转发地址</label>
<div class="layui-input-block">
<input type="text" name="path" class="layui-input" lay-verify="required">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">目标服务地址</label>
<div class="layui-input-block">
<input type="text" name="uri" class="layui-input" lay-verify="required">
</div>
</div>
<div class="layui-form-item layui-layout-admin">
<div class="layui-input-block">
<div class="layui-footer" style="left: 0;">
<button type="button" class="layui-btn" lay-submit lay-filter="submitForm">提交新增</button>
<button type="button" class="layui-btn layui-btn-primary close">返回上级</button>
</div>
</div>
</div>
</form>
</div>
</div>
</div>
<script src="assets/layui-v2.6.4/layui/layui.js"></script>
<script>
layui.use(['form', 'laydate', 'laytpl'], function(){
var $ = layui.$;
var form = layui.form;
var layer = layui.layer;
var uuid = top.restAjax.params(window.location.href).uuid;
function closeBox() {
parent.layer.close(parent.layer.getFrameIndex(window.name));
}
// 初始化内容
function initData() {
}
initData();
// 提交表单
form.on('submit(submitForm)', function(formData) {
top.dialog.confirm(top.dataMessage.commit, function(index) {
top.dialog.close(index);
var loadLayerIndex;
top.restAjax.post(top.restAjax.path('api/route/save', []), formData.field, null, function(code, data) {
var layerIndex = top.dialog.msg(top.dataMessage.commitSuccess, {
time: 0,
btn: [top.dataMessage.button.yes, top.dataMessage.button.no],
shade: 0.3,
yes: function(index) {
top.dialog.close(index);
window.location.reload();
},
btn2: function() {
closeBox();
}
});
}, function(code, data) {
top.dialog.msg(data.msg);
}, function() {
loadLayerIndex = top.dialog.msg(top.dataMessage.committing, {icon: 16, time: 0, shade: 0.3});
}, function() {
top.dialog.close(loadLayerIndex);
});
});
return false;
});
$('.close').on('click', function() {
closeBox();
});
// 校验
form.verify({
});
});
</script>
</body>
</html>

View File

@ -0,0 +1,130 @@
<!doctype html>
<html lang="en">
<head>
<base href="/wg/">
<meta charset="utf-8">
<meta name="renderer" content="webkit">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
<link rel="stylesheet" href="assets/layui-v2.6.4/layui/css/layui.css">
<link rel="stylesheet" href="assets/layui-v2.6.4/layui/css/admin.css"/>
</head>
<body>
<div class="layui-anim layui-anim-fadein">
<div class="layui-card">
<div class="layui-card-header">
<span class="layui-breadcrumb" lay-filter="breadcrumb" style="visibility: visible;">
<a class="close" href="javascript:void(0);">上级列表</a><span lay-separator="">/</span>
<a href="javascript:void(0);"><cite>编辑内容</cite></a>
</span>
</div>
<div class="layui-card-body" style="padding: 15px;">
<form class="layui-form layui-form-pane" lay-filter="dataForm">
<div class="layui-form-item">
<label class="layui-form-label">名称</label>
<div class="layui-input-block">
<input type="text" name="title" class="layui-input" lay-verify="required">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">描述</label>
<div class="layui-input-block">
<input type="text" name="summary" class="layui-input" lay-verify="required">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">转发地址</label>
<div class="layui-input-block">
<input type="text" name="path" class="layui-input" lay-verify="required">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">目标服务地址</label>
<div class="layui-input-block">
<input type="text" name="uri" class="layui-input" lay-verify="required">
</div>
</div>
<div class="layui-form-item layui-layout-admin">
<div class="layui-input-block">
<div class="layui-footer" style="left: 0;">
<button type="button" class="layui-btn" lay-submit lay-filter="submitForm">提交编辑</button>
<button type="button" class="layui-btn layui-btn-primary close">返回上级</button>
</div>
</div>
</div>
</form>
</div>
</div>
</div>
<script src="assets/layui-v2.6.4/layui/layui.js"></script>
<script>
layui.use(['form', 'laydate', 'laytpl'], function(){
var $ = layui.$;
var form = layui.form;
var layer = layui.layer;
var uuid = top.restAjax.params(window.location.href).uuid;
function closeBox() {
parent.layer.close(parent.layer.getFrameIndex(window.name));
}
// 初始化内容
function initData() {
var loadLayerIndex;
top.restAjax.get(top.restAjax.path('api/route/get/{uuid}', [uuid]), {}, null, function(code, data) {
var dataFormData = {};
for(var i in data) {
dataFormData[i] = data[i] +'';
}
form.val('dataForm', dataFormData);
form.render(null, 'dataForm');
}, function(code, data) {
top.dialog.msg(data.msg);
}, function() {
loadLayerIndex = top.dialog.msg(top.dataMessage.loading, {icon: 16, time: 0, shade: 0.3});
}, function() {
top.dialog.close(loadLayerIndex);
});
}
initData();
// 提交表单
form.on('submit(submitForm)', function(formData) {
top.dialog.confirm(top.dataMessage.commit, function(index) {
top.dialog.close(index);
var loadLayerIndex;
top.restAjax.put(top.restAjax.path('api/route/update/{uuid}', [uuid]), formData.field, null, function(code, data) {
var layerIndex = top.dialog.msg(top.dataMessage.updateSuccess, {
time: 0,
btn: [top.dataMessage.button.yes, top.dataMessage.button.no],
shade: 0.3,
yes: function(index) {
top.dialog.close(index);
window.location.reload();
},
btn2: function() {
closeBox();
}
});
}, function(code, data) {
top.dialog.msg(data.msg);
}, function() {
loadLayerIndex = top.dialog.msg(top.dataMessage.committing, {icon: 16, time: 0, shade: 0.3});
}, function() {
top.dialog.close(loadLayerIndex);
});
});
return false;
});
$('.close').on('click', function() {
closeBox();
});
// 校验
form.verify({
});
});
</script>
</body>
</html>