弹窗组件详细设计

弹窗


文本输入

  • 输入文本,确定,取消
  • 不需要后端给数据支持
  • 弹窗组件详细设计_第1张图片

单选

  • 单选选中,确定,取消
  • 弹窗内列表选值,筛选功能(首字母筛选)
  • 弹窗组件详细设计_第2张图片
[
    {
        "name": "Stimulus name",
        "value": "FGN1_AMP1"
    },
    {
        "name": "Stimulus name",
        "value": "FGN1_AMP2"
    }
]
  • 弹窗内表格:列头和内容
  • 弹窗组件详细设计_第3张图片
{
    "header": [
        {
            "code": "tolerance",
            "name": "tolerance"
        }
    ],
    "content": [
        {
            "tolerance": "PAV"
        },
        {
            "tolerance": "TKU"
        },
        {
            "tolerance": "PAV/TKU"
        }
    ]
}

多选

  • 多选,确定,取消
  • 弹窗组件详细设计_第4张图片
{
    "header": [
        {
            "code": "Bit",
            "name": "Bit"
        },
        {
            "code": "Index",
            "name": "Index"
        },
        {
            "code": "Connector",
            "name": "Connector"
        }
    ],
    "content": [
        {
            "Bit": 0,
            "Index": 1,
            "Connector": "S1"
        },
        {
            "Bit": 1,
            "Index": 2,
            "Connector": "S1"
        },
        {
            "Bit": 2,
            "Index": 3,
            "Connector": "S1"
        }
    ]
}

组合框(文本输入,单选)

  • 文本输入
  • 单选
  • 表格
  • 弹窗组件详细设计_第5张图片

你可能感兴趣的:(弹窗组件详细设计)