mirror of
https://gitee.com/ulthon/ulthon_admin.git
synced 2026-11-10 13:00:49 +08:00
feat(table): 手机端默认卡片与销毁重建式视图切换
This commit is contained in:
@@ -489,6 +489,24 @@
|
|||||||
extend: 'data-table-id="' + options.id + '"'
|
extend: 'data-table-id="' + options.id + '"'
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// 受控表形态清单规范化须先于引擎渲染:视图切换按钮的注入条件
|
||||||
|
// (条目数>1)依赖它,受控分支直接复用。非受控表不 normalize。
|
||||||
|
var layoutEntries = [];
|
||||||
|
if (options.controlled === true) {
|
||||||
|
layoutEntries = normalizeLayoutList(options.layoutList);
|
||||||
|
if (layoutEntries.length > 1) {
|
||||||
|
// 视图切换按钮(任务 15 (b),交互结构参照旧 TABLE_LAYOUT
|
||||||
|
// 实现重建):下拉条目在点击时按 layoutEntries 动态构建
|
||||||
|
defaultToolbar.push({
|
||||||
|
title: '视图',
|
||||||
|
layEvent: 'TABLE_LAYOUT',
|
||||||
|
icon: 'layui-icon-template-1',
|
||||||
|
extend: 'data-table-id="' + options.id + '"'
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
if (options.defaultToolbar === undefined) {
|
if (options.defaultToolbar === undefined) {
|
||||||
options.defaultToolbar = defaultToolbar;
|
options.defaultToolbar = defaultToolbar;
|
||||||
}
|
}
|
||||||
@@ -679,22 +697,41 @@
|
|||||||
'<div id="' + layoutId + '" class="ua-layout-container layui-form" lay-filter="ua-layout-' + options.id + '"></div>'
|
'<div id="' + layoutId + '" class="ua-layout-container layui-form" lay-filter="ua-layout-' + options.id + '"></div>'
|
||||||
);
|
);
|
||||||
|
|
||||||
// 形态注册:layoutList 规范化 + 当前形态(layoutDefault / 'table';
|
// 形态注册:layoutList 已在 defaultToolbar 段规范化(视图按钮
|
||||||
// 形态切换 UI 在任务 15,运行期经 ua.table.setLayoutForm 切换)。
|
// 注入共用)。运行期切形态经 ua.table.setLayoutForm。
|
||||||
// options.cols 此时已过 formatCols/renderOperat/renderTrueHide,
|
// options.cols 此时已过 formatCols/renderOperat/renderTrueHide,
|
||||||
// 渲染器族与 operat 缺省值已就绪,构建上下文直接消费
|
// 渲染器族与 operat 缺省值已就绪,构建上下文直接消费
|
||||||
var layoutEntries = normalizeLayoutList(options.layoutList);
|
|
||||||
var layoutByName = {};
|
var layoutByName = {};
|
||||||
$.each(layoutEntries, function (i, entry) {
|
$.each(layoutEntries, function (i, entry) {
|
||||||
layoutByName[entry.name] = entry;
|
layoutByName[entry.name] = entry;
|
||||||
});
|
});
|
||||||
|
|
||||||
|
// 默认形态解析(任务 15 (a)):优先级 localStorage 按页记忆 >
|
||||||
|
// 显式 layoutDefault / 手机端自动检测 > 'table'。手机端默认
|
||||||
|
// card 仅当 layoutList 含 card 条目;记忆值不在 layoutList 内
|
||||||
|
// 时忽略(防脏数据);未配 layoutList 的页面恒 table,行为
|
||||||
|
// 零变化。layoutDefault=true 旧协议即"自动判断",与新默认
|
||||||
|
// 行为一致,无需单独分支。
|
||||||
|
var defaultLayoutName = 'table';
|
||||||
|
if (layoutEntries.length > 0) {
|
||||||
|
if (options.layoutDefault && layoutByName[options.layoutDefault]) {
|
||||||
|
defaultLayoutName = options.layoutDefault;
|
||||||
|
} else if (ua.checkMobile() && layoutByName['card']) {
|
||||||
|
defaultLayoutName = 'card';
|
||||||
|
}
|
||||||
|
var savedLayout = ua.getPageSetting('table-layout-default', '');
|
||||||
|
if (layoutByName[savedLayout]) {
|
||||||
|
defaultLayoutName = savedLayout;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
controlledLayouts[options.id] = {
|
controlledLayouts[options.id] = {
|
||||||
elem: options.elem,
|
elem: options.elem,
|
||||||
cols: options.cols,
|
cols: options.cols,
|
||||||
init: options.init,
|
init: options.init,
|
||||||
entries: layoutEntries,
|
entries: layoutEntries,
|
||||||
byName: layoutByName,
|
byName: layoutByName,
|
||||||
current: options.layoutDefault || 'table'
|
current: defaultLayoutName
|
||||||
};
|
};
|
||||||
|
|
||||||
window.UA_TABLE_STORE.register(options.id, {
|
window.UA_TABLE_STORE.register(options.id, {
|
||||||
@@ -1720,6 +1757,52 @@
|
|||||||
_that.addClass('layui-hide');
|
_that.addClass('layui-hide');
|
||||||
}
|
}
|
||||||
break;
|
break;
|
||||||
|
case 'TABLE_LAYOUT':
|
||||||
|
// 视图切换下拉(任务 15 (b),交互结构参照旧 TABLE_LAYOUT
|
||||||
|
// 实现重建):按钮仅在受控表 layoutList 条目>1 时注入,
|
||||||
|
// 条目清单来自 controlledLayouts 注册表。点击条目 =
|
||||||
|
// localStorage 按页记忆 + setLayoutForm 切换(数据取自
|
||||||
|
// store 当页状态,零网络请求)
|
||||||
|
var layoutEntryId = 'ua-layout-list-' + tableId;
|
||||||
|
var $toolbarLayoutElem = $('[lay-table-id="' + tableId + '"]').find('[lay-event="TABLE_LAYOUT"]');
|
||||||
|
var $layoutListElem = $('#' + layoutEntryId);
|
||||||
|
if ($layoutListElem.length > 0) {
|
||||||
|
$layoutListElem.remove();
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
|
||||||
|
var layoutCurrent = ua.table.getLayoutForm(tableId);
|
||||||
|
var layoutIcons = {table: 'layui-icon-table', card: 'layui-icon-app'};
|
||||||
|
var layoutHtml = '<div id="' + layoutEntryId + '" class="ul-nav-block table-tpl-container">';
|
||||||
|
$.each(controlledLayouts[tableId].entries, function (i, item) {
|
||||||
|
var itemIcon = item.icon || layoutIcons[item.name] || 'layui-icon-template-1';
|
||||||
|
var itemClassName = item.name === layoutCurrent ? ' current' : '';
|
||||||
|
layoutHtml += '<div class="item' + itemClassName + '" data-name="' + item.name + '">'
|
||||||
|
+ '<div class="item-icon"><i class="layui-icon ' + itemIcon + '"></i></div>'
|
||||||
|
+ '<div class="item-title">' + item.title + '</div>'
|
||||||
|
+ '</div>';
|
||||||
|
});
|
||||||
|
layoutHtml += '</div>';
|
||||||
|
|
||||||
|
$layoutListElem = $(layoutHtml).appendTo($toolbarLayoutElem);
|
||||||
|
|
||||||
|
$layoutListElem.on('click', '.item', function (event) {
|
||||||
|
var layoutName = $(this).data('name');
|
||||||
|
ua.setPageSetting('table-layout-default', layoutName);
|
||||||
|
ua.table.setLayoutForm(tableId, layoutName);
|
||||||
|
$layoutListElem.remove();
|
||||||
|
$(document).off('click.ua-table-layout');
|
||||||
|
event.stopPropagation();
|
||||||
|
});
|
||||||
|
|
||||||
|
// 点击下拉外区域收起(命名空间事件,收起时解除)
|
||||||
|
$(document).off('click.ua-table-layout').on('click.ua-table-layout', function (event) {
|
||||||
|
if (!$(event.target).closest($toolbarLayoutElem).length) {
|
||||||
|
$('#' + layoutEntryId).remove();
|
||||||
|
$(document).off('click.ua-table-layout');
|
||||||
|
}
|
||||||
|
});
|
||||||
|
break;
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
|
|||||||
Reference in New Issue
Block a user