【前端】智能库房综合管理系统前端项目
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 
 

802 lines
28 KiB

<!-- eslint-disable no-return-assign -->
<template>
<div class="app-container">
<!-- 门类列表 -->
<el-row class="container-main">
<el-col class="curd-in-out" :xs="10" :sm="8" :md="5" :lg="6" :xl="5">
<div :class="['container-left', !isRecycle ? 'left-tree-item' : '' ]">
<span class="right-top-line" />
<span class="left-bottom-line" />
<div class="tree-title">档案门类</div>
<!--档案门类树状结构-->
<div class="tree-scroll">
<el-tree ref="archivesTree" v-loading="crud.loading" :data="crud.data" :props="defaultProps" node-key="id" :expand-on-click-node="false" highlight-current @node-click="handleNodeClick" />
</div>
</div>
<div v-if="!isRecycle" class="container-left left-tree-item">
<span class="right-top-line" />
<span class="left-bottom-line" />
<div class="tree-title">智能分类</div>
<!--智能分类树状结构-->
<!-- @node-click="handleIntellNodeClick" -->
<!-- @check="nodeCheck" -->
<div class="tree-scroll">
<el-tree
ref="smartTree"
v-loading="intellClassifyLoading"
:data="intellClassifyTree"
:props="intellDefaultProps"
node-key="dicName"
:check-strictly="true"
:default-expand-all="true"
:default-checked-keys="defaultCheckedKeys"
:expand-on-click-node="false"
@node-click="handleIntellNodeClick"
>
<template #default="{ node }">
<span>
<el-tooltip v-if="node.data.dicPid === null" class="item" effect="dark" content="点击当前根目录取消所选项" placement="top-start">
<span>{{ node.label }}</span>
</el-tooltip>
<span v-else>{{ node.label }}</span>
<span
v-if="node.checked && node.data.dicPid !== null"
class="el-icon-check"
/>
</span>
</template>
</el-tree>
</div>
</div>
</el-col>
<!-- 档案管理列表 -->
<el-col class="archives-right-list" :xs="14" :sm="18" :md="19" :lg="18" :xl="19">
<div v-if="selectedCategory.isType !== 1 && !isRecycle" :class="['archives-top', {'archives-fixed-top': selectedCategory.isType === 2 }]">
<el-button v-if="selectedCategory.isType !== 4" type="primary" class="one-click-delete el-icon-delete" @click="oneClickDeleteHandle">一键删除</el-button>
<el-checkbox v-model="fixedStatusBar" @change="statusBarChecked">隐藏状态栏</el-checkbox>
</div>
<!-- 项目 -->
<archivesProject
v-if="selectedCategory.isType === 2"
ref="project"
:selected-category="selectedCategory"
:smart-query="smartQuery"
@getAjInProjectBtnState="getAjInProjectBtnState"
@getProjectSelections="getProjectSelections"
/>
<!-- 案卷 -->
<archivesAnjuan
v-if="( selectedCategory.isType === 2 && selectedCategory.children.length !== 0 ) || selectedCategory.isType === 3 || selectedCategory.isType === 5"
ref="anjuan"
:selected-category="selectedCategory"
:is-project="isProject"
:is-has-project="isHasProject"
:project-selection="projectSelection"
:fixed-status-bar="fixedStatusBar"
:archive-year="archiveYear"
:smart-query="smartQuery"
@getJnInAjBtnState="getJnInAjBtnState"
@getSelections="getSelections"
/>
<!-- 卷内 -->
<archivesJuannei
v-if="( selectedCategory.isType === 2 && selectedCategory.children.length !== 0 && selectedCategory.children[0].children.length !==0 ) || ( selectedCategory.isType === 3 && selectedCategory.children.length !==0 ) || selectedCategory.isType === 4"
ref="file"
:is-anjuan="isAnjuan"
:anjuan-selection="anjuanSelection"
:selected-category="selectedCategory"
:fixed-status-bar="fixedStatusBar"
:smart-query="smartQuery"
/>
</el-col>
</el-row>
<oneClickDeltModule v-if="isOneClick" ref="oneClickRef" :selected-category="selectedCategory" :intell-classify-tree="intellClassifyTree" />
</div>
</template>
<script>
import { getDicts } from '@/api/archivesConfig/dict'
import archivesProject from './archivesProject/index'
import archivesAnjuan from './archivesAnjuan/index'
import archivesJuannei from './archivesJuannei/index'
import oneClickDeltModule from './oneClickDelete/index'
import crudCategory from '@/api/category/category'
import CRUD, { presenter } from '@crud/crud'
import { archivesCrud } from './mixins/archives'
export default {
name: 'ArchivesList',
components: { archivesProject, archivesAnjuan, archivesJuannei, oneClickDeltModule },
cruds() {
return [
CRUD({
title: '档案', url: 'api/archives-type/menu',
crudMethod: { ...crudCategory }
})
]
},
provide() {
return {
recycleMain: this
}
},
mixins: [presenter(), archivesCrud],
props: {
isdel: {
type: Boolean,
default: false
},
isRecycle: {
type: Boolean,
default: false
}
},
data() {
return {
intellClassifyTree: [],
defaultProps: {
children: 'children',
label: 'cnName'
},
intellDefaultProps: {
children: 'childMenus',
label: 'dicName'
},
selectedCategory: {},
isAnjuan: true,
isProject: true,
anjuanSelection: {},
projectSelection: {},
intellClassifyLoading: false,
nodeCheckDataArr: [],
fixedStatusBar: false,
archiveYear: null,
smartQuery: {
'archiveYear': null,
'department': null,
'retention': null,
'securityClass': null,
'organizationMatter': null,
'fondsNo': null,
'recordType': null,
'mediumType': null
},
treeCurrentNode: null,
nodeClick: false,
isHasProject: null, // 案卷上是否有项目门类
isOneClick: false,
defaultCheckedKeys: []
}
},
watch: {
isdel: function(newValue, oldValue) {
},
isRecycle: function(newValue, oldValue) {
}
},
mounted() {
this.fixedStatusBar = JSON.parse(localStorage.getItem('statusBarFixedType')) === true
},
methods: {
// 缓存用户对于固定栏操作习惯
statusBarChecked(val) {
localStorage.setItem('statusBarFixedType', val)
},
// 逆归实现 获取指定元素
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]() {
let currentKey
if (localStorage.getItem('currentArchivesKey')) {
currentKey = JSON.parse(localStorage.getItem('currentArchivesKey'))
// 删除门类节点后
if (this.$refs.archivesTree.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.archivesTree.setCurrentKey(currentKey.id)
this.$nextTick(() => {
// 设置某个节点的父级展开
const selectedKey = this.$refs.archivesTree.getCurrentNode()
if (this.$refs.archivesTree.getNode(selectedKey) && this.$refs.archivesTree.getNode(selectedKey).parent) {
this.expandParents(this.$refs.archivesTree.getNode(selectedKey).parent)
}
// 删除刷新
if (localStorage.getItem('isDelt') === '1') {
if (this.$refs.project) {
this.$refs.project.$refs.table.clearSelection()
}
this.clearAnjuan()
this.clearFile()
} else if (localStorage.getItem('isDelt') === '2') {
if (this.$refs.project) {
this.$refs.project.selections = this.$refs.project.$refs.table.selection
}
if (this.$refs.anjuan) {
this.$refs.anjuan.$refs.table.clearSelection()
}
this.clearFile()
} else if (localStorage.getItem('isDelt') === '3') {
if (this.$refs.anjuan) {
this.$refs.anjuan.selections = this.$refs.anjuan.$refs.table.selection
}
if (this.$refs.file) {
this.$refs.file.$refs.table.clearSelection()
}
}
// 选中节点的门类详情
this.handleNodeClick(selectedKey)
this.isOneClick = true
localStorage.removeItem('noClick')
})
}
this.getIntellClassify()
},
getIntellClassify() {
getDicts().then(data => {
if (data) {
this.intellClassifyTree = data.filter(item => {
item.checked = false
return item.dicCode === 'Search_MJ' || item.dicCode === 'Search_BGQX' || item.dicCode === 'WZ' || item.dicCode === 'ZT' || item.dicCode === 'QZH'
})
this.intellClassifyTree.forEach(item => {
item.disabled = item.dicPid === null
})
}
})
},
// 选中门类后,设置字典详情数据
handleNodeClick(val) {
if (val) {
if (localStorage.getItem('isForm')) {
localStorage.removeItem('noClick')
} else {
localStorage.setItem('noClick', true)
}
// 初始化智能分类的操作
if (this.$refs.smartTree) {
this.treeCurrentNode = null
// const smartTreeList = this.intellClassifyTree
this.smartQuery = {
'archiveYear': null,
'department': null,
'retention': null,
'securityClass': null,
'organizationMatter': null,
'fondsNo': null,
'recordType': null,
'mediumType': null
}
this.nodeCheckDataArr = []
this.$refs.smartTree.setCheckedKeys([])
// smartTreeList.forEach((item, index) => {
// this.$refs.smartTree.store.nodesMap[smartTreeList[index].dicName].expanded = false
// })
}
this.crud.selectionChangeHandler([val])
this.selectedCategory = val
// 判断当前选中的案卷上是否有项目门类,有-新增hide, 无-新增show
if (this.$refs.archivesTree.getNode(this.selectedCategory.id).parent.data.isType === 2) {
this.isHasProject = true
} else {
this.isHasProject = false
}
this.handleTableList()
// 缓存当前的选中的
localStorage.setItem('currentArchivesKey', JSON.stringify(val))
}
},
// 判断案卷内的卷内-新增btn-状态 中转站
getJnInAjBtnState(data) {
this.isAnjuan = data
},
getAjInProjectBtnState(data) {
this.isProject = data
},
// 项目内操作
getProjectSelections(data, selectData) {
this.smartQuery = {
'archiveYear': null,
'department': null,
'retention': null,
'securityClass': null,
'organizationMatter': null,
'fondsNo': null,
'recordType': null,
'mediumType': null
}
if ((selectData && selectData.length > 1) || (selectData && selectData.length === 0)) {
this.isProject = true
this.isAnjuan = true
this.projectSelection = {}
this.$nextTick(() => {
if (this.$refs.anjuan) {
this.$refs.anjuan.selections = []
this.$refs.anjuan.$refs.table.clearSelection()
this.clearAnjuan()
if (this.$refs.file) {
this.$refs.file.selections = []
this.$refs.file.$refs.table.clearSelection()
this.clearFile()
}
}
})
} else if (selectData && selectData.length === 1) {
this.projectSelection = selectData[0]
this.$nextTick(() => {
if (this.$refs.anjuan) {
this.$refs.anjuan.$refs.table.clearSelection()
this.$refs.anjuan.getTableList()
if (this.$refs.file) {
this.$refs.file.$refs.table.clearSelection()
this.clearFile()
}
}
})
} else {
this.projectSelection = data
this.$nextTick(() => {
if (this.$refs.anjuan) {
this.$refs.anjuan.$refs.table.clearSelection()
this.clearAnjuan()
this.$refs.anjuan.getTableList()
if (this.$refs.file) {
this.$refs.file.$refs.table.clearSelection()
this.clearFile()
}
}
})
}
},
// 案卷内操作
getSelections(data, selectData) {
this.smartQuery = {
'archiveYear': null,
'department': null,
'retention': null,
'securityClass': null,
'organizationMatter': null,
'fondsNo': null,
'recordType': null,
'mediumType': null
}
if ((selectData && selectData.length > 1) || (selectData && selectData.length === 0)) {
this.isAnjuan = true
this.anjuanSelection = {}
this.$nextTick(() => {
if (this.$refs.file) {
this.$refs.file.selections = []
this.$refs.file.$refs.table.clearSelection()
this.clearFile()
}
})
} else if (selectData && selectData.length === 1) {
this.anjuanSelection = selectData[0]
this.$nextTick(() => {
if (this.$refs.file) {
this.$refs.file.$refs.table.clearSelection()
this.$refs.file.getTableList()
}
})
} else {
this.anjuanSelection = data
this.$nextTick(() => {
if (this.$refs.file) {
this.$refs.file.$refs.table.clearSelection()
this.$refs.file.getTableList()
}
})
}
// 已装盒得案卷,不可新增案卷
if (this.anjuanSelection.case_no) {
this.isAnjuan = true
}
},
// 智能分类获取年度
getYear(obj) {
if (this.$refs.smartTree) {
this.intellClassifyLoading = true
setTimeout(() => {
if (this.intellClassifyTree[0].dicName === '年度') {
this.intellClassifyTree = this.intellClassifyTree.slice(1)
}
if (this.$refs[obj].yearGroup.length !== 0) {
const newYearArr = this.$refs[obj].yearGroup.map((item, index) => {
const json = {}
json.id = index + 1
json.dicName = item
json.childMenus = []
json.dicPid = 0
return json
})
this.intellClassifyTree.unshift({ id: 0, dicName: '年度', dicPid: null, dicCode: 'Search_year', disabled: true, childMenus: newYearArr })
console.log(this.intellClassifyTree)
}
this.intellClassifyLoading = false
}, 1000)
}
},
unique(arr) {
return Array.from(new Set(arr))
},
// 递归函数,取消选中指定节点下的所有子节点
uncheckChildren(node) {
if (node.childNodes && node.childNodes.length > 0) {
for (const child of node.childNodes) {
const index = this.nodeCheckDataArr.findIndex(item => item.data.dicName === child.data.dicName)
if (index !== -1) {
this.nodeCheckDataArr.splice(index, 1)
}
this.uncheckChildren(child)
}
switch (node.data.dicCode) {
case 'Search_year':
this.smartQuery.archiveYear = null
break
case 'Search_BM':
this.smartQuery.department = null
break
case 'Search_BGQX':
this.smartQuery.retention = null
break
case 'Search_MJ':
this.smartQuery.securityClass = null
break
case 'WZ':
this.smartQuery.recordType = null
break
case 'ZT':
this.smartQuery.mediumType = null
break
case 'QZH':
this.smartQuery.fondsNo = null
break
default:
this.smartQuery.organizationMatter = null
}
this.handleTableList()
}
},
// 智能分类
handleIntellNodeClick(data, node, ele) {
console.log(node)
if (!this.nodeCheckDataArr.includes(node)) {
this.nodeCheckDataArr.push(node)
}
const oldItemIndex = this.nodeCheckDataArr.findIndex(item => item.data.dicName === node.data.dicName)
if (oldItemIndex !== -1) {
this.uncheckChildren(node)
// this.nodeCheckDataArr.splice(oldItemIndex, 1)
} else {
this.nodeCheckDataArr.push(node)
}
const parentDicName = node.parent.data.dicName
this.nodeCheckDataArr = this.nodeCheckDataArr.filter(item => item.parent.data.dicName !== parentDicName)
this.nodeCheckDataArr.push(node)
const ids = Array.from(new Set(this.nodeCheckDataArr.map(item => item.data.dicName)))
this.$refs.smartTree.setCheckedKeys(ids)
if (data) {
if (node.childNodes.length === 0) {
if (this.$refs.project) {
this.$refs.project.$refs.table.clearSelection()
this.clearProject()
}
if (this.$refs.anjuan) {
this.$refs.anjuan.$refs.table.clearSelection()
this.clearAnjuan()
}
if (this.$refs.file) {
this.$refs.file.$refs.table.clearSelection()
this.clearFile()
}
const selectedKey = this.$refs.smartTree.getCurrentNode()
const selectedParentVal = this.$refs.smartTree.getNode(selectedKey).parent.data.dicCode
this.treeCurrentNode = ele.$el
// this.smartQuery = {
// 'archiveYear': null,
// 'department': null,
// 'retention': null,
// 'securityClass': null,
// 'organizationMatter': null,
// 'fondsNo': null,
// 'recordType': null,
// 'mediumType': null
// }
// if (ele.$el.classList.contains('is-current')) {
// this.treeCurrentNode.classList.remove('is-current')
// } else {
// this.treeCurrentNode.classList.add('is-current')
switch (selectedParentVal) {
case 'Search_year':
if (selectedKey.dicCode !== 'Search_year') {
this.smartQuery.archiveYear = selectedKey.dicName
}
break
case 'Search_BM':
if (selectedKey.dicCode !== 'Search_BM') {
this.smartQuery.department = selectedKey.dicName
}
break
case 'Search_BGQX':
if (selectedKey.dicCode !== 'Search_BGQX') {
this.smartQuery.retention = selectedKey.dicName
}
break
case 'Search_MJ':
if (selectedKey.dicCode !== 'Search_MJ') {
this.smartQuery.securityClass = selectedKey.dicName
}
break
case 'WZ':
if (selectedKey.dicCode !== 'WZ') {
this.smartQuery.recordType = selectedKey.dicName
}
break
case 'ZT':
if (selectedKey.dicCode !== 'ZT') {
this.smartQuery.mediumType = selectedKey.dicName
}
break
case 'QZH':
if (selectedKey.dicCode !== 'QZH') {
this.smartQuery.fondsNo = selectedKey.dicName
}
break
default:
if (selectedKey.dicCode !== 'Search_JGWT') {
this.smartQuery.organizationMatter = selectedKey.dicName
}
}
this.handleTableList()
// }
}
}
},
// 获取档案list
handleTableList() {
// 门类菜单切换时案卷/卷内'新增'btn不可操作
localStorage.removeItem('isForm')
localStorage.removeItem('isDelt')
this.isProject = true
this.isAnjuan = true
if (this.selectedCategory.isType === 2) {
this.$nextTick(() => {
if (this.$refs.anjuan) {
if (localStorage.getItem('noClick')) {
this.$refs.anjuan.$refs.table.clearSelection()
this.clearAnjuan()
}
}
if (this.$refs.file) {
if (localStorage.getItem('noClick')) {
this.$refs.file.$refs.table.clearSelection()
this.clearFile()
}
}
this.$refs.project.getTableDisplayFields(0)
if (this.selectedCategory.children.length !== 0) {
if (this.$refs.anjuan) {
this.$refs.anjuan.getTableDisplayFields(1)
}
if (this.$refs.file) {
this.$refs.file.getTableDisplayFields(2)
}
}
setTimeout(() => {
this.$refs.project.getTableList()
if (this.$refs.project.$refs.table.selection.length !== 0) {
this.$refs.project.selections = this.$refs.project.$refs.table.selection
this.$refs.anjuan.getTableList()
this.isProject = false
} else {
this.$refs.anjuan.$refs.table.clearSelection()
}
if (this.$refs.anjuan.$refs.table.selection.length !== 0) {
this.$refs.anjuan.selections = this.$refs.anjuan.$refs.table.selection
this.$refs.file.getTableList()
if (this.$refs.file.$refs.table.selection.length !== 0) {
this.$refs.file.selections = this.$refs.file.$refs.table.selection
}
this.isAnjuan = false
} else {
this.clearAnjuan()
this.clearFile()
// this.$refs.anjuan.anjuanData = []
// this.$refs.anjuan.anjuanTableHeight = ''
// this.$refs.file.junneiData = []
// this.$refs.file.juanneiTableHeight = ''
}
}, 500)
if (!this.treeCurrentNode) {
this.getYear('project')
}
})
} else if (this.selectedCategory.isType === 3) {
this.$nextTick(() => {
if (this.$refs.anjuan) {
if (localStorage.getItem('noClick')) {
this.$refs.anjuan.$refs.table.clearSelection()
this.clearAnjuan()
}
}
if (this.$refs.file) {
if (localStorage.getItem('noClick')) {
this.$refs.file.$refs.table.clearSelection()
this.clearFile()
}
}
this.$refs.anjuan.getTableDisplayFields(1)
if (this.selectedCategory.children.length !== 0) {
if (this.$refs.file) {
this.$refs.file.getTableDisplayFields(2)
}
}
setTimeout(() => {
this.$refs.anjuan.getTableList()
if (this.$refs.anjuan.$refs.table.selection.length !== 0) {
this.$refs.anjuan.selections = this.$refs.anjuan.$refs.table.selection
this.$refs.file.getTableList()
if (this.$refs.file.$refs.table.selection.length !== 0) {
this.$refs.file.selections = this.$refs.file.$refs.table.selection
}
this.isAnjuan = false
} else {
// this.$refs.file.junneiData = []
// this.$refs.file.juanneiTableHeight = ''
this.clearFile()
}
}, 500)
if (!this.treeCurrentNode) {
this.getYear('anjuan')
}
})
} else if (this.selectedCategory.isType === 4) {
this.$nextTick(() => {
if (this.$refs.file) {
this.$refs.file.$refs.table.clearSelection()
this.clearFile()
}
this.$refs.file.getTableDisplayFields(2)
setTimeout(() => {
this.$refs.file.getTableList()
}, 500)
if (!this.treeCurrentNode) {
this.getYear('file')
}
})
} else if (this.selectedCategory.isType === 5) {
this.$nextTick(() => {
if (localStorage.getItem('noClick')) {
this.$refs.anjuan.$refs.table.clearSelection()
}
this.clearAnjuan()
this.$refs.anjuan.getTableDisplayFields(1)
setTimeout(() => {
this.$refs.anjuan.getTableList()
this.$refs.anjuan.selections = this.$refs.anjuan.$refs.table.selection
}, 500)
if (!this.treeCurrentNode) {
this.getYear('anjuan')
}
})
}
},
clearProject() {
if (this.$refs.project) {
this.$refs.project.projectData = []
this.$refs.project.projectTableHeight = ''
this.$refs.project.page = {
page: 1,
size: 10,
total: 0
}
}
},
clearAnjuan() {
if (this.$refs.anjuan) {
this.$refs.anjuan.anjuanData = []
this.$refs.anjuan.anjuanTableHeight = ''
this.$refs.anjuan.page = {
page: 1,
size: 10,
total: 0
}
}
},
clearFile() {
if (this.$refs.file) {
this.$refs.file.junneiData = []
this.$refs.file.juanneiTableHeight = ''
this.$refs.file.page = {
page: 1,
size: 10,
total: 0
}
}
},
// 一键删除
oneClickDeleteHandle() {
this.$refs.oneClickRef.oneClickVisible = true
}
}
}
</script>
<style lang="scss" scoped>
@import "~@/assets/styles/archives-manage.scss";
.tree-scroll{
height: calc(100vh - 630px);
overflow-y: scroll;
overflow-x: hidden;
}
::v-deep .el-table th.el-table__cell > .cell {
white-space: pre;
}
.iconfont::before{
margin-right: 6px;
}
.one-click-delete{
padding: 4px 10px;
margin-right: 20px;
&.active{
border-color: #f65163;
background-color: #f65163;
}
::v-deep span{
display: inline-block;
margin-left: 5px;
}
}
// ::v-deep .el-tree {
// // 不可全选样式
// .el-tree-node {
// .el-checkbox .el-checkbox__inner {
// display: none !important;
// }
// }
// }
</style>