本文将介绍如何快速通过魔笔低代码开发平台搭建一个自定义云产品管控台。
方案概览
阿里云通过 OpenAPI 提供了强大的云产品集成能力，帮助用户灵活应对多样化需求。对于同时使用多个云产品的用户，或是有定制化运维流程和独特信息展示需求的场景，默认的云产品控制台可能无法完全满足要求。而借助魔笔低代码平台上的低代码应用开发界面及内置的阿里云 OpenAPI 连接器，用户可以快速构建和定制符合自身需求的专属云产品控制台，从而更高效地实现个性化的运维管理和信息展示。
访问方式
您可以通过浏览器访问魔笔控制台以开始您的应用搭建。
什么是魔笔
魔笔是为阿里云专业开发者量身打造的 AI 原生化的低代码应用开发平台，集成了阿里云 OpenAPI 连接器、通义千问大模型连接器等多种连接器，让开发更智能、应用更智能。魔笔提供一站式的应用全生命周期管理，包括可视化开发、发布、运维；基于云原生架构的弹性扩展和低成本运维服务，帮助开发者高效地解决应用研发、迭代、运维的问题。
最终效果
服务器实例列表页
服务器实例详情页
安全组详情页
添加安全组规则表单
页面搭建
创建阿里云 OpenAPI 连接器
首先，你需要在“资源 -> 集成”菜单中，新建一个“阿里云 OpenAPI”类型的连接器：
随后在配置界面中，填写你的阿里云访问密钥（ AccessKeyID 和 AccessKeySecret ）：
然后你就可以在 Mobi 2.0 的编辑器中，轻松的调用阿里云 OpenAPI 了。本教程中会涉及到以下 OpenAPI 的调用：
查询地域列表；
查询实例详情；
查询安全组列表；
查询安全组详情；
因为安全原因，本教程中不涉及对 ECS 的高危操作（删除、变更），用户可以自行参考本教程加入高危功能。
布局搭建
布局搭建中，主要涉及到如下阿里云 OpenAPI 操作：
查询地域列表
首先，在 Mobi 2.0 中创建一个新的空项目：
首先，我们为页面添加一个布局组件：
我们先删除所有预置的页头元素，在页头处添加一个“单选下拉框”，用于地域的选择。随后，在左侧导航栏中，添加一个“实例”的菜单项。
为了获取我们的 ECS 地域列表，我们可以通过前文创建的阿里云 OpenAPI 连接器，创建一个集成操作，将其与下拉框绑定：
同时，我们添加一个全局变量currentRegion，用以存储下拉框选中的值：
随后，在下拉框的“数据源”中，将集成操作的返回值作为其数据源：
同时，在“事件”中，为其绑定一个“设置变量”操作，将currentRegion的值设置为下拉框当前选中的值。
此时，下拉框即可展示所有ECS的地域选项了。
实例列表页面搭建
随后，我们进行“实例”页面的设计。首先，我们复用同一个阿里云 OpenAPI 连接器，创建一个“获取实例列表”的集成操作：
可以看到，上图中，我在RegionId字段中填写了一个表达式，在自动运行的触发模式下，它可以在变量变更时自动执行集成操作，为页面的逻辑设计提供便利。
我们继续开始页面设计，首先拖拽一个表格组件到页面中，随后设置其数据源和第一列的展示逻辑：
在“标签”栏的设计中，我们自定义逻辑，将容器服务托管的ECS用一个标签展示：
随后，我们根据 OpenAPI 中提供的字段，继续完成剩余列的构建：
在表格的设计面板中，开启服务端分页，并将集成操作的值填入对应的输入框中，即可实现分页功能：
其他页面的搭建
因为篇幅原因，本文不再详细介绍其他页面的详细搭建流程。用户可以自行使用ECS控制台模板进行探索。