# BsTabPanel 文档

<template>
  <DocTable
    :table-data="tableData"
  />
</template>

<script>
  export default {
    data() {
      return {
        tableData: [
          {
            keyName: 'Props',
            desc: '参数',
            type: '',
            enum: '',
            defVal: '',
            emc: '',
            children: [
              {
                keyName: 'showNum',
                desc: '是否显示数字',
                type: 'boolean',
                enum: '',
                defVal: 'true',
                emc: ''
              },
              {
                keyName: 'showZero',
                desc: 'num为0时是否显示tip提示，默认不显示',
                type: 'boolean',
                enum: '',
                defVal: 'false',
                emc: ''
              },
              {
                keyName: 'isHideQuery',
                desc: '是否显示 收起条件/展开条件 按钮, 默认显示',
                type: 'boolean',
                enum: '',
                defVal: 'false',
                emc: ''
              },
              {
                keyName: 'isOpen',
                desc: '是否打开高级查询组件面板， 默认不展开; 如果为true时，高级查询组件默认要设置成显示',
                type: 'boolean',
                enum: '',
                defVal: 'false',
                emc: ''
              },
              {
                keyName: 'tabStatusBtnConfig',
                desc: '左侧状态按钮组，配置项',
                type: 'Object',
                enum: '',
                defVal: '',
                emc: '',
                children: [
                  {
                    keyName: 'changeBtns',
                    desc: '切换状态按钮时，是否切换右侧按钮组',
                    type: 'boolean',
                    enum: '',
                    defVal: 'true',
                    emc: ''
                  },
                  {
                    keyName: 'buttons',
                    desc: '左侧状态按钮组',
                    type: '[{}]',
                    enum: '',
                    defVal: '{这里的内容详见children}',
                    emc: '',
                    children: [
                      {
                        keyName: 'type',
                        desc: '状态按钮类型',
                        type: 'String',
                        enum: 'button, select',
                        defVal: '',
                        emc: ''
                      },
                      {
                        keyName: 'label',
                        desc: '状态按钮名称',
                        type: 'String',
                        enum: '',
                        defVal: '',
                        emc: ''
                      },
                      {
                        keyName: 'code',
                        desc: '按钮标识用来确定唯一性，选择预设的code会自带图标，如果自定义需要额外添加iconName、iconNameActive字段',
                        type: 'String',
                        enum: 'whole, notreviewed, reviewed, zhibiao, dbsx, ybsx, danju, waitdistributed, issued, generate, refunded',
                        defVal: '',
                        emc: ''
                      }
                    ]
                  },
                  {
                    keyName: 'curButton',
                    desc: '左侧状态按钮组当前激活按钮',
                    type: 'Object',
                    enum: '',
                    defVal: '',
                    emc: ''
                  },
                  {
                    keyName: 'buttonsInfo',
                    desc: '状态按钮对应的右侧按钮组对象, key为buttons里的code, value是数组，具体内容参考rightButtons',
                    type: 'Object',
                    enum: '',
                    defVal: '',
                    emc: ''
                  },
                  {
                    keyName: 'methods',
                    desc: '状态按钮或按钮组点击时的回掉事件',
                    type: 'Object',
                    enum: '',
                    defVal: '{ bsToolbarClickEvent: function(obj, $this) { } }',
                    emc: ''
                  }
                ]
              },
              {
                keyName: 'buttonsInfo',
                desc: '状态按钮对应的右侧按钮组对象，其配置和作用和tabStatusBtnConfig里的buttonsInfo雷同',
                type: 'Object',
                enum: '',
                defVal: '',
                emc: ''
              },
              {
                keyName: 'rightButtons',
                desc: '右侧按钮组,切记：如果要使用自己的右侧按钮，而不随状态按钮切换而切换,记得将tabStatusBtnConfig里changeBtns改为false',
                type: '[{}]',
                enum: '',
                defVal: '{这里的内容详见children}',
                emc: '',
                children: [
                  {
                    keyName: 'label',
                    desc: '按钮名称',
                    type: 'String',
                    enum: '',
                    defVal: '',
                    emc: ''
                  },
                  {
                    keyName: 'code',
                    desc: '按钮唯一标识',
                    type: 'String',
                    enum: '',
                    defVal: '',
                    emc: ''
                  },
                  {
                    keyName: 'status',
                    desc: '按钮的图标',
                    type: 'String',
                    enum: 'primary, perfect, success, info, warning, danger',
                    defVal: '',
                    emc: ''
                  },
                  {
                    keyName: 'isHide',
                    desc: '按钮是否隐藏',
                    type: 'boolean',
                    enum: '',
                    defVal: 'false',
                    emc: ''
                  },
                  {
                    keyName: 'options',
                    desc: '按钮是下拉选择按钮，options是内容项',
                    type: '[]',
                    enum: '',
                    defVal: '',
                    emc: ''
                  }
                ]
              },
              {
                keyName: 'tabStatusNumConfig',
                desc: '状态按钮，数量配置',
                type: 'Object',
                enum: '',
                defVal: '',
                emc: ''
              }
            ]
          },
          {
            keyName: 'Slots',
            desc: '插槽',
            type: '',
            enum: '',
            defVal: '',
            emc: '',
            children: [
              {
                keyName: 'preBtns',
                desc: '前置按钮模版',
                type: '',
                enum: '',
                defVal: '',
                emc: ''
              },
              {
                keyName: 'lastBtns',
                desc: '后置按钮模版',
                type: '',
                enum: '',
                defVal: '',
                emc: ''
              },
            ]
          },
          {
            keyName: 'Events',
            desc: '事件',
            type: '',
            enum: '',
            defVal: '',
            emc: '',
            children: [
              {
                keyName: 'tabClick',
                desc: '当状态按钮切换时触发的事件',
                type: '',
                enum: '',
                defVal: 'obj, $event',
                emc: ''
              },
              {
                keyName: 'btnClick',
                desc: '当点击右侧按钮组时触发的事件',
                type: '',
                enum: '',
                defVal: 'obj, $event',
                emc: ''
              },
              {
                keyName: 'onQueryConditionsClick',
                desc: '当点击收起条件/展开条件时触发的事件',
                type: '',
                enum: '',
                defVal: 'isPack',
                emc: ''
              },
            ]
          },
          {
            keyName: 'Methods',
            desc: '方法',
            type: '',
            enum: '',
            defVal: '',
            emc: '',
            children: [
            ]
          }
        ]
      }
    }
  }
</script>
Copy