Modal 弹窗
一种打断当前操作的模态视图，用于显示重要提示或请求用户进行重要操作
构成
Modal Title
The "planned commission" operation carries certain risks; it is advisable to read the user instructions before use and carefully verify the transaction data.
Checkbox
Secondary
Primary
1
4
2
3
1: 标题
可选，支持业务自定义
2: 正文
必有，当触发最大高度时，内容区内可滑动，支持业务自定义
3: checkbox
可选，可跟随内容区滚动
4: footer
可选，一般为文字按钮 或 button group
1: 标题
可选，支持业务自定义
2: 自定义区域
必有，业务根据需求传进具体内容（包括但不限于文字描述、表单、表格、步骤条、通知、筛选器等功能组件，或自定义模块卡片等自定义样式）
3: 正文
必有，当触发最大高度时，内容区内可滑动，支持业务自定义
4: checkbox
可选，可跟随内容区滚动
5: footer
可选，一般为button group
6: 占位图
可选，默认为状态icon，支持业务自定义，当占位图开启时，顶部标题需隐藏
Modal Title
❖
Replace me
The "planned commission" operation carries certain risks; it is advisable to read the user instructions before use and carefully verify the transaction data.
Checkbox
Secondary
Primary
Modal Title
The "planned commission" operation carries certain risks; it is advisable to read the user instructions before use and carefully verify the transaction data.
Secondary
Primary
Text Modal 纯文字弹窗：
Slot Modal 自定义弹窗：
1
2
5
3
4
6
变体/类型
Text Modal 纯文字弹窗：
全部配置开关打开：
Modal Title
The "planned commission" operation carries certain risks; it is advisable to read the user instructions before use and carefully verify the transaction data.
Checkbox
Secondary
Primary
无footer：
Modal Title
The "planned commission" operation carries certain risks; it is advisable to read the user instructions before use and carefully verify the transaction data.
无标题&关闭：
The "planned commission" operation carries certain risks; it is advisable to read the user instructions before use and carefully verify the transaction data.
Secondary
Primary
Slot Modal 自定义弹窗：
常规自定义（带Checkbox）：
Modal Title
❖
Replace me
The "planned commission" operation carries certain risks; it is advisable to read the user instructions before use and carefully verify the transaction data.
Checkbox
Secondary
Primary
无标题&内容：
❖
Replace me
Secondary
Primary
无footer：
Modal Title
❖
Replace me
只有slot：
❖
Replace me
状态：
Modal Title
The "planned commission" operation carries certain risks; it is advisable to read the user instructions before use and carefully verify the transaction data.
Secondary
Primary
使用场景
Modal Title
The "planned commission" operation carries certain risks; it is advisable to read the user instructions before use and carefully verify the transaction data.
Secondary
Primary
类型说明：
何时使用 纯文字弹窗：
要求用户立即响应
通知用户紧急信息
确认用户决定
何时使用 自定义弹窗：
当纯文字无法支持需求所需的样式时
需要对功能功能介绍、引导、操作、反馈等
Modal为模态弹窗，是会打扰用户流程的提示，如上描述，必要且紧急的提示，可考虑用Modal，其他情况优先考虑BottomSheet
标注
Text Modal 纯文字弹窗：
全部配置开关打开：
Modal Title
The "planned commission" operation carries certain risks; it is advisable to read the user instructions before use and carefully verify the transaction data.
Checkbox
Secondary
Primary
无footer：
Modal Title
The "planned commission" operation carries certain risks; it is advisable to read the user instructions before use and carefully verify the transaction data.
无标题&关闭：
The "planned commission" operation carries certain risks; it is advisable to read the user instructions before use and carefully verify the transaction data.
Secondary
Primary
Slot Modal 自定义弹窗：
常规自定义（带Checkbox）：
Modal Title
❖
Replace me
The "planned commission" operation carries certain risks; it is advisable to read the user instructions before use and carefully verify the transaction data.
Checkbox
Secondary
Primary
无标题&内容：
❖
Replace me
Secondary
Primary
无footer：
Modal Title
❖
Replace me
只有slot：
❖
Replace me
状态：
Modal Title
The "planned commission" operation carries certain risks; it is advisable to read the user instructions before use and carefully verify the transaction data.
Secondary
Primary
sm
16
sm
16
sm
16
sm
16
md
24
sm
16
sm
16
sm
16
md
24
sm
16
sm
16
sm
16
sm
16
sm
16
sm
16
sm
16
sm
16
sm
16
md
24
sm
16
xsm
12
md
24
sm
16
sm
16
标注说明：
弹窗标题文字 18 Bold，正文 14 Medium
当弹窗有button时，body下padding为24px，当无button时，body下padding为16px
当弹窗样式为状态弹窗时（即顶部是占位图），顶部默认标题不展示，需打开下方body标题+正文
多语言适配
标题超长：最多两行，仍超长动态缩小到16，仍超长则省略
按钮超长：动态缩小，效果不佳时可按钮换行
Modal Title Modal Title Modal Title Modal Title Modal Title Modal Title Modal Title...
The "planned commission" operation carries certain risks; it is advisable to read the user instructions before use and carefully verify the transaction data.
Secondary
Primary
Modal Title Modal Title Modal Title Modal Title Modal Title Modal Title Modal Title ...
❖
Replace me
Secondary
Primary
Modal Title
The "planned commission" operation carries certain risks; it is advisable to read the user instructions before use and carefully verify the transaction data.
Secondary Button
Primary Button
Modal Title
❖
Replace me
Secondary Button
Primary Button
Modal Title
The "planned commission" operation carries certain risks; it is advisable to read the user instructions before use and carefully verify the transaction data.
Primary Button
Secondary Button
Modal Title
❖
Replace me
Primary Button
Secondary Button
16
16
RTL
Modal Title
The "planned commission" operation carries certain risks; it is advisable to read the user instructions before use and carefully verify the transaction data.
Checkbox
Secondary
Primary
LTR
عنوان مودال
عملیات «کمیسیون برنامهریزیشده» خطرات خاصی را به همراه دارد؛ توصیه میشود قبل از استفاده، دستورالعملهای کاربر را مطالعه کرده و دادههای تراکنش را با دقت تأیید کنید.
کادر انتخاب
ثانویه
اولیه
RTL
用法
Notification
Delete this item?
Cancel
Delete
正确
Notification
Delete this item?
No
Yes
错误
对于风险操作，建议主按钮加强程度，使用危险/错误的红色进行提示，避免误操作，语义也需要更加明确