crm看板

src/views/crm/component/customerStatistics.vue

@@ -0,0 +1,114 @@
+<template>
+    <div>
+        <div id="chart" style="width:100%;height:85%"></div>
+    </div>
+</template>
+<script>
+import echarts from 'echarts'
+  export default {
+    data() {
+        return {
+            // title:'人员培训',
+            dialogOff:false,
+       }
+    },
+    props:{
+        data: {
+            type: Array,
+            default: []
+        }
+    },
+    watch: {
+        data(v) {
+            this.getEchartData()
+        }
+    },
+    mounted() {
+      this.getEchartData()
+    },
+    methods: {
+      getEchartData() {
+        if (true) {
+            let myChart =  echarts.init(document.getElementById("chart"))
+            let option = {
+                legend: {                  
+                    textStyle:{
+                        color:'#fff'
+                    }
+                },
+                tooltip: {},
+                color:['#FF3366','#66FFFF','#66CC00'],
+                dataset: {
+                    dimensions: ['lei_bie_', 'qznum', 'ynnum', 'khnum'],
+                    source: this.data
+                },
+                xAxis: { 
+                    type: 'category',
+                    axisLabel:{//修改坐标系字体颜色
+                        show:true,
+                        textStyle:{
+                            color:"#fff"
+                        }
+                    },
+                    axisLine: {
+                        show: true,
+                        lineStyle: {
+                            color: "rgba(255,255,255,1)",
+                            type: "solid"
+                        }
+                    }
+                },
+                yAxis: {
+                    axisLabel:{//修改坐标系字体颜色
+                        show:true,
+                        textStyle:{
+                            color:"#fff"
+                        }
+                    },
+                    axisLine: {//y轴线的颜色以及宽度
+                        show: true,
+                        lineStyle: {
+                            color: "rgba(255,255,255,1)",
+                            type: "solid"
+                        },
+                    },
+                    splitLine: {
+                        show: false
+                    }
+                },
+                // Declare several bar series, each will be mapped
+                // to a column of dataset.source by default.
+                series: [
+                    { 
+                        name: '潜在客户数量',
+                        type: 'bar',
+                        label: {
+                            show: true,
+                            position: 'top'
+                        } 
+                    }, { 
+                        name: '意向客户数量',
+                        type: 'bar', 
+                        label: {
+                            show: true,
+                            position: 'top'
+                        } 
+                    }, {
+                        name: '已签约客户数量',
+                        type: 'bar',
+                        label: {
+                            show: true,
+                            position: 'top'
+                        } 
+                    }
+                ]
+            };
+            option && myChart.setOption(option);
+        }
+      },
+    },
+  }
+</script>
+<style lang="scss" scoped>
+
+</style>

src/views/crm/component/customerStatisticsM.vue

@@ -0,0 +1,112 @@
+<template>
+    <div>
+        <div id="chartM" style="width:100%;height:85%"></div>
+    </div>
+</template>
+<script>
+import echarts from 'echarts'
+  export default {
+    data() {
+        return {
+            // title:'人员培训',
+            dialogOff:false,
+       }
+    },
+    props:{
+        data: {
+            type: Array,
+        }
+    },
+    watch: {
+        data(v) {
+            this.getEchartData()
+        }
+    },
+    mounted() {
+      this.getEchartData()
+    },
+    methods: {
+      getEchartData() {
+        
+        if (true) {
+            let mcm =  echarts.init(document.getElementById("chartM"))
+            let option = {
+                legend: {                  
+                    textStyle:{
+                        color:'#fff'
+                    }
+                },
+                tooltip: {},
+                color:['#FF33FF','#66FFFF','#33CC00'],
+                dataset: {
+                    dimensions: ['lei_bie_', 'qznum', 'ynnum', 'khnum'],
+                    source: this.data
+                },
+                xAxis: { 
+                    type: 'category',
+                    axisLabel:{//修改坐标系字体颜色
+                        show:true,
+                        textStyle:{
+                            color:"#fff"
+                        }
+                    },
+                    axisLine: {
+                        show: true,
+                        lineStyle: {
+                            color: "rgba(255,255,255,1)",
+                            type: "solid"
+                        }
+                    }
+                },
+                yAxis: {
+                    axisLabel:{//修改坐标系字体颜色
+                        show:true,
+                        textStyle:{
+                            color:"#fff"
+                        }
+                    },
+                    axisLine: {//y轴线的颜色以及宽度
+                        show: true,
+                        lineStyle: {
+                            color: "rgba(255,255,255,1)",
+                            type: "solid"
+                        },
+                    },
+                    splitLine: {
+                        show: false
+                    }
+                },
+                series: [
+                    { 
+                        name: '潜在客户数量',
+                        type: 'bar',
+                        label: {
+                            show: true,
+                            position: 'top'
+                        } 
+                    }, { 
+                        name: '意向客户数量',
+                        type: 'bar',
+                        label: {
+                            show: true,
+                            position: 'top'
+                        } 
+                    }, { 
+                        name: '已签约客户数量',
+                        type: 'bar',
+                        label: {
+                            show: true,
+                            position: 'top'
+                        } 
+                    }
+                ]
+            };
+            option && mcm.setOption(option);
+        }
+      },
+    },
+  }
+</script>
+<style lang="scss" scoped>
+
+</style>

src/views/crm/component/headerDecoration.vue

@@ -0,0 +1,85 @@
+<!--
+ * @Author: cyy szjbdcyy@126.com
+ * @Date: 2023-03-09 15:33:26
+ * @LastEditors: cyy szjbdcyy@126.com
+ * @LastEditTime: 2023-03-09 15:36:54
+ * @FilePath: \lh_firm_former\src\views\statistics\headerDecoration.vue
+ * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
+-->
+<template>
+  <div id="top">
+    <dv-decoration-8 class="header-left-decoration" />
+    <dv-decoration-5 class="header-center-decoration" />
+   
+    <dv-decoration-8 class="header-right-decoration" :reverse="true" />
+    <div class="center-title">CRM看板</div></div>
+    <!-- <span class="showTime">当前时间为:{{sendTime}}</span> -->
+    
+  </div>
+</template>
+
+<script>
+
+export default {
+  // props:['titleName'],
+  data () {
+    return {
+      sendTime:''
+      
+	}
+  },
+  created(){
+    this.currentTime()
+  },
+  methods:{
+    currentTime() {
+      setInterval(this.getNowTime, 500);
+    },
+    getNowTime(){
+      const nowDate = new Date();
+      const date = {
+          year: nowDate.getFullYear(),
+          month: nowDate.getMonth() + 1,
+          day: nowDate.getDate(),
+          hour: nowDate.getHours(),
+          minute: nowDate.getMinutes(),
+          second: nowDate.getSeconds()
+      }
+      this.sendTime = date.year + '年' + date.month + '月' + date.day + '日' +date.hour + '时' + date.minute + '分' + date.second + '秒'
+
+
+
+    }
+  }
+}
+</script>
+
+<style lang="less">
+#top {
+  position: relative;
+  width: 100%;
+  height: 100px;
+  display: flex;
+  justify-content: space-between;
+  flex-shrink: 0;
+ 
+  .header-center-decoration {
+    width: 40%;
+    height: 60px;
+    margin-top: 30px;
+  }
+  .header-left-decoration, .header-right-decoration {
+    width: 25%;
+    height: 60px;
+  }
+  .center-title {
+    position: absolute;
+    font-size: 30px;
+    font-weight: bold;
+    left: 50%;
+    top: 15px;
+    color: #fff;
+    transform: translateX(-50%);
+  }
+}
+</style>

src/views/crm/component/individualPerformance.vue

@@ -0,0 +1,89 @@
+<template>
+    <div>
+        <div id="inpm" style="width:100%;height:85%"></div>
+    </div>
+</template>
+<script>
+import echarts from 'echarts'
+  export default {
+    data() {
+        return {
+            // title:'人员培训',
+            dialogOff:false,
+       }
+    },
+    props:{
+        data: {
+            type: Array,
+        }
+    },
+    watch: {
+        data(v) {
+            this.getEchartData()
+        }
+    },
+    mounted() {
+      this.getEchartData()
+    },
+    methods: {
+      getEchartData() {
+        
+        if (true) {
+            let inpms=  echarts.init(document.getElementById("inpm"))
+            let option = {
+                legend: {                  
+                    textStyle:{
+                        color:'#fff'
+                    }
+                },
+                tooltip: {},
+                color:['#FFFF66'],
+                dataset: {
+                    dimensions: ['lei_bie_', 'jiage'],
+                    source: this.data
+                },
+                xAxis: { 
+                    type: 'category',
+                    axisLabel:{//修改坐标系字体颜色
+                        show:true,
+                        textStyle:{
+                            color:"#fff"
+                        }
+                    },
+                    axisLine: {
+                        show: true,
+                        lineStyle: {
+                            color: "rgba(255,255,255,1)",
+                            type: "solid"
+                        }
+                    }
+                },
+                yAxis: {
+                    axisLabel:{//修改坐标系字体颜色
+                        show:true,
+                        textStyle:{
+                            color:"#fff"
+                        }
+                    },
+                    axisLine: {//y轴线的颜色以及宽度
+                        show: true,
+                        lineStyle: {
+                            color: "rgba(255,255,255,1)",
+                            type: "solid"
+                        },
+                    },
+                    splitLine: {
+                        show: false
+                    }
+                },
+                series: [{ name: '销量',type: 'bar',barWidth:'10%',label: {show: true,position: 'top'}  }]
+            };
+            option && inpms.setOption(option);
+        }
+      },
+    },
+  }
+</script>
+<style lang="scss" scoped>
+
+</style>

