<template>
|
<el-dialog
|
:visible.sync="showDialog"
|
:title="'导出'+crmTypeName"
|
:append-to-body="true"
|
:close-on-click-modal="false"
|
:before-close="beforeClose"
|
:close-on-press-escape="false"
|
width="550px"
|
@close="closeView"
|
>
|
<div class="dialog-body">
|
<p
|
v-if="error"
|
class="error"
|
v-text="error" />
|
<p
|
v-if="done"
|
class="done">
|
<i class="el-icon-success"/>
|
导出已完成
|
</p>
|
<p
|
v-else-if="cancel"
|
class="cancel">
|
<i class="el-icon-warning"/>
|
导出已取消
|
</p>
|
<div v-else>
|
<i class="el-icon-loading" />
|
导出中...
|
{{ progress }}
|
</div>
|
</div>
|
<span slot="footer" class="dialog-footer" />
|
</el-dialog>
|
</template>
|
|
<script>
|
import { mapGetters } from 'vuex'
|
import {
|
OutputCustomerToExcel,
|
OutputContacterToExcel,
|
OutputSalesChanceToExcel,
|
OutputOtherSalesChanceToExcel,
|
ExportSubscriptionsExcel
|
} from '@/api/common'
|
|
export default {
|
name: 'CRMExport', // 文件导出
|
components: {},
|
|
props: {
|
show: {
|
type: Boolean,
|
default: false
|
},
|
// CRM类型
|
crmType: {
|
type: String,
|
default: ''
|
},
|
/** 是公海 */
|
isSeas: {
|
type: Boolean,
|
default: false
|
},
|
// 搜索条件
|
search: {
|
type: String,
|
default: ''
|
},
|
// 场景
|
scene_id: {
|
type: [Number, String],
|
default: ''
|
},
|
// 高级搜索
|
filterObj: {
|
type: Object,
|
default: () => {
|
return {}
|
}
|
},
|
// 顶部搜索
|
headObj: {
|
type: Object,
|
default: () => {
|
return {}
|
}
|
},
|
exportParams: {
|
type: Object,
|
default: () => {
|
return {}
|
}
|
}
|
},
|
data () {
|
return {
|
showDialog: false,
|
progress: '',
|
error: '',
|
// 导出已完成
|
done: false,
|
// 取消导出
|
cancel: false,
|
// 队列标识
|
exportQueueIndex: '',
|
// 临时数据
|
tempData: {
|
temp_file: ''
|
},
|
// 排序
|
sortData: {}
|
}
|
},
|
computed: {
|
...mapGetters(['userInfo']),
|
crmTypeName () {
|
return (
|
{
|
customer: '客户',
|
leads: '线索',
|
contacts: '联系人',
|
product: '产品'
|
}[this.crmType] || ''
|
)
|
}
|
},
|
watch: {
|
show (val) {
|
console.log(val)
|
this.showDialog = val
|
if (val) {
|
this.cancel = false
|
this.exportInfos()
|
// window.onbeforeunload = (event) => {
|
// this.exportInfos({
|
// page: -1,
|
// temp_file: this.tempData.temp_file
|
// })
|
// return event
|
// }
|
} else {
|
window.onbeforeunload = null
|
}
|
}
|
},
|
mounted () {
|
this.$bus.off('getSortData')
|
this.$bus.on('getSortData', (sortData) => {
|
this.sortData = sortData
|
})
|
},
|
methods: {
|
// 关闭操作
|
closeView () {
|
this.error = ''
|
this.done = false
|
this.exportQueueIndex = ''
|
this.progress = ''
|
this.$emit('close')
|
this.$emit('queryList')
|
},
|
// 点叉
|
beforeClose (done) {
|
if (this.error || this.done) {
|
done()
|
return
|
}
|
this.$confirm('此操作将终止导出, 是否继续?', '提示', {
|
confirmButtonText: '确定',
|
cancelButtonText: '取消',
|
type: 'warning'
|
})
|
.then(() => {
|
this.cancel = true
|
done()
|
})
|
.catch(() => {
|
})
|
},
|
// 导出操作
|
exportInfos (data = {}) {
|
console.log(this.headObj)
|
let params
|
if (this.crmType === 'customer') {
|
params = {
|
'PageIndex': 1,
|
'PageSize': 999,
|
'SelectOwnedType': this.headObj && this.headObj.list ? this.headObj.list.customer : 0,
|
'BrachUserId': this.headObj && this.headObj.list ? this.headObj.list.BrachUserId : '',
|
'Name': this.headObj && this.headObj.list ? this.headObj.list.user : '',
|
'CreateStartTime': '',
|
'CreateEndTime': '',
|
'StartFollowTime': '',
|
'EndFolowTime': ''
|
}
|
} else if (this.crmType === 'contacts') {
|
params = {
|
'PageIndex': 1,
|
'PageSize': 999,
|
'SelectOwnedType': this.headObj && this.headObj.list ? this.headObj.list.customer : 0,
|
'BrachUserId': this.headObj && this.headObj.list ? this.headObj.list.BrachUserId : '',
|
'Name': this.headObj && this.headObj.list ? this.headObj.list.user : ''
|
}
|
} else if (this.crmType === 'business') {
|
params = {
|
'PageIndex': 1,
|
'PageSize': 999,
|
'SalesChanceStage': this.headObj && this.headObj.list ? this.headObj.list.businessType : '',
|
'SelectOwnedType': this.headObj && this.headObj.list ? this.headObj.list.customer : 0,
|
'BrachUserId': this.headObj && this.headObj.list ? this.headObj.list.BrachUserId : '',
|
'Name': this.headObj && this.headObj.list ? this.headObj.list.user : '',
|
'SalesChanceType': this.headObj && this.headObj.list ? this.headObj.list.businessType : '',
|
'ProvinceCode': this.headObj && this.headObj.list ? this.headObj.list.area : ''
|
}
|
} else if (this.crmType === 'businessChances') {
|
params = {
|
'PageIndex': 1,
|
'PageSize': 999,
|
'SalesChanceStage': this.headObj && this.headObj.list ? this.headObj.list.businessType : '',
|
'SelectOwnedType': this.headObj && this.headObj.list ? this.headObj.list.customer : 0,
|
'BrachUserId': this.headObj && this.headObj.list ? this.headObj.list.BrachUserId : '',
|
'Name': this.headObj && this.headObj.list ? this.headObj.list.user : '',
|
'SalesChanceType': this.headObj && this.headObj.list ? this.headObj.list.businessType : '',
|
'ProvinceCode': this.headObj && this.headObj.list ? this.headObj.list.area : '',
|
'CreateStartTime': '',
|
'CreateEndTime': '',
|
'ProjectProperty': '',
|
'UploadStatusName': '',
|
'ReportStatusName': ''
|
}
|
} else if (this.crmType === 'subscriptions') {
|
params = {
|
...this.headObj
|
}
|
}
|
let month = new Date().getMonth() + 1
|
let timer = new Date().getFullYear() + '-' + month + '-' + new Date().getDate()
|
let request
|
request = {
|
customer: OutputCustomerToExcel,
|
contacts: OutputContacterToExcel,
|
business: OutputSalesChanceToExcel,
|
businessChances: OutputOtherSalesChanceToExcel,
|
subscriptions: ExportSubscriptionsExcel
|
}[this.crmType]
|
console.log(request)
|
request(params)
|
.then(res => {
|
if (this.crmType === 'subscriptions') {
|
if (res.data.type === 'application/json') {
|
// this.show = false
|
this.closeView()
|
let reader = new FileReader()
|
reader.readAsText(res.data, 'utf-8')
|
reader.onload = (e) => {
|
let resData = JSON.parse(reader.result)
|
this.$message.error(resData.Message)
|
}
|
return
|
}
|
}
|
this.exportQueueIndex = ''
|
this.done = true
|
var blob
|
if (res.data === 'subscriptions') {
|
blob = new Blob([res.data], {
|
type: 'application/octet-stream;charset=utf-8'
|
})
|
} else {
|
blob = new Blob([res.data], {
|
type: 'application/vnd.ms-excel;charset=utf-8'
|
})
|
}
|
// var blob = new Blob([res.data], {
|
// type: 'application/json'
|
// })
|
var downloadElement = document.createElement('a')
|
var href = window.URL.createObjectURL(blob) // 创建下载的链接
|
downloadElement.href = href
|
// downloadElement.download =
|
// decodeURI(
|
// res.headers['content-disposition'].split('filename=')[1]
|
// ) || '' // 下载后文件名
|
if (this.crmType === 'customer') {
|
downloadElement.download = `客户列表` + timer + `.xlsx`
|
} else if (this.crmType === 'business') {
|
downloadElement.download = `商机列表` + timer + `.xlsx`
|
} else if (this.crmType === 'contacts') {
|
downloadElement.download = `客户联系人列表` + timer + `.xlsx`
|
} else if (this.crmType === 'subscriptions') {
|
downloadElement.download = `订阅列表` + timer + `.xlsx`
|
} else {
|
downloadElement.download = `列表` + timer + `.xlsx`
|
}
|
document.body.appendChild(downloadElement)
|
downloadElement.click() // 点击下载
|
document.body.removeChild(downloadElement) // 下载完成移除元素
|
window.URL.revokeObjectURL(href) // 释放掉blob对象
|
// }
|
})
|
.catch(() => {
|
})
|
}
|
}
|
}
|
</script>
|
|
<style scoped lang="less">
|
|
.dialog-body {
|
height: 150px;
|
text-align: center;
|
padding-top: 40px;
|
color: #659DED;
|
.el-icon-loading {
|
margin-bottom: 10px;
|
display: block;
|
}
|
p.error {
|
color: #E6A23C;
|
}
|
p.done {
|
color: #67C23A;
|
.el-icon-success {
|
font-size: 30px;
|
display: block;
|
}
|
}
|
}
|
|
.cancel {
|
color: #E6A23C;
|
.el-icon-warning {
|
font-size: 30px;
|
display: block;
|
}
|
}
|
|
.el-dialog__wrapper {
|
/deep/ .el-icon-loading {
|
font-size: 30px;
|
}
|
|
/deep/ .el-loading-text {
|
font-size: 18px;
|
margin-top: 10px;
|
}
|
}
|
</style>
|
