wen
/
jialuomaadmin
1
0
Fork 0
Code Issues 3 Pull Requests Projects Releases Wiki Activity
Browse Source

修改， 增加自定义创建目录成功事件，对接口，优化

master
wen 2 years ago
parent
78f92bf23f
commit
20a26ac2ad
9 changed files with 252 additions and 37 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 1
      public/loadhead.css
  2. 9
      src/api/user.js
  3. 2
      src/components/Breadcrumb/index.vue
  4. 19
      src/layout/components/Sidebar/index.vue
  5. 2
      src/styles/sidebar.scss
  6. 5
      src/utils/EventBus.js
  7. 4
      src/utils/index.js
  8. 2
      src/views/login/index.vue
  9. 233
      src/views/subfile/index.vue

1
public/loadhead.css
Unescape View File

@ -12,6 +12,7 @@ a{color:#464c5c;text-decoration:none;}
.elementhidden{visibility:hidden !important;} .elementhidden{visibility:hidden !important;}
.verMiddle{vertical-align:middle !important;} .verMiddle{vertical-align:middle !important;}
.vercenter{text-align:center !important;} .vercenter{text-align:center !important;}
.textright{text-align:right !important;}
.verbold{font-weight:bold !important;} .verbold{font-weight:bold !important;}
.qcmargin{margin:0 !important;} .qcmargin{margin:0 !important;}
.qcpadding{padding:0 !important;} .qcpadding{padding:0 !important;}

9
src/api/user.js
Unescape View File

@ -24,3 +24,12 @@ export function mirlist(datas) {
data: datas data: datas
}) })
} }
// 创建目录
export function mkdir(datas) {
return request({
url: '/api/mkdir',
method: 'post',
data: datas
})
}

2
src/components/Breadcrumb/index.vue
Unescape View File

