Skip to content

V
VS_OUTSOURCE
Commit 279bf40a authored by fangshupeng's avatar fangshupeng
Browse files
Options

修改问题

parent 59931b45
Show whitespace changes
Inline Side-by-side
Showing with 1093 additions and 627 deletions
VSSCMP_WEB/package-lock.json
View file @ 279bf40a
......@@ -5106,8 +5106,7 @@
"ansi-regex": {
"version": "2.1.1",
"bundled": true,
"dev": true,
"optional": true
"dev": true
},
"aproba": {
"version": "1.2.0",
......@@ -5128,14 +5127,12 @@
"balanced-match": {
"version": "1.0.0",
"bundled": true,
"dev": true,
"optional": true
"dev": true
},
"brace-expansion": {
"version": "1.1.11",
"bundled": true,
"dev": true,
"optional": true,
"requires": {
"balanced-match": "^1.0.0",
"concat-map": "0.0.1"
......@@ -5150,20 +5147,17 @@
"code-point-at": {
"version": "1.1.0",
"bundled": true,
"dev": true,
"optional": true
"dev": true
},
"concat-map": {
"version": "0.0.1",
"bundled": true,
"dev": true,
"optional": true
"dev": true
},
"console-control-strings": {
"version": "1.1.0",
"bundled": true,
"dev": true,
"optional": true
"dev": true
},
"core-util-is": {
"version": "1.0.2",
......@@ -5280,8 +5274,7 @@
"inherits": {
"version": "2.0.3",
"bundled": true,
"dev": true,
"optional": true
"dev": true
},
"ini": {
"version": "1.3.5",
......@@ -5293,7 +5286,6 @@
"version": "1.0.0",
"bundled": true,
"dev": true,
"optional": true,
"requires": {
"number-is-nan": "^1.0.0"
}
......@@ -5308,7 +5300,6 @@
"version": "3.0.4",
"bundled": true,
"dev": true,
"optional": true,
"requires": {
"brace-expansion": "^1.1.7"
}
......@@ -5316,14 +5307,12 @@
"minimist": {
"version": "0.0.8",
"bundled": true,
"dev": true,
"optional": true
"dev": true
},
"minipass": {
"version": "2.3.5",
"bundled": true,
"dev": true,
"optional": true,
"requires": {
"safe-buffer": "^5.1.2",
"yallist": "^3.0.0"
......@@ -5342,7 +5331,6 @@
"version": "0.5.1",
"bundled": true,
"dev": true,
"optional": true,
"requires": {
"minimist": "0.0.8"
}
......@@ -5423,8 +5411,7 @@
"number-is-nan": {
"version": "1.0.1",
"bundled": true,
"dev": true,
"optional": true
"dev": true
},
"object-assign": {
"version": "4.1.1",
......@@ -5436,7 +5423,6 @@
"version": "1.4.0",
"bundled": true,
"dev": true,
"optional": true,
"requires": {
"wrappy": "1"
}
......@@ -5522,8 +5508,7 @@
"safe-buffer": {
"version": "5.1.2",
"bundled": true,
"dev": true,
"optional": true
"dev": true
},
"safer-buffer": {
"version": "2.1.2",
......@@ -5559,7 +5544,6 @@
"version": "1.0.2",
"bundled": true,
"dev": true,
"optional": true,
"requires": {
"code-point-at": "^1.0.0",
"is-fullwidth-code-point": "^1.0.0",
......@@ -5579,7 +5563,6 @@
"version": "3.0.1",
"bundled": true,
"dev": true,
"optional": true,
"requires": {
"ansi-regex": "^2.0.0"
}
......@@ -5623,14 +5606,12 @@
"wrappy": {
"version": "1.0.2",
"bundled": true,
"dev": true,
"optional": true
"dev": true
},
"yallist": {
"version": "3.0.3",
"bundled": true,
"dev": true,
"optional": true
"dev": true
}
}
},
......@@ -7340,7 +7321,7 @@
"integrity": "sha1-WhLAEUed76vvVzXeVckTBg7SGfI=",
"requires": {
"canvg": "1.5.3",
"file-saver": "github:eligrey/FileSaver.js#1.3.8",
"file-saver": "github:eligrey/FileSaver.js#e865e37af9f9947ddcced76b549e27dc45c1cb2e",
"html2canvas": "1.0.0-alpha.12",
"omggif": "1.0.7",
"promise-polyfill": "8.1.0",
......
VSSCMP_WEB/src/pages/education/schoolBasedResources/folderManage/Index.vue
View file @ 279bf40a
<template>
<div class="container">
<h4 class="title">校本资源设置</h4>
<v-header :title="'校本资源设置'" :is-show-prev-page="false"></v-header>
<div class="headerNav">
<div class="leftNav">
<el-breadcrumb separator-class="el-icon-arrow-right">
......@@ -50,7 +50,8 @@ export default {
name: 'Index',
components: {
SmallFolder: () => import('./../myResources/components/SmallFolder'),
ManageCtxMenu: () => import('./components/ManageCtxMenu')
ManageCtxMenu: () => import('./components/ManageCtxMenu'),
VHeader: () => import('@/common/header/VHeader')
},
data () {
return {
......@@ -244,17 +245,11 @@ export default {
<style lang="less" scoped>
.container {
.title {
padding: 15px 20px;
color: #585858;
font-size: 18px;
border-bottom:1px #D7D7D7 solid;
}
.headerNav {
display: flex;
justify-content: space-between;
height: 55px;
line-height: 55px;
height: 45px;
line-height: 45px;
background: #e7e7e7;
/deep/ .leftNav {
......@@ -263,7 +258,7 @@ export default {
.el-breadcrumb {
font-size: 18px;
line-height: 55px;
line-height: 45px;
.el-breadcrumb__item {
&:not(:last-child) .el-breadcrumb__inner{
cursor: pointer;
......
VSSCMP_WEB/src/pages/education/schoolBasedResources/folderManage/components/ManageCtxMenu.vue
View file @ 279bf40a
......@@ -48,7 +48,7 @@
</el-form-item>
<el-form-item label="管理者" prop="manager">
<div class="header-ctn">
<el-button class="person-btn" icon="el-icon-plus">添加教师</el-button>
<el-button class="person-btn" icon="el-icon-plus" @click="teacherSelectorOptions.isBlock = true">添加教师</el-button>
<span class="person-count">已选择 <span style="color:blue">2</span> 人</span>
</div>
<div class="tag-ctn">
......@@ -66,7 +66,7 @@
</el-form-item>
<el-form-item v-if="ruleForm.folderType === 'task'" label="教师" prop="uploadTeacher">
<div class="header-ctn">
<el-button class="person-btn" icon="el-icon-plus">添加教师</el-button>
<el-button class="person-btn" icon="el-icon-plus" @click="teacherSelectorOptions.isBlock = true">添加教师</el-button>
<span class="person-count">已选择 <span style="color:blue">2</span> 人</span>
</div>
<div class="tag-ctn">
......@@ -86,6 +86,10 @@
<el-button size="medium" type="primary" @click="newFolderVisible = false">保存</el-button>
</el-form-item>
</el-form>
<teacher-selector
:teacherSelectorOptions="teacherSelectorOptions"
@closeTeacherSelector="teacherSelectorOptions.isBlock = false">
</teacher-selector>
</el-dialog>
<!-- 删除文件窗口 -->
......@@ -104,35 +108,42 @@
export default {
name: 'ContextMenu',
props: {
menuVisible: {
menuVisible: { // 右键菜单栏显示
type: Boolean,
default: false
},
rightMenuData: {
rightMenuData: { // 右键文件的数据
type: Object,
default: () => {
return {}
}
},
rightMenuFolder: {
rightMenuFolder: { // 右键空白所在层的文件夹数据
type: Array,
default: () => {
return []
}
},
coordinate: {
coordinate: { // 右键菜单栏坐标
type: Object,
default: () => {
return {}
}
},
menuMode: {
menuMode: { // 右键的文件属于那种类型（ blank: 右键空白 ）
type: String,
default: ''
}
},
components: {
TeacherSelector: () => import('@/common/TeacherSelector')
},
data () {
return {
teacherSelectorOptions: {
isBlock: false,
isShow: true
},
newFolderVisible: false,
newFolderName: '',
deleteVisible: false,
......
VSSCMP_WEB/src/pages/education/schoolBasedResources/myResources/components/FavorShare.vue → VSSCMP_WEB/src/pages/education/schoolBasedResources/myResources/FavorShare.vue
View file @ 279bf40a
<template>
<div class="container">
<div class="headerNav" style="margin-bottom:20px;">
<v-header :title="'我的资源'" :is-show-prev-page="true"></v-header>
<nav-menu :menus="menus"></nav-menu>
<div class="main">
<div class="headerNav">
<div class="leftNav">
<span class="type-title">类型:</span>
<el-radio-group v-model="folderType" size="small" @change="folderTypeChange">
......@@ -49,20 +52,44 @@
<span>文档内容</span>
</el-drawer>
</div>
</div>
</template>
<script>
export default {
name: 'FavorShare',
components: {
Search: () => import('./Search'),
SmallFolder: () => import('./SmallFolder'),
FavorshareCtxMenu: () => import('./FavorshareCtxMenu')
VHeader: () => import('@/common/header/VHeader'),
NavMenu: () => import('@/common/navMenu/NavMenu'),
Search: () => import('./components/Search'),
SmallFolder: () => import('./components/SmallFolder'),
FavorshareCtxMenu: () => import('./components/FavorshareCtxMenu')
},
data () {
return {
folderType: 'all',
timeSelect: 'allItem',
menus: [
{
name: '我上次的',
id: 'tab_1',
permission: true,
path: '/education/myResources/index'
},
{
name: '收藏/分享',
id: 'tab_2',
permission: true,
path: '/education/myResources/favorShare'
},
{
name: '我管理的',
id: 'tab_3',
permission: true,
path: '/education/myResources/myManage'
}
],
folderType: 'all', // 文件类型（文件类型（all: 全部，myFavor: 我收藏的，myShare: 我分享的, shareMe: 分享给我的 ））
timeSelect: 'allItem', // 学期选择框数据
menuMode: '', // 菜单根据模式显示对于内容
menuVisible: false, // 右键菜单栏
rightMenuData: {}, // 右键选中文件夹或文件数据
......@@ -120,6 +147,7 @@ export default {
updateTime: '2020-08-22 12:00'
}
]
}
},
mounted () {
......@@ -167,13 +195,16 @@ export default {
<style lang="less" scoped>
.container {
height: 100%;
min-height: 100%;
.main {
min-height: 100%;
.headerNav {
display: flex;
justify-content: space-between;
height: 55px;
line-height: 55px;
height: 45px;
line-height: 45px;
background: #e7e7e7;
/deep/ .leftNav {
......@@ -185,6 +216,8 @@ export default {
}
.el-radio-group {
vertical-align: middle;
margin-bottom: 3px;
.el-radio-button {
margin: 0 5px;
......@@ -201,13 +234,11 @@ export default {
display: flex;
.timer-select{
padding-top: 1px;
.el-input__inner {
height: 35px;
font-size: 14px;
margin-right: 15px;
}
}
}
}
}
</style>
VSSCMP_WEB/src/pages/education/schoolBasedResources/myResources/Index.vue
View file @ 279bf40a
<template>
<div class="container">
<h4 class="title">我的资源</h4>
<el-menu
:default-active="activeIndex"
:active-text-color="'#409EFF'"
:text-color="'#333333'"
class="el-menu"
mode="horizontal"
@select="menuSelect"
<v-header :title="'我的资源'" :is-show-prev-page="true"></v-header>
<nav-menu :menus="menus"></nav-menu>
<div class="main">
<div class="headerNav">
<div class="leftNav">
<el-breadcrumb separator-class="el-icon-arrow-right">
<el-breadcrumb-item
v-for="(breadcrumbItem, index) of breadcrumb"
:key="index"
@click.native="backCrumb(index)">
{{ breadcrumbItem.name }}
</el-breadcrumb-item>
</el-breadcrumb>
</div>
<div class="rightNav">
<search></search>
<div class="feature">
<div :class="{'icon-sel': bigMode}" class="icon-ctn" @click="bigMode = true">
<i class="el-icon-picture"></i>
</div>
<div :class="{'icon-sel': !bigMode}" class="icon-ctn" @click="bigMode = false">
<i class="el-icon-s-operation"></i>
</div>
</div>
</div>
</div>
<div class="folderCtn" @contextmenu.prevent="showMenu">
<div class="bigCtn" v-if="bigMode">
<big-folder
v-for="file of currentFileList"
:key="file.id" :file-data="file"
@showMenu="showMenu"
@intoFolder="intoFolder(file)"
@uploadFile="uploadFile">
</big-folder>
</div>
<div class="smallCtn" v-else>
<small-folder
:file-list="currentFileList"
@showMenu="showMenu"
@tableIntoFile="intoFolder"
>
<el-menu-item index="1">我上传的</el-menu-item>
<el-menu-item index="2">收藏/分享</el-menu-item>
<el-menu-item index="3">我管理的</el-menu-item>
</el-menu>
<!-- <component :is="currentComponent"></component> -->
<my-uploads :style="'display:'+componentsDisplay.myUploads"></my-uploads>
<favor-share :style="'display:'+componentsDisplay.favorShare"></favor-share>
<my-manage :style="'display:'+componentsDisplay.myManage"></my-manage>
</small-folder>
</div>
</div>
<!-- 右键菜单栏 -->
<myupload-ctx-menu
:menuVisible="menuVisible"
:uploadVisible="uploadVisible"
:rightMenuData="rightMenuData"
:rightMenuFolder="rightMenuFolder"
:coordinate="coordinate"
:menuMode="menuMode"
@showUploadMenu="showUploadMenu"
@menuOpenFile="intoFolder">
</myupload-ctx-menu>
<upload-file :selectFolderVisible="selectFolderVisible" @uploadSuccess="selectFolderVisible = false"></upload-file>
<!-- 侧滑块查看普通文档 -->
<el-drawer
title="查看"
:visible.sync="documentDrawer"
:size="'60%'">
<span>文档内容</span>
</el-drawer>
</div>
</div>
</template>
<script>
export default {
name: 'Index',
components: {
MyUploads: () => import('./components/MyUploads'),
FavorShare: () => import('./components/FavorShare'),
MyManage: () => import('./components/MyManage')
VHeader: () => import('@/common/header/VHeader'),
NavMenu: () => import('@/common/navMenu/NavMenu'),
Search: () => import('./components/Search'),
BigFolder: () => import('./components/BigFolder'),
SmallFolder: () => import('./components/SmallFolder'),
MyuploadCtxMenu: () => import('./components/MyuploadCtxMenu'),
UploadFile: () => import('./components/UploadFile')
},
data () {
return {
activeIndex: '1',
// currentComponent: 'MyUploads',
componentsDisplay: {
myUploads: '',
favorShare: 'none',
myManage: 'none'
menus: [
{
name: '我上次的',
id: 'tab_1',
permission: true,
path: '/education/myResources/index'
},
{
name: '收藏/分享',
id: 'tab_2',
permission: true,
path: '/education/myResources/favorShare'
},
{
name: '我管理的',
id: 'tab_3',
permission: true,
path: '/education/myResources/myManage'
}
],
bigMode: true, // 文件夹大小图标模式
menuVisible: false, // 右键菜单栏
menuMode: '', // 菜单根据模式显示对于内容
uploadVisible: false, // 上传菜单栏
documentDrawer: false, // 查看文档抽屉
rightMenuData: {}, // 右键选中文件夹或文件数据
rightMenuFolder: [], // 右键空白储存当前文件夹数据
coordinate: { // 菜单栏坐标
menuX: '0px',
menuY: '0px',
uploadX: '0px',
uploadY: '0px'
},
currentFileList: [],
selectFolderVisible: false, // 查看文件侧滑框
selectFolderList: [], // 上传文件选择文件夹列表
breadcrumb: [ // 面包屑
{
name: '首页',
isFolder: true,
folderName: 'firstLevelData'
}
],
fileListData: {
firstLevelData: [
{
id: 991,
name: '第一级文件夹',
typeName: '学校文件夹',
type: 'school',
icon: 'el-icon-folder',
descript: '我上传了10个文档',
isFocus: false,
isFolder: true,
folderData: 'secondLevelData',
nextIsFolder: true,
uploadCount: '10',
author: '张三',
updateTime: '2020-08-22 12:00'
},
{
id: 992,
name: '第一级文件夹',
typeName: '个人文件夹',
type: 'personal',
icon: 'el-icon-folder',
descript: '我上传了10个文档',
isFocus: false,
isFolder: true,
folderData: 'secondLevelData',
nextIsFolder: true,
uploadCount: '10',
author: '张三',
updateTime: '2020-08-22 12:00'
},
{
id: 993,
name: '第一级文件夹',
typeName: '个人文件夹',
type: 'personal',
icon: 'el-icon-folder',
descript: '我上传了10个文档',
isFocus: false,
isFolder: true,
folderData: 'secondLevelData',
nextIsFolder: true,
uploadCount: '10',
author: '张三',
updateTime: '2020-08-22 12:00'
}
],
secondLevelData: [
{
id: 1001,
name: '第二级文件夹',
typeName: '学校文件夹',
type: 'school',
icon: 'el-icon-folder',
descript: '我上传了10个文档',
isFocus: false,
isFolder: true,
folderData: 'thirdLevelData',
nextIsFolder: false,
uploadCount: '10',
author: '张三',
updateTime: '2020-08-22 12:00'
},
{
id: 1002,
name: '第二级文件夹',
typeName: '学校文件夹',
type: 'school',
icon: 'el-icon-folder',
descript: '我上传了10个文档',
isFocus: false,
isFolder: true,
folderData: 'thirdLevelData',
nextIsFolder: false,
uploadCount: '10',
author: '张三',
updateTime: '2020-08-22 12:00'
}
],
thirdLevelData: [
{
id: 1101,
name: '第三级文件.txt',
typeName: '文件',
type: 'file',
icon: 'el-icon-document',
descript: '我上传了10个文档',
isFocus: false,
isFolder: false,
nextIsFolder: false,
uploadCount: '10',
author: '张三',
updateTime: '2020-08-22 12:00'
}
]
}
}
},
mounted () {
this.currentFileList = this.fileListData.firstLevelData
},
methods: {
menuSelect (key) {
for (let i in this.componentsDisplay) {
this.componentsDisplay[i] = 'none'
backCrumb (index) {
/* 点击面包屑返回前几级 */
let breadcrumb = this.breadcrumb
if (index < breadcrumb.length - 1) {
let folderName = breadcrumb[index].folderName
this.currentFileList = this.fileListData[folderName]
this.breadcrumb = breadcrumb.slice(0, index + 1)
}
},
changeFolderMode () {
/* 切换文件夹大小图标模式 */
this.bigMode = !this.bigMode
},
intoFolder (file) {
/* 进入下一级文件夹 */
if (file.isFolder) {
// 双击文件夹
let breadcrumbData = {
name: file.name,
isFolder: file.isFolder,
folderName: file.folderData
}
switch (key) {
case '1':
this.componentsDisplay.myUploads = ''
break
case '2':
this.componentsDisplay.favorShare = ''
break
case '3':
this.componentsDisplay.myManage = ''
break
this.breadcrumb.push(breadcrumbData)
this.currentFileList = this.fileListData[file.folderData]
} else {
// 双击文件
this.documentDrawer = true
}
},
uploadFile (fileData, row) {
/* 文件选择上传位置 */
this.selectFolderVisible = true
},
showMenu (MouseEvent, type, row) {
/* 右键文件夹或文件时触发 */
if (type) {
// 右键文件夹或者文件
this.menuMode = type
this.rightMenuData = row
this.rightMenuFolder = []
} else {
// 右键空白处
this.menuMode = 'blank'
this.rightMenuFolder = this.currentFileList
this.rightMenuData = {}
}
this.menuVisible = false
this.uploadVisible = false
this.menuVisible = true
let coordinate = this.coordinate
coordinate.menuX = MouseEvent.pageX + 5 + 'px'
coordinate.menuY = MouseEvent.pageY + 'px'
coordinate.uploadX = MouseEvent.pageX + 130 + 'px'
coordinate.uploadY = MouseEvent.pageY + 'px'
document.addEventListener('click', this.foo) // 给整个document添加监听鼠标事件，点击任何位置执行foo方法
},
foo () {
/* 取消鼠标监听事件 菜单栏 */
this.menuVisible = false
this.uploadVisible = false
document.removeEventListener('click', this.foo) // 关掉监听
},
showUploadMenu () {
this.uploadVisible = !this.uploadVisible
}
}
}
......@@ -64,16 +306,95 @@ export default {
.container {
height: 100%;
min-height: 100%;
.main {
min-height: 100%;
.headerNav {
display: flex;
justify-content: space-between;
height: 45px;
line-height: 45px;
background: #e7e7e7;
.title {
padding: 15px 20px;
color: #585858;
/deep/ .leftNav {
padding: 0 20px;
font-size: 18px;
border-bottom:1px #D7D7D7 solid;
.el-breadcrumb {
font-size: 18px;
line-height: 45px;
.el-breadcrumb__item {
&:not(:last-child) .el-breadcrumb__inner{
cursor: pointer;
&:hover {
color: #1890FF;
}
.el-menu {
padding: 0 20px;
}
&:last-child .el-breadcrumb__inner{
color: black;
}
}
}
}
.rightNav {
padding: 0 30px;
display: flex;
.feature {
height: 32px;
margin: 7px 0 0 35px;
padding-left: 35px;
border-left: 1px solid #9e9e9e;
display: flex;
div {
width: 27px;
height: 27px;
margin: 3px 5px;
text-align: center;
line-height: 55px;
display: flex;
background: #f5f5f5;
cursor: pointer;
&:hover {
border: 1px solid #1890FF;
}
&:active {
opacity: 0.7;
}
i {
display: block;
align-self: center;
margin: 0 auto;
font-size: 18px;
}
}
}
}
}
.folderCtn{
min-height: 500px;
.bigCtn {
padding: 15px;
display: flex;
flex-wrap: wrap;
}
.smallCtn {
width: 100%;
}
}
}
}
.icon-sel {
border: 1px solid #1890FF;
}
</style>
VSSCMP_WEB/src/pages/education/schoolBasedResources/myResources/components/MyManage.vue → VSSCMP_WEB/src/pages/education/schoolBasedResources/myResources/MyManage.vue
View file @ 279bf40a
<template>
<div class="container">
<v-header :title="'我的资源'" :is-show-prev-page="true"></v-header>
<nav-menu :menus="menus"></nav-menu>
<div class="main">
<div class="headerNav">
<div class="leftNav">
<el-breadcrumb separator-class="el-icon-arrow-right">
......@@ -37,19 +40,41 @@
<material :taskMode="taskMode"></material>
</div>
</div>
</div>
</template>
<script>
export default {
name: 'MyManage',
props: {},
components: {
BigFolder: () => import('./BigFolder'),
Material: () => import('./Material')
VHeader: () => import('@/common/header/VHeader'),
NavMenu: () => import('@/common/navMenu/NavMenu'),
BigFolder: () => import('./components/BigFolder'),
Material: () => import('./components/Material')
},
mixins: [],
data () {
return {
menus: [
{
name: '我上次的',
id: 'tab_1',
permission: true,
path: '/education/myResources/index'
},
{
name: '收藏/分享',
id: 'tab_2',
permission: true,
path: '/education/myResources/favorShare'
},
{
name: '我管理的',
id: 'tab_3',
permission: true,
path: '/education/myResources/myManage'
}
],
breadcrumb: [ // 面包屑
{
name: '首页',
......@@ -58,7 +83,7 @@ export default {
}
],
isFileMode: false, // 是否资料列表页面
timeSelect: 'allItem',
timeSelect: 'allItem', // 学期选择框数据
options: [{
value: 'allItem',
label: '全部学期'
......@@ -159,18 +184,22 @@ export default {
}
}
}
}
</script>
<style lang="less" scoped>
.container {
height: 100%;
min-height: 100%;
.main {
min-height: 100%;
.headerNav {
display: flex;
justify-content: space-between;
height: 55px;
line-height: 55px;
height: 45px;
line-height: 45px;
background: #e7e7e7;
/deep/ .leftNav {
......@@ -179,7 +208,7 @@ export default {
.el-breadcrumb {
font-size: 18px;
line-height: 55px;
line-height: 45px;
.el-breadcrumb__item {
&:not(:last-child) .el-breadcrumb__inner{
cursor: pointer;
......@@ -201,11 +230,7 @@ export default {
display: flex;
.timer-select{
padding-top: 1px;
.el-input__inner {
height: 35px;
font-size: 14px;
}
margin-right: 15px;
}
}
}
......@@ -215,5 +240,7 @@ export default {
display: flex;
flex-wrap: wrap;
}
}
}
</style>
VSSCMP_WEB/src/pages/education/schoolBasedResources/myResources/components/FavorshareCtxMenu.vue
View file @ 279bf40a
......@@ -54,29 +54,29 @@
export default {
name: 'ContextMenu',
props: {
menuVisible: {
menuVisible: { // 右键菜单栏显示
type: Boolean,
default: false
},
rightMenuData: {
rightMenuData: { // 右键文件的数据
type: Object,
default: () => {
return {}
}
},
rightMenuFolder: {
rightMenuFolder: { // 右键空白所在层的文件夹数据
type: Array,
default: () => {
return []
}
},
coordinate: {
coordinate: { // 右键菜单栏坐标
type: Object,
default: () => {
return {}
}
},
menuMode: {
menuMode: { // 右键的文件属于那种类型（myFavor: 我收藏的，myShare: 我分享的, shareMe: 分享给我的 ）
type: String,
default: ''
}
......
VSSCMP_WEB/src/pages/education/schoolBasedResources/myResources/components/Material.vue
View file @ 279bf40a
......@@ -63,7 +63,7 @@
export default {
name: 'Material',
props: {
taskMode: {
taskMode: { // 是否为任务文件夹
type: Boolean,
default: false
}
......@@ -72,7 +72,7 @@ export default {
return {
searchData: '',
menuVisible: false, // 右键菜单栏
deleteVisible: false,
deleteVisible: false, // 删除确认弹框
coordinate: { // 菜单栏坐标
menuX: '0px',
menuY: '0px'
......
VSSCMP_WEB/src/pages/education/schoolBasedResources/myResources/components/MyUploads.vue deleted 100644 → 0
View file @ 59931b45
<template>
<div class="container">
<div class="headerNav">
<div class="leftNav">
<el-breadcrumb separator-class="el-icon-arrow-right">
<el-breadcrumb-item
v-for="(breadcrumbItem, index) of breadcrumb"
:key="index"
@click.native="backCrumb(index)">
{{ breadcrumbItem.name }}
</el-breadcrumb-item>
</el-breadcrumb>
</div>
<div class="rightNav">
<search></search>
<div class="feature">
<div :class="{'icon-sel': bigMode}" class="icon-ctn" @click="bigMode = true">
<i class="el-icon-picture"></i>
</div>
<div :class="{'icon-sel': !bigMode}" class="icon-ctn" @click="bigMode = false">
<i class="el-icon-s-operation"></i>
</div>
</div>
</div>
</div>
<div class="folderCtn" @contextmenu.prevent="showMenu">
<div class="bigCtn" v-if="bigMode">
<big-folder
v-for="file of currentFileList"
:key="file.id" :file-data="file"
@showMenu="showMenu"
@intoFolder="intoFolder(file)"
@uploadFile="uploadFile">
</big-folder>
</div>
<div class="smallCtn" v-else>
<small-folder
:file-list="currentFileList"
@showMenu="showMenu"
@tableIntoFile="intoFolder"
>
</small-folder>
</div>
</div>
<!-- 右键菜单栏 -->
<myupload-ctx-menu
:menuVisible="menuVisible"
:uploadVisible="uploadVisible"
:rightMenuData="rightMenuData"
:rightMenuFolder="rightMenuFolder"
:coordinate="coordinate"
:menuMode="menuMode"
@showUploadMenu="showUploadMenu"
@menuOpenFile="intoFolder">
</myupload-ctx-menu>
<upload-file :selectFolderVisible="selectFolderVisible" @uploadSuccess="selectFolderVisible = false"></upload-file>
<!-- 侧滑块查看普通文档 -->
<el-drawer
title="查看"
:visible.sync="documentDrawer"
:size="'60%'">
<span>文档内容</span>
</el-drawer>
</div>
</template>
<script>
export default {
name: 'MyUploads',
components: {
Search: () => import('./Search'),
BigFolder: () => import('./BigFolder'),
SmallFolder: () => import('./SmallFolder'),
MyuploadCtxMenu: () => import('./MyuploadCtxMenu'),
UploadFile: () => import('./UploadFile')
},
data () {
return {
bigMode: true, // 文件夹大小图标模式
menuVisible: false, // 右键菜单栏
menuMode: '', // 菜单根据模式显示对于内容
uploadVisible: false, // 上传菜单栏
documentDrawer: false, // 查看文档抽屉
rightMenuData: {}, // 右键选中文件夹或文件数据
rightMenuFolder: [], // 右键空白储存当前文件夹数据
coordinate: { // 菜单栏坐标
menuX: '0px',
menuY: '0px',
uploadX: '0px',
uploadY: '0px'
},
currentFileList: [],
selectFolderVisible: false,
selectFolderList: [], // 上传文件选择文件夹列表
breadcrumb: [ // 面包屑
{
name: '首页',
isFolder: true,
folderName: 'firstLevelData'
}
],
fileListData: {
firstLevelData: [
{
id: 991,
name: '第一级文件夹',
typeName: '学校文件夹',
type: 'school',
icon: 'el-icon-folder',
descript: '我上传了10个文档',
isFocus: false,
isFolder: true,
folderData: 'secondLevelData',
nextIsFolder: true,
uploadCount: '10',
author: '张三',
updateTime: '2020-08-22 12:00'
},
{
id: 992,
name: '第一级文件夹',
typeName: '个人文件夹',
type: 'personal',
icon: 'el-icon-folder',
descript: '我上传了10个文档',
isFocus: false,
isFolder: true,
folderData: 'secondLevelData',
nextIsFolder: true,
uploadCount: '10',
author: '张三',
updateTime: '2020-08-22 12:00'
},
{
id: 993,
name: '第一级文件夹',
typeName: '个人文件夹',
type: 'personal',
icon: 'el-icon-folder',
descript: '我上传了10个文档',
isFocus: false,
isFolder: true,
folderData: 'secondLevelData',
nextIsFolder: true,
uploadCount: '10',
author: '张三',
updateTime: '2020-08-22 12:00'
}
],
secondLevelData: [
{
id: 1001,
name: '第二级文件夹',
typeName: '学校文件夹',
type: 'school',
icon: 'el-icon-folder',
descript: '我上传了10个文档',
isFocus: false,
isFolder: true,
folderData: 'thirdLevelData',
nextIsFolder: false,
uploadCount: '10',
author: '张三',
updateTime: '2020-08-22 12:00'
},
{
id: 1002,
name: '第二级文件夹',
typeName: '学校文件夹',
type: 'school',
icon: 'el-icon-folder',
descript: '我上传了10个文档',
isFocus: false,
isFolder: true,
folderData: 'thirdLevelData',
nextIsFolder: false,
uploadCount: '10',
author: '张三',
updateTime: '2020-08-22 12:00'
}
],
thirdLevelData: [
{
id: 1101,
name: '第三级文件.txt',
typeName: '文件',
type: 'file',
icon: 'el-icon-document',
descript: '我上传了10个文档',
isFocus: false,
isFolder: false,
nextIsFolder: false,
uploadCount: '10',
author: '张三',
updateTime: '2020-08-22 12:00'
}
]
}
}
},
mounted () {
this.currentFileList = this.fileListData.firstLevelData
},
methods: {
backCrumb (index) {
let breadcrumb = this.breadcrumb
if (index < breadcrumb.length - 1) {
let folderName = breadcrumb[index].folderName
this.currentFileList = this.fileListData[folderName]
this.breadcrumb = breadcrumb.slice(0, index + 1)
}
},
changeFolderMode () {
/* 切换文件夹大小图标模式 */
this.bigMode = !this.bigMode
},
intoFolder (file) {
/* 进入下一级文件夹 */
if (file.isFolder) {
// 双击文件夹
let breadcrumbData = {
name: file.name,
isFolder: file.isFolder,
folderName: file.folderData
}
this.breadcrumb.push(breadcrumbData)
this.currentFileList = this.fileListData[file.folderData]
} else {
// 双击文件
this.documentDrawer = true
}
},
uploadFile (fileData, row) {
this.selectFolderVisible = true
},
showMenu (MouseEvent, type, row) {
/* 右键文件夹或文件时触发 */
if (type) {
// 右键文件夹或者文件
this.menuMode = type
this.rightMenuData = row
this.rightMenuFolder = []
} else {
// 右键空白处
this.menuMode = 'blank'
this.rightMenuFolder = this.currentFileList
this.rightMenuData = {}
}
this.menuVisible = false
this.uploadVisible = false
this.menuVisible = true
let coordinate = this.coordinate
coordinate.menuX = MouseEvent.pageX + 5 + 'px'
coordinate.menuY = MouseEvent.pageY + 'px'
coordinate.uploadX = MouseEvent.pageX + 130 + 'px'
coordinate.uploadY = MouseEvent.pageY + 'px'
document.addEventListener('click', this.foo) // 给整个document添加监听鼠标事件，点击任何位置执行foo方法
},
foo () {
/* 取消鼠标监听事件 菜单栏 */
this.menuVisible = false
this.uploadVisible = false
document.removeEventListener('click', this.foo) // 关掉监听
},
showUploadMenu () {
this.uploadVisible = !this.uploadVisible
}
}
}
</script>
<style lang="less" scoped>
.container {
min-height: 100%;
.headerNav {
display: flex;
justify-content: space-between;
height: 55px;
line-height: 55px;
background: #e7e7e7;
/deep/ .leftNav {
padding: 0 20px;
font-size: 18px;
.el-breadcrumb {
font-size: 18px;
line-height: 55px;
.el-breadcrumb__item {
&:not(:last-child) .el-breadcrumb__inner{
cursor: pointer;
&:hover {
color: #1890FF;
}
}
&:last-child .el-breadcrumb__inner{
color: black;
}
}
}
}
.rightNav {
padding: 0 30px;
display: flex;
.feature {
height: 40px;
margin: 7px 0 0 35px;
padding-left: 35px;
border-left: 1px solid #9e9e9e;
display: flex;
div {
width: 30px;
height: 30px;
margin: 4px 5px;
text-align: center;
line-height: 55px;
display: flex;
background: #f5f5f5;
cursor: pointer;
&:hover {
border: 1px solid #1890FF;
}
&:active {
opacity: 0.7;
}
i {
display: block;
align-self: center;
margin: 0 auto;
font-size: 22px;
}
}
}
}
}
.folderCtn{
min-height: 500px;
.bigCtn {
padding: 15px;
display: flex;
flex-wrap: wrap;
}
.smallCtn {
width: 100%;
}
}
}
.icon-sel {
border: 1px solid #1890FF;
}
</style>
VSSCMP_WEB/src/pages/education/schoolBasedResources/myResources/components/MyuploadCtxMenu.vue
View file @ 279bf40a
......@@ -58,7 +58,7 @@
<el-dialog class='share-ctn' title="分享" :visible.sync="shareVisible" width="500px">
<div class="header-ctn">
<span>分享给：</span>
<el-button class="person-btn" icon="el-icon-plus">选择教师</el-button>
<el-button class="person-btn" icon="el-icon-plus" @click="teacherSelectorOptions.isBlock = true">选择教师</el-button>
<span class="person-count">已选择 <span style="color:blue">6</span> 人</span>
</div>
<div class="tag-ctn">
......@@ -78,7 +78,12 @@
<el-button @click="shareVisible = false">取 消</el-button>
<el-button type="primary" @click="shareVisible = false">确 定</el-button>
</div>
<teacher-selector
:teacherSelectorOptions="teacherSelectorOptions"
@closeTeacherSelector="teacherSelectorOptions.isBlock = false">
</teacher-selector>
</el-dialog>
</div>
</template>
......@@ -86,45 +91,52 @@
export default {
name: 'ContextMenu',
props: {
menuVisible: {
menuVisible: { // 右键菜单栏显示
type: Boolean,
default: false
},
uploadVisible: {
uploadVisible: { // 上传菜单栏显示
type: Boolean,
default: false
},
rightMenuData: {
rightMenuData: { // 右键文件的数据
type: Object,
default: () => {
return {}
}
},
rightMenuFolder: {
rightMenuFolder: { // 右键空白所在层的文件夹数据
type: Array,
default: () => {
return []
}
},
coordinate: {
coordinate: { // 右键菜单栏坐标
type: Object,
default: () => {
return {}
}
},
menuMode: {
menuMode: { // 右键的文件属于那种类型（file: 文件，personal: 个人文件夹, blank: 右键空白 ）
type: String,
default: ''
}
},
components: {
TeacherSelector: () => import('@/common/TeacherSelector')
},
data () {
return {
renameVisible: false,
teacherSelectorOptions: {
isBlock: false,
isShow: true
},
renameVisible: false, // 重命名窗口
rename: '',
newFolderVisible: false,
newFolderVisible: false, // 新建文件夹窗口
newFolderName: '',
deleteVisible: false,
shareVisible: false,
deleteVisible: false, // 删除文件窗口
shareVisible: false, // 分享文件窗口
tags: [
{ name: '标某某' },
{ name: '某某某' },
......
VSSCMP_WEB/src/pages/education/schoolBasedResources/myResources/components/Search.vue
View file @ 279bf40a
<template>
<div class="show header-search">
<el-select
ref="headerSearchSelect"
v-model="search"
filterable
default-first-option
remote
placeholder="输入关键字搜索..."
class="header-search-select"
>
<option></option>
</el-select>
<span class="search-icon">
<i class="el-icon-search"></i>
</span>
<div class="header-search">
<el-input placeholder="请输入内容" v-model="search" class="input-with-select">
<el-button slot="append" icon="el-icon-search"></el-button>
</el-input>
</div>
</template>
......@@ -22,7 +11,6 @@ export default {
name: 'Search',
data () {
return {
show: true,
search: ''
}
}
......@@ -31,46 +19,8 @@ export default {
<style lang="less" scoped>
.header-search {
font-size: 0 !important;
position: relative;
.search-icon {
cursor: pointer;
font-size: 18px;
.input-with-select {
vertical-align: middle;
position: absolute;
right:6px;
top:10px;
height:35px;
line-height: 35px;
border-left: 1px solid #ccc;
padding: 0 15px;
}
/deep/ .header-search-select {
font-size: 18px;
transition: width 0.2s;
width: 0;
height: 55px;
overflow: hidden;
background: transparent;
border-radius: 0;
display: inline-block;
vertical-align: middle;
.el-input__inner {
font-size: 14px;
height: 35px;
padding-right: 55px;
}
}
&.show {
.header-search-select {
width: 250px;
margin-left: 10px;
}
}
}
</style>
VSSCMP_WEB/src/pages/education/schoolBasedResources/myResources/components/SmallFolder.vue
View file @ 279bf40a
......@@ -18,12 +18,13 @@
</template>
</el-table-column>
<el-table-column
v-if="fileList[0] && fileList[0].isFolder"
prop="typeName"
label="类型"
width="170">
</el-table-column>
<el-table-column
v-if="!manageMode"
v-if="!manageMode && (fileList[0] && fileList[0].isFolder)"
prop="uploadCount"
label="我上传的数量"
width="170">
......@@ -51,16 +52,8 @@
min-width="220">
</el-table-column>
</el-table>
<div class="pagination" v-show="!fileList[0].isFolder">
<el-pagination
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:current-page="1"
:page-sizes="[100, 200, 300, 400]"
:page-size="100"
layout="total, sizes, prev, pager, next, jumper"
:total="400">
</el-pagination>
<div class="pagination" v-if="!(fileList[0] && fileList[0].isFolder)">
<pagination :amount="50"></pagination>
</div>
</div>
</template>
......@@ -68,6 +61,9 @@
<script>
export default {
name: 'SmallFolder',
components: {
Pagination: () => import('@/common/Pagination')
},
props: {
fileList: {
type: Array,
......@@ -75,7 +71,7 @@ export default {
return []
}
},
manageMode: {
manageMode: { // 是否为我管理的页面使用
type: Boolean,
default: false
}
......
VSSCMP_WEB/src/pages/education/schoolBasedResources/myResources/components/UploadFile.vue
View file @ 279bf40a
......@@ -37,7 +37,6 @@ export default {
},
data () {
return {
dialogVisible: true
}
},
methods: {
......
VSSCMP_WEB/src/pages/education/schoolBasedResources/schoolResources/Index.vue
View file @ 279bf40a
<template>
<div class="container">
<v-header :title="'学校资源库'" :is-show-prev-page="true"></v-header>
<nav-menu :menus="menus"></nav-menu>
<div class="main">
<div class="headerNav">
<div class="leftNav">
<el-breadcrumb separator-class="el-icon-arrow-right">
<el-breadcrumb-item
v-for="(breadcrumbItem, index) of breadcrumb"
:key="index"
@click.native="backCrumb(index)">
{{ breadcrumbItem.name }}
</el-breadcrumb-item>
</el-breadcrumb>
</div>
<div class="rightNav">
<el-select v-if="!(currentFileList[0] && currentFileList[0].isFolder)" class="timer-select" v-model="timeSelect" placeholder="请选择">
<el-option
v-for="item in options"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
<search></search>
</div>
</div>
<div class="folderCtn">
<div class="smallCtn">
<small-folder
:file-list="currentFileList"
@tableIntoFile="intoFolder"
>
</small-folder>
</div>
</div>
<!-- 侧滑块查看普通文档 -->
<el-drawer
title="查看"
:visible.sync="documentDrawer"
:size="'60%'">
<span>文档内容</span>
</el-drawer>
</div>
</div>
</template>
<script>
export default {
name: 'Index',
components: {
VHeader: () => import('@/common/header/VHeader'),
NavMenu: () => import('@/common/navMenu/NavMenu'),
Search: () => import('./../myResources/components/Search'),
SmallFolder: () => import('./../myResources/components/SmallFolder')
},
data () {
return {
menus: [
{
name: '校内资源',
id: 'tab_1',
permission: true,
path: '/education/schoolResources/index'
}
],
timeSelect: 'allItem', // 学期选择框数据
options: [{
value: 'allItem',
label: '全部学期'
}],
documentDrawer: false, // 查看文档抽屉
currentFileList: [],
selectFolderVisible: false, // 查看文件侧滑框
breadcrumb: [ // 面包屑
{
name: '首页',
isFolder: true,
folderName: 'firstLevelData'
}
],
fileListData: {
firstLevelData: [
{
id: 991,
name: '第一级文件夹',
typeName: '学校文件夹',
type: 'school',
icon: 'el-icon-folder',
descript: '我上传了10个文档',
isFocus: false,
isFolder: true,
folderData: 'secondLevelData',
nextIsFolder: true,
uploadCount: '10',
author: '张三',
updateTime: '2020-08-22 12:00'
},
{
id: 992,
name: '第一级文件夹',
typeName: '个人文件夹',
type: 'personal',
icon: 'el-icon-folder',
descript: '我上传了10个文档',
isFocus: false,
isFolder: true,
folderData: 'secondLevelData',
nextIsFolder: true,
uploadCount: '10',
author: '张三',
updateTime: '2020-08-22 12:00'
},
{
id: 993,
name: '第一级文件夹',
typeName: '个人文件夹',
type: 'personal',
icon: 'el-icon-folder',
descript: '我上传了10个文档',
isFocus: false,
isFolder: true,
folderData: 'secondLevelData',
nextIsFolder: true,
uploadCount: '10',
author: '张三',
updateTime: '2020-08-22 12:00'
}
],
secondLevelData: [
{
id: 1001,
name: '第二级文件夹',
typeName: '学校文件夹',
type: 'school',
icon: 'el-icon-folder',
descript: '我上传了10个文档',
isFocus: false,
isFolder: true,
folderData: 'thirdLevelData',
nextIsFolder: false,
uploadCount: '10',
author: '张三',
updateTime: '2020-08-22 12:00'
},
{
id: 1002,
name: '第二级文件夹',
typeName: '学校文件夹',
type: 'school',
icon: 'el-icon-folder',
descript: '我上传了10个文档',
isFocus: false,
isFolder: true,
folderData: 'thirdLevelData',
nextIsFolder: false,
uploadCount: '10',
author: '张三',
updateTime: '2020-08-22 12:00'
}
],
thirdLevelData: [
{
id: 1101,
name: '第三级文件.txt',
typeName: '文件',
type: 'file',
icon: 'el-icon-document',
descript: '我上传了10个文档',
isFocus: false,
isFolder: false,
nextIsFolder: false,
uploadCount: '10',
author: '张三',
updateTime: '2020-08-22 12:00'
}
]
}
}
},
mounted () {
this.currentFileList = this.fileListData.firstLevelData
},
methods: {
backCrumb (index) {
/* 点击面包屑返回前几级 */
let breadcrumb = this.breadcrumb
if (index < breadcrumb.length - 1) {
let folderName = breadcrumb[index].folderName
this.currentFileList = this.fileListData[folderName]
this.breadcrumb = breadcrumb.slice(0, index + 1)
}
},
intoFolder (file) {
/* 进入下一级文件夹 */
if (file.isFolder) {
// 双击文件夹
let breadcrumbData = {
name: file.name,
isFolder: file.isFolder,
folderName: file.folderData
}
this.breadcrumb.push(breadcrumbData)
this.currentFileList = this.fileListData[file.folderData]
} else {
// 双击文件
this.documentDrawer = true
}
}
}
}
</script>
<style lang="less" scoped>
.container {
height: 100%;
min-height: 100%;
.main {
min-height: 100%;
.headerNav {
display: flex;
justify-content: space-between;
height: 45px;
line-height: 45px;
background: #e7e7e7;
/deep/ .leftNav {
padding: 0 20px;
font-size: 18px;
.el-breadcrumb {
font-size: 18px;
line-height: 45px;
.el-breadcrumb__item {
&:not(:last-child) .el-breadcrumb__inner{
cursor: pointer;
&:hover {
color: #1890FF;
}
}
&:last-child .el-breadcrumb__inner{
color: black;
}
}
}
}
/deep/ .rightNav {
padding: 0 30px;
display: flex;
.timer-select{
padding-top: 1px;
margin-right: 15px;
}
}
}
.folderCtn{
min-height: 500px;
.smallCtn {
width: 100%;
}
}
}
}
</style>
VSSCMP_WEB/src/routers/education/schoolBasedResourcesRouter.js
View file @ 279bf40a
......@@ -13,6 +13,24 @@ const MY_RESOURCES = [
}
]
// 我的资源-收藏分享
const MY_RESOURCES_FAVORSHARE = [
{
path: '/education/myResources/favorShare',
name: 'SchoolBasedMyResources',
component: resolve => require(['pages/education/schoolBasedResources/myResources/FavorShare'], resolve)
}
]
// 我的资源-我管理的
const MY_RESOURCES_MYMANAGE = [
{
path: '/education/myResources/myManage',
name: 'SchoolBasedMyResources',
component: resolve => require(['pages/education/schoolBasedResources/myResources/MyManage'], resolve)
}
]
// 学校资源
const SCHOOL_RESOURCES = [
{
......@@ -33,6 +51,8 @@ const FOLDER_MANAGE = [
export default [
...MY_RESOURCES,
...MY_RESOURCES_FAVORSHARE,
...MY_RESOURCES_MYMANAGE,
...SCHOOL_RESOURCES,
...FOLDER_MANAGE
]
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment