升级.net8暂存
This commit is contained in:
@ -5,83 +5,90 @@
|
||||
layui.define(['laytpl', 'form'], function(exports){
|
||||
"use strict";
|
||||
|
||||
var $ = layui.$
|
||||
,laytpl = layui.laytpl
|
||||
,form = layui.form
|
||||
var $ = layui.$;
|
||||
var laytpl = layui.laytpl;
|
||||
var form = layui.form;
|
||||
|
||||
//模块名
|
||||
,MOD_NAME = 'transfer'
|
||||
// 模块名
|
||||
var MOD_NAME = 'transfer';
|
||||
|
||||
//外部接口
|
||||
,transfer = {
|
||||
config: {}
|
||||
,index: layui[MOD_NAME] ? (layui[MOD_NAME].index + 10000) : 0
|
||||
// 外部接口
|
||||
var transfer = {
|
||||
config: {},
|
||||
index: layui[MOD_NAME] ? (layui[MOD_NAME].index + 10000) : 0,
|
||||
|
||||
//设置全局项
|
||||
,set: function(options){
|
||||
// 设置全局项
|
||||
set: function(options){
|
||||
var that = this;
|
||||
that.config = $.extend({}, that.config, options);
|
||||
return that;
|
||||
}
|
||||
},
|
||||
|
||||
//事件
|
||||
,on: function(events, callback){
|
||||
// 事件
|
||||
on: function(events, callback){
|
||||
return layui.onevent.call(this, MOD_NAME, events, callback);
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
//操作当前实例
|
||||
,thisModule = function(){
|
||||
var that = this
|
||||
,options = that.config
|
||||
,id = options.id || that.index;
|
||||
// 操作当前实例
|
||||
var thisModule = function(){
|
||||
var that = this;
|
||||
var options = that.config;
|
||||
var id = options.id || that.index;
|
||||
|
||||
thisModule.that[id] = that; //记录当前实例对象
|
||||
thisModule.config[id] = options; //记录当前实例配置项
|
||||
thisModule.that[id] = that; // 记录当前实例对象
|
||||
thisModule.config[id] = options; // 记录当前实例配置项
|
||||
|
||||
return {
|
||||
config: options
|
||||
//重置实例
|
||||
,reload: function(options){
|
||||
config: options,
|
||||
// 重置实例
|
||||
reload: function(options){
|
||||
that.reload.call(that, options);
|
||||
}
|
||||
//获取右侧数据
|
||||
,getData: function(){
|
||||
},
|
||||
// 获取右侧数据
|
||||
getData: function(){
|
||||
return that.getData.call(that);
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
//获取当前实例配置项
|
||||
,getThisModuleConfig = function(id){
|
||||
// 获取当前实例配置项
|
||||
var getThisModuleConfig = function(id){
|
||||
var config = thisModule.config[id];
|
||||
if(!config) hint.error('The ID option was not found in the '+ MOD_NAME +' instance');
|
||||
return config || null;
|
||||
}
|
||||
return; config || null;
|
||||
};
|
||||
|
||||
//字符常量
|
||||
,ELEM = 'layui-transfer', HIDE = 'layui-hide', DISABLED = 'layui-btn-disabled', NONE = 'layui-none'
|
||||
,ELEM_BOX = 'layui-transfer-box', ELEM_HEADER = 'layui-transfer-header', ELEM_SEARCH = 'layui-transfer-search', ELEM_ACTIVE = 'layui-transfer-active', ELEM_DATA = 'layui-transfer-data'
|
||||
// 字符常量
|
||||
var ELEM = 'layui-transfer';
|
||||
var HIDE = 'layui-hide';
|
||||
var DISABLED = 'layui-btn-disabled';
|
||||
var NONE = 'layui-none';
|
||||
var ELEM_BOX = 'layui-transfer-box';
|
||||
var ELEM_HEADER = 'layui-transfer-header';
|
||||
var ELEM_SEARCH = 'layui-transfer-search';
|
||||
var ELEM_ACTIVE = 'layui-transfer-active';
|
||||
var ELEM_DATA = 'layui-transfer-data';
|
||||
|
||||
//穿梭框模板
|
||||
,TPL_BOX = function(obj){
|
||||
// 穿梭框模板
|
||||
var TPL_BOX = function(obj){
|
||||
obj = obj || {};
|
||||
return ['<div class="layui-transfer-box" data-index="'+ obj.index +'">'
|
||||
,'<div class="layui-transfer-header">'
|
||||
,'<input type="checkbox" name="'+ obj.checkAllName +'" lay-filter="layTransferCheckbox" lay-type="all" lay-skin="primary" title="{{ d.data.title['+ obj.index +'] || \'list'+ (obj.index + 1) +'\' }}">'
|
||||
,'<input type="checkbox" name="'+ obj.checkAllName +'" lay-filter="layTransferCheckbox" lay-type="all" lay-skin="primary" title="{{= d.data.title['+ obj.index +'] || \'list'+ (obj.index + 1) +'\' }}">'
|
||||
,'</div>'
|
||||
,'{{# if(d.data.showSearch){ }}'
|
||||
,'<div class="layui-transfer-search">'
|
||||
,'<i class="layui-icon layui-icon-search"></i>'
|
||||
,'<input type="input" class="layui-input" placeholder="关键词搜索">'
|
||||
,'<input type="text" class="layui-input" placeholder="关键词搜索">'
|
||||
,'</div>'
|
||||
,'{{# } }}'
|
||||
,'<ul class="layui-transfer-data"></ul>'
|
||||
,'</div>'].join('');
|
||||
}
|
||||
};
|
||||
|
||||
//主模板
|
||||
,TPL_MAIN = ['<div class="layui-transfer layui-form layui-border-box" lay-filter="LAY-transfer-{{ d.index }}">'
|
||||
// 主模板
|
||||
var TPL_MAIN = ['<div class="layui-transfer layui-form layui-border-box" lay-filter="LAY-transfer-{{= d.index }}">'
|
||||
,TPL_BOX({
|
||||
index: 0
|
||||
,checkAllName: 'layTransferLeftCheckAll'
|
||||
@ -98,10 +105,10 @@ layui.define(['laytpl', 'form'], function(exports){
|
||||
index: 1
|
||||
,checkAllName: 'layTransferRightCheckAll'
|
||||
})
|
||||
,'</div>'].join('')
|
||||
,'</div>'].join('');
|
||||
|
||||
//构造器
|
||||
,Class = function(options){
|
||||
// 构造器
|
||||
var Class = function(options){
|
||||
var that = this;
|
||||
that.index = ++transfer.index;
|
||||
that.config = $.extend({}, that.config, transfer.config, options);
|
||||
@ -110,16 +117,16 @@ layui.define(['laytpl', 'form'], function(exports){
|
||||
|
||||
//默认配置
|
||||
Class.prototype.config = {
|
||||
title: ['列表一', '列表二']
|
||||
,width: 200
|
||||
,height: 360
|
||||
,data: [] //数据源
|
||||
,value: [] //选中的数据
|
||||
,showSearch: false //是否开启搜索
|
||||
,id: '' //唯一索引,默认自增 index
|
||||
,text: {
|
||||
none: '无数据'
|
||||
,searchNone: '无匹配数据'
|
||||
title: ['列表一', '列表二'],
|
||||
width: 200,
|
||||
height: 360,
|
||||
data: [], // 数据源
|
||||
value: [], // 选中的数据
|
||||
showSearch: false, // 是否开启搜索
|
||||
id: '', // 唯一索引,默认自增 index
|
||||
text: {
|
||||
none: '无数据',
|
||||
searchNone: '无匹配数据'
|
||||
}
|
||||
};
|
||||
|
||||
@ -132,11 +139,14 @@ layui.define(['laytpl', 'form'], function(exports){
|
||||
|
||||
//渲染
|
||||
Class.prototype.render = function(){
|
||||
var that = this
|
||||
,options = that.config;
|
||||
var that = this;
|
||||
var options = that.config;
|
||||
|
||||
//解析模板
|
||||
var thisElem = that.elem = $(laytpl(TPL_MAIN).render({
|
||||
var thisElem = that.elem = $(laytpl(TPL_MAIN, {
|
||||
open: '{{', // 标签符前缀
|
||||
close: '}}' // 标签符后缀
|
||||
}).render({
|
||||
data: options
|
||||
,index: that.index //索引
|
||||
}));
|
||||
@ -148,8 +158,11 @@ layui.define(['laytpl', 'form'], function(exports){
|
||||
options.data = options.data || [];
|
||||
options.value = options.value || [];
|
||||
|
||||
//索引
|
||||
that.key = options.id || that.index;
|
||||
// 初始化 id 属性 - 优先取 options > 元素 id > 自增索引
|
||||
options.id = 'id' in options ? options.id : (
|
||||
elem.attr('id') || that.index
|
||||
);
|
||||
that.key = options.id;
|
||||
|
||||
//插入组件结构
|
||||
othis.html(that.elem);
|
||||
@ -180,28 +193,37 @@ layui.define(['laytpl', 'form'], function(exports){
|
||||
that.events(); //事件
|
||||
};
|
||||
|
||||
//渲染数据
|
||||
// 渲染数据
|
||||
Class.prototype.renderData = function(){
|
||||
var that = this
|
||||
,options = that.config;
|
||||
var that = this;
|
||||
var options = that.config;
|
||||
|
||||
//左右穿梭框差异数据
|
||||
// 左右穿梭框差异数据
|
||||
var arr = [{
|
||||
checkName: 'layTransferLeftCheck'
|
||||
,views: []
|
||||
checkName: 'layTransferLeftCheck',
|
||||
views: []
|
||||
}, {
|
||||
checkName: 'layTransferRightCheck'
|
||||
,views: []
|
||||
checkName: 'layTransferRightCheck',
|
||||
views: []
|
||||
}];
|
||||
|
||||
//解析格式
|
||||
// 解析格式
|
||||
that.parseData(function(item){
|
||||
//标注为 selected 的为右边的数据
|
||||
// 标注为 selected 的为右边的数据
|
||||
var _index = item.selected ? 1 : 0
|
||||
,listElem = ['<li>'
|
||||
,'<input type="checkbox" name="'+ arr[_index].checkName +'" lay-skin="primary" lay-filter="layTransferCheckbox" title="'+ item.title +'"'+ (item.disabled ? ' disabled' : '') + (item.checked ? ' checked' : '') +' value="'+ item.value +'">'
|
||||
,'</li>'].join('');
|
||||
arr[_index].views.push(listElem);
|
||||
var listElem = ['<li>',
|
||||
'<input type="checkbox" name="'+ arr[_index].checkName +'" lay-skin="primary" lay-filter="layTransferCheckbox" title="'+ item.title +'"'+ (item.disabled ? ' disabled' : '') + (item.checked ? ' checked' : '') +' value="'+ item.value +'">',
|
||||
'</li>'].join('');
|
||||
// 按照 options.value 顺序排列右侧数据
|
||||
if(_index){
|
||||
layui.each(options.value, function(i, v){
|
||||
if(v == item.value && item.selected){
|
||||
arr[_index].views[i] = listElem;
|
||||
}
|
||||
});
|
||||
} else {
|
||||
arr[_index].views.push(listElem);
|
||||
}
|
||||
delete item.selected;
|
||||
});
|
||||
|
||||
@ -209,7 +231,7 @@ layui.define(['laytpl', 'form'], function(exports){
|
||||
that.layData.eq(1).html(arr[1].views.join(''));
|
||||
|
||||
that.renderCheckBtn();
|
||||
}
|
||||
};
|
||||
|
||||
//渲染表单
|
||||
Class.prototype.renderForm = function(type){
|
||||
@ -427,14 +449,22 @@ layui.define(['laytpl', 'form'], function(exports){
|
||||
|
||||
//搜索
|
||||
that.laySearch.find('input').on('keyup', function(){
|
||||
var value = this.value
|
||||
,thisDataElem = $(this).parents('.'+ ELEM_SEARCH).eq(0).siblings('.'+ ELEM_DATA)
|
||||
,thisListElem = thisDataElem.children('li');
|
||||
var value = this.value;
|
||||
var thisDataElem = $(this).parents('.'+ ELEM_SEARCH).eq(0).siblings('.'+ ELEM_DATA);
|
||||
var thisListElem = thisDataElem.children('li');
|
||||
|
||||
thisListElem.each(function(){
|
||||
var thisList = $(this)
|
||||
,thisElemCheckbox = thisList.find('input[type="checkbox"]')
|
||||
,isMatch = thisElemCheckbox[0].title.indexOf(value) !== -1;
|
||||
var thisList = $(this);
|
||||
var thisElemCheckbox = thisList.find('input[type="checkbox"]');
|
||||
var title = thisElemCheckbox[0].title;
|
||||
|
||||
// 是否区分大小写
|
||||
if(options.showSearch !== 'cs'){
|
||||
title = title.toLowerCase();
|
||||
value = value.toLowerCase();
|
||||
}
|
||||
|
||||
var isMatch = title.indexOf(value) !== -1;
|
||||
|
||||
thisList[isMatch ? 'removeClass': 'addClass'](HIDE);
|
||||
thisElemCheckbox.data('hide', isMatch ? false : true);
|
||||
|
Reference in New Issue
Block a user