@cloudbase/weda-ui 3.1.0 → 3.1.3

package/dist/web/components/index.d.ts

@@ -0,0 +1,47 @@
+export { default as Button } from "./button";
+export const Text: any;
+export { default as Container } from "./container";
+export const Image: any;
+export { default as Slot } from "./slot";
+export { default as ScrollView } from "./scrollView";
+export { default as Swiper } from "./swiper";
+export { default as Carousel } from "./carousel";
+export { default as Modal } from "./modal";
+export const RichText: any;
+export { default as RichTextView } from "./richTextView";
+export { default as Link } from "./link";
+export { default as Drawer } from "./drawer";
+export { default as UploaderView } from "./uploaderView";
+export { default as UploaderFileView } from "./uploaderFileView";
+export const WedaVideo: any;
+export { default as Picker } from "./picker/picker";
+export { default as DatePicker } from "./picker/datePicker";
+export { default as TimePicker } from "./picker/timePicker";
+export { default as Form } from "./form/form";
+export { default as Input } from "./form/input";
+export { default as Textarea } from "./form/textarea";
+export { default as Checkbox } from "./form/checkbox";
+export { default as Radio } from "./form/radio";
+export { default as Switch } from "./form/switch";
+export { default as Select } from "./form/select";
+export { default as Uploader } from "./form/uploader";
+export { default as UploaderFile } from "./form/uploaderFile";
+export { default as Tips } from "./form/tips";
+export { default as Tabs } from "./tabs";
+export { default as Location } from "./form/location";
+export const EnumSelect: any;
+export const Calendar: any;
+export { default as NavLayout } from "./navLayout";
+export { default as ListView } from "./listView";
+export { default as NavigationBar } from "./navigationBar";
+export const Line: any;
+export const Bar: any;
+export const Pie: any;
+export { default as DataView } from "./dataView";
+export { default as StatisticsCard } from "./chart/statisticsCard";
+export { default as GraphicCard } from "./graphicCard";
+export { default as UserInfo } from "./userInfo";
+export { default as Phone } from "./phone";
+export { default as PhoneCode } from "./phoneCode";
+export { default as Share } from "./share";
+export { default as Lottery } from "./lottery";

package/dist/web/components/index.js

