table配置语法

一、表格自定义字段

• label

配置前端展示的表格中每列的名字

• row

表示在资源的json文件中的哪里去找到这个列属性的值，当kind被设置为 externalLink 的时候，这里通过row找到的列属性的值为一个外部链接

• kind

用来表示该列是什么样的格式，支持几种不同的配置

  - 不配置

不配置就默认以字符的形式展示

  - internalLink

表示该列是个项目内的链接，点击之后会跳转到项目中的另一个页面

  - externalLink

表示该列是一个外部链接，点击之后会打开一个新的页面

  - terminal

表示该列展示的是一个可点击的终端图标，点击之后会跳转到一个终端连接的页面

  - action

表示该列展示支持的一系列操作，默认会有删除和更新操作

  - tag

表示该列是以标签的形式展示，标签的内容从row字段中获取

• link

link一般与internalLink搭配使用，表示要跳转到另一个页面的名字（需要对vue中的路由配置name属性）

  - 直接指定一个组件的名字

表示直接表示要跳转的页面在路由配置中的名字

  - 以@字符开头，后面接该对象的某一个属性的全路径xxx.yyy.zzz的形式

表示需要通过@后面的信息解析出要跳转的页面在路由配置中的名字

• tag

tag一般与internalLink搭配使用，表示跳转到某一个页面之后之后所携带的筛选条件，一般是该对象json文件中的某个字段的全路径xxx.yyy.zzz，其中的.需要换成#，也即xxx#yyy#zzz的形式，目前只支持一个属性的填写。该条件对应的值为row所定义并解析出来的值，这时row可以有两种写法，分别是带有@的和没有@的，区别是带有@的在该列会统一显示label所定义的内容，不带@的会在该列的每行显示@后的某个属性的具体值。

{
    "apiVersion": "doslab.io/v1",
    "kind": "FrontendTable",
    "metadata": {
        "name": "table-pod",
        "namespace": "default"
    },
    "spec": [{
            "kind": "internalLink",
            "label": "Pod名",
            "link": "podInfo",
            "row": "metadata.name",
            "type": "input"
        },
        {
            "kind": "internalLink",
            "label": "命名空间",
            "link": "Namespace",
            "row": "metadata.namespace",
            "tag": "metadata#name"
        },
        {
            "label": "IP地址ַ",
            "row": "status.podIP"
        },
        {
            "kind": "internalLink",
            "label": "父类资源",
            "link": "@metadata.ownerReferences[0].apiVersion+metadata.ownerReferences[0].kind",
            "row": "metadata.ownerReferences[0].kind"
        },
        {
            "kind": "internalLink",
            "label": "父类资源名",
            "link": "@metadata.ownerReferences[0].apiVersion+metadata.ownerReferences[0].kind",
            "row": "metadata.ownerReferences[0].name",
            "tag": "metadata#name"
        },
        {
            "label": "运行状态",
            "row": "status.phase"
        },
        {
            "label": "所在主机",
            "kind": "internalLink",
            "link": "Node",
            "tag": "metadata#name",
            "row": "spec.nodeName"
        },
        {
            "label": "创建时间",
            "row": "metadata.creationTimestamp"
        },
        {
            "kind": "terminal",
            "label": "远程连接",
            "link": "http://39.106.40.190:31052?pod={1}&namespace={2}",
            "row": "metadata.name,metadata.namespace"
        },
        {

            "kind": "action",
            "label": "更多操作"
        }
    ]
}

二、示例说明

2.1 简单展示所需信息

{
            "label": "name",
            "row": "metadata.name"
}

其显示效果如下：

