FileTree.vue
1.66 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
<template>
<el-dialog
:visible.sync="fileTreeDialog"
:close-on-click-modal="false"
width="55%"
:show-close="false"
top="52px"
>
<p class="arrow">
<el-button
icon="el-icon-download"
@click="download()"
style="download"
type="primary"
size="mini"
>下载</el-button
>
<span
style="float :right;padding-right:40px;font-size: 20px;color: rgb(223 227 234);cursor: pointer;"
@click="close"
><i style="font-size: 20px;" class="el-icon-close"></i
></span>
</p>
<el-tree :data="fileTree" :props="filesProps"></el-tree>
</el-dialog>
</template>
<script>
import { Message } from "element-ui";
import req from "@/request.js";
import { mapState, mapActions } from "vuex";
export default {
name: "file-tree",
props: ["fileTree", "fileRow"],
data() {
return {
fileTreeDialog: false,
filesProps: {
label: "originName",
children: "childList"
}
};
},
methods: {
handleOpen() {
this.fileTreeDialog = true;
},
//关闭弹框
close() {
this.fileTreeDialog = false;
},
//附件下载
download() {
req.download(
"${portal}/system/file/v1/downloadFile?fileId=" + this.fileRow.id
);
}
}
};
</script>
<style lang="scss">
.currentPage {
cursor: pointer;
color: #8c8e92;
}
.currentPage:hover {
color: #2761ff;
}
.arrow{
position: fixed;
top: 0px;
left :0px;
z-index: 2;
width: 100%;
background-color: #191919;
padding: 12px 0;
margin: 0;
text-align :center;
}
/deep/.el-dialog__body {
color: #606266;
font-size: 14px;
padding:0;
}
</style>