feat(deviceParam): 添加设备参数导入功能

- 新增导入按钮,支持xlsx和xls格式文件上传
- 实现设备参数导入弹窗及拖拽上传区域
- 支持上传时是否更新已存在的设备参数数据
- 完成文件上传的进度、成功和失败处理逻辑
- 提供导入模板下载功能,便于格式规范
- 上传请求携带Token认证,确保接口安全
- 导入完成后刷新列表并显示导入结果提示
master
zangch@mesnac.com 2 weeks ago
parent 2798237780
commit 977ed5975c

@ -76,6 +76,16 @@
v-hasPermi="['base:deviceParam:remove']" v-hasPermi="['base:deviceParam:remove']"
>删除</el-button> >删除</el-button>
</el-col> </el-col>
<el-col :span="1.5">
<el-button
type="info"
plain
icon="el-icon-upload2"
size="mini"
@click="handleImport"
v-hasPermi="['base:deviceParam:import']"
>导入</el-button>
</el-col>
<el-col :span="1.5"> <el-col :span="1.5">
<el-button <el-button
type="warning" type="warning"
@ -202,6 +212,37 @@
<el-button @click="cancel"> </el-button> <el-button @click="cancel"> </el-button>
</div> </div>
</el-dialog> </el-dialog>
<!-- 设备参数导入对话框 -->
<el-dialog :title="upload.title" :visible.sync="upload.open" width="400px" append-to-body>
<el-upload
ref="upload"
:limit="1"
accept=".xlsx, .xls"
:headers="upload.headers"
:action="upload.url + '?updateSupport=' + upload.updateSupport"
:disabled="upload.isUploading"
:on-progress="handleFileUploadProgress"
:on-success="handleFileSuccess"
:on-error="handleFileError"
:auto-upload="false"
drag
>
<i class="el-icon-upload"></i>
<div class="el-upload__text">将文件拖到此处<em>点击上传</em></div>
<div class="el-upload__tip text-center" slot="tip">
<div class="el-upload__tip" slot="tip">
<el-checkbox v-model="upload.updateSupport" /> 是否更新已经存在的设备参数数据
</div>
<span>仅允许导入xlsxlsx格式文件</span>
<el-link type="primary" :underline="false" style="font-size:12px;vertical-align: baseline;" @click="importTemplate"></el-link>
</div>
</el-upload>
<div slot="footer" class="dialog-footer">
<el-button type="primary" @click="submitFileForm"> </el-button>
<el-button @click="upload.open = false"> </el-button>
</div>
</el-dialog>
</div> </div>
</template> </template>
@ -209,6 +250,7 @@
import { listDeviceParam, getDeviceParam, delDeviceParam, addDeviceParam, updateDeviceParam } from "@/api/base/deviceParam"; import { listDeviceParam, getDeviceParam, delDeviceParam, addDeviceParam, updateDeviceParam } from "@/api/base/deviceParam";
import { getDeviceLedgerList } from '@//api/base/deviceLedger' import { getDeviceLedgerList } from '@//api/base/deviceLedger'
import { findFactoryList } from '@//api/base/factory' import { findFactoryList } from '@//api/base/factory'
import { getToken } from "@/utils/auth"
export default { export default {
name: "DeviceParam", name: "DeviceParam",
@ -274,6 +316,21 @@ export default {
], ],
// //
deviceLedgerList: [], deviceLedgerList: [],
//
upload: {
//
open: false,
//
title: "",
//
isUploading: false,
//
updateSupport: 0,
//
headers: { Authorization: "Bearer " + getToken() },
//
url: process.env.VUE_APP_BASE_API + "/base/deviceParam/importData"
},
}; };
}, },
created() { created() {
@ -406,6 +463,43 @@ export default {
this.download('base/deviceParam/export', { this.download('base/deviceParam/export', {
...this.queryParams ...this.queryParams
}, `deviceParam_${new Date().getTime()}.xlsx`) }, `deviceParam_${new Date().getTime()}.xlsx`)
},
/** 导入按钮操作 */
handleImport() {
this.upload.title = "设备参数导入";
this.upload.open = true;
},
/** 下载模板操作 */
importTemplate() {
this.download('base/deviceParam/importTemplate', {
}, `deviceParam_template_${new Date().getTime()}.xlsx`)
},
//
handleFileUploadProgress(event, file, fileList) {
this.upload.isUploading = true;
},
//
handleFileSuccess(response, file, fileList) {
this.upload.open = false;
this.upload.isUploading = false;
this.$refs.upload.clearFiles();
if (response.code === 200) {
this.$alert("<div style='overflow: auto;overflow-x: hidden;max-height: 70vh;padding: 10px 20px 0;'>" + response.msg + "</div>", "导入结果", { dangerouslyUseHTMLString: true });
this.getList();
} else {
this.$modal.msgError(response.msg || "导入失败");
}
},
//
handleFileError(err, file, fileList) {
this.upload.open = false;
this.upload.isUploading = false;
this.$refs.upload.clearFiles();
this.$modal.msgError("文件上传失败,请重试");
},
//
submitFileForm() {
this.$refs.upload.submit();
} }
} }
}; };

Loading…
Cancel
Save