src/views/crm/component/orderStatistics.vue

@@ -0,0 +1,89 @@
+<template>
+    <div>
+        <div id="chartOR" style="width:100%;height:100%"></div>
+    </div>
+</template>
+<script>
+import echarts from 'echarts'
+  export default {
+    data() {
+        return {
+            // title:'人员培训',
+            dialogOff:false,
+       }
+    },
+    props:{
+        data: {
+            type: Array,
+        }
+    },
+    watch: {
+        data(v) {
+            this.getEchartData()
+        }
+    },
+    mounted() {
+      this.getEchartData()
+    },
+    methods: {
+      getEchartData() {
+        
+        if (true) {
+            let ors=  echarts.init(document.getElementById("chartOR"))
+            let option = {
+                legend: {                  
+                    textStyle:{
+                        color:'#fff'
+                    }
+                },
+                tooltip: {},
+                color:['#FF33FF','#66FFFF','#33CC00'],
+                dataset: {
+                    dimensions: ['lei_bie_', 'qznum', 'ynnum', 'khnum'],
+                    source: this.data
+                },
+                xAxis: { 
+                    type: 'category',
+                    axisLabel:{//修改坐标系字体颜色
+                        show:true,
+                        textStyle:{
+                            color:"#fff"
+                        }
+                    },
+                    axisLine: {
+                        show: true,
+                        lineStyle: {
+                            color: "rgba(255,255,255,1)",
+                            type: "solid"
+                        }
+                    }
+                },
+                yAxis: {
+                    axisLabel:{//修改坐标系字体颜色
+                        show:true,
+                        textStyle:{
+                            color:"#fff"
+                        }
+                    },
+                    axisLine: {//y轴线的颜色以及宽度
+                        show: true,
+                        lineStyle: {
+                            color: "rgba(255,255,255,1)",
+                            type: "solid"
+                        },
+                    },
+                    splitLine: {
+                        show: false
+                    }
+                },
+                series: [{ name: '潜在客户数量',type: 'bar' }, { name: '意向客户数量',type: 'bar' }, { name: '已签约客户数量',type: 'bar' }]
+            };
+            option && ors.setOption(option);
+        }
+      },
+    },
+  }
+</script>
+<style lang="scss" scoped>
+
+</style>

src/views/crm/component/personPerformance.vue

@@ -0,0 +1,142 @@
+<template>
+<div @click="toDetailed()" class="statisticsPage" style="width:100%;height:85%">
+    <div id="chart" style="width:100%;height:100%"></div>
+    <div v-if="dialogOff">
+      <dialogView
+        :dialogOff = "dialogOff"
+        @close = "close"
+        :data="userInfo"
+        :date="date"
+      />
+    </div>
+</div>
+</template>
+<script>
+import echarts from 'echarts'
+import dialogView from '../messageBox/personAllDetails'
+  export default {
+    data() {
+        return {
+            // title:'人员培训',
+            dialogOff:false,
+            userInfo:[]
+
+       }
+    },
+    components:{
+      dialogView
+    },
+    props:{
+        data: {
+            type: Array,
+        },
+        date: {
+            type: String,
+        },
+        click:{
+            type:String,
+            default:'true'
+        },
+    },
+    watch: {
+        data(v) {
+            this.getEchartData()
+        }
+    },
+    mounted() {
+      this.getEchartData()
+    },
+    methods: {
+        close(){
+        this.dialogOff = false
+      },
+      /* 跳转统计页面*/
+      toDetailed(){
+        if(this.click == "true"){
+            this.dialogOff = true
+        }
+      },
+      getEchartData() {
+        if (true) {
+            let that = this
+            let myChart =  echarts.init(document.getElementById("chart"))
+            let option = {
+                legend: {                  
+                    textStyle:{
+                        color:'#fff'
+                    }
+                },
+                tooltip: {},
+                color:['#66CC00'],
+                xAxis: {
+                    type: 'category',
+                    data: this.data[0],
+                    axisLabel:{//修改坐标系字体颜色
+                        show:true,
+                        textStyle:{
+                            color:"#fff"
+                        }
+                    },
+                    axisLine: {
+                        show: true,
+                        lineStyle: {
+                            color: "rgba(255,255,255,1)",
+                            type: "solid"
+                        }
+                    }
+                },
+                yAxis: {
+                    type: 'value',
+                    axisLabel:{//修改坐标系字体颜色
+                        show:true,
+                        textStyle:{
+                            color:"#fff"
+                        }
+                    },
+                    axisLine: {//y轴线的颜色以及宽度
+                        show: true,
+                        lineStyle: {
+                            color: "rgba(255,255,255,1)",
+                            type: "solid"
+                        },
+                    },
+                    splitLine: {
+                        show: false
+                    }
+                },
+                series: [
+                    {
+                        data: this.data[1],
+                        type: 'bar',
+                        name: '销量',
+                        // showBackground: true,
+                        backgroundStyle: {
+                            color: 'rgba(180, 180, 180, 0.2)'
+                        },
+                        label: {
+                            show: true,
+                            position: 'top',
+                            formatter: function(params) {
+                                if (params.value > 0) {
+                                    return params.value;
+                                } else {
+                                    return '';
+                                }
+                            }
+                        } 
+                    }
+                ]
+            };
+            myChart.on('click', function (params) {
+                that.userInfo[0] = params.dataIndex+1
+                // that.userInfo[1] = params.data.NAME_
+            })
+            option && myChart.setOption(option);
+        }
+      },
+    },
+  }
+</script>
+<style lang="scss" scoped>
+
+</style>

src/views/crm/component/personPerformanceMonth.vue

@@ -0,0 +1,146 @@
+<template>
+<div @click="toDetailed()" class="statisticsPage" style="width:100%;height:85%">
+
+    <div id="chartqq" style="width:100%;height:100%"></div>
+    <div v-if="dialogOff">
+      <dialogView
+        :dialogOff = "dialogOff"
+        @close = "close"
+        :data="userInfo"
+        :date="date"
+      />
+    </div>
+</div>
+</template>
+<script>
+import echarts from 'echarts'
+import dialogView from '../messageBox/personMonthDetails'
+
+  export default {
+    data() {
+        return {
+            // title:'人员培训',
+            dialogOff:false,
+            userInfo:[]
+       }
+    },
+    components:{
+      dialogView
+    },
+    props:{
+        data: {
+            type: Array,
+        },
+        date: {
+            type: String,
+        },
+        click:{
+            type:String,
+            default:'true'
+        },
+    },
+    watch: {
+        data(v) {
+            this.getEchartData()
+        }
+    },
+    mounted() {
+      this.getEchartData()
+    },
+    methods: {
+        close(){
+        this.dialogOff = false
+      },
+      /* 跳转统计页面*/
+      toDetailed(){
+        if(this.click == "true"){
+            this.dialogOff = true
+        }
+      },
+      getEchartData() {
+        if (true) {
+            let that = this
+
+            let qq =  echarts.init(document.getElementById("chartqq"))
+            let option = {
+                legend: {                  
+                    textStyle:{
+                        color:'#fff'
+                    }
+                },
+                tooltip: {},
+                color:['#FFD700'],
+                xAxis: {
+                    type: 'category',
+                    data: this.data[0],
+                    axisLabel:{//修改坐标系字体颜色
+                        show:true,
+                        textStyle:{
+                            color:"#fff"
+                        }
+                    },
+                    axisLine: {
+                        show: true,
+                        lineStyle: {
+                            color: "rgba(255,255,255,1)",
+                            type: "solid"
+                        }
+                    }
+                },
+                yAxis: {
+                    type: 'value',
+                    axisLabel:{//修改坐标系字体颜色
+                        show:true,
+                        textStyle:{
+                            color:"#fff"
+                        }
+                    },
+                    axisLine: {//y轴线的颜色以及宽度
+                        show: true,
+                        lineStyle: {
+                            color: "rgba(255,255,255,1)",
+                            type: "solid"
+                        },
+                    },
+                    splitLine: {
+                        show: false
+                    }
+                },
+                series: [
+                    {
+                        data: this.data[1],
+                        type: 'bar',
+                        name: '销量',
+                        // showBackground: true,
+                        backgroundStyle: {
+                            color: 'rgba(180, 180, 180, 0.2)'
+                        },
+                        label: {
+                            show: true,
+                            position: 'top',
+                            formatter: function(params) {
+                                if (params.value > 0) {
+                                    return params.value;
+                                } else {
+                                    return '';
+                                }
+                            }
+                        } 
+                    }
+                ]
+            };
+            qq.on('click', function (params) {
+                // console.log(params)
+                that.userInfo[0] = params.dataIndex+1
+                // that.userInfo[1] = params.data.NAME_
+                // console.log(params.dataIndex);
+            })
+            option && qq.setOption(option);
+        }
+      },
+    },
+  }
+</script>
+<style lang="scss" scoped>
+
+</style>

