调整上传数据页列表工具栏布局

This commit is contained in:
wkc
2026-03-25 14:26:58 +08:00
parent ad4e115787
commit e521169a7c
4 changed files with 91 additions and 94 deletions

View File

@@ -2,46 +2,6 @@
<div class="upload-data-container">
<!-- 主内容区 -->
<div class="main-content">
<!-- 页面头部 -->
<div class="content-header">
<h2 class="content-title">{{ currentMenuTitle }}</h2>
<div class="header-actions">
<el-button
size="small"
type="primary"
icon="el-icon-upload2"
:disabled="isProjectTagging || isProjectArchived"
@click="handleOpenBatchUploadDialog"
>
上传流水
</el-button>
<el-button
size="small"
icon="el-icon-view"
:disabled="isReportDisabled"
@click="handleViewReport"
>
查看报告
</el-button>
<el-button
size="small"
icon="el-icon-download"
:disabled="isProjectTagging || isProjectArchived"
@click="handleFetchBankInfo"
>
拉取本行信息
</el-button>
<el-button
size="small"
icon="el-icon-upload2"
:disabled="isProjectTagging || isProjectArchived"
@click="handleGoCreditInfoPage"
>
征信导入
</el-button>
</div>
</div>
<div v-if="isProjectTagging || isProjectArchived" class="tagging-lock-tip">
{{ isProjectArchived ? "项目已归档暂不可上传或拉取数据" : "项目正在进行银行流水打标暂不可上传或拉取数据" }}
</div>
@@ -50,6 +10,41 @@
<div class="file-list-section">
<div class="list-toolbar">
<el-button icon="el-icon-refresh" @click="handleManualRefresh">刷新</el-button>
<div class="toolbar-actions">
<el-button
size="small"
icon="el-icon-upload2"
:disabled="isProjectTagging || isProjectArchived"
@click="handleOpenBatchUploadDialog"
>
上传流水
</el-button>
<el-button
size="small"
icon="el-icon-download"
:disabled="isProjectTagging || isProjectArchived"
@click="handleFetchBankInfo"
>
拉取本行信息
</el-button>
<el-button
size="small"
icon="el-icon-upload2"
:disabled="isProjectTagging || isProjectArchived"
@click="handleGoCreditInfoPage"
>
征信导入
</el-button>
<el-button
size="small"
type="primary"
icon="el-icon-view"
:disabled="isReportDisabled"
@click="handleViewReport"
>
查看报告
</el-button>
</div>
</div>
<el-table :data="fileUploadList" v-loading="listLoading">
@@ -1022,38 +1017,6 @@ export default {
// 主内容区
.main-content {
.content-header {
display: flex;
justify-content: space-between;
align-items: flex-start;
gap: 16px;
margin-bottom: 16px;
padding: 20px 24px;
border: 1px solid #ebeef5;
border-radius: 12px;
background: linear-gradient(135deg, #fffaf5 0%, #ffffff 58%, #fff4ec 100%);
box-shadow: 0 10px 24px rgba(140, 76, 38, 0.08);
.content-title {
margin: 0;
font-size: 20px;
font-weight: 600;
color: #303133;
line-height: 32px;
}
.header-actions {
display: flex;
flex-wrap: wrap;
justify-content: flex-end;
gap: 12px;
.el-button {
min-width: 104px;
}
}
}
.tagging-lock-tip {
margin-bottom: 16px;
padding: 10px 14px;
@@ -1075,11 +1038,22 @@ export default {
.list-toolbar {
display: flex;
justify-content: flex-end;
justify-content: space-between;
align-items: center;
margin-bottom: 16px;
padding-bottom: 12px;
border-bottom: 1px solid #f0f2f5;
.toolbar-actions {
display: flex;
flex-wrap: wrap;
justify-content: flex-end;
gap: 12px;
.el-button {
min-width: 104px;
}
}
}
::v-deep .el-table {
@@ -1089,8 +1063,6 @@ export default {
}
::v-deep .el-table th {
background: #faf6f2;
color: #5f4b3a;
font-weight: 600;
}
}
@@ -1275,8 +1247,8 @@ export default {
// 响应式
@media (max-width: 1200px) {
.main-content .content-header {
padding: 18px 20px;
.file-list-section .list-toolbar .toolbar-actions {
gap: 10px;
}
}
@@ -1289,21 +1261,15 @@ export default {
margin-bottom: 16px;
}
.content-header {
flex-direction: column;
align-items: flex-start;
gap: 12px;
.header-actions {
width: 100%;
justify-content: flex-start;
}
}
.file-list-section .list-toolbar {
flex-direction: column;
align-items: flex-start;
gap: 12px;
.toolbar-actions {
width: 100%;
justify-content: flex-start;
}
}
.pull-bank-file-panel {