import { Meta, Story, Canvas } from '@storybook/addon-docs';
import PageActions from '.';
import NewLayout from '../new-layout';

<Meta title="布局/页脚操作按钮 PageActions" component={PageActions} />

# 页脚操作按钮 PageActions

## 导入

```typescript
import { PageActions } from '@ahri-ui/core';
```

## 基本使用

<Canvas>
  <Story name="基本使用">
    <PageActions
      primaryAction={{ content: '保存', onClick: () => console.log('保存') }}
      secondaryActions={[{ content: '删除', onClick: () => console.log('取消') }]}
    />
  </Story>
</Canvas>

## 实际使用中基本都是配合 NewLayout 使用

<Canvas>
  <Story name="实际使用中基本都是配合NewLayout使用">
    <NewLayout>
      <NewLayout.Section>
        <NewCard sectioned>卡片内容</NewCard>
      </NewLayout.Section>
      <NewLayout.Section>
        <PageActions
          primaryAction={{ content: '保存', onClick: () => console.log('保存') }}
          secondaryActions={[{ content: '删除', onClick: () => console.log('取消') }]}
        />
      </NewLayout.Section>
    </NewLayout>
  </Story>
</Canvas>

## API

| 参数             | 说明                                     | 类型                 | 默认值 |
| ---------------- | ---------------------------------------- | -------------------- | ------ |
| primaryAction    | 页面的主要操作，支持所有 Button 属性     | ContentButtonProps   | -      |
| secondaryActions | 页面的辅助操作数组，支持所有 Button 属性 | ContentButtonProps[] | -      |