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-09-03 10:52:36 +08:00
parent 9fc5cc92a8
commit 26390b55f7
1 changed files with 46 additions and 22 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -28,19 +28,24 @@
<el-button type="primary" @click="handleSearch">搜索</el-button> <el-button type="primary" @click="handleSearch">搜索</el-button>
<el-button @click="handleRefresh">重置</el-button> <el-button @click="handleRefresh">重置</el-button>
<el-upload <el-upload
action="" v-if="!progressVisibile"
:auto-upload="false" action=""
:show-file-list="false" :auto-upload="false"
:on-change=" :show-file-list="false"
:on-change="
(file:any, fileList:any) => { (file:any, fileList:any) => {
handleUpload(file, fileList, activePath) handleUpload(file, fileList, activePath)
} }
" "
> >
<el-button> <el-button>
文件上传<el-icon class="el-icon--right"><Upload /></el-icon> 文件上传
</el-button> <el-icon class="el-icon--right"><Upload /></el-icon>
</el-upload> </el-button>
</el-upload>
<div class="upload_progress" v-if="progressVisibile">
{{ fileName }} <el-progress :percentage="30" :indeterminate="true"><el-button text>上传中...</el-button></el-progress>
</div>
</div> </div>
<div class="list" v-if="dirList.length != 0 && !loading"> <div class="list" v-if="dirList.length != 0 && !loading">
<div class="list_item" v-for="(item, index) in dirList" :key="index"> <div class="list_item" v-for="(item, index) in dirList" :key="index">
@@ -87,7 +92,7 @@
</p> </p>
</div> </div>
</div> </div>
<el-empty v-if="dirList.length == 0||!dirList[0].type" /> <el-empty v-if="dirList.length == 0 || !dirList[0].type" />
</div> </div>
<popup ref="fileRef"></popup> <popup ref="fileRef"></popup>
</div> </div>
@@ -123,18 +128,20 @@ const nodeClick = (e: any) => {
loading.value = true loading.value = true
if (e.level == 2) { if (e.level == 2) {
nDid.value = e.ndid nDid.value = e.ndid
getDeviceRootPath(nDid.value).then(res => { getDeviceRootPath(nDid.value)
loading.value = false .then(res => {
dirList.value = [res.data] loading.value = false
activePath.value = res.data.prjDataPath dirList.value = [res.data]
activePathList.value.map((item: any, index: any) => { activePath.value = res.data.prjDataPath
if (item.path.indexOf(res.data.prjDataPath) == -1) { activePathList.value.map((item: any, index: any) => {
activePathList.value.push({ path: activePath.value }) if (item.path.indexOf(res.data.prjDataPath) == -1) {
} activePathList.value.push({ path: activePath.value })
}
})
})
.catch(e => {
loading.value = false
}) })
}).catch((e)=>{
loading.value = false
})
} }
} }
//搜索文件或文件夹 //搜索文件或文件夹
@@ -231,15 +238,20 @@ const handleDownLoad = async (row: any) => {
;(await nDid.value) && fileRef.value && fileRef.value.open(row, nDid.value) ;(await nDid.value) && fileRef.value && fileRef.value.open(row, nDid.value)
} }
//上传文件 //上传文件
const progressVisibile = ref<boolean>(false)
const fileName = ref<string>('')
const handleUpload = (e: any, fileList: any, row: any) => { const handleUpload = (e: any, fileList: any, row: any) => {
fileName.value = e.name
const obj = { const obj = {
id: nDid.value, id: nDid.value,
file: e.raw, file: e.raw,
filePath: row|| row.prjDataPath filePath: row || row.prjDataPath
} }
progressVisibile.value = true
uploadDeviceFile(obj).then(res => { uploadDeviceFile(obj).then(res => {
if (res.code == 'A0000') { if (res.code == 'A0000') {
ElMessage.success(res.message) ElMessage.success(res.message)
progressVisibile.value = false
} }
}) })
} }
@@ -300,6 +312,18 @@ watch(
.el-button { .el-button {
margin-left: 10px; margin-left: 10px;
} }
.upload_progress {
flex: 1;
height: 30px;
display: flex;
align-items: center;
justify-content: flex-start;
margin-left: 10px;
.el-progress {
width: 300px;
margin-left: 10px;
}
}
} }
.list { .list {
display: flex; display: flex;