@blueking/ip-selector v0.3.0-beta.19
蓝鲸 IPv6 选择器
使用
service.js
export default {
fetchTopologyWithCount: (params) => {
return http.post('topology_width_count', { params })
},
fetchTopologyHost: (params) => {
return http.post('topology_host', { params })
},
fetchTopologyHostIdsNodes: (params) => {
return http.post('topology_host_ids_noodes', { params })
},
// ...
}
创建组件
import vue from 'vue';
import createFactory from '@blueking/ip-selector';
import Service from './service'
// 初始化配置,创建组件
const IpSelector = createFactory({
// 组件版本(改变版本重置用户自定义配置)
version: '',
// 需要支持的面板('staticTopo', 'dynamicTopo', 'dynamicGroup', 'serviceTemplate', 'setTemplate', 'serviceInstance', 'manualInput')
panelList: ['staticTopo', 'dynamicTopo', 'dynamicGroup', 'manualInput'],
// 面板选项的值是否唯一
unqiuePanelValue: false,
// 字段命名风格('camelCase', 'kebabCase')
nameStyle: 'camelCase',
// 主机列表全选模式,false: 本页全选;true: 跨页全选
hostTableDefaultSelectAllMode: false,
// 主机列表开启仅显示可用过滤
hostOnlyValid: false,
// 主机列表开启仅显示可用过滤时,手动输入 tab 判断主机可用的回调
manualInputHostValidMethod: () => true,
// 自定义主机列表列
hostTableCustomColumnList: [
// {
// key: 'collectStatus',
// index: 5,
// width: '100px',
// label: '采集状态',
// renderHead: h => h('span', '采集状态'),
// field: 'collect_status',
// renderCell: (h, row) => h('span', row.collect_status || '--'),
// }
],
nodeTableCustomColumnList: [], // 自定义动态拓扑列表列 同上
serviceTemplateTableCustomColumnList: [], // 自定义服务模板列表列 同上
setTemplateCustomColumnList: [], // 自定义集群模板列表列 同上
hostMemuExtends: [
// {
// name: '复制采集状态异常',
// action: () => {
// console.log('复制成功');
// },
// },
],
// 主机预览字段显示
hostViewFieldRender: (host, primaryField) => host.host_id,
// 主机列表显示列(默认值:['ip', 'ipv6', 'alive', 'osName']),按配置顺序显示列
// 内置所有列的 key ['ip', 'ipv6', 'cloudArea', 'alive', 'hostName', 'osName', 'coludVerdor', 'osType', 'hostId', 'agentId']
hostTableRenderColumnList: [],
// 创建时是否提示 service 信息
serviceConfigError: false,
// 需要的数据源配置(返回 Promise)
// 主机拓扑
fetchTopologyHostCount: Service.fetchTopologyWithCount,
fetchTopologyHostsNodes: Service.fetchTopologyHost, // (params: Object, hostOnlyValid: boolean) => Promise<any[]>
fetchTopologyHostIdsNodes: Service.fetchTopogyHostIdList, // (params: Object, hostOnlyValid: boolean) => Promise<any[]>
fetchHostsDetails: Service.fetchHostInfoByHostId,
fetchHostCheck: Service.fetchInputParseHostList,
fetchNodesQueryPath: Service.fetchNodePath,
fetchHostAgentStatisticsNodes: Service.fetchBatchNodeAgentStatistics,
// 动态分组
fetchDynamicGroups: Service.fetchDynamicGroup,
fetchHostsDynamicGroup: Service.fetchDynamicGroupHost,
fetchHostAgentStatisticsDynamicGroups: Service.fetchBatchGroupAgentStatistics,
// 服务模板
fetchServiceTemplates: Service.fetchServiceTemplates,
fetchNodesServiceTemplate: Service.fetchNodesServiceTemplate,
fetchHostServiceTemplate: Service.fetchHostServiceTemplate,
fetchHostAgentStatisticsServiceTemplate: Service.fetchHostAgentStatisticsServiceTemplate,
// 集群模板
fetchSetTemplates: Service.fetchSetTemplates,
fetchNodesSetTemplate: Service.fetchNodesSetTemplate,
fetchHostSetTemplate: Service.fetchHostSetTemplate,
fetchHostAgentStatisticsSetTemplate: Service.fetchHostAgentStatisticsSetTemplate,
// 服务实例
fetchSeriviceInstanceList: Service.fetchSeriviceInstanceList,
fetchSeriviceInstanceDetails: Service.fetchSeriviceInstanceDetails,
// DBM 白名单
fetchDBMWhitelist: Service.fetchDBMWhitelist,
// 自定义配置
fetchCustomSettings: Service.fetchAll,
updateCustomSettings: Service.update,
// 系统相关配置
fetchConfig: () => Promise.resolve()
.then(() => ({
// CMDB 动态分组链接
bk_cmdb_dynamic_group_url: `http:xx.yy.zz.com/#/business/1/custom-query`,
// CMDB 拓扑节点链接
bk_cmdb_static_topo_url: `http:xx.yy.zz.com/#/business/1/custom-query`,
// DBM 创建白名单链接
bk_dbm_whitelist: `http:xx.yy.zz.com/#/business/1/custom-query`,
// CMDB 服务模版链接
bk_cmdb_service_template_url: `http:xx.yy.zz.com/#/business/1/custom-query`,
})),
})
// 全局注册
vue.component('IpSelector', IpSelector)
组件 Props
组件 Events
实例方法
5 days ago
17 days ago
23 days ago
1 month ago
2 months ago
2 months ago
3 months ago
3 months ago
3 months ago
3 months ago
3 months ago
3 months ago
4 months ago
4 months ago
4 months ago
4 months ago
4 months ago
4 months ago
4 months ago
6 months ago
6 months ago
6 months ago
6 months ago
6 months ago
6 months ago
6 months ago
6 months ago
6 months ago
6 months ago
6 months ago
6 months ago
10 months ago
10 months ago
10 months ago
8 months ago
7 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
5 months ago
10 months ago
10 months ago
11 months ago
11 months ago
11 months ago
11 months ago
11 months ago
12 months ago
11 months ago
11 months ago
12 months ago
11 months ago
12 months ago
12 months ago
12 months ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
2 years ago
1 year ago
1 year ago
1 year ago
1 year ago
2 years ago
2 years ago
2 years ago
1 year ago
1 year ago
1 year ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago