文件服务下载改为数据流

新建文件夹&删除文件夹
This commit is contained in:
zhujiyan
2024-09-11 19:39:55 +08:00
parent 6af2bc8397
commit 79cb8a9897
4 changed files with 168 additions and 11 deletions

View File

@@ -47,3 +47,33 @@ export function uploadDeviceFile(data) {
data: form
})
}
//新建文件夹目录
export function addDeviceDir(data) {
let form = new FormData()
form.append('nDid', data.nDid)
form.append('path', data.path)
return createAxios({
url: `/access-boot/askDeviceData/createFolder`,
method: 'POST',
headers: {
'Content-Type': 'application/x-www-form-urlencoded'
},
data: form
})
}
//删除文件/文件夹
export function delDeviceDir(data) {
let form = new FormData()
form.append('nDid', data.nDid)
form.append('path', data.path)
return createAxios({
url: `/access-boot/askDeviceData/deleteFolder`,
method: 'POST',
headers: {
'Content-Type': 'application/x-www-form-urlencoded'
},
data: form
})
}

View File

@@ -8,3 +8,13 @@ export function auditFeedBack(data:any) {
params:data
})
}
//下载文件
export function downLoadFile(filePath:any){
return createAxios({
url: '/system-boot/file/download',
method: 'get',
responseType: 'blob',
params:{filePath:filePath}
})
}

View File

