|
|
<!DOCTYPE html>
|
|
|
<html>
|
|
|
|
|
|
<head>
|
|
|
<meta charset="utf-8">
|
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
|
<title>Demo</title>
|
|
|
<!-- 请勿在项目正式环境中引用该 layui.css 地址 -->
|
|
|
<link href="../js/layui/css/layui.css" rel="stylesheet">
|
|
|
<style>
|
|
|
.woo-tool-text-delimiter {
|
|
|
width: 1px;
|
|
|
height: 12px;
|
|
|
background: #EEEEEE;
|
|
|
display: inline-block;
|
|
|
margin: 0 6px 0 4px;
|
|
|
}
|
|
|
|
|
|
.woo-theme-color {
|
|
|
color: #1e9fff !important;
|
|
|
}
|
|
|
|
|
|
.woo-tool-span {
|
|
|
margin: 0 3px;
|
|
|
position: relative;
|
|
|
top: -1px;
|
|
|
cursor: pointer;
|
|
|
}
|
|
|
|
|
|
.layui-card-body .layui-form {
|
|
|
margin-top: 0 !important;
|
|
|
}
|
|
|
|
|
|
.layui-form-select {
|
|
|
width: 300px;
|
|
|
}
|
|
|
|
|
|
.layui-card {
|
|
|
margin-bottom: 15px;
|
|
|
border-radius: 2px;
|
|
|
background-color: #fff;
|
|
|
box-shadow: none;
|
|
|
}
|
|
|
|
|
|
.layui-fixbar li {
|
|
|
height: 38px;
|
|
|
line-height: 38px;
|
|
|
border: 1px solid transparent;
|
|
|
padding: 0 18px;
|
|
|
background-color: #16baaa;
|
|
|
color: #fff;
|
|
|
white-space: nowrap;
|
|
|
text-align: center;
|
|
|
font-size: 14px !important;
|
|
|
border-radius: 2px;
|
|
|
cursor: pointer;
|
|
|
}
|
|
|
|
|
|
.fix {
|
|
|
display: flex;
|
|
|
justify-content: space-between;
|
|
|
align-items: center;
|
|
|
height: 55px;
|
|
|
}
|
|
|
</style>
|
|
|
</head>
|
|
|
|
|
|
<body class="layui-form">
|
|
|
<div class="layui-card">
|
|
|
<div class="layui-card-body">
|
|
|
<!-- <button type="button" class="layui-btn" id="getData">获取数据</button> -->
|
|
|
<div class="fix">
|
|
|
<div> <label class="layui-form-label" style="width: auto;">行政区划：</label>
|
|
|
<div class="layui-input-inline">
|
|
|
<input type="text" id="keyword" lay-affix="clear" lay-filter="clear" placeholder="请输入行政区划"
|
|
|
class="layui-input">
|
|
|
</div>
|
|
|
<div class="layui-input-inline">
|
|
|
<button class="layui-btn layui-btn-md" lay-submit lay-filter="user-query">
|
|
|
<i class="layui-icon layui-icon-search"></i>
|
|
|
查询
|
|
|
</button>
|
|
|
</div>
|
|
|
</div>
|
|
|
<div><button type="button" class="layui-btn" id="back">返回</button></div>
|
|
|
</div>
|
|
|
<table id="ID-table-demo-data"></table>
|
|
|
|
|
|
<script type="text/html" id="table-bar">
|
|
|
<span class="woo-tool-span woo-tool-text-span" lay-event="delete"><a
|
|
|
class="woo-theme-color">删除</a></span>
|
|
|
</script>
|
|
|
|
|
|
|
|
|
</div>
|
|
|
</div>
|
|
|
|
|
|
<!-- 请勿在项目正式环境中引用该 layui.js 地址 -->
|
|
|
<script src="../js/layui/layui.js"></script>
|
|
|
<script>
|
|
|
layui.use('table', function () {
|
|
|
var table = layui.table;
|
|
|
var $ = layui.jquery;
|
|
|
var form = layui.form;
|
|
|
|
|
|
var id = GetQueryString("id");
|
|
|
var _data = [];
|
|
|
$.ajax({
|
|
|
type: "GET",
|
|
|
async: false,
|
|
|
url: '/dsBase/dataease/getDataSetContentByProvince?id=' + id + '&pageNumber=1&pageSize=1',
|
|
|
dataType: "json",
|
|
|
success: function (res) {
|
|
|
_data = res.data;
|
|
|
}
|
|
|
});
|
|
|
|
|
|
var _cols = [];
|
|
|
let keys = Object.keys(_data[0]);
|
|
|
|
|
|
keys.forEach((item, index) => {
|
|
|
var _obj = { field: item, title: item, edit: 'text', align: 'center' }
|
|
|
_cols.push(_obj);
|
|
|
});
|
|
|
_cols.push({ title: '操作', align: 'center', toolbar: '#table-bar' });
|
|
|
tableRender();
|
|
|
|
|
|
function tableRender() {
|
|
|
table.render({
|
|
|
elem: '#ID-table-demo-data',
|
|
|
id: 'ID-table-demo-data',
|
|
|
url: '/dsBase/dataease/getDataSetContentByProvince?id=' + id,
|
|
|
where: {
|
|
|
keyword: $("#keyword").val()
|
|
|
},
|
|
|
height: 'full-90',
|
|
|
page: {
|
|
|
limit: 20
|
|
|
, layout: ['count', 'prev', 'page', 'next', 'skip']
|
|
|
, prev: "上一页"
|
|
|
, next: "下一页"
|
|
|
},
|
|
|
request: {
|
|
|
pageName: 'pageNumber' //页码的参数名称，默认：page
|
|
|
, limitName: 'pageSize' //每页数据量的参数名，默认：limit
|
|
|
},
|
|
|
cols: [_cols]
|
|
|
});
|
|
|
}
|
|
|
|
|
|
table.on('tool(ID-table-demo-data)', function (obj) {
|
|
|
layer.confirm('确定删除吗？', { icon: 0 }, function (index) {
|
|
|
var cacheData = table.cache['ID-table-demo-data'];
|
|
|
cacheData.splice(obj.index, 1)
|
|
|
table.renderData('ID-table-demo-data');
|
|
|
layer.close(index);
|
|
|
});
|
|
|
});
|
|
|
|
|
|
table.on('edit(ID-table-demo-data)', function (obj) {
|
|
|
var value = obj.value // 得到修改后的值
|
|
|
, data = obj.data // 得到所在行所有数据
|
|
|
, field = obj.field; // 得到字段名
|
|
|
// 发送Ajax请求
|
|
|
$.ajax({
|
|
|
url: '/dsBase/dataease/saveDataSet',
|
|
|
type: 'POST',
|
|
|
data: {
|
|
|
dataset_id: id,
|
|
|
id: data.id,
|
|
|
field: field,
|
|
|
value: value
|
|
|
},
|
|
|
success: function (res) {
|
|
|
if (res.success) {
|
|
|
layer.msg('保存成功');
|
|
|
} else {
|
|
|
layer.msg('保存失败');
|
|
|
}
|
|
|
}
|
|
|
});
|
|
|
});
|
|
|
|
|
|
form.on('submit(user-query)', function () {
|
|
|
tableRender();
|
|
|
|
|
|
// 阻止表单的默认提交行为
|
|
|
return false;
|
|
|
});
|
|
|
|
|
|
|
|
|
$("#back").click(function () {
|
|
|
history.back();
|
|
|
});
|
|
|
|
|
|
|
|
|
function GetQueryString(name, istop) {
|
|
|
var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i");
|
|
|
var r = window.location.search.substr(1).match(reg);
|
|
|
if (typeof (istop) != "undefined") r = top.location.search.substr(1).match(reg);
|
|
|
|
|
|
if (r != null) return unescape(r[2]);
|
|
|
return null;
|
|
|
}
|
|
|
});
|
|
|
</script>
|
|
|
|
|
|
</body>
|
|
|
|
|
|
</html> |