src/views/crm/component/teamPerformance.vue

@@ -0,0 +1,124 @@
+<template>
+<div @click="toDetailed()" class="statisticsPage" style="width:100%;height:85%">
+    <div id="tmec" style="width:100%;height:100%"></div>
+    <div v-if="dialogOff">
+      <dialogView
+        :dialogOff = "dialogOff"
+        @close = "close"
+        :data="userInfo"
+        :date="date"
+      />
+    </div>
+</div>
+</template>
+<script>
+import echarts from 'echarts'
+import dialogView from '../messageBox/teamAllDetails'
+
+export default {
+    data() {
+        return {
+            dialogOff:false,
+            userInfo:[]
+       }
+    },
+    components:{
+      dialogView
+    },
+    props:{
+        data: {
+            type: Array,
+        },
+        date: {
+            type: String,
+        },
+        click:{
+            type:String,
+            default:'true'
+        },
+    },
+    watch: {
+        data(v) {
+            this.getEchartData()
+        }
+    },
+    mounted() {
+      this.getEchartData()
+    },
+    methods: {
+      close(){
+        this.dialogOff = false
+      },
+      /* 跳转统计页面*/
+      toDetailed(){
+        if(this.click == "true"){
+            this.dialogOff = true
+        }
+      },
+      getEchartData() {
+        if (true) {
+            let that = this
+            let tmecs=  echarts.init(document.getElementById("tmec"))
+            let option = {
+                legend: {                  
+                    textStyle:{
+                        color:'#fff'
+                    }
+                },
+                tooltip: {},
+                color:['#99FF00'],
+                dataset: {
+                    dimensions: ['NAME_', 'jiage'],
+                    source: this.data
+                },
+                xAxis: { 
+                    type: 'category',
+                    axisLabel:{//修改坐标系字体颜色
+                        show:true,
+                        textStyle:{
+                            color:"#fff"
+                        }
+                    },
+                    axisLine: {
+                        show: true,
+                        lineStyle: {
+                            color: "rgba(255,255,255,1)",
+                            type: "solid"
+                        }
+                    }
+                },
+                yAxis: {
+                    axisLabel:{//修改坐标系字体颜色
+                        show:true,
+                        textStyle:{
+                            color:"#fff"
+                        }
+                    },
+                    axisLine: {//y轴线的颜色以及宽度
+                        show: true,
+                        lineStyle: {
+                            color: "rgba(255,255,255,1)",
+                            type: "solid"
+                        },
+                    },
+                    splitLine: {
+                        show: false
+                    }
+                },
+                series: [{ name: '销量',type: 'bar',barWidth:'10%',label: {show: true,position: 'top'} }]
+            };
+            tmecs.on('click', function (params) {
+                // console.log(params.data.bian_zhi_ren_)
+                that.userInfo[0] = params.data.bian_zhi_ren_
+                that.userInfo[1] = params.data.NAME_
+                // console.log(params.dataIndex);
+            })
+            option && tmecs.setOption(option);
+        }
+      },
+    },
+  }
+</script>
+<style lang="scss" scoped>
+
+</style>

src/views/crm/component/teamPerformanceMonth.vue

@@ -0,0 +1,125 @@
+<template>
+<div @click="toDetailed()" class="statisticsPage" style="width:100%;height:85%">
+    <div id="chartOR" style="width:100%;height:100%"></div>
+        <div v-if="dialogOff">
+      <dialogView
+        :dialogOff = "dialogOff"
+        @close = "close"
+        :data="userInfo"
+        :date="date"
+      />
+    </div>
+</div>
+</template>
+<script>
+import echarts from 'echarts'
+import dialogView from '../messageBox/teamMonthDetails'
+
+  export default {
+    data() {
+        return {
+            // title:'人员培训',
+            dialogOff:false,
+            userInfo:[]
+       }
+    },
+    props:{
+        data: {
+            type: Array,
+        },
+        date: {
+            type: String,
+        },
+        click:{
+            type:String,
+            default:'true'
+        },
+    },
+    components:{
+      dialogView
+    },
+    watch: {
+        data(v) {
+            this.getEchartData()
+        }
+    },
+    mounted() {
+      this.getEchartData()
+    },
+    methods: {
+      close(){
+        this.dialogOff = false
+      },
+      /* 跳转统计页面*/
+      toDetailed(){
+        if(this.click == "true"){
+            this.dialogOff = true
+        }
+      },
+      getEchartData() {
+        if (true) {
+            let that = this
+            let ors=  echarts.init(document.getElementById("chartOR"))
+            let option = {
+                legend: {                  
+                    textStyle:{
+                        color:'#fff'
+                    }
+                },
+                tooltip: {},
+                color:['#99FFFF'],
+                dataset: {
+                    dimensions: ['NAME_', 'jiage'],
+                    source: this.data
+                },
+                xAxis: { 
+                    type: 'category',
+                    axisLabel:{//修改坐标系字体颜色
+                        show:true,
+                        textStyle:{
+                            color:"#fff"
+                        }
+                    },
+                    axisLine: {
+                        show: true,
+                        lineStyle: {
+                            color: "rgba(255,255,255,1)",
+                            type: "solid"
+                        }
+                    }
+                },
+                yAxis: {
+                    axisLabel:{//修改坐标系字体颜色
+                        show:true,
+                        textStyle:{
+                            color:"#fff"
+                        }
+                    },
+                    axisLine: {//y轴线的颜色以及宽度
+                        show: true,
+                        lineStyle: {
+                            color: "rgba(255,255,255,1)",
+                            type: "solid"
+                        },
+                    },
+                    splitLine: {
+                        show: false
+                    }
+                },
+                series: [{ name: '销量',type: 'bar',barWidth:'10%',label: {show: true,position: 'top'} }]
+            };
+            ors.on('click', function (params) {
+                // console.log(params.data.bian_zhi_ren_)
+                that.userInfo[0] = params.data.bian_zhi_ren_
+                that.userInfo[1] = params.data.NAME_
+                // console.log(params.dataIndex);
+            })
+            option && ors.setOption(option);
+        }
+      },
+    },
+  }
+</script>
+<style lang="scss" scoped>
+
+</style>

src/views/crm/messageBox/personAllDetails.vue

@@ -0,0 +1,147 @@
+<template>
+    <el-dialog
+      :visible.sync="visible"
+      ref="dialog"
+      :title="'个人月度销售详情'"
+      width="100%"
+      lock-scroll
+      append-to-body
+      fullscreen
+      close-on-press-escape
+      destroy-on-close
+      v-if="visible"
+      @close="handleClose">
+
+        <el-table
+        :data="tableData.slice((currpage - 1) * pagesize, currpage * pagesize)"
+        style="width: 100%"
+        :row-class-name="tableRowClassName">
+            <el-table-column
+            prop="he_tong_bian_hao_"
+            label="合同编号"
+            width="180">
+            </el-table-column>
+            <el-table-column
+            prop="zhuan_huan_ke_hu_"
+            label="客户名称"
+            width="180">
+            </el-table-column>
+            <el-table-column
+            prop="sheng_xiao_shi_ji"
+            label="生效时间"
+            width="180">
+            </el-table-column>
+            <el-table-column
+            prop="shi_xiao_shi_jian"
+            label="失效时间"
+            width="180">
+            </el-table-column>
+            <el-table-column
+            prop="zhuang_tai_"
+            label="合同状态"
+            width="180">
+            </el-table-column>
+            <el-table-column
+            prop="fu_kuan_fang_shi_"
+            label="付款方式"
+            width="180">
+            </el-table-column>
+            <el-table-column
+            prop="jiage"
+            label="总价（元）"
+            width="180">
+            </el-table-column>
+        </el-table>
+
+        <el-pagination
+        layout="prev, pager, next, jumper"
+        @size-change = 'handleSizeChange'
+        @current-change='handleCurrentChange'
+        :current-page='currpage'
+        :page-size='pagesize'
+        :total="tableData.length">
+
+        </el-pagination>
+    </el-dialog>
+</template>
+
+<script>
+  import curdPost from '@/business/platform/form/utils/custom/joinCURD.js'
+
+  export default {
+    props:{
+        dialogOff:{ //当前表单示例
+            type: Boolean,
+            default:false,
+        },
+        data:{
+            type:Array
+        },
+        date:{
+            type:String
+        },
+        height:{
+            type:String,
+            default:window.screen.height * 0.5 +'px'
+        }
+    },
+    beforeMount: function () {
+        let tempid = this.$store.state.ibps.user.info.user.id
+        const newmonth = this.data[0] > 10 ? this.data[0] : "0" + this.data[0];
+
+        let sql = "select e.*,ibps_party_employee.NAME_ from (select d.*,t_mjwtsqb.zong_jia_ as jiage from (select * from t_bjd LEFT JOIN (select a.id_ as leibieid,a.lai_yuan_qu_dao_ as laiyuan,b.id_ as qudaoid, b.lei_bie_ from ((select id_, lai_yuan_qu_dao_ from t_qzkhb GROUP BY id_) UNION (select id_, lai_yuan_qu_dao_ from t_yxkh GROUP BY id_) UNION (select ke_hu_ming_cheng_, lai_yuan_qu_dao_ as khnum from t_khxx GROUP BY ke_hu_ming_cheng_)) as a LEFT JOIN (select t_qdgl.id_,t_qdlbb.lei_bie_ from t_qdgl LEFT JOIN t_qdlbb on t_qdgl.qu_dao_lei_bie_ = t_qdlbb.id_) as b on a.lai_yuan_qu_dao_ = b.id_) as c on t_bjd.ke_hu_ming_cheng_ = c.leibieid where c.lei_bie_ is not NULL and t_bjd.sheng_xiao_shi_ji like '"+ this.date.split('-')[0]+"-"+newmonth +"%' and t_bjd.bian_zhi_ren_ = '"+tempid+"') as d left join t_mjwtsqb on t_mjwtsqb.he_tong_bian_hao_ = d.id_ WHERE t_mjwtsqb.shi_fou_guo_shen_ = '1' ) as e LEFT JOIN ibps_party_employee on e.bian_zhi_ren_ = ibps_party_employee.id_ ORDER BY e.he_tong_bian_hao_ desc"
+        curdPost('sql',sql).then(res=>{
+
+          this.tableData = res.variables.data
+        })
+    },
+    watch:{
+        dialogOff: {
+            handler: function(val, oldVal) {
+                this.visible = JSON.parse(JSON.stringify(val));
+                this.itemShow = true
+            },
+            immediate: true
+        }
+    },
+    data() {
+        return {
+            visible:false,
+            itemShow:false,
+            tableData: [],
+            curentPage1: 1, //默认最开始是第几页
+            pagesize: 10, //每页数据条数
+            currpage: 1, //默认开始页面
+        }
+    },
+    methods:{
+        // 关闭窗口
+        handleClose(){
+            this.$emit('close', false)
+        },
+        tableRowClassName({row, rowIndex}) {
+            if (rowIndex === 1) {
+            return 'warning-row';
+            } else if (rowIndex === 3) {
+            return 'success-row';
+            }
+            return '';
+        },
+        handleSizeChange(val) {
+            this.pagesize = val
+        },
+        handleCurrentChange(val) {
+            this.currpage = val
+        }
+    }
+  }
+</script>
+
+<style scoped>
+  .dataCont{
+    border:0px;
+    box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
+    height: calc(100vh * 0.85);
+    padding:20px;
+  }
+</style>

