tarsier-vue-tools关系遍历API组件

2021-07-09 by uino 22 tarsier-vue 研发

ps:不配置 urls 的情况下依赖于公共组件服务中台接口

使用方法一(全局注册方式)

注册

// index.js
import { TraversalStore, Traversal } from "uino-tarsier-vue-lib";
Vue.component('Traversal', Traversal)
store.registerModule('TraversalStore', TraversalStore)

使用方法

// *.vue:
<template>
  <Traversal :urls="urls" :rule-id="id" />
</template>
<script>
  export default {
    data() {
      return {
        urls:{ // Object
          PRE:'/tarsier-comm/permission', // 前缀 
          PRE2:'/tarsier-comm/cmdb', // cmdb前缀 
          SEARCH_RLTRULE_BY_ID: '/rltRule/getById', 
          QUERY_CI_BY_CLASSID: '/ci/queryPageByIndex',
          QUERY_CIFRIEND_BY_CIID: '/graphAnaly/queryCiFriendByCiIdAndRule'
        },
        id:'' // String 格式
      };
    }
  }
</script>

使用方法二(局部注册方式)

注册方法

  1. 组件的store需要注册到全局的vuexstore中并命名TraversalStore
  2. 传入参数urls对象,默认配置为/tarsier-comm/permission的后台地址
// store.js:
import { TraversalStore } from 'uino-tarsier-vue-lib';
export default new Vuex.Store({
  state:{},
  modules:{
    TraversalStore
  }
});
</script>

使用方法

// *.vue:
<template>
  <Traversal :urls="urls" :rule-id="id" />
</template>

<script>
  import { Traversal } from  'uino-tarsier-vue-lib';
  export default {
    components: {
      Traversal
    },
    data() {
      return {
        urls:{ // Object
          PRE:'/tarsier-comm/permission', // 前缀 
          PRE2:'/tarsier-comm/cmdb', // cmdb前缀 
          SEARCH_RLTRULE_BY_ID: '/rltRule/getById', 
          QUERY_CI_BY_CLASSID: '/ci/queryPageByIndex',
          QUERY_CIFRIEND_BY_CIID: '/graphAnaly/queryCiFriendByCiIdAndRule'
        },
        id:'' // String 格式
      };
    }
  }
</script>

urls, 地址配置说明

  • PRE: 地址前缀
  • PRE2: CMDB地址前缀
  • SEARCH_RLTRULE_BY_ID: 获取规则信息
  • QUERY_CI_BY_CLASSID: 获取CI接口地址
  • QUERY_CIFRIEND_BY_CIID: 获取 CIfriend 接口地址