优化 transfer 代码排版

pull/1226/head
贤心 2023-04-10 19:01:26 +08:00
parent de47b48301
commit 1b425491fc
1 changed files with 63 additions and 56 deletions

View File

@ -5,66 +5,73 @@
layui.define(['laytpl', 'form'], function(exports){ layui.define(['laytpl', 'form'], function(exports){
"use strict"; "use strict";
var $ = layui.$ var $ = layui.$;
,laytpl = layui.laytpl var laytpl = layui.laytpl;
,form = layui.form var form = layui.form;
// 模块名 // 模块名
,MOD_NAME = 'transfer' var MOD_NAME = 'transfer';
// 外部接口 // 外部接口
,transfer = { var transfer = {
config: {} config: {},
,index: layui[MOD_NAME] ? (layui[MOD_NAME].index + 10000) : 0 index: layui[MOD_NAME] ? (layui[MOD_NAME].index + 10000) : 0,
// 设置全局项 // 设置全局项
,set: function(options){ set: function(options){
var that = this; var that = this;
that.config = $.extend({}, that.config, options); that.config = $.extend({}, that.config, options);
return that; return that;
} },
// 事件 // 事件
,on: function(events, callback){ on: function(events, callback){
return layui.onevent.call(this, MOD_NAME, events, callback); return layui.onevent.call(this, MOD_NAME, events, callback);
} }
} };
// 操作当前实例 // 操作当前实例
,thisModule = function(){ var thisModule = function(){
var that = this var that = this;
,options = that.config var options = that.config;
,id = options.id || that.index; var id = options.id || that.index;
thisModule.that[id] = that; // 记录当前实例对象 thisModule.that[id] = that; // 记录当前实例对象
thisModule.config[id] = options; // 记录当前实例配置项 thisModule.config[id] = options; // 记录当前实例配置项
return { return {
config: options config: options,
// 重置实例 // 重置实例
,reload: function(options){ reload: function(options){
that.reload.call(that, options); that.reload.call(that, options);
} },
// 获取右侧数据 // 获取右侧数据
,getData: function(){ getData: function(){
return that.getData.call(that); return that.getData.call(that);
} }
} }
} };
// 获取当前实例配置项 // 获取当前实例配置项
,getThisModuleConfig = function(id){ var getThisModuleConfig = function(id){
var config = thisModule.config[id]; var config = thisModule.config[id];
if(!config) hint.error('The ID option was not found in the '+ MOD_NAME +' instance'); 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' var ELEM = 'layui-transfer';
,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 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 || {}; obj = obj || {};
return ['<div class="layui-transfer-box" data-index="'+ obj.index +'">' return ['<div class="layui-transfer-box" data-index="'+ obj.index +'">'
,'<div class="layui-transfer-header">' ,'<div class="layui-transfer-header">'
@ -78,10 +85,10 @@ layui.define(['laytpl', 'form'], function(exports){
,'{{# } }}' ,'{{# } }}'
,'<ul class="layui-transfer-data"></ul>' ,'<ul class="layui-transfer-data"></ul>'
,'</div>'].join(''); ,'</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({ ,TPL_BOX({
index: 0 index: 0
,checkAllName: 'layTransferLeftCheckAll' ,checkAllName: 'layTransferLeftCheckAll'
@ -98,10 +105,10 @@ layui.define(['laytpl', 'form'], function(exports){
index: 1 index: 1
,checkAllName: 'layTransferRightCheckAll' ,checkAllName: 'layTransferRightCheckAll'
}) })
,'</div>'].join('') ,'</div>'].join('');
// 构造器 // 构造器
,Class = function(options){ var Class = function(options){
var that = this; var that = this;
that.index = ++transfer.index; that.index = ++transfer.index;
that.config = $.extend({}, that.config, transfer.config, options); that.config = $.extend({}, that.config, transfer.config, options);
@ -110,16 +117,16 @@ layui.define(['laytpl', 'form'], function(exports){
//默认配置 //默认配置
Class.prototype.config = { Class.prototype.config = {
title: ['列表一', '列表二'] title: ['列表一', '列表二'],
,width: 200 width: 200,
,height: 360 height: 360,
,data: [] //数据源 data: [], // 数据源
,value: [] //选中的数据 value: [], // 选中的数据
,showSearch: false //是否开启搜索 showSearch: false, // 是否开启搜索
,id: '' //唯一索引,默认自增 index id: '', // 唯一索引,默认自增 index
,text: { text: {
none: '无数据' none: '无数据',
,searchNone: '无匹配数据' searchNone: '无匹配数据'
} }
}; };
@ -132,8 +139,8 @@ layui.define(['laytpl', 'form'], function(exports){
//渲染 //渲染
Class.prototype.render = function(){ Class.prototype.render = function(){
var that = this var that = this;
,options = that.config; var options = that.config;
//解析模板 //解析模板
var thisElem = that.elem = $(laytpl(TPL_MAIN).render({ var thisElem = that.elem = $(laytpl(TPL_MAIN).render({