nti-datasource

nti-datasource 设计器数据源请求包含SQL、事务流、微服务、通用API、OT等请求方式

初始化

npm i nti-datasource

全局注册

import { ntiDatasourceInstall } from 'nti-datasource'
Vue.use(ntiDatasourceInstall);

组件注册

import Vue from 'vue'
import { ntiDatasource } from 'nti-datasource'
Vue.component(ntiDatasource.name, ntiDatasource)

配置信息

• 使用插件时需要从缓存获取sessionKey、engineeringId、spaceId、bucketId等信息
• 代理配置

  // vue.config.js -> devServer -> proxy
  '/nti-datasource': {
    //开发环境
    target: 'https://it-test.nti56.com',
    changeOrigin: true,
    pathRewrite: {
      '^/nti-datasource': ''
    }
  },

参数说明

入参

入参	说明	类型	默认值
showOtherSourceList	显示类型（1-sql，2-事务流，3-微服务，4-通用API，5-OT，6-外部API）	[]	['1','2','3','4','5']
type	展示类型	tab/select	tab
plugin	初始化数据	{}	见详细参数说明
pluginId	-	-	-
categoryLabel	模块名称	string	模块
projectAndCategoryVisible	是否显示工程模块	boolean	true
moreSqlVisible	是否执行多条	boolean	false
paginationVisible	是否分页	boolean	false
isReceiveAll	是否全部参数返回	boolean	false
msgVisible	-	-	-
showOtherSource	是否显示除sql外的其他数据源	boolean	true

回调事件

事件名	说明	类型	返参
autoLoadParams	参数变化	params	见详细参数说明
apiResParamsUpDate	api参数更新	-	-
onChangeDataSource	数据源变化	-	-

插槽

插槽名	说明
header	头部
footer	尾部

请求调用

this.$ntiDatasource(params) // params参数见详细参数说明 ↓
  .then(res => {
    // 成功的回调
  })
  .catch(err => {
    // 失败的回调
  })

详细参数说明

字段	说明	类型	默认值
type	数据源类型（1-sql/2-事务流/3-微服务/4-通用API/5-OT/6-外部API）	string	'1'
childProjectId	子工程id	string
categoryId	分类id	-
datasourceId	数据源id	-
datasourceIdList	数据源列表（执行多条sql）	-
isMoreSql	是否执行多条sql	boolean	false
isPagination	是否分页	boolean	false
isReceiveAll	是否全部参数返回	boolean	false
apiType	-	-	-
apiId	-	-	-
apiInterface	-	-	-
hasOTServer	-	-	-
otInterfaceUrl	-	-	-
otUrlDetailUrl	-	-	-
otConfig	ot配置项（serverName-服务名、uri-服务地址、httpType-请求类型、otEngineeringId-ot工程id）	{}	-
params	请求的参数，例如分页参数 { rows: 10 }	{}	-
_$requestParams	请求参数格式	-	-
_$responseParams	返回参数格式	-	-

返参 type 类型 1-字符串/2-整数/3-小数/4-日期/5-对象/6-对象数组/7-其他数组/8-密文

使用示例

// 组件引用
<nti-datasource
  ref="datasource"
  type="select"
  :showOtherSourceList="[1, 2, 3, 4, 5]"
  @autoLoadParams="autoLoadParams"
  @onChangeDataSource="onChangeDataSource"
/>

// 发起请求
let params = {
  apiId: '',
  apiInterface: '',
  apiType: '',
  categoryId: '1554703794118631426',
  childProjectId: '1554703000589869057',
  datasourceId: '1601155287944343554',
  datasourceIdList: Array(0),
  hasOTServer: false,
  isMoreSql: false,
  isPagination: true,
  isReceiveAll: false,
  otInterfaceUrl: '',
  otUrlDetailUrl: '',
  type: '1',
  _$categoryName: 'sql',
  params: {
    rows: 12, // 分页参数
  },
}
this.$refs.datasource.ntiDatasource(params)
  .then(res => {
    console.log('数据源调用成功', res)
  })
  .catch(err => {
    console.log('数据源调用失败', err)
  })