@cloudbase/weda-ui 0.2.17 → 0.2.21-alpha.2

package/dist/web/components/listView/index.js

@@ -0,0 +1,659 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import React, { useState, useEffect, useRef, useCallback, useMemo, } from 'react';
+import { callDataSource } from '../../utils/tcb';
+import { isInIde, alertErrorMessage, usePlatform, getParseValue, textToString, } from '../../utils/platform';
+import classNames from '../../utils/classnames';
+import isequal from 'lodash.isequal';
+import './style';
+import { isNil } from '../../utils/lodash';
+import { getUuid } from '../../utils/tool';
+import EmptyContent from '../statusContent';
+import { useLoopRenderDetect } from '../common/use-loop-render-detect';
+import { getModelParams } from '../../utils/getModelParams';
+import { WdCompError } from '../../utils/error';
+import { useSetWidgetApi } from '../../utils/widget-api/use-set-widget-api';
+import { useQueryParams } from './useQueryParams';
+const BLOCK_NAME = 'weda-list-view';
+const LISTVIEW_MESSAGE = {
+    methods_no_support: '当前组件绑定了APIs，暂不支持进行数据删除',
+    deleteOne_param_error: '传入的"数据标识"参数格式错误',
+    deleteOne_success: '删除数据成功',
+    deleteOne_fail: '删除数据失败',
+    refresh_success: '刷新数据成功',
+    refresh_fail: '刷新数据失败',
+};
+const getIdeMockData = (length = 3) => Array.from({ length }).map(() => Object.create(null));
+const getStringValue = (v) => (typeof v === 'string' ? v : '');
+const defaultCloudbase = { callDataSource, isInIde };
+const defaultBeforeDataChange = (v) => v;
+const getQueryParams = (isV2protocol, params) => {
+    if (isV2protocol) {
+        params.getCount = true;
+        params.pageNumber = params.pageNo;
+        params.compatibleWithV1 = true;
+    }
+    return params;
+};
+/**
+ * 数据容器-列表视图
+ */
+export default React.forwardRef(function ListView(props, ref) {
+    var _a, _b, _c;
+    const { dataSourceType, bindConnectMetadata, connectorMethod, connectorParams: rawConnectorParams, datasource, dataSourceData: rawDataSourceData, // 表达式: 值
+    template, enableTotal, // 表达式: 启用动态分页
+    total: rawTotal, // 表达式: 总页数
+    pageSize = 5, pageIndex: _pageNo = 1, pagination, events, className, children, isRecords = true, //是否展示回调records字段
+    isSetStatus: rawIsSetStatus = false, //是否开启异常状态
+    isSetLoading: rawIsSetLoading = true, // 是否开启加载状态
+    loading = false, // 数据加载状态，仅表达式生效
+    emptyText, //空状态时的文案
+    loadCompletedText = '', // 加载到底提示
+    appCloud = defaultCloudbase, beforeDataChange = defaultBeforeDataChange, refType = 'listView', loadButtonText, selectFieldType = 'main', // 查询字段范围类型
+    ...rest } = props;
+    const platform = usePlatform();
+    const isH5 = platform === 'h5';
+    const isSetStatus = dataSourceType !== 'expression' ? rawIsSetStatus : false;
+    const isSetLoading = dataSourceType !== 'expression' ? rawIsSetLoading : true;
+    const connectorParams = getParseValue(rawConnectorParams);
+    const dataSourceData = getParseValue(rawDataSourceData);
+    const methodName = getStringValue(dataSourceType === 'data-model'
+        ? ((_a = datasource === null || datasource === void 0 ? void 0 : datasource.extra) === null || _a === void 0 ? void 0 : _a.methodName) || 'wedaGetRecords'
+        : connectorMethod === null || connectorMethod === void 0 ? void 0 : connectorMethod.name);
+    const isV2protocol = methodName === 'wedaGetRecordsV2';
+    const modelParams = getModelParams({
+        ...props,
+        supportManyRelated: isV2protocol,
+    }); // 包括 where 和 order
+    const dataSourceName = getStringValue(dataSourceType === 'data-model'
+        ? datasource === null || datasource === void 0 ? void 0 : datasource.name
+        : (_b = bindConnectMetadata === null || bindConnectMetadata === void 0 ? void 0 : bindConnectMetadata.datasource) === null || _b === void 0 ? void 0 : _b.name);
+    useLoopRenderDetect({ limit: 600 });
+    const [entry, setEntry] = useState(null); // 触底的observer对象
+    const [_status, setStatus] = useState(''); // 查询状态
+    const status = useMemo(() => {
+        let s = _status;
+        if (dataSourceType === 'expression' && loading) {
+            s = 'loading';
+        }
+        return s;
+    }, [dataSourceType, loading, _status]); // 表达式强制使用 loading 展示加载
+    const paramRef = useRef({
+        dataSourceName,
+        methodName,
+        params: { pageNo: _pageNo, pageSize, connectorParams, modelParams },
+        pagination,
+    }); // 最新请求参数
+    const exprRef = useRef({ total: 0, dataSourceData: [], enableTotal }); // 对比表达式变化
+    const dataRef = useRef({ total: 0, records: [] }); // 最新数据列表
+    const observeRef = useRef(null); // 当前监听对象
+    const delayRef = useRef({
+        version: null,
+        initTimer: null,
+        statusTimer: null,
+        eventTimer: null,
+        exprTimer: null,
+        initExpr: false,
+    }); // 请求防抖、异步时使用最后一次请求
+    const isIdeMockData = !(dataSourceName && methodName) && ((_c = appCloud === null || appCloud === void 0 ? void 0 : appCloud.isInIde) === null || _c === void 0 ? void 0 : _c.call(appCloud)); // 在ide环境且未绑定数据源时，存在mock数据逻辑
+    const shouldBottomLoad = pagination === 'bottomLoad' &&
+        (entry === null || entry === void 0 ? void 0 : entry.isIntersecting) &&
+        ['', 'success'].includes(status); // 能否触底加载
+    // 返回的错误信息
+    const [err, setErr] = useState({
+        code: '',
+        message: '',
+        requestId: '',
+    });
+    const isReadyToGetAuthField = dataSourceType === 'data-model' && isV2protocol && !!dataSourceName;
+    const { queryParams, fieldsLoading } = useQueryParams({
+        dataSourceName,
+        isReadyToGetAuthField,
+        selectFieldType,
+        modelParams,
+    });
+    // 组件卸载时触发
+    useEffect(() => {
+        clearContext();
+        return () => {
+            var _a;
+            (_a = observeRef.current) === null || _a === void 0 ? void 0 : _a.disconnect();
+            clearContext();
+        };
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, []);
+    // 监听更改数据源时，清空当前列表
+    useEffect(() => {
+        clearContext();
+    }, [methodName, dataSourceName, dataSourceType]);
+    // props 基本类型监听，需重新分页；处于 ide 且未绑定数据源时返回mock数据
+    useEffect(() => {
+        var _a, _b;
+        clearDelay();
+        if (!isIdeMockData) {
+            // authFields 加载中，不触发请求
+            if (isV2protocol && fieldsLoading) {
+                return;
+            }
+            fetchData({
+                dataSourceName,
+                methodName,
+                params: {
+                    ...(_a = paramRef.current) === null || _a === void 0 ? void 0 : _a.params,
+                    pageNo: _pageNo,
+                    pageSize,
+                    modelParams: queryParams,
+                },
+                pagination,
+            }, {
+                isInitData: true,
+            });
+        }
+        else {
+            (_b = events === null || events === void 0 ? void 0 : events.onDataChange) === null || _b === void 0 ? void 0 : _b.call(events, {
+                data: beforeDataChange(getIdeMockData(pageSize)),
+                state: getContextState(),
+            });
+        }
+    }, [methodName, dataSourceName, pageSize, _pageNo, pagination, dataSourceType, isV2protocol, isIdeMockData, fieldsLoading]);
+    // props 对象类型监听，需重新分页
+    useEffect(() => {
+        var _a, _b, _c, _d;
+        if (dataSourceType === 'data-model') {
+            if (!isequal((_b = (_a = paramRef.current) === null || _a === void 0 ? void 0 : _a.params) === null || _b === void 0 ? void 0 : _b.modelParams, queryParams)) {
+                clearDelay();
+                fetchData({
+                    params: { pageNo: _pageNo, modelParams: queryParams },
+                }, { isInitData: true });
+            }
+        }
+        else if (['custom-connector', 'connector'].includes(dataSourceType)) {
+            if (!isequal((_d = (_c = paramRef.current) === null || _c === void 0 ? void 0 : _c.params) === null || _d === void 0 ? void 0 : _d.connectorParams, connectorParams)) {
+                clearDelay();
+                fetchData({
+                    params: { pageNo: 1, connectorParams },
+                }, { isInitData: true });
+            }
+        }
+        else {
+            const expr = { dataSourceData, total: rawTotal, enableTotal };
+            if (!isequal(exprRef.current, expr)) {
+                exprRef.current = expr;
+                setExpression();
+            }
+        }
+    });
+    // 监听触底加载事件
+    useEffect(() => {
+        var _a, _b;
+        if (shouldBottomLoad && hasNextPage()) {
+            fetchData({
+                params: { pageNo: (((_b = (_a = paramRef.current) === null || _a === void 0 ? void 0 : _a.params) === null || _b === void 0 ? void 0 : _b.pageNo) || 1) + 1 },
+            });
+        }
+    }, [shouldBottomLoad]);
+    // 清除延迟状态
+    const clearDelay = () => {
+        clearTimeout(delayRef.current.statusTimer);
+        clearTimeout(delayRef.current.eventTimer);
+        clearTimeout(delayRef.current.exprTimer);
+    };
+    // 清除上下文状态
+    const clearContext = () => {
+        var _a;
+        (_a = events === null || events === void 0 ? void 0 : events.onDataChange) === null || _a === void 0 ? void 0 : _a.call(events, { data: beforeDataChange([]), state: {} });
+    };
+    // 触底监控对象
+    const nodeRefCallback = useCallback((node) => {
+        var _a;
+        if (node) {
+            (_a = observeRef.current) === null || _a === void 0 ? void 0 : _a.disconnect();
+            observeRef.current = new IntersectionObserver((entries) => {
+                setEntry(entries === null || entries === void 0 ? void 0 : entries[0]);
+            });
+            observeRef.current.observe(node);
+        }
+    }, []);
+    // 能否点击下一页
+    const hasNextPage = () => {
+        const { pageNo = 1, pageSize = 5 } = paramRef.current.params || {};
+        const { total = 0 } = dataRef.current || {};
+        return pageNo * pageSize < total;
+    };
+    // 循环调用接口获取当前已加载的数据
+    const fetchDataLoop = useCallback(async (param = {}, count = 0) => {
+        let [records, total] = [[], 0];
+        try {
+            const { dataSourceName, methodName, params } = param || {};
+            const MAX_PAGESIZE = Math.min(1000, count);
+            const loopLength = Math.ceil(count / MAX_PAGESIZE);
+            for (let i = 1; i < loopLength + 1; i++) {
+                const tcbParams = { ...params, pageNo: i, pageSize: MAX_PAGESIZE };
+                const temp = await (appCloud === null || appCloud === void 0 ? void 0 : appCloud.callDataSource({
+                    dataSourceName,
+                    methodName,
+                    params: getQueryParams(isV2protocol, tcbParams),
+                    swr: param.swr,
+                }, true));
+                records = records.concat(temp.records || []);
+                total = temp.total || 0;
+            }
+        }
+        catch (e) {
+            console.error('fetchDataLoop: ', e);
+        }
+        return { records: records.slice(0, count), total };
+    }, [appCloud, isV2protocol]);
+    // 加载成功(包含为空)事件
+    const onSuccessCb = useCallback(({ records, total, isTriggerEmpty, datasource }) => {
+        var _a, _b;
+        (_a = events === null || events === void 0 ? void 0 : events.onDataChange) === null || _a === void 0 ? void 0 : _a.call(events, {
+            data: beforeDataChange(records),
+            state: getContextState(),
+        });
+        clearTimeout(delayRef.current.exprTimer);
+        if (total === 0 && isTriggerEmpty) {
+            setStatus('empty');
+            (_b = events === null || events === void 0 ? void 0 : events.queryEmpty) === null || _b === void 0 ? void 0 : _b.call(events, {
+                datasource,
+                data: beforeDataChange([]),
+            });
+        }
+        else {
+            const statusCb = () => {
+                setStatus('success');
+            };
+            if (pagination === 'bottomLoad') {
+                if (delayRef.current.statusTimer) {
+                    clearTimeout(delayRef.current.statusTimer);
+                    delayRef.current.statusTimer = null;
+                }
+                delayRef.current.statusTimer = window.setTimeout(statusCb, pagination === 'bottomLoad' && dataSourceType === 'expression'
+                    ? 3000
+                    : 150);
+            }
+            else {
+                statusCb();
+            }
+        }
+        const successCb = () => {
+            var _a;
+            (_a = events === null || events === void 0 ? void 0 : events.querySuccess) === null || _a === void 0 ? void 0 : _a.call(events, {
+                datasource,
+                data: beforeDataChange(records),
+            });
+        };
+        if (pagination === 'bottomLoad') {
+            if (delayRef.current.eventTimer) {
+                clearTimeout(delayRef.current.eventTimer);
+                delayRef.current.eventTimer = null;
+            }
+            delayRef.current.eventTimer = window.setTimeout(successCb, 200);
+        }
+        else {
+            successCb();
+        }
+    }, [beforeDataChange, events, pagination]);
+    // 加载失败事件
+    const onFailCb = useCallback((e) => {
+        var _a, _b, _c;
+        setStatus('fail');
+        const obj = {
+            code: (e === null || e === void 0 ? void 0 : e.code)
+                ? e === null || e === void 0 ? void 0 : e.code
+                : refType === 'dataView'
+                    ? 'WdDataView.QueryError'
+                    : 'WdListView.QueryError',
+            message: `${e === null || e === void 0 ? void 0 : e.message}`,
+            requestId: (_b = (_a = e === null || e === void 0 ? void 0 : e.original) === null || _a === void 0 ? void 0 : _a.original) === null || _b === void 0 ? void 0 : _b.requestId,
+        };
+        setErr(obj);
+        (_c = events === null || events === void 0 ? void 0 : events.queryFail) === null || _c === void 0 ? void 0 : _c.call(events, {
+            error: { ...obj, original: e === null || e === void 0 ? void 0 : e.original },
+        });
+    }, [events, refType]);
+    // 数据列表设置表达式: 区分前后端分页
+    const setExpression = useCallback(() => {
+        const { dataSourceData, total: _total, enableTotal } = exprRef.current;
+        let records = [];
+        let total = 0;
+        if (Array.isArray(dataSourceData)) {
+            if (enableTotal) {
+                records = dataSourceData;
+                total = !isNaN(parseInt(`${_total}`)) ? _total : 0;
+            }
+            else {
+                const { pagination, params: { pageSize, pageNo }, } = paramRef.current;
+                const count = pageSize * pageNo;
+                if (['loadMoreButton', 'bottomLoad'].includes(pagination)) {
+                    records = dataSourceData.slice(0, count);
+                }
+                else {
+                    records = dataSourceData.slice(pageSize * (pageNo - 1), count);
+                }
+                total = dataSourceData.length;
+            }
+        }
+        dataRef.current = { records, total };
+        delayRef.current.initExpr = true;
+        onSuccessCb({ records, total, isTriggerEmpty: isRecords });
+    }, [isRecords, onSuccessCb]);
+    /**
+     * 列表视图拉取数据
+     * 方法仅依赖入参和paramRef的参数
+     * isInitData: 是否初始化数据默认否, isFetchCurrent: 是否拉取当前所有数据默认否
+     */
+    const fetchData = useCallback(async (param, options) => {
+        var _a, _b, _c, _d;
+        const { isInitData, isFetchCurrent } = options || {};
+        // 合并参数并保存，useEffect 中需要比对
+        paramRef.current = {
+            ...paramRef.current,
+            ...param,
+            params: { ...paramRef.current.params, ...param === null || param === void 0 ? void 0 : param.params },
+        };
+        const { dataSourceName, methodName, params } = paramRef.current;
+        const { pageNo, pageSize, modelParams, connectorParams } = params || {};
+        // 不触发请求
+        if (!(dataSourceName && methodName) && dataSourceType !== 'expression')
+            return;
+        // select为空时，不触发请求
+        if (isV2protocol && !((_a = Object.keys(modelParams === null || modelParams === void 0 ? void 0 : modelParams.select)) === null || _a === void 0 ? void 0 : _a.length)) {
+            setStatus('loading');
+            return;
+        }
+        // 分页变化事件
+        (_b = events === null || events === void 0 ? void 0 : events.onPagingChange) === null || _b === void 0 ? void 0 : _b.call(events, { query: { pageNo, pageSize } });
+        setStatus('loading');
+        // 前端分页时，应该触发表达式
+        if (dataSourceType === 'expression') {
+            delayRef.current.exprTimer = window.setTimeout(() => setStatus(''), 3000);
+            !enableTotal && delayRef.current.initExpr && setExpression();
+            return;
+        }
+        const fetchVersion = (delayRef.current.version = getUuid());
+        let tcbParams = {};
+        let eventDataSource = {};
+        // tcb 分页参数
+        if (!isNil(pageNo) && !isNil(pageSize)) {
+            tcbParams['pageNo'] = pageNo;
+            tcbParams['pageSize'] = pageSize;
+        }
+        if (dataSourceType === 'data-model') {
+            tcbParams = Object.assign({}, tcbParams, modelParams);
+            eventDataSource = datasource;
+        }
+        else {
+            tcbParams = Object.assign({}, connectorParams, tcbParams);
+            eventDataSource = { ...bindConnectMetadata, ...connectorMethod };
+        }
+        // tcb 请求
+        let data = {};
+        try {
+            if (isFetchCurrent) {
+                data = await fetchDataLoop({ dataSourceName, methodName, params: tcbParams, swr: param.swr }, dataRef.current.records.length);
+            }
+            else {
+                data = await (appCloud === null || appCloud === void 0 ? void 0 : appCloud.callDataSource({
+                    dataSourceName,
+                    methodName,
+                    params: getQueryParams(isV2protocol, tcbParams),
+                    swr: param.swr,
+                }, true));
+            }
+            if (fetchVersion !== delayRef.current.version)
+                return;
+            isInitData && (dataRef.current = { total: 0, records: [] });
+            // 处理数据
+            const isDataViewApis = !isRecords && dataSourceType !== 'data-model';
+            const fetchRecords = [].concat(isDataViewApis ? data : (data === null || data === void 0 ? void 0 : data.records) || []);
+            const total = isDataViewApis ? 0 : Number(data === null || data === void 0 ? void 0 : data.total) || 0;
+            if (['loadMoreButton', 'bottomLoad'].includes(paramRef.current.pagination)) {
+                dataRef.current = {
+                    total,
+                    records: [...dataRef.current.records, ...fetchRecords],
+                };
+            }
+            else {
+                dataRef.current = { total, records: fetchRecords };
+            }
+            onSuccessCb({
+                records: dataRef.current.records,
+                total,
+                isTriggerEmpty: !isDataViewApis,
+                datasource: eventDataSource,
+            });
+        }
+        catch (e) {
+            onFailCb(e);
+            throw new WdCompError(`${e === null || e === void 0 ? void 0 : e.message}` || '', {
+                code: (e === null || e === void 0 ? void 0 : e.code)
+                    ? e === null || e === void 0 ? void 0 : e.code
+                    : refType === 'dataView'
+                        ? 'WdDataView.QueryError'
+                        : 'WdListView.QueryError',
+                requestId: (_d = (_c = e === null || e === void 0 ? void 0 : e.original) === null || _c === void 0 ? void 0 : _c.original) === null || _d === void 0 ? void 0 : _d.requestId,
+                original: e === null || e === void 0 ? void 0 : e.original,
+            });
+        }
+    }, [
+        appCloud,
+        bindConnectMetadata,
+        connectorMethod,
+        dataSourceType,
+        datasource,
+        fetchDataLoop,
+        refType,
+        isRecords,
+        onSuccessCb,
+        onFailCb,
+        events,
+        enableTotal,
+        setExpression,
+        isV2protocol,
+        fieldsLoading,
+    ]);
+    // 计算上下文对象数据
+    const getContextState = (state = {}) => {
+        var _a, _b;
+        const total = (_b = (_a = dataRef.current) === null || _a === void 0 ? void 0 : _a.total) !== null && _b !== void 0 ? _b : 0;
+        const { pageNo, pageSize } = paramRef.current.params;
+        return { total, pageNo, pageSize, ...state };
+    };
+    // 组件刷新方法，重新初始化
+    const methodRefreshFromStart = useCallback(async () => {
+        try {
+            clearDelay();
+            await fetchData({ params: { pageNo: 1 }, swr: { forceClear: true } }, { isInitData: true });
+        }
+        catch (e) {
+            alertErrorMessage({ message: LISTVIEW_MESSAGE.refresh_fail });
+            throw e;
+        }
+    }, [fetchData]);
+    /**
+     * 组件刷新当前方法，保持当前已加载的数据列表状态
+     */
+    const methodRefreshKeepPage = useCallback(async () => {
+        try {
+            clearDelay();
+            const { pageNo, pageSize } = paramRef.current.params;
+            const { total } = dataRef.current;
+            if (pagination === 'pagination') {
+                const pageNoRaw = (pageNo - 1) * pageSize + 1 === total ? pageNo - 1 : pageNo;
+                await fetchData({ params: { pageNo: pageNoRaw }, swr: { forceClear: true } }, { isInitData: true });
+            }
+            else if (['loadMoreButton', 'bottomLoad'].includes(pagination)) {
+                await fetchData({ swr: { forceClear: true } }, { isFetchCurrent: true, isInitData: true });
+            }
+            else {
+                await methodRefreshFromStart();
+            }
+        }
+        catch (e) {
+            alertErrorMessage({ message: LISTVIEW_MESSAGE.refresh_fail });
+            throw e;
+        }
+    }, [fetchData, methodRefreshFromStart, pagination]);
+    /**
+     * 组件刷新方法，通过类别区分
+     */
+    const methodRefresh = useCallback(async (params) => {
+        if (typeof params === 'object' && (params === null || params === void 0 ? void 0 : params.type) === 'refreshKeepPage') {
+            await methodRefreshKeepPage();
+        }
+        else {
+            await methodRefreshFromStart();
+        }
+    }, [methodRefreshFromStart, methodRefreshKeepPage]);
+    /**
+     * 组件删除单条方法
+     */
+    const methodDeleteOne = useCallback(async (params) => {
+        var _a, _b;
+        if (dataSourceType !== 'data-model') {
+            throw new WdCompError(LISTVIEW_MESSAGE.methods_no_support, {
+                code: `${refType === 'dataView' ? 'WdDataView' : 'WdListView'}.ActionNotSupport`,
+            });
+        }
+        const _id = params === null || params === void 0 ? void 0 : params._id;
+        if (!_id || typeof _id !== 'string') {
+            throw new WdCompError(LISTVIEW_MESSAGE.deleteOne_param_error, {
+                code: `${refType === 'dataView' ? 'WdDataView' : 'WdListView'}.DeleteOneParamError`,
+            });
+        }
+        clearDelay();
+        try {
+            await (appCloud === null || appCloud === void 0 ? void 0 : appCloud.callDataSource({
+                dataSourceName: paramRef.current.dataSourceName,
+                methodName: 'wedaDelete',
+                params: { _id },
+            }, true));
+        }
+        catch (error) {
+            throw new WdCompError(`${error === null || error === void 0 ? void 0 : error.message}` || '', {
+                code: (error === null || error === void 0 ? void 0 : error.code) || '',
+                requestId: (_b = (_a = error === null || error === void 0 ? void 0 : error.original) === null || _a === void 0 ? void 0 : _a.original) === null || _b === void 0 ? void 0 : _b.requestId,
+                original: error,
+            });
+        }
+        await methodRefreshKeepPage();
+    }, [appCloud, dataSourceType, methodRefreshKeepPage]);
+    const { total, pageNo, pageSize: statePageSize } = getContextState();
+    // widget api
+    useSetWidgetApi(() => {
+        return {
+            // 当前页数据
+            records: dataRef.current.records,
+            // 当前总数
+            total,
+            pageNo,
+            pageSize: statePageSize,
+            dataSourceVersion: isV2protocol ? 'v2' : 'v1',
+            // 组件方法
+            deleteOne: async (_id) => {
+                try {
+                    await methodDeleteOne(_id);
+                }
+                catch (error) {
+                    throw new WdCompError(`${error === null || error === void 0 ? void 0 : error.message}` || '', {
+                        code: (error === null || error === void 0 ? void 0 : error.code)
+                            ? error === null || error === void 0 ? void 0 : error.code
+                            : refType === 'dataView'
+                                ? 'WdDataView.DeleteOneError'
+                                : 'WdListView.DeleteOneError',
+                        requestId: error === null || error === void 0 ? void 0 : error.requestId,
+                        original: error === null || error === void 0 ? void 0 : error.original,
+                    });
+                }
+            },
+            refresh: async (type) => {
+                try {
+                    await methodRefresh(type);
+                }
+                catch (error) {
+                    throw new WdCompError(`${error === null || error === void 0 ? void 0 : error.message}` || '', {
+                        code: (error === null || error === void 0 ? void 0 : error.code)
+                            ? error === null || error === void 0 ? void 0 : error.code
+                            : refType === 'dataView'
+                                ? 'WdDataView.RefreshError'
+                                : 'WdListView.RefreshError',
+                        requestId: error === null || error === void 0 ? void 0 : error.requestId,
+                        original: error === null || error === void 0 ? void 0 : error.original,
+                    });
+                }
+            },
+            error: err,
+        };
+    }, [
+        total,
+        pageNo,
+        statePageSize,
+        methodDeleteOne,
+        methodRefresh,
+        dataRef.current.records,
+        err,
+        isV2protocol,
+    ], ref);
+    /**
+     * 分页，加载更多
+     */
+    const renderLoadMore = () => {
+        const MoreButton = (_jsx("div", { className: `${BLOCK_NAME}__more-text ${isH5 ? 'h5' : ''}`, onClick: () => {
+                var _a, _b;
+                return fetchData({
+                    params: { pageNo: ((_b = (_a = paramRef.current) === null || _a === void 0 ? void 0 : _a.params) === null || _b === void 0 ? void 0 : _b.pageNo) + 1 },
+                });
+            }, children: textToString(loadButtonText) || '加载更多' }));
+        if (isIdeMockData)
+            return MoreButton;
+        if (status === 'loading' && isSetLoading)
+            return LoadingSymbol;
+        return !hasNextPage() ? LoadEnd : MoreButton;
+    };
+    /**
+     * 分页，底部刷新
+     */
+    const renderBottomLoad = () => {
+        return (_jsx("div", { ref: nodeRefCallback, className: `${BLOCK_NAME}__bottom-load`, children: status === 'loading' && isSetLoading
+                ? LoadingSymbol
+                : !hasNextPage() && LoadEnd }));
+    };
+    /**
+     * 分页，分页器，含ideMockData的判断
+     */
+    const renderPagination = () => {
+        var _a, _b, _c, _d;
+        const pageNo = ((_b = (_a = paramRef.current) === null || _a === void 0 ? void 0 : _a.params) === null || _b === void 0 ? void 0 : _b.pageNo) || 1;
+        const preDisabeld = pageNo <= 1 || status === 'loading';
+        const nextDisabeld = !hasNextPage() || status === 'loading';
+        const total = (_d = (_c = dataRef.current) === null || _c === void 0 ? void 0 : _c.total) !== null && _d !== void 0 ? _d : 0;
+        return (_jsxs("div", { className: `${BLOCK_NAME}__more-pagination`, children: [_jsx("div", { className: classNames(`${BLOCK_NAME}__pagination-pre`, preDisabeld ? '' : 'active'), onClick: () => !preDisabeld && fetchData({ params: { pageNo: pageNo - 1 } }), children: "\u4E0A\u4E00\u9875" }), _jsxs("div", { className: classNames(`${BLOCK_NAME}__pagination-text`), children: [_jsx("span", { className: "active", children: isIdeMockData ? 1 : total ? pageNo : 0 }), "/", isIdeMockData ? 1 : Math.ceil(total / pageSize)] }), _jsx("div", { className: classNames(`${BLOCK_NAME}__pagination-next`, nextDisabeld ? '' : 'active'), onClick: () => !nextDisabeld && fetchData({ params: { pageNo: pageNo + 1 } }), children: "\u4E0B\u4E00\u9875" })] }));
+    };
+    /**
+     * 查询状态展示
+     */
+    const renderStatus = () => {
+        switch (status) {
+            case 'empty':
+                return (emptyText && (_jsx(EmptyContent, { emptyText: emptyText, component: "listview" })));
+            case 'fail':
+                return (isSetStatus && (_jsx(EmptyContent, { emptyText: '数据加载失败', errorObj: err, icon: 'error', isH5: isH5, component: "listview", hasRecord: dataRef.current.records.length > 0 })));
+            case 'loading':
+                return (isSetLoading &&
+                    pagination === 'pagination' && (_jsx("div", { className: classNames(`${BLOCK_NAME}__more`, `${BLOCK_NAME}__content-loading`), children: LoadingSymbol })));
+        }
+    };
+    /**
+     * 加载中状态组件
+     */
+    const LoadingSymbol = (_jsxs("div", { className: `${BLOCK_NAME}__more-symbol`, children: [_jsx("div", { className: `${BLOCK_NAME}__symbol-item` }), _jsx("div", { className: `${BLOCK_NAME}__symbol-item` }), _jsx("div", { className: `${BLOCK_NAME}__symbol-item` })] }));
+    /**
+     * 加载到底状态组件
+     */
+    const LoadEnd = status === 'success' && loadCompletedText && (_jsx("div", { className: `${BLOCK_NAME}__load-completed`, children: String(loadCompletedText) }));
+    return (_jsxs("div", { ...rest, className: classNames('weda-ui', `${BLOCK_NAME}__container`, className), children: [children && (_jsxs("div", { className: classNames(`${BLOCK_NAME}__content`, {
+                    [`${BLOCK_NAME}-card`]: template === 'cardList',
+                    [`${BLOCK_NAME}__content-blank`]: (status === 'empty' && emptyText) ||
+                        (status === 'fail' && isSetStatus),
+                }), children: [status === 'fail' && refType === 'dataView' ? (_jsx(EmptyContent, { emptyText: '数据加载失败', errorObj: err, icon: 'error', isH5: isH5 })) : (children), renderStatus()] })), _jsxs("div", { className: classNames(`${BLOCK_NAME}__more`, `${BLOCK_NAME}__more-${pagination}`), children: [pagination === 'bottomLoad' && renderBottomLoad(), pagination === 'loadMoreButton' && renderLoadMore(), pagination === 'pagination' && renderPagination()] })] }));
+});