Merge branch 'fsms_2.9'

src/assets/svg-icons/common/infoReverse.svg

@@ -0,0 +1,3 @@
+<svg width="16" height="16" viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg">
+<path d="M15 8C15 11.866 11.866 15 8 15C4.134 15 0.999998 11.866 1 8C1 4.134 4.13401 0.999998 8 1C11.866 1 15 4.13401 15 8ZM8.5 4.0003H7.5V9.49999H8.5V4.0003ZM7.39429 11V12.2H8.59429V11H7.39429Z"/>
+</svg>

src/views/financialStatistics/businessIncome.vue

@@ -8,7 +8,7 @@
   const basicOptions=baseOptions()
 
   const dimensionArray=[{label:'月度',tag:0},{label:'季度',tag:1},{label:'半年度',tag:2},{label:'年度',tag:3},{label:'月度累计',tag:4}]
-  const customerTypeArray=[{label:'全部',value:0},{label:'新客户',value:1},{label:'老客户',value:2}]
+  const customerTypeArray=[{label:'全部',value:0},{label:'新客户',value:1},{label:'老客户',value:2},{label:'未续约',value:3}]
   const sellerArray=ref(null)
 
   const searchParams=reactive({
@@ -55,6 +55,24 @@
     })
   }
 
+  const barSeriesSetting={
+    data: [],
+    type: 'bar',
+    name:'业务收入金额'
+  }
+  const lineSeriesSetting={
+    data: [],
+    type: 'line',
+    lineStyle:{
+      width:3
+    },
+    yAxisIndex:1,
+    name:'同比值',
+    connectNulls:true,
+    symbol:'circle',
+    symbolSize:2
+  }
+
   const initOptions=()=>{
     chartOptions.value.title.text = "业务收入金额统计图"
     chartOptions.value.title.textStyle.color='#333333'
@@ -70,50 +88,76 @@
       }
     }
     chartOptions.value.yAxis[0].splitNumber=8
-    chartOptions.value.yAxis[1]={
-      alignTicks:true,
-      axisLabel:{
-        color:'#999',
-        formatter:(value)=>{
-          // 防止失真
-          return Math.round(value*10000)/10000
-        }
-      },
-      splitLine:{
-        lineStyle:{
-          type:'dashed'
-        }
-      },
-      splitNumber:8
-    }
       
     // 数据配置
     chartOptions.value.series=[
-      {
-        data: [],
-        type: 'bar',
-        name:'业务收入金额'
-      },
-      {
-        data: [],
-        type: 'line',
-        lineStyle:{
-          width:3
-        },
-        yAxisIndex:1,
-        name:'同比值',
-        connectNulls:true,
-        symbol:'circle',
-        symbolSize:2
-      }
+      barSeriesSetting,
+      lineSeriesSetting
     ]
   }