src/views/crm/messageBox/personMonthDetails.vue

@@ -0,0 +1,147 @@
+<template>
+    <el-dialog
+      :visible.sync="visible"
+      ref="dialog"
+      :title="'个人日销售详情'"
+      width="100%"
+      lock-scroll
+      append-to-body
+      fullscreen
+      close-on-press-escape
+      destroy-on-close
+      v-if="visible"
+      @close="handleClose">
+
+        <el-table
+        :data="tableData.slice((currpage - 1) * pagesize, currpage * pagesize)"
+        style="width: 100%"
+        :row-class-name="tableRowClassName">
+            <el-table-column
+            prop="he_tong_bian_hao_"
+            label="合同编号"
+            width="180">
+            </el-table-column>
+            <el-table-column
+            prop="zhuan_huan_ke_hu_"
+            label="客户名称"
+            width="180">
+            </el-table-column>
+            <el-table-column
+            prop="sheng_xiao_shi_ji"
+            label="生效时间"
+            width="180">
+            </el-table-column>
+            <el-table-column
+            prop="shi_xiao_shi_jian"
+            label="失效时间"
+            width="180">
+            </el-table-column>
+            <el-table-column
+            prop="zhuang_tai_"
+            label="合同状态"
+            width="180">
+            </el-table-column>
+            <el-table-column
+            prop="fu_kuan_fang_shi_"
+            label="付款方式"
+            width="180">
+            </el-table-column>
+            <el-table-column
+            prop="jiage"
+            label="总价（元）"
+            width="180">
+            </el-table-column>
+        </el-table>
+
+        <el-pagination
+        layout="prev, pager, next, jumper"
+        @size-change = 'handleSizeChange'
+        @current-change='handleCurrentChange'
+        :current-page='currpage'
+        :page-size='pagesize'
+        :total="tableData.length">
+
+        </el-pagination>
+    </el-dialog>
+</template>
+
+<script>
+  import curdPost from '@/business/platform/form/utils/custom/joinCURD.js'
+
+  export default {
+    props:{
+        dialogOff:{ //当前表单示例
+            type: Boolean,
+            default:false,
+        },
+        data:{
+            type:Array
+        },
+        date:{
+            type:String
+        },
+        height:{
+            type:String,
+            default:window.screen.height * 0.5 +'px'
+        }
+    },
+    beforeMount: function () {
+        let tempid = this.$store.state.ibps.user.info.user.id
+        const newmonth = this.data[0] > 10 ? this.data[0] : "0" + this.data[0];
+
+        let sql = "select e.*,ibps_party_employee.NAME_ from (select d.*,t_mjwtsqb.zong_jia_ as jiage from (select * from t_bjd LEFT JOIN (select a.id_ as leibieid,a.lai_yuan_qu_dao_ as laiyuan,b.id_ as qudaoid, b.lei_bie_ from ((select id_, lai_yuan_qu_dao_ from t_qzkhb GROUP BY id_) UNION (select id_, lai_yuan_qu_dao_ from t_yxkh GROUP BY id_) UNION (select ke_hu_ming_cheng_, lai_yuan_qu_dao_ as khnum from t_khxx GROUP BY ke_hu_ming_cheng_)) as a LEFT JOIN (select t_qdgl.id_,t_qdlbb.lei_bie_ from t_qdgl LEFT JOIN t_qdlbb on t_qdgl.qu_dao_lei_bie_ = t_qdlbb.id_) as b on a.lai_yuan_qu_dao_ = b.id_) as c on t_bjd.ke_hu_ming_cheng_ = c.leibieid where c.lei_bie_ is not NULL and t_bjd.sheng_xiao_shi_ji like '"+ this.date+"-"+newmonth +"%' and t_bjd.bian_zhi_ren_ = '"+tempid+"') as d left join t_mjwtsqb on t_mjwtsqb.he_tong_bian_hao_ = d.id_ WHERE t_mjwtsqb.shi_fou_guo_shen_ = '1' ) as e LEFT JOIN ibps_party_employee on e.bian_zhi_ren_ = ibps_party_employee.id_ ORDER BY e.he_tong_bian_hao_ desc"
+        curdPost('sql',sql).then(res=>{
+
+          this.tableData = res.variables.data
+        })
+    },
+    watch:{
+        dialogOff: {
+            handler: function(val, oldVal) {
+                this.visible = JSON.parse(JSON.stringify(val));
+                this.itemShow = true
+            },
+            immediate: true
+        }
+    },
+    data() {
+        return {
+            visible:false,
+            itemShow:false,
+            tableData: [],
+            curentPage1: 1, //默认最开始是第几页
+            pagesize: 10, //每页数据条数
+            currpage: 1, //默认开始页面
+        }
+    },
+    methods:{
+        // 关闭窗口
+        handleClose(){
+            this.$emit('close', false)
+        },
+        tableRowClassName({row, rowIndex}) {
+            if (rowIndex === 1) {
+            return 'warning-row';
+            } else if (rowIndex === 3) {
+            return 'success-row';
+            }
+            return '';
+        },
+        handleSizeChange(val) {
+            this.pagesize = val
+        },
+        handleCurrentChange(val) {
+            this.currpage = val
+        }
+    }
+  }
+</script>
+
+<style scoped>
+  .dataCont{
+    border:0px;
+    box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
+    height: calc(100vh * 0.85);
+    padding:20px;
+  }
+</style>

src/views/crm/messageBox/teamAllDetails.vue

