index.vue
3.9 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
<template>
<el-tabs v-model="activeName" type="card" @tab-remove="removeTab">
<el-tab-pane label="待办箱" name="dbx"><dbxInfo></dbxInfo></el-tab-pane>
<!-- <el-tab-pane-->
<!-- v-for="(item, index) in editableTabs"-->
<!-- :key="item.name"-->
<!-- :label="item.title"-->
<!-- :name="item.name"-->
<!-- >-->
<!-- {{item.content}}-->
<!-- </el-tab-pane>-->
</el-tabs>
</template>
<script>
import dbxInfo from "@/views/dbx/dbxinfo/index"
export default {
name: "",
inject:['getRightTree','getTreeByBsm'],
components: {dbxInfo},
props: {},
data() {
return {
activeName:'dbx',
type:'all',
total: 0,
pageNo: 1,
pageSize: 15,
tableData: [],
tableHeight: 0,
queryData: {},
editableTabs: [
// {
// title: 'Tab 1',
// name: '1',
// content: 'Tab 1 content'
// }
],
};
},
created() {
},
mounted() {
this.queryData.pageSize=this.pageSize;
this.queryData.pageNo=this.pageNo;
},
methods: {
changeActiveName(data){
this.activeName = data;
},
removeTab(targetName) {
let tabs = this.editableTabs;
let activeName = this.activeName;
if (activeName === targetName) {
tabs.forEach((tab, index) => {
if (tab.name === targetName) {
let nextTab = tabs[index + 1] || tabs[index - 1];
if (nextTab) {
activeName = nextTab.name;
}
}
});
}
this.activeName = activeName;
this.editableTabs = tabs.filter(tab => tab.name !== targetName);
},
},
computed: {},
watch: {},
};
</script>
<style scoped lang="less">
.el-tabs{
height: calc(100% - 50px);
/deep/.el-tabs__content{
height: 100%;
/deep/.el-tab-pane{
height: 100%;
}
//background: #F4F9FF;
background-color: #F4F9FF;
padding: 0;
}
/deep/ .el-tabs__item {
height: 48px;
}
/deep/ .el-tabs__header{
background-color: #ffffff;
margin: 0;
border-top: 1px solid #E4E7ED;
}
.main {
width: 100%;
height: 100%;
box-sizing: border-box;
padding: 0 18px 0 0;
display: flex;
flex-direction: column;
//background-color: #F4F9FF;
background-color: #F4F9FF;
.tips{
color: #9B9B9B;
margin-left: 2px;
margin-bottom: 10px;
}
.demo-form-inline {
margin-top: 18px;
.moreSearchBtn {
background-color: #1ad6e1;
border-color: #1ad6e1;
}
.moreSearchBtn:focus,
.moreSearchBtn:hover {
background-color: rgba(28, 200, 229, 0.6);
}
}
.dataGrid {
flex: 1;
.pagination {
padding: 18px 0;
}
}
.hbjDialog{
/deep/ .el-dialog{
margin-top: 10vh!important;
}
}
.btnGroup{
margin: 20px auto 0;
width: 230px;
}
}
}
</style>