Apisix-dashboard: UI design: create new route

Created on 30 Sep 2019  ·  7Comments  ·  Source: apache/apisix-dashboard

English version:

  1. allow to select the filter
  2. allow to delete existing conditions
  3. the option host, remote address, and method, the user is allowed to enter multiple different values, use space as separator
  4. necessary conditions: uri and service, others are optional

Chinese version:

  1. 用户选择需要添加的过滤条件
  2. 也可以对已有条件删除
  3. 在 host、remote_addr 和 methods 选项中,均允许用户输入多个不同的值,空格分割
  4. 必要条件:uri 和 服务,其他均为可选
UI discuss

Most helpful comment

选项 A: 用户按需添加可选字段,对于不关心过滤条件,在界面上完全不显示

Option A: The user adds fields as needed. For the filter conditions that are not concerned, it is not displayed at all on the interface.

image

All 7 comments

选项 A: 用户按需添加可选字段,对于不关心过滤条件,在界面上完全不显示

Option A: The user adds fields as needed. For the filter conditions that are not concerned, it is not displayed at all on the interface.

image

方案 B: 界面上告诉用户所有大的选项,用户手动点击右侧的 CheckBox 决定是否开启这个可选项。

Option B: The interface tells the user all the options, the user manually clicks on the CheckBox on the right to decide whether to enable this option.

image

only uri is required, host,remote_addr and methods are optional.
plan B is the fast way to choose conditions.

I would prefer Plan A from UX side.

  1. Show required fields by default;
  2. User can set other optional fields by Filter Policies;

均允许用户输入多个不同的值,空格分割

ElementUI has provided a good component to implement the requirement above.

image

I think the plan A is simpler and easier to understand.

选项A 更合适,(必选)的界面适合所有人,隐藏的选项(界面)适合于高端玩家,高端玩家会自行探索 "+"后的奥秘

Please take a look at the new Dashboard.

Was this page helpful?
0 / 5 - 0 ratings