@@ -0,0 +1,144 @@
+<template>
+    <el-dialog
+      :visible.sync="visible"
+      ref="dialog"
+      :title="data[1]+' 年度销售详情'"
+      width="100%"
+      lock-scroll
+      append-to-body
+      fullscreen
+      close-on-press-escape
+      destroy-on-close
+      v-if="visible"
+      @close="handleClose">
+
+        <el-table
+        :data="tableData.slice((currpage - 1) * pagesize, currpage * pagesize)"
+        style="width: 100%"
+        :row-class-name="tableRowClassName">
+            <el-table-column
+            prop="he_tong_bian_hao_"
+            label="合同编号"
+            width="180">
+            </el-table-column>
+            <el-table-column
+            prop="zhuan_huan_ke_hu_"
+            label="客户名称"
+            width="180">
+            </el-table-column>
+            <el-table-column
+            prop="sheng_xiao_shi_ji"
+            label="生效时间"
+            width="180">
+            </el-table-column>
+            <el-table-column
+            prop="shi_xiao_shi_jian"
+            label="失效时间"
+            width="180">
+            </el-table-column>
+            <el-table-column
+            prop="zhuang_tai_"
+            label="合同状态"
+            width="180">
+            </el-table-column>
+            <el-table-column
+            prop="fu_kuan_fang_shi_"
+            label="付款方式"
+            width="180">
+            </el-table-column>
+            <el-table-column
+            prop="jiage"
+            label="总价（元）"
+            width="180">
+            </el-table-column>
+        </el-table>
+
+        <el-pagination
+        layout="prev, pager, next, jumper"
+        @size-change = 'handleSizeChange'
+        @current-change='handleCurrentChange'
+        :current-page='currpage'
+        :page-size='pagesize'
+        :total="tableData.length">
+
+        </el-pagination>
+    </el-dialog>
+</template>
+
+<script>
+  import curdPost from '@/business/platform/form/utils/custom/joinCURD.js'
+
+  export default {
+    props:{
+        dialogOff:{ //当前表单示例
+            type: Boolean,
+            default:false,
+        },
+        data:{
+            type:Array
+        },
+        date:{
+            type:String
+        },
+        height:{
+            type:String,
+            default:window.screen.height * 0.5 +'px'
+        }
+    },
+    beforeMount: function () {
+        let sql = "select e.*,ibps_party_employee.NAME_ from (select d.*,t_mjwtsqb.zong_jia_ as jiage from (select * from t_bjd LEFT JOIN (select a.id_ as leibieid,a.lai_yuan_qu_dao_ as laiyuan,b.id_ as qudaoid, b.lei_bie_ from ((select id_, lai_yuan_qu_dao_ from t_qzkhb GROUP BY id_) UNION (select id_, lai_yuan_qu_dao_ from t_yxkh GROUP BY id_) UNION (select ke_hu_ming_cheng_, lai_yuan_qu_dao_ as khnum from t_khxx GROUP BY ke_hu_ming_cheng_)) as a LEFT JOIN (select t_qdgl.id_,t_qdlbb.lei_bie_ from t_qdgl LEFT JOIN t_qdlbb on t_qdgl.qu_dao_lei_bie_ = t_qdlbb.id_) as b on a.lai_yuan_qu_dao_ = b.id_) as c on t_bjd.ke_hu_ming_cheng_ = c.leibieid where c.lei_bie_ is not NULL and t_bjd.sheng_xiao_shi_ji like '"+ this.date.split('-')[0] +"%' and t_bjd.bian_zhi_ren_ = '"+this.data[0]+"') as d left join t_mjwtsqb on t_mjwtsqb.he_tong_bian_hao_ = d.id_ WHERE t_mjwtsqb.shi_fou_guo_shen_ = '1' ) as e LEFT JOIN ibps_party_employee on e.bian_zhi_ren_ = ibps_party_employee.id_ ORDER BY e.he_tong_bian_hao_ desc"
+        curdPost('sql',sql).then(res=>{
+
+          this.tableData = res.variables.data
+        })
+    },
+    watch:{
+        dialogOff: {
+            handler: function(val, oldVal) {
+                this.visible = JSON.parse(JSON.stringify(val));
+                this.itemShow = true
+            },
+            immediate: true
+        }
+    },
+    data() {
+        return {
+            visible:false,
+            itemShow:false,
+            tableData: [],
+            curentPage1: 1, //默认最开始是第几页
+            pagesize: 10, //每页数据条数
+            currpage: 1, //默认开始页面
+        }
+    },
+    methods:{
+        // 关闭窗口
+        handleClose(){
+            this.$emit('close', false)
+        },
+        tableRowClassName({row, rowIndex}) {
+            if (rowIndex === 1) {
+            return 'warning-row';
+            } else if (rowIndex === 3) {
+            return 'success-row';
+            }
+            return '';
+        },
+        handleSizeChange(val) {
+            this.pagesize = val
+        },
+        handleCurrentChange(val) {
+            this.currpage = val
+        }
+    }
+  }
+</script>
+
+<style scoped>
+  .dataCont{
+    border:0px;
+    box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
+    height: calc(100vh * 0.85);
+    padding:20px;
+  }
+</style>

src/views/crm/messageBox/teamMonthDetails.vue

@@ -0,0 +1,144 @@
+<template>
+    <el-dialog
+      :visible.sync="visible"
+      ref="dialog"
+      :title="data[1]+' 月度销售详情'"
+      width="100%"
+      lock-scroll
+      append-to-body
+      fullscreen
+      close-on-press-escape
+      destroy-on-close
+      v-if="visible"
+      @close="handleClose">
+
+        <el-table
+        :data="tableData.slice((currpage - 1) * pagesize, currpage * pagesize)"
+        style="width: 100%"
+        :row-class-name="tableRowClassName">
+            <el-table-column
+            prop="he_tong_bian_hao_"
+            label="合同编号"
+            width="180">
+            </el-table-column>
+            <el-table-column
+            prop="zhuan_huan_ke_hu_"
+            label="客户名称"
+            width="180">
+            </el-table-column>
+            <el-table-column
+            prop="sheng_xiao_shi_ji"
+            label="生效时间"
+            width="180">
+            </el-table-column>
+            <el-table-column
+            prop="shi_xiao_shi_jian"
+            label="失效时间"
+            width="180">
+            </el-table-column>
+            <el-table-column
+            prop="zhuang_tai_"
+            label="合同状态"
+            width="180">
+            </el-table-column>
+            <el-table-column
+            prop="fu_kuan_fang_shi_"
+            label="付款方式"
+            width="180">
+            </el-table-column>
+            <el-table-column
+            prop="jiage"
+            label="总价（元）"
+            width="180">
+            </el-table-column>
+        </el-table>
+
+        <el-pagination
+        layout="prev, pager, next, jumper"
+        @size-change = 'handleSizeChange'
+        @current-change='handleCurrentChange'
+        :current-page='currpage'
+        :page-size='pagesize'
+        :total="tableData.length">
+
+        </el-pagination>
+    </el-dialog>
+</template>
+
+<script>
+  import curdPost from '@/business/platform/form/utils/custom/joinCURD.js'
+
+  export default {
+    props:{
+        dialogOff:{ //当前表单示例
+            type: Boolean,
+            default:false,
+        },
+        data:{
+            type:Array
+        },
+        date:{
+            type:String
+        },
+        height:{
+            type:String,
+            default:window.screen.height * 0.5 +'px'
+        }
+    },
+    beforeMount: function () {
+        let sql = "select e.*,ibps_party_employee.NAME_ from (select d.*,t_mjwtsqb.zong_jia_ as jiage from (select * from t_bjd LEFT JOIN (select a.id_ as leibieid,a.lai_yuan_qu_dao_ as laiyuan,b.id_ as qudaoid, b.lei_bie_ from ((select id_, lai_yuan_qu_dao_ from t_qzkhb GROUP BY id_) UNION (select id_, lai_yuan_qu_dao_ from t_yxkh GROUP BY id_) UNION (select ke_hu_ming_cheng_, lai_yuan_qu_dao_ as khnum from t_khxx GROUP BY ke_hu_ming_cheng_)) as a LEFT JOIN (select t_qdgl.id_,t_qdlbb.lei_bie_ from t_qdgl LEFT JOIN t_qdlbb on t_qdgl.qu_dao_lei_bie_ = t_qdlbb.id_) as b on a.lai_yuan_qu_dao_ = b.id_) as c on t_bjd.ke_hu_ming_cheng_ = c.leibieid where c.lei_bie_ is not NULL and t_bjd.sheng_xiao_shi_ji like '"+ this.date.split('-')[0] +"%' and t_bjd.bian_zhi_ren_ = '"+this.data[0]+"') as d left join t_mjwtsqb on t_mjwtsqb.he_tong_bian_hao_ = d.id_ WHERE t_mjwtsqb.shi_fou_guo_shen_ = '1' ) as e LEFT JOIN ibps_party_employee on e.bian_zhi_ren_ = ibps_party_employee.id_ ORDER BY e.he_tong_bian_hao_ desc"
+        curdPost('sql',sql).then(res=>{
+
+          this.tableData = res.variables.data
+        })
+    },
+    watch:{
+        dialogOff: {
+            handler: function(val, oldVal) {
+                this.visible = JSON.parse(JSON.stringify(val));
+                this.itemShow = true
+            },
+            immediate: true
+        }
+    },
+    data() {
+        return {
+            visible:false,
+            itemShow:false,
+            tableData: [],
+            curentPage1: 1, //默认最开始是第几页
+            pagesize: 10, //每页数据条数
+            currpage: 1, //默认开始页面
+        }
+    },
+    methods:{
+        // 关闭窗口
+        handleClose(){
+            this.$emit('close', false)
+        },
+        tableRowClassName({row, rowIndex}) {
+            if (rowIndex === 1) {
+            return 'warning-row';
+            } else if (rowIndex === 3) {
+            return 'success-row';
+            }
+            return '';
+        },
+        handleSizeChange(val) {
+            this.pagesize = val
+        },
+        handleCurrentChange(val) {
+            this.currpage = val
+        }
+    }
+  }
+</script>
+
+<style scoped>
+  .dataCont{
+    border:0px;
+    box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
+    height: calc(100vh * 0.85);
+    padding:20px;
+  }
+</style>

src/views/crm/tongji.vue

@@ -1,64 +1,399 @@
 <template>
