Browse Source

feat(mes): 更新TID_EPC日志导出功能

- 将导出API从getExportList重命名为exportCsv并修改为下载类型请求
- 增加下载实例超时时间到10分钟以支持大数据量导出
- 移除前端Excel导出组件改为直接调用后端接口下载CSV文件
- 添加导出按钮加载状态和进度提示
- 注释掉不必要的导出格式选择功能
- 在BU选择下拉框添加change事件监听器
- 移除前端导出相关的字段映射和数据处理方法
master
常熟吴彦祖 3 weeks ago
parent
commit
988f8d5aa9
  1. 4
      src/api/mes/mesTidEpcLog.js
  2. 3
      src/utils/httpRequest.js
  3. 124
      src/views/modules/mes/mesTidEpcLog.vue

4
src/api/mes/mesTidEpcLog.js

@ -14,10 +14,10 @@ import { createAPI } from "@/utils/httpRequest.js";
export const searchList = data => createAPI(`/pms/mesTidEpcLog/searchList`, 'post', data) export const searchList = data => createAPI(`/pms/mesTidEpcLog/searchList`, 'post', data)
/** /**
* 导出数据列表 - rqrq
* 导出CSV文件 - rqrq
* @param data 查询条件 * @param data 查询条件
*/ */
export const getExportList = data => createAPI(`/pms/mesTidEpcLog/getExportList`, 'post', data)
export const exportCsv = data => createAPI(`/pms/mesTidEpcLog/exportCsv`, 'post', data, 'download')
// ================= 导入 ================= // ================= 导入 =================

3
src/utils/httpRequest.js

