huanghai
/
QingLong
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

'commit'

Browse Source
main
kgdxpr 1 year ago
parent d5a5e111d7
commit 55623451ce
2 changed files with 279 additions and 26 deletions
Show Stats Download Patch File Download Diff File

82
WebRoot/view/jrgl/rzgl/test.html
Unescape View File

@ -5,6 +5,19 @@
<meta charset="utf-8">
<title>点击单元格变色</title>
<link rel="stylesheet" href="../../../component/layui/css/layui.css" />
<link rel="stylesheet" href="../../../component/pear/css/module/toast.css" />
<style>
.layui-table-cell {
height: 50px;
line-height: 40px;
}
th {
color: #303133;
background-color: #f5f7fa;
}
</style>
</head>
<body>
@ -14,14 +27,20 @@
</table>
<script src="../../../component/layui/layui.js"></script>
<script>
layui.use(function () {
layui.extend({
toast: '../../../component/pear/module/toast' // {/}的意思即代表采用自有路径，即不跟随 base 路径
}).use(['toast'], function () {
var $ = layui.jquery;
var table = layui.table;
var toast = layui.toast
table.render({
elem: '#myTable',
url: '/QingLong/view/jrgl/rzgl/data.json',
url: './data.json',
where: {
page: 1,
limit: 100,
@ -36,35 +55,46 @@
},
cols: [[
{ title: '序号', align: 'center', width: "10%", type: 'numbers' },
{ title: '操作人', field: 'czr', align: 'center', width: "30%" },
{ title: '操作时间', field: 'czsj', align: 'center', width: "30%" },
{ title: '小学', templet: '<div class="xx" id="a{{= d.id }}">&nbsp;</div>', align: 'center', width: "10%", style: 'cursor: pointer;' },
{ title: '初中', templet: '<div class="cz" id="a{{= d.id }}">&nbsp;</div>', align: 'center', width: "10%", style: 'cursor: pointer;' },
{ title: '高中', templet: '<div class="gz" id="a{{= d.id }}">&nbsp;</div>', align: 'center', width: "10%", style: 'cursor: pointer;' }
{ title: '操作人', field: 'czr', align: 'center', width: "35%" },
{ title: '操作时间', field: 'czsj', align: 'center', width: "35%" },
{ title: '小学', templet: '<input class="layui-input aabbxx">', align: 'center', width: "20%", style: 'cursor: pointer;' },
]],
// skin: 'line',
defaultToolbar: [],
done: function (res, curr, count) {
// $('.layui-table').on('click', 'td', function (obj) {
// if (obj.currentTarget.cellIndex > 2) {
// console.log(obj)
// if ($(this).css('background-color') == "rgba(0, 0, 0, 0)") {
// $(this).css('background-color', '#5FB878');
// } else {
// $(this).css('background-color', 'rgba(0, 0, 0, 0)');
// }
// }
// });
// $("#a1").css('background-color', '#5FB878');
$(".xx").click(function () {
if ($(this).css('background-color') == "rgba(0, 0, 0, 0)") {
$(this).css('background-color', '#D6F2F3');
} else {
$(this).css('background-color', 'rgba(0, 0, 0, 0)');
}
// console.log($(this).attr('id'));
var tempVal = '';
var options = this;
// 获取当前行数据
table.getRowData = function (tableId, elem) {
var index = $(elem).closest('tr').data('index');
return table.cache[tableId][index] || {};
};
$(".aabbxx").focus(function () {
tempVal = this.value.trim();
});
$(".aabbxx").blur(function () {
var curVal = this.value.trim();
var data = table.getRowData(options.id, this);
console.log(JSON.stringify(data), curVal,options.id);
if (tempVal != curVal) {
toast.success({
// title: '提示',
message: '数据保存成功！',
position: 'topRight',
timeout: 1200,
close:false
});
}
});
}
});

223
WebRoot/view/tb/table/base.html
Unescape View File

@ -0,0 +1,223 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<link rel="stylesheet" href="../../../component/pear/css/pear.css" />
<style>
html,
body,
form {
height: 100%;
margin: 0;
overflow: hidden;
}
.layui-card {
height: calc(100% - 20px);
overflow: auto;
}
.require-star {
position: absolute;
width: 3px;
height: 14px;
background-color: #ea4335;
top: 12px;
right: 8px;
border-radius: 1.5px;
}
.input-width {
max-width: 230px
}
.layui-row {
width: 800px;
margin: 10px auto;
}
.text {
display: block;
padding: 9px 15px;
width: 80px;
font-weight: 400;
line-height: 20px;
}
</style>
</head>
<body class="pear-container">
<form class="layui-form" action="">
<div class="layui-card">
<div class="layui-card-body">
<div class="layui-row" style="margin-top: 50px;">
<div class="layui-col-xs6">
<div class="layui-form-item">
<label class="layui-form-label" style="width: 115px !important;">单位名称：</label>
<div class="layui-input-block">
<span class="text">单位名称</span>
</div>
</div>
</div>
<div class="layui-col-xs6">
<div class="layui-form-item">
<label class="layui-form-label" style="width: 115px !important;">单位类型：</label>
<div class="layui-input-block">
<span class="text">单位类型</span>
</div>
</div>
</div>
</div>
<div class="layui-row">
<div class="layui-col-xs6">
<div class="layui-form-item">
<label class="layui-form-label" style="width: 115px !important;"><span
class="require-star"></span>小学部学生数：</label>
<div class="layui-input-block">
<input type="text" name="org_name" lay-verify="required|number" autocomplete="off"
value="0" class="layui-input input-width">
</div>
</div>
</div>
<div class="layui-col-xs6">
<div class="layui-form-item">
<label class="layui-form-label" style="width: 115px !important;"><span
class="require-star"></span>初中部学生数：
</label>
<div class="layui-input-block">
<input type="text" name="org_name" lay-verify="required|number" autocomplete="off"
value="0" class="layui-input input-width">
</div>
</div>
</div>
</div>
<div class="layui-row">
<div class="layui-col-xs6">
<div class="layui-form-item">
<label class="layui-form-label" style="width: 115px !important;"><span
class="require-star"></span>高中部学生数：
</label>
<div class="layui-input-block">
<input type="text" name="org_name" lay-verify="required|number" autocomplete="off"
value="0" class="layui-input input-width">
</div>
</div>
</div>
<div class="layui-col-xs6">
<div class="layui-form-item">
<label class="layui-form-label" style="width: 115px !important;"><span
class="require-star"></span>小学部班级数：
</label>
<div class="layui-input-block">
<input type="text" name="org_name" lay-verify="required|number" autocomplete="off"
value="0" class="layui-input input-width">
</div>
</div>
</div>
</div>
<div class="layui-row">
<div class="layui-col-xs6">
<div class="layui-form-item">
<label class="layui-form-label" style="width: 115px !important;"><span
class="require-star"></span>初中部班级数：
</label>
<div class="layui-input-block">
<input type="text" name="org_name" lay-verify="required|number" autocomplete="off"
value="0" class="layui-input input-width">
</div>
</div>
</div>
<div class="layui-col-xs6">
<div class="layui-form-item">
<label class="layui-form-label" style="width: 115px !important;"><span
class="require-star"></span>高中部班级数：
</label>
<div class="layui-input-block">
<input type="text" name="org_name" lay-verify="required|number" autocomplete="off"
value="0" class="layui-input input-width">
</div>
</div>
</div>
</div>
<div class="layui-row">
<div class="layui-col-xs6">
<div class="layui-form-item">
<label class="layui-form-label" style="width: 115px !important;"><span
class="require-star"></span>小学部教职工数：
</label>
<div class="layui-input-block">
<input type="text" name="org_name" lay-verify="required|number" autocomplete="off"
value="0" class="layui-input input-width">
</div>
</div>
</div>
<div class="layui-col-xs6">
<div class="layui-form-item">
<label class="layui-form-label" style="width: 115px !important;"><span
class="require-star"></span>初中部教职工数：
</label>
<div class="layui-input-block">
<input type="text" name="org_name" lay-verify="required|number" autocomplete="off"
value="0" class="layui-input input-width">
</div>
</div>
</div>
</div>
<div class="layui-row">
<div class="layui-col-xs6">
<div class="layui-form-item">
<label class="layui-form-label" style="width: 115px !important;"><span
class="require-star"></span>高中部教职工数：
</label>
<div class="layui-input-block">
<input type="text" name="org_name" lay-verify="required|number" autocomplete="off"
value="0" class="layui-input input-width">
</div>
</div>
</div>
</div>
<div class="layui-row" style="text-align: center;margin-top: 50px;" >
<button type="submit" class="pear-btn pear-btn-primary pear-btn-sm" lay-submit="" lay-filter="save">
<i class="layui-icon layui-icon-ok"></i>
保 存
</button>
</div>
</div>
</div>
</form>
<script src="../../../component/layui/layui.js"></script>
<script src="../../../component/pear/pear.js"></script>
<script>
layui.use(function () {
var form = layui.form;
form.on('submit(save)', function (data) {
alert('保存成功');
});
});
</script>
</body>
</html>
Write Preview
Loading…
Cancel
Save