-  <div>
-   <div id="chart" style="width:100%;height:376px"></div>
-  </div>
+  <dv-full-screen-container>
+    <!-- <el-scrollbar class="screen" ref="scrollDiv" > -->
+      <div class="bgAll">
+        <div class="editDate">
+        <!-- 标题装饰组件 -->
+          <header-decoration />
+          <div class="pickDate">
+            <el-date-picker
+              v-model="allDate"
+              style="color: #000 !important;
+              width: 12%;
+              height:2.825rem;
+              line-height: 2.825rem;
+              text-align:center;"
+              type="month"
+              value-format="yyyy-MM"
+              @change="refreshAll(allDate)"
+              placeholder="选择月">
+            </el-date-picker>
+            <div 
+              @click.prevent="goBack()" 
+              style="width: 12%;
+              height:2.825rem;
+              line-height: 2.825rem;
+              text-align:center;" >
+              <dv-border-box-8>返回</dv-border-box-8>
+            </div>
+          </div>
+        </div>
+        <div class="customerC" v-if="authority">
+          <dv-border-box-7  backgroundColor="rgba(6, 30, 93, 0.5)" >
+            <div class="ttitle">
+              <div v-if="csArr.length>0" class="middleFont">各渠道客户数量</div>
+              <customer-statistics v-if="csArr.length>0" :data = 'csArr'></customer-statistics>
+              <div class="nullDate" v-else>暂无数据</div>
+            </div>
+          </dv-border-box-7>
+          <dv-border-box-7  backgroundColor="rgba(6, 30, 93, 0.5)" >
+            <div class="ttitle">
+              <div v-if="msArr.length>0" class="middleFont">月度各渠道客户数量</div>
+              <customer-statistics-m v-if="msArr.length>0" :data = 'msArr'></customer-statistics-m>
+              <div class="nullDate" v-else>暂无数据</div>
+            </div>
+          </dv-border-box-7>
+          <dv-border-box-7  backgroundColor="rgba(6, 30, 93, 0.5)" >
+            <div class="ttitle">
+              <div v-if="inArr.length>0" class="middleFont">月度各渠道客户销售量</div>
+              <individual-performance v-if="inArr.length>0" :data = 'inArr'></individual-performance>
+              <div class="nullDate" v-else>暂无数据</div>
+            </div>
+          </dv-border-box-7>
+        </div>
+        <div class="customerD" v-if="authority">
+          <!-- <dv-scroll-board
+            
+            :config="orArr"
+            style="width: 100%; height: 100%"
+          /> -->
+          <dv-border-box-7  backgroundColor="rgba(6, 30, 93, 0.5)" >
+            <div class="ttitle">
+              <div v-if="teArr.length>0" class="middleFont">年度团队绩效</div>
+              <team-performance v-if="teArr.length>0" :data = 'teArr' :date = 'allDate'></team-performance>
+              <div class="nullDate" v-else>暂无数据</div>
+            </div>
+          </dv-border-box-7>
+          <dv-border-box-7  backgroundColor="rgba(6, 30, 93, 0.5)" >
+            <div class="ttitle">
+              <div v-if="tmArr.length>0" class="middleFont">月度团队绩效</div>
+              <team-performance-month v-if="tmArr.length>0" :data = 'tmArr' :date = 'allDate'></team-performance-month>
+              <div class="nullDate" v-else>暂无数据</div>
+            </div>
+          </dv-border-box-7>
+        </div>
+        <div class="customerG" v-else>
+          <dv-border-box-7  backgroundColor="rgba(6, 30, 93, 0.5)" >
+            <div class="ttitle">
+              <div v-if="peArr.length>0" class="middleFont">年度个人绩效</div>
+              <person-performance v-if="peArr.length>0" :data = 'peArr' :date = 'allDate'></person-performance>
+              <div class="nullDate" v-else>暂无数据</div>
+            </div>
+          </dv-border-box-7>
+          <dv-border-box-7  backgroundColor="rgba(6, 30, 93, 0.5)" >
+            <div class="ttitle">
+              <div v-if="pmArr.length>0" class="middleFont">月度个人绩效</div>
+              <person-performance-month v-if="pmArr.length>0" :data = 'pmArr' :date = 'allDate'></person-performance-month>
+              <div class="nullDate" v-else>暂无数据</div>
+            </div>
+          </dv-border-box-7>
+          <!-- <dv-scroll-board
+                    v-if="tableData.data && tableData.data.length"
+                    :config="tableData"
+                    style="width: 100%; height: 100%"
+                /> -->
+        </div>
+      </div>
+    <!-- </el-scrollbar> -->
+  </dv-full-screen-container>
 </template>
 <script>
