Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat：制品列表展示的记录数和批量选择优化 #2261 #2476

Merged
merged 1 commit into from
Aug 22, 2024
Merged

feat：制品列表展示的记录数和批量选择优化 #2261 #2476

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
104 changes: 89 additions & 15 deletions src/frontend/devops-repository/src/views/repoGeneric/index.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -47,7 +47,7 @@
<span v-else> {{repoName + (searchFullPath || (selectedTreeNode && selectedTreeNode.fullPath) || '') }}</span>
<div class="repo-generic-actions bk-button-group">
<bk-button
v-if="multiSelect.length && repoName !== 'pipeline'"
v-if="showMultiDelete && repoName !== 'pipeline'"
@click="handlerMultiDownload">
{{$t('batchDownload')}}
</bk-button>
Expand Down Expand Up @@ -92,6 +92,19 @@
<template #empty>
<empty-data :is-loading="isLoading" :search="Boolean(searchFileName)"></empty-data>
</template>
<template #prepend v-if="showMultiDelete">
<div id="showCount" style="background-color: #EAEBF0; height: 40px" class="flex-center">
<div v-if="!selectedAll">
<span> {{ $t('hasSelectTip', { 0: selectCount }) }}</span>
<bk-link type="primary" @click="selectAllByType" theme="primary">{{ $t('changeSelectAllTip') }}</bk-link>
<bk-divider direction="vertical" />
</div>
<div v-else>
<span> {{ $t('selectAllTip', { 0: pagination.count }) }}</span>
</div>
<bk-link type="primary" @click="cancelSelect" theme="primary">{{ $t('clearSelectTip') }}</bk-link>
</div>
</template>
<bk-table-column :selectable="selectable" type="selection" width="60"></bk-table-column>
<bk-table-column :label="$t('fileName')" prop="name" show-overflow-tooltip>
<template #default="{ row }">
Expand Down Expand Up @@ -289,7 +302,9 @@
showData: {},
sortParams: [],
timer: null,
showMultiDelete: false
showMultiDelete: false,
selectedAll: false,
selectCount: 0
}
},
computed: {
Expand Down Expand Up @@ -404,6 +419,40 @@
'getMultiFolderNumOfFolder',
'getPermissionUrl'
]),
cancelSelect () {
sessionStorage.removeItem(this.userInfo.name + 'SelectedPaths')
for (let i = 0; i < this.artifactoryList.length; i++) {
this.$nextTick(() => {
this.$refs.artifactoryTable.toggleRowSelection(this.artifactoryList[i], false)
})
}
this.selectCount = 0
this.showMultiDelete = false
},
selectAllByType () {
this.getArtifactoryList({
projectId: this.projectId,
repoName: this.repoName,
fullPath: this.selectedTreeNode?.fullPath,
current: 1,
limit: 10000,
isPipeline: this.repoName === 'pipeline',
searchFlag: false,
localRepo: this.localRepo
}).then((res) => {
const key = this.userInfo.name + 'SelectedPaths'
sessionStorage.removeItem(key)
for (let i = 0; i < this.artifactoryList.length; i++) {
this.$nextTick(() => {
this.$refs.artifactoryTable.toggleRowSelection(this.artifactoryList[i], true)
})
}
const val = res.records.map(r => '\'' + r.projectId + '/' + r.repoName + r.fullPath + '\'').join('')
sessionStorage.setItem(key, val)
this.selectedAll = true
this.selectCount = this.pagination.count
})
},
showRepoScan (node) {
const indexOfLastDot = node.name.lastIndexOf('.')
let supportFileNameExt = false
Expand Down Expand Up @@ -622,15 +671,26 @@
this.artifactoryList = originData
}
const key = this.userInfo.name + 'SelectedPaths'
const isCheckedPaths = sessionStorage.getItem(key) === null ? '' : sessionStorage.getItem(key)
this.showMultiDelete = isCheckedPaths.length > 0 && isCheckedPaths.includes('\'' + this.projectId + '/' + this.repoName + '/')
for (let i = 0; i < this.artifactoryList.length; i++) {
const targetPath = '\'' + this.artifactoryList[i].projectId + '/' + this.artifactoryList[i].repoName + this.artifactoryList[i].fullPath + '\''
if (isCheckedPaths.includes(targetPath)) {
this.$nextTick(() => {
this.$refs.artifactoryTable.toggleRowSelection(this.artifactoryList[i], true)
})
const originPathKey = this.userInfo.name + 'originPath'
const originPathVal = sessionStorage.getItem(originPathKey) === null ? '' : sessionStorage.getItem(originPathKey)
const targetOriginPath = this.projectId + this.repoName + (this.$route.query.path || '').split('/').filter(Boolean).toString()
if (originPathVal === targetOriginPath) {
const isCheckedPaths = sessionStorage.getItem(key) === null ? '' : sessionStorage.getItem(key)
this.showMultiDelete = isCheckedPaths.length > 0
this.selectedAll = isCheckedPaths.split("\'").filter(r => r !== '').length === this.pagination.count
this.selectCount = isCheckedPaths.split("\'").filter(r => r !== '').length
for (let i = 0; i < this.artifactoryList.length; i++) {
const targetPath = '\'' + this.artifactoryList[i].projectId + '/' + this.artifactoryList[i].repoName + this.artifactoryList[i].fullPath + '\''
if (isCheckedPaths.includes(targetPath)) {
this.$nextTick(() => {
this.$refs.artifactoryTable.toggleRowSelection(this.artifactoryList[i], true)
})
}
}
} else {
sessionStorage.setItem(originPathKey, targetOriginPath)
sessionStorage.removeItem(key)
this.showMultiDelete = false
}
}).finally(() => {
this.isLoading = false
Expand Down Expand Up @@ -1018,8 +1078,15 @@
}, 5000)
},
handlerMultiDownload () {
const fullPaths = this.multiSelect.map(r => r.fullPath)
customizeDownloadFile(this.projectId, this.repoName, fullPaths)
const key = this.userInfo.name + 'SelectedPaths'
const isCheckedPaths = sessionStorage.getItem(key).split('\'')
const paths = []
for (let i = 0; i < isCheckedPaths.length; i++) {
if (isCheckedPaths[i].length > 0 && isCheckedPaths[i].startsWith(this.projectId + '/' + this.repoName)) {
paths.push(isCheckedPaths[i].replace(this.projectId + '/' + this.repoName, ''))
}
}
customizeDownloadFile(this.projectId, this.repoName, paths)
},
handlerForbid ({ fullPath, metadata: { forbidStatus } }) {
this.forbidMetadata({
Expand Down Expand Up @@ -1386,15 +1453,17 @@
let isCheckedPaths = sessionStorage.getItem(key) === null ? '' : sessionStorage.getItem(key)
const isChecked = selection.length
if (isChecked) {
const paths = this.multiSelect.map(r => '\'' + r.projectId + '/' + r.repoName + r.fullPath + '\'').join('')
const paths = this.multiSelect.filter(r => !isCheckedPaths.includes('\'' + r.projectId + '/' + r.repoName + r.fullPath + '\'')).map(r => '\'' + r.projectId + '/' + r.repoName + r.fullPath + '\'').join('')
isCheckedPaths = isCheckedPaths + paths
} else {
for (let i = 0; i < this.artifactoryList.length; i++) {
const targetPath = '\'' + this.artifactoryList[i].projectId + '/' + this.artifactoryList[i].repoName + this.artifactoryList[i].fullPath + '\''
isCheckedPaths = isCheckedPaths.replace(targetPath, '')
}
}
this.showMultiDelete = isCheckedPaths.length > 0 && isCheckedPaths.includes('\'' + this.projectId + '/' + this.repoName + '/')
this.showMultiDelete = isCheckedPaths.length > 0
this.selectedAll = isCheckedPaths.split("\'").filter(r => r !== '').length === this.pagination.count
this.selectCount = isCheckedPaths.split("\'").filter(r => r !== '').length
sessionStorage.setItem(key, isCheckedPaths)
},

Expand All @@ -1407,8 +1476,10 @@
} else {
isCheckedPaths = isCheckedPaths.replace('\'' + row.projectId + '/' + row.repoName + row.fullPath + '\'', '')
}
this.showMultiDelete = isCheckedPaths.length > 0 && isCheckedPaths.includes('\'' + this.projectId + '/' + this.repoName + '/')
this.showMultiDelete = isCheckedPaths.length > 0
sessionStorage.setItem(key, isCheckedPaths)
this.selectedAll = isCheckedPaths.split("\'").filter(r => r !== '').length === this.pagination.count
this.selectCount = isCheckedPaths.split("\'").filter(r => r !== '').length
}
}
}
Expand All @@ -1417,6 +1488,9 @@
.repo-generic-container {
height: 100%;
overflow: hidden;
::v-deep .bk-link .bk-link-text {
font-size: 12px;
}
.generic-header{
height: 60px;
background-color: white;
Expand Down
6 changes: 5 additions & 1 deletion src/frontend/locale/repository/en-US.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -888,5 +888,9 @@
"rootDirectoryPermissionTip": "After Open, Member access path in the repo need auth.",
"errMsg": "Error Message",
"blackUserList": "Blacklist",
"controlConfigPlaceholder": "Select User Group"
"controlConfigPlaceholder": "Select User Group",
"hasSelectTip": "{0} items selected,",
"changeSelectAllTip": "Select full data",
"selectAllTip": "{0} pieces of total data have been selected，",
"clearSelectTip":"Clear selection"
}
6 changes: 5 additions & 1 deletion src/frontend/locale/repository/zh-CN.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -889,5 +889,9 @@
"rootDirectoryPermissionTip": "开启之后项目成员访问此仓库下路径需要授权",
"errMsg": "错误信息",
"blackUserList": "办公网访问黑名单",
"controlConfigPlaceholder": "可选择多个用户组"
"controlConfigPlaceholder": "可选择多个用户组",
"hasSelectTip": "已选择{0}条,",
"changeSelectAllTip": "选择全量数据",
"selectAllTip": "已选择全量数据{0}条，",
"clearSelectTip":"清除选择"
}
Loading