@ -112,9 +112,10 @@ instance.interceptors.response.use(response => {
}) })
// ============================= 下载功能的请求 ============================= // ============================= 下载功能的请求 =============================
// rqrq - 增加超时时间到10分钟,支持大数据量导出
const instance2 = axios.create({ const instance2 = axios.create({
baseURL: (process.env.NODE_ENV !== 'production' && process.env.OPEN_PROXY ? '/proxyApi/' : window.SITE_CONFIG.baseUrl), baseURL: (process.env.NODE_ENV !== 'production' && process.env.OPEN_PROXY ? '/proxyApi/' : window.SITE_CONFIG.baseUrl),
timeout: 10000 * 30,
timeout: 1000 * 60 * 10, // 10分钟超时 - rqrq
withCredentials: true, withCredentials: true,
responseType: 'blob', responseType: 'blob',
headers: { headers: {

124
src/views/modules/mes/mesTidEpcLog.vue

@ -27,20 +27,16 @@
<el-form-item :label="' '"> <el-form-item :label="' '">
<el-button type="primary" @click="getDataList()" :loading="dataListLoading">查询</el-button> <el-button type="primary" @click="getDataList()" :loading="dataListLoading">查询</el-button>
<el-button type="primary" @click="openImportModal()">导入</el-button> <el-button type="primary" @click="openImportModal()">导入</el-button>
<download-excel
:fields="fields()"
:data="exportData"
type="xls"
:name="exportName"
:header="exportHeader"
:footer="exportFooter"
:fetch="createExportData"
:before-generate="startDownload"
:before-finish="finishDownload"
worksheet="TID_EPC日志"
class="el-button el-button--primary el-button--medium">
{{ "导出" }}
</download-excel>
<!-- 导出格式选择 - rqrq 不需要开放给用户-->
<!-- <el-select v-model="exportType" style="width: 160px; margin-right: 5px;">-->
<!-- <el-option label="CSV流式 (推荐)" value="csv_streaming"></el-option>-->
<!-- <el-option label="CSV 先查后写" value="csv"></el-option>-->
<!-- <el-option label="Excel 优化版" value="excel_optimized"></el-option>-->
<!-- <el-option label="Excel 默认" value="excel_default"></el-option>-->
<!-- </el-select>-->
<el-button type="primary" @click="exportFile()" :loading="exportLoading">
{{ exportLoading ? '导出中...' : '导出' }}
</el-button>
<el-button type="danger" @click="deleteData()" :disabled="selectedList.length === 0">删除</el-button> <el-button type="danger" @click="deleteData()" :disabled="selectedList.length === 0">删除</el-button>
</el-form-item> </el-form-item>
</el-form> </el-form>
@ -106,14 +102,14 @@
<el-dialog title="导入TID_EPC日志" :close-on-click-modal="false" v-drag :visible.sync="importModalFlag" width="500px" @close="closeImportModal"> <el-dialog title="导入TID_EPC日志" :close-on-click-modal="false" v-drag :visible.sync="importModalFlag" width="500px" @close="closeImportModal">
<el-form :inline="true" label-position="top" :model="importData" ref="importForm"> <el-form :inline="true" label-position="top" :model="importData" ref="importForm">
<el-row> <el-row>
<el-col :span="12">
<el-form-item label="Site" prop="site" :rules="[{required: true, message: '请选择Site', trigger: 'change'}]">
<el-input v-model="importData.site" disabled style="width: 200px"></el-input>
</el-form-item>
</el-col>
<!-- <el-col :span="12">-->
<!-- <el-form-item label="Site" prop="site" :rules="[{required: true, message: '请选择Site', trigger: 'change'}]">-->
<!-- <el-input v-model="importData.site" disabled style="width: 200px"></el-input>-->
<!-- </el-form-item>-->
<!-- </el-col>-->
<el-col :span="12"> <el-col :span="12">
<el-form-item label="BU" prop="buNo" :rules="[{required: true, message: '请选择BU', trigger: 'change'}]"> <el-form-item label="BU" prop="buNo" :rules="[{required: true, message: '请选择BU', trigger: 'change'}]">
<el-select v-model="importData.buNo" placeholder="请选择" style="width: 200px">
<el-select v-model="importData.buNo" placeholder="请选择" @change="buChange" style="width: 200px">
<el-option <el-option
v-for="i in userBuList" v-for="i in userBuList"
:key="i.buNo" :key="i.buNo"
@ -173,7 +169,7 @@
</template> </template>
<script> <script>
import { searchList, getExportList, importExcel, deleteData, downloadTemplate } from "@/api/mes/mesTidEpcLog.js"
import { searchList, exportCsv, importExcel, deleteData, downloadTemplate } from "@/api/mes/mesTidEpcLog.js"
import { getSiteAndBuByUserName } from "@/api/eam/eam.js" import { getSiteAndBuByUserName } from "@/api/eam/eam.js"
export default { export default {
@ -185,6 +181,7 @@
importModalFlag: false, importModalFlag: false,
importLoading: false, importLoading: false,
deleteLoading: false, deleteLoading: false,
exportLoading: false,
// - rqrq // - rqrq
dataList: [], dataList: [],
@ -218,11 +215,6 @@
fileList: [], fileList: [],
userBuList: [], userBuList: [],
// - rqrq
exportData: [],
exportName: 'TID_EPC日志导出.xls',
exportHeader: '',
exportFooter: ''
} }
}, },
@ -430,51 +422,53 @@
}).catch(() => {}) }).catch(() => {})
}, },
// - rqrq
fields() {
return {
'序号': 'seqNo',
'EPC': 'epc',
'TID': 'tid',
'用户区': 'userArea',
'LockiBtis': 'lockBits',
'密匙': 'secretKey',
'写码成功': 'writeSuccess',
'读码成功': 'readSuccess',
'EPC锁定': 'epcLocked',
'强度/读距': 'signalStrength',
'扫描时间': 'scanTime',
'计数': 'countInfo',
'批次号': 'batchNo',
'上传人': 'uploadBy',
'上传时间': 'uploadTime',
'备注': 'remark'
}
},
startDownload() {
this.$message.info('正在准备导出数据...')
},
finishDownload() {
this.$message.success('导出完成')
},
// - rqrq
async createExportData() {
// - rqrq
exportFile() {
// - rqrq // - rqrq
if (!this.validateSearchCondition()) { if (!this.validateSearchCondition()) {
this.$message.warning('请至少填写一个筛选条件后再导出') this.$message.warning('请至少填写一个筛选条件后再导出')
return []
return
} }
const { data } = await getExportList(this.searchData)
if (data && data.code === 0) {
return data.rows || []
} else {
this.$message.error('获取导出数据失败')
return []
this.exportLoading = true
this.$message.success('正在准备导出,请稍候...')
// CSVZIP - rqrq
exportCsv(this.searchData).then((response) => {
// Content-Type - rqrq
const contentType = response.headers['content-type'] || ''
let fileExt = '.csv'
let blobType = 'text/csv;charset=GB18030'
if (contentType.includes('zip')) {
fileExt = '.zip'
blobType = 'application/zip'
} }
// Blob - rqrq
const blob = new Blob([response.data], {type: blobType})
// - rqrq
const fileName = 'TID_EPC日志导出' + this.dayjs().format('YYYYMMDDHHmmss') + fileExt
// a - rqrq
const linkNode = document.createElement('a')
linkNode.download = fileName
linkNode.style.display = 'none'
linkNode.href = URL.createObjectURL(blob)
document.body.appendChild(linkNode)
linkNode.click()
URL.revokeObjectURL(linkNode.href)
document.body.removeChild(linkNode)
this.$message.success('导出完成')
}).catch(() => {
this.$message.error('导出失败')
}).finally(() => {
this.exportLoading = false
})
},
// BU - rqrq
buChange(val) {
// BU - rqrq
} }
} }
} }

Loading…
Cancel
Save