185 lines
7.8 KiB
Vue
185 lines
7.8 KiB
Vue
<template>
|
|
<div>
|
|
<el-dialog :visible="true" width="1300px" class="dialog-case-record" :close-on-click-modal="false"
|
|
@close="handleClose()">
|
|
|
|
<div class="dialog-content dialog-case-trace">
|
|
<el-tabs class="zd-el-tabs-custom zd-el-tabs-custom__left_padding" v-model="activeName" @tab-click="handleTabClick">
|
|
<el-tab-pane name="1">
|
|
<span slot="label"><span>短信发送记录</span></span>
|
|
</el-tab-pane>
|
|
<el-tab-pane name="2">
|
|
<span slot="label"><span>电话呼叫记录</span></span>
|
|
</el-tab-pane>
|
|
<el-tab-pane name="3">
|
|
<span slot="label"><span>视频调解记录</span></span>
|
|
</el-tab-pane>
|
|
<el-tab-pane name="4">
|
|
<span slot="label"><span>文书生成记录</span></span>
|
|
</el-tab-pane>
|
|
<el-tab-pane name="5">
|
|
<span slot="label"><span>文书签字记录</span></span>
|
|
</el-tab-pane>
|
|
<el-tab-pane name="6">
|
|
<span slot="label"><span>文书送达记录</span></span>
|
|
</el-tab-pane>
|
|
<el-tab-pane name="7">
|
|
<span slot="label"><span>还款计划</span></span>
|
|
</el-tab-pane>
|
|
<el-tab-pane name="8">
|
|
<span slot="label"><span>还款凭证</span></span>
|
|
</el-tab-pane>
|
|
</el-tabs>
|
|
|
|
<div class=" case-trace-cont">
|
|
<!-- 短信发送追踪明细 -->
|
|
<smsDialogDetail v-if="activeName == '1'" :DialogDetail="eventTraDialog" />
|
|
<!-- 呼叫记录 -->
|
|
<CalllogDialog v-if="activeName == '2'" :eventTraDialog.sync="eventTraDialog" />
|
|
<!-- 视频调解追踪 -->
|
|
<voideDialog v-if="activeName == '3'" :eventTraDialog="eventTraDialog" />
|
|
<!-- 文书生成追踪明细 -->
|
|
<officeDialogDetail v-if="activeName == '4'" :DialogDetail="eventTraDialog" />
|
|
<!-- 文书签字追踪明细 -->
|
|
<!-- <officeWDialogDetail v-if="activeName == '5'" :DialogDetail="eventTraDialog" /> -->
|
|
<!-- 文书签字追踪 -->
|
|
<officeWriteDialog v-if="activeName == '5'" :eventTraDialog="eventTraDialog" />
|
|
|
|
<!-- 文书送达追踪明细 -->
|
|
<!-- <officeDeliveryDialogDetail v-if="activeName == '6'" :DialogDetail="eventTraDialog" /> -->
|
|
<officeDeliveryDialog v-if="activeName == '6'" :eventTraDialog="eventTraDialog" />
|
|
|
|
<!-- 还款计划 -->
|
|
<!-- <RepaymentDialog v-if="activeName == '7'" :eventTraDialog.sync="repaymentDialog" /> -->
|
|
<!-- eventDialog:{caseId:this.$route.query.caseId}, -->
|
|
<RepaymentSchedule v-if="activeName == '7'" :eventDialog.sync="eventTraDialog" class="mt-16" />
|
|
|
|
<!-- 还款凭证 -->
|
|
<RepaymentRecordDialog v-if="activeName == '8'" :eventTraDialog.sync="eventTraDialog" />
|
|
</div>
|
|
</div>
|
|
<span slot="footer" class="dialog-footer">
|
|
<el-button @click="handleClose()">关闭</el-button>
|
|
</span>
|
|
</el-dialog>
|
|
</div>
|
|
</template>
|
|
<script>
|
|
import api from "@/services/caseManagement";
|
|
export default {
|
|
components: {
|
|
// eventTracingDialog: () => import('../../event-tracing/index.vue'),//事项追踪
|
|
RepaymentSchedule: () => import('../../mediation-page/components/RepaymentSchedule.vue'),//还款计划
|
|
RepaymentRecordDialog: () => import('./RepaymentRecordDialog.vue'),//还款凭证
|
|
|
|
|
|
smsDialogDetail: () => import('../../event-tracing/dtraceDetail/smsDialogDetail.vue'),//短信发送追踪明细
|
|
CalllogDialog: () => import('./CalllogDialog.vue'),//呼叫记录
|
|
|
|
voideDialog: () => import('../../event-tracing/components/voideDialog.vue'),//视频调解追踪
|
|
officeDeliveryDialog: () => import('../../event-tracing/components/officeDeliveryDialog.vue'),//文书送达追踪明细
|
|
officeDeliveryDialogDetail: () => import('../../event-tracing/dtraceDetail/officeDeliveryDialogDetail.vue'),//文书送达追踪明细
|
|
|
|
officeDialogDetail: () => import('../../event-tracing/dtraceDetail/officeDialogDetail.vue'),//文书生成追踪明细
|
|
officeWDialogDetail: () => import('../../event-tracing/dtraceDetail/officeWDialogDetail.vue'),//文书签字追踪明细
|
|
officeWriteDialog: () => import('../../event-tracing/components/officeWriteDialog.vue'),//文书签字追踪
|
|
|
|
},
|
|
props: {
|
|
eventTraDialog: {
|
|
type: Object,
|
|
default: () => {
|
|
return {}
|
|
},
|
|
},
|
|
},
|
|
data() {
|
|
return {
|
|
calllogDialog:null,//呼叫记录
|
|
activeName:'1',
|
|
queryParam:{},
|
|
tableData:[],
|
|
total:0,
|
|
|
|
};
|
|
},
|
|
mounted () {
|
|
this.activeName = this.eventTraDialog.activeName
|
|
},
|
|
methods: {
|
|
// tab切换
|
|
handleTabClick(tab){
|
|
// if(tab.name == '1'){
|
|
// eventTraDialog = {caseNo:'123'}
|
|
// }else if(tab.name == '2'){
|
|
// calllogDialog = {title:'电话呼叫记录',caseNo:'123'}
|
|
// }else if(tab.name == '3'){
|
|
// eventTraDialog = {title:'视频调解记录',caseNo:'123'}
|
|
// }else if(tab.name == '4'){
|
|
// eventTraDialog = {title:'文书生成记录',caseNo:'123'}
|
|
// }else if(tab.name == '5'){
|
|
// eventTraDialog = {title:'文书签字记录',caseNo:'123'}
|
|
// }else if(tab.name == '6'){
|
|
// eventTraDialog = {title:'文书送达记录',caseNo:'123'}
|
|
// }else if(tab.name == '7'){
|
|
// repaymentDialog = {title:'还款计划',caseNo:'123'}
|
|
// }else if(tab.name == '8'){
|
|
// eventTraDialog = {title:'还款凭证',caseNo:'123'}
|
|
// }else {
|
|
|
|
// }
|
|
},
|
|
handleClose() {
|
|
this.$emit('update:eventTraDialog', null)
|
|
this.$emit('RefreshClickList', null)
|
|
},
|
|
}
|
|
};
|
|
</script>
|
|
<style scoped lang="scss">
|
|
.dialog-case-record{
|
|
.el-dialog .el-dialog__header{background-color: #5d7eeac7;}
|
|
.el-dialog__header{background-color: #5d7eeac7;}
|
|
}
|
|
.dialog-case-trace{
|
|
padding: 16px 20px;
|
|
min-height:500px
|
|
}
|
|
.dialog-case-trace .zd-el-tabs-custom{
|
|
margin-top: -61px ;
|
|
margin-right: 25px;
|
|
}
|
|
.dialog-case-trace .zd-el-tabs-custom span{
|
|
font-size: 16px;
|
|
font-weight: 400;
|
|
|
|
}
|
|
.dialog-case-trace .case-trace-cont
|
|
{
|
|
min-height: 500px;
|
|
}
|
|
</style>
|
|
<style lang="scss">
|
|
.dialog-case-record{
|
|
.el-dialog .el-dialog__header {
|
|
background-color: #5d7eeac7;
|
|
height: 43px !important;
|
|
line-height: 50px !important;
|
|
}
|
|
.el-tabs__item{color: #FFFFFFB2;}
|
|
.zd-el-tabs-custom .el-tabs__item.is-active {
|
|
color: #fff !important;
|
|
}
|
|
.zd-el-tabs-custom .el-tabs__active-bar{
|
|
background-color: #fff !important;
|
|
}
|
|
.el-tabs__nav-wrap::after {
|
|
background-color: #fff;
|
|
}
|
|
.el-dialog__headerbtn .el-dialog__close{
|
|
color: #fff !important;
|
|
}
|
|
}
|
|
|
|
</style>
|