# 联盟链后台产品开发原型

By [36dge](https://paragraph.com/@36dge) · 2022-04-01

---

联盟链的高吞吐量、高TPS、可插拔的共识机制以及需要许可的特点让联盟链和真实的商业场景使用更为契合，此外联盟链节点的准入机制、审计治理方面都积极拥抱现有的法律法规框架，联盟链商用已经走进了经济活动的很多方面。为减低个人和公司的使用门槛，联盟链底层的技术实现和复杂的交互操作都被封装成了组件，在最外层搭建了可视化的操作平台Bass，减低商业主体接入联盟链服务的使用成本。本文提供了一套用户视角下联盟链平台的开发原型。将主体部分：工作台、主机管理、链管理、节点管理、预警管理和浏览器等操作页面做了可视化。

**工作台**

![工作台第一屏](https://storage.googleapis.com/papyrus_images/cddc49ccd8c487fd4038ad41547ee5d445bdc7108c5657d3ec85463ce5373d69.jpg)

工作台第一屏

> 工作台是后台进入的第一个页面。主要提供用户最想要的数据展示和业务操作，一般采用**卡片容器组件**，根据业务的不同可以采用数据卡片和图标卡片。

![工作台第二屏](https://storage.googleapis.com/papyrus_images/4b01471faf51c3b069484eb2adef3c27c9441cf37142650097006fc2580d042d.jpg)

工作台第二屏

> 显示创建的联盟链最近打包的区块和交易数据

![工作台第三屏](https://storage.googleapis.com/papyrus_images/d4b74dae02048bb79babdddee8648f12591e6cf386ebc9bc85c6e86654d4af50.jpg)

工作台第三屏

> 采用页签组件组织信息：用户使用产品说明、目前市场常用的合约模板和公司提供服务的社群动态。这些信息帮助用户更快、更容易的体验使用产品。

### 主机配置流程

部署任何链服务，必须首先购买配置一台主机。

![主机邀请页面](https://storage.googleapis.com/papyrus_images/7c2c2c85a699b4a77c925383cc6a72f4e5f2c983be1ab1bbfa2f342031faed7e.jpg)

主机邀请页面

> 创建联盟链服务的前置条件是账户下必须拥有一台云主机，为链提供底层的存、计、通服务。第一次进入未来更好的用户体验，要使用**邀请页**，进行用户行为引导。

![主机配置](https://storage.googleapis.com/papyrus_images/286c113d7eb50ec04cbe3dfe41f550d4406ee0c5016f587ba854e2b6d1063f90.jpg)

主机配置

![订单信息](https://storage.googleapis.com/papyrus_images/0c6d6d943589a9536b6be8189fe5cf80dc2b6234587e9a86e945eecfcf16f325.jpg)

订单信息

![支付页面](https://storage.googleapis.com/papyrus_images/7a30e9f156f904c6e1c404b733b851c4479060cab9e560e35d2eab60b72c4e20.jpg)

支付页面

![订单支付成功页](https://storage.googleapis.com/papyrus_images/2c5d82ad43567df32d7ff3e5cca9b55d400072d56e99a189ca960b321aa8cdba.jpg)

订单支付成功页

![主机列表页](https://storage.googleapis.com/papyrus_images/8c31e1f48385bbf02f28dff2219eee68ef48a16198aea0fd23cb1ca56b25302a.jpg)

主机列表页

![主机详情页](https://storage.googleapis.com/papyrus_images/370a4c2ddbe71f0937856fd14183f7d47e4ada76b2ae121806f43be5baa721dd.jpg)

主机详情页

### 链管理

对联盟链进行增、删、查、改等动态操作。

![服务邀请](https://storage.googleapis.com/papyrus_images/0f5691ea241f9a37026e011fac4fd7f2e33ed1c815d204e6cb537290016b2dea.jpg)

服务邀请

![链属性配置](https://storage.googleapis.com/papyrus_images/e53ef51792b60e7194c10aa52881ed522e4609f8c8aeecb60f0e3329fcbdfe66.jpg)

链属性配置

![配置主机和节点](https://storage.googleapis.com/papyrus_images/a99ca77586130d8d3715a81565e62a20981a6a0791d3337ef9d1bd2e571c0398.jpg)

配置主机和节点

![链配置信息确认页](https://storage.googleapis.com/papyrus_images/5a52937e9c0be5258c5c855667008ed4cfabf2f6387c44cf9f7259b95ee2fe85.jpg)

链配置信息确认页

> 下面两步是订单信息确认和订单支付，流程同主机配置。

> 一般一个主体不会有很多链创建，所以可以采用卡片容器组织信息呈现，不采用列表形式，给用户更好的视觉体验。

![链详情页](https://storage.googleapis.com/papyrus_images/257e2679eee694fd0ccc1f2835e444164776c55e8188130ddc646a8c0561dd25.jpg)

链详情页

### 节点管理

节点管理是对链上的具体运营节点进行相关的配置管理过程。

![节点列表页](https://storage.googleapis.com/papyrus_images/42834abf098e9eae32857ac7771abb2f15c5a4b6e6cde295891521101fbcae35.jpg)

节点列表页

> 下面两步为订单信息确认和订单支付，流程同主机配置。

![新增节点页](https://storage.googleapis.com/papyrus_images/b607074aa5679317490b54bfdb013c0be53182d95c20f562df289d3b40ff22f7.jpg)

新增节点页

### 链监控

![链监控总览页](https://storage.googleapis.com/papyrus_images/c53eb14580856797fc20966f1447c0c53f2b8a9c3f78c6432edeb53564ce6240.jpg)

链监控总览页

> 链监控分2个方面：\*\*链和链上节点 ，\*\*此页可用页签组织信息。

![链监控详情页-链监控](https://storage.googleapis.com/papyrus_images/cdf3cb42f7e54830411963387aabe5df13c8afd9fbd49bc65d2114e57efe520d.jpg)

链监控详情页-链监控

![链监控详情页-节点监控](https://storage.googleapis.com/papyrus_images/d7111e3a96a18eb70f6c5e8fcb3c7802e6516b9fdbe0934bee71d08b69bac57b.jpg)

链监控详情页-节点监控

![节点监控详情页](https://storage.googleapis.com/papyrus_images/0868a48a10abe9a5f8d044b1bbc28ada4a5bf38a409e64b22e76d0664657db89.jpg)

节点监控详情页

### 告警规则管理

告警规则管理是指系统可以根据用户设定的条件，当链服务触发用户设定的条件时，进行用户信息告知的管理过程。

![创建规则邀请页](https://storage.googleapis.com/papyrus_images/141aa9b6c29adb853c7f31c4c29c88f885a4338feee48c0b46d1cd61f8724b26.jpg)

创建规则邀请页

![告警规则通配置页](https://storage.googleapis.com/papyrus_images/67848bd61e40981ff33bcafef285a79869340867f56b2c5816a2763ffc68ce57.jpg)

告警规则通配置页

![设置告警规则通知方式页](https://storage.googleapis.com/papyrus_images/3cb535e66c7c4f49675a5def578cb65cffb54030158763f8bc29559e8e279a65.jpg)

设置告警规则通知方式页

### 联盟链浏览器

![联盟链浏览器页面](https://storage.googleapis.com/papyrus_images/1e024d3791731d07809a9a74c18918b9f601445dd29eef8120a6d42d12623e21.jpg)

联盟链浏览器页面

一套完整的用户端联盟链操作平台除了以上主要部分的页面组成外，还要有用户认证、密钥管理、消息中心等。和区块链业务结合比价多的是密钥管理，可以多看些这方面的知识，了解共钥、私钥、密钥多签等方面的知识，此篇文就不再做可视化原型的分析和制作了。

---

*Originally published on [36dge](https://paragraph.com/@36dge/LZ9QMEChJ3ICOvTaOg4N)*
