Web/admin-govern
5
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

文件服务修改

Browse Source
This commit is contained in:
zhujiyan
2024-10-11 09:25:36 +08:00
parent 52bac41b68
commit 328837eb31
2 changed files with 158 additions and 139 deletions
Download Patch File Download Diff File Expand all files Collapse all files

286
src/views/govern/device/fileService/index.vue
View File

@@ -7,11 +7,13 @@
<div class="main_right" v-loading="loading">
<div class="right_nav">
<div class="menu" v-if="activePathList.length != 0">
<el-breadcrumb separator="/">
<el-breadcrumb-item v-for="(item, index) in activePathList" style="cursor: pointer" :key="index"
@click="handleIntoByPath(item)">
<el-breadcrumb-item
v-for="(item, index) in activePathList"
style="cursor: pointer"
:key="index"
@click="handleIntoByPath(item)"
>
<span>{{ outPutPath(item, index) }}</span>
</el-breadcrumb-item>
</el-breadcrumb>
@@ -22,14 +24,25 @@
</div>
<div class="filter" v-if="activePathList.length != 0">
<el-input style="width: 200px; height: 32px;-webkit-text-security:disc;" placeholder="请输入文件或文件夹名称"
clearable v-model="filterFileName" type="text"></el-input>
<el-input
style="width: 200px; height: 32px"
placeholder="请输入文件或文件夹名称"
clearable
v-model="filterText"
type="text"
></el-input>
<el-button type="primary" @click="handleSearch" :icon="Search">搜索</el-button>
<el-button @click="handleRefresh" :icon="Refresh">重置</el-button>
<el-upload v-if="activePath != '/'" action="" :auto-upload="false" :show-file-list="false" :on-change="(file: any, fileList: any) => {
<el-upload
v-if="activePath != '/'"
action=""
:auto-upload="false"
:show-file-list="false"
:on-change="(file: any, fileList: any) => {
handleUpload(file, fileList, activePath)
}
">
"
>
<el-button>
文件上传
<el-icon class="el-icon--right">
@@ -51,8 +64,13 @@
<div class="list" v-if="dirList.length != 0 && !loading">
<div class="list_item" v-for="(item, index) in dirList" :key="index">
<div class="item_download">
<el-button v-if="activePath && activePath != '/'" type="danger" size="small"
@click="handleDelDirOrFile(item)" circle>
<el-button
v-if="activePath && activePath != '/'"
type="danger"
size="small"
@click="handleDelDirOrFile(item)"
circle
>
<el-icon>
<Delete />
</el-icon>
@@ -62,32 +80,21 @@
<Download />
</el-icon>
</el-button>
<!-- <el-popconfirm
width="220"
confirm-button-text="确认"
cancel-button-text="取消"
:title="item?.type == 'file' ? '是否确认删除当前文件?' : '是否确认删除当前文件夹?'"
@confirm="handleDelDirOrFile(item)"
@cancel="cancelEvent"
>
<template #reference>
<el-button v-if="activePath && activePath != '/'" type="danger" size="small" circle>
<el-icon><Delete /></el-icon>
</el-button>
</template>
</el-popconfirm> -->
</div>
<img v-if="item?.type == 'dir'" @click="handleIntoDir(item)" src="@/assets/img/wenjianjia.svg" />
<img class="img_file" @click="handleIntoDir(item)" v-if="item?.type == 'file'"
src="@/assets/img/wenjian.svg" />
<img
class="img_file"
@click="handleIntoDir(item)"
v-if="item?.type == 'file'"
src="@/assets/img/wenjian.svg"
/>
<span v-if="!item.type">暂无数据</span>
<p>
{{
item &&
item?.prjDataPath &&
item?.prjDataPath.includes(activePath) &&
item?.prjDataPath.length > activePath.length
item?.prjDataPath &&
item?.prjDataPath.includes(activePath) &&
item?.prjDataPath.length > activePath.length
? item?.prjDataPath.replace(activePath, ' ').replace('/', ' ')
: item?.prjDataPath.replace('/', ' ')
}}
@@ -97,9 +104,18 @@
<el-empty v-if="dirList.length === 0" />
</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-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>
@@ -159,9 +175,7 @@ const activePath = ref<string>('')
//判断是否是根目录
const isRoot = ref<boolean>(true)
//储存所有点击过的目录
const activePathList: any = ref([
])
const activePathList: any = ref([])
const nodeClick = (e: any) => {
if (e.level == 2) {
loading.value = true
@@ -184,51 +198,48 @@ const nodeClick = (e: any) => {
}
}
//搜索文件或文件夹
const filterFileName = ref('')
const filterText = ref('')
const handleSearch = () => {
let filterList: any = []
dirList.value = currentDirList.value
dirList.value.map(item => {
if (filterFileName.value && item.prjDataPath.includes(filterFileName.value)) {
if (filterText.value && item.prjDataPath.includes(filterText.value)) {
filterList.push(item)
}
})
if (filterList.length != 0) {
dirList.value = filterList
}
if (!filterFileName) {
if (filterList.length == 0) {
dirList.value = []
}
if (!filterText.value) {
dirList.value = currentDirList.value
}
}
//重置搜索
const handleRefresh = () => {
loading.value = true
filterFileName.value = ''
filterText.value = ''
dirList.value = currentDirList.value
reloadCurrentMenu('')
}
const reboot: any = ref('')
const vNode = () => {
return h('div', {}, [
h(ElInput, {
modelValue: reboot.value,
'onUpdate:modelValue': ($event: any) => {
reboot.value = $event;
reboot.value = $event
},
placeholder: '请输入姓名',
type: 'password',
autocomplete: "off",
autocomplete: 'off',
class: 'displayPass'
}),
]);
};
})
])
}
//装置重启
const deviceRestartLoading = ref<boolean>(false)
@@ -238,10 +249,7 @@ const handleRestartDevice = () => {
confirmButtonText: '确认',
cancelButtonText: '取消',
customClass: 'customInput',
inputType: 'text',
inputType: 'text'
})
.then(({ value }) => {
if (!value) {
@@ -256,6 +264,8 @@ const handleRestartDevice = () => {
if (res.code == 'A0000') {
deviceRestartLoading.value = false
ElMessage({ message: res.message, type: 'success', duration: 5000 })
}else{
deviceRestartLoading.value = false
}
})
}
@@ -287,20 +297,21 @@ const handleIntoDir = (row: any) => {
if (activePathList.value.indexOf(obj.name) == -1) {
activePathList.value.push({ path: obj.name })
}
getFileServiceFileOrDir(obj).then(res => {
dirList.value = res.data
loading.value = false
currentDirList.value = res.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)
}
getFileServiceFileOrDir(obj)
.then(res => {
dirList.value = res.data
loading.value = false
currentDirList.value = res.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)
}
})
isRoot.value = false
})
.catch(e => {
loading.value = false
})
isRoot.value = false
}).catch(e => {
loading.value = false
})
}
//处理导航栏路径
@@ -318,7 +329,6 @@ const outPutPath = (row: any, key: any) => {
}
if (row.path.split('/').length !== 0) {
path = '/' + row.path.split('/')[row.path.split('/').length - 1]
}
}
return path.split('/')[1]
@@ -333,18 +343,19 @@ const handleIntoByPath = async (val: any) => {
}
activePath.value = val.path
loading.value = true
getFileServiceFileOrDir(obj).then(res => {
dirList.value = res.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)
}
getFileServiceFileOrDir(obj)
.then(res => {
dirList.value = res.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
})
.catch(e => {
loading.value = false
})
loading.value = false
}).catch(e => {
loading.value = false
})
}
const form = ref({
path: ''
@@ -363,28 +374,25 @@ const formRef = ref()
//重新加载当前页面菜单
const reloadCurrentMenu = (msg: string) => {
loading.value = true
getFileServiceFileOrDir({ nDid: nDid.value, name: activePath.value, type: 'dir' }).then((resp: any) => {
if (resp.code == 'A0000') {
getFileServiceFileOrDir({ nDid: nDid.value, name: activePath.value, type: 'dir' })
.then((resp: any) => {
if (resp.code == 'A0000') {
loading.value = false
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
if (!msg) return
ElMessage({ message: msg, type: 'success', duration: 5000 })
}
})
.catch(e => {
loading.value = false
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
if (!msg) return
ElMessage({ message: msg, type: 'success', duration: 5000 })
}
}).catch(e => {
loading.value = false
})
// setTimeout(() => {
// loading.value = false
// },0)
})
}
//新建文件夹
const submitDeviceDir = () => {
@@ -410,7 +418,6 @@ const submitDeviceDir = () => {
}
//删除文件夹或文件
const handleDelDirOrFile = (row: any) => {
// delDeviceDir({ nDid: nDid.value, path: row.prjDataPath }).then((res: any) => {
// if (res.code == 'A0000') {
// reloadCurrentMenu(res.message)
@@ -423,40 +430,36 @@ const handleDelDirOrFile = (row: any) => {
cancelButtonText: '取消',
customClass: 'customInput',
inputType: 'text'
}).then(({ value }) => {
if (!value) {
ElMessage.warning('请输入密码')
} else {
loading.value = true
passwordConfirm(value)
.then((resp: any) => {
if (resp.code == 'A0000') {
delDeviceDir({ nDid: nDid.value, path: row.prjDataPath }).then((res: any) => {
if (res.code == 'A0000') {
reloadCurrentMenu(res.message)
// ElMessage({ message: res.message, type: 'success', duration: 5000 })
}
})
}
})
.catch(e => {
loading.value = false
})
}
})
.then(({ value }) => {
if (!value) {
ElMessage.warning('请输入密码')
} else {
loading.value = true
passwordConfirm(value)
.then((resp: any) => {
if (resp.code == 'A0000') {
delDeviceDir({ nDid: nDid.value, path: row.prjDataPath }).then((res: any) => {
if (res.code == 'A0000') {
reloadCurrentMenu(res.message)
// ElMessage({ message: res.message, type: 'success', duration: 5000 })
}
})
}
})
.catch(e => {
loading.value = false
})
}
})
}
const changeType = ref<any>('')
//下载文件
const fileRef = ref()
const handleDownLoad = async (row: any) => {
; (await nDid.value) && fileRef.value && fileRef.value.open(row, nDid.value)
fileName.value = row?.prjDataPath.split('/')[row?.prjDataPath.split('/').length - 1]
localStorage.setItem('fileName', fileName.value)
;(await nDid.value) && fileRef.value && fileRef.value.open(row, nDid.value)
// fileName.value = row?.prjDataPath.split('/')[row?.prjDataPath.split('/').length - 1]
// localStorage.setItem('fileName', fileName.value)
changeType.value = 'download'
localStorage.setItem('changeType', changeType.value)
}
@@ -513,6 +516,7 @@ const connectMqtt = () => {
username: 't_user',
password: 'njcnpqs'
}
// 线上
// const url = 'wss://pqmcn.com:8087/mqtt'
const url = 'ws://192.168.1.24:8085/mqtt'
mqttRef.value = mqtt.connect(url, options)
@@ -525,15 +529,28 @@ mqttRef.value.on('connect', (e: any) => {
mqttRef.value.subscribe('/Web/Progress/+')
})
const mqttMessage = ref<any>({})
const status = ref<any>()
const status: any = ref()
mqttRef.value.on('message', (topic: any, message: any) => {
// console.log('🚀 ~ mqttRef.value.on ~ message:', JSON.parse(message))
// console.log('mqtt接收到消息', message,topic)
console.log('mqtt接收到消息', JSON.parse(JSON.stringify(JSON.parse(new TextDecoder().decode(message)))))
// "{allStep:\""+times+"\",nowStep:"+i+"}"
let str = JSON.parse(JSON.stringify(JSON.parse(new TextDecoder().decode(message))))
mqttMessage.value = eval('(' + str + ')')
// eval('(' + str + ')').includes('fileName')
let regex = /fileName:(.*?),allStep/
let regex1 = /allStep:(.*?),nowStep/
let regex2 = /nowStep:(.*?)}/
mqttMessage.value = {
fileName: str.match(regex)[1],
allStep: str.match(regex1)[1],
nowStep: str.match(regex2)[1]
}
console.log(mqttMessage.value, '?????????')
status.value = parseInt(Number((mqttMessage.value.nowStep / mqttMessage.value.allStep) * 100))
fileRef.value.setStatus(status.value)
fileRef.value.setStatus(mqttMessage.value)
fileName.value = mqttMessage.value.fileName
localStorage.setItem('fileName', fileName.value)
if (status.value == 100) {
status.value = 99
}
@@ -711,7 +728,6 @@ onBeforeUnmount(() => {
:deep(.el-breadcrumb__separator) {
margin: 0px -10px 0px 0px;
}
</style>
<style lang="scss">
.customInput {
@@ -719,4 +735,4 @@ onBeforeUnmount(() => {
-webkit-text-security: disc !important;
}
}
</style>
</style>