家谱现有接口调试50%
This commit is contained in:
rain
@@ -0,0 +1,677 @@
|
||||
layui.define(['jquery', 'dropdown', 'table', 'form'], function (exports) {
|
||||
"use strict";
|
||||
|
||||
var dropdown = layui.dropdown, //下拉菜单
|
||||
table = layui.table, //table组件
|
||||
$ = layui.jquery, //jQuery
|
||||
form = layui.form, //表单
|
||||
moduleName = 'dropdownTable', //模块名
|
||||
|
||||
dropdownTable = {
|
||||
version: '1.0.4',
|
||||
config: {
|
||||
selectType: 'radio',
|
||||
emptyMsg: '点击此处选择'
|
||||
},
|
||||
index: layui[moduleName] ? (layui[moduleName].index + 10000) : 0,
|
||||
set: function (options) {
|
||||
this.config = $.extend(true, {}, that.config, options);
|
||||
let config = this.config,
|
||||
selectType = config.selectType,
|
||||
selectField = { type: selectType, fixed: 'left' },
|
||||
cols = config?.selectTable?.cols ?? [[]];
|
||||
cols.forEach((item) => {
|
||||
if (JSON.stringify(item).indexOf(JSON.stringify(selectField)) < 0) {
|
||||
item.splice(0, 0, selectField);
|
||||
}
|
||||
});
|
||||
return that;
|
||||
}
|
||||
},
|
||||
//操作当前实例
|
||||
thisModule = function () {
|
||||
let that = this,
|
||||
options = that.config,
|
||||
id = options.id || that.index;
|
||||
thisModule.that[id] = that; //记录当前实例对象
|
||||
return {
|
||||
config: options,
|
||||
reload: function (options) {
|
||||
that.reload.call(that, options);
|
||||
}
|
||||
};
|
||||
},
|
||||
//构造器
|
||||
Class = function (options) {
|
||||
let index = ++dropdownTable.index;
|
||||
this.index = index;
|
||||
this.tableId = 'dropdown-select-table-' + index; //初始化当前下拉表格的ID
|
||||
this.dropdownId = 'dropdown-' + index; //初始化当前下拉组件的ID
|
||||
//其中selectedIds为初始化被选择的值，selectedDisplayValues为初始化被选中值的显示值
|
||||
this.config = $.extend(true, {}, dropdownTable.config, options, {
|
||||
selectedIds: [],
|
||||
selectedDisplayValues: []
|
||||
});
|
||||
let config = this.config,
|
||||
selectType = config.selectType,
|
||||
selectField = { type: selectType, fixed: 'left' },
|
||||
selectTableCols = config?.selectTable?.cols ?? [[]];
|
||||
if (selectType === 'checkbox') {
|
||||
selectTableCols.forEach((item) => {
|
||||
if (JSON.stringify(item).indexOf(JSON.stringify(selectField)) < 0) {
|
||||
item.splice(0, 0, selectField);
|
||||
}
|
||||
});
|
||||
}
|
||||
this.render();
|
||||
};
|
||||
|
||||
//重载表格实例
|
||||
Class.prototype.reloadSelectTable = function (selectTableConfig) {
|
||||
let config = this.config;
|
||||
layui.each(selectTableConfig, function (key, item) {
|
||||
if (layui.type(item) === 'array') {
|
||||
delete config.selectTable[key];
|
||||
}
|
||||
});
|
||||
$.extend(true, config.selectTable, selectTableConfig);
|
||||
this.clearSelected();
|
||||
};
|
||||
|
||||
//清空选中
|
||||
Class.prototype.clearSelected = function () {
|
||||
let config = this.config,
|
||||
bindInput = config.bindInput;
|
||||
$(bindInput).val("");
|
||||
$(bindInput)[0].dataset.displayValue = '';
|
||||
$.extend(config, { selectedIds: [], selectedDisplayValues: [] });
|
||||
this.setSelectedDisplayAndValue();
|
||||
}
|
||||
|
||||
//渲染
|
||||
Class.prototype.render = function () {
|
||||
let that = this,
|
||||
options = that.config,
|
||||
_this = options.elem = $(options.elem);
|
||||
if (!_this[0]) {
|
||||
return;
|
||||
}
|
||||
|
||||
that.initElemArea();
|
||||
that.iniDropdown();
|
||||
};
|
||||
|
||||
//初始化绑定元素区域
|
||||
Class.prototype.initElemArea = function () {
|
||||
let that = this,
|
||||
config = this.config,
|
||||
elem = config.elem,
|
||||
searchName = this.config?.searchName ?? 'keywords';
|
||||
$(elem).css({
|
||||
'display': 'inline-block',
|
||||
'width': '80%',
|
||||
'height': '100%',
|
||||
'min-height': '35px',
|
||||
'border': '1px solid #eee',
|
||||
'line-height': '35px',
|
||||
'box-sizing': 'border-box',
|
||||
'padding': '0 10px',
|
||||
'cursor': 'pointer'
|
||||
});
|
||||
$(elem).hover(() => {
|
||||
$(elem).css({ 'border-color': '#e2e2e2' });
|
||||
}, () => {
|
||||
$(elem).css({ 'border-color': '#eee' });
|
||||
});
|
||||
|
||||
let selectButton = $("<button type='button' class='layui-btn layui-btn-primary'>选择</button>")
|
||||
selectButton.css({
|
||||
'display': 'inline-block',
|
||||
'width': '20%',
|
||||
'min-width': '45px',
|
||||
'height': '100%',
|
||||
'box-sizing': 'border-box',
|
||||
'font-size': '12px',
|
||||
'padding': '0',
|
||||
'line-height': '36px'
|
||||
});
|
||||
if (config?.needPopup ?? true) {
|
||||
$(elem).after(selectButton);
|
||||
} else {
|
||||
$(elem).css({ 'width': '100%' });
|
||||
}
|
||||
|
||||
let selectContent = `
|
||||
<div class="select-container" >
|
||||
<div class="layui-row">
|
||||
<div class="layui-col-md7 table-container">
|
||||
<div class="layui-bg-green header">
|
||||
<div class="layui-font-14">选择</div>
|
||||
<form class="layui-form" style="float: right;" lay-filter="data-table-search-form">
|
||||
<div class="layui-form-item" style="margin:0;">
|
||||
<div class="layui-input-inline">
|
||||
<input type="text" id="data_table_${searchName}" name="data_table_${searchName}" placeholder="请输入您要搜索的内容" class="layui-input">
|
||||
</div>
|
||||
<div class="layui-inline">
|
||||
<button id="data-table-search-button" type="button" class="layui-btn layui-btn-primary" style="background-color:white"><i class="layui-icon layui-icon-search"></i></button>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
|
||||
<!--表格-->
|
||||
<div class="table-item">
|
||||
<table class="layui-hide" id="data-table" lay-filter="data-table"></table>
|
||||
</div>
|
||||
</div>
|
||||
<div class="layui-col-md5 table-container">
|
||||
<div class="layui-bg-green header">
|
||||
<div class="layui-font-14">选择结果</div>
|
||||
</div>
|
||||
|
||||
<div class="table-item">
|
||||
<table class="layui-hide" id="selected-table" lay-filter="selected-table"></table>
|
||||
<script type="text/html" id="selected-table-opt-bar">
|
||||
<div class="layui-clear-space">
|
||||
<a class="layui-btn layui-btn-xs layui-btn-danger" lay-event="del">移除</a>
|
||||
</div>
|
||||
</script>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.select-container{
|
||||
width:100%;
|
||||
padding:10px;
|
||||
box-sizing:border-box;
|
||||
}
|
||||
|
||||
.table-container {
|
||||
box-sizing: border-box;
|
||||
padding-right: 10px;
|
||||
}
|
||||
|
||||
.table-container>.header {
|
||||
width: 100%;
|
||||
display: table;
|
||||
padding: 5px 10px;
|
||||
box-sizing: border-box;
|
||||
min-height: 50px;
|
||||
}
|
||||
|
||||
.table-container>.header>* {
|
||||
display: table-cell;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.table-container>.table-item {
|
||||
margin-top: 20px;
|
||||
}
|
||||
</style>
|
||||
`
|
||||
selectButton.click(() => {
|
||||
layer.open({
|
||||
title: '选择',
|
||||
type: 1,
|
||||
area: ['70%', '80%'],
|
||||
maxmin: true,
|
||||
btn: ['确认', '取消'],
|
||||
content: selectContent,
|
||||
success: () => {
|
||||
renderSelectedTable();
|
||||
renderDataTable();
|
||||
bindTableEvent();
|
||||
initSelectedTable();
|
||||
bindDataTableSearchFormEvent();
|
||||
},
|
||||
yes: index => {
|
||||
let selectedData = table.getData('selected-table') ?? [];
|
||||
let selectedIds = selectedData.map(item => item.id);
|
||||
config.selectedIds = selectedIds;
|
||||
config.selectedDisplayValues = selectedData.map(item => item.displayValue);
|
||||
that.setSelectedDisplayAndValue();
|
||||
layer.close(index);
|
||||
let onSelected = config.onSelected;
|
||||
if ($.isFunction(onSelected)) {
|
||||
onSelected(selectedIds);
|
||||
}
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
function renderDataTable() {
|
||||
let tableNeedConfig = {
|
||||
id: 'data-table',
|
||||
elem: '#data-table',
|
||||
done: function (res) {
|
||||
setDataTableSelected();
|
||||
}
|
||||
},
|
||||
tableConfig = $.extend({}, config.selectTable, tableNeedConfig);
|
||||
table.render(tableConfig);
|
||||
}
|
||||
|
||||
function renderSelectedTable() {
|
||||
table.render({
|
||||
elem: '#selected-table',
|
||||
cols: [
|
||||
[
|
||||
{ field: 'id', title: 'ID', width: 80, sort: true },
|
||||
{ field: 'displayValue', title: '值' },
|
||||
{ field: 'originValue', title: '原始值', hide: true },
|
||||
{ fixed: 'right', title: '操作', width: 70, toolbar: '#selected-table-opt-bar' }
|
||||
]
|
||||
],
|
||||
data: []
|
||||
});
|
||||
}
|
||||
|
||||
function bindDataTableSearchFormEvent() {
|
||||
$('#data-table-search-button').click(() => {
|
||||
let where = {},
|
||||
searchValue = $('#data_table_' + searchName).val();
|
||||
where[searchName] = searchValue;
|
||||
table.reloadData('data-table', { page: { curr: 1 }, where: where });
|
||||
});
|
||||
}
|
||||
|
||||
function bindTableEvent() {
|
||||
table.on('row(data-table)', (obj) => {
|
||||
let data = obj.data;
|
||||
selectedTableReload({
|
||||
'id': data[config.selectTable.uniqueId],
|
||||
'displayValue': data[config.selectTable.displayField],
|
||||
'originValue': JSON.stringify(data)
|
||||
});
|
||||
});
|
||||
|
||||
table.on('tool(selected-table)', obj => {
|
||||
if (obj.event === 'del') {
|
||||
obj.del();
|
||||
setDataTableSelected();
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function selectedTableReload(selectedData) {
|
||||
let originData = table.getData('selected-table') ?? [];
|
||||
if (originData.map(item => item.id).includes(selectedData.id)) {
|
||||
originData = originData.filter(item => item.id !== selectedData.id);
|
||||
} else {
|
||||
if (config.selectType === 'radio') {
|
||||
originData = [];
|
||||
}
|
||||
|
||||
originData.push(selectedData)
|
||||
}
|
||||
|
||||
table.reload('selected-table', {
|
||||
data: originData
|
||||
});
|
||||
setDataTableSelected();
|
||||
}
|
||||
|
||||
function setDataTableSelected() {
|
||||
let selectedIds = (table.getData('selected-table') ?? []).map(item => item.id + '');
|
||||
let data = (table.getData('data-table') ?? []);
|
||||
data.forEach((item, index) => {
|
||||
if (config.selectType === 'checkbox') {
|
||||
table.setRowChecked('data-table', {
|
||||
type: 'checkbox',
|
||||
index: index,
|
||||
checked: selectedIds.includes(item.id + '')
|
||||
});
|
||||
} else if (selectedIds.includes(item.id + '')) {
|
||||
table.setRowChecked('data-table', {
|
||||
type: 'radio',
|
||||
index: index,
|
||||
checked: true
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function initSelectedTable() {
|
||||
let bindInput = config.bindInput,
|
||||
bindInputValue = $(bindInput).val() ?? '',
|
||||
bindInputDisplayValue = $(bindInput)[0].dataset.displayValue ?? '';
|
||||
|
||||
config.selectedIds = bindInputValue.split("$").filter(item => item !== '');
|
||||
config.selectedDisplayValues = bindInputDisplayValue.split("$").filter(item => item !== '');
|
||||
config.selectedIds.forEach((id, index) => {
|
||||
selectedTableReload({
|
||||
'id': id,
|
||||
'displayValue': config.selectedDisplayValues[index]
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
//初始化下拉组件
|
||||
Class.prototype.iniDropdown = function () {
|
||||
let that = this,
|
||||
config = that.config,
|
||||
elem = config.elem;
|
||||
|
||||
dropdown.render({
|
||||
id: config.id ?? that.index,
|
||||
elem: elem,
|
||||
trigger: 'click',
|
||||
content: that.iniSelectTableHtml(),
|
||||
style: config?.style ?? 'min-width:450px;box-sizing:border-box; padding:10px;width:' + $(elem).width() + 'px',
|
||||
ready: () => {
|
||||
that.iniSelectTable();
|
||||
that.bindRowCheckToSelectTable();
|
||||
that.bindSelectBoxEventToSelectTable();
|
||||
that.bindSearchToSelectTable();
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
//初始化table的html文件
|
||||
Class.prototype.iniSelectTableHtml = function () {
|
||||
let index = this.index,
|
||||
tableId = this.tableId,
|
||||
searchName = this.config?.searchName ?? 'keywords',
|
||||
selectTableSearchFormId = 'select-table-search-' + index,
|
||||
selectTableSearchButtonId = 'select-table-search-button-' + index;
|
||||
|
||||
$.extend(this.config, {
|
||||
selectTableSearchFormId: selectTableSearchFormId,
|
||||
selectTableSearchButtonId: selectTableSearchButtonId
|
||||
});
|
||||
return [
|
||||
'<div class="chosen-window">',
|
||||
'<script type="text/html" id="' + selectTableSearchFormId + '">',
|
||||
'<form class="layui-form layui-row">',
|
||||
'<div class="layui-inline">',
|
||||
'<div class="layui-input-inline">',
|
||||
'<input type="text" name="' + searchName + '" placeholder="请输入要搜索的内容" class="layui-input">',
|
||||
'</div>',
|
||||
'</div>',
|
||||
'<div class="layui-inline"><button class="layui-btn" lay-submit lay-filter="' + selectTableSearchButtonId + '">搜索</button></div>',
|
||||
'</form>',
|
||||
'</script>',
|
||||
'<table class="layui-hide" id="' + tableId + '" lay-filter="' + tableId + '"></table>',
|
||||
'</div>',
|
||||
].join('');
|
||||
}
|
||||
|
||||
//初始化表格
|
||||
Class.prototype.iniSelectTable = function () {
|
||||
let that = this,
|
||||
config = that.config,
|
||||
tableId = that.tableId,
|
||||
selectTable = config.selectTable,
|
||||
tableNeedConfig = {
|
||||
id: tableId,
|
||||
elem: '#' + tableId,
|
||||
toolbar: '#' + config.selectTableSearchFormId,
|
||||
defaultToolbar: ['filter'],
|
||||
done: function (res) {
|
||||
that.iniDefaultSelected(res.data)
|
||||
}
|
||||
},
|
||||
tableConfig = $.extend({}, selectTable, tableNeedConfig);
|
||||
table.render(tableConfig);
|
||||
};
|
||||
|
||||
//处理默认选中值的问题
|
||||
Class.prototype.iniDefaultSelected = function (tableData = []) {
|
||||
let that = this,
|
||||
tableId = that.tableId,
|
||||
config = that.config,
|
||||
selectType = config.selectType,
|
||||
bindInput = config.bindInput,
|
||||
bindInputValue = $(bindInput).val() ?? '',
|
||||
bindInputDisplayValue = $(bindInput)[0].dataset.displayValue ?? '';
|
||||
|
||||
config.selectedIds = bindInputValue.split("$").filter(item => item !== '');
|
||||
config.selectedDisplayValues = bindInputDisplayValue.split("$").filter(item => item !== '');
|
||||
|
||||
if (tableData.length === 0) {
|
||||
that.setSelectedDisplayAndValue();
|
||||
return;
|
||||
}
|
||||
|
||||
table.setRowChecked(tableId, { index: 'all', checked: false });
|
||||
let selectedIds = config.selectedIds;
|
||||
if (selectedIds.length > 0) {
|
||||
let tableIdData = tableData.map(item => item[config.selectTable.uniqueId].toString());
|
||||
if (selectType === 'radio' && selectedIds.length === 1) {
|
||||
let selectedItemIndex = tableIdData.indexOf(selectedIds[0].toString());
|
||||
if (selectedItemIndex >= 0) {
|
||||
table.setRowChecked(tableId, { type: selectType, index: selectedItemIndex, checked: true })
|
||||
}
|
||||
} else {
|
||||
tableIdData.forEach(function (item, itemIndex) {
|
||||
table.setRowChecked(tableId, {
|
||||
type: selectType,
|
||||
index: itemIndex,
|
||||
checked: selectedIds.includes(item)
|
||||
});
|
||||
});
|
||||
}
|
||||
}
|
||||
that.setSelectedDisplayAndValue();
|
||||
}
|
||||
|
||||
//处理选择框事件
|
||||
Class.prototype.bindSelectBoxEventToSelectTable = function () {
|
||||
let that = this,
|
||||
options = that.config,
|
||||
selectType = options.selectType,
|
||||
uniqueId = options.selectTable.uniqueId,
|
||||
displayField = options.selectTable.displayField,
|
||||
tableId = that.tableId;
|
||||
|
||||
if (selectType === 'radio') { //单选
|
||||
table.on('radio(' + tableId + ')', function (obj) {
|
||||
dealRadioSelectedData(obj.checked, obj.data);
|
||||
});
|
||||
} else { //复选框
|
||||
table.on('checkbox(' + tableId + ')', function (obj) {
|
||||
let eventType = obj.type,
|
||||
checked = obj.checked;
|
||||
|
||||
if (eventType === 'all') {
|
||||
table.getData(tableId).forEach(function (rowData) {
|
||||
dealCheckboxSelectedData(checked, rowData);
|
||||
});
|
||||
}
|
||||
|
||||
if (eventType === 'one') {
|
||||
dealCheckboxSelectedData(checked, obj.data);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function dealRadioSelectedData(checked, rowData) {
|
||||
let rowId = rowData[uniqueId].toString();
|
||||
that.config.selectedIds = [];
|
||||
that.config.selectedDisplayValues = [];
|
||||
if (checked) {
|
||||
that.config.selectedIds.push(rowId);
|
||||
that.config.selectedDisplayValues.push(rowData[displayField]);
|
||||
}
|
||||
that.setSelectedDisplayAndValue();
|
||||
}
|
||||
|
||||
function dealCheckboxSelectedData(checked, rowData) {
|
||||
let rowId = rowData[uniqueId].toString();
|
||||
//处理选中
|
||||
if (checked && !that.config.selectedIds.includes(rowId)) {
|
||||
that.config.selectedIds.push(rowId);
|
||||
that.config.selectedDisplayValues.push(rowData[displayField]);
|
||||
}
|
||||
|
||||
//处理未选中
|
||||
if (!checked) {
|
||||
let cancelIndex = that.config.selectedIds.indexOf(rowId);
|
||||
if (rowId > -1) {
|
||||
that.config.selectedIds.splice(cancelIndex, 1);
|
||||
that.config.selectedDisplayValues.splice(cancelIndex, 1);
|
||||
}
|
||||
}
|
||||
that.setSelectedDisplayAndValue();
|
||||
}
|
||||
}
|
||||
|
||||
//绑定行点击事件到选择表中
|
||||
Class.prototype.bindRowCheckToSelectTable = function () {
|
||||
let that = this,
|
||||
tableId = that.tableId,
|
||||
options = that.config,
|
||||
selectType = options.selectType,
|
||||
uniqueId = options.selectTable.uniqueId,
|
||||
displayField = options.selectTable.displayField;
|
||||
|
||||
table.on('row(' + tableId + ')', function (obj) {
|
||||
let rowId = obj.data[uniqueId].toString(),
|
||||
checked;
|
||||
|
||||
if (!that.config.selectedIds.includes(rowId)) {
|
||||
if (selectType === 'radio') {
|
||||
that.config.selectedIds = [];
|
||||
that.config.selectedDisplayValues = [];
|
||||
}
|
||||
that.config.selectedIds.push(rowId);
|
||||
that.config.selectedDisplayValues.push(obj.data[displayField]);
|
||||
checked = true;
|
||||
} else {
|
||||
let cancelSelectedIdIndex = that.config.selectedIds.indexOf(rowId);
|
||||
that.config.selectedIds.splice(cancelSelectedIdIndex, 1);
|
||||
that.config.selectedDisplayValues.splice(cancelSelectedIdIndex, 1);
|
||||
checked = false;
|
||||
}
|
||||
obj.setRowChecked({
|
||||
type: selectType,
|
||||
checked: checked
|
||||
});
|
||||
//加入选中事件
|
||||
let onSelected = options.onSelected;
|
||||
if (checked && $.isFunction(onSelected)) {
|
||||
onSelected(new Array(obj.data[options.selectTable.uniqueId]));
|
||||
}
|
||||
that.setSelectedDisplayAndValue();
|
||||
});
|
||||
};
|
||||
|
||||
//绑定表格的搜索事件
|
||||
Class.prototype.bindSearchToSelectTable = function () {
|
||||
let tableId = this.tableId,
|
||||
selectTableSearchButtonId = this.config.selectTableSearchButtonId;
|
||||
form.on('submit(' + selectTableSearchButtonId + ')', function (data) {
|
||||
table.reloadData(tableId, { page: { curr: 1 }, where: data.field });
|
||||
return false;
|
||||
});
|
||||
}
|
||||
|
||||
//设置显示值和实际存储值
|
||||
Class.prototype.setSelectedDisplayAndValue = function () {
|
||||
let that = this,
|
||||
tableId = that.tableId,
|
||||
options = that.config,
|
||||
elem = options.elem,
|
||||
bindInput = options.bindInput,
|
||||
selectedIds = options?.selectedIds ?? [],
|
||||
selectDisplayValues = options.selectedDisplayValues,
|
||||
emptyMsg = options.emptyMsg;
|
||||
|
||||
elem.find("span").remove();
|
||||
if (selectedIds.length > 0 && selectedIds.length === selectDisplayValues.length) {
|
||||
selectedIds.forEach((item, itemIndex) => {
|
||||
let selectedDisplayValue = selectDisplayValues[itemIndex],
|
||||
closeObject = $('<span style="margin-left:5px;color:#fff" data-selected-id="' + item + '">×<span>'),
|
||||
displayHtml = [
|
||||
'<span class="layui-badge layui-bg-green">' + selectedDisplayValue,
|
||||
'</span>',
|
||||
].join(''),
|
||||
displayObject = $(displayHtml).append(closeObject);
|
||||
|
||||
displayObject.attr({
|
||||
"style": "margin-left:5px;font-size:14px;padding:4px 6px"
|
||||
});
|
||||
|
||||
//绑定鼠标事件
|
||||
closeObject.on('mouseenter mouseleave', function (event) {
|
||||
let optType = event.type,
|
||||
fontColor = optType === 'mouseleave' ? 'white' : 'red';
|
||||
$(this).attr({ "style": "color:" + fontColor + ";margin-left:5px;cursor:pointer" });
|
||||
});
|
||||
|
||||
closeObject.on('click', function () {
|
||||
let _this = this,
|
||||
tableIdData = table.getData(tableId).map(item => item[options.selectTable.uniqueId]),
|
||||
selectedId = _this.dataset.selectedId,
|
||||
cancelSelectedIdIndex = that.config.selectedIds.indexOf(selectedId);
|
||||
that.config.selectedIds.splice(cancelSelectedIdIndex, 1);
|
||||
that.config.selectedDisplayValues.splice(cancelSelectedIdIndex, 1);
|
||||
if (tableIdData.includes(selectedId)) {
|
||||
if (options.selectType === 'radio') {
|
||||
table.setRowChecked(tableId, {
|
||||
type: 'radio',
|
||||
index: 'all',
|
||||
checked: false
|
||||
});
|
||||
} else {
|
||||
table.setRowChecked(tableId, {
|
||||
type: options.selectType,
|
||||
index: tableIdData.indexOf(selectedId),
|
||||
checked: false
|
||||
});
|
||||
}
|
||||
}
|
||||
that.setSelectedDisplayAndValue();
|
||||
});
|
||||
elem.append(displayObject);
|
||||
});
|
||||
} else {
|
||||
elem.append('<span class="layui-font-gray layui-font-14" style="margin-left:5px;">' + emptyMsg + '</span>');
|
||||
}
|
||||
$(bindInput).val(selectedIds.join("$"));
|
||||
$(bindInput)[0].dataset.displayValue = selectDisplayValues.join("$");
|
||||
}
|
||||
|
||||
//记录所有实例
|
||||
thisModule.that = {}; //记录所有实例对象
|
||||
|
||||
//获取当前实例对象
|
||||
thisModule.getThis = function (id) {
|
||||
let that = thisModule.that[id];
|
||||
if (!that) {
|
||||
hint.error(id ? (moduleName + ' instance with ID \'' + id + '\' not found') : 'ID argument required');
|
||||
}
|
||||
|
||||
return that;
|
||||
}
|
||||
|
||||
//重载实例
|
||||
dropdownTable.reloadSelectTable = function (id, selectTableConfig) {
|
||||
let that = thisModule.getThis(id);
|
||||
that.reloadSelectTable(selectTableConfig);
|
||||
return thisModule.call(that);
|
||||
}
|
||||
|
||||
//请空已选择
|
||||
dropdownTable.clearSelected = function (id) {
|
||||
let that = thisModule.getThis(id);
|
||||
that.clearSelected();
|
||||
}
|
||||
|
||||
//核心入口
|
||||
dropdownTable.render = function (options) {
|
||||
let inst = new Class(options);
|
||||
if (dropdownTable.index === 1) {
|
||||
console.log("欢迎使用Hg科技的dropdownTable组件，version:" + dropdownTable.version + ",期待您的建议！");
|
||||
}
|
||||
|
||||
inst.iniDefaultSelected();
|
||||
return thisModule.call(inst);
|
||||
}
|
||||
|
||||
exports(moduleName, dropdownTable);
|
||||
});
|
||||
Reference in New Issue
Block a user