Слияние кода завершено, страница обновится автоматически
;!function (win) {
'use strict';
var ultable = function () {
this.v = 'v2.1.0';
};
var doc = document;
/**
* 获取当前所在目录
* @returns {*}
*/
var getPath = function () {
var jsPath = doc.currentScript ? doc.currentScript.src : function () {
var js = doc.scripts
, last = js.length - 1
, src;
for (var i = last; i > 0; i--) {
if (js[i].readyState === 'interactive') {
src = js[i].src;
break;
}
}
return src || js[last].src;
}();
return jsPath.substring(0, jsPath.lastIndexOf('/') + 1);
};
/**
* 配置文件
* @type {{id: string, config: string, autoload: boolean, limit: number, page: number, headerFixed: boolean, request: {pageName: string, limitName: string}, response: {statusName: string, statusCode: boolean, msgName: string, countName: string, dataName: string}, randV: number, path: *}}
*/
var config = {
id: '', // 容器id
config: '', // 配置文件
autoload: false, // 首次进入自动加载内容
limit: 10, // 每页显示条数
page: 1, // 当前页
headerFixed: false, // 表头固定
// 用于对分页请求的参数：page、limit重新设定名称
request: {
pageName: 'page' //页码的参数名称，默认：page
, limitName: 'limit' //每页数据量的参数名，默认：limit
},
// 用于对返回的数据格式的自定义
response: {
statusName: 'state' //数据状态的字段名称，默认：state
, statusCode: true //成功的状态码，默认：true
, msgName: 'msg' //状态信息的字段名称，默认：msg
, countName: 'count' //数据总数的字段名称，默认：count
, dataName: 'data' //数据列表的字段名称，默认：data
},
randV: parseInt(Math.random() * 101, 10), // 随机版本号
path: getPath(), // 当前地址
img_reg: /((http:)|(https:))[a-zA-Z\d\.\/\-\!\\\/\_\?\=\%]+/gi, // 图片正则
text_reg: /\{[a-zA-Z\d\_\-]+\}/g, // 文字正则
done: null // 渲染完成回调
};
/**
* 初始化分页
*
*/
ultable.prototype.initPage = function () {
this.page = config.page;
this.limit = config.limit;
};
/**
* 开始函数
*
*/
ultable.prototype.run = function (__config) {
var that = this;
for (var k in __config) {
config[k] = __config[k];
}
layui.use(['jquery'], function () {
that.$ = layui.jquery;
that.getViewConfig(function (viewConfig) {
that._viewConfig = viewConfig;
// 初始化分页
that.initPage();
// 加载布局
that.loadLayout(viewConfig, function () {
// 加载表格模板
that.loadTableTpl();
// 加载添加模板
that.loadInsertTpl();
// 加载修改模板
that.loadUpdateTpl();
// 加载其他模板
that.loadOtherTpl();
// 加载查询
that.loadSelectTpl(viewConfig);
// 加载添加操作
that.loadInsertOperate(viewConfig);
// 加载修改操作
that.loadUpdateOperate(viewConfig);
// 加载删除操作
that.loadDeleteOperate(viewConfig);
// 加载其他操作
that.loadOtherOperate(viewConfig);
if (__config.done)
__config.done();
});
})
});
};
/**
* 获取视图配置信息
*
* @param func
*/
ultable.prototype.getViewConfig = function (func) {
var that = this;
that.$.ajax({
type: "GET",
url: config.config,
dataType: 'json',
success: function (result) {
func(result);
}
});
};
/**
* 加载布局
*
*/
ultable.prototype.loadLayout = function (viewConfig, func) {
layui.use(['jquery', 'laytpl', 'form'], function () {
var $ = layui.jquery;
var laytpl = layui.laytpl;
var form = layui.form;
$.ajax({
type: "GET",
url: config.path + "ul-tpl/layout.html?v=" + config.randV,
async: false,
success: function (result) {
var string = laytpl(result).render(viewConfig);
$("#" + config.id).html(string);
form.render();
func();
}
});
});
};
/**
* 加载表格模板
*
*/
ultable.prototype.loadTableTpl = function () {
var that = this;
that.$.ajax({
type: "GET",
url: config.path + "ul-tpl/table.html?v=" + config.randV,
async: false,
success: function (result) {
that.tableTpl = result;
}
});
};
/**
* 加载添加模板
*
*/
ultable.prototype.loadInsertTpl = function () {
var that = this;
that.$.ajax({
type: "GET",
url: config.path + "ul-tpl/insert.html?v=" + config.randV,
async: false,
success: function (result) {
that.insertTpl = result;
}
});
};
/**
* 加载修改模板
*
*/
ultable.prototype.loadUpdateTpl = function () {
var that = this;
that.$.ajax({
type: "GET",
url: config.path + "ul-tpl/update.html?v=" + config.randV,
async: false,
success: function (result) {
that.updateTpl = result;
}
});
};
/**
* 加载其他模板
*
*/
ultable.prototype.loadOtherTpl = function () {
var that = this;
that.$.ajax({
type: "GET",
url: config.path + "ul-tpl/other.html?v=" + config.randV,
async: false,
success: function (result) {
that.otherTpl = result;
}
});
};
/**
* 获取选中的
* @returns {Array}
*/
ultable.prototype.getCheckedData = function () {
var that = this;
var data = [];
that.$('[ul-checkbox-name=sub]:checked').each(function () {
var index = that.$(this).attr('ul-index');
data.push(that.queryData[index]);
});
return data;
};
/**
* 加载查询
*
* @param viewConfig
*/
ultable.prototype.loadSelectTpl = function (viewConfig) {
var that = this;
layui.use(['laytpl', 'form', 'laydate'], function () {
var laytpl = layui.laytpl, form = layui.form, laydate = layui.laydate;
that.$.ajax({
type: "GET",
url: config.path + 'ul-tpl/select.html?v=' + config.randV,
success: function (result) {
var data = [];
if (viewConfig.select) {
data = viewConfig.select;
}
var string = laytpl(result).render(data);
that.$("#ul-select").html(string);
form.render();
that.$("[ul-name=select][ul-type-name=time]").each(function () {
laydate.render({
elem: this,
type: 'datetime'
});
});
that.$('#ul-select-submit').bind('click', function () {
that.initPage();
that.selectOperate(viewConfig, true);
});
// 是否初始运行
if (config.autoload) {
that.selectOperate(viewConfig, true);
}
}
});
});
};
/**
* 查询操作
*
*/
ultable.prototype.selectOperate = function (viewConfig) {
if (!viewConfig) {
viewConfig = this._viewConfig;
}
var that = this;
layui.use(['laytpl', 'form', 'laypage', 'layer'], function () {
var layer = layui.layer, laypage = layui.laypage, laytpl = layui.laytpl, form = layui.form;
var index = layer.load(2, {time: 0});
var data = {};
data[config.request.pageName] = that.page;
data[config.request.limitName] = that.limit;
that.$('[ul-name=select]input').each(function () {
data[that.handelParamName(viewConfig['param-name'], that.$(this).attr('name'))] = that.$(this).val();
});
that.$('[ul-name=select]select').each(function () {
data[that.handelParamName(viewConfig['param-name'], that.$(this).attr('name'))] = that.$(this).val();
});
that.$.ajax({
url: viewConfig['select-url'],
type: 'POST',
dataType: 'json',
data: data,
success: function (result) {
layer.close(index);
if (result[config.response.statusName] == config.response.statusCode) {
that.queryData = result[config.response.dataName];
laypage.render({
elem: 'ul-page'
, count: result[config.response.countName],
curr: that.page,
limit: that.limit
, layout: ['prev', 'page', 'next', 'limit', 'skip', 'count']
, jump: function (obj, first) {
that.page = obj.curr;
that.limit = obj.limit;
// 首次不执行
if (!first) {
that.selectOperate(viewConfig);
}
}
});
var string = laytpl(that.tableTpl).render({
'config': viewConfig,
'data': result[config.response.dataName],
'that': that
});
that.$("#ul-table-content").html(string);
new tablesize().init('ul-table-content');
// 图片浏览
layer.photos({
photos: '[ul-img=ul-img]'
, anim: 5 //0-6的选择，指定弹出图片动画类型，默认随机（请注意，3.0之前的版本用shift参数）
});
that.$('.ul-table-td-content').dblclick(function () {
var text = that.$(this).text();
var id = 'ul-edit-textarea' + new Date().getTime();
that.$(this).html('<textarea readonly id="' + id + '" class="layui-textarea">' + text + '</textarea>');
that.$('#' + id).focus();
that.$('#' + id).blur(function () {
text = that.$(this).parent().text();
that.$(this).parent().text(text);
});
});
form.render();
form.on('checkbox(ul-checkbox-head)', function (data) {
that.$('[ul-checkbox-name=sub]').prop('checked', data.elem.checked);
form.render('checkbox');
});
// 头部固定
that.fixedThead();
} else {
layer.msg(result[config.response.msgName]);
}
},
error: function () {
layer.closeAll();
layer.msg('网络错误：[查询数据]');
}
});
});
};
/**
* 添加操作
*
* @param viewConfig
*/
ultable.prototype.loadInsertOperate = function (viewConfig) {
var that = this;
if (!viewConfig.insert) {
return;
}
layui.use(['layer', 'laytpl', 'form', 'laydate', 'layedit'], function () {
var layer = layui.layer, laytpl = layui.laytpl, form = layui.form, laydate = layui.laydate,
layedit = layui.layedit;
that.$('#ul-operate-insert').bind('click', function () {
var string = laytpl(that.insertTpl).render(viewConfig.insert);
var index_1 = layer.open({
type: 1,
title: '添加数据',
content: string,
area: '500px',
offset: '100px',
fixed: false,
success: function () {
form.render();
that.$("[ul-name=insert][ul-type-name=time]").each(function () {
laydate.render({
elem: this,
type: 'datetime'
});
});
var layeditIndex = 0;
that.$("textarea[ul-name=insert][layedit]").each(function () {
var id = 'layedit-id-' + layeditIndex;
that.$(this).attr('id', id);
var index = layedit.build(id);
that.$(this).attr('index', index);
layeditIndex++;
});
that.$('#ul-insert-submit').bind('click', function () {
layer.confirm('确认添加?', {title: '提示'}, function (index_2) {
layer.close(index_2);
var index_3 = layer.load(2, {time: 0});
// 参数组装
var data = {};
that.$('[ul-name=insert]input').each(function () {
data[that.handelParamName(viewConfig['param-name'], that.$(this).attr('name'))] = that.$(this).val();
});
that.$('[ul-name=insert]select').each(function () {
data[that.handelParamName(viewConfig['param-name'], that.$(this).attr('name'))] = that.$(this).val();
});
that.$('textarea[ul-name=insert][layedit]').each(function () {
data[that.handelParamName(viewConfig['param-name'], that.$(this).attr('name'))] = layedit.getContent(that.$(this).attr('index'));
});
that.$('textarea[ul-name=insert][textarea]').each(function () {
data[that.handelParamName(viewConfig['param-name'], that.$(this).attr('name'))] = that.$(this).val();
});
// 数据请求
that.$.ajax({
type: "POST",
url: viewConfig['insert-url'],
data: data,
async: true,
dataType: 'json',
success: function (result) {
layer.close(index_3);
if (result[config.response.statusName] == config.response.statusCode) {
layer.msg('添加成功');
layer.close(index_1);
that.selectOperate(viewConfig);
} else {
layer.msg(result[config.response.msgName]);
}
}, error: function () {
layer.closeAll();
layer.msg('网络错误：[添加数据]');
}
});
});
});
}
});
});
});
};
/**
* 修改操作
*
* @param viewConfig
*/
ultable.prototype.loadUpdateOperate = function (viewConfig) {
var that = this;
if (!viewConfig.update) {
return;
}
layui.use(['layer', 'laytpl', 'form', 'laydate', 'layedit'], function () {
var layer = layui.layer, laytpl = layui.laytpl, form = layui.form, laydate = layui.laydate,
layedit = layui.layedit;
that.$('#ul-operate-update').bind('click', function () {
var checkedData = that.getCheckedData();
if (checkedData.length != 1) {
layer.msg('请选择要修改的数据行');
return false;
}
var data = checkedData[0];
var string = laytpl(that.updateTpl).render({config: viewConfig.update, data: data});
var index_1 = layer.open({
type: 1,
title: '修改数据',
content: string,
area: '500px',
offset: '100px',
fixed: false,
success: function () {
form.render();
that.$("[ul-name=update][ul-type-name=time]").each(function () {
laydate.render({
elem: this,
type: 'datetime'
});
});
var layeditIndex = 0;
that.$("textarea[ul-name=update][layedit]").each(function () {
var id = 'layedit-id-' + layeditIndex;
that.$(this).attr('id', id);
var index = layedit.build(id);
that.$(this).attr('index', index);
layeditIndex++;
});
that.$('#ul-update-submit').bind('click', function () {
layer.confirm('确认修改?', {title: '提示'}, function (index_2) {
layer.close(index_2);
var index_3 = layer.load(2, {time: 0});
var _data = {};
if (typeof viewConfig['param-name'] !== "undefined") {
for (var i in data) {
_data[that.handelParamName(viewConfig['param-name'], i)] = data[i];
}
}else{
_data = data;
}
// 参数组装
that.$('[ul-name=update]input').each(function () {
_data[that.handelParamName(viewConfig['param-name'], that.$(this).attr('name'))] = that.$(this).val();
});
that.$('[ul-name=update]select').each(function () {
_data[that.handelParamName(viewConfig['param-name'], that.$(this).attr('name'))] = that.$(this).val();
});
that.$('[ul-name=update][layedit]textarea').each(function () {
_data[that.handelParamName(viewConfig['param-name'], that.$(this).attr('name'))] = layedit.getContent(that.$(this).attr('index'));
});
that.$('[ul-name=update][textarea]textarea').each(function () {
_data[that.handelParamName(viewConfig['param-name'], that.$(this).attr('name'))] = that.$(this).val();
});
console.log(_data);
// 数据请求
that.$.ajax({
type: "POST",
url: viewConfig['update-url'],
data: _data,
dataType: 'json',
success: function (result) {
layer.close(index_3);
if (result[config.response.statusName] == config.response.statusCode) {
layer.msg('修改成功');
layer.close(index_1);
that.selectOperate(viewConfig);
} else {
layer.msg(result[config.response.msgName]);
}
}, error: function () {
layer.closeAll();
layer.msg('网络错误：[修改数据]');
}
});
});
});
}
});
});
});
};
/**
* 删除操作
*
* @param viewConfig
*/
ultable.prototype.loadDeleteOperate = function (viewConfig) {
var that = this;
if (!viewConfig.delete) {
return;
}
layui.use(['layer'], function () {
var layer = layui.layer;
that.$('#ul-operate-delete').bind('click', function () {
var checkedData = that.getCheckedData();
if (checkedData.length == 0) {
layer.msg('请选择要删除的数据行');
return false;
}
layer.confirm('确认删除选中项?', {title: '提示'}, function (index_2) {
layer.close(index_2);
var index_3 = layer.load(2, {time: 0});
// 参数组装
var data = {};
for (var i = 0; i < checkedData.length; i++) {
for (var j = 0; j < viewConfig.delete.length; j++) {
var col = viewConfig.delete[j];
var colname = that.handelParamName(viewConfig['param-name'], col);
data[colname + '[' + i + ']'] = checkedData[i][col];
}
}
// 数据请求
that.$.ajax({
type: "POST",
url: viewConfig['delete-url'],
data: data,
dataType: 'json',
success: function (result) {
layer.close(index_3);
if (result[config.response.statusName] == config.response.statusCode) {
layer.msg('删除成功');
that.selectOperate(viewConfig);
} else {
layer.msg(result[config.response.msgName]);
}
}, error: function () {
layer.closeAll();
layer.msg('网络错误：[删除失败]');
}
});
});
});
});
};
/**
* 其他操作
*
* @param viewConfig
*/
ultable.prototype.loadOtherOperate = function (viewConfig) {
var that = this;
if (!viewConfig['other-operate']) {
return;
}
for (var i = 0; i < viewConfig['other-operate'].length; i++) {
var item = viewConfig['other-operate'][i];
bindClick(item, i);
}
function bindClick(item, i) {
layui.use(['layer', 'laytpl', 'form', 'layedit', 'laydate'], function () {
var layer = layui.layer, laytpl = layui.laytpl, form = layui.form, layedit = layui.layedit,
laydate = layui.laydate;
if (item.url) {
that.$('#ul-operate-other' + i).bind('click', function () {
var checkedData = that.getCheckedData();
if (checkedData.length == 0) {
layer.msg('请选择要' + item.title + '的数据行');
return false;
}
var data = checkedData[0];
var string = laytpl(that.otherTpl).render({config: item, data: data});
var index_1 = layer.open({
type: 1,
title: item.title + '数据',
content: string,
area: '500px',
offset: '100px',
fixed: false,
success: function () {
form.render();
that.$("[ul-name=other][ul-type-name=time]").each(function () {
laydate.render({
elem: this,
type: 'datetime'
});
});
var layeditIndex = 0;
that.$("textarea[ul-name=other][layedit]").each(function () {
var id = 'layedit-id-' + layeditIndex;
that.$(this).attr('id', id);
var index = layedit.build(id);
that.$(this).attr('index', index);
layeditIndex++;
});
that.$('#ul-other-edit-submit').bind('click', function () {
layer.confirm('确认' + item.title + '选中的数据吗?', {title: '提示'}, function (index_2) {
layer.close(index_2);
var index_3 = layer.load(2, {time: 0});
// 参数组装
var data = {};
for (var i = 0; i < checkedData.length; i++) {
for (var j = 0; j < item['param'].length; j++) {
var k = item['param'][j];
data[k + '[' + i + ']'] = checkedData[i][k];
}
}
// 参数组装
that.$('[ul-name=other]input').each(function () {
data[that.handelParamName(viewConfig['param-name'], that.$(this).attr('name'))] = that.$(this).val();
});
that.$('[ul-name=other]select').each(function () {
data[that.handelParamName(viewConfig['param-name'], that.$(this).attr('name'))] = that.$(this).val();
});
that.$('[ul-name=other][layedit]textarea').each(function () {
data[that.handelParamName(viewConfig['param-name'], that.$(this).attr('name'))] = layedit.getContent(that.$(this).attr('index'));
});
that.$('[ul-name=other][textarea]textarea').each(function () {
data[that.handelParamName(viewConfig['param-name'], that.$(this).attr('name'))] = that.$(this).val();
});
// 数据请求
that.$.ajax({
type: "POST",
url: item['url'],
data: data,
async: true,
dataType: 'json',
success: function (result) {
layer.close(index_3);
if (result[config.response.statusName] == config.response.statusCode) {
layer.msg(item.title + '成功');
layer.close(index_1);
that.selectOperate(viewConfig);
} else {
layer.msg(result[config.response.msgName]);
}
}, error: function () {
layer.closeAll();
layer.msg('网络错误：[' + item.title + '数据]');
}
});
});
});
}
});
});
} else {
that.$('#ul-operate-other' + i).bind('click', function () {
var checkedData = that.getCheckedData();
if (item.method != '') {
win[item.method](checkedData);
}
});
}
});
}
};
ultable.prototype.fixedThead = function () {
var that = this;
if (this.fixed) {
var $table = that.$("#" + config.id).find('table');
var docTop = $table.offset().top;
var $thead = null;
var widths = [];
that.$(document).scroll(function () {
var top = that.$(this).scrollTop();
if (docTop - top < 0) {
if ($thead == null) {
$thead = $table.find('thead').clone();
$table.find('thead').find('th').each(function () {
widths.push(that.$(this).width());
})
$thead.find('th').each(function () {
that.$(this).width(parseInt(widths.splice(0, 1)) + 1);
})
$thead.attr('fiex-thead', 'fiex-thead');
$thead.addClass('fiex-thead');
that.$('#ul-table-content').append($thead);
}
} else if ($thead != null) {
$thead.remove();
$thead = null;
}
});
}
}
/**
* 复选框
* @param data value数组
* @param name 默认值
*/
ultable.prototype.select = function (data, name) {
for (var i in data) {
var item = data[i];
if (item.key == name) {
return item.value;
}
}
};
/**
* 图片解析
* @param text
* @returns {Array}
*/
ultable.prototype.img = function (text) {
var imgs = [];
try {
imgs = text.match(config.img_reg);
} catch (err) {
}
return imgs;
};
/**
* 获取value
* @param item
* @param name
* @returns {string}
*/
ultable.prototype.value = function (item, name) {
var names = name.match(config.text_reg);
for (var i in names) {
var name_item = names[i];
var value = item[name_item.substring(1, name_item.length - 1)];
name = name.replace(new RegExp(name_item, 'g'), value);
}
return name;
};
/**
* 处理参数名
* @param param_name
* @param name
* @returns {*}
*/
ultable.prototype.handelParamName = function (param_name, name) {
if (typeof param_name !== "undefined") {
return param_name + '[' + name + ']';
} else {
return name;
}
};
/**
* 获取其他操作DOM
*
* @param name
* @returns {*}
*/
ultable.prototype.getOtherOperateDom = function (name) {
return this.$('[ul-operate][ul-name=' + name + ']');
};
/**
* 重新查询
*/
ultable.prototype.renderSelect = function () {
this.selectOperate();
}
win.ultable = ultable;
}(window);
// 表格改变大小
;!function (win) {
'use strict';
var tablesize = function () {
this.v = 'v1.0.0';
};
tablesize.prototype.init = function (id) {
var i,
self,
table = document.getElementById(id),
header = table.rows[0],
tableX = header.clientWidth,
length = header.cells.length;
for (i = 0; i < length; i++) {
header.cells[i].onmousedown = function () {
self = this;
if (event.offsetX > self.offsetWidth - 10) {
self.mouseDown = true;
self.oldX = event.x;
self.oldWidth = self.offsetWidth;
}
};
header.cells[i].onmousemove = function () {
if (event.offsetX > this.offsetWidth - 10) {
this.style.cursor = 'col-resize';
} else {
this.style.cursor = 'default';
}
if (typeof self === 'undefined') {
self = this;
}
if (self.mouseDown != null && self.mouseDown == true) {
self.style.cursor = 'default';
if (self.oldWidth + (event.x - self.oldX) > 0) {
self.width = self.oldWidth + (event.x - self.oldX);
}
self.style.width = self.width;
table.style.width = tableX + (event.x - self.oldX) + 'px';
self.style.cursor = 'col-resize';
}
};
table.onmouseup = function () {
if (typeof self === 'undefined') {
self = this;
}
self.mouseDown = false;
self.style.cursor = 'default';
tableX = header.clientWidth;
};
}
};
win.tablesize = tablesize;
}(window);
Вы можете оставить комментарий после Вход в систему
Неприемлемый контент может быть отображен здесь и не будет показан на странице. Вы можете проверить и изменить его с помощью соответствующей функции редактирования.
Если вы подтверждаете, что содержание не содержит непристойной лексики/перенаправления на рекламу/насилия/вульгарной порнографии/нарушений/пиратства/ложного/незначительного или незаконного контента, связанного с национальными законами и предписаниями, вы можете нажать «Отправить» для подачи апелляции, и мы обработаем ее как можно скорее.
Опубликовать ( 0 )