tav-ui
Version:
340 lines (335 loc) • 10.7 kB
JavaScript
;
Object.defineProperty(exports, '__esModule', { value: true });
var vue = require('vue');
var lodashEs = require('lodash-es');
var useTimeout = require('../../../../hooks/core/useTimeout2.js');
var is = require('../../../../utils/is2.js');
var uuid = require('../../../../utils/uuid2.js');
var _const = require('../const2.js');
var useTableFullHeight = require('./useTableFullHeight2.js');
function useDataSource(tableElRef, propsRef, {
getPaginationInfo,
setPagination,
setLoading,
getFieldsValue,
clearSelectedRowKeys,
tableData
}, emit, filterRef) {
const searchState = vue.reactive({
sortInfo: {},
filterInfo: {}
});
const dataSourceRef = vue.ref([]);
const rawDataSourceRef = vue.ref({});
vue.watchEffect(() => {
tableData.value = vue.unref(dataSourceRef);
});
vue.watch(() => vue.unref(propsRef).dataSource, () => {
const { dataSource, api } = vue.unref(propsRef);
!api && dataSource && (dataSourceRef.value = dataSource);
}, {
immediate: true
});
function handleTableChange(pagination, filters, sorter) {
const { clearSelectOnPageChange, paginationControl, sortFn, filterFn } = vue.unref(propsRef);
if (clearSelectOnPageChange) {
clearSelectedRowKeys();
}
const params = {};
if (pagination && paginationControl === "backend") {
params.searchInfo = {
model: {
page: pagination.current,
limit: pagination.pageSize
}
};
}
setPagination(pagination);
if (sorter && is.isFunction(sortFn)) {
const sortInfo = sortFn(sorter);
searchState.sortInfo = sortInfo;
params.sortInfo = sortInfo;
params.searchInfo = {
model: {
page: pagination.current,
limit: pagination.pageSize,
...sortInfo
}
};
}
if (filters && is.isFunction(filterFn)) {
const filterInfo = filterFn(filters);
searchState.filterInfo = filterInfo;
params.filterInfo = filterInfo;
params.searchInfo = {
filter: {
...Object.keys(filterInfo).reduce((result, k) => {
result[k] = filterInfo[k].join(",");
return result;
}, {})
},
model: {
page: pagination.current,
limit: pagination.pageSize
}
};
}
fetch(params);
}
function setTableKey(items) {
if (!items || !Array.isArray(items))
return;
items.forEach((item) => {
if (!item[_const.ROW_KEY]) {
item[_const.ROW_KEY] = uuid.buildUUID();
}
if (item.children && item.children.length) {
setTableKey(item.children);
}
});
}
const getAutoCreateKey = vue.computed(() => {
return vue.unref(propsRef).autoCreateKey && !vue.unref(propsRef).rowKey;
});
const getRowKey = vue.computed(() => {
const { rowKey } = vue.unref(propsRef);
return vue.unref(getAutoCreateKey) ? _const.ROW_KEY : rowKey;
});
const getDataSourceRef = vue.computed(() => {
const dataSource = vue.unref(dataSourceRef);
if (!dataSource || dataSource.length === 0) {
return vue.unref(dataSourceRef);
}
if (vue.unref(getAutoCreateKey)) {
const firstItem = dataSource[0];
const lastItem = dataSource[dataSource.length - 1];
if (firstItem && lastItem) {
if (!firstItem[_const.ROW_KEY] || !lastItem[_const.ROW_KEY]) {
const data = lodashEs.cloneDeep(vue.unref(dataSourceRef));
data.forEach((item) => {
if (!item[_const.ROW_KEY]) {
item[_const.ROW_KEY] = uuid.buildUUID();
}
if (item.children && item.children.length) {
setTableKey(item.children);
}
});
dataSourceRef.value = data;
}
}
}
return vue.unref(dataSourceRef);
});
async function updateTableData(index, key, value) {
const record = dataSourceRef.value[index];
if (record) {
dataSourceRef.value[index][key] = value;
}
return dataSourceRef.value[index];
}
function updateTableDataRecord(rowKey, record) {
const row = findTableDataRecord(rowKey);
if (row) {
for (const field in row) {
if (Reflect.has(record, field))
row[field] = record[field];
}
return row;
}
}
function deleteTableDataRecord(rowKey) {
if (!dataSourceRef.value || dataSourceRef.value.length == 0)
return;
const rowKeyName = vue.unref(getRowKey);
if (!rowKeyName)
return;
const rowKeys = !Array.isArray(rowKey) ? [rowKey] : rowKey;
for (const key of rowKeys) {
let index = dataSourceRef.value.findIndex((row) => {
let targetKeyName;
if (typeof rowKeyName === "function") {
targetKeyName = rowKeyName(row);
} else {
targetKeyName = rowKeyName;
}
return row[targetKeyName] === key;
});
if (index >= 0) {
dataSourceRef.value.splice(index, 1);
}
index = vue.unref(propsRef).dataSource?.findIndex((row) => {
let targetKeyName;
if (typeof rowKeyName === "function") {
targetKeyName = rowKeyName(row);
} else {
targetKeyName = rowKeyName;
}
return row[targetKeyName] === key;
});
if (typeof index !== "undefined" && index !== -1)
vue.unref(propsRef).dataSource?.splice(index, 1);
}
setPagination({
total: vue.unref(propsRef).dataSource?.length
});
}
function insertTableDataRecord(record, index) {
index = index ?? dataSourceRef.value?.length;
vue.unref(dataSourceRef).splice(index, 0, record);
return vue.unref(dataSourceRef);
}
function findTableDataRecord(rowKey) {
if (!dataSourceRef.value || dataSourceRef.value.length == 0)
return;
const rowKeyName = vue.unref(getRowKey);
if (!rowKeyName)
return;
const { childrenColumnName = "children" } = vue.unref(propsRef);
const findRow = (array) => {
let ret;
array.some(function iter(r) {
if (typeof rowKeyName === "function") {
if (rowKeyName(r) === rowKey) {
ret = r;
return true;
}
} else {
if (Reflect.has(r, rowKeyName) && r[rowKeyName] === rowKey) {
ret = r;
return true;
}
}
return r[childrenColumnName] && r[childrenColumnName].some(iter);
});
return ret;
};
return findRow(dataSourceRef.value);
}
async function fetch(opt) {
const {
api,
searchInfo,
defSort,
fetchSetting,
beforeFetch,
afterFetch,
useSearchForm,
pagination,
paginationControl
} = vue.unref(propsRef);
if (!api || !is.isFunction(api))
return;
if (opt?.clearSelect)
clearSelectedRowKeys();
await vue.nextTick();
const tableFilterSearchParams = filterRef.value ? JSON.parse(filterRef.value.$el.dataset.filterParams) : {};
const tableFilterSearchInfo = {
filter: tableFilterSearchParams
};
try {
setLoading(true);
const { pageField, sizeField, listField, totalField } = Object.assign({}, _const.FETCH_SETTING, fetchSetting);
let pageParams = {};
const { current = 1, pageSize = _const.PAGE_SIZE } = vue.unref(getPaginationInfo);
if (is.isBoolean(pagination) && !pagination || is.isBoolean(getPaginationInfo)) {
pageParams = {};
} else {
pageParams[pageField] = opt && opt.page || current;
pageParams[sizeField] = pageSize;
pageParams["model"] = {
page: opt && opt.page || current,
limit: pageSize
};
}
const { sortInfo = {}, filterInfo } = searchState;
pageParams.model = { ...pageParams.model, ...sortInfo };
let params = lodashEs.merge(pageParams, useSearchForm ? getFieldsValue() : {}, searchInfo, tableFilterSearchInfo, opt?.searchInfo ?? {}, defSort, sortInfo, filterInfo, opt?.sortInfo ?? {}, opt?.filterInfo ?? {});
if (beforeFetch && is.isFunction(beforeFetch)) {
params = await beforeFetch(params) || params;
}
console.log("hijack table api \u{1F602}");
const { data: res } = await api(params);
rawDataSourceRef.value = res;
const isArrayResult = Array.isArray(res);
let resultItems = isArrayResult ? res : lodashEs.get(res, listField);
const resultTotal = isArrayResult ? 0 : lodashEs.get(res, totalField);
if (afterFetch && is.isFunction(afterFetch)) {
resultItems = await afterFetch(resultItems) || resultItems;
}
dataSourceRef.value = resultItems;
setPagination({
total: resultTotal || 0
});
if (opt && (opt.page || opt.searchInfo?.model?.page)) {
setPagination({
current: opt.page || opt.searchInfo?.model?.page || 1
});
}
if (paginationControl === "backend" && !isArrayResult) {
setPagination({
pageSize: rawDataSourceRef.value[sizeField] || pageSize
});
vue.nextTick(() => {
const els = tableElRef.value?.$el?.querySelectorAll(".ant-table-pagination .ant-pagination-item");
els?.forEach((el) => {
const page = Number(el.title);
if (rawDataSourceRef.value.navigatePageNumbers && rawDataSourceRef.value.navigatePageNumbers.includes(page)) {
el.style.display = "inline-block";
} else {
el.style.display = "none";
}
});
});
}
useTableFullHeight.useTableFullHeight(propsRef, tableElRef);
emit("fetch-success", {
items: vue.unref(resultItems),
total: resultTotal
});
return resultItems;
} catch (error) {
emit("fetch-error", error);
dataSourceRef.value = [];
setPagination({
total: 0
});
} finally {
setLoading(false);
}
}
function setTableData(values) {
dataSourceRef.value = values;
}
function getDataSource() {
return getDataSourceRef.value;
}
function getRawDataSource() {
return rawDataSourceRef.value;
}
async function reload(opt) {
return await fetch(opt);
}
vue.onMounted(() => {
useTimeout.useTimeoutFn(() => {
vue.unref(propsRef).immediate && fetch();
}, 16);
});
return {
getDataSourceRef,
getDataSource,
getRawDataSource,
getRowKey,
setTableData,
getAutoCreateKey,
fetch,
reload,
updateTableData,
updateTableDataRecord,
deleteTableDataRecord,
insertTableDataRecord,
findTableDataRecord,
handleTableChange
};
}
exports.useDataSource = useDataSource;
//# sourceMappingURL=useDataSource2.js.map