2.2 内部显示条件跳转

   当前显示spec.nodeName内容，条件{key: metadata##name，value: spec.nodeName}，跳转到Node。

{
      "label": "所在主机",
            "kind": "internalLink",
            "link": "Node",
      "row": "spec.nodeName",
            "tag": "metadata##name"
}

    如，显示spec.nodeName内容ubuntu，跳转到物理机列表，只返回一台ubuntu的物理机（尽管该集群存在多个物理机）。<br />![image.png](https://cdn.nlark.com/yuque/0/2021/png/99567/1630846467333-1ad98a55-2e33-4d40-83bd-929ebee9543c.png#clientId=udc7d5981-3078-4&from=paste&height=214&id=u164b23a9&margin=%5Bobject%20Object%5D&name=image.png&originHeight=427&originWidth=1458&originalType=binary&ratio=1&size=69963&status=done&style=none&taskId=uc86b7ce5-7e67-46e2-87da-048d0765157&width=729)

2.3 内部隐式条件跳转

 与显示条件跳转不同的是row最前面加了@号。其效果是，不显示metadata.name内容，而是显示条件{key: spec##nodeName，value: metadata.name}跳转到Pod的个数，并实施跳转。

{
    "kind": "internalLink",
    "label": "关联实例",
    "link": "Pod",
    "row": "@metadata.name",
    "tag": "spec##nodeName"
 },

  如，关联实例未显示metadata.name，而是4，是通过{key: spec##nodeName，value: metadata.name}跳转到Pod查询出来的，运行在metadata.name物理机上的Pod个数。<br />![image.png](https://cdn.nlark.com/yuque/0/2021/png/99567/1630846875181-f28116e3-7b33-4d1e-8198-bf1e80c45c36.png#clientId=udc7d5981-3078-4&from=paste&height=213&id=u74e84f19&margin=%5Bobject%20Object%5D&name=image.png&originHeight=426&originWidth=1409&originalType=binary&ratio=1&size=61439&status=done&style=none&taskId=u587ae37b-0964-4756-8c43-0ddd3fd6d9e&width=704.5)<br />![image.png](https://cdn.nlark.com/yuque/0/2021/png/99567/1630846890137-605d9b9c-e552-427b-9a32-eef4f929a945.png#clientId=udc7d5981-3078-4&from=paste&height=254&id=ued5f473b&margin=%5Bobject%20Object%5D&name=image.png&originHeight=508&originWidth=1414&originalType=binary&ratio=1&size=89399&status=done&style=none&taskId=u86c1c052-988e-425b-926c-4cb7169fa50&width=707)

2.4 根据字段进行外链

    当前显示为metadata.name，跳转到spec.url，其中@是关键字，表示从spec.url进行验证

{
                "kind": "externalLink",
                "label": "软件仓库",
                "link": "@spec.url",
                "row": "metadata.name"
},

   如metadata.name是operator-hub，其跳转到新的页面operatorhub.io。<br />![image.png](https://cdn.nlark.com/yuque/0/2021/png/99567/1630851770293-c26169c7-8164-452b-aef6-c9c42de545d4.png#clientId=u6c1832b0-de4f-4&from=paste&height=189&id=u0bc6cff1&margin=%5Bobject%20Object%5D&name=image.png&originHeight=377&originWidth=1488&originalType=binary&ratio=1&size=46586&status=done&style=none&taskId=u455e6d92-3036-42e6-9314-1ed5ffef9f7&width=744)<br />![image.png](https://cdn.nlark.com/yuque/0/2021/png/99567/1630851822015-bd371831-65bc-48ef-9b92-dabbcd66edf7.png#clientId=u6c1832b0-de4f-4&from=paste&height=463&id=u0d5b7e32&margin=%5Bobject%20Object%5D&name=image.png&originHeight=926&originWidth=1681&originalType=binary&ratio=1&size=577097&status=done&style=none&taskId=ud1b5edab-f3c8-4ebf-9c20-80c81629494&width=840.5)

1. terminal的用法

   {
                "kind": "terminal",
                "label": "远程连接",
                "link": "http://39.106.40.190:31052?pod={1}&namespace={2}",
                "row": "metadata.name,metadata.namespace"
            },