renxiaodong/lingji-work-fe
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: 增加批量操作

Browse Source
This commit is contained in:
rd
2025-07-14 11:14:22 +08:00
parent 30c6fe4ced
commit c5d8568b82
4 changed files with 111 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
src/components/_base/navbar/components/download-center-modal/constants.ts
View File

@ -20,12 +20,12 @@ export const TABLE_COLUMNS = [
{
title: '所属模块',
dataIndex: 'module',
width: 180,
width: 120,
},
{
title: '下载时间',
dataIndex: 'time',
width: 180,
width: 120,
sortable: {
sortDirections: ['ascend', 'descend'],
},
@ -33,6 +33,6 @@ export const TABLE_COLUMNS = [
{
title: '操作人员',
dataIndex: 'name',
width: 180,
width: 120,
},
];

54
src/components/_base/navbar/components/download-center-modal/index.vue
View File

@ -3,7 +3,7 @@
v-model:visible="visible"
title="下载中心"
modal-class="download-center-modal"
width="780px"
width="860px"
:mask-closable="false"
:footer="false"
@close="onClose"
@ -33,6 +33,34 @@
</a-select>
</div>
</div>
<div
v-if="dataSource.length > 0 && selectedItems.length > 0"
class="tip-row flex justify-between px-16px py-10px w-100% my-12px h-42px"
:class="selectedItems.length > 0 ? 'selected' : ''"
>
<div class="flex items-center">
<div class="flex items-center">
<a-checkbox
:model-value="checkedAll"
:indeterminate="indeterminate"
class="mr-8px"
@change="handleSelectAll"
/>
<span class="label mr-24px">
已选
<span class="color-#6D4CFE">{{ selectedItems.length }}</span>
个文件
</span>
<span class="operation-btn" @click="handleBatchDownload">批量下载</span>
<span class="operation-btn red" @click="handleBatchDelete"> 批量删除 </span>
</div>
</div>
<icon-close size="16" class="cursor-pointer color-#737478" @click="handleCloseTip" />
</div>
<a-table
ref="tableRef"
:data="dataSource"
@ -46,7 +74,7 @@
:selected-keys="selectedItems"
:pagination="false"
:scroll="{ x: '100%' }"
class="file-table w-100% h-400px"
class="file-table w-100% flex-1"
bordered
@sorter-change="handleSorterChange"
@select="handleSelect"
@ -89,11 +117,11 @@
{{ formatTableField(column, record, true) }}
</template>
</a-table-column>
<a-table-column data-index="operation" fixed="right" width="100" title="操作">
<a-table-column data-index="operation" width="100" title="操作">
<template #cell="{ record }">
<div class="flex items-center">
<img :src="icon1" width="14" height="14" class="mr-8px cursor-pointer" @click="openDelete(record)" />
<a-button type="outline" size="small" class="search-btn" @click="handleDownload(record)">下载</a-button>
<img :src="icon1" width="14" height="14" class="mr-8px cursor-pointer" @click="handleDelete(record)" />
<a-button type="outline" size="mini" class="search-btn" @click="handleDownload(record)">下载</a-button>
</div>
</template>
</a-table-column>
@ -181,15 +209,20 @@ const handleSorterChange = (column, order) => {
};
const handleSearch = () => {
console.log('handleSearch');
reload();
};
const openDelete = (record) => {
const handleDelete = (record) => {
const { id, file_name } = record;
deleteTaskModalRef.value.open({
id,
name: `“${file_name || '-'}”`,
});
};
const handleBatchDelete = () => {
const ids = selectedItems.value.map((item) => item.id);
const names = selectedItems.value.map((item) => `"${item.name || '-'}"`).join('，');
deleteTaskModalRef.value?.open({ id: ids, name: names });
};
const getGroups = async () => {
const { code, data } = await fetchAccountGroups();
if (code === 200) {
@ -208,9 +241,16 @@ const handleSelectAll = (checked) => {
}
};
const handleCloseTip = () => {
selectedItems.value = [];
};
const handleDownload = () => {
console.log('handleDownload');
};
const handleBatchDownload = () => {
console.log('handleBatchDownload');
};
const onPageChange = (current) => {
pageInfo.value.page = current;

61
src/components/_base/navbar/components/download-center-modal/style.scss
View File

@ -13,7 +13,18 @@
box-shadow: 0 0 0 0 var(--color-primary-light-2);
}
}
.arco-modal-header {
.arco-modal-title {
color: var(--Text-1, #211f24);
font-size: 16px;
font-style: normal;
font-weight: 400;
line-height: 24px;
font-family: $font-family-medium;
}
}
.arco-modal-body {
height: 536px;
padding: 24px 20px 40px;
.filter-row {
.filter-row-item {
@ -35,10 +46,58 @@
}
}
}
.tip-row {
border-radius: 2px;
background: #f0edff;
.label {
font-family: $font-family-medium;
font-size: 14px;
font-style: normal;
font-weight: 400;
line-height: 22px;
}
&.normal {
background: #ebf7f2;
.label {
color: #211f24;
}
}
&.abnormal {
background: #ffe7e4;
.label {
color: #211f24;
}
}
.err-btn {
background-color: #f64b31 !important;
color: var(--BG-white, #fff);
font-family: 'PingFang SC';
font-size: 12px;
font-style: normal;
font-weight: 400;
line-height: 20px; /* 166.667% */
}
.operation-btn {
padding: 0;
cursor: pointer;
color: var(--Brand-Brand-6, #6d4cfe);
font-family: $font-family-regular;
font-size: 14px;
font-style: normal;
font-weight: 400;
line-height: 22px; /* 157.143% */
&:not(:last-child) {
margin-right: 16px;
}
&.red {
color: #F64B31;
}
}
}
.file-table {
.cts {
color: var(--Text-1, #211f24);
font-family: 'PuHuiTi-Medium';
font-family: $font-family-medium;
font-size: 14px;
font-style: normal;
font-weight: 400;

2
src/components/_base/navbar/components/navbar-menu/style.scss
View File

@ -4,7 +4,7 @@
margin-left: 40px;
.menu-item-text {
color: var(--Text-2, #3c4043);
font-family: 'PuHuiTi-Medium';
font-family: $font-family-medium;
font-size: 16px;
font-style: normal;
font-weight: 400;