0017
/
iot-ui-vue
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

fix: 设备导出

This commit is contained in:
100011797 2023-03-22 18:08:56 +08:00
parent 6deb18fc1a
commit 45273951c5
7 changed files with 72 additions and 63 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/api/device/instance.ts
View File

@ -107,7 +107,7 @@ export const deviceImport = (productId: string, fileUrl: string, autoDeploy: boo
* @param type 文件类型
* @returns
*/
export const deviceExport = (productId: string, type: string) => `${BASE_API_PATH}/device-instance${!!productId ? `/${productId}` : ''}/export.${type}`
export const deviceExport = (productId: string, type: string, params?: any) => server.get(`/device-instance${!!productId ? `/${productId}` : ''}/export.${type}`, params, {responseType: 'blob'})
/**
* 验证设备ID是否重复

2
src/api/iot-card/cardManagement.ts
View File

@ -97,7 +97,7 @@ export const _import = (configId: any, params: any) => server.get(`/network/card
* @param format 类型 xlsx、csv
* @param params
*/
export const _export = (format: string, data: any) => server.post(`/network/card/download.${format}/_query`, data, { responseType: 'blob' });
export const _export = (format: string, data: any) => server.postStream(`/network/card/download.${format}/_query`, data);
/**
* 下载模板

11
src/utils/request.ts
View File

@ -112,6 +112,12 @@ export const getStream = function(url: string, params = {}) {
})
}
export const postStream = function(url: string, data={}, params = {}) {
return post<any>(url, data, params, {
responseType: 'arraybuffer' // 设置请求数据类型，返回blob可解析类型
})
}
/**
* 异常拦截处理器
* @param {Object} error
@ -208,7 +214,7 @@ request.interceptors.response.use(response => {
}
// 如果返回的的是文件流，那么return值则为response
if (response.headers['content-type'] === 'application/octet-stream; charset=UTF-8' || response.headers['content-type'] === 'application/vnd.ms-excel;charset=UTF-8') {
return response
return response.data
} else {
return response.data
}
@ -222,5 +228,6 @@ export default {
patch,
put,
remove,
getStream
getStream,
postStream
}

44
src/utils/utils.ts
View File

@ -1,7 +1,7 @@
import moment from "moment";
import { LocalStore } from "./comm";
import { TOKEN_KEY } from "./variable";
import {SystemConst} from './consts';
import { SystemConst } from './consts';
/**
* 把数据下载成JSON
@ -30,7 +30,7 @@ export const downloadObject = (record: Record<string, any>, fileName: string, fo
* @param url 下载链接
* @param params 参数
*/
export const downloadFile = (url: string, params?: Record<string, any>) => {
export const downloadFile = (url: string, params?: Record<string, any>) => {
const formElement = document.createElement('form');
formElement.style.display = 'display:none;';
formElement.method = 'GET';
@ -91,29 +91,29 @@ export const randomString = (length?: number) => {
* @returns
*/
export const timestampFormat = (time: number) => {
let hour = 0;
let minute = 0;
let second = 0;
const timeStr = 'hh小时mm分钟ss秒';
let hour = 0;
let minute = 0;
let second = 0;
const timeStr = 'hh小时mm分钟ss秒';
if (time) {
if (time >= 60 * 60 * 1000) {
hour = Math.trunc(time / (60 * 60 * 1000));
}
if (time >= 60 * 1000) {
minute = Math.trunc((time - hour * 60 * 60 * 1000) / (60 * 1000));
}
second = Math.trunc(
(time - hour * (60 * 60 * 1000) - minute * 60 * 1000) / 1000,
);
if (time) {
if (time >= 60 * 60 * 1000) {
hour = Math.trunc(time / (60 * 60 * 1000));
}
return timeStr
.replace('hh', hour.toString())
.replace('mm', minute.toString())
.replace('ss', second.toString());
if (time >= 60 * 1000) {
minute = Math.trunc((time - hour * 60 * 60 * 1000) / (60 * 1000));
}
second = Math.trunc(
(time - hour * (60 * 60 * 1000) - minute * 60 * 1000) / 1000,
);
}
return timeStr
.replace('hh', hour.toString())
.replace('mm', minute.toString())
.replace('ss', second.toString());
};
export const ArrayToTree = (list: any[]): any[] => {

22
src/views/device/Instance/Export/index.vue
View File

@ -49,7 +49,7 @@
<script lang="ts" setup>
import { queryNoPagingPost } from '@/api/device/product';
import { downloadFile } from '@/utils/utils';
import { downloadFileByUrl } from '@/utils/utils';
import encodeQuery from '@/utils/encodeQuery';
import { deviceExport } from '@/api/device/instance';
@ -83,13 +83,23 @@ watch(
{ immediate: true, deep: true },
);
const handleOk = () => {
const handleOk = async () => {
const params = encodeQuery(props.data);
downloadFile(
deviceExport(modelRef.product || '', modelRef.fileType),
params,
// downloadFile(
// deviceExport(modelRef.product || '', modelRef.fileType),
// params,
// );
const res: any = await deviceExport(
modelRef.product || '',
modelRef.fileType,
params
);
emit('close');
if (res) {
const blob = new Blob([res], { type: modelRef.fileType });
const url = URL.createObjectURL(blob);
downloadFileByUrl(url, `设备实例`, modelRef.fileType);
emit('close');
}
};
const handleCancel = () => {

50
src/views/device/Instance/Process/index.vue
View File

@ -3,16 +3,22 @@
:maskClosable="false"
width="800px"
:visible="true"
title="当前进度"
@ok="handleCancel"
@cancel="handleCancel"
:title="type === 'active' ? '启用' : '同步'"
:closable="false"
>
<div>
<j-badge v-if="flag" status="processing" text="进行中" />
<j-badge v-else status="success" text="已完成" />
<div style="margin: 10px 0px 20px 0px">
<div v-if="flag">
<div>{{ type === 'active' ? '正在启用全部设备' : '正在同步设备状态' }}</div>
<j-progress :percent="50" />
</div>
<div v-else>
<p>{{ type === 'active' ? '启用' : '同步' }}成功：{{ count }}条</p>
<p v-if="type === 'active'">启用失败：{{ errCount }}条<j-tooltip title="实例信息页面中的配置项未完善"><AIcon type="QuestionCircleOutlined" /></j-tooltip></p>
</div>
</div>
<p>总数量：{{ count }}</p>
<a style="color: red">{{ errMessage }}</a>
<template #footer>
<j-button v-if="!flag" type="primary" @click="handleCancel">完成</j-button>
</template>
</j-modal>
</template>
@ -32,8 +38,8 @@ const props = defineProps({
});
// const eventSource = ref<Record<string, any>>({})
const count = ref<number>(0);
const flag = ref<boolean>(false);
const errMessage = ref<string>('');
const flag = ref<boolean>(true);
const errCount = ref<number>(0);
const isSource = ref<boolean>(false);
const id = ref<string>('');
const source = ref<Record<string, any>>({});
@ -43,30 +49,27 @@ const handleCancel = () => {
emit('save');
};
// const handleOk = () => {
// emit('close');
// emit('save');
// };
const getData = (api: string) => {
flag.value = true;
let dt = 0;
const _source = new EventSourcePolyfill(api);
source.value = _source;
_source.onmessage = (e: any) => {
const res = JSON.parse(e.data);
// console.log(res)
switch (props.type) {
case 'active':
if (res.success) {
_source.close();
dt += res.total;
count.value = dt;
} else {
if (res.source) {
const msg = `${res.source.name}: ${res.message}`;
errMessage.value = msg;
errCount.value = 1
id.value = res.source.id;
isSource.value = true;
} else {
errMessage.value = res.message;
errCount.value = 1
}
}
break;
@ -74,22 +77,13 @@ const getData = (api: string) => {
dt += res;
count.value = dt;
break;
case 'import':
if (res.success) {
const temp = res.result.total;
dt += temp;
count.value = dt;
} else {
errMessage.value = res.message;
}
break;
default:
break;
}
};
_source.onerror = () => {
flag.value = false;
_source.close();
flag.value = false;
};
_source.onopen = () => {};
};

4
src/views/iot-card/CardManagement/Export.vue
View File

@ -43,11 +43,9 @@ const type = ref<string>('xlsx');
const handleOk = () => {
_export(type.value, props.data).then((res: any) => {
console.log(res)
if (res) {
const blob = new Blob([res], { type: type.value });
const blob = new Blob([res.data], { type: type.value });
const url = URL.createObjectURL(blob);
console.log(url, 123);
downloadFileByUrl(
url,
`物联卡管理-${moment(new Date()).format(