Skip to content

Commit

Permalink
feat：制品列表展示的记录数和批量选择优化 TencentBlueKing#2261
Browse files Browse the repository at this point in the history
  • Loading branch information
@lannoy0523
lannoy0523 authored Aug 22, 2024
1 parent bfe2da1 commit 937c273
Show file tree
Hide file tree
Showing 3 changed files with 99 additions and 17 deletions.
104 changes: 89 additions & 15 deletions src/frontend/devops-repository/src/views/repoGeneric/index.vue
View file
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
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
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":"清除选择"
}

0 comments on commit 937c273

Please sign in to comment.