+  
   const getList=()=>{
     loading.list=true
     getIncomeChartData(searchParams).then(res=>{
+
+      if(searchParams.company_type == 3){
+        // 未续约
+        chartOptions.value.yAxis[1]={
+          name:'万元',
+          type: 'value',
+          nameGap:20,
+          splitNumber:10,
+          alignTicks:true,
+          nameTextStyle:{
+            align:'left',
+            color:'#999'
+          },
+          axisLabel:{
+            color:'#999',
+            formatter:(value)=>{
+              return Math.round(value*100)/1000000
+            }
+          }
+        }
+        if(searchParams.list_param==0){
+          // 月度
+          chartOptions.value.series=[
+            {...barSeriesSetting,name:'未续约客户收入金额'},
+            {...lineSeriesSetting,name:'移动平均值'}
+          ]
+        }else{
+          chartOptions.value.series=[
+            {...barSeriesSetting,name:'未续约客户收入金额'}
+          ]
+        }
+      }else{
+        chartOptions.value.yAxis[1]={
+          alignTicks:true,
+          axisLabel:{
+            color:'#999',
+            formatter:(value)=>{
+              // 防止失真
+              return Math.round(value*10000)/10000
+            }
+          },
+          splitLine:{
+            lineStyle:{
+              type:'dashed'
+            }
+          },
+          splitNumber:8
+        }
+        chartOptions.value.series=[
+          barSeriesSetting,
+          lineSeriesSetting
+        ]
+      }
+
       let dates = res.data.Date || []
       chartOptions.value.series[0].data=dates.map((item,index)=> [item,res.data.TotalMoney[index]])
-      chartOptions.value.series[1].data=dates.map((item,index)=> [item,res.data.Yoy[index]])
+      if(chartOptions.value.series[1]){
+        chartOptions.value.series[1].data=dates.map((item,index)=> [item,res.data.Yoy[index]])
+      }
       loading.list=false
     }).catch(err=>{
       if(!err.__CANCEL__){
@@ -163,6 +207,21 @@
       </div>
       <div class="business-income-chart" v-loading="loading.list" element-loading-text="图表加载中……">
         <chart :options="chartOptions" style="width: 75%;height: 80%;"/>
+        <el-tooltip placement="top-end">
+          <span class="notRenewed-legend-hint" v-show="searchParams.company_type==3">
+            <el-icon size="16px" style="margin-right:4px ;">
+              <svg-icon name="svgIcon-common-infoReverse" color="var(--themeColor)"></svg-icon>
+            </el-icon>
+            <span>图例说明</span>
+          </span>
+          <template #content>
+            <div>
+              未续约收入金额=去年同期老客户收入金额-当期老客户收入金额。
+              <br />
+              移动平均值：移动间隔长度为3个月。
+            </div>
+          </template>
+        </el-tooltip>
       </div>
     </div>
 </template>
@@ -189,6 +248,17 @@
       display: flex;
       justify-content: center;
       align-items: center;
+      position: relative;
+      .notRenewed-legend-hint{
+        position: absolute;
+        right: 30px;
+        top: 20px;
+        cursor: pointer;
+        font-size: 14px;
+        color: $themeColor;
+        display: flex;
+        align-items: center;
+      }
     }
 
   }

src/views/financialStatistics/salesStatistics.vue

@@ -2,10 +2,13 @@
   import {getSellerGroupStatisticsList,getSellerStatisticsList} from '@/api/financialStatistics'
   import {getSellerGroupList} from '@/api/crm'
   import {downloadByFlow} from '@/utils/common-methods'
-
-  
+  const moment = inject('$moment')
 
   const sortFiledMap = new Map([['invoice_amount',1],['group_rate',2],['seller_rate',3]])
+  const customerTypeArray=[{label:'全部',value:0},{label:'新客户',value:1},{label:'老客户',value:2}]
+  const dateButtonData=[{text:'近1周',tabId:1,type:'week',diff:1},{text:'近1月',tabId:2,type:'month',diff:1},
+  {text:'近2月',tabId:3,type:'month',diff:2},{text:'近3月',tabId:4,type:'month',diff:3},{text:'今年以来',tabId:5,type:'year',diff:1}]
+
   let groupList=ref([])
   const tabType=ref(1)
   const statisticsData=reactive({
@@ -26,11 +29,16 @@
     // 是否导出：0-否；1-是
     is_export:0,
     // 销售类型 1-ficc销售 2-权益销售
-    seller_type:1
+    seller_type:1,
+    company_type:0,
+    show_resign:false
   })
   // 搜索参数-创建时间数组
   const createtime=ref(null)
 
+  // 日期按钮选项
+  const currentTabId=ref(0)
+
   watch(createtime,(newVal)=>{
     if(newVal){
       searchParams.start_date=newVal[0]
@@ -56,6 +64,9 @@
     searchParams.group_id=''
     searchParams.sort_field=''
     searchParams.sort_type=''
+    searchParams.company_type=0
+    searchParams.show_resign=false
+    currentTabId.value=0
     if(createtime.value===null){
       statisticsList()
     }else{
@@ -98,6 +109,19 @@
     searchStatistics()
   }
 
+  // 日期选项改变
+  const changeDateType=()=>{
+    let currentTab = dateButtonData.find(it => it.tabId == currentTabId.value)
+    if(!currentTab) return 
+    let {type,diff} = currentTab
+    let startOfType=type
+    if(type=='week'){
+      startOfType='isoWeek'
+    }
+    createtime.value=[moment().startOf(startOfType).subtract((diff-1), type+'s').format('YYYY-MM-DD'),
+      moment().format('YYYY-MM-DD')]
+  }
+
   const searchStatistics=()=>{
     searchParams.current = 1
     statisticsList()
@@ -154,9 +178,22 @@
           @change="searchStatistics" v-show="tabType==2" clearable >
             <el-option :label="item.group_name" :value="item.group_id" v-for="item in groupList"></el-option>
           </el-select>
-          <el-date-picker v-model="createtime" type="daterange" 
-          value-format="YYYY-MM-DD" style="max-width:240px;margin-bottom: 8px"
-          start-placeholder="开始日期" end-placeholder="结束日期"></el-date-picker>
+          <el-checkbox v-model="searchParams.show_resign" style="margin: 0 30px 8px 0;"
+          v-show="tabType==2" @change="searchStatistics">显示离职销售</el-checkbox>
+          <el-radio-group v-model="searchParams.company_type" size="large" @change="searchStatistics"
+          style="margin: 0 30px 8px 0;">
+            <el-radio-button v-for="item in customerTypeArray" :key="item.value" class="dimension-radio"
+            :label="item.value" >{{ item.label }}</el-radio-button>
+          </el-radio-group>
+          <div class="date-box">
+            <el-date-picker v-model="createtime" type="daterange" @change="currentTabId=0"
+            value-format="YYYY-MM-DD" style="max-width:240px;margin-right: 30px"
+            start-placeholder="开始日期" end-placeholder="结束日期"></el-date-picker>
+            <el-radio-group v-model="currentTabId" size="large" @change="changeDateType">
+              <el-radio-button v-for="item in dateButtonData" :key="item.tabId" class="dimension-radio"
+              :label="item.tabId" >{{ item.text }}</el-radio-button>
+            </el-radio-group>
+          </div>
         </div>
         <div class="statistice-buttons-zone">
           <el-button @click="statisticeExport" class="element-common-button" size="large">导出</el-button>
@@ -188,7 +225,7 @@
           </el-table-column>
           <el-table-column label="全员占比" prop="seller_rate" align="center" sortable="custom" v-if="tabType==2">
             <template #default="{row}">
-              {{ row.seller_rate+'%' }}
+              {{ (row.seller_rate || '0.00')+'%' }}
             </template>
           </el-table-column>
           <template #empty>
@@ -230,13 +267,37 @@
         display: flex;
         align-items: center;
         flex-wrap: wrap;
-        margin-right: 30px;
+        // margin-right: 30px;
         .statistics-search-item{
           width: 200px;
           margin-bottom: 8px;
           margin-right: 30px;
         }
+        .date-box{
+          display: flex;
+          align-items: center;
+          margin: 0 30px 8px 0;
+        }
       }
     }
   }
+</style>
+<style lang="scss">
+#sales-statistics-container{
+  .el-radio-group{
+    flex-wrap: nowrap;
+  }
+  .dimension-radio{
+    span{
+      display: inline-block;
+      color: $hitTextColorTwo;
+      padding: 12px 12px;
+    }
+  }
+  .is-active{
+    span{
+      color:white
+    }
+  }
+}
 </style>