1、即席查询 新增控制筛选器是否可见、是否可编辑、是否启用

// 以透视分析为例
import CustomTree from '../control/CustomTree.vue'
this.on(DAD_HOC_QUERYDATA_FILTERPANEL_ON_INIT, (filterIAdHocDatasetPanel, iDetailQueryiAdHocAnalysis) => {
	
    // 设置自定义树
    consoleIAdHocDatasetPanel.log('D_QUERY_FILTER_ON_INIT')
	  	filter.setSuffixSlot({setDatasetHeader({
        component: CustomTree, //自定义常用字段树组件
        props: {
            componentname: SuffixButton'customTree',
          props  title: {'常用字段',
            valueinitialData: filter.isEditable() customTreeData, //自定义常用字段树组件数据
            showCheckbox: },
 true,
            draggable: false
        },
        listeners: {
            'node-click': function (enabled{
                data,
                node
            }) {
                console.log('节点点击:', data)
                if (data.type === 'field') {
                    IAdHocDatasetPanel.onLocateToTree(data.id) // filter.setVisible(enabled);   控制筛选器是否可见
			 实现点击字段定位到产品原本数据面板对应字段
                }
            },
            'check': function ({
                data,
                checked
            }) {
                filterconsole.setEditable(enabled);log('节点选中状态变化:', data, checked)
                // 控制筛选器是否可编辑
			 只处理叶子节点（字段节点）
                if filter.setEnable(enabled);(data.type === 'field') {
                    IAdHocDatasetPanel.setFieldsChecked([data.id], checked) // 实现勾选取消常用字段树，联动勾选产品数据面板中的字段
  控制筛选器是否启用（禁用即代表对应筛选器对于查询数据和导出无效）              }
            }
        })
    })

2、透视分析 新增控制筛选器是否可见、是否可编辑、是否启用

this.on(D_QUERY_FILTER_ON_INIT, (filter, iAdHocAnalysis) => {
	  console.log('AD_HOC_FILTER_ON_INIT')
	  	filter.setSuffixSlot({
 

========== customTreeData 数据 ==========
let customTreeData = [{
        id: 'dimension-folder',
        name: '常用维度',
        label: '常用维度',
        type: 'folder',
        children: [{
                id: 'AUGMENTED_DATASET_LEVEL.I8aaa8015017d97839783ea38017d980a686901b2.Field-SmartbiDemo-null-PUBLIC-orders-ShipRegion-LEVEL-1624587737403',
                name: '发货区域',
                label: '发货区域',
                type: 'field',
                dataType: 'STRING'
            }, {
                id: 'AUGMENTED_DATASET_FIELD.I8aaa8015017d97839783ea38017d980a686901b2.Field-SmartbiDemo-null-PUBLIC-categories-CategoryName',
                name: '产品类别',
                label: '产品类别',
                type: 'field',
                dataType: 'DATE'
            }
        ]
    }, {
        id: 'measure-folder',
        name: '常用度量',
        label: '常用度量',
        type: 'folder',
        children: [{
                id: 'AUGMENTED_DATASET_MEASURE.I8aaa8015017d97839783ea38017d980a686901b2.Field-SmartbiDemo-null-PUBLIC-orders-Freight_1638935325218',
                name: '运费',
                label: '运费',
                componenttype: SuffixButton,'field',
                propsdataType: 'DOUBLE'
            }, {
                valueid: filter.isEditable()'AUGMENTED_DATASET_MEASURE.I8aaa8015017d97839783ea38017d980a686901b2.Field-SmartbiDemo-null-PUBLIC-orders-Freight_1638935325218',
                name: '运费',
                label: '运费',
                type: },'field',
                listenersdataType: 'DOUBLE'
            }, {
            click: function (enabled) {    id: 'AUGMENTED_DATASET_MEASURE.I8aaa8015017d97839783ea38017d980a686901b2.Field-SmartbiDemo-null-PUBLIC-orders-OrderID_1638935571561',
                name: '订单量',
                label: '订单量',
// filter.setVisible(enabled);   控制筛选器是否可见 			     filter.setEditable(enabled);  // 控制筛选器是否可编辑 			  type: 'field',
 filter.setEnable(enabled);    // 控制筛选器是否启用（禁用即代表对应筛选器对于查询数据和导出无效）          dataType: 'INTEGER'
 }           }
        })]
    })


// 上述示例中使用到的 SuffixButton 
<template>
  <el-button
]


========== 自定义CustomTree文件 ==========
<!-- src/components/custom-tree/CustomTree.vue -->
<template>
  <div class="custom-tree-container">
    <el-tree
      ref="tree"
      :data="treeData"
      type:props="defaultdefaultProps"
    style="line-height: 28px; padding: 0 8px; margin-left: 8px  node-key="id"
      :highlight-current="true"
      :expand-on-click-node="true"
      :show-checkbox="showCheckbox"
      :default-expand-all="false"
      :accordion="false"
      @node-click="handleNodeClick"
    @click  @check-change="onClickhandleCheck">
      <span class="custom-tree-node" slot-scope="{ node }">
        <span>{{ buttonTextnode.label }}</span>
      </span>
    </el-buttontree>
  ></div>
</template>

<script>
export default {
  name: "SuffixButton"'CustomTree',
  props: {
    value// 初始数据
    initialData: {
      type: Array,
      default: () => []
    },
    // 是否显示复选框
    showCheckbox: {
      type: Boolean,
      default: false
    },
    // 是否允许拖拽
    draggable: {
      type: Boolean,
      default: false
    }
  },
  data() {
    return {
      enabled: this.value
    }
  },
  computed: {treeData: [],
      defaultProps: {
        children: 'children',
        label: 'name'
      }
    }
  },
  created() {
    // 初始化数据
    this.treeData = this.initialData
  },
  watch: {
    // 监听initialData变化，更新firstLevelKeys
    initialData: {
     buttonText handler(newVal) {
       return this.enabled ? '禁用' : '启用'treeData = newVal
      },
      deep: true
    }
  },
  methods: {
    // 节点点击事件
    handleNodeClick(data, node) {
      this.$emit('node-click', { data, node })
    },
    // 节点选中事件
onClick(    handleCheck(data, checked) {
      this.enabled = !this.enabled$emit('check', { data, checked })
    },
    // 对外暴露的方法：设置树数据
    setTreeData(data) {
      this.treeData = data
    },
    // 对外暴露的方法：获取选中的节点
    getCheckedNodes() {
      return this.$emit("click", this.enabled)$refs.tree.getCheckedNodes()
    },
    // 对外暴露的方法：展开指定节点
    expandNode(nodeId) {
      const node = this.$refs.tree.store.nodesMap[nodeId]
      if (node) {
        node.expanded = true
      }
    },
  },
};
</script>

<style scoped>
.custom-tree-container {
  padding: 1px 0 4px 22px;
}

.custom-tree-node {
  flex: 1;
  display: flex;
  align-items: center;
  font-size: 14px;
  padding-right: 8px;
}

/* 使用 Element UI 默认的树节点样式 */
:deep(.el-tree-node__content) {
  height: 32px;
  line-height: 32px;
}

:deep(.el-tree-node__content:hover) {
  background-color: #f5f7fa;
}

:deep(.el-tree-node.is-current > .el-tree-node__content) {
  background-color: #ecf5ff;
}

:deep(.el-tree-node__expand-icon) {
  font-size: 12px;
  margin-right: 4px;
  transition: transform 0.3s ease-in-out;
}

:deep(.el-tree-node__expand-icon.expanded) {
  transform: rotate(90deg);
}

:deep(.el-tree-node__expand-icon.is-leaf) {
  display: none;
}

:deep(.el-checkbox) {
  margin-right: 4px;
}
</style>