@@ -0,0 +1,94 @@
+import '@tcwd/style-wedatheme/index.css';
+import loadable from '@loadable/component';
+import { fallback } from '../utils/loading-fallback';
+// export const Button = loadable(() => import('./button'), {fallback});
+// export const Container = loadable(() => import('./container'), {fallback});
+// export const Slot = loadable(() => import('./slot'), {fallback});
+// export const ScrollView = loadable(() => import('./scrollView'), {fallback});
+// export const Swiper = loadable(() => import('./swiper'), {fallback});
+// export const Modal = loadable(() => import('./modal'), {fallback});
+// export const RichText = loadable(() => import('./richText'), {fallback});
+// export const RichTextView = loadable(() => import('./richTextView'), {fallback});
+// export const Link = loadable(() => import('./link'), {fallback});
+// export const Drawer = loadable(() => import('./drawer'), {fallback});
+// export const UploaderView = loadable(() => import('./uploaderView'), {fallback});
+// // picker
+// export const Picker = loadable(() => import('./picker/picker'), {fallback});
+// export const DatePicker = loadable(() => import('./picker/datePicker'), {fallback});
+// export const TimePicker = loadable(() => import('./picker/timePicker'), {fallback});
+// // form
+// export const Form = loadable(() => import('./form/form'), {fallback});
+// export const Input = loadable(() => import('./form/input'), {fallback});
+// export const Textarea = loadable(() => import('./form/textarea'), {fallback});
+// export const Checkbox = loadable(() => import('./form/checkbox'), {fallback});
+// export const Radio = loadable(() => import('./form/radio'), {fallback});
+// export const Switch = loadable(() => import('./form/switch'), {fallback});
+// export const Uploader = loadable(() => import('./form/uploader'), {fallback});
+// export const Tips = loadable(() => import('./form/tips'), {fallback});
+// export const EnumSelect = loadable(() => import('./form/enumSelect'), {fallback});
+// export const Tabs = loadable(() => import('./tabs'), {fallback});
+export { default as Button } from './button';
+// export { default as Text } from './text';
+export const Text = loadable(() => import('./text'), { fallback });
+export { default as Container } from './container';
+// export { default as Image } from './image';
+export const Image = loadable(() => import('./image'), { fallback });
+export { default as Slot } from './slot';
+export { default as ScrollView } from './scrollView';
+export { default as Swiper } from './swiper';
+export { default as Carousel } from './carousel';
+export { default as Modal } from './modal';
+// export { default as RichText } from './richText';
+export const RichText = loadable(() => import('./richText'), { fallback });
+export { default as RichTextView } from './richTextView';
+export { default as Link } from './link';
+export { default as Drawer } from './drawer';
+export { default as UploaderView } from './uploaderView';
+export { default as UploaderFileView } from './uploaderFileView';
+// export { default as WedaVideo } from './wedaVideo/index';
+export const WedaVideo = loadable(() => import('./wedaVideo/index'), {
+    fallback,
+});
+export { default as Picker } from './picker/picker';
+export { default as DatePicker } from './picker/datePicker';
+export { default as TimePicker } from './picker/timePicker';
+// form
+export { default as Form } from './form/form';
+export { default as Input } from './form/input';
+export { default as Textarea } from './form/textarea';
+export { default as Checkbox } from './form/checkbox';
+export { default as Radio } from './form/radio';
+export { default as Switch } from './form/switch';
+export { default as Select } from './form/select';
+// export const Select = loadable(() => import('./form/select'), { fallback });
+export { default as Uploader } from './form/uploader';
+export { default as UploaderFile } from './form/uploaderFile';
+export { default as Tips } from './form/tips';
+export { default as Tabs } from './tabs';
+export { default as Location } from './form/location';
+// export { default as EnumSelect } from './form/enumSelect';
+export const EnumSelect = loadable(() => import('./form/enumSelect'), {
+    fallback,
+});
+// export { default as Calendar } from './calendar';
+export const Calendar = loadable(() => import('./calendar'), { fallback });
+export { default as NavLayout } from './navLayout';
+// Data Contaier
+export { default as ListView } from './listView';
+export { default as NavigationBar } from './navigationBar';
+// export { default as Line } from './chart/line';
+// export { default as Bar } from './chart/bar';
+// export { default as Pie } from './chart/pie';
+export const Line = loadable(() => import('./chart/line'), { fallback });
+export const Bar = loadable(() => import('./chart/bar'), { fallback });
+export const Pie = loadable(() => import('./chart/pie'), { fallback });
+export { default as DataView } from './dataView';
+export { default as StatisticsCard } from './chart/statisticsCard';
+export { default as GraphicCard } from './graphicCard';
+export { default as UserInfo } from './userInfo';
+export { default as Phone } from './phone';
+export { default as PhoneCode } from './phoneCode';
+export { default as Share } from './share';
+export { default as Lottery } from './lottery';
+import 'weui/dist/style/weui.css';
+import '../weda-ui.css';

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

@@ -0,0 +1,8 @@
+.weda-link {
+  text-align: center;
+  display: inline-block;
+  vertical-align: middle;
+}
+
+.weda-link-slot {
+}

package/dist/web/components/link/index.d.ts

@@ -0,0 +1,24 @@
+import * as React from 'react';
+import type { CommonPropsType } from '../../types';
+import './index.css';
+export interface PropsType extends CommonPropsType {
+    /**
+     * 内容
+     */
+    content?: string;
+    /**
+     * 链接地址
+     */
+    url?: string;
+    /**
+     * 参数
+     */
+    params?: Readonly<{
+        key: string;
+        value: string;
+    }[]>;
+    contentSlot?: React.ReactNode;
+    isOpenInNewWindow?: boolean;
+}
+export default function Link({ content, url, events, style, className, contentSlot, params, // TODO 格式定义,
+isOpenInNewWindow, }: PropsType): JSX.Element;

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

