JSuperQuery - xinwu-yang/cube-vue GitHub Wiki

JSuperQuery 高级查询组件

高级查询组件。

代码演示

<template>
	<j-super-query
    ref="superQueryModal"
    :fieldList="fieldList"
    @handleSuperQuery="handleSuperQuery"
  ></j-super-query>
</template>
<script>
  const superQueryFieldList = [
    {
    	type: 'date',
    	value: 'birthday',
    	text: '生日'
  	},
    {
    	type: 'string',
    	value: 'name',
    	text: '用户名'
  	},
    {
    	type: 'int',
    	value: 'age',
    	dbType: 'int',
    	text: '年龄'
  	}
  ]
	export default {
    data() {
      fieldList: superQueryFieldList,
  		superQueryFlag: false,
  		superQueryParams: ''
    },
    
    methods: {
      // 高级查询方法
      handleSuperQuery(arg) {
        if (!arg) {
          this.superQueryParams = ''
          this.superQueryFlag = false
        } else {
          this.superQueryFlag = true
          this.superQueryParams = JSON.stringify(arg)
        }
        this.loadData()
      }
    }
  }
</script>

api

props

属性 说明 类型 必填 默认值
fieldList 需要查询的列集合 array ✔
callback 回调函数名称 string 'handleSuperQuery'

fieldList

{
  value: '',
  text: '',
  type: '', // type的值可为 'date' | 'datetime' | 'int' | 'number' | 'string'
  dictCode: '' // 只要 dictCode 有值，无论 type 是什么，都显示为字典下拉框
}

事件

事件名称 说明 回调参数
由callback确定，默认handleSuperQuery 点击查询时回调 function(params, matchType)
⚠️ **GitHub.com Fallback** ⚠️