| | |
| | | tableData: [], |
| | | tableDataCopy:[] //拷贝 |
| | | }); |
| | | const hasChildren = data => { |
| | | data.forEach(item => { |
| | | if (item.child) { |
| | | item.hasChildren = true; |
| | | } |
| | | }); |
| | | |
| | | }; |
| | | const processNodesWithChildrenCheck = (nodes) => { |
| | | |
| | | // 确保输入是数组 |
| | | if (!Array.isArray(nodes)) { |
| | | return []; |
| | | } |
| | | |
| | | // 深拷贝数组避免修改原数据 |
| | | return nodes.map(node => { |
| | | // 复制节点 |
| | | const newNode = { ...node }; |
| | | |
| | | // 检查是否有子节点 |
| | | const hasChild = Array.isArray(newNode.child) && newNode.child.length > 0; |
| | | newNode.hasChildren = hasChild; |
| | | |
| | | // 如果有子节点,递归处理子节点 |
| | | if (hasChild) { |
| | | newNode.child = processNodesWithChildrenCheck(newNode.child); |
| | | } |
| | | |
| | | return newNode; |
| | | }); |
| | | }; |
| | | const load = (node:any, treeNode:any,resolve:any) => { |
| | | console.log(node, treeNode,'node, resolve'); |
| | | |
| | | if( node.child) { |
| | | hasChildren(node.child); |
| | | return resolve(node.child); |
| | | } else { |
| | | return resolve([]); |
| | | } |
| | | |
| | | |
| | | }; |
| | | // 页面加载时 |
| | | onMounted(async () => { |
| | | }); |
| | | |
| | | // 查询操作 |
| | | const handleQuery = async (params: any = {}) => { |
| | | |
| | | const result = await fBS_EnterpriseTypeApi.tree().then(res => res.data.result); |
| | | state.tableParams.total = result?.total; |
| | | state.tableData = result ?? []; |
| | | // hasChildren(state.tableData) |
| | | state.tableLoading = false; |
| | | }; |
| | | |
| | | |
| | | handleQuery(); |
| | | const treeProps = reactive({ |
| | | checkStrictly: false, |
| | | // checkStrictly: false, |
| | | children: 'child', |
| | | |
| | | hasChildren: 'hasChildren' |
| | | }) |
| | | |
| | | // 删除 |
| | |
| | | <el-card shadow="hover" :body-style="{ paddingBottom: '0' }"> |
| | | <el-form :model="state.tableQueryParams" ref="queryForm" labelWidth="90"> |
| | | <el-row> |
| | | <!-- <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="4" class="mb10"> |
| | | <el-form-item label="名称"> |
| | | <el-input v-model="state.tableQueryParams.keyword" clearable placeholder="请输入名称"/> |
| | | </el-form-item> |
| | | </el-col> --> |
| | | <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="4" class="mb10"> |
| | | <el-form-item> |
| | | <el-button-group style="display: flex; align-items: center;"> |
| | |
| | | </el-row> |
| | | </el-form> |
| | | </el-card> |
| | | |
| | | <el-card> |
| | | <el-table :data="state.tableData" :tree-props="treeProps" lazy row-key="id" |
| | | <el-card class="full-table" shadow="hover" style="margin-top: 5px"> |
| | | <el-table |
| | | :data="state.tableData" |
| | | style="width: 100%" |
| | | row-key="id" |
| | | border |
| | | lazy |
| | | :load="load" |
| | | :tree-props="treeProps" |
| | | > |
| | | <el-table-column type="selection" width="55" /> |
| | | <el-table-column prop="name" label="名称" /> |
| | | <el-table-column prop="code" label="编码" /> |
| | | <el-table-column prop="description" label="描述" /> |
| | | <el-table-column label="操作" width="140" align="center" fixed="right" show-overflow-tooltip v-if="auth('fBS_EnterpriseType:update') || auth('fBS_EnterpriseType:delete')"> |
| | | <template #default="scope"> |
| | | <el-button icon="ele-Edit" size="small" text type="primary" @click="editDialogRef.openDialog(scope.row, state.tableData,'编辑')" v-auth="'fBS_EnterpriseType:update'"> 编辑 </el-button> |
| | | <el-button icon="ele-Delete" size="small" text type="primary" @click="delFBS_ExRole(scope.row)" v-auth="'fBS_EnterpriseType:delete'"> 删除 </el-button> |
| | | </template> |
| | | </el-table-column> |
| | | </el-table> |
| | | </el-card> |
| | | <!-- <el-card> |
| | | <el-table :data="state.tableData" lazy :tree-props="treeProps" row-key="id" :load="load"> |
| | | <el-table-column type="selection" width="55" /> |
| | | <el-table-column prop="name" label="名称" /> |
| | | <el-table-column prop="code" label="编码" /> |
| | |
| | | |
| | | </el-table> |
| | | <editDialog ref="editDialogRef" @reloadTable="handleQuery" /> |
| | | </el-card> |
| | | </el-card> --> |
| | | </div> |
| | | |
| | | </template> |