---
order: 32
navTitle: 发送邮件
---
# SuperPage交互-发送邮件

使用**发送邮件**交互，可以给多人发送邮件，如下填写好工作周报内容后自动发送给相关同事：

![示例](./images/2021_08_17_16_27_53.gif)

示例地址：[发送邮件](https://demo.succbi.com/v5/demo-spg/发送邮件)

## 使用发送邮件{#send}

使用**发送邮件**交互可搭配输入组件进行使用，来获取邮件的接收者，主题，以及正文内容等。以自定义工作周报邮件为例：

![发送邮件](./images/2021-08-24-15-26-04.png)

1. **添加发送按钮**：在页面添加按钮，名称设为`发送`
2. **添加交互并设置属性**：
   1. 选中`发送`按钮，添加**发送邮件**交互
   2. 在交互中，设置**收件人邮箱**设为`${[收件人]}`；**抄送人邮箱**设为`${[抄送人]}`；**消息内容**选择`自定义`；**主题**设为`${[主题]}`；**正文**内容选择`${[富文本输入1].[值]}`

:::tip
发送邮件需提前配置邮件服务，在**系统设置**>**外部服务**>[邮件](../../../../sys-settings/more/remote-services/email.md)中可以设置
:::

## 接收人邮箱设置{#receiver}

在**发送邮件**的属性窗口可设置**收件人邮箱**和**抄送人邮箱**，接收人邮箱设置通常有如下使用场景：

- 想要自定义邮件的接收人，就可以与输入组件搭配使用，获取输入组件的值，如`${[收件人]}`
- 若想要邮件的接收人固定为同一人，则直接在收件人邮箱这里填写具体的邮箱
- 若邮件想要发送给多人，可以在抄送人或收件人处填写多个邮箱号以英文的`,`隔开

![收件人邮箱](./images/2021-08-24-15-24-30.png)

## 邮件内容设置{#content}

邮件的内容设置支持自定义以及模板选择。在**发送邮件**的属性窗口的**消息内容**处即可设置。

### 自定义邮件内容

根据具体的需求用户可以自定义邮件的内容，在**消息内容**属性中选择`自定义`，可以设置邮件的标题和正文内容，以下图为例：

![自定义](./images/2021-08-24-15-28-09.png)

- **标题**：邮件的标题，可输入具体的文本或获取输入组件的值，如`${[主题]}`
- **正文**：邮件的正文，提供富文本的编辑器，也可以从输入组件中获取数据，如`${[富文本输入1].[值]`

### 使用模板发送邮件

模板的选择使用户在固定场景上发送邮件更加快捷与方便。模板的设置与新建在**系统管理**>[协同办公](https://docs.succapp.com/v5/sys/settings/co)中完成。可以通过创建参数向模板传递数据，模板获取到指定的数据后就可以按照设置好的模板发送邮件。**消息内容**选择模板，同时还需要设置具体模板及模板参数，以下图为例：

![模板](./images/2021-08-24-15-53-53.png)

- **模板**：存放的是在[协同办公](https://docs.succapp.com/v5/sys/settings/co)中创建的模板，如选择`请假申请模板`
- **模板参数**：参数名称在[协同办公](https://docs.succapp.com/v5/sys/settings/co)中创建模板时进行定义，参数值可通过输入组件获取，如开始时间的参数值为`[开始时间].[值]`

## 提示信息设置{#tips}

对于邮件的发送状态也可以设置对应的提示信息，系统默认勾选**成功后显示提示**。可根据需要勾选**成功后显示提示**与**失败后显示提示**，在勾选框下面的文本框处可以设置提示的文本，在邮件发送后就会根据状态，显示[提示信息](./submit-data.md#after)。

![提示信息](./images/2021-08-16-14-14-59.png)