Skip to content

Commit 902b064

Browse files
committed
finshed folder function
1 parent c6f67d6 commit 902b064

7 files changed

Lines changed: 115 additions & 31 deletions

File tree

src/api/request.js

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -9,8 +9,12 @@ var r = Axios.create({
99
r.interceptors.response.use(response => {
1010
return response.data
1111
}, error => {
12+
var msg = error
13+
if (error.response && error.response.data && error.response.data.msg) {
14+
msg = error.response.data.msg
15+
}
1216
Message({
13-
message: error,
17+
message: msg,
1418
type: 'error',
1519
duration: 3 * 1000
1620
})

src/api/resource.js

Lines changed: 18 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -12,10 +12,27 @@ export function fetchFileList(parentId) {
1212

1313
export function createNewFolder(parentId, folderName){
1414
return request({
15-
url: '/v1/file1',
15+
url: '/v1/file',
1616
method: 'post',
1717
params: {
1818
parentId, folderName
1919
}
2020
})
21+
}
22+
23+
export function renameFile (id, fileName){
24+
return request({
25+
url: '/v1/file/' + id,
26+
method: 'put',
27+
params: {
28+
fileName
29+
}
30+
})
31+
}
32+
33+
export function deleteFile(id){
34+
return request({
35+
url: '/v1/file/' + id,
36+
method: 'delete',
37+
})
2138
}

src/components/Breadcrumb.vue

Lines changed: 27 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,16 @@
11
<template>
22
<div class="navigation">
33
<div class="navigation-prefix" v-if="levelList.length > 1">
4-
<span class="go-back">返回上一级</span>
4+
<span class="go-back" @click="goBack">返回上一级</span>
55
<span class="navigation-separator">|</span>
66
</div>
7-
<el-breadcrumb separator="/">
8-
<el-breadcrumb-item v-for="(val, index) in levelList" :key="index" :to="{ path: '/' }">{{val.name}}</el-breadcrumb-item>
9-
</el-breadcrumb>
7+
<div class="breadcrumb">
8+
<div class="breadcrumb-item" v-for="(val, index) in levelList" :key="index">
9+
<span v-if="(levelList.length - 1) !== index" @click="forwardTo(index)" class="breadcrumb-item-val">{{ val.name }}</span>
10+
<span v-else class="breadcrumb-item-val">{{ val.name }}</span>
11+
<span v-if="(levelList.length - 1) !== index" class="breadcrumb-sparator">/</span>
12+
</div>
13+
</div>
1014
</div>
1115
</template>
1216

@@ -17,12 +21,14 @@ export default {
1721
return this.$store.state.levelList;
1822
}
1923
},
20-
watch: {
21-
'$route' () {
22-
console.info('hhh')
23-
console.info(this.$route)
24+
methods: {
25+
forwardTo (index) {
26+
this.$store.commit('spliceLevelList', index)
27+
},
28+
goBack () {
29+
this.$store.commit('spliceLevelList', this.levelList.length - 2)
2430
}
25-
},
31+
}
2632
}
2733
</script>
2834

@@ -45,8 +51,19 @@ export default {
4551
.go-back:hover{
4652
color: #3794ff;
4753
}
48-
.el-breadcrumb{
54+
.breadcrumb{
4955
display: inline-block;
56+
cursor: pointer;
57+
.breadcrumb-item {
58+
display: inline-block;
59+
}
60+
.breadcrumb-sparator {
61+
display: inline-block;
62+
padding: 0 5px;
63+
}
64+
.breadcrumb-item-val:hover{
65+
color: #3794ff;
66+
}
5067
}
5168
}
5269
</style>

src/components/FileOperation.vue

Lines changed: 42 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -4,21 +4,56 @@
44
<i class="el-icon-more operation"></i>
55
</span>
66
<el-dropdown-menu slot="dropdown">
7-
<el-dropdown-item @click="moveTo(scope.$index, tableData)">移动到</el-dropdown-item>
8-
<el-dropdown-item>复制到</el-dropdown-item>
9-
<el-dropdown-item>重命名</el-dropdown-item>
10-
<el-dropdown-item v-if="scope.row.type !== 'folder'">下载</el-dropdown-item>
11-
<el-dropdown-item>删除</el-dropdown-item>
7+
<el-dropdown-item @click.native="move">移动到</el-dropdown-item>
8+
<el-dropdown-item @click.native="move">复制到</el-dropdown-item>
9+
<el-dropdown-item @click.native="rename">重命名</el-dropdown-item>
10+
<el-dropdown-item @click.native="move" v-if="scope.row.type !== 'folder'">下载</el-dropdown-item>
11+
<el-dropdown-item @click.native="deleteResource">删除</el-dropdown-item>
1212
</el-dropdown-menu>
1313
</el-dropdown>
1414
</template>
1515

1616
<script>
17+
import { renameFile, deleteFile } from '@/api/resource'
1718
export default {
1819
props: ['scope'],
1920
methods: {
20-
moveTo: function(index, tableData){
21-
alert(index, tableData)
21+
move: function(){
22+
this.$message({
23+
message: '该功能还为开发',
24+
type: 'warning',
25+
duration: 3 * 1000
26+
})
27+
},
28+
rename: function(){
29+
this.$prompt('请输入新的文件名', '重新命名', {
30+
confirmButtonText: '确定',
31+
cancelButtonText: '取消',
32+
inputValue: this.scope.row.name
33+
}).then(({value}) => {
34+
renameFile(this.scope.row.id, value).then(response => {
35+
this.$emit('flush')
36+
})
37+
}).catch(() => {})
38+
},
39+
deleteResource () {
40+
this.$confirm('是否确定要删除该文件?', '删除', {
41+
confirmButtonText: '确定',
42+
cancelButtonText: '取消',
43+
type: 'warning'
44+
}).then(() => {
45+
deleteFile(this.scope.row.id).then(response => {
46+
if (response.code === 500){
47+
this.$message({
48+
message: response.msg,
49+
type: 'error',
50+
duration: 3 * 1000
51+
})
52+
} else {
53+
this.$emit('flush')
54+
}
55+
})
56+
}).catch(() => {});
2257
}
2358
}
2459
}

src/router.js

Lines changed: 2 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -10,14 +10,12 @@ export default new Router({
1010
// mode: 'history',
1111
base: process.env.BASE_URL,
1212
routes: [
13+
{ path: '/', redirect: '/file', name: '首页'},
1314
{
1415
path: '/',
1516
name: 'home',
1617
component: Home,
1718
children: [{
18-
path: '',
19-
redirect: '/file'
20-
},{
2119
path: 'file',
2220
component: Main
2321
},{
@@ -26,4 +24,4 @@ export default new Router({
2624
}]
2725
}
2826
]
29-
})
27+
})

src/store.js

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -20,6 +20,9 @@ export default new Vuex.Store({
2020
},
2121
pushLevelList (state, val){
2222
state.levelList.push(val)
23+
},
24+
spliceLevelList(state, index){
25+
state.levelList.splice(index + 1, state.levelList.length - index)
2326
}
2427
},
2528
actions: {

src/views/layout/Main.vue

Lines changed: 18 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -51,7 +51,7 @@
5151
label="操作"
5252
min-width="22">
5353
<template scope="scope">
54-
<FileOperation :scope="scope" />
54+
<FileOperation v-on:flush="flushAccordingToLevelList" :scope="scope" />
5555
</template>
5656
</el-table-column>
5757
</el-table>
@@ -80,17 +80,24 @@ export default {
8080
return this.$store.state.levelList
8181
}
8282
},
83+
watch: {
84+
levelList (){
85+
this.flushAccordingToLevelList()
86+
}
87+
},
8388
methods: {
84-
createFolder: function(){
89+
createFolder (){
8590
let parentId = this.levelList[this.levelList.length - 1].parentId
8691
this.$prompt('请输入文件夹名', '新建文件夹', {
8792
confirmButtonText: '确定',
8893
cancelButtonText: '取消',
8994
}).then(({value}) => {
90-
createNewFolder(parentId, value)
95+
createNewFolder(parentId, value).then(response => {
96+
this.flushAccordingToLevelList()
97+
})
9198
}).catch(() => {})
9299
},
93-
getFileList: function(parentId, name){
100+
getFileList (parentId, name){
94101
fetchFileList(parentId).then(response => {
95102
this.tableData = response.data
96103
let len = this.levelList.length
@@ -103,10 +110,14 @@ export default {
103110
})
104111
})
105112
},
106-
formatterTime: function(row, column){
113+
flushAccordingToLevelList (){
114+
let lastVal = this.levelList[this.levelList.length - 1]
115+
this.getFileList(lastVal.parentId, lastVal.name)
116+
},
117+
formatterTime (row, column){
107118
return formatterMillisecond(new Date(row.gmtModified))
108119
},
109-
formatterSize: function(row, column){
120+
formatterSize (row, column){
110121
let s = row.size
111122
if (s === 0) {
112123
return '-'
@@ -125,8 +136,7 @@ export default {
125136
if (this.levelList.length === 0){
126137
this.getFileList(0, '全部文件')
127138
} else {
128-
let lastVal = this.levelList[this.levelList.length - 1]
129-
this.getFileList(lastVal.parentId, lastVal.name)
139+
this.flushAccordingToLevelList()
130140
}
131141
}
132142
}

0 commit comments

Comments
 (0)