-import echarts from 'echarts'
+//全屏展示
+  import screenfull from 'screenfull'
+  //大屏标题组件
+  import headerDecoration from '../crm/component/headerDecoration'
+  import customerStatistics from '../crm/component/customerStatistics'
+  import customerStatisticsM from '../crm/component/customerStatisticsM'
+  import individualPerformance from '../crm/component/individualPerformance'
+  import orderStatistics from '../crm/component/orderStatistics'
+  import teamPerformance from '../crm/component/teamPerformance'
+  import teamPerformanceMonth from '../crm/component/teamPerformanceMonth'
+  import personPerformance from '../crm/component/personPerformance'
+  import personPerformanceMonth from '../crm/component/personPerformanceMonth'
+
+  import curdPost from '@/business/platform/form/utils/custom/joinCURD.js'
   export default {
     data() {
       return {
-             title:'人员培训',
-             dialogOff:false,
-           }
+        authority:false,
+        allDate: '',
+        dialogOff:false,
+        csArr:[],
+        msArr:[],
+        inArr:[],
+        orArr:[],
+        teArr:[],
+        tmArr:[],
+        pmArr:[],
+        peArr:[],
+        tableData:{
+  header: ['列1', '列2', '列3'],
+  data: [
+    ['行1列1', '行1列2', '行1列3'],
+    ['行2列1', '行2列2', '行2列3'],
+    ['行3列1', '行3列2', '行3列3'],
+    ['行4列1', '行4列2', '行4列3'],
+    ['行5列1', '行5列2', '行5列3'],
+    ['行6列1', '行6列2', '行6列3'],
+    ['行7列1', '行7列2', '行7列3'],
+    ['行8列1', '行8列2', '行8列3'],
+    ['行9列1', '行9列2', '行9列3'],
+    ['行10列1', '行10列2', '行10列3']
+  ]
+}
+      }
+    },
+    components:{
+      screenfull,
+      headerDecoration,
+      customerStatistics,
+      customerStatisticsM,
+      individualPerformance,
+      orderStatistics,
+      teamPerformance,
+      teamPerformanceMonth,
+      personPerformance,
+      personPerformanceMonth
     },
     mounted() {
-      this.getEchartData()
+      //权限
+      this.authorityJudgment()
+      //初始化
+      this.Date()
     },
     methods: {
-      getEchartData() {
-        if (true) {
-          let myChart =  echarts.init(document.getElementById("chart"))
-          let option = {
-                tooltip: {
-                  trigger: 'item'
-                },
-                legend: {
-                  top: '5%',
-                  left: 'center'
-                },
-                series: [
-                  {
-                    name: '类型',
-                    type: 'pie',
-                    radius: ['40%', '70%'],
-                    avoidLabelOverlap: false,
-                    label: {
-                      show: false,
-                      position: 'center'
-                    },
-                    emphasis: {
-                      label: {
-                        show: true,
-                        fontSize: '40',
-                        fontWeight: 'bold'
-                      }
-                    },
-                    labelLine: {
-                      show: false
-                    },
-                    data: [
-                      { value: 1048, name: '业务关系' },
-                      { value: 735, name: '商桥' },
-                      { value: 580, name: '供应商' },
-                      { value: 484, name: '合伙人' }
-                    ]
-                  }
-                ]
-              };
-          option && myChart.setOption(option);
-        }
+      Date() {
+        const nowDate = new Date();
+        const date = {
+          year: nowDate.getFullYear(),
+          month: nowDate.getMonth() + 1,
+          date: nowDate.getDate(),
+        };
+        const newmonth = date.month > 10 ? date.month : "0" + date.month;
+        this.allDate = date.year + "-" + newmonth 
+
+
+        let dateNum = new Date(date.year, date.month, 0).getDate();
+
+        this.getCustomerStatisticsYear(this.allDate)
+        this.getCustomerStatisticsMonth(this.allDate)
+        this.getIndividualPerformanceMonth(this.allDate)
+        this.getTeamPerformance(this.allDate)
+        this.getTeamPerformanceMonth(this.allDate)
+        this.getpersonPerformanceAll(this.allDate)
+        this.getpersonPerformanceMonth(this.allDate,dateNum)
       },
-    },
+      goBack(){
+        this.$router.back(-1)
+      },
+      refreshAll(date){
+        let dateNum = new Date(this.allDate.split('-')[0], Number(this.allDate.split('-')[1])+'', 0).getDate();
+        this.getCustomerStatisticsYear(date)
+        this.getCustomerStatisticsMonth(date)
+        this.getIndividualPerformanceMonth(date)
+        this.getTeamPerformance(date)
+        this.getTeamPerformanceMonth(date)
+        this.getpersonPerformanceAll(date)
+        this.getpersonPerformanceMonth(date,dateNum)
+      },
+      getCustomerStatisticsYear(date){
+        this.csArr.length = 0
+        let sql = "select * from (select a.lai_yuan_qu_dao_,SUM(IFNULL(a.qznum,0)) as qznum ,SUM(IFNULL(a.yxnum,0)) as ynnum,SUM(IFNULL(a.khnum,0)) as khnum,IFNULL(b.lei_bie_,'空') as lei_bie_ from (((select COUNT(lai_yuan_qu_dao_) as qznum, lai_yuan_qu_dao_, null as yxnum,null as khnum from t_qzkhb GROUP BY lai_yuan_qu_dao_) UNION (select null, lai_yuan_qu_dao_, COUNT(lai_yuan_qu_dao_) as yxnum,null from t_yxkh GROUP BY lai_yuan_qu_dao_) UNION (select null, lai_yuan_qu_dao_,null, COUNT(lai_yuan_qu_dao_) as khnum from t_khxx GROUP BY lai_yuan_qu_dao_)) as a LEFT JOIN (select t_qdgl.id_,t_qdlbb.lei_bie_ from t_qdgl LEFT JOIN t_qdlbb on t_qdgl.qu_dao_lei_bie_ = t_qdlbb.id_) as b on a.lai_yuan_qu_dao_ = b.id_) GROUP BY b.lei_bie_ UNION select null,0,0,0,lei_bie_ from t_qdlbb) as c GROUP BY c.lei_bie_"
+        curdPost('sql',sql).then(res=>{
+          let arr = res.variables.data
+          for (var i = 0; i < arr.length; i++) {
+            if (arr[i].lei_bie_ != "空") {//判断key为999的对象是否存在，
+              this.csArr.push(arr[i])
+            }
+          }
+        })
+      },
+      getCustomerStatisticsMonth(date){
+        this.msArr.length = 0
+        let sql = "select * from (select a.lai_yuan_qu_dao_,SUM(IFNULL(a.qznum,0)) as qznum ,SUM(IFNULL(a.yxnum,0)) as ynnum,SUM(IFNULL(a.khnum,0)) as khnum,IFNULL(b.lei_bie_,'空') as lei_bie_ from (((select COUNT(lai_yuan_qu_dao_) as qznum, lai_yuan_qu_dao_, null as yxnum,null as khnum from t_qzkhb where create_time_ like '"+date+"%' GROUP BY lai_yuan_qu_dao_) UNION (select null, lai_yuan_qu_dao_, COUNT(lai_yuan_qu_dao_) as yxnum,null from t_yxkh where create_time_ like '"+date+"%' GROUP BY lai_yuan_qu_dao_) UNION (select null, lai_yuan_qu_dao_,null, COUNT(lai_yuan_qu_dao_) as khnum from t_khxx where create_time_ like '"+date+"%' GROUP BY lai_yuan_qu_dao_)) as a LEFT JOIN (select t_qdgl.id_,t_qdlbb.lei_bie_ from t_qdgl LEFT JOIN t_qdlbb on t_qdgl.qu_dao_lei_bie_ = t_qdlbb.id_) as b on a.lai_yuan_qu_dao_ = b.id_) GROUP BY b.lei_bie_ UNION select null,0,0,0,lei_bie_ from t_qdlbb) as c GROUP BY c.lei_bie_"
+        curdPost('sql',sql).then(res=>{
+          let arr = res.variables.data
+          for (var i = 0; i < arr.length; i++) {
+            if (arr[i].lei_bie_ != "空") {//判断key为999的对象是否存在，
+              this.msArr.push(arr[i])
+            }
+          }
+        })
+      },
+      getIndividualPerformanceMonth(date){
+        this.inArr.length = 0
+        let sql = "select * from (select IFNULL(d.lei_bie_,'空') as lei_bie_ ,SUM(t_mjwtsqb.zong_jia_) as jiage from (select * from t_bjd LEFT JOIN (select a.id_ as leibieid,a.lai_yuan_qu_dao_ as laiyuan,b.id_ as qudaoid, b.lei_bie_ from ((select id_, lai_yuan_qu_dao_ from t_qzkhb GROUP BY id_) UNION (select id_, lai_yuan_qu_dao_ from t_yxkh GROUP BY id_) UNION (select ke_hu_ming_cheng_, lai_yuan_qu_dao_ as khnum from t_khxx GROUP BY ke_hu_ming_cheng_)) as a LEFT JOIN (select t_qdgl.id_,t_qdlbb.lei_bie_ from t_qdgl LEFT JOIN t_qdlbb on t_qdgl.qu_dao_lei_bie_ = t_qdlbb.id_) as b on a.lai_yuan_qu_dao_ = b.id_) as c on t_bjd.ke_hu_ming_cheng_ = c.leibieid where c.lei_bie_ is not NULL and t_bjd.sheng_xiao_shi_ji like '"+date+"%') as d left join t_mjwtsqb on t_mjwtsqb.he_tong_bian_hao_ = d.id_ WHERE t_mjwtsqb.shi_fou_guo_shen_ = '1' GROUP BY d.lei_bie_ UNION select lei_bie_,0 from t_qdlbb) as c GROUP BY c.lei_bie_"
+        curdPost('sql',sql).then(res=>{
+          let arr = res.variables.data
+          for (var i = 0; i < arr.length; i++) {
+            if (arr[i].lei_bie_ != "空") {//判断key为999的对象是否存在，
+              this.inArr.push(arr[i])
+            }
+          }
+        })
+      },
+      // getIndividualPerformanceCustomerMonth(date){
+      //   let sql = "select d.zhuan_huan_ke_hu_ ,SUM(t_mjwtsqb.zong_jia_) as jiage from (select * from t_bjd LEFT JOIN (select a.id_ as leibieid,a.lai_yuan_qu_dao_ as laiyuan,b.id_ as qudaoid, b.lei_bie_ from ((select id_, lai_yuan_qu_dao_ from t_qzkhb GROUP BY id_) UNION (select id_, lai_yuan_qu_dao_ from t_yxkh GROUP BY id_) UNION (select ke_hu_ming_cheng_, lai_yuan_qu_dao_ as khnum from t_khxx GROUP BY ke_hu_ming_cheng_)) as a LEFT JOIN (select t_qdgl.id_,t_qdlbb.lei_bie_ from t_qdgl LEFT JOIN t_qdlbb on t_qdgl.qu_dao_lei_bie_ = t_qdlbb.id_) as b on a.lai_yuan_qu_dao_ = b.id_) as c on t_bjd.ke_hu_ming_cheng_ = c.leibieid where c.lei_bie_ is not NULL and t_bjd.sheng_xiao_shi_ji like '"+date+"%') as d left join t_mjwtsqb on t_mjwtsqb.he_tong_bian_hao_ = d.id_ WHERE t_mjwtsqb.shi_fou_guo_shen_ = '1' GROUP BY d.zhuan_huan_ke_hu_"
+      //   curdPost('sql',sql).then(res=>{
+      //     let arr = res.variables.data
+      //     for (var i = 0; i < arr.length; i++) {
+      //       if (arr[i].lei_bie_ != "空") {//判断key为999的对象是否存在，
+      //         this.orArr.push(arr[i])
+      //       }
+      //     }
+      //     console.log(this.orArr,'oraaaaaaa')
+      //   })
+      // }
+      getTeamPerformance(date){
+        this.teArr.length = 0
+        date = date.split('-')[0]
+        let sql = "select f.* from (select e.bian_zhi_ren_,ibps_party_employee.NAME_,e.jiage from (select d.bian_zhi_ren_,SUM(t_mjwtsqb.zong_jia_) as jiage from (select * from t_bjd LEFT JOIN (select a.id_ as leibieid,a.lai_yuan_qu_dao_ as laiyuan,b.id_ as qudaoid, b.lei_bie_ from ((select id_, lai_yuan_qu_dao_ from t_qzkhb GROUP BY id_) UNION (select id_, lai_yuan_qu_dao_ from t_yxkh GROUP BY id_) UNION (select ke_hu_ming_cheng_, lai_yuan_qu_dao_ as khnum from t_khxx GROUP BY ke_hu_ming_cheng_)) as a LEFT JOIN (select t_qdgl.id_,t_qdlbb.lei_bie_ from t_qdgl LEFT JOIN t_qdlbb on t_qdgl.qu_dao_lei_bie_ = t_qdlbb.id_) as b on a.lai_yuan_qu_dao_ = b.id_) as c on t_bjd.ke_hu_ming_cheng_ = c.leibieid where c.lei_bie_ is not NULL and t_bjd.sheng_xiao_shi_ji like '"+date+"%') as d left join t_mjwtsqb on t_mjwtsqb.he_tong_bian_hao_ = d.id_ WHERE t_mjwtsqb.shi_fou_guo_shen_ = '1' GROUP BY d.bian_zhi_ren_) as e LEFT JOIN ibps_party_employee on e.bian_zhi_ren_ = ibps_party_employee.id_ UNION select ibps_party_user_role.USER_ID_, ibps_party_employee.NAME_,0  from ibps_party_user_role left join ibps_party_employee on ibps_party_employee.id_ = ibps_party_user_role.USER_ID_ where ibps_party_user_role.ROLE_ID_ in ('975000880065544192','975002200981897218','975002506553720832','990951427796893696') and ibps_party_employee.NAME_ is not null) as f GROUP BY f.bian_zhi_ren_"
+        curdPost('sql',sql).then(res=>{
+          let arr = res.variables.data
+          for (var i = 0; i < arr.length; i++) {
+            // if (arr[i].lei_bie_ != "空") {
+              this.teArr.push(arr[i])
+            // }
+          }
+        })
+      },
+      getTeamPerformanceMonth(date){
+        this.tmArr.length = 0
+        let sql = "select f.* from (select e.bian_zhi_ren_,ibps_party_employee.NAME_,e.jiage from (select d.bian_zhi_ren_,SUM(t_mjwtsqb.zong_jia_) as jiage from (select * from t_bjd LEFT JOIN (select a.id_ as leibieid,a.lai_yuan_qu_dao_ as laiyuan,b.id_ as qudaoid, b.lei_bie_ from ((select id_, lai_yuan_qu_dao_ from t_qzkhb GROUP BY id_) UNION (select id_, lai_yuan_qu_dao_ from t_yxkh GROUP BY id_) UNION (select ke_hu_ming_cheng_, lai_yuan_qu_dao_ as khnum from t_khxx GROUP BY ke_hu_ming_cheng_)) as a LEFT JOIN (select t_qdgl.id_,t_qdlbb.lei_bie_ from t_qdgl LEFT JOIN t_qdlbb on t_qdgl.qu_dao_lei_bie_ = t_qdlbb.id_) as b on a.lai_yuan_qu_dao_ = b.id_) as c on t_bjd.ke_hu_ming_cheng_ = c.leibieid where c.lei_bie_ is not NULL and t_bjd.sheng_xiao_shi_ji like '"+date+"%') as d left join t_mjwtsqb on t_mjwtsqb.he_tong_bian_hao_ = d.id_ WHERE t_mjwtsqb.shi_fou_guo_shen_ = '1' GROUP BY d.bian_zhi_ren_) as e LEFT JOIN ibps_party_employee on e.bian_zhi_ren_ = ibps_party_employee.id_ UNION select ibps_party_user_role.USER_ID_, ibps_party_employee.NAME_,0  from ibps_party_user_role left join ibps_party_employee on ibps_party_employee.id_ = ibps_party_user_role.USER_ID_ where ibps_party_user_role.ROLE_ID_ in ('975000880065544192','975002200981897218','975002506553720832','990951427796893696') and ibps_party_employee.NAME_ is not null) as f GROUP BY f.bian_zhi_ren_"
+        curdPost('sql',sql).then(res=>{
+          let arr = res.variables.data
+          for (var i = 0; i < arr.length; i++) {
+            // if (arr[i].lei_bie_ != "空") {//判断key为999的对象是否存在，
+              this.tmArr.push(arr[i])
+            // }
+          }
+        })
+      },
+      getpersonPerformanceAll(date){
+        this.peArr.length = 0
+        date = date.split('-')[0]
+        let tempid = this.$store.state.ibps.user.info.user.id
+
+        //生成月份和数据数组
+        let numArr=(new Array(12).fill('')).map((v,k)=>{
+          return ((k+1)+'')
+        })
+        let sqlArr=(new Array(12).fill(0))
+
+        let sql = "select e.*,SUM(e.jiage) as jiageAll,ibps_party_employee.NAME_ from (select d.*,t_mjwtsqb.zong_jia_ as jiage from (select * from t_bjd LEFT JOIN (select a.id_ as leibieid,a.lai_yuan_qu_dao_ as laiyuan,b.id_ as qudaoid, b.lei_bie_ from ((select id_, lai_yuan_qu_dao_ from t_qzkhb GROUP BY id_) UNION (select id_, lai_yuan_qu_dao_ from t_yxkh GROUP BY id_) UNION (select ke_hu_ming_cheng_, lai_yuan_qu_dao_ as khnum from t_khxx GROUP BY ke_hu_ming_cheng_)) as a LEFT JOIN (select t_qdgl.id_,t_qdlbb.lei_bie_ from t_qdgl LEFT JOIN t_qdlbb on t_qdgl.qu_dao_lei_bie_ = t_qdlbb.id_) as b on a.lai_yuan_qu_dao_ = b.id_) as c on t_bjd.ke_hu_ming_cheng_ = c.leibieid where c.lei_bie_ is not NULL and t_bjd.sheng_xiao_shi_ji like '"+date+"%' and t_bjd.bian_zhi_ren_ = '"+tempid+"') as d left join t_mjwtsqb on t_mjwtsqb.he_tong_bian_hao_ = d.id_ WHERE t_mjwtsqb.shi_fou_guo_shen_ = '1' ) as e LEFT JOIN ibps_party_employee on e.bian_zhi_ren_ = ibps_party_employee.id_ GROUP BY MONTH(e.sheng_xiao_shi_ji) ORDER BY e.sheng_xiao_shi_ji desc"
+        curdPost('sql',sql).then(res=>{
+          let arr = res.variables.data
+          for (var i = 0; i < arr.length; i++) {
+            let getnum = new Date(arr[i].sheng_xiao_shi_ji).getMonth()
+            sqlArr[getnum] = arr[i].jiageAll
+          }
+          this.peArr.push(numArr)
+          this.peArr.push(sqlArr)
+        })
+      },
+      getpersonPerformanceMonth(date,num){
+        this.pmArr.length = 0
+        let tempid = this.$store.state.ibps.user.info.user.id
+
+        //生成月份和数据数组
+        let numArr=(new Array(num).fill('')).map((v,k)=>{
+          return ((k+1)+'')
+        })
+        let sqlArr=(new Array(num).fill(0))
+
+        let sql = "select e.*,SUM(e.jiage) as jiageAll,ibps_party_employee.NAME_ from (select d.*,t_mjwtsqb.zong_jia_ as jiage from (select * from t_bjd LEFT JOIN (select a.id_ as leibieid,a.lai_yuan_qu_dao_ as laiyuan,b.id_ as qudaoid, b.lei_bie_ from ((select id_, lai_yuan_qu_dao_ from t_qzkhb GROUP BY id_) UNION (select id_, lai_yuan_qu_dao_ from t_yxkh GROUP BY id_) UNION (select ke_hu_ming_cheng_, lai_yuan_qu_dao_ as khnum from t_khxx GROUP BY ke_hu_ming_cheng_)) as a LEFT JOIN (select t_qdgl.id_,t_qdlbb.lei_bie_ from t_qdgl LEFT JOIN t_qdlbb on t_qdgl.qu_dao_lei_bie_ = t_qdlbb.id_) as b on a.lai_yuan_qu_dao_ = b.id_) as c on t_bjd.ke_hu_ming_cheng_ = c.leibieid where c.lei_bie_ is not NULL and t_bjd.sheng_xiao_shi_ji like '"+date+"%' and t_bjd.bian_zhi_ren_ = '"+tempid+"') as d left join t_mjwtsqb on t_mjwtsqb.he_tong_bian_hao_ = d.id_ WHERE t_mjwtsqb.shi_fou_guo_shen_ = '1' ) as e LEFT JOIN ibps_party_employee on e.bian_zhi_ren_ = ibps_party_employee.id_ GROUP BY e.sheng_xiao_shi_ji ORDER BY e.sheng_xiao_shi_ji desc"
+        curdPost('sql',sql).then(res=>{
+          let arr = res.variables.data
+          for (var i = 0; i < arr.length; i++) {
+            let getnum = new Date(arr[i].sheng_xiao_shi_ji).getDate()
+            sqlArr[getnum-1] = arr[i].jiageAll
+          }
+          this.pmArr.push(numArr)
+          this.pmArr.push(sqlArr)
+        })
+      },
+      authorityJudgment(){
+        let roleArr = ['990951427796893696','991712425210281984','1016367180226232320','1017190907927068672']
+        let temp = this.$store.state.ibps.user.info.role
+        for (let i = 0; i < temp.length; i++) {
+          if(roleArr.indexOf(temp[i].id)!=-1){
+            this.authority = true
+            break;
+          }
+        }
+      }
+    }
   }
 </script>
