|
|
@@ -0,0 +1,189 @@
|
|
|
+<template>
|
|
|
+ <div>
|
|
|
+ <dataTemPlate >
|
|
|
+ <template slot="content">
|
|
|
+ <el-tabs v-model="activeName" @tab-click="handleClick">
|
|
|
+ <el-tab-pane :label="$t(`联系人关联客户销售TOP10`)" name="关联客户">
|
|
|
+ <depStatus class="inline-16" ref="depStatusCusRef" @depData="listData" @personData="listData" @leaveData="listData"></depStatus>
|
|
|
+ <btnSelect ref="btnSelectCusRef" @btnClick="btnClick" class="inline-16" :btnTitle="['本年','本季','本月']" dateType="本年"></btnSelect>
|
|
|
+ <allRank @allClick="allClick" ref="allRankCusRef" class="inline-16" btnTitle="全部排名" allTitle="联系人关联客户销售贡献度排行" :tablecols="tool.tabelCol(this.$route.name).associatedCustomers.tablecols"></allRank>
|
|
|
+ <tableDetail :layout="tablecols" :data="list" :opwidth="200" :custom="true" >
|
|
|
+ <template v-slot:customcol="scope">
|
|
|
+ <div v-if="scope.column.columnname === 'amount'">
|
|
|
+ {{tool.formatAmount(scope.column.data[scope.column.columnname],2,'¥')}}
|
|
|
+ </div>
|
|
|
+ <div v-else>{{scope.column.data[scope.column.columnname]||scope.column.columnname ==='operation'?scope.column.data[scope.column.columnname] : '--'}}</div>
|
|
|
+ </template>
|
|
|
+ </tableDetail>
|
|
|
+ </el-tab-pane>
|
|
|
+ <el-tab-pane :label="$t(`联系人关联项目销售TOP10`)" name="关联项目">
|
|
|
+ <depStatus @btnClick="handleClick" class="inline-16" ref="depStatusProRef" @depData="listData" @personData="listData" @leaveData="listData"></depStatus>
|
|
|
+ <btnSelect ref="btnSelectProRef" @btnClick="btnClick" class="inline-16" :btnTitle="['本年','本季','本月']" dateType="本年"></btnSelect>
|
|
|
+ <allRank @allClick="allClick" ref="allRankProRef" class="inline-16" btnTitle="全部排名" allTitle="联系人关联项目销售贡献度排行" :tablecols="tool.tabelCol(this.$route.name).associatedProject.tablecols"></allRank>
|
|
|
+ <tableDetail :layout="tablecols" :data="list" :opwidth="200" :custom="true">
|
|
|
+ <template v-slot:customcol="scope">
|
|
|
+ <div v-if="scope.column.columnname === 'amount'">
|
|
|
+ {{tool.formatAmount(scope.column.data[scope.column.columnname],2,'¥')}}
|
|
|
+ </div>
|
|
|
+ <div v-else>{{scope.column.data[scope.column.columnname]||scope.column.columnname ==='operation'?scope.column.data[scope.column.columnname] : '--'}}</div>
|
|
|
+ </template>
|
|
|
+ </tableDetail>
|
|
|
+ </el-tab-pane>
|
|
|
+ </el-tabs>
|
|
|
+ </template>
|
|
|
+ </dataTemPlate>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+import dataTemPlate from '@/components/dataTemplate/index'
|
|
|
+import depStatus from './depStatus'
|
|
|
+import btnSelect from "./btnSelectInfo"
|
|
|
+import allRank from './allRank'
|
|
|
+export default {
|
|
|
+ name: "salesContribution",
|
|
|
+ components:{dataTemPlate,depStatus,btnSelect,allRank},
|
|
|
+ data(){
|
|
|
+ return {
|
|
|
+ activeName: '关联客户',
|
|
|
+ /*获取关联客户数据*/
|
|
|
+ paramCus:{
|
|
|
+ "id": 2025072410065502,
|
|
|
+ "content": {
|
|
|
+ "type": 1,
|
|
|
+ "dataid": 54,
|
|
|
+ "dateType": "本年",
|
|
|
+ "where": {
|
|
|
+ "begdate": "",
|
|
|
+ "enddate": "",
|
|
|
+ "condition": "",
|
|
|
+ "isleave": ""
|
|
|
+ },
|
|
|
+ "pageSize": 10,
|
|
|
+ "pageNumber": 1
|
|
|
+ },
|
|
|
+ },
|
|
|
+ /*获取关联项目数据*/
|
|
|
+ paramPro:{
|
|
|
+ "id": 2025072410070302,
|
|
|
+ "content": {
|
|
|
+ "type": 1,
|
|
|
+ "dataid": 54,
|
|
|
+ "dateType": "本年",
|
|
|
+ "where": {
|
|
|
+ "begdate": "",
|
|
|
+ "enddate": "",
|
|
|
+ "condition": "",
|
|
|
+ "isleave": ""
|
|
|
+ },
|
|
|
+ "pageSize": 10,
|
|
|
+ "pageNumber": 1
|
|
|
+ },
|
|
|
+ },
|
|
|
+ list:[],
|
|
|
+ tablecols:[],
|
|
|
+ currentPage:0,
|
|
|
+ total:0,
|
|
|
+ drawerShow:false,
|
|
|
+ allTitle:'关联客户'
|
|
|
+ }
|
|
|
+ },
|
|
|
+ methods:{
|
|
|
+ queryList(id,type,isleave,state){
|
|
|
+ if (this.activeName == '关联客户') {
|
|
|
+ this.paramCus.content.pageNumber = 1
|
|
|
+ }else if (this.activeName == '关联项目'){
|
|
|
+ this.paramPro.content.pageNumber = 1
|
|
|
+ }
|
|
|
+ this.listData(id,type,isleave,state)
|
|
|
+ },
|
|
|
+ async listData(id,type,isleave,state){
|
|
|
+ console.log(this.paramCus,'paramCus')
|
|
|
+ if (this.activeName == '关联客户') {
|
|
|
+ this.paramCus.content.pageNumber = 1
|
|
|
+ this.paramCus.content.pageSize = 10
|
|
|
+ this.paramCus.content.dataid = id
|
|
|
+ this.paramCus.content.type = type
|
|
|
+ this.paramCus.content.where.isleave = isleave
|
|
|
+ }else if (this.activeName == '关联项目'){
|
|
|
+ this.paramPro.content.pageNumber = 1
|
|
|
+ this.paramPro.content.pageSize = 10
|
|
|
+ this.paramPro.content.dataid = id
|
|
|
+ this.paramPro.content.type = type
|
|
|
+ this.paramPro.content.where.isleave = isleave
|
|
|
+ }
|
|
|
+ const res = await this.$api.requested(this.activeName == '关联客户'?this.paramCus:this.paramPro)
|
|
|
+ this.list = res.data
|
|
|
+ this.total = res.total
|
|
|
+ this.currentPage = res.pageNumber
|
|
|
+ },
|
|
|
+ handleClick(tab, event) {
|
|
|
+ if (this.activeName == '关联客户'){
|
|
|
+ this.tablecols = this.tool.tabelCol(this.$route.name).associatedCustomers.tablecols
|
|
|
+ this.listData(this.paramCus.content.dataid,this.paramCus.content.type,this.paramCus.content.where.isleave)
|
|
|
+ }else {
|
|
|
+ this.tablecols = this.tool.tabelCol(this.$route.name).associatedProject.tablecols
|
|
|
+ this.listData(this.paramPro.content.dataid,this.paramPro.content.type,this.paramPro.content.where.isleave)
|
|
|
+ }
|
|
|
+ },
|
|
|
+ btnClick(dateType,dateData){
|
|
|
+ if (this.activeName == '关联客户'){
|
|
|
+ if (dateType){
|
|
|
+ this.paramCus.content.dateType = dateType
|
|
|
+ }else {
|
|
|
+ this.paramCus.content.dateType = ''
|
|
|
+ this.paramCus.content.where.begdate = dateData[0]
|
|
|
+ this.paramCus.content.where.enddate = dateData[1]
|
|
|
+ }
|
|
|
+ this.listData(this.paramCus.content.dataid,this.paramCus.content.type,this.paramCus.content.where.isleave)
|
|
|
+ }else {
|
|
|
+ if (dateType){
|
|
|
+ this.paramPro.content.dateType = dateType
|
|
|
+ }else {
|
|
|
+ this.paramPro.content.dateType = ''
|
|
|
+ this.paramPro.content.where.begdate = dateData[0]
|
|
|
+ this.paramPro.content.where.enddate = dateData[1]
|
|
|
+ }
|
|
|
+ this.listData(this.paramPro.content.dataid,this.paramPro.content.type,this.paramPro.content.where.isleave)
|
|
|
+ }
|
|
|
+ },
|
|
|
+ allClick(){
|
|
|
+ if (this.activeName == '关联客户'){
|
|
|
+ this.$refs.allRankCusRef.drawerShow = true
|
|
|
+ this.$nextTick(()=>{
|
|
|
+ this.$refs.allRankCusRef.$refs.depStatusRef.deplist = this.$refs.depStatusCusRef.deplist
|
|
|
+ this.$refs.allRankCusRef.$refs.depStatusRef.personnelList = this.$refs.depStatusCusRef.personnelList
|
|
|
+ this.$refs.allRankCusRef.$refs.depStatusRef.depment = this.$refs.depStatusCusRef.depment
|
|
|
+ this.$refs.allRankCusRef.$refs.depStatusRef.person = this.$refs.depStatusCusRef.person
|
|
|
+ this.$refs.allRankCusRef.param = this.paramCus
|
|
|
+ this.$refs.allRankCusRef.param.content.pageSize = 100
|
|
|
+ this.$refs.allRankCusRef.dateData = this.$refs.btnSelectCusRef.dateData
|
|
|
+ this.$refs.allRankCusRef.listData()
|
|
|
+ })
|
|
|
+ }else {
|
|
|
+ this.$refs.allRankProRef.drawerShow = true
|
|
|
+ this.$nextTick(()=>{
|
|
|
+ this.$refs.allRankProRef.$refs.depStatusRef.deplist = this.$refs.depStatusProRef.deplist
|
|
|
+ this.$refs.allRankProRef.$refs.depStatusRef.personnelList = this.$refs.depStatusProRef.personnelList
|
|
|
+ this.$refs.allRankProRef.$refs.depStatusRef.depment = this.$refs.depStatusProRef.depment
|
|
|
+ this.$refs.allRankProRef.$refs.depStatusRef.person = this.$refs.depStatusProRef.person
|
|
|
+ this.$refs.allRankProRef.param = this.paramPro
|
|
|
+ this.$refs.allRankProRef.param.content.pageSize = 100
|
|
|
+ this.$refs.allRankProRef.dateData = this.$refs.btnSelectProRef.dateData
|
|
|
+ this.$refs.allRankProRef.listData()
|
|
|
+ })
|
|
|
+ }
|
|
|
+ },
|
|
|
+ onCLose(){
|
|
|
+ this.drawerShow = false
|
|
|
+ }
|
|
|
+ },
|
|
|
+ created() {
|
|
|
+ this.tablecols = this.tool.tabelCol(this.$route.name).associatedCustomers.tablecols
|
|
|
+ }
|
|
|
+}
|
|
|
+</script>
|
|
|
+
|
|
|
+<style scoped>
|
|
|
+
|
|
|
+</style>
|