左树右列表,按文档写的,有fixed但是列表的参数一直不生效,请问是什么原因

image.pngimage.png

评论区

超级管理员 2025-05-07 10:55

点击树后有 通过ref调用表格刷新方法?,或者完整的代码复制出来我看看

yff 2025-05-07 11:12

<template>

  <div>

    <el-card>

      <template #header>

        <div>

          <span>文件管理</span>

        </div>

      </template>

      <div style="min-height: 450px">

        <div class="flex-basis-180px flex-shrink-0">

          <avue-tree

            ref="tree"

            :option="treeoption"

            :data="treeData"

            v-model="form"

            @node-click="nodeClick"

          >

        </avue-tree>

      </div>


        <div style="max-width: calc(100% - 220px)">

          <LowTable ref="fileTableRef" 

            tableId="1917144882454827009" 

            :enhanceData="{ type:'treeview'  }" 

            :fixed-search="{ document_directory: treeVal }"

            > 

  </LowTable>

        </div>

      </div>

    </el-card>

  </div>

</template>


<script setup>

import { listToTree } from '@/utils/tree'

import { LowTable } from '@/components/LowDesign/index'

import { ElMessage } from 'element-plus'

import * as TableApi from '@/api/design/table'


const form = ref({})


const treeVal = ref('')



const treeData = ref([])


const treeoption = ref({menu: false})


const fileTableRef = ref()


const nodeClick = (data) => {

   treeVal.value = data.value

   if(fileTableRef.value?.resetChange){

   fileTableRef.value.resetChange()

   }

}


// 组件挂载完成后加载数据

onMounted(() => {

  loadTreeData()

})

// 获取数据并赋值

const loadTreeData = async () => {

  try {

    const res = await TableApi.getTableList('1917159226710265858', {}, false)

    const treeDatas =  listToTree(res.records) // 将结果赋值给 treeData

  treeData.value = convertToValueLabelTree(treeDatas);

  } catch (error) {

    ElMessage.error('加载树形数据失败')

    console.error(error)

  }

}


// 转换函数:将后端数据转为 { value, label, children } 结构

const convertToValueLabelTree = (data) => {

  if (!Array.isArray(data)) return []


  return data.map(item => ({

    value: item.directory_name,

    label: item.directory_name,

    children: item.children ? convertToValueLabelTree(item.children) : []

  }))

}


</script>


<style scoped>

::v-deep(.el-card) {

  &.card-box {

    border-radius: 10px;

  }


  .el-card__header {

    font-family: '微软雅黑 Bold', '微软雅黑 Regular', '微软雅黑', sans-serif;

    font-size: 15px;

    font-weight: 700;

    color: #666;

    background-color: #f9f9f9;


    // .el-card__body { }

  }

}


::v-deep(.el-tree) {

  .el-tree-node.is-current > .el-tree-node__content {

    background-color: white;

  }


  .el-tree-node__content {

    height: 40px;


    .el-tree-node__expand-icon {

      font-size: 16px;

    }


    .el-tree-node__label {

      font-family: '微软雅黑', sans-serif;

    }

  }

}

</style>

这个是全部代码

yff 2025-05-07 11:19

还有个问题,我在表单开发-查询属性中选择了查询属性,但是页面表头没有查询条件框image.pngimage.png麻烦有空一起帮忙看看,版本是2.0的  谢谢

超级管理员 2025-05-07 11:19

@yff

image.png这里应该没复制到 data.value是空的,你可以打印看看,空值搜索是不会带的

超级管理员 2025-05-07 11:26

@yff

搜索的问题我这边没复现,可以在演示环境复现一下么

yff 2025-05-07 15:06

@超级管理员

这个是我js里面有控制,我删除了一些js,查询条件框就有了。。
但是那个data.value,我测试时
:fixed-search="{ document_directory: 'aaaa'}" 这个写死也没有用 

超级管理员 2025-05-07 16:24

@yff

大概率是你增强问题,我用你代码把表id改成示例的单表和树表是可以的

回复