Entity

1
() => {
2
  const { Avatar } = KubeIcon;
3
  return <Field avatar={Avatar} label="存储类型: rocksdb" value="rocksdbpvc" />;
4
};
5

1
() => {
2
  const { Avatar } = KubeIcon;
3
  return (
4
    <Entity>
5
      <Field avatar={Avatar} label="存储类型: rocksdb" value="rocksdbpvc" />
6
      <Field label="存储卷" value="rocksdbpvc" />
7
      <Field label="容量" value="1Gi" width={100} />
8
      <Field label="访问模式" value="ReadWriteOnce" />
9
    </Entity>
10
  );
11
};
12

1
() => {
2
  const { Docker, Pod, Avatar } = KubeIcon;
3
  const footer = (
4
    <>
5
      <div style={{ display: 'inline-flex', minWidth: '200px', alignItems: 'center' }}>
6
        <Docker size={20} style={{ marginRight: '8px' }} />
7
        <Text weight={500}>moqlus-runtime</Text>
8
      </div>
9
      <div style={{ display: 'inline-flex', minWidth: '200px', alignItems: 'center' }}>
10
        <Pod size={20} style={{ marginRight: '8px' }} />
11
        <Text weight={500}>moqlus-runtime</Text>
12
      </div>
13
    </>
14
  );
15

16
  return (
17
    <Entity hoverable footer={footer}>
18
      <Field avatar={Avatar} label="存储类型: rocksdb" value="rocksdbpvc" />
19
      <Field label="存储卷" value="rocksdbpvc" />
20
      <Field label="容量" value="1Gi" width={100} />
21
      <Field label="访问模式" value="ReadWriteOnce" />
22
    </Entity>
23
  );
24
};
25