11 changed files with 632 additions and 192 deletions
-
4src/assets/styles/collect-reorganizi.scss
-
3src/assets/styles/prearchive-library.scss
-
349src/views/archivesManage/managementLibrary/index.vue
-
93src/views/collectReorganizi/collectionLibrary/anjuan/tableList.vue
-
109src/views/collectReorganizi/collectionLibrary/file/index.vue
-
94src/views/collectReorganizi/collectionLibrary/juannei/index.vue
-
3src/views/collectReorganizi/collectionLibrary/module/collectHeader.vue
-
93src/views/collectReorganizi/collectionLibrary/project/index.vue
-
6src/views/components/category/PreviewForm.vue
-
1src/views/prearchiveLibrary/index.vue
-
67src/views/prearchiveLibrary/module/moveFile.vue
@ -0,0 +1,349 @@ |
|||||
|
<template> |
||||
|
<div class="app-container archives-container"> |
||||
|
<div class="container-main" style="justify-content: flex-start;"> |
||||
|
<div class="elect-cont-left"> |
||||
|
<div class="container-left"> |
||||
|
<span class="right-top-line" /> |
||||
|
<span class="left-bottom-line" /> |
||||
|
<div class="arc-left-tree"> |
||||
|
<h3 class="arc-title arc-title-top">档案门类</h3> |
||||
|
<div class="tree-scroll"> |
||||
|
<el-tree ref="categroyTree" v-loading="crud.loading" class="arc-tree arc-tree-01" :data="crud.data" :props="defaultProps" node-key="id" :expand-on-click-node="false" highlight-current @node-click="handleNodeClick"> |
||||
|
<span slot-scope="{ node, data }" class="custom-tree-node"> |
||||
|
<span v-if="data.isType === 1 " class="iconFolder"> |
||||
|
{{ data.cnName }} |
||||
|
</span> |
||||
|
<span v-if="data.isType === 2" class="iconArch"> |
||||
|
{{ data.cnName }} |
||||
|
</span> |
||||
|
<span v-if="data.isType === 3" class="iconFile"> |
||||
|
{{ data.cnName }} |
||||
|
</span> |
||||
|
</span> |
||||
|
</el-tree> |
||||
|
</div> |
||||
|
<h3 class="arc-title arc-title-bottom">快速筛选</h3> |
||||
|
<el-tree |
||||
|
ref="classifyTree" |
||||
|
v-loading="classifyLoading" |
||||
|
class="arc-tree arc-tree-02" |
||||
|
:data="classifyTree" |
||||
|
:props="defaultClassifyProps" |
||||
|
node-key="id" |
||||
|
:expand-on-click-node="false" |
||||
|
highlight-current |
||||
|
> |
||||
|
<span slot-scope="{ node, data }" class="custom-tree-node"> |
||||
|
<span v-if="data.pid === null " class="iconClassify"> |
||||
|
{{ data.name }} |
||||
|
</span> |
||||
|
<span v-if="data.pid" class="iconClassify-child"> |
||||
|
{{ data.name }} |
||||
|
</span> |
||||
|
</span> |
||||
|
</el-tree> |
||||
|
</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
<!--用户数据--> |
||||
|
<div v-if="selectedCategory.isType !== 1" class="elect-cont-right"> |
||||
|
<div class="container-right tab-content"> |
||||
|
<span class="right-top-line" /> |
||||
|
<span class="left-bottom-line" /> |
||||
|
<Project v-if="selectedCategory.arrangeType === 3" ref="projectEle" :selected-category="selectedCategory" :data="sharedData" :is-recycle="isRecycle" @openAnjuan="handleOpenAnjuan" /> |
||||
|
<Anjuan v-if="selectedCategory.arrangeType === 1 || selectedCategory.arrangeType === 2 || selectedCategory.arrangeType === 3" ref="anjuanEle" :selected-category="selectedCategory" :data="sharedData" :is-recycle="isRecycle" @openJuannei="handleOpenJuannei" /> |
||||
|
<Juannei v-if="selectedCategory.arrangeType === 2 || selectedCategory.arrangeType === 3" ref="juanneiEle" :data="sharedData" :selected-category="selectedCategory" :is-recycle="isRecycle" @openFile="handleOpenFile" /> |
||||
|
<File v-if="selectedCategory.arrangeType === 1 || selectedCategory.arrangeType === 2 || selectedCategory.arrangeType === 3" ref="fileEle" :is-recycle="isRecycle" :selected-category="selectedCategory" /> |
||||
|
</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
import crudCategory from '@/api/category/category' |
||||
|
// import { collectionLibraryCrud } from './mixins/index' |
||||
|
import { FetchArchivesClassTree } from '@/api/system/archivesClass' |
||||
|
import CRUD, { presenter, header } from '@crud/crud' |
||||
|
import Project from './project/index' |
||||
|
import Anjuan from './anjuan/index' |
||||
|
import Juannei from './juannei/index' |
||||
|
import File from './file/index' |
||||
|
export default { |
||||
|
name: 'CollectionLibrary', |
||||
|
components: { Project, Anjuan, Juannei, File }, |
||||
|
cruds() { |
||||
|
return [ |
||||
|
CRUD({ |
||||
|
title: '收集库', url: 'api/category/menu', |
||||
|
crudMethod: { ...crudCategory }, |
||||
|
optShow: { |
||||
|
add: false, |
||||
|
edit: false, |
||||
|
del: false, |
||||
|
download: false, |
||||
|
group: false |
||||
|
} |
||||
|
}) |
||||
|
] |
||||
|
}, |
||||
|
mixins: [presenter(), header()], |
||||
|
props: { |
||||
|
isRecycle: { |
||||
|
type: Boolean, |
||||
|
default: false |
||||
|
} |
||||
|
}, |
||||
|
data() { |
||||
|
return { |
||||
|
defaultProps: { |
||||
|
children: 'children', |
||||
|
label: 'cnName' |
||||
|
}, |
||||
|
defaultClassifyProps: { |
||||
|
children: 'childArchivesClass', |
||||
|
label: 'name' |
||||
|
}, |
||||
|
sharedData: '', |
||||
|
selectedCategory: {}, |
||||
|
classifyTree: [], |
||||
|
classifyLoading: false |
||||
|
} |
||||
|
}, |
||||
|
watch: { |
||||
|
isRecycle: function(newValue, oldValue) { |
||||
|
} |
||||
|
}, |
||||
|
created() { |
||||
|
}, |
||||
|
mounted() { |
||||
|
}, |
||||
|
methods: { |
||||
|
filterData(data) { |
||||
|
return data.filter(node => { |
||||
|
if (node.children && node.children.length > 0) { |
||||
|
node.children = this.filterData(node.children) // 递归处理子节点 |
||||
|
} |
||||
|
return node.isType !== 3 // 过滤掉isType为3的节点 |
||||
|
}) |
||||
|
}, |
||||
|
// 逆归实现 获取指定元素 |
||||
|
findNode(tree, func) { |
||||
|
for (const node of tree) { |
||||
|
if (func(node)) return node |
||||
|
if (node.children) { |
||||
|
const res = this.findNode(node.children, func) |
||||
|
if (res) return res |
||||
|
} |
||||
|
} |
||||
|
return null |
||||
|
}, |
||||
|
// 展开选中的父级 |
||||
|
expandParents(node) { |
||||
|
node.expanded = true |
||||
|
if (node.parent) { |
||||
|
this.expandParents(node.parent) |
||||
|
} |
||||
|
}, |
||||
|
[CRUD.HOOK.afterRefresh]() { |
||||
|
this.crud.data = this.filterData(this.crud.data) |
||||
|
this.$nextTick(() => { |
||||
|
let currentKey |
||||
|
if (localStorage.getItem('currentArchivesKey')) { |
||||
|
currentKey = JSON.parse(localStorage.getItem('currentArchivesKey')) |
||||
|
// 删除门类节点后 |
||||
|
if (this.$refs.categroyTree.getCurrentKey(currentKey.id) == null) { |
||||
|
localStorage.removeItem('currentArchivesKey') |
||||
|
} |
||||
|
// 缓存的门类节点判断 |
||||
|
if (currentKey.isType === 1) { |
||||
|
if (currentKey.children.length !== 0) { |
||||
|
currentKey = this.findNode(currentKey.children, (node) => { |
||||
|
return node.isType !== 1 |
||||
|
}) |
||||
|
} |
||||
|
} |
||||
|
} else { |
||||
|
// 默认 |
||||
|
if (this.crud.data[0].isType === 1) { |
||||
|
currentKey = this.findNode(this.crud.data[0].children, (node) => { |
||||
|
return node.isType !== 1 |
||||
|
}) |
||||
|
} else { |
||||
|
currentKey = this.crud.data[0] |
||||
|
} |
||||
|
} |
||||
|
if (currentKey.id) { |
||||
|
// 设置某个节点的当前选中状态 |
||||
|
this.$refs.categroyTree.setCurrentKey(currentKey.id) |
||||
|
this.$nextTick(() => { |
||||
|
// 设置某个节点的父级展开 |
||||
|
const selectedKey = this.$refs.categroyTree.getCurrentNode() |
||||
|
if (this.$refs.categroyTree.getNode(selectedKey) && this.$refs.categroyTree.getNode(selectedKey).parent) { |
||||
|
this.expandParents(this.$refs.categroyTree.getNode(selectedKey).parent) |
||||
|
} |
||||
|
// 选中节点的门类详情 |
||||
|
this.handleNodeClick(selectedKey) |
||||
|
}) |
||||
|
} |
||||
|
}) |
||||
|
}, |
||||
|
handleNodeClick(val) { |
||||
|
// 缓存当前的选中的 |
||||
|
localStorage.setItem('currentArchivesKey', JSON.stringify(val)) |
||||
|
|
||||
|
this.selectedCategory = val |
||||
|
|
||||
|
if (this.selectedCategory.isType !== 1) { |
||||
|
this.getInitArchivesClass(val.id) |
||||
|
} else { |
||||
|
this.classifyTree = [] |
||||
|
} |
||||
|
|
||||
|
this.$nextTick(() => { |
||||
|
if (this.selectedCategory.arrangeType === 3) { |
||||
|
this.$refs.projectEle.getCommonData(1) |
||||
|
} else if (this.selectedCategory.arrangeType === 2) { |
||||
|
this.$refs.anjuanEle.$refs.ajContent.$refs.tableList.getCommonData(2) |
||||
|
} else if (this.selectedCategory.arrangeType === 1) { |
||||
|
this.$refs.anjuanEle.$refs.ajContent.$refs.tableList.getCommonData(3) |
||||
|
} |
||||
|
if (this.$refs.anjuanEle) { |
||||
|
this.$refs.anjuanEle.anjuanDrawer = false |
||||
|
// if (this.$refs.anjuanEle.$refs.ajContent) { |
||||
|
// this.$refs.anjuanEle.$refs.ajContent.activeIndex = 0 |
||||
|
// } |
||||
|
} |
||||
|
if (this.$refs.juanneiEle) { |
||||
|
this.$refs.juanneiEle.juanneiDrawer = false |
||||
|
} |
||||
|
if (this.$refs.fileEle) { |
||||
|
this.$refs.fileEle.fileDrawer = false |
||||
|
} |
||||
|
}) |
||||
|
}, |
||||
|
getInitArchivesClass(categoryId) { |
||||
|
this.classifyLoading = true |
||||
|
const params = { |
||||
|
'categoryId': categoryId |
||||
|
} |
||||
|
FetchArchivesClassTree(params).then((res) => { |
||||
|
this.classifyTree = res |
||||
|
this.classifyLoading = false |
||||
|
}).catch(err => { |
||||
|
console.log(err) |
||||
|
}) |
||||
|
}, |
||||
|
handleOpenAnjuan(data) { |
||||
|
this.$refs.anjuanEle.anjuanDrawer = true |
||||
|
// this.$refs.anjuanEle.$refs.ajContent.activeIndex = 0 |
||||
|
this.$nextTick(() => { |
||||
|
this.$refs.anjuanEle.$refs.ajContent.test = data |
||||
|
}) |
||||
|
}, |
||||
|
handleOpenJuannei(data) { |
||||
|
if (this.selectedCategory.arrangeType === 1 || (this.selectedCategory.arrangeType === 3) || (this.selectedCategory.arrangeType === 2)) { |
||||
|
// && this.$refs.anjuanEle.$refs.ajContent.activeIndex === 1 |
||||
|
this.$refs.fileEle.fileDrawer = true |
||||
|
this.$nextTick(() => { |
||||
|
this.$refs.fileEle.test = data |
||||
|
this.$refs.fileEle.isAjNo = 1 |
||||
|
}) |
||||
|
} else { |
||||
|
this.$refs.juanneiEle.juanneiDrawer = true |
||||
|
this.$nextTick(() => { |
||||
|
this.$refs.juanneiEle.test = data |
||||
|
this.$refs.fileEle.isAjNo = 0 |
||||
|
}) |
||||
|
} |
||||
|
}, |
||||
|
handleOpenFile(data) { |
||||
|
this.$refs.fileEle.fileDrawer = true |
||||
|
this.$nextTick(() => { |
||||
|
this.$refs.fileEle.test = data |
||||
|
}) |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
</script> |
||||
|
|
||||
|
<style lang="scss" scoped> |
||||
|
.elect-cont-left{ |
||||
|
width: 276px; |
||||
|
padding: 0 !important; |
||||
|
} |
||||
|
.hideSidebar .elect-cont-left { |
||||
|
width: 265px !important; |
||||
|
} |
||||
|
[data-theme=light] .elect-cont-left .container-left { |
||||
|
min-height: calc(100vh - 140px); |
||||
|
} |
||||
|
[data-theme=dark] .elect-cont-left .container-left { |
||||
|
min-height: calc(100vh - 160px); |
||||
|
} |
||||
|
.openSidebar .elect-cont-right { |
||||
|
width: calc(100vw - 592px); |
||||
|
} |
||||
|
[data-theme=light] .elect-cont-right .container-right.tab-content { |
||||
|
min-height: calc(100vh - 180px) !important; |
||||
|
} |
||||
|
.arc-title{ |
||||
|
position: relative; |
||||
|
height: 48px; |
||||
|
line-height: 48px; |
||||
|
text-align: center; |
||||
|
font-size: 16px; |
||||
|
color: #0C0E1E; |
||||
|
background-color: #F3F5F8; |
||||
|
&::after{ |
||||
|
content: ""; |
||||
|
position: absolute; |
||||
|
right: 12px; |
||||
|
bottom: 0; |
||||
|
} |
||||
|
} |
||||
|
.arc-title-top{ |
||||
|
&::after{ |
||||
|
width: 44px; |
||||
|
height: 35px; |
||||
|
background: url("~@/assets/images/collect/daml.png") no-repeat; |
||||
|
background-size: 100% 100%; |
||||
|
} |
||||
|
} |
||||
|
.arc-title-bottom{ |
||||
|
&::after{ |
||||
|
width: 41px; |
||||
|
height: 40px; |
||||
|
background: url("~@/assets/images/collect/kssx.png") no-repeat; |
||||
|
background-size: 100% 100%; |
||||
|
} |
||||
|
} |
||||
|
.arc-tree{ |
||||
|
padding: 0 20px; |
||||
|
background-color: red; |
||||
|
} |
||||
|
.arc-tree-01{ |
||||
|
height: 400px; |
||||
|
overflow: hidden; |
||||
|
overflow-y: scroll; |
||||
|
} |
||||
|
[data-theme=dark] .arc-tree-01{ |
||||
|
height: 370px; |
||||
|
} |
||||
|
|
||||
|
.arc-tree-02{ |
||||
|
height: calc(100vh - 720px); |
||||
|
overflow: hidden; |
||||
|
overflow-y: scroll; |
||||
|
} |
||||
|
::v-deep .el-tree-node__children .custom-tree-node{ |
||||
|
font-size: 14px; |
||||
|
} |
||||
|
|
||||
|
[data-theme=light] .elect-cont-right { |
||||
|
padding: 0 20px !important; |
||||
|
} |
||||
|
[data-theme=dark] .elect-cont-right { |
||||
|
margin-top: 0 !important; |
||||
|
} |
||||
|
</style> |
||||
Write
Preview
Loading…
Cancel
Save
Reference in new issue