detailItem.vue
4.54 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
<template>
<el-dialog title="详情" :visible.sync="open" append-to-body width="80%" :before-close="handleClose">
<el-tabs v-model="activeTab">
<el-tab-pane label="基本信息" name="basic">
<el-card class="box-card" v-if="activeTab === 'basic'">
<div slot="header" class="clearfix">
<span>基本信息</span>
</div>
<basic-info :person="row" :personId="row.id" v-if="isOpenShow" />
</el-card>
<el-card class="box-card" v-if="activeTab === 'basic'">
<div slot="header" class="clearfix">
<span>办公室信息</span>
</div>
<office-info :personId="row.id" v-if="isOpenShow" />
</el-card>
</el-tab-pane>
<el-tab-pane label="合同信息" name="contract">
<el-card class="box-card" v-if="activeTab === 'contract'">
<div slot="header" class="clearfix">
<span>公司信息</span>
</div>
<company-info :personId="row.id" v-if="isOpenShow" />
</el-card>
<el-card class="box-card" v-if="activeTab === 'contract'">
<div slot="header" class="clearfix">
<span>合同信息</span>
</div>
<contract-info :personId="row.id" v-if="isOpenShow" />
</el-card>
</el-tab-pane>
<el-tab-pane label="使用设备" name="terminal">
<el-card class="box-card" v-if="activeTab === 'terminal'">
<div slot="header" class="clearfix">
<span>终端信息</span>
</div>
<terminal-info :personId="row.id" v-if="isOpenShow" />
</el-card>
<el-card class="box-card" v-if="activeTab === 'terminal'">
<div slot="header" class="clearfix">
<span>堡垒机信息</span>
</div>
<fortress-info :personId="row.id" v-if="isOpenShow" />
</el-card>
</el-tab-pane>
<el-tab-pane label="背景调查" name="family">
<el-card class="box-card" v-if="activeTab === 'family'">
<div slot="header" class="clearfix">
<span>工作经历</span>
</div>
<work-info :personId="row.id" v-if="isOpenShow" />
</el-card>
<el-card class="box-card" v-if="activeTab === 'family'">
<div slot="header" class="clearfix">
<span>家庭信息</span>
</div>
<family-info :personId="row.id" v-if="isOpenShow" />
</el-card>
</el-tab-pane>
<el-tab-pane label="资质信息" name="qualif">
<qualif-info :personId="row.id" v-if="activeTab === 'qualif' && isOpenShow" />
</el-tab-pane>
</el-tabs>
</el-dialog>
</template>
<script>
import BasicInfo from "./profile/BasicInfo";
import CompanyInfo from "./profile/CompanyInfo";
import TerminalInfo from "./profile/TerminalInfo";
import FortressInfo from "./profile/FortressInfo";
import OfficeInfo from "./profile/OfficeInfo";
import FamilyInfo from "./profile/FamilyInfo";
import WorkInfo from "./profile/WorkInfo";
import ContractInfo from "./profile/ContractInfo";
import QualifInfo from "./profile/QualifInfo";
export default {
props: {
open: {
type: Boolean
},
activeTab: {
type: String
},
form: {
type: Object
}
},
computed: {
showWatcher: function () {
return this.open;
}
},
watch: {
showWatcher: function (newVal, oldVal) {
if (newVal == true) {
this.isOpenShow = true;
this.row = this.$props.form;
}
},
},
components: {
BasicInfo,
CompanyInfo,
TerminalInfo,
FortressInfo,
OfficeInfo,
FamilyInfo,
WorkInfo,
ContractInfo,
QualifInfo
},
data() {
return {
row: {},
isOpenShow: false,
}
},
created() { },
methods: {
handleClose() {
this.isOpenShow = false;
this.$emit('isOpen', false)
},
},
}
</script>