88 lines
2.4 KiB
Vue
88 lines
2.4 KiB
Vue
<template>
|
|
<a-card :bordered="false">
|
|
<a-tabs default-active-key="1" v-model="activeTab">
|
|
<template v-for="tab in tabList">
|
|
<a-tab-pane v-if="isHasPermission(tab.permission)" :key="tab.component">
|
|
<template v-slot:tab>
|
|
<div>
|
|
{{ tab.label }}
|
|
</div>
|
|
</template>
|
|
</a-tab-pane>
|
|
</template>
|
|
</a-tabs>
|
|
<div class="tabs-table-box">
|
|
<component
|
|
:is="comp"
|
|
ref="compModel"
|
|
v-if="comp">
|
|
</component>
|
|
</div>
|
|
</a-card>
|
|
</template>
|
|
|
|
<script>
|
|
import { isHasPermission } from '@/utils/hasPermission'
|
|
|
|
export default {
|
|
name: 'ProcessCenter',
|
|
data () {
|
|
return {
|
|
comp: null,
|
|
activeTab: '',
|
|
tabList: [
|
|
{ // 待办流程
|
|
component: 'TodoList',
|
|
label: this.$t('workCenter.processCenter.todoProcess'),
|
|
permission: 'workCenter:processCenter:todo'
|
|
},
|
|
{ // 已办流程
|
|
component: 'DoneList',
|
|
label: this.$t('workCenter.processCenter.doneProcess'),
|
|
permission: 'workCenter:processCenter:done'
|
|
},
|
|
{ // 已发流程
|
|
component: 'SentList',
|
|
label: this.$t('workCenter.processCenter.sentProcess'),
|
|
permission: 'workCenter:processCenter:sent'
|
|
},
|
|
{ // 监控流程
|
|
component: 'MonitorList',
|
|
label: this.$t('workCenter.processCenter.monitorProcess'),
|
|
permission: 'workCenter:processCenter:monitor'
|
|
},
|
|
{ // 草稿
|
|
component: 'DraftList',
|
|
label: this.$t('workCenter.processCenter.draft'),
|
|
permission: 'workCenter:processCenter:draft'
|
|
}
|
|
]
|
|
}
|
|
},
|
|
watch: {
|
|
activeTab () {
|
|
this.comp = resolve => require([`@views/workCenter/processCenter/table/${this.activeTab}.vue`], resolve)
|
|
}
|
|
},
|
|
created () {
|
|
// 获取有权限的第一个tab
|
|
this.activeTab = (this.tabList.find(item => isHasPermission(item.permission)) || {}).component
|
|
this.comp = resolve => require([`@views/workCenter/processCenter/table/${this.activeTab}.vue`], resolve)
|
|
},
|
|
mounted () {
|
|
window.reloadData = () => {
|
|
if (this.$refs.compModel && this.$refs.compModel.loadData) {
|
|
this.$refs.compModel.loadData()
|
|
}
|
|
}
|
|
},
|
|
methods: {
|
|
isHasPermission
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style scoped lang="less">
|
|
@import '~@assets/less/common.less';
|
|
</style>
|