新增文件移动功能
This commit is contained in:
龙运模
parent
4389884309
commit
eb5e1ce43a
@ -65,6 +65,20 @@ export default {
|
||||
post: async function (params) {
|
||||
return await http.post(this.url, params);
|
||||
},
|
||||
},
|
||||
folderSelect:{
|
||||
url: `${config.API_URL}/document.folder.select.list`,
|
||||
name: "部门列表下拉",
|
||||
post: async function (params) {
|
||||
return await http.post(this.url, params);
|
||||
},
|
||||
},
|
||||
move:{
|
||||
url: `${config.API_URL}/document.file.move`,
|
||||
name: "移动文件｜文件夹",
|
||||
post: async function (params) {
|
||||
return await http.post(this.url, params);
|
||||
},
|
||||
}
|
||||
},
|
||||
share:{
|
||||
|
||||
@ -25,6 +25,9 @@ export default {
|
||||
docsRouter:[
|
||||
{name:'我的文档',id:''}
|
||||
],
|
||||
shareRouter:[
|
||||
{name:'我的文档',id:''}
|
||||
]
|
||||
},
|
||||
mutations: {
|
||||
SET_ismobile(state, key){
|
||||
@ -55,5 +58,8 @@ export default {
|
||||
SET_docs_router(state, key){
|
||||
state.docsRouter = key
|
||||
},
|
||||
SET_share_router(state, key){
|
||||
state.shareRouter = key
|
||||
},
|
||||
}
|
||||
}
|
||||
|
||||
@ -51,10 +51,11 @@
|
||||
<el-dropdown-item @click="batch_del" icon="sc-icon-Delete">删除</el-dropdown-item>
|
||||
<el-dropdown-item @click="table_edit('edit')" icon="sc-icon-Edit">重命名</el-dropdown-item>
|
||||
<el-dropdown-item @click="share_edit('edit')" icon="sc-icon-ShareBtn">共享</el-dropdown-item>
|
||||
<el-dropdown-item @click="move_file" icon="sc-icon-ShareBtn">移动文件夹</el-dropdown-item>
|
||||
</el-dropdown-menu>
|
||||
</template>
|
||||
</el-dropdown>
|
||||
<el-button type="primary" plain :size="size" icon="el-icon-sort"></el-button>
|
||||
<!-- <el-button type="primary" plain :size="size" icon="el-icon-sort"></el-button>-->
|
||||
</div>
|
||||
<div class="right-panel">
|
||||
<scExportList :size="size" @updateShow="exportChangeShow" :exportList="exportList" :show="exportShow" type="14">
|
||||
@ -96,19 +97,22 @@
|
||||
<uploadFile ref="uploadFile" @uploadFileSuccess="uploadFileSuccess" title="上传附件"></uploadFile>
|
||||
<save-dialog v-if="dialog.save" ref="saveDialog" @success="handleSaveSuccess" @closed="dialog.save=false"></save-dialog>
|
||||
<shareSave v-if="dialog.shareSave" ref="shareSave" @success="handleSaveSuccess" @closed="dialog.shareSave=false"></shareSave>
|
||||
<moveFile v-if="dialog.move" ref="moveSave" @success="handleSaveSuccess" @closed="dialog.move=false"></moveFile>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import saveDialog from './save'
|
||||
import uploadFile from './uploadFile'
|
||||
import shareSave from './shareSave'
|
||||
import moveFile from './moveFile'
|
||||
|
||||
export default {
|
||||
name: 'document',
|
||||
components: {
|
||||
saveDialog,
|
||||
uploadFile,
|
||||
shareSave
|
||||
shareSave,
|
||||
moveFile
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
@ -122,7 +126,8 @@ export default {
|
||||
|
||||
dialog: {
|
||||
save: false,
|
||||
shareSave: false
|
||||
shareSave: false,
|
||||
move:false,
|
||||
},
|
||||
list:{
|
||||
apiObj: this.$API.docs.manager.list,
|
||||
@ -185,7 +190,11 @@ export default {
|
||||
let row = this.selection[0];
|
||||
this.dialog.save = true
|
||||
this.$nextTick(() => {
|
||||
this.$refs.saveDialog.open('edit').setData(row)
|
||||
if(row.type == 'file'){
|
||||
this.$refs.saveDialog.open('rename').setData(row)
|
||||
}else{
|
||||
this.$refs.saveDialog.open('edit').setData(row)
|
||||
}
|
||||
})
|
||||
},
|
||||
// 上传附件
|
||||
@ -252,6 +261,7 @@ export default {
|
||||
}else if(mode=='edit'){
|
||||
this.$refs.table.refresh()
|
||||
}
|
||||
this.$refs.table.refresh()
|
||||
},
|
||||
|
||||
uploadFileSuccess(){
|
||||
@ -290,6 +300,18 @@ export default {
|
||||
this.exportList = res.data;
|
||||
this.$message.success('操作成功，马上导出');
|
||||
}
|
||||
},
|
||||
// 移动文件
|
||||
move_file(){
|
||||
if(this.selection.length<1){
|
||||
this.$message.warning('请选择想要移动的文件、文件夹');
|
||||
return
|
||||
}
|
||||
|
||||
this.dialog.move = true
|
||||
this.$nextTick(() => {
|
||||
this.$refs.moveSave.open('move').setData(this.selection)
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -1,6 +1,6 @@
|
||||
<template>
|
||||
<el-main class="tabsMain">
|
||||
<el-tabs tab-position="top" class="tabsPadding" v-model="tabsTrue">
|
||||
<el-tabs tab-position="top" class="tabsPadding" v-model="tabsTrue" @tab-change="tabsChange">
|
||||
<el-tab-pane label="我的文档" name="document">
|
||||
<document v-if="tabsTrue == 'document'"></document>
|
||||
</el-tab-pane>
|
||||
@ -26,10 +26,17 @@ export default {
|
||||
return {
|
||||
size:'small',
|
||||
tabsTrue:'document',
|
||||
|
||||
routerList: this.$store.state.global.docsRouter,
|
||||
shareList: this.$store.state.global.shareRouter,
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
|
||||
tabsChange(){
|
||||
let arrList = [{name:'我的文档',id:''}];
|
||||
this.$store.commit("SET_docs_router", arrList);
|
||||
this.$store.commit("SET_share_router", arrList);
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
125
src/views/docsManager/moveFile.vue
Normal file
125
src/views/docsManager/moveFile.vue
Normal file
@ -0,0 +1,125 @@
|
||||
<template>
|
||||
<el-dialog :title="titleMap[mode]" v-model="visible" :width="480" draggable destroy-on-close @closed="$emit('closed')">
|
||||
<div class="headerBtn">
|
||||
<div class="btn"><el-button @click="update" :size="size" plain type="primary">刷新</el-button></div>
|
||||
<div class="btn"><el-button :size="size" plain type="primary">新建文件夹</el-button></div>
|
||||
</div>
|
||||
<el-scrollbar :max-height="360" v-loading="loading">
|
||||
<el-tree
|
||||
:data="list"
|
||||
:props="defaultProps"
|
||||
node-key="id"
|
||||
:expand-on-click-node="false"
|
||||
default-expand-all
|
||||
@node-click="getNodes"
|
||||
>
|
||||
<template #default="{ node }">
|
||||
<span class="custom-tree-node">
|
||||
<span><el-icon><sc-icon-Folder/></el-icon> {{ node.data.name }}</span>
|
||||
</span>
|
||||
</template>
|
||||
</el-tree>
|
||||
</el-scrollbar>
|
||||
<template #footer>
|
||||
<el-button @click="visible=false" >取 消</el-button>
|
||||
<el-button v-if="mode!='show'" type="primary" :loading="isSave" @click="submit()">保 存</el-button>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name:"moveFile",
|
||||
emits: ['success', 'closed'],
|
||||
data() {
|
||||
return {
|
||||
size:'small',
|
||||
mode: "move",
|
||||
titleMap: {
|
||||
move: '移动文件',
|
||||
},
|
||||
visible: false,
|
||||
isSave: false,
|
||||
loading:false,
|
||||
list:[],
|
||||
defaultProps:{
|
||||
children: 'children',
|
||||
label: 'name'
|
||||
},
|
||||
move:[
|
||||
{
|
||||
ids:[],
|
||||
file_type:"file",
|
||||
target_folder_id:''
|
||||
},
|
||||
{
|
||||
ids:[],
|
||||
file_type:"folder",
|
||||
target_folder_id:''
|
||||
}
|
||||
]
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.getData();
|
||||
},
|
||||
methods: {
|
||||
//显示
|
||||
open(mode='add'){
|
||||
this.mode = mode;
|
||||
this.visible = true;
|
||||
return this
|
||||
},
|
||||
update(){
|
||||
this.getData();
|
||||
},
|
||||
async getData() {
|
||||
this.loading = true;
|
||||
const res = await this.$API.docs.manager.folderSelect.post();
|
||||
if(res.code == 200){
|
||||
this.list = res.data;
|
||||
}
|
||||
this.loading = false;
|
||||
},
|
||||
//表单提交方法
|
||||
async submit() {
|
||||
this.isSave = true;
|
||||
let params = this.setList();
|
||||
const res = await this.$API.docs.manager.move.post({move:params});
|
||||
this.isSave = false;
|
||||
if (res.code == 200) {
|
||||
this.$emit('success', this.form, this.mode)
|
||||
// this.visible = false;
|
||||
this.$message.success("操作成功")
|
||||
}
|
||||
},
|
||||
setList(){
|
||||
let arr = new Array();
|
||||
arr = this.move.filter(em=>em.ids.length!=0);
|
||||
return arr
|
||||
},
|
||||
getNodes(e){
|
||||
this.move.forEach(item=>{
|
||||
item.target_folder_id = e.id
|
||||
})
|
||||
},
|
||||
//表单注入数据
|
||||
setData(data){
|
||||
let fileIds = data.filter(item=> item.type == 'file').map(em=>em.id)
|
||||
let folderIds = data.filter(item=> item.type == 'folder').map(em=>em.id)
|
||||
this.move[0].ids = fileIds;
|
||||
this.move[1].ids = folderIds;
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.headerBtn{
|
||||
display: flex;align-items: center;
|
||||
margin-bottom: 12px;
|
||||
.btn{
|
||||
margin-right: 12px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -1,7 +1,10 @@
|
||||
<template>
|
||||
<el-dialog :title="titleMap[mode]" v-model="visible" :width="460" draggable destroy-on-close @closed="$emit('closed')">
|
||||
<el-form :model="form" :rules="rules" :disabled="mode=='show'" ref="dialogForm" label-width="120px" label-position="top">
|
||||
<el-form-item label="请输入文件夹名称" prop="name">
|
||||
<el-form-item label="请输入文件名称" prop="file_name" v-if="mode =='rename'">
|
||||
<el-input v-model="form.file_name" placeholder="请输入文件名称" clearable></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="请输入文件夹名称" prop="name" v-else>
|
||||
<el-input v-model="form.name" placeholder="请输入文件夹名称" clearable></el-input>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
@ -21,7 +24,7 @@ export default {
|
||||
titleMap: {
|
||||
add: '新建文件夹',
|
||||
edit: '编辑',
|
||||
show: '查看'
|
||||
rename: '修改文件名'
|
||||
},
|
||||
visible: false,
|
||||
isSave: false,
|
||||
@ -30,12 +33,17 @@ export default {
|
||||
form: {
|
||||
parent_id:"",
|
||||
name: "",
|
||||
file_id:'',
|
||||
file_name:'',
|
||||
},
|
||||
//验证规则
|
||||
rules: {
|
||||
name: [
|
||||
{required: true, message: '请输入文件夹名称'}
|
||||
],
|
||||
file_name:[
|
||||
{required: true, message: '请输入文件名称'}
|
||||
]
|
||||
}
|
||||
}
|
||||
},
|
||||
@ -54,7 +62,17 @@ export default {
|
||||
this.$refs.dialogForm.validate(async (valid) => {
|
||||
if (valid) {
|
||||
this.isSave = true;
|
||||
const res = await this.$API.docs.manager.add.post(this.form);
|
||||
let res
|
||||
if(this.mode == 'rename'){
|
||||
delete this.form.name;
|
||||
delete this.form.id;
|
||||
res = await this.$API.docs.manager.rename.post(this.form);
|
||||
}else{
|
||||
let params = this.$TOOL.objCopy(this.form);
|
||||
delete params.file_id;
|
||||
delete params.file_name;
|
||||
res = await this.$API.docs.manager.add.post(this.form);
|
||||
}
|
||||
this.isSave = false;
|
||||
if(res.code == 200){
|
||||
this.$emit('success', this.form, this.mode)
|
||||
@ -68,12 +86,12 @@ export default {
|
||||
setData(data){
|
||||
this.form.parent_id = data.folder_id;
|
||||
this.form.name = data.name;
|
||||
|
||||
if(this.mode == 'edit'){
|
||||
if(this.mode == 'edit' || this.mode == 'rename'){
|
||||
this.form.parent_id = data.parent_id;
|
||||
this.form.id = data.id;
|
||||
if(data.type == 'file'){
|
||||
this.form.name = data.client_file_name;
|
||||
this.form.file_name = data.client_file_name;
|
||||
this.form.file_id = data.id;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -5,15 +5,17 @@
|
||||
<el-col :span="20">
|
||||
<div class="docsHeader">
|
||||
<div class="arrowBox">
|
||||
<div class="item leftArrow"><el-icon><el-icon-ArrowLeftBold/></el-icon></div>
|
||||
<div class="item leftArrow" :class="routerList.length>1?'leftShow':''" @click="prev"><el-icon><el-icon-ArrowLeftBold/></el-icon></div>
|
||||
<div class="item rightArrow"><el-icon><el-icon-ArrowRightBold/></el-icon></div>
|
||||
</div>
|
||||
<div class="refreshBox">
|
||||
<div class="refreshBox" @click="upSearch">
|
||||
<el-icon><el-icon-RefreshLeft/></el-icon>
|
||||
</div>
|
||||
<div class="breadcrumb">
|
||||
<el-breadcrumb separator-icon="el-icon-ArrowRight">
|
||||
<el-breadcrumb-item>我的文档</el-breadcrumb-item>
|
||||
<template v-for="item in routerList" :key="item">
|
||||
<el-breadcrumb-item>{{item.name}}</el-breadcrumb-item>
|
||||
</template>
|
||||
</el-breadcrumb>
|
||||
</div>
|
||||
</div>
|
||||
@ -33,7 +35,7 @@
|
||||
</el-dropdown-menu>
|
||||
</template>
|
||||
</el-dropdown>
|
||||
<el-button type="primary" plain :size="size" icon="el-icon-sort" :disabled="selection.length==0"></el-button>
|
||||
<!-- <el-button type="primary" plain :size="size" icon="el-icon-sort" :disabled="selection.length==0"></el-button>-->
|
||||
</div>
|
||||
<div class="right-panel">
|
||||
|
||||
@ -44,7 +46,7 @@
|
||||
<el-table-column type="selection" align="center" width="40"></el-table-column>
|
||||
<sc-table-column label="序号" align="center" type="index"></sc-table-column>
|
||||
<template #name="scope">
|
||||
<div class="nameBox" v-if="scope.row.type == 'folder'">
|
||||
<div class="nameBox" v-if="scope.row.type == 'folder'" @click="openFolder(scope.row)">
|
||||
<el-icon size="large"><sc-icon-Folder/></el-icon>
|
||||
<div class="text">{{scope.row.name}}</div>
|
||||
</div>
|
||||
@ -83,6 +85,10 @@ export default {
|
||||
data() {
|
||||
return {
|
||||
size:'small',
|
||||
routerList: this.$store.state.global.shareRouter,
|
||||
docsList:[],
|
||||
docsNextShow:false,
|
||||
|
||||
dialog: {
|
||||
save: false,
|
||||
shareSave: false
|
||||
@ -96,7 +102,8 @@ export default {
|
||||
keyword: null,
|
||||
folder_id:"",
|
||||
name:""
|
||||
}
|
||||
},
|
||||
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
@ -125,6 +132,30 @@ export default {
|
||||
uploadFileSuccess(){
|
||||
this.$refs.table.refresh();
|
||||
},
|
||||
prev(){
|
||||
this.routerList.splice(this.routerList.length-1,1);
|
||||
this.$store.commit("SET_share_router", this.routerList);
|
||||
|
||||
this.params.folder_id = this.routerList[this.routerList.length-1].id;
|
||||
this.$refs.table.upData(this.params);
|
||||
|
||||
this.docsNextShow = true;
|
||||
},
|
||||
// 打开文件夹
|
||||
openFolder(row){
|
||||
let arrList = this.routerList;
|
||||
let params = {
|
||||
name:row.name,
|
||||
id:row.id
|
||||
}
|
||||
arrList.push(params);
|
||||
this.$store.commit("SET_share_router", arrList);
|
||||
this.docsList.push(params);
|
||||
this.docsNextShow = false;
|
||||
|
||||
this.params.folder_id = row.id;
|
||||
this.$refs.table.upData(this.params);
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
@ -44,8 +44,8 @@
|
||||
</div>
|
||||
</div>
|
||||
<div v-else>
|
||||
<div class="item" v-for="item in listProgress" :key="item">
|
||||
<div class="name">{{item.file_name}}</div>
|
||||
<div class="item" v-for="(item) in listProgress" :key="item">
|
||||
<div class="name">{{item.client_file_name}}</div>
|
||||
<el-progress class="exportPopover" :text-inside="true" :stroke-width="12" :percentage="item.rate" />
|
||||
</div>
|
||||
</div>
|
||||
@ -107,12 +107,11 @@ export default {
|
||||
if(res.data && (res.data.type == 12)){
|
||||
this.progressShow = true;
|
||||
|
||||
this.listProgress.forEach((em,index)=>{
|
||||
this.listProgress.forEach(em=>{
|
||||
if(em.uuid == res.data.file_unique_id){
|
||||
em.rate = res.data.rate
|
||||
if(res.data.status == 1){
|
||||
// this.listProgress.splice(index,1);
|
||||
this.fileList.splice(index,1);
|
||||
}
|
||||
}
|
||||
})
|
||||
@ -120,6 +119,8 @@ export default {
|
||||
this.progressShow = false;
|
||||
}
|
||||
if(res.data.status == 1){
|
||||
this.fileList.splice(this.fileList[0],1);
|
||||
// this.handleRemove('',this.fileList,true);
|
||||
this.$emit('uploadFileSuccess');
|
||||
}
|
||||
}
|
||||
@ -164,7 +165,8 @@ export default {
|
||||
close(){
|
||||
this.visible = false;
|
||||
this.progressShow = false;
|
||||
this.listProgress = []
|
||||
this.listProgress = [];
|
||||
this.handleRemove('',this.fileList,true);
|
||||
},
|
||||
async save() {
|
||||
const res = await this.$API.docs.manager.upload.post(this.params);
|
||||
@ -177,10 +179,15 @@ export default {
|
||||
handleExceed(){
|
||||
this.$message.warning('文件超出最大限制');
|
||||
},
|
||||
handleRemove(file,fileList){
|
||||
const index = fileList.findIndex(f => f.uid === file.uid);
|
||||
if (index !== -1) {
|
||||
fileList.splice(index, 1);
|
||||
handleRemove(file,fileList,isArr=false){
|
||||
if(isArr){
|
||||
fileList = [];
|
||||
this.listProgress = [];
|
||||
}else{
|
||||
const index = fileList.findIndex(f => f.uid === file.uid);
|
||||
if (index !== -1) {
|
||||
fileList.splice(index, 1);
|
||||
}
|
||||
}
|
||||
},
|
||||
// 上传成功
|
||||
|
||||
Loading…
Reference in New Issue
Block a user