@cloudbase/weda-ui 3.5.3 → 3.6.0

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

@@ -1,7 +1,7 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import React, { useState, useEffect, useRef, useCallback, useImperativeHandle, } from 'react';
+import React, { useState, useEffect, useRef, useCallback, useMemo, } from 'react';
 import { callDataSource } from '../../utils/tcb';
-import { isInIde, alertErrorMessage, usePlatform } from '../../utils/platform';
+import { isInIde, alertErrorMessage, usePlatform, getParseValue, textToString, } from '../../utils/platform';
 import classNames from '../../utils/classnames';
 import isequal from 'lodash.isequal';
 import './style';
@@ -11,6 +11,7 @@ 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';
 const BLOCK_NAME = 'weda-list-view';
 const LISTVIEW_MESSAGE = {
     methods_no_support: '当前组件绑定了APIs，暂不支持进行数据删除',
@@ -24,40 +25,51 @@ const getIdeMockData = (length = 3) => Array.from({ length }).map(() => Object.c
 const getStringValue = (v) => (typeof v === 'string' ? v : '');
 const defaultCloudbase = { callDataSource, isInIde };
 const defaultBeforeDataChange = (v) => v;
-const getCurrentPageData = (data = [], pageNo, pageSize) => {
-    const records = [].concat(data);
-    return (records === null || records === void 0 ? void 0 : records.slice((pageNo - 1) * pageSize, pageNo * pageSize)) || []; // 当前页的数据
-};
 /**
  * 数据容器-列表视图
  */
 export default React.forwardRef(function ListView(props, ref) {
     var _a, _b, _c;
-    const { dataSourceType, bindConnectMetadata, connectorMethod, connectorParams: rawConnectorParams, datasource, dataSourceData: _dataSourceData = [], template, enableTotal, total: _total, pageSize = 5, pagination, events, className, children, isRecords = true, //是否展示回调recoreds字段
-    isSetStatus = false, //是否开启加载状态
+    const { dataSourceType, bindConnectMetadata, connectorMethod, connectorParams: rawConnectorParams, datasource, dataSourceData: rawDataSourceData, // 表达式: 值
+    template, enableTotal, // 表达式: 启用动态分页
+    total: rawTotal, // 表达式: 总页数
+    pageSize = 5, pagination, events, className, children, isRecords = true, //是否展示回调recoreds字段
+    isSetStatus: rawIsSetStatus = false, //是否开启异常状态
+    isSetLoading: rawIsSetLoading = true, // 是否开启加载状态
+    loading = false, // 数据加载状态，仅表达式生效
     emptyText, //空状态时的文案
     loadCompletedText = '', // 加载到底提示
-    appCloud = defaultCloudbase, beforeDataChange = defaultBeforeDataChange, refType = 'listView', ...rest } = props;
+    appCloud = defaultCloudbase, beforeDataChange = defaultBeforeDataChange, refType = 'listView', loadButtonText, ...rest } = props;
     const platform = usePlatform();
     const isH5 = platform === 'h5';
+    const isSetStatus = dataSourceType !== 'expression' ? rawIsSetStatus : false;
+    const isSetLoading = dataSourceType !== 'expression' ? rawIsSetLoading : true;
     const modelParams = getModelParams(props); // 包括 where 和 order
-    const connectorParams = rawConnectorParams && JSON.parse(JSON.stringify(rawConnectorParams));
-    const isModel = dataSourceType === 'data-model';
-    const methodName = getStringValue(isModel
+    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 dataSourceName = getStringValue(isModel ? 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);
+    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 [pageParam, setPageParam] = useState({ pageNo: 1, pageSize });
+    const [_status, setStatus] = useState(''); // 查询状态
+    const status = useMemo(() => {
+        let s = _status;
+        if (dataSourceType === 'expression') {
+            s = loading ? 'loading' : '';
+        }
+        return s;
+    }, [dataSourceType, loading, _status]); // 表达式强制使用 loading 展示加载
     const paramRef = useRef({
         dataSourceName,
         methodName,
-        params: { ...pageParam, connectorParams, modelParams },
+        params: { pageNo: 1, pageSize, connectorParams, modelParams },
         pagination,
     }); // 最新请求参数
-    const [dataSourceData, setDataSourceData] = useState(_dataSourceData || []);
+    const exprRef = useRef({ total: 0, dataSourceData: [], enableTotal }); // 对比表达式变化
     const dataRef = useRef({ total: 0, records: [] }); // 最新数据列表
     const observeRef = useRef(null); // 当前监听对象
     const delayRef = useRef({
@@ -65,6 +77,8 @@ export default React.forwardRef(function ListView(props, ref) {
         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' &&
@@ -88,7 +102,7 @@ export default React.forwardRef(function ListView(props, ref) {
     // 监听更改数据源时，清空当前列表
     useEffect(() => {
         clearContext();
-    }, [methodName, dataSourceName, isModel]);
+    }, [methodName, dataSourceName, dataSourceType]);
     // props 基本类型监听，需重新分页；处于 ide 且未绑定数据源时返回mock数据
     useEffect(() => {
         var _a, _b;
@@ -105,7 +119,6 @@ export default React.forwardRef(function ListView(props, ref) {
                 pagination,
             }, {
                 isInitData: true,
-                dataSourceData,
             });
         }
         else {
@@ -114,11 +127,11 @@ export default React.forwardRef(function ListView(props, ref) {
                 state: getContextState(),
             });
         }
-    }, [methodName, dataSourceName, pageSize, pagination, isModel, enableTotal]);
+    }, [methodName, dataSourceName, pageSize, pagination, dataSourceType]);
     // props 对象类型监听，需重新分页
     useEffect(() => {
         var _a, _b, _c, _d;
-        if (isModel) {
+        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, modelParams)) {
                 clearDelay();
                 fetchData({
@@ -134,21 +147,14 @@ export default React.forwardRef(function ListView(props, ref) {
                 }, { isInitData: true });
             }
         }
-    });
-    useEffect(() => {
-        if (dataSourceType === 'expression') {
-            if (Array.isArray(_dataSourceData) &&
-                !isequal(dataSourceData, _dataSourceData)) {
-                setDataSourceData(_dataSourceData);
-                // 绑定表达式且开启动态分页的时候，列表展示依赖请求结果，因此不做清空处理。（滚动分页需保留上次的结果）
-                fetchData({
-                    params: {
-                        pageNo: enableTotal ? (pageParam === null || pageParam === void 0 ? void 0 : pageParam.pageNo) || 1 : 1,
-                    },
-                }, { isInitData: !enableTotal, dataSourceData: _dataSourceData });
+        else {
+            const expr = { dataSourceData, total: rawTotal, enableTotal };
+            if (!isequal(exprRef.current, expr)) {
+                exprRef.current = expr;
+                setExpression();
             }
         }
-    }, [_dataSourceData, dataSourceType]);
+    });
     // 监听触底加载事件
     useEffect(() => {
         var _a, _b;
@@ -162,6 +168,7 @@ export default React.forwardRef(function ListView(props, ref) {
     const clearDelay = () => {
         clearTimeout(delayRef.current.statusTimer);
         clearTimeout(delayRef.current.eventTimer);
+        clearTimeout(delayRef.current.exprTimer);
     };
     // 清除上下文状态
     const clearContext = () => {
@@ -181,13 +188,11 @@ export default React.forwardRef(function ListView(props, ref) {
     }, []);
     // 能否点击下一页
     const hasNextPage = () => {
-        const { pageNo = 1, pageSize = 5 } = pageParam || {};
+        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 {
@@ -211,36 +216,15 @@ export default React.forwardRef(function ListView(props, ref) {
         }
         return { records: records.slice(0, count), total };
     }, [appCloud]);
-    /**
-     * 根据fetchData方法返回值，回调给外部事件
-     */
-    const onEvents = useCallback((data, datasource) => {
+    // 加载成功(包含为空)事件
+    const onSuccessCb = useCallback(({ records, total, isTriggerEmpty, datasource }) => {
         var _a, _b;
-        const isDataViewApis = !isRecords && !isModel;
-        let fetchRecords = [].concat(isDataViewApis ? data : (data === null || data === void 0 ? void 0 : data.records) || []);
-        let total = isDataViewApis ? 0 : Number(data === null || data === void 0 ? void 0 : data.total) || 0;
-        // 支持绑定表达式和动态分页
-        if (datasource.dataSourceType === 'expression') {
-            total = Array.isArray(_dataSourceData) ? _dataSourceData === null || _dataSourceData === void 0 ? void 0 : _dataSourceData.length : 0;
-            if (enableTotal && !isNaN(parseInt(`${_total}`))) {
-                total = parseInt(`${_total}`);
-            }
-            fetchRecords = [].concat(data);
-        }
-        if (['loadMoreButton', 'bottomLoad'].includes(paramRef.current.pagination)) {
-            dataRef.current = {
-                total,
-                records: [...dataRef.current.records, ...fetchRecords],
-            };
-        }
-        else {
-            dataRef.current = { total, records: fetchRecords };
-        }
         (_a = events === null || events === void 0 ? void 0 : events.onDataChange) === null || _a === void 0 ? void 0 : _a.call(events, {
-            data: beforeDataChange(dataRef.current.records || []),
+            data: beforeDataChange(records),
             state: getContextState(),
         });
-        if (total === 0 && !isDataViewApis) {
+        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,
@@ -248,9 +232,15 @@ export default React.forwardRef(function ListView(props, ref) {
             });
         }
         else {
-            const statusCb = () => setStatus('success');
+            const statusCb = () => {
+                setStatus('success');
+            };
             if (pagination === 'bottomLoad') {
-                delayRef.current.statusTimer = window.setTimeout(statusCb, 150);
+                if (delayRef.current.statusTimer) {
+                    clearTimeout(delayRef.current.statusTimer);
+                    delayRef.current.statusTimer = null;
+                }
+                delayRef.current.statusTimer = window.setTimeout(statusCb, pagination === 'bottomLoad' ? 3000 : 150);
             }
             else {
                 statusCb();
@@ -260,88 +250,110 @@ export default React.forwardRef(function ListView(props, ref) {
             var _a;
             (_a = events === null || events === void 0 ? void 0 : events.querySuccess) === null || _a === void 0 ? void 0 : _a.call(events, {
                 datasource,
-                data: beforeDataChange(dataRef.current.records),
+                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();
         }
-    }, [
-        _total,
-        beforeDataChange,
-        enableTotal,
-        events,
-        isModel,
-        isRecords,
-        pagination,
-        _dataSourceData === null || _dataSourceData === void 0 ? void 0 : _dataSourceData.length,
-    ]);
+    }, [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, _e;
-        const { isInitData, isFetchCurrent, dataSourceData } = options || {};
+        var _a, _b, _c;
+        const { isInitData, isFetchCurrent } = options || {};
         // 合并参数并保存，useEffect 中需要比对
         paramRef.current = {
             ...paramRef.current,
             ...param,
             params: { ...paramRef.current.params, ...param === null || param === void 0 ? void 0 : param.params },
         };
-        const query = {
-            pageNo: paramRef.current.params.pageNo,
-            pageSize: paramRef.current.params.pageSize,
-        };
-        setPageParam(query);
-        // 分页变化事件
-        if (events === null || events === void 0 ? void 0 : events.onPagingChange) {
-            events.onPagingChange({
-                query,
-            });
-        }
         const { dataSourceName, methodName, params } = paramRef.current;
         const { pageNo, pageSize, modelParams, connectorParams } = params || {};
+        // 不触发请求
+        if (!(dataSourceName && methodName) && dataSourceType !== 'expression')
+            return;
+        // 分页变化事件
+        (_a = events === null || events === void 0 ? void 0 : events.onPagingChange) === null || _a === void 0 ? void 0 : _a.call(events, { query: { pageNo, pageSize } });
+        setStatus('loading');
+        // 前端分页时，应该触发表达式
         if (dataSourceType === 'expression') {
-            isInitData && (dataRef.current = { total: 0, records: [] });
-            if (!dataSourceData && enableTotal) {
-                // 动态分页的情况下，只改变页码，不主动更改records,等待请求回来更新records
-                return;
-            }
-            // 绑定表达式时触发
-            const records = enableTotal
-                ? [].concat(dataSourceData || _dataSourceData)
-                : getCurrentPageData(dataSourceData || _dataSourceData, pageNo, pageSize);
-            onEvents(records, { dataSourceType });
+            delayRef.current.exprTimer = window.setTimeout(() => setStatus(''), 3000);
+            !enableTotal && delayRef.current.initExpr && setExpression();
             return;
         }
-        // 模型/apis请求
-        if (!(dataSourceName && methodName))
-            return;
         const fetchVersion = (delayRef.current.version = getUuid());
-        setStatus('loading');
         let tcbParams = {};
-        // tcb分页参数
+        let eventDataSource = {};
+        // tcb 分页参数
         if (!isNil(pageNo) && !isNil(pageSize)) {
             tcbParams['pageNo'] = pageNo;
             tcbParams['pageSize'] = pageSize;
         }
-        if (isModel) {
+        if (dataSourceType === 'data-model') {
             tcbParams = Object.assign({}, tcbParams, modelParams);
+            eventDataSource = datasource;
         }
         else {
-            // 内部分页参数覆盖查询入参
             tcbParams = Object.assign({}, connectorParams, tcbParams);
+            eventDataSource = { ...bindConnectMetadata, ...connectorMethod };
         }
-        // tcb结果和事件
+        // tcb 请求
         let data = {};
-        const eventDatasource = isModel
-            ? datasource
-            : { ...bindConnectMetadata, ...connectorMethod };
         try {
             if (isFetchCurrent) {
                 data = await fetchDataLoop({ dataSourceName, methodName, params: tcbParams, swr: param.swr }, dataRef.current.records.length);
@@ -357,30 +369,35 @@ export default React.forwardRef(function ListView(props, ref) {
             if (fetchVersion !== delayRef.current.version)
                 return;
             isInitData && (dataRef.current = { total: 0, records: [] });
-            onEvents(data, eventDatasource);
+            // 处理数据
+            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) {
-            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 },
-            });
+            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: (_e = (_d = e === null || e === void 0 ? void 0 : e.original) === null || _d === void 0 ? void 0 : _d.original) === null || _e === void 0 ? void 0 : _e.requestId,
+                requestId: (_c = (_b = e === null || e === void 0 ? void 0 : e.original) === null || _b === void 0 ? void 0 : _b.original) === null || _c === void 0 ? void 0 : _c.requestId,
                 original: e === null || e === void 0 ? void 0 : e.original,
             });
         }
@@ -390,25 +407,23 @@ export default React.forwardRef(function ListView(props, ref) {
         connectorMethod,
         dataSourceType,
         datasource,
-        enableTotal,
-        events,
         fetchDataLoop,
-        isModel,
-        onEvents,
         refType,
+        isRecords,
+        onSuccessCb,
+        onFailCb,
+        events,
+        enableTotal,
+        setExpression,
     ]);
-    /**
-     * 计算上下文对象数据
-     */
+    // 计算上下文对象数据
     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 } = pageParam;
+        const { pageNo, pageSize } = paramRef.current.params;
         return { total, pageNo, pageSize, ...state };
     };
-    /**
-     * 组件刷新方法，重新初始化
-     */
+    // 组件刷新方法，重新初始化
     const methodRefreshFromStart = useCallback(async () => {
         try {
             clearDelay();
@@ -459,7 +474,7 @@ export default React.forwardRef(function ListView(props, ref) {
      */
     const methodDeleteOne = useCallback(async (params) => {
         var _a, _b;
-        if (!isModel) {
+        if (dataSourceType !== 'data-model') {
             throw new WdCompError(LISTVIEW_MESSAGE.methods_no_support, {
                 code: `${refType === 'dataView' ? 'WdDataView' : 'WdListView'}.ActionNotSupport`,
             });
@@ -486,10 +501,10 @@ export default React.forwardRef(function ListView(props, ref) {
             });
         }
         await methodRefreshKeepPage();
-    }, [appCloud, isModel, methodRefreshKeepPage]);
+    }, [appCloud, dataSourceType, methodRefreshKeepPage]);
     const { total, pageNo, pageSize: statePageSize } = getContextState();
     // widget api
-    useImperativeHandle(ref, () => {
+    useSetWidgetApi(() => {
         return {
             // 当前页数据
             records: dataRef.current.records,
@@ -540,17 +555,20 @@ export default React.forwardRef(function ListView(props, ref) {
         methodRefresh,
         dataRef.current.records,
         err,
-    ]);
+    ], ref);
     /**
      * 分页，加载更多
      */
     const renderLoadMore = () => {
-        var _a, _b;
-        const pageNo = ((_b = (_a = paramRef.current) === null || _a === void 0 ? void 0 : _a.params) === null || _b === void 0 ? void 0 : _b.pageNo) || 1;
-        const MoreButton = (_jsx("div", { className: `${BLOCK_NAME}__more-text`, onClick: () => fetchData({ params: { pageNo: pageNo + 1 } }), children: "\u52A0\u8F7D\u66F4\u591A" }));
+        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')
+        if (status === 'loading' && isSetLoading)
             return LoadingSymbol;
         return !hasNextPage() ? LoadEnd : MoreButton;
     };
@@ -558,7 +576,9 @@ export default React.forwardRef(function ListView(props, ref) {
      * 分页，底部刷新
      */
     const renderBottomLoad = () => {
-        return (_jsx("div", { ref: nodeRefCallback, className: `${BLOCK_NAME}__bottom-load`, children: status === 'loading' ? LoadingSymbol : !hasNextPage() && LoadEnd }));
+        return (_jsx("div", { ref: nodeRefCallback, className: `${BLOCK_NAME}__bottom-load`, children: status === 'loading' && isSetLoading
+                ? LoadingSymbol
+                : !hasNextPage() && LoadEnd }));
     };
     /**
      * 分页，分页器，含ideMockData的判断
@@ -577,11 +597,11 @@ export default React.forwardRef(function ListView(props, ref) {
     const renderStatus = () => {
         switch (status) {
             case 'empty':
-                return emptyText && _jsx(EmptyContent, { emptyText: emptyText });
+                return (emptyText && (_jsx(EmptyContent, { emptyText: emptyText, component: "listview" })));
             case 'fail':
-                return (isSetStatus && (_jsx(EmptyContent, { emptyText: '数据加载失败', errorObj: err, icon: 'error', isH5: isH5, hasRecord: dataRef.current.records.length > 0 })));
+                return (isSetStatus && (_jsx(EmptyContent, { emptyText: '数据加载失败', errorObj: err, icon: 'error', isH5: isH5, component: "listview", hasRecord: dataRef.current.records.length > 0 })));
             case 'loading':
-                return (isSetStatus &&
+                return (isSetLoading &&
                     pagination === 'pagination' && (_jsx("div", { className: classNames(`${BLOCK_NAME}__more`, `${BLOCK_NAME}__content-loading`), children: LoadingSymbol })));
         }
     };
@@ -593,8 +613,9 @@ export default React.forwardRef(function ListView(props, ref) {
      * 加载到底状态组件
      */
     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}__containor`, className), children: [children && (_jsxs("div", { className: classNames(template === 'cardList' ? `${BLOCK_NAME}-card` : '', `${BLOCK_NAME}__content`, (status === 'empty' && emptyText) ||
-                    (status === 'fail' && isSetStatus)
-                    ? `${BLOCK_NAME}__content-blank`
-                    : ''), 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()] })] }));
+    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()] })] }));
 });

package/dist/web/components/listView/interface.d.ts

@@ -129,6 +129,14 @@ export interface IListView extends IDataContainer {
      * 加载到底提示语句，为空时不展示
      */
     loadCompletedText?: string;
+    /**
+     * 加载按钮名称
+     */
+    loadButtonText?: string;
+    /**
+     * 数据加载状态，当前仅作用于表达式
+     */
+    loading?: boolean;
 }
 /**
  * 查询状态

package/dist/web/components/lottery/index.css

@@ -219,17 +219,19 @@
 }
 
 .weda-lottery .weda-lottery__inner .weda-lottery__turntable-cell-image {
-  height: 40px;
   display: flex;
   align-items: center;
   justify-content: center;
+  flex: 1 1 0;
+  overflow: hidden;
 }
 
 .weda-lottery .weda-lottery__inner .weda-lottery__turntable-cell-icon {
   display: block;
-  width: 40px;
-  height: 40px;
+  max-width: 100%;
+  max-height: 100%;
   object-fit: contain;
+  overflow: hidden;
 }
 
 .weda-lottery .weda-lottery__inner .weda-lottery__turntable-cell-desc {
@@ -243,6 +245,7 @@
   text-overflow: ellipsis;
   overflow: hidden;
   width: 100%;
+  flex: 0 0 auto;
 }
 
 .weda-lottery
@@ -292,7 +295,6 @@
 }
 
 .weda-lottery .weda-lottery__btn-image {
-  padding: 11px 15px;
   width: 100%;
   height: 100%;
   box-sizing: border-box;

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

@@ -369,12 +369,7 @@ export default React.forwardRef(function Lottery(props, ref) {
                                                     paddingBottom: `${(8 * heightRatio) / 14}rem`,
                                                     paddingLeft: `${(2 * widthRatio) / 14}rem`,
                                                     paddingRight: `${(2 * widthRatio) / 14}rem`,
-                                                }, children: [item.src && (_jsx("div", { className: `${CLASS_PREFIX}__turntable-cell-image`, style: {
-                                                            height: `${(heightRatio * 40) / 14}rem`,
-                                                        }, children: _jsx("img", { src: item.src, alt: item.desc, className: `${CLASS_PREFIX}__turntable-cell-icon`, style: {
-                                                                width: `${(widthRatio * 40) / 14}rem`,
-                                                                height: `${(heightRatio * 40) / 14}rem`,
-                                                            } }) })), item.desc && (_jsx("div", { className: `${CLASS_PREFIX}__turntable-cell-desc`, style: {
+                                                }, children: [item.src && (_jsx("div", { className: `${CLASS_PREFIX}__turntable-cell-image`, children: _jsx("img", { src: item.src, alt: item.desc, className: `${CLASS_PREFIX}__turntable-cell-icon` }) })), item.desc && (_jsx("div", { className: `${CLASS_PREFIX}__turntable-cell-desc`, style: {
                                                             marginTop: `${(heightRatio * 6) / 14}rem`,
                                                             fontSize: `${(widthRatio * 12) / 14}rem`,
                                                             lineHeight: `${(heightRatio * 17) / 14}rem`,
@@ -384,18 +379,5 @@ export default React.forwardRef(function Lottery(props, ref) {
                                         height: `calc((${'100%'} - ${(heightRatio * 8 * 4) / 14}rem) / 3)`,
                                         top: `calc((${'100%'} - ${(heightRatio * 8 * 4) / 14}rem) / 3 + ${(heightRatio * 8 * 2) / 14}rem)`,
                                         left: `calc((${'100%'} - ${(heightRatio * 8 * 4) / 14}rem) / 3 + ${(heightRatio * 8 * 2) / 14}rem)`,
-                                    }, children: _jsx("div", { className: `${CLASS_PREFIX}__btn-inner`, style: {
-                                            paddingTop: `${(9 * heightRatio) / 14}rem`,
-                                            paddingBottom: `${(9 * heightRatio) / 14}rem`,
-                                            paddingLeft: `${(9 * widthRatio) / 14}rem`,
-                                            paddingRight: `${(9 * widthRatio) / 14}rem`,
-                                        }, children: _jsx("div", { className: `${CLASS_PREFIX}__btn`, children: _jsx("a", { "data-testid": "start-lottery", className: `${CLASS_PREFIX}__btn-image`, style: {
-                                                    paddingTop: `${(11 * heightRatio) / 14}rem`,
-                                                    paddingBottom: `${(11 * heightRatio) / 14}rem`,
-                                                    paddingLeft: `${(15 * widthRatio) / 14}rem`,
-                                                    paddingRight: `${(15 * widthRatio) / 14}rem`,
-                                                }, onClick: startLottery, children: _jsxs("p", { className: `${CLASS_PREFIX}__btn-text`, style: {
-                                                        fontSize: `${(widthRatio * 18) / 14}rem`,
-                                                        lineHeight: `${(widthRatio * 22) / 14}rem`,
-                                                    }, children: ["\u5F00\u59CB", _jsx("br", {}), "\u62BD\u5956"] }) }) }) }) })] }) })] }) }) }));
+                                    }, children: _jsx("div", { className: `${CLASS_PREFIX}__btn-inner`, children: _jsx("div", { className: `${CLASS_PREFIX}__btn`, children: _jsx("a", { "data-testid": "start-lottery", className: `${CLASS_PREFIX}__btn-image`, onClick: startLottery, children: _jsxs("p", { className: `${CLASS_PREFIX}__btn-text`, children: ["\u5F00\u59CB", _jsx("br", {}), "\u62BD\u5956"] }) }) }) }) })] }) })] }) }) }));
 });