feat: 文件库、列表管理的加载做了调整

This commit is contained in:
WANGFAN\wangf 2024-11-09 17:51:43 +08:00
parent 86a96043d4
commit e14af524f7
3 changed files with 29 additions and 20 deletions

View File

@ -6,22 +6,21 @@
</template>
</a-input>
<div class="tree-box">
<div v-if="loading">
<a-empty />
</div>
<!-- TODO: 滚动条边距和宽度需要调整 -->
<a-scrollbar style="height: 100%; overflow: auto" outer-class="scrollbar">
<a-tree ref="aTreeRef" :data="treeData" :default-expand-all="true" :show-line="true" @select="onNode">
<template #title="node">
<span class="tree-title">{{ node.title }}</span>
</template>
<template #icon="node">
<SvgIcon name="folder-close" :size="16" v-if="!node.isLeaf && !node.expanded"></SvgIcon>
<SvgIcon name="folder-open" :size="16" v-if="!node.isLeaf && node.expanded"></SvgIcon>
<SvgIcon name="txt" :size="16" v-if="node.isLeaf"></SvgIcon>
</template>
</a-tree>
</a-scrollbar>
<a-spin class="tree-loading" :loading="loading" tip="加载中...">
<!-- TODO: 滚动条边距和宽度需要调整 -->
<a-scrollbar style="height: 100%; overflow: auto" outer-class="scrollbar">
<a-tree ref="aTreeRef" :data="treeData" :default-expand-all="true" :show-line="true" @select="onNode">
<template #title="node">
<span class="tree-title">{{ node.title }}</span>
</template>
<template #icon="node">
<SvgIcon name="folder-close" :size="16" v-if="!node.isLeaf && !node.expanded"></SvgIcon>
<SvgIcon name="folder-open" :size="16" v-if="!node.isLeaf && node.expanded"></SvgIcon>
<SvgIcon name="txt" :size="16" v-if="node.isLeaf"></SvgIcon>
</template>
</a-tree>
</a-scrollbar>
</a-spin>
</div>
</div>
</template>
@ -106,6 +105,10 @@ getDocumentLibraryTree();
}
.tree-box {
height: calc(100% - 32px - $margin);
.tree-loading {
width: 100%;
height: 100%;
}
.scrollbar {
height: 100%;
.tree-title {

View File

@ -1,7 +1,7 @@
<template>
<div class="snow-page">
<div class="snow-inner-page">
<a-form :model="formData.form" :label-col-props="{ span: 6 }" :wrapper-col-props="{ span: 18 }">
<a-form ref="formRef" :model="formData.form" :label-col-props="{ span: 6 }" :wrapper-col-props="{ span: 18 }">
<a-row :gutter="16">
<a-col :span="6">
<a-form-item field="name" label="姓名">
@ -20,13 +20,13 @@
</a-col>
<a-col :span="6">
<a-space>
<a-button type="primary">
<a-button type="primary" @click="getCommonTableList">
<template #icon>
<icon-search />
</template>
<template #default>查询</template>
</a-button>
<a-button>
<a-button @click="onReset">
<template #icon>
<icon-refresh />
</template>
@ -169,6 +169,11 @@ const columns = [
align: "center"
}
];
const formRef = ref();
const onReset = () => {
formRef.value.resetFields();
getCommonTableList();
};
const loading = ref<boolean>(false);
const data = reactive<List[]>([]);
const getCommonTableList = async () => {

View File

@ -20,7 +20,7 @@
</a-col>
<a-col :span="6">
<a-space>
<a-button type="primary">
<a-button type="primary" @click="getCustomTableList">
<template #icon>
<icon-search />
</template>
@ -189,6 +189,7 @@ const rowSelection = reactive<RowSelection>({
const formRef = ref();
const onReset = () => {
formRef.value.resetFields();
getCustomTableList();
};
const pagination = ref<Pagination>({ showPageSize: true, showTotal: true, current: 1, pageSize: 10, total: 10 });
const pageChange = (page: number) => {