黄海 9 months ago
commit 5818041386

@ -0,0 +1,101 @@
<!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;
}
</style>
</head>
<body class="layui-form">
<div class="layui-card">
<div class="layui-card-body">
<table id="data-table"></table>
<script type="text/html" id="table-bar">
<span class="woo-tool-span woo-tool-text-span" lay-event="mod"><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;
table.render({
elem: '#data-table',
url: '/dsBase/dataease/getDataSet',
height: 'full-35',
page: {
limit: 20
, layout: ['count', 'prev', 'page', 'next', 'skip']
, prev: "上一页"
, next: "下一页"
},
cols: [[
{ title: '序号', align: 'center', width: "5%", type: 'numbers' },
{ title: '分类', field: 'parent_name', align: 'center' },
{ title: '数据集', field: 'dataset_name', align: 'center'},
{ title: '表名', field: 'table_name', align: 'center'},
{ title: '操作', toolbar: '#table-bar', align: 'center'}
]],
skin: 'line',
defaultToolbar: []
});
table.on('tool(data-table)', function (obj) {
window.location.href = "./dataMod.html?id=" + obj.data.id;
});
});
</script>
</body>
</html>

@ -41,14 +41,41 @@
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 {
position: fixed;
top: 0;
right: 10px;
background-color: white;
padding: 10px;
z-index: 1000;
}
</style>
</head>
<body class="layui-form">
<div class="layui-card">
<div class="layui-card" style="margin-top: 50px;">
<div class="layui-card-body">
<button type="button" class="layui-btn" id="getData">获取数据</button>
<table class="layui-hide" id="ID-table-demo-data"></table>
<!-- <button type="button" class="layui-btn" id="getData">获取数据</button> -->
<div class="fix">
<button type="button" class="layui-btn" id="saveData">保存</button>
<button type="button" class="layui-btn" id="back">返回</button>
</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="add"><a
@ -68,10 +95,11 @@
layui.use('table', function () {
var table = layui.table;
var $ = layui.jquery;
var util = layui.util;
// var id = GetQueryString("id");
var id = GetQueryString("id");
var id = "3";
// var id = "3";
var _data = [];
@ -93,10 +121,10 @@
keys.forEach((item, index) => {
_emptyData[item] = "";
var _obj = { field: item, title: item, edit: 'text' }
var _obj = { field: item, title: item, edit: 'text', align: 'center' }
_cols.push(_obj);
});
_cols.push({ title: '操作1', toolbar: '#table-bar' });
_cols.push({ title: '操作', align: 'center', toolbar: '#table-bar' });
table.render({
elem: '#ID-table-demo-data',
@ -118,12 +146,12 @@
}
});
$("#getData").click(function () {
$("#saveData").click(function () {
const cleanedData = table.cache['ID-table-demo-data'].map(item => {
const { LAY_NUM, LAY_INDEX, ...rest } = item;
return rest;
});
});
$.ajax({
type: "POST",
@ -135,13 +163,31 @@
"data": JSON.stringify(cleanedData)
},
success: function (res) {
console.log(res);
if (res.success) {
layer.msg("保存成功!", {
icon: 1,
time: 1300
}, function () {
history.back();
});
} else {
layer.msg(result.message, {
icon: 2,
time: 2000
});
}
}
});
});
$("#back").click(function () {
history.back();
});
function GetQueryString(name, istop) {
var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i");
var r = window.location.search.substr(1).match(reg);

@ -0,0 +1,52 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>自定义固定条示例 - Layui</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">
<link href="//unpkg.com/layui@2.9.18/dist/css/layui.css" rel="stylesheet">
<style>
.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;
}
</style>
</head>
<body>
<div id="target-test" style="position: relative; padding: 16px;">
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
</div>
<script src="//unpkg.com/layui@2.9.18/dist/layui.js"></script>
<script>
layui.use(function () {
var util = layui.util;
util.fixbar({
default: false,
bars: [{
type: 'groups',
content: '保存数据',
style: 'font-size: 21px;'
}],
css: { top: 10 },
click: function (type) {
console.log(type);
}
});
});
</script>
</body>
</html>
Loading…
Cancel
Save