@@ -0,0 +1,71 @@
+import * as React from 'react';
+import classNames from '../../utils/classnames';
+import { emptyArray, emptyObject } from '../../utils/constant';
+import './index.css';
+// 所有绝对地址直接交由浏览器，新开窗口交由浏览器
+// 当前窗口相对地址交给平台
+export default function Link({ content, url = '', events = emptyObject, style, className, contentSlot, params = emptyArray, // TODO 格式定义,
+isOpenInNewWindow, }) {
+    url = url.trim();
+    const cls = classNames({
+        'weda-link': true,
+        'weda-ui': true,
+        [className]: className,
+    });
+    // URL 构造函数不支持 '//xxx.com' 的格式
+    if (url.indexOf('//') === 0) {
+        url = location.protocol + url;
+    }
+    // "proto:" 或 "//" 起头的是绝对路径
+    let isAbosolutePath = /^(?:[a-z]+:)/i.test(url);
+    let base, path, href, paramObj = {}, urlObj;
+    if (!isAbosolutePath) {
+        // 相对地址使用站位域名，不实际使用
+        base =
+            location.origin && location.origin !== 'null'
+                ? location.origin
+                : 'https://we.da';
+    }
+    try {
+        urlObj = new URL(url, base);
+        params.forEach((x) => {
+            urlObj.searchParams.append(x.key, x.value);
+        });
+        href = urlObj.href;
+        path = urlObj.pathname;
+        for (const [key, value] of urlObj.searchParams) {
+            paramObj[key] = value;
+        }
+        // 相对地址去掉站位域名
+        if (!isAbosolutePath) {
+            href = urlObj.pathname + urlObj.search + urlObj.hash;
+            href = href.replace(/^\//, '');
+        }
+    }
+    catch (e) {
+        // 非法 url
+        isAbosolutePath = true;
+        href = url;
+        path = '';
+        paramObj = params.reduce((p, x) => {
+            p[x.key] = x.value;
+            return p;
+        }, {});
+    }
+    return (React.createElement("a", { style: { ...style }, className: cls, target: isOpenInNewWindow ? '_blank' : '_self', href: href, onClick: (e) => {
+            events.tap && events.tap({}, { originEvent: e });
+            if (!e.defaultPrevented) {
+                if (!isAbosolutePath) {
+                    e.preventDefault();
+                    app.navigateTo({
+                        pageId: path,
+                        packageName: '',
+                        mode: 'weDa',
+                        params: paramObj,
+                    });
+                }
+            }
+        }, rel: "noopener noreferrer" },
+        contentSlot && React.createElement("div", { className: "weda-link-slot" }, contentSlot),
+        content));
+}

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

@@ -0,0 +1,143 @@
+.weda-list-view__containor {
+  overflow-y: auto;
+  max-height: 100%;
+  overflow-x: hidden;
+}
+
+.weda-list-view-card {
+  display: flex;
+  flex-wrap: wrap;
+  margin-right: 0.21429rem;
+}
+
+/* 加载更多 */
+.weda-list-view__containor .weda-list-view__more {
+  width: 100%;
+}
+
+.weda-list-view__containor .weda-list-view__more .weda-list-view__bottom-load {
+  padding-top: 0.07143rem;
+}
+
+.weda-list-view__containor .weda-list-view__more .weda-list-view__more-text {
+  padding-top: 0.71429rem;
+  padding-bottom: 1rem;
+  font-size: 0.85714em;
+  line-height: 0.85714em;
+  color: rgba(0, 0, 0, 0.4);
+  text-align: center;
+  box-sizing: border-box;
+  cursor: pointer;
+}
+
+/* 加载更多 ... */
+.weda-list-view__containor .weda-list-view__more .weda-list-view__more-symbol {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  padding-top: 1.42857rem;
+  padding-bottom: 1.28571rem;
+  box-sizing: border-box;
+}
+
+.weda-list-view__containor .weda-list-view__more .weda-list-view__symbol-item {
+  width: 0.57143rem;
+  height: 0.57143rem;
+  background: #c4c4c4;
+  margin-left: 0.42857rem;
+  border-radius: 50%;
+}
+
+.weda-list-view__containor
+  .weda-list-view__more
+  .weda-list-view__symbol-item:first-child {
+  width: 0.42857rem;
+  height: 0.42857rem;
+  margin-left: 0;
+}
+
+/* 加载更多 分页 */
+.weda-list-view__containor .weda-list-view__more {
+  background-color: #fff;
+}
+.weda-list-view__containor
+  .weda-list-view__more.weda-list-view__more-bottomLoad {
+  background-color: transparent;
+}
+.weda-list-view__containor
+  .weda-list-view__more
+  .weda-list-view__more-pagination {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  position: relative;
+  padding: 0.71429rem 1.28571rem 0.85714rem 1.14286rem;
+  box-sizing: border-box;
+}
+
+.weda-list-view__containor
+  .weda-list-view__more
+  .weda-list-view__pagination-pre,
+.weda-list-view__containor
+  .weda-list-view__more
+  .weda-list-view__pagination-next {
+  font-size: 0.85714em;
+  line-height: 1.71428em;
+  color: rgba(0, 0, 0, 0.4);
+  padding: 0 1.71429rem;
+  cursor: pointer;
+}
+
+.weda-list-view__containor
+  .weda-list-view__more
+  .weda-list-view__pagination-pre.active,
+.weda-list-view__containor
+  .weda-list-view__more
+  .weda-list-view__pagination-next.active {
+  color: rgba(0, 0, 0, 0.9);
+}
+
+.weda-list-view__containor
+  .weda-list-view__more
+  .weda-list-view__pagination-pre::before,
+.weda-list-view__containor
+  .weda-list-view__more
+  .weda-list-view__pagination-next::after {
+  position: absolute;
+  content: '';
+  width: 1.71428em;
+  height: 1.71428em;
+  top: 0.71429rem;
+  opacity: 0.2;
+  background-image: url(data:image/svg+xml;charset=utf-8;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTEzLjE3MTkgMTIuMDAwMkw4LjIyMTkyIDcuMDUwMjNMOS42MzU5MiA1LjYzNjIzTDE1Ljk5OTkgMTIuMDAwMkw5LjYzNTkyIDE4LjM2NDJMOC4yMjE5MiAxNi45NTAyTDEzLjE3MTkgMTIuMDAwMloiIGZpbGw9IiMwOTEyMUYiLz4KPC9zdmc+Cg==);
+}
+
+.weda-list-view__containor
+  .weda-list-view__more
+  .active.weda-list-view__pagination-pre::before,
+.weda-list-view__containor
+  .weda-list-view__more
+  .active.weda-list-view__pagination-next::after {
+  opacity: 1;
+}
+
+.weda-list-view__containor
+  .weda-list-view__more
+  .weda-list-view__pagination-pre::before {
+  left: 1.14286rem;
+  transform: rotate(180deg);
+}
+
+.weda-list-view__containor
+  .weda-list-view__more
+  .weda-list-view__pagination-next::after {
+  right: 1.28571rem;
+}
+
+.weda-list-view__containor
+  .weda-list-view__more
+  .weda-list-view__pagination-text {
+  font-size: 0.85714em;
+  line-height: 1.71428em;
+  color: rgba(0, 0, 0, 0.4);
+}

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

@@ -0,0 +1,7 @@
+/// <reference types="react" />
+import { IListView } from './interface';
+import './index.css';
+/**
+ * 数据容器-列表视图
+ */
+export default function ListView(props: IListView): JSX.Element;

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

@@ -0,0 +1,262 @@
+import React, { useState, useEffect, useRef, useMemo, useCallback, } from 'react';
+import { callDataSource } from '../../utils/tcb';
+import { isInIde, getWhereList } from '../../utils/platform';
+import classNames from '../../utils/classnames';
+import isequal from 'lodash.isequal';
+import './index.css';
+import { isNil } from '../../utils/lodash';
+const ORDERTYPE = ['asc', 'desc'];
+const BLOCK_NAME = 'weda-list-view';
+const getIdeMockData = (length = 3) => Array.from({ length }).map(() => Object.create(null));
+/**
+ * 数据容器-列表视图
+ */
+export default function ListView(props) {
+    var _a, _b, _c, _d;
+    const { dataSourceType, bindConnectMetadata, connectorMethod, connectorParams, datasource, orderBy, orderType, where, template, pageSize = 5, pagination, events, className, children, isRecords = true, //是否展示回调recoreds字段
+    appCloud = { callDataSource, isInIde }, beforeDataChange = (v) => v, ...rest } = props;
+    const isModel = useMemo(() => dataSourceType !== 'custom-connector', [dataSourceType]);
+    const methodName = useMemo(() => {
+        var _a;
+        if (isModel) {
+            return ((_a = datasource === null || datasource === void 0 ? void 0 : datasource.extra) === null || _a === void 0 ? void 0 : _a.methodName) || 'wedaGetRecords';
+        }
+        else {
+            return (connectorMethod === null || connectorMethod === void 0 ? void 0 : connectorMethod.name) || 'wedaGetRecords';
+        }
+    }, [(_a = datasource === null || datasource === void 0 ? void 0 : datasource.extra) === null || _a === void 0 ? void 0 : _a.methodName, connectorMethod === null || connectorMethod === void 0 ? void 0 : connectorMethod.name, isModel]); // 默认方法名
+    const [pageNo, setPageNo] = useState(1); // 分页状态
+    const [loading, setLoading] = useState(false); // 触底刷新加载状态
+    const [entry, setEntry] = useState(null); // 触底的observer对象
+    const paramRef = useRef({
+        dataSourceName: datasource === null || datasource === void 0 ? void 0 : datasource.name,
+        bindConnectMetaName: (_b = bindConnectMetadata === null || bindConnectMetadata === void 0 ? void 0 : bindConnectMetadata.datasource) === null || _b === void 0 ? void 0 : _b.name,
+        methodName,
+        params: { orderBy, orderType, where, pageNo: 1, pageSize, connectorParams },
+        pagination,
+    }); // 最新请求参数
+    const dataRef = useRef({ total: 0, records: [] }); // 最新数据列表
+    const observeRef = useRef(null); // 当前监听对象
+    const isIdeMockData = (!(datasource === null || datasource === void 0 ? void 0 : datasource.name) || !((_c = bindConnectMetadata === null || bindConnectMetadata === void 0 ? void 0 : bindConnectMetadata.datasource) === null || _c === void 0 ? void 0 : _c.name)) &&
+        ((_d = appCloud === null || appCloud === void 0 ? void 0 : appCloud.isInIde) === null || _d === void 0 ? void 0 : _d.call(appCloud)); // 在ide环境且未绑定数据源时，存在mock数据逻辑
+    const shouldBottomLoad = pagination === 'bottomLoad' && (entry === null || entry === void 0 ? void 0 : entry.isIntersecting) && !loading; // 能否触底加载
+    // 组件卸载时触发
+    useEffect(() => {
+        return () => {
+            var _a, _b;
+            (_a = observeRef.current) === null || _a === void 0 ? void 0 : _a.disconnect();
+            (_b = events === null || events === void 0 ? void 0 : events.onDataChange) === null || _b === void 0 ? void 0 : _b.call(events, { data: beforeDataChange([]) });
+        };
+    }, []);
+    // props 基本类型监听，需重新分页；处于 ide 且未绑定数据源时返回mock数据
+    useEffect(() => {
+        var _a, _b, _c;
+        dataRef.current = { total: 0, records: [] };
+        if ((isModel && (datasource === null || datasource === void 0 ? void 0 : datasource.name)) || (!isModel && (connectorMethod === null || connectorMethod === void 0 ? void 0 : connectorMethod.name))) {
+            fetchData({
+                dataSourceName: isModel
+                    ? datasource === null || datasource === void 0 ? void 0 : datasource.name
+                    : (_a = bindConnectMetadata === null || bindConnectMetadata === void 0 ? void 0 : bindConnectMetadata.datasource) === null || _a === void 0 ? void 0 : _a.name,
+                methodName,
+                params: {
+                    ...(_b = paramRef.current) === null || _b === void 0 ? void 0 : _b.params,
+                    orderBy,
+                    orderType,
+                    pageNo: 1,
+                    pageSize,
+                },
+                pagination,
+            });
+        }
+        else {
+            if (isIdeMockData) {
+                (_c = events === null || events === void 0 ? void 0 : events.onDataChange) === null || _c === void 0 ? void 0 : _c.call(events, {
+                    data: beforeDataChange(getIdeMockData(pageSize)),
+                });
+            }
+        }
+    }, [methodName, pageSize, pagination, orderBy, orderType, datasource === null || datasource === void 0 ? void 0 : datasource.name]);
+    // props 对象类型监听，需重新分页
+    useEffect(() => {
+        var _a, _b, _c, _d;
+        if (isModel) {
+            if (!isequal((_b = (_a = paramRef.current) === null || _a === void 0 ? void 0 : _a.params) === null || _b === void 0 ? void 0 : _b.where, where)) {
+                dataRef.current = { total: 0, records: [] };
+                fetchData({
+                    params: { pageNo: 1, where },
+                });
+            }
+        }
+        else {
+            if (!isequal((_d = (_c = paramRef.current) === null || _c === void 0 ? void 0 : _c.params) === null || _d === void 0 ? void 0 : _d.connectorParams, connectorParams)) {
+                dataRef.current = { total: 0, records: [] };
+                fetchData({
+                    params: { pageNo: 1, connectorParams },
+                });
+            }
+        }
+    });
+    // 监听触底加载事件，这里面的 setLoading 用 setTimeout包裹起来，所以会先执行新的children渲染，再执行 loading
+    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 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 = () => {
+        var _a;
+        const { pageNo = 1, pageSize = 5 } = ((_a = paramRef.current) === null || _a === void 0 ? void 0 : _a.params) || {};
+        const { total = 0 } = dataRef.current || {};
+        return pageNo * pageSize < total;
+    };
+    /**
+     * 列表视图拉取数据
+     * 方法仅依赖入参和paramRef的参数
+     */
+    const fetchData = async (param) => {
+        if (loading)
+            return;
+        setLoading(true);
+        // 合并参数
+        const fetchParam = {
+            ...paramRef.current,
+            ...param,
+            params: { ...paramRef.current.params, ...param === null || param === void 0 ? void 0 : param.params },
+        };
+        const { dataSourceName, methodName, params } = fetchParam;
+        const { orderBy, orderType, pageNo, pageSize, where, connectorParams } = params || {};
+        let tcbParams = {};
+        // tcb分页参数
+        if (!isNil(pageNo) && !isNil(pageSize)) {
+            tcbParams['pageNo'] = pageNo;
+            tcbParams['pageSize'] = pageSize;
+        }
+        if (isModel) {
+            // tcb排序参数
+            if (orderBy && ORDERTYPE.includes(orderType)) {
+                tcbParams['orderBy'] = orderBy;
+                tcbParams['orderType'] = orderType;
+            }
+            // tcb过滤参数
+            const whereEffected = [].concat(getWhereList(where));
+            whereEffected.length > 0 && (tcbParams['where'] = whereEffected);
+        }
+        else {
+            tcbParams = Object.assign({}, tcbParams, connectorParams);
+        }
+        // tcb结果和事件
+        let data = [];
+        data = await (appCloud === null || appCloud === void 0 ? void 0 : appCloud.callDataSource({
+            dataSourceName,
+            methodName,
+            params: tcbParams,
+        }));
+        paramRef.current = fetchParam;
+        onEnvets(data);
+    };
+    /**
+     * 根据fetchData方法返回值，回调给外部事件
+     * datasource 是对象类型，所以总能拿到最新的值
+     */
+    const onEnvets = (data) => {
+        var _a, _b, _c, _d, _e, _f;
+        const fetchRecords = [].concat(!isRecords && !isModel ? data : (data === null || data === void 0 ? void 0 : data.records) || []); //当数据详情调用连接器时，获取回调data数据
+        const total = (data === null || data === void 0 ? void 0 : data.total) || fetchRecords.length;
+        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 || []),
+        });
+        const eventDatSource = isModel
+            ? datasource
+            : { ...bindConnectMetadata, ...connectorMethod };
+        if (JSON.stringify(data) === '{}') {
+            (_b = events === null || events === void 0 ? void 0 : events.queryFail) === null || _b === void 0 ? void 0 : _b.call(events, { datasource: eventDatSource });
+        }
+        else {
+            if (total === 0) {
+                (_c = events === null || events === void 0 ? void 0 : events.queryEmpty) === null || _c === void 0 ? void 0 : _c.call(events, {
+                    datasource: eventDatSource,
+                    data: beforeDataChange([]),
+                });
+            }
+            (_d = events === null || events === void 0 ? void 0 : events.querySuccess) === null || _d === void 0 ? void 0 : _d.call(events, {
+                datasource: eventDatSource,
+                data: beforeDataChange(dataRef.current.records),
+            });
+        }
+        setPageNo(((_f = (_e = paramRef.current) === null || _e === void 0 ? void 0 : _e.params) === null || _f === void 0 ? void 0 : _f.pageNo) || 1);
+        window.setTimeout(() => setLoading(false));
+    };
+    /**
+     * 分页，加载更多
+     */
+    const renderLoadMore = () => {
+        let disabled = !hasNextPage();
+        if (isIdeMockData) {
+            disabled = false;
+        }
+        return (!disabled &&
+            (loading ? (LoadingSymbol) : (React.createElement("div", { className: `${BLOCK_NAME}__more-text`, onClick: () => fetchData({ params: { pageNo: pageNo + 1 } }) }, "\u52A0\u8F7D\u66F4\u591A"))));
+    };
+    /**
+     * 分页，底部刷新
+     */
+    const renderBottomLoad = () => {
+        return (React.createElement("div", { ref: nodeRefCallback, className: `${BLOCK_NAME}__bottom-load` }, loading ? LoadingSymbol : !hasNextPage() && LoadEnd));
+    };
+    /**
+     * 分页，分页器，含ideMockData的判断
+     */
+    const renderPagination = () => {
+        var _a;
+        const preDisabeld = pageNo <= 1;
+        const nextDisabeld = !hasNextPage();
+        const total = ((_a = dataRef.current) === null || _a === void 0 ? void 0 : _a.total) || 0;
+        return (React.createElement("div", { className: `${BLOCK_NAME}__more-pagination` },
+            React.createElement("div", { className: classNames(`${BLOCK_NAME}__pagination-pre`, preDisabeld ? '' : 'active'), onClick: () => !preDisabeld && fetchData({ params: { pageNo: pageNo - 1 } }) }, "\u4E0A\u4E00\u9875"),
+            React.createElement("div", { className: classNames(`${BLOCK_NAME}__pagination-text`) },
+                React.createElement("span", { className: "active" }, isIdeMockData ? 1 : total ? pageNo : 0),
+                "/",
+                isIdeMockData ? 1 : Math.ceil(total / pageSize)),
+            React.createElement("div", { className: classNames(`${BLOCK_NAME}__pagination-next`, nextDisabeld ? '' : 'active'), onClick: () => !nextDisabeld && fetchData({ params: { pageNo: pageNo + 1 } }) }, "\u4E0B\u4E00\u9875")));
+    };
+    /**
+     * 加载中状态组件
+     */
+    const LoadingSymbol = (React.createElement("div", { className: `${BLOCK_NAME}__more-symbol` },
+        React.createElement("div", { className: `${BLOCK_NAME}__symbol-item` }),
+        React.createElement("div", { className: `${BLOCK_NAME}__symbol-item` }),
+        React.createElement("div", { className: `${BLOCK_NAME}__symbol-item` })));
+    /**
+     * 加载到底状态组件
+     */
+    const LoadEnd = React.createElement("div", null);
+    return (React.createElement("div", { ...rest, className: classNames('weda-ui', `${BLOCK_NAME}__containor`, className) },
+        children && (React.createElement("div", { className: template === 'cardList' ? `${BLOCK_NAME}-card` : '' }, children)),
+        React.createElement("div", { className: classNames(`${BLOCK_NAME}__more`, `${BLOCK_NAME}__more-${pagination}`) },
+            pagination === 'bottomLoad' && renderBottomLoad(),
+            pagination === 'loadMoreButton' && renderLoadMore(),
+            pagination === 'pagination' && renderPagination())));
+}