update 树样式修改

This commit is contained in:
赵霄
2023-09-15 16:44:20 +08:00
parent 9a01fa7d97
commit 0191a549bf
2 changed files with 42 additions and 40 deletions
+1 -1
View File
@@ -430,7 +430,7 @@
} }
.page-tree-box-has-search { .page-tree-box-has-search {
height: calc(100% - 32px); height: calc(100% - 40px);
} }
/*展开收起按钮颜色*/ /*展开收起按钮颜色*/
@@ -7,47 +7,49 @@
:placeholder="$t('standardRegulationLibrary.domesticStandard.treeSearchPlaceholder')" :placeholder="$t('standardRegulationLibrary.domesticStandard.treeSearchPlaceholder')"
@search="handleTreeSearch" /> @search="handleTreeSearch" />
<div class="page-tree-box page-tree-box-has-search"> <div class="page-tree-box page-tree-box-has-search">
<a-tree :show-line="true" :show-icon="true" :tree-data="treeData" :selected-keys="selectedTreeKeys"> <a-spin :spinning="treeLoading">
<a-icon type="folder" slot="folder" class="tree-icon" /> <a-tree :show-line="true" :show-icon="true" :tree-data="treeData" :selected-keys="selectedTreeKeys">
<a-icon type="file" slot="file" class="tree-icon" /> <a-icon type="folder" slot="folder" class="tree-icon" />
<a-icon type="file" slot="file" class="tree-icon" />
<template #custom="record"> <template #custom="record">
<div class="tree-operate-node" <div class="tree-operate-node"
@mouseenter="handleTreeMouseover(record.key)" @mouseenter="handleTreeMouseover(record.key)"
@mouseleave="handleTreeMouseout(record.key)" @mouseleave="handleTreeMouseout(record.key)"
@click="handleSelectTreeNode(record)"> @click="handleSelectTreeNode(record)">
<a-tooltip> <a-tooltip>
<template #title> <template #title>
{{ record.title }} {{ record.title }}
</template> </template>
<span class="tree-node-custom-title">{{ record.title }}</span> <span class="tree-node-custom-title">{{ record.title }}</span>
</a-tooltip> </a-tooltip>
<!----> <!---->
<div class="tree-operate-node-btn-box" :class="{'tree-operate-node-btn-box-hide': record.key !== mouseInNodeKey}"> <div class="tree-operate-node-btn-box" :class="{'tree-operate-node-btn-box-hide': record.key !== mouseInNodeKey}">
<!-- 新增--> <!-- 新增-->
<a-button icon="plus" <a-button icon="plus"
class="tree-operate-node-btn" class="tree-operate-node-btn"
@click.stop="handleAddTreeNode(record)" @click.stop="handleAddTreeNode(record)"
v-if="record.nodeType !== StandardSystemTreeNodeType.NOT_OPERATE_NODE.value" v-if="record.nodeType !== StandardSystemTreeNodeType.NOT_OPERATE_NODE.value"
v-has="'domesticStandard:tree:add'"></a-button> v-has="'domesticStandard:tree:add'"></a-button>
<!-- 编辑根节点不能编辑--> <!-- 编辑根节点不能编辑-->
<a-button class="tree-operate-node-btn" <a-button class="tree-operate-node-btn"
@click.stop="handleEditTreeNode(record)" @click.stop="handleEditTreeNode(record)"
v-has="'domesticStandard:tree:edit'" v-has="'domesticStandard:tree:edit'"
v-if="record.nodeType !== StandardSystemTreeNodeType.ROOT_NODE.value && record.nodeType !== StandardSystemTreeNodeType.NOT_OPERATE_NODE.value"> v-if="record.nodeType !== StandardSystemTreeNodeType.ROOT_NODE.value && record.nodeType !== StandardSystemTreeNodeType.NOT_OPERATE_NODE.value">
<i class="iconfont icon-bianji" /> <i class="iconfont icon-bianji" />
</a-button> </a-button>
<!-- 删除根节点不能删除--> <!-- 删除根节点不能删除-->
<a-button class="tree-operate-node-btn" <a-button class="tree-operate-node-btn"
v-has="'domesticStandard:tree:delete'" v-has="'domesticStandard:tree:delete'"
v-if="record.nodeType !== StandardSystemTreeNodeType.ROOT_NODE.value && record.nodeType !== StandardSystemTreeNodeType.NOT_OPERATE_NODE.value" v-if="record.nodeType !== StandardSystemTreeNodeType.ROOT_NODE.value && record.nodeType !== StandardSystemTreeNodeType.NOT_OPERATE_NODE.value"
@click.stop="handleDelTreeNode(record)"> @click.stop="handleDelTreeNode(record)">
<i class="iconfont icon-shanchu_" /> <i class="iconfont icon-shanchu_" />
</a-button> </a-button>
</div>
</div> </div>
</div> </template>
</template> </a-tree>
</a-tree> </a-spin>
</div> </div>
</div> </div>
<!-- 表格部分--> <!-- 表格部分-->