@@ -14,7 +14,6 @@
:key="index"
@click="handleIntoByPath(item)"
>
<!-- <span>{{ index > 1 ? item.path.replace(activePathList[1].path, ' '): item.path }}</span> -->
<span>{{ outPutPath(item, index) }}</span>
</el-breadcrumb-item>
</el-breadcrumb>
@@ -33,6 +32,7 @@
></el-input>
<el-button type="primary" @click="handleSearch" :icon="Search">搜索</el-button>
<el-button @click="handleRefresh" :icon="Refresh">重置</el-button>
<el-button @click="handleAddNewDir" type="primary" :icon="Plus">新建文件夹</el-button>
<el-upload
v-if="!progressVisibile"
action=""
@@ -62,6 +62,9 @@
<el-button v-if="item?.type == 'file'" size="small" @click="handleDownLoad(item)" circle>
<el-icon><Download /></el-icon>
</el-button>
<el-button v-if="activePath!='/'" type="danger" @click="handleDelDirOrFile(item)" size="small" circle>
<el-icon><Delete /></el-icon>
</el-button>
</div>
<!-- <div class="item_upload">
<el-upload
@@ -104,6 +107,29 @@
<el-empty v-if="dirList.length == 0 || !dirList[0].type" />
</div>
<popup ref="fileRef"></popup>
<el-dialog
v-model="addDeviceDirOpen"
:destroy-on-close="true"
title="新建文件夹目录"
width="500"
@closed="close"
>
<el-form
ref="formRef"
:model="form"
:rules="{ path: [{ required: true, message: '请输入文件夹路径', trigger: 'blur' }] }"
>
<el-form-item label="文件夹路径" prop="path">
<el-input v-model="form.path" placeholder="请输入文件夹路径" />
</el-form-item>
</el-form>
<template #footer>
<div class="dialog-footer">
<el-button @click="close">取消</el-button>
<el-button type="primary" @click="submitDeviceDir">确定</el-button>
</div>
</template>
</el-dialog>
</div>
</template>
@@ -117,7 +143,9 @@ import {
getFileServiceFileOrDir,
downLoadDeviceFile,
uploadDeviceFile,
reStartDevice
reStartDevice,
addDeviceDir,
delDeviceDir
} from '@/api/cs-device-boot/fileService.ts'
import {
CirclePlus,
@@ -145,6 +173,8 @@ const nDid = ref<string>('')
//当前目录
const activePath = ref<string>('')
//判断是否是根目录
const isRoot = ref<boolean>(true)
//储存所有点击过的目录
const activePathList: any = ref([])
const nodeClick = (e: any) => {
@@ -152,7 +182,7 @@ const nodeClick = (e: any) => {
if (e.level == 2) {
nDid.value = e.ndid
getDeviceRootPath(nDid.value)
.then(res => {
.then((res: any) => {
loading.value = false
dirList.value = [res.data]
activePath.value = res.data.prjDataPath
@@ -170,7 +200,7 @@ const nodeClick = (e: any) => {
//搜索文件或文件夹
const filterFileName = ref('')
const handleSearch = () => {
let filterList = []
let filterList: any = []
dirList.value = currentDirList.value
dirList.value.map(item => {
if (filterFileName.value && item.prjDataPath.includes(filterFileName.value)) {
@@ -202,7 +232,7 @@ const handleRestartDevice = () => {
}
// 进入文件夹
const dirList = ref([])
// 村村当前目录数据
// 当前目录数据
const currentDirList = ref([])
const handleIntoDir = (row: any) => {
if (!row.type || row.type == 'file') return
@@ -227,6 +257,7 @@ const handleIntoDir = (row: any) => {
}
})
})
isRoot.value = false
}
//处理导航栏路径
@@ -264,6 +295,67 @@ const handleIntoByPath = async (val: any) => {
})
loading.value = false
})
isRoot.value = false
}
const form = ref({
path: ''
})
//新建文件夹弹框flag
const addDeviceDirOpen = ref<boolean>(false)
const close = () => {
addDeviceDirOpen.value = false
}
//打开新建文件夹弹框
const handleAddNewDir = () => {
form.value.path = ''
addDeviceDirOpen.value = true
}
//新建文件夹
const submitDeviceDir = () => {
let obj = {
nDid: nDid.value,
path: activePath.value == '/' ? activePath.value + form.value.path : activePath.value + '/' + form.value.path
}
loading.value=true
addDeviceDir(obj).then((res: any) => {
if (res.code == 'A0000') {
ElMessage.success(res.message)
getFileServiceFileOrDir({ nDid: nDid.value, name: activePath.value, type: 'dir' }).then((resp:any) => {
if (resp.code == 'A0000') {
dirList.value = resp.data
currentDirList.value = resp.data
activePathList.value.map((item: any, index: any) => {
if (item.path.includes(activePath.value) && item.path.length > activePath.value.length) {
activePathList.value.splice(index, 1)
}
})
loading.value = false
}
})
addDeviceDirOpen.value = false
}
})
}
//删除文件夹或文件
const handleDelDirOrFile = (row: any) => {
loading.value = true
delDeviceDir({ nDid: nDid.value, path: row.prjDataPath }).then((res: any) => {
if (res.code == 'A0000') {
getFileServiceFileOrDir({ nDid: nDid.value, name: activePath.value, type: 'dir' }).then((resp:any) => {
if (resp.code == 'A0000') {
dirList.value = resp.data
currentDirList.value = resp.data
activePathList.value.map((item: any, index: any) => {
if (item.path.includes(activePath.value) && item.path.length > activePath.value.length) {
activePathList.value.splice(index, 1)
}
})
loading.value = false
ElMessage.success(res.message)
}
})
}
})
}
//下载文件

View File

@@ -4,7 +4,11 @@
<el-dialog v-model="dialogVisible" title="文件信息" width="50%" @closed="handleClose">
<el-descriptions title="" style="margin: 10px 0" :column="2" :border="true" v-loading="loading">
<el-descriptions-item label="文件名称">
{{ fileData?.prjDataPath ? fileData?.prjDataPath.split("/")[fileData?.prjDataPath.split("/").length-1]: '/' }}
{{
fileData?.prjDataPath
? fileData?.prjDataPath.split('/')[fileData?.prjDataPath.split('/').length - 1]
: '/'
}}
</el-descriptions-item>
<el-descriptions-item label="文件大小">
{{ fileData?.size ? fileData?.size + '字节' : '/' }}
@@ -31,6 +35,7 @@
import { ref, onMounted, defineExpose, onBeforeUnmount, onUnmounted, defineEmits } from 'vue'
import { getFileServiceFileOrDir, downLoadDeviceFile } from '@/api/cs-device-boot/fileService.ts'
import { ElMessage } from 'element-plus'
import { downLoadFile } from '@/api/cs-system-boot/manage.ts'
const dialogVisible = ref(false)
const loading = ref(false)
const downLoading = ref(false)
@@ -68,12 +73,32 @@ const handleDownLoad = () => {
}
downLoading.value = true
downLoadDeviceFile(obj)
.then(res => {
.then((res: any) => {
if (res.code == 'A0000') {
window.open(res.data, '_blank')
downLoading.value = false
ElMessage.success(res.message)
handleClose()
downLoadFile(res.data).then((resp: any) => {
console.log(resp, '999999999999')
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)
link.click()
link.remove()
} else {
console.log(6666)
if (resp.code == 'A0000') {
window.open(res.data, '_blank')
downLoading.value = false
ElMessage.success(resp.message)
handleClose()
}
}
})
}
})
.catch(e => {