ExportForm.vue
3.8 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
137
138
139
<template>
<el-dialog title="导出数据" :close-on-click-modal="false" :visible.sync="visible"
class="NCC-dialog NCC-dialog_center NCC-dialog-export" lock-scroll width="600px">
<el-form label-position="top">
<el-form-item>
<el-radio-group v-model="type">
<el-radio :label="0">当前页面数据</el-radio>
<el-radio :label="1">全部页面数据</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item class="export-line">
<p slot="label" class="export-label">列表数据<span>请选择导出字段</span></p>
<el-checkbox :indeterminate="isIndeterminate" v-model="checkAll"
@change="handleCheckAllChange">全选</el-checkbox>
<el-checkbox-group v-model="columns" @change="handleCheckedChange">
<el-checkbox v-for="item in columnList" :label="item.prop" :key="item.prop"
class="column-item">
{{item.label}}
</el-checkbox>
</el-checkbox-group>
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<p class="footer-tip">提示:系统将导出列表中选中的数据</p>
<el-button @click="visible=false">{{$t('common.cancelButton')}}</el-button>
<el-button type="primary" @click="downLoad" :loading="btnLoading">导 出</el-button>
</span>
</el-dialog>
</template>
<script>
import { ExportExcel } from '@/api/extend/employee'
export default {
data() {
return {
visible: false,
btnLoading: false,
type: 0,
columns: [],
columnList: [
{
label: "工号",
prop: "enCode"
},
{
label: "姓名",
prop: "fullName"
},
{
label: "性别",
prop: "gender"
},
{
label: "部门",
prop: "departmentName"
},
{
label: "岗位",
prop: "positionName"
},
{
label: "用工性质",
prop: "workingNature"
},
{
label: "身份证号",
prop: "idNumber"
},
{
label: "联系电话",
prop: "telephone"
},
{
label: "出生年月",
prop: "birthday"
},
{
label: "参加工作",
prop: "attendWorkTime"
},
{
label: "最高学历",
prop: "education"
},
{
label: "所学专业",
prop: "major"
},
{
label: "毕业院校",
prop: "graduationAcademy"
},
{
label: "毕业时间",
prop: "graduationTime"
},
{
label: "创建时间",
prop: "creatorTime"
},
],
listQuery: {},
checkAll: true,
isIndeterminate: false
}
},
methods: {
init(listQuery) {
this.visible = true
this.btnLoading = false
this.listQuery = listQuery
this.columns = this.columnList.map(o => o.prop)
},
handleCheckAllChange(val) {
this.columns = val ? this.columnList.map(o => o.prop) : [];
this.isIndeterminate = false;
},
handleCheckedChange(value) {
let checkedCount = value.length;
this.checkAll = checkedCount === this.columnList.length;
this.isIndeterminate = checkedCount > 0 && checkedCount < this.columnList.length;
},
downLoad() {
this.btnLoading = true
let query = {
...this.listQuery,
dataType: this.type,
selectKey: this.columns.join(',')
}
ExportExcel(query).then(res => {
this.btnLoading = false
if (!res.data.url) return
window.location.href = this.define.comUrl + res.data.url
this.visible = false
}).catch(() => { this.btnLoading = false })
}
}
}
</script>