@ -32,7 +32,7 @@ export default {
// only show routes with meta.title // only show routes with meta.title
let matched = this.$route.matched.filter(item => item.meta && item.meta.title) let matched = this.$route.matched.filter(item => item.meta && item.meta.title)
console.log(this.$route); //console.log(this.$route);
const first = matched[0] const first = matched[0]
if (!this.isDashboard(first)) { if (!this.isDashboard(first)) {

19
src/layout/components/Sidebar/index.vue
Unescape View File

@ -22,6 +22,7 @@
<script> <script>
import { mapGetters } from 'vuex' import { mapGetters } from 'vuex'
import EventBus from '@/utils/EventBus.js'
import Logo from './Logo' import Logo from './Logo'
import SidebarItem from './SidebarItem' import SidebarItem from './SidebarItem'
import variables from '@/styles/variables.scss' import variables from '@/styles/variables.scss'
@ -31,9 +32,17 @@ import { mirlist } from '@/api/user'
//console.log(menusdata); //console.log(menusdata);
export default { export default {
components: { SidebarItem, Logo }, components: { SidebarItem, Logo },
created: function () { created: function () {
this.getmunusdata(); this.getmunusdata();
}, },
mounted() {
EventBus.$on('mkdirSuccess', this.getmunusdata)
//console.log(this.$root);
},
data() { data() {
return { return {
routes:menusdata routes:menusdata
@ -52,7 +61,7 @@ export default {
const route = this.$route const route = this.$route
const { meta, path } = route const { meta, path } = route
const menusindex = window.location.href const menusindex = window.location.href
console.log(1); //console.log(1);
// 因为菜单栏的生成和路由是解耦的，因为动态获取以及添加的菜单都是用的同一个path带不同参数，路由没法获取，所以通过获取地址来选中 // 因为菜单栏的生成和路由是解耦的，因为动态获取以及添加的菜单都是用的同一个path带不同参数，路由没法获取，所以通过获取地址来选中
if (menusindex.indexOf('?id') != -1) { if (menusindex.indexOf('?id') != -1) {
return menusindex.split('/#')[1] return menusindex.split('/#')[1]
@ -101,12 +110,18 @@ export default {
getmunusdata() { getmunusdata() {
let thiss = this; let thiss = this;
//console.log(this.$route); console.log(1);
// console.log(this.$store); // console.log(this.$store);
mirlist().then(response => { mirlist().then(response => {
let datamain = response.data; let datamain = response.data;
this.routes[1].children = this.SplicingMenuTree(datamain.data.menus); this.routes[1].children = this.SplicingMenuTree(datamain.data.menus);
//console.log();
let dirTree = datamain.data.dirTree;
if (dirTree.id) {
//this.$router.push({path: '/filemange/subfile?id='+dirTree.id});
}
}).catch(function (error) { }).catch(function (error) {
thiss.$message({ thiss.$message({

2
src/styles/sidebar.scss
Unescape View File

@ -17,7 +17,7 @@
top: 91px; top: 91px;
bottom: 0; bottom: 0;
left: 0; left: 0;
z-index: 2002; z-index: 1888;
overflow: hidden; overflow: hidden;
.el_submenu_link{width:76%;height:56px;z-index:100;position:absolute;left:0;top:0;bottom:0;right:10%;} .el_submenu_link{width:76%;height:56px;z-index:100;position:absolute;left:0;top:0;bottom:0;right:10%;}

5
src/utils/EventBus.js
Unescape View File

@ -0,0 +1,5 @@
import Vue from 'vue' // 引入vue
const EventBus = new Vue() // 创建实例
export default EventBus // 导出

4
src/utils/index.js
Unescape View File

@ -1,6 +1,4 @@
/**
* Created by PanJiaChen on 16/11/18.
*/
/** /**
* Parse the time to string * Parse the time to string

2
src/views/login/index.vue
Unescape View File

@ -184,7 +184,7 @@ export default {
} }
//console.log(response) //console.log(response)
this.$router.push({path: '/filemange'}) this.$router.push({path: '/filemange/index'})
//console.log('6666'); //console.log('6666');
}).catch(function (error) { }).catch(function (error) {
thiss.$message({ thiss.$message({

233
src/views/subfile/index.vue
Unescape View File

@ -1,5 +1,5 @@
<template> <template>
<div class="subfile_main"> <div class="subfile_main" v-loading="subloading">
<div class="block"> <div class="block">
<el-date-picker <el-date-picker
v-model="value2" v-model="value2"
@ -11,45 +11,104 @@
end-placeholder="结束日期" end-placeholder="结束日期"
:picker-options="pickerOptions"> :picker-options="pickerOptions">
</el-date-picker> </el-date-picker>
<el-button type="primary" icon="el-icon-search">搜索</el-button> <el-button class="sou_bottom" type="primary" icon="el-icon-search">搜索</el-button>
</div> </div>
<div> <div>
<!-- 目录数据列表 -->
<div class="folder_bottom">
<!-- <span>目录：</span> -->
<a v-for="data in dirdata" :key="data.id" :href="'#/filemange/subfile?id='+data.id"><el-button type="warning" icon="el-icon-notebook-1">{{data.directory}}</el-button></a>
</div>
<div class="use_button textright">
<el-button type="primary" icon="el-icon-edit" @click="dirbox = true">创建目录</el-button>
<el-button type="primary" icon="el-icon-edit" @click="rmdirm">删除目录</el-button>
<el-button type="primary" icon="el-icon-edit">重命名</el-button>
<el-button type="primary">上传<i class="el-icon-upload el-icon--right"></i></el-button>
</div>
<!-- 文件数据列表 -->
<el-table
:data="tableData"
border
style="width: 100%">
<el-table-column
prop="date"
label="时间"
width="auto">
</el-table-column>
<el-table-column
label="图片"
width="auto">
<template slot-scope="scope">
<img :src="'http://192.168.0.100/'+scope.row.image" alt="图片"/>
</template>
</el-table-column>
<el-table-column
prop="name"
label="名称">
</el-table-column>
<el-table-column
label="操作">
<div class="file_caozuo vercenter">
<el-button size="mini">重命名</el-button>
<el-button size="mini">下载</el-button>
</div>
<div class="file_caozuo2 vercenter">
<el-button size="mini">移动</el-button>
<el-button size="mini" type="danger">删除</el-button>
</div>
</el-table-column>
</el-table>
<!-- 创建目录弹框 -->
<el-dialog title="创建目录" :visible.sync="dirbox">
<el-form :model="dirform">
<el-form-item label="目录名称" :label-width="formLabelWidth">
<el-input v-model="dirform.dir" autocomplete="off"></el-input>
</el-form-item>
<!-- <el-form-item label="父级目录" :label-width="formLabelWidth">
<el-select v-model="form.region" placeholder="请选择父级目录">
<el-option label="区域一" value="shanghai"></el-option>
</el-select>
</el-form-item> -->
</el-form>
<div slot="footer" class="dialog-footer">
<el-button @click="dirbox = false">取 消</el-button>
<el-button type="primary" @click="mkdirs" :loading="mkdirloadings">确 定</el-button>
</div>
</el-dialog>
</div> </div>
</div> </div>
</template> </template>
<script> <script>
import { mirlist } from '@/api/user' import EventBus from '@/utils/EventBus.js'
import { mirlist, mkdir } from '@/api/user'
import defaultSettings from '@/settings.js' import defaultSettings from '@/settings.js'
export default { export default {
watch: { watch: {
// 点击不同目录请求不同接口
$route(to, from) { $route(to, from) {
let can = {}; this.getFileData();
const menusindex = window.location.href
if (menusindex.indexOf('?id') != -1) {
//console.log(menusindex.split('?id=')[1]);
can.id = menusindex.split('?id=')[1]
} }
},
// beforeRouteUpdate(to, from, next) {
// alert(0);
// next();
// },
created() {
this.getFileData();
mirlist(can).then(response => {
let datamain = response.data;
}).catch(function (error) {
thiss.$message({
showClose: true,
message: error,
type: 'error'
});
});
}
}, },
filters: { filters: {
}, },
@ -82,14 +141,142 @@ export default {
} }
}] }]
}, },
value2: '' value2: '',
};
tableData: [],
// 创建目录弹出框数据
dirbox: false,
dirform: {
dir: '',
parent: ''
}, },
created() { formLabelWidth: '',
// 更新当前目录的子目录
dirdata: [],
subloading: false, //切换目录loading
mkdirloadings: false
};
}, },
methods: { methods: {
getFileData() {
let can = {};
const menusindex = window.location.href
if (menusindex.indexOf('?id') != -1) {
//console.log(menusindex.split('?id=')[1]);
can.id = menusindex.split('?id=')[1]
}
let thiss = this;
this.subloading = true;
mirlist(can).then(response => {
let datamain = response.data;
let maindata = datamain.data.dirTree;
if (datamain.code == 1) {
//console.log(maindata.directories.length);
this.dirdata = []
this.tableData = []
if (maindata.directories) {
this.dirdata = maindata.directories;
}
if (maindata.files) {
this.tableData = this.forObjectData(maindata.files);
}
this.dirform.parent = maindata.realpath;
this.subloading = false;
} }
}).catch(function (error) {
thiss.$message({
showClose: true,
message: error,
type: 'error'
});
});
},
forObjectData(objectd) {
let newObject = null, arrObjs = [];
Object.keys(objectd).forEach(item => {
newObject = {
date: '2016-05-03',
image: objectd[item].path,
name: objectd[item].filename
}
arrObjs.push(newObject);
});
return arrObjs;
//console.log(arrObjs);
},
// 创建目录
mkdirs() {
this.mkdirloadings = true;
EventBus.$emit('mkdirSuccess');
mkdir(this.dirform).then(response => {
let datamain = response.data;
let maindata = datamain.data.dirTree;
if (datamain.code == 1) {
//this.subloading = false;
}
this.mkdirloadings = false;
this.dirbox = false;
}).catch(function (error) {
thiss.$message({
showClose: true,
message: error,
type: 'error'
});
});
},
// 删除目录
rmdirm() {
this.rmdirloadings = true;
mkdir(this.dirform).then(response => {
let datamain = response.data;
let maindata = datamain.data.dirTree;
if (datamain.code == 1) {
//this.subloading = false;
}
this.dirbox = false;
}).catch(function (error) {
thiss.$message({
showClose: true,
message: error,
type: 'error'
});
});
}
}
} }
</script> </script>
<style lang="scss">
.subfile_main{
padding:26px 5% 12px 5%;
.block{margin:0 0 28px 0;}
.sou_bottom{margin-left:10px;}
.use_button{margin:15px 0 16px 0;}
.file_caozuo2{margin:6px 0 0 0;}
.el-table td{padding:9px 0}
.folder_bottom a{margin:0 6px;}
.el-table__body-wrapper img{width:100px;}
}
</style>

Write Preview
Loading…
Cancel
Save