导出添加导出当前页功能

This commit is contained in:
zzyuan 2026-01-26 19:51:54 +08:00
parent 5e8b3adfb2
commit aff1a57722
4 changed files with 144 additions and 17 deletions

View File

@ -339,8 +339,8 @@
<div style="color: #33c2ac;cursor: pointer;font-size: 16px;font-weight: 600;" v-if="isEdit" @click="isEdit=false">确定</div>
</div>
<div class="myCollect-box-zhineng">
<div class="myCollect-box-zhineng-title">职能菜单</div>
<div style="width: 100%;overflow-y: auto;max-height: 340px;">
<div class="myCollect-box-zhineng-title">收藏菜单</div>
<div style="width: 100%;overflow-y: auto;max-height: 78vh;">
<div v-for="(item,index) in zhinengList" :key="index" class="myCollect-box-zhineng-item" :class="{ itemActive: isHover==index }" @mouseover="isHover=index" @mouseleave="isHover = -1">
<div style="display: flex;align-items: center;" @click="gotoPage(item)"><img src="../../assets/images/catchIcon.png" style="width: 16px;height: 16px;margin-right: 5px;" alt=""> <span>{{ item.name }}</span> </div>
<div style="color: #33c2ac;" v-show="isEdit==true">取消</div>
@ -353,7 +353,7 @@
</div>
</div>
</div>
<div class="myCollect-box-zhineng">
<!-- <div class="myCollect-box-zhineng">
<div class="myCollect-box-zhineng-title">项目菜单</div>
<div style="width: 100%;overflow-y: auto;max-height: 340px;">
<div v-for="(item,index) in xiangmuList" :key="index" class="myCollect-box-zhineng-item" :class="{ itemActive: isHover2==index }" @mouseover="isHover2=index" @mouseleave="isHover2 = -1">
@ -367,7 +367,7 @@
</div>
</div>
</div>
</div>
</div> -->
</div>
</el-drawer>
@ -464,7 +464,7 @@ export default {
isHover:-1,
isHover2:-1,
zhinengList:[],//{name:"",url:'/all/stockManagement/entryApply'},{name:"",url:'/all/business/outbound/addApply'}
xiangmuList:[],
// xiangmuList:[],
}
},
computed: {

View File

@ -363,7 +363,16 @@
@queryTable="getDeviceList"
:columns="columns2" style="margin-left: 20px;margin-right: 20px;"
></right-toolbar>
<span>
<el-dropdown size="mini" style="float: right;" placement="bottom-start" trigger="click" @visible-change="handleVisibleChange" @command="(command) => handleCommand(command)">
<el-button plain size="mini" class="el-dropdown-link">
导出 <i class="el-icon-arrow-up el-icon--right" :class="{ 'rotate': isDropdownOpen }"></i>
</el-button>
<el-dropdown-menu slot="dropdown">
<el-dropdown-item command="handleDownloadPage">导出当前页</el-dropdown-item>
<el-dropdown-item command="handleDownloadAll">导出全部</el-dropdown-item>
</el-dropdown-menu>
</el-dropdown>
<!-- <span>
<el-button
style="float: right;background-color:#fff;border: 1px solid #d9d9d9;color:rgba(0,0,0,.65)"
type="primary"
@ -372,7 +381,7 @@
>
<svg-icon icon-class="download"/> 导出
</el-button>
</span>
</span> -->
</el-col>
</el-row>
@ -1041,7 +1050,8 @@ export default {
{ dictLabel: '检测证书', type: '3' },
{ dictLabel: '采购发票', type: '4' },
{ dictLabel: '装备二维码', type: '5' }
]
],
isDropdownOpen: false,
}
},
computed: {
@ -1249,10 +1259,41 @@ export default {
this.$router.push('/equipment/equStore')
},
//
handleCommand(command) {
switch (command) {
case 'handleDownloadAll':
this.exportData()
break
case 'handleDownloadPage':
this.exportDataPage()
break
default:
break
}
},
handleVisibleChange(visible) {
this.isDropdownOpen = visible;
},
/**
* 导出数据
*/
exportData() {
this.$message.info('正在导出数据,请稍候...')
//
try {
let fileName = `装备台账_${new Date().getTime()}.xLsx`
let url = '/material-mall/device/export'
const params = { ...this.queryParams }
params.pageNum=null
params.pageSize=null
console.log('🚀 ~ 导出 ~ params:', params)
this.download(url, params, fileName)
} catch (error) {
console.log('导出数据失败', error)
}
},
exportDataPage() {
this.$message.info('正在导出数据,请稍候...')
//
try {
@ -2303,5 +2344,10 @@ export default {
vertical-align: top;
color: rgba(0,0,0,.65);
}
.el-icon-arrow-up {
transition: transform 0.3s ease;
}
.el-icon-arrow-up.rotate {
transform: rotate(180deg);
}
</style>

View File

@ -98,9 +98,19 @@
<div style="font-size: 20px; font-weight: 800">编码工具台账列表</div>
</el-col>
<el-col :span="16" style="text-align: right;">
<el-button style="background-color:#fff;border: 1px solid #d9d9d9;color:rgba(0,0,0,.65)" type="primary" size="mini" @click="handleExport">
<!-- <el-button style="background-color:#fff;border: 1px solid #d9d9d9;color:rgba(0,0,0,.65)" type="primary" size="mini" @click="handleExport">
<svg-icon icon-class="download"/> 导出
</el-button>
</el-button> -->
<el-dropdown size="mini" placement="bottom-start" trigger="click" @visible-change="handleVisibleChange" @command="(command) => handleCommand(command)">
<el-button plain size="mini" class="el-dropdown-link">
导出 <i class="el-icon-arrow-up el-icon--right" :class="{ 'rotate': isDropdownOpen }"></i>
</el-button>
<el-dropdown-menu slot="dropdown">
<el-dropdown-item command="handleDownloadPage">导出当前页</el-dropdown-item>
<el-dropdown-item command="handleDownloadAll">导出全部</el-dropdown-item>
</el-dropdown-menu>
</el-dropdown>
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"/>
</el-col>
</el-row>
@ -513,6 +523,7 @@ export default {
fileType: ['doc', 'docx', 'xls', 'xlsx', 'pdf', 'jpg', 'jpeg', 'png'], //
showTip: true, //
number: 0, //
isDropdownOpen: false,
}
},
async created() {
@ -648,10 +659,26 @@ export default {
this.getSelectList()
},
//
handleCommand(command) {
switch (command) {
case 'handleDownloadAll':
this.handleExport()
break
case 'handleDownloadPage':
this.handleExportPage()
break
default:
break
}
},
handleVisibleChange(visible) {
this.isDropdownOpen = visible;
},
/**
* 导出数据
*/
handleExport() {
handleExportPage() {
this.download(
'/material-mall/toolLedger/export',
{
@ -660,6 +687,15 @@ export default {
`编码工具台账_${new Date().getTime()}.xlsx`,
)
},
handleExport() {
const params = { ...this.queryParams }
params.pageNum=null
params.pageSize=null
this.download(
'/material-mall/toolLedger/export',params,
`编码工具台账_${new Date().getTime()}.xlsx`,
)
},
//
async getManufacturerSelect() {
@ -1036,4 +1072,10 @@ export default {
display: none;
}
}
.el-icon-arrow-up {
transition: transform 0.3s ease;
}
.el-icon-arrow-up.rotate {
transform: rotate(180deg);
}
</style>

View File

@ -110,9 +110,18 @@
<div style="font-size: 20px; font-weight: 800">数量工具台账列表</div>
</el-col>
<el-col :span="16" style="text-align: right;">
<el-button style="background-color:#fff;border: 1px solid #d9d9d9;color:rgba(0,0,0,.65)" type="primary" size="mini" @click="handleExport">
<!-- <el-button style="background-color:#fff;border: 1px solid #d9d9d9;color:rgba(0,0,0,.65)" type="primary" size="mini" @click="handleExport">
<svg-icon icon-class="download"/> 导出
</el-button>
</el-button> -->
<el-dropdown size="mini" placement="bottom-start" trigger="click" @visible-change="handleVisibleChange" @command="(command) => handleCommand(command)">
<el-button plain size="mini" class="el-dropdown-link">
导出 <i class="el-icon-arrow-up el-icon--right" :class="{ 'rotate': isDropdownOpen }"></i>
</el-button>
<el-dropdown-menu slot="dropdown">
<el-dropdown-item command="handleDownloadPage">导出当前页</el-dropdown-item>
<el-dropdown-item command="handleDownloadAll">导出全部</el-dropdown-item>
</el-dropdown-menu>
</el-dropdown>
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"/>
</el-col>
</el-row>
@ -391,7 +400,8 @@ export default {
},
{ label: '所在工程', prop: 'proName' }
],
dialogList: []
dialogList: [],
isDropdownOpen: false,
}
},
async created() {
@ -577,11 +587,35 @@ export default {
// console.log('', error)
// }
// },
//
handleCommand(command) {
switch (command) {
case 'handleDownloadAll':
this.handleExport()
break
case 'handleDownloadPage':
this.handleExportPage()
break
default:
break
}
},
handleVisibleChange(visible) {
this.isDropdownOpen = visible;
},
/**
* 导出数据
*/
handleExport() {
const params = { ...this.queryParams }
params.pageNum=null
params.pageSize=null
this.download(
'/material-mall/toolLedger/exportAll',params,
`工具台账_${new Date().getTime()}.xlsx`
)
},
handleExportPage() {
this.download(
'/material-mall/toolLedger/exportAll',
{
@ -684,5 +718,10 @@ export default {
display: none;
}
}
.el-icon-arrow-up {
transition: transform 0.3s ease;
}
.el-icon-arrow-up.rotate {
transform: rotate(180deg);
}
</style>