distribution-management/src/pages/Distributor/WxMiniApp/index.tsx

import { miniAppList } from "@/services/distributor/miniApp"
import { PageContainer, ProTable } from "@ant-design/pro-components"
import { Table } from "antd"
import { columns, childrenColumns } from "./tableConfig"
import { useAjax } from "@/Hook/useAjax"

const Page: React.FC = () => {
    let getList = useAjax((params) => miniAppList(params), { type: 'table' })
    return <PageContainer>
        <ProTable<any, any>
            headerTitle={"微信小程序列表"}
            rowKey={(r) => r.id}
            search={{
                labelWidth: 120,
            }}
            scroll={{ x: "auto" }}
            request={async (params) => {
                return await getList.run(params)
            }}
            columns={columns()}
            // showHeader={false}//隐藏标题
            // options={false}//隐藏工具栏
            // ghost={true}//幽灵模式
            // bordered
            expandable={{
                rowExpandable: (record) => record?.appCarrierList?.length > 0,
                expandRowByClick: true,
                expandedRowRender: (record) => {
                    return <Table
                        columns={childrenColumns}
                        dataSource={record.appCarrierList}
                        rowKey={(r) => r.id}
                        pagination={false}
                        size='small'
                        bordered
                    />
                },
            }}
        />
    </PageContainer>

}
export default Page