StatisticCard的chart属性

StatisticCard组件的chart属性用于设置图表的相关配置，包括以下几个属性：

- type：图表类型，支持line、bar、pie、radar、funnel、gauge、scatter等多种类型；
- data：图表数据；
- options：图表的配置项，包括标题、图例、x轴、y轴等；
- seriesSettings：系列配置，用于对不同系列进行个性化设置；
- toolboxSettings：工具箱配置，包括数据视图、下载图片、刷新等工具；
- tooltipFormatter：提示框内容格式化函数，用于自定义提示框的显示内容。

例如，设置一个折线图的配置可以如下所示：

chart: {
  type: 'line',
  data: {
    // 图表数据
  },
  options: {
    // 图表配置项
  },
  seriesSettings: {
    // 系列配置
  },
  toolboxSettings: {
    // 工具箱配置
  },
  tooltipFormatter: function (params) {
    // 提示框内容格式化函数
  }
}

相关问题

<StatisticCard.Group direction="row"> <StatisticCard statistic={{ title: '订单编号', value: detailData?.orderUuid || '-', groupSeparator: '' }} /> <StatisticCard.Divider type="vertical" /> <StatisticCard statistic={{ title: '下单时间', value: detailData?.createTime || '-' }} /> <StatisticCard.Divider type="vertical" /> <StatisticCard statistic={{ title: '订单状态', value: DDZT_ENUM?.[detailData?.orderStatus]?.text || '-', suffix: detailData?.orderType ? ( <span style={{ color: 'red', fontSize: 14 }}> （{DDLX_ENUM?.[detailData?.orderType]?.text}） </span> ) : null }} chart={ detailData?.orderStatus === '2' ? ( <Button style={{ marginTop: 10 }}>发货</Button> ) : detailData?.orderStatus === '3' ? ( <span style={{ fontSize: 13 }}>7天内不确认收货，系统自动收货</span> ) : null } chartPlacement="right" /> </StatisticCard.Group>使title和数值展示在一行

这段代码使用了 Ant Design 的 StatisticCard 组件来展示数据，其中每个 StatisticCard 组件都代表一个数据项，包含了 title、value 等属性。

为了让 title 和 value 展示在同一行，这里使用了 StatisticCard.Group 组件，并将其 direction 属性设置为 "row"，表示子组件按行排列。

具体来说，每个 StatisticCard 组件中的 title 和 value 都分别设置在一个 span 标签中，这样它们就能够在同一行展示。而使用 StatisticCard.Divider 组件则可以在 title 和 value 之间添加一个竖向的分隔线。

需要注意的是，这段代码中的 detailData、DDZT_ENUM、DDLX_ENUM 等变量都是在其他地方定义的，这里只是将它们用作数据渲染的参数。同时，还使用了一些条件判断和三目运算符来控制组件的展示和样式。