修改测试bug，优化页面
This commit is contained in:
guanj
@@ -1,212 +1,215 @@
|
||||
<!-- 设备文件下载 -->
|
||||
<template>
|
||||
<div :class="downLoading ? 'all_disabled' : ''">
|
||||
<el-dialog v-model.trim="dialogVisible" title="文件信息" width="50%" @closed="handleClose">
|
||||
<div v-loading="loading">
|
||||
<div class="download_progress"
|
||||
v-if="mqttFileName.includes(fileNameInfoMation) && status != 0 && status != 100">
|
||||
<div class="progress_left">
|
||||
正在下载：
|
||||
{{
|
||||
// fileData?.prjDataPath
|
||||
// ? fileData?.prjDataPath.split('/')[fileData?.prjDataPath.split('/').length - 1]
|
||||
// : '/'
|
||||
mqttFileName
|
||||
}}
|
||||
</div>
|
||||
<div class="progress_right">
|
||||
<el-progress :percentage="status" />
|
||||
</div>
|
||||
</div>
|
||||
<el-descriptions title="" style="margin: 10px 0" :column="2" :border="true">
|
||||
<el-descriptions-item label="文件名称">
|
||||
{{
|
||||
fileData?.prjDataPath
|
||||
? fileData?.prjDataPath.split('/')[fileData?.prjDataPath.split('/').length - 1]
|
||||
: '/'
|
||||
}}
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="文件大小">
|
||||
{{ fileData?.size ? fileData?.size + '字节' : '/' }}
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="文件时间">
|
||||
{{ fileData?.startTime ? fileData?.startTime : '/' }}
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="文件校验码">
|
||||
{{ fileData?.fileCheck ? fileData?.fileCheck : '/' }}
|
||||
</el-descriptions-item>
|
||||
</el-descriptions>
|
||||
</div>
|
||||
|
||||
<template #footer>
|
||||
<div class="dialog-footer download_status">
|
||||
<el-button @click="handleClose">取消</el-button>
|
||||
<el-button type="primary" @click="handleDownLoad" :disabled="loading" :loading="downLoading">
|
||||
{{ downLoading ? '下载中...' : '下载' }}
|
||||
</el-button>
|
||||
</div>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
<script lang="ts" setup>
|
||||
import { ref, onMounted, defineExpose, onUnmounted, defineEmits } from 'vue'
|
||||
import {
|
||||
getFileServiceFileOrDir,
|
||||
downLoadDeviceFile,
|
||||
downLoadDeviceFilePath
|
||||
} from '@/api/cs-device-boot/fileService.ts'
|
||||
import { ElMessage } from 'element-plus'
|
||||
import { useAdminInfo } from '@/stores/adminInfo'
|
||||
import { downLoadFile } from '@/api/cs-system-boot/manage.ts'
|
||||
const dialogVisible = ref(false)
|
||||
const loading = ref(false)
|
||||
const adminInfo = useAdminInfo()
|
||||
const downLoading = ref(false)
|
||||
const emit = defineEmits(['downLoadFile'])
|
||||
const handleClose = () => {
|
||||
status.value = 0
|
||||
mqttFileName.value = ''
|
||||
downLoading.value = false
|
||||
dialogVisible.value = false
|
||||
}
|
||||
//文件信息
|
||||
const fileData: any = ref({})
|
||||
//文件名称信息
|
||||
const fileNameInfoMation = ref<any>('')
|
||||
const open = async (row: any, id: any) => {
|
||||
status.value = 0
|
||||
fileData.value = {}
|
||||
dialogVisible.value = true
|
||||
loading.value = true
|
||||
const obj = {
|
||||
nDid: id,
|
||||
name: row.prjDataPath,
|
||||
type: row.type
|
||||
}
|
||||
await getFileServiceFileOrDir(obj).then((res: any) => {
|
||||
if (res.code == 'A0000') {
|
||||
if (res.data && res.data.length != 0) {
|
||||
fileData.value = res.data[0]
|
||||
fileData.value.nDid = id
|
||||
if (fileData.value && fileData.value.prjDataPath) {
|
||||
fileNameInfoMation.value =
|
||||
fileData.value.prjDataPath.split('/')[fileData.value.prjDataPath.split('/').length - 1]
|
||||
} else {
|
||||
fileNameInfoMation.value = '/'
|
||||
}
|
||||
}
|
||||
loading.value = false
|
||||
}
|
||||
})
|
||||
}
|
||||
const handleDownLoad = () => {
|
||||
const obj = {
|
||||
nDid: fileData.value.nDid,
|
||||
name: fileData.value.prjDataPath,
|
||||
size: fileData.value.size,
|
||||
fileCheck: fileData.value.fileCheck
|
||||
}
|
||||
downLoading.value = true
|
||||
downLoadDeviceFile(obj)
|
||||
.then((res: any) => {
|
||||
if (res.code == 'A0000') {
|
||||
// downLoadFile(res.data).then((resp: any) => {
|
||||
// if (resp.type != 'application/json') {
|
||||
// // 'application/vnd.ms-excel'
|
||||
// let blob = new Blob([resp], { type: resp.type })
|
||||
// const url = window.URL.createObjectURL(blob)
|
||||
// const link = document.createElement('a')
|
||||
// link.href = url
|
||||
// link.download = fileData.value?.prjDataPath
|
||||
// ? fileData.value?.prjDataPath.split('/')[fileData.value?.prjDataPath.split('/').length - 1]
|
||||
// : '/'
|
||||
// document.body.appendChild(link)
|
||||
// downLoading.value = false
|
||||
// link.click()
|
||||
// status.value = 100
|
||||
// ElMessage.success('文件下载成功')
|
||||
// link.remove()
|
||||
// handleClose()
|
||||
// } else {
|
||||
// if (resp.code == 'A0000') {
|
||||
// window.open(res.data, '_blank')
|
||||
// downLoading.value = false
|
||||
// ElMessage.success(resp.message)
|
||||
// handleClose()
|
||||
// }
|
||||
// }
|
||||
// })
|
||||
}
|
||||
})
|
||||
.catch(e => {
|
||||
console.log(e, '0000000')
|
||||
if (e) {
|
||||
downLoading.value = false
|
||||
}
|
||||
})
|
||||
}
|
||||
onMounted(() => { })
|
||||
onUnmounted(() => { })
|
||||
const status = ref(0)
|
||||
const mqttFileName = ref('')
|
||||
const setStatus = (val: any) => {
|
||||
status.value = parseInt(Number((val.nowStep / val.allStep) * 100)) || 0
|
||||
|
||||
mqttFileName.value = val.fileName
|
||||
if (adminInfo.userIndex != val.userId) return
|
||||
downLoading.value = true
|
||||
if (status.value == 100) {
|
||||
downLoadDeviceFilePath({ nDid: fileData.value.nDid, name: fileData.value.prjDataPath }).then((ress: any) => {
|
||||
if (ress.code == 'A0000') {
|
||||
downLoadFile(ress.data).then((resp: any) => {
|
||||
if (resp.type != 'application/json') {
|
||||
// 'application/vnd.ms-excel'
|
||||
let blob = new Blob([resp], { type: resp.type })
|
||||
const url = window.URL.createObjectURL(blob)
|
||||
const link = document.createElement('a')
|
||||
link.href = url
|
||||
link.download = fileData.value?.prjDataPath
|
||||
? fileData.value?.prjDataPath.split('/')[fileData.value?.prjDataPath.split('/').length - 1]
|
||||
: '/'
|
||||
document.body.appendChild(link)
|
||||
downLoading.value = false
|
||||
link.click()
|
||||
status.value = 100
|
||||
ElMessage.success('文件下载成功')
|
||||
link.remove()
|
||||
handleClose()
|
||||
} else {
|
||||
if (resp.code == 'A0000') {
|
||||
window.open(ress.data, '_blank')
|
||||
downLoading.value = false
|
||||
ElMessage.success(resp.message)
|
||||
handleClose()
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
defineExpose({ open, setStatus })
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.download_progress {
|
||||
display: flex;
|
||||
width: 100%;
|
||||
margin: 10px 0;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
|
||||
.progress_left {
|
||||
width: auto;
|
||||
}
|
||||
|
||||
.progress_right {
|
||||
flex: 1;
|
||||
padding-left: 10px;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
<!-- 设备文件下载 -->
|
||||
<template>
|
||||
<div :class="downLoading ? 'all_disabled' : ''">
|
||||
<el-dialog v-model.trim="dialogVisible" title="文件信息" width="50%" @closed="handleClose">
|
||||
<div v-loading="loading">
|
||||
<div
|
||||
class="download_progress"
|
||||
v-if="mqttFileName.includes(fileNameInfoMation) && status != 0 && status != 100"
|
||||
>
|
||||
<div class="progress_left">
|
||||
正在下载：
|
||||
{{
|
||||
// fileData?.prjDataPath
|
||||
// ? fileData?.prjDataPath.split('/')[fileData?.prjDataPath.split('/').length - 1]
|
||||
// : '/'
|
||||
mqttFileName
|
||||
}}
|
||||
</div>
|
||||
<div class="progress_right">
|
||||
<el-progress :percentage="status" />
|
||||
</div>
|
||||
</div>
|
||||
<el-descriptions title="" style="margin: 10px 0" :column="2" :border="true">
|
||||
<el-descriptions-item label="文件名称">
|
||||
{{
|
||||
fileData?.prjDataPath
|
||||
? fileData?.prjDataPath.split('/')[fileData?.prjDataPath.split('/').length - 1]
|
||||
: '/'
|
||||
}}
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="文件大小">
|
||||
{{ fileData?.size ? fileData?.size + '字节' : '/' }}
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="文件时间">
|
||||
{{ fileData?.startTime ? fileData?.startTime : '/' }}
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label="文件校验码">
|
||||
{{ fileData?.fileCheck ? fileData?.fileCheck : '/' }}
|
||||
</el-descriptions-item>
|
||||
</el-descriptions>
|
||||
</div>
|
||||
|
||||
<template #footer>
|
||||
<div class="dialog-footer download_status">
|
||||
<el-button @click="handleClose">取消</el-button>
|
||||
<el-button type="primary" @click="handleDownLoad" :disabled="loading" :loading="downLoading">
|
||||
{{ downLoading ? '下载中...' : '下载' }}
|
||||
</el-button>
|
||||
</div>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
<script lang="ts" setup>
|
||||
import { ref, onMounted, defineExpose, onUnmounted, defineEmits } from 'vue'
|
||||
import {
|
||||
getFileServiceFileOrDir,
|
||||
downLoadDeviceFile,
|
||||
downLoadDeviceFilePath
|
||||
} from '@/api/cs-device-boot/fileService.ts'
|
||||
import { ElMessage } from 'element-plus'
|
||||
import { useAdminInfo } from '@/stores/adminInfo'
|
||||
import { downLoadFile } from '@/api/cs-system-boot/manage.ts'
|
||||
import { log } from 'console'
|
||||
const dialogVisible = ref(false)
|
||||
const loading = ref(false)
|
||||
const adminInfo = useAdminInfo()
|
||||
const downLoading = ref(false)
|
||||
const emit = defineEmits(['downLoadFile'])
|
||||
const handleClose = () => {
|
||||
status.value = 0
|
||||
mqttFileName.value = ''
|
||||
downLoading.value = false
|
||||
dialogVisible.value = false
|
||||
}
|
||||
//文件信息
|
||||
const fileData: any = ref({})
|
||||
//文件名称信息
|
||||
const fileNameInfoMation = ref<any>('')
|
||||
const open = async (row: any, id: any) => {
|
||||
status.value = 0
|
||||
fileData.value = {}
|
||||
dialogVisible.value = true
|
||||
loading.value = true
|
||||
const obj = {
|
||||
nDid: id,
|
||||
name: row.prjDataPath,
|
||||
type: row.type
|
||||
}
|
||||
await getFileServiceFileOrDir(obj).then((res: any) => {
|
||||
if (res.code == 'A0000') {
|
||||
if (res.data && res.data.length != 0) {
|
||||
fileData.value = res.data[0]
|
||||
fileData.value.nDid = id
|
||||
if (fileData.value && fileData.value.prjDataPath) {
|
||||
fileNameInfoMation.value =
|
||||
fileData.value.prjDataPath.split('/')[fileData.value.prjDataPath.split('/').length - 1]
|
||||
} else {
|
||||
fileNameInfoMation.value = '/'
|
||||
}
|
||||
}
|
||||
loading.value = false
|
||||
}
|
||||
})
|
||||
}
|
||||
const handleDownLoad = () => {
|
||||
const obj = {
|
||||
nDid: fileData.value.nDid,
|
||||
name: fileData.value.prjDataPath,
|
||||
size: fileData.value.size,
|
||||
fileCheck: fileData.value.fileCheck
|
||||
}
|
||||
downLoading.value = true
|
||||
downLoadDeviceFile(obj)
|
||||
.then((res: any) => {
|
||||
if (res.code == 'A0000') {
|
||||
// downLoadFile(res.data).then((resp: any) => {
|
||||
// if (resp.type != 'application/json') {
|
||||
// // 'application/vnd.ms-excel'
|
||||
// let blob = new Blob([resp], { type: resp.type })
|
||||
// const url = window.URL.createObjectURL(blob)
|
||||
// const link = document.createElement('a')
|
||||
// link.href = url
|
||||
// link.download = fileData.value?.prjDataPath
|
||||
// ? fileData.value?.prjDataPath.split('/')[fileData.value?.prjDataPath.split('/').length - 1]
|
||||
// : '/'
|
||||
// document.body.appendChild(link)
|
||||
// downLoading.value = false
|
||||
// link.click()
|
||||
// status.value = 100
|
||||
// ElMessage.success('文件下载成功')
|
||||
// link.remove()
|
||||
// handleClose()
|
||||
// } else {
|
||||
// if (resp.code == 'A0000') {
|
||||
// window.open(res.data, '_blank')
|
||||
// downLoading.value = false
|
||||
// ElMessage.success(resp.message)
|
||||
// handleClose()
|
||||
// }
|
||||
// }
|
||||
// })
|
||||
}
|
||||
})
|
||||
.catch(e => {
|
||||
console.log(e, '0000000')
|
||||
if (e) {
|
||||
downLoading.value = false
|
||||
}
|
||||
})
|
||||
}
|
||||
onMounted(() => {})
|
||||
onUnmounted(() => {})
|
||||
const status = ref(0)
|
||||
const mqttFileName = ref('')
|
||||
const setStatus = (val: any) => {
|
||||
status.value = parseInt(Number((val.nowStep / val.allStep) * 100)) || 0
|
||||
|
||||
mqttFileName.value = val.fileName
|
||||
if (adminInfo.userIndex != val.userId) return
|
||||
downLoading.value = true
|
||||
if (status.value == 100) {
|
||||
downLoadDeviceFilePath({ nDid: fileData.value.nDid, name: fileData.value.prjDataPath }).then((ress: any) => {
|
||||
if (ress.code == 'A0000') {
|
||||
downLoadFile(ress.data).then((resp: any) => {
|
||||
if (resp.type != 'application/json') {
|
||||
// 'application/vnd.ms-excel'
|
||||
let blob = new Blob([resp], { type: resp.type })
|
||||
const url = window.URL.createObjectURL(blob)
|
||||
const link = document.createElement('a')
|
||||
link.href = url
|
||||
link.download = fileData.value?.prjDataPath
|
||||
? fileData.value?.prjDataPath.split('/')[fileData.value?.prjDataPath.split('/').length - 1]
|
||||
: '/'
|
||||
document.body.appendChild(link)
|
||||
downLoading.value = false
|
||||
link.click()
|
||||
status.value = 100
|
||||
ElMessage.success('文件下载成功')
|
||||
link.remove()
|
||||
handleClose()
|
||||
} else {
|
||||
if (resp.code == 'A0000') {
|
||||
window.open(ress.data, '_blank')
|
||||
downLoading.value = false
|
||||
ElMessage.success(resp.message)
|
||||
handleClose()
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
defineExpose({ open, setStatus })
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.download_progress {
|
||||
display: flex;
|
||||
width: 100%;
|
||||
margin: 10px 0;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
|
||||
.progress_left {
|
||||
width: auto;
|
||||
}
|
||||
|
||||
.progress_right {
|
||||
flex: 1;
|
||||
padding-left: 10px;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
Reference in New Issue
Block a user