+<style lang="scss" scoped>
+  #dv-full-screen-container {
+    background-image: url('./img/stars.png');
+    background-size: 100% 100%;
+    box-shadow: 0 0 3px blue;
+    display: flex;
+    flex-direction: column;
+    display: flex;
+    flex-direction:column;
+    align-items: stretch;
+    color: #fff;
+  }
+  .bgAll{
+    height: 100%;
+  }
+  
+  .pickDate{
+    height:2.825rem;
+    line-height: 2.825rem;
+    text-align:center;
+    // float: left;
+    display: flex;
+    justify-content: space-between;
+    margin: -3% 10% 0;
+  }
+  .customerC{
+    display: flex;
+    justify-content: space-between;
+    margin: 1% 1% 0;
+    height: 40% !important;
+    .dv-border-box-7{
+      width: 32.67%;
+    }
+  }
+  .customerD{
+    display: flex;
+    justify-content: space-between;
+    margin: 1% 1% 0;
+    height: 40% !important;
+    .dv-border-box-7{
+      width: 49.5%;
+    }
+  }
+  .customerG{
+    display: flex;
+    justify-content: space-between;
+    flex-wrap: wrap;
+    margin: 1% 1% 0;
+    height: 90% !important;
+    .dv-border-box-7{
+      width: 49.5%;
+      height: 97%;
+    }
+  }
+  .ttitle{
+    height: 100%;
+    div{height:100%;}
+    .middleFont{
+      text-align: center;
+      height: 13%;
+      display: flex;
+		  align-items: center;
+      justify-content: center;
+    }
+    .nullDate{
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      font-size: 36px;
+    }
+  }
+</style>