销售漏斗，新增阶段筛选

src/views/mediaStatistics/modules/boxBorder.vue

@@ -1,7 +1,10 @@
 <template>
   <div class="box-border-style" :style="{height:height}">
     <div :style="{padding:class1}">
-      <div class="font-color-style-black font-class-bold mt-5">{{$t(title)}}</div>
+      <div style="display: flex;justify-content: space-between">
+        <div class="font-color-style-black font-class-bold mt-5">{{$t(title)}}</div>
+        <slot name="select"></slot>
+      </div>
       <slot name="content"></slot>
       <slot name="charts"></slot>
     </div>
@@ -13,7 +16,7 @@ export default {
   name: "boxBorder",
   props:{
     title:String,
-    class1:Object,
+    class1:String,
     height:String
   }
 }

src/views/mediaStatistics/modules/futureTwelveMonths.vue

@@ -1,6 +1,19 @@
 <template>
   <div>
     <boxBorder title="未来12月项目预计签约金额/预计成交金额分析" class1="20px 20px" height="282px">
+      <template slot="select">
+        <div>
+          <label class="search__label">{{$t(`项目阶段`)}}：</label>
+          <el-select v-model="stagename" multiple placeholder="请选择" size="small" @focus="getStage" @change="selectStage" filterable style="width: 370px">
+            <el-option
+                v-for="item in stagenameList"
+                :key="item.stagename"
+                :label="item.stagename"
+                :value="item.stagename">
+            </el-option>
+          </el-select>
+        </div>
+      </template>
       <template slot="charts">
         <el-tooltip effect="dark" placement="top-start" style="margin-top: 3px;margin-left:275px;position: relative;z-index: 50">
           <div slot="content">
@@ -36,6 +49,8 @@ export default {
     return {
       chartMap:[],
       chartMapData:[],
+      stagename:[],
+      stagenameList:[]
     }
   },
   methods:{
@@ -103,6 +118,28 @@ export default {
       }else {
         this.chartMap.changeData(this.chartMapData)
       }
+    },
+    /*获取项目阶段*/
+    async getStage(){
+      if (this.stagenameList.length == 0){
+        const res = await this.$api.requested({
+          "id": 20221128143604,
+          "content": {
+            "pageNumber": 1,
+            "pageSize": 99,
+            "where": {
+              "condition": "",
+              "allprojecttype":"",
+              "projecttype":""
+            }
+          }
+        })
+        this.stagenameList = res.data
+      }
+    },
+    selectStage(){
+      console.log(this.stagename,'阶段名称')
+      this.$emit('selectStage',this.stagename)
     }
   }
 }

src/views/mediaStatistics/modules/salesfunnel.vue

@@ -91,7 +91,7 @@
     <div v-if="siteid == 'HY' || siteid == 'YOSTEST1'">
       <p class="title">{{$t(`项目预计成交分析`)}}</p>
       <previousTwelveMonths :data="previousData"></previousTwelveMonths>
-      <futureTwelveMonths ref="futureTwelveMonthsRef" style="margin-top: 15px"></futureTwelveMonths>
+      <futureTwelveMonths ref="futureTwelveMonthsRef" style="margin-top: 15px" @selectStage="selectStage"></futureTwelveMonths>
     </div>
     <div style="margin-top: 40px">
       <p class="title">{{projectTile}}</p>
@@ -248,7 +248,19 @@ export default {
       unfinish:'1',
       siteid:JSON.parse(sessionStorage.getItem('active_account')).siteid,
       previousData:[],
-      futreData:[]
+      futreData:[],
+      transactionParam:{
+        "id": 20241028162104,
+        "content": {
+          "type": "0",
+          "dataid": "0",
+          "stagename":[],
+          "where": {
+            "tradefield": "",
+            "isleave":""
+          }
+        }
+      }
     }
   },
   methods:{
@@ -831,92 +843,89 @@ export default {
     },
     /*项目成交数据*/
     async expectedTransaction(init){
-      let param = {
-        "id": 20241028162104,
-        "content": {
-          "type": "0",
-          "dataid": "0",
-          "where": {
-            "tradefield": "",
-            "isleave":""
-          }
-        }
-      }
-      param.content.type = this.dataParam.content.type
-      param.content.dataid = this.dataParam.content.dataid
-      param.content.where.tradefield = this.dataParam.content.where.tradefield
-      param.content.where.isleave = this.dataParam.content.where.isleave
-      const res = await this.$api.requested(param)
+      this.transactionParam.content.type = this.dataParam.content.type
+      this.transactionParam.content.dataid = this.dataParam.content.dataid
+      this.transactionParam.content.where.tradefield = this.dataParam.content.where.tradefield
+      this.transactionParam.content.where.isleave = this.dataParam.content.where.isleave
+      const res = await this.$api.requested(this.transactionParam)
       console.log(res.data,'数据项目成交')
-      this.previousData = [
-        {
-          title:'成交项目数',
-          value:res.data.dealTotalCount,
-          unit:'个',
-          description:'当前状态为已成交，并且项目成交时间在前12个月（不含当前月）的项目数量',
-          color:'#3874F6'
-        },
-        {
-          title:'预计成交正偏差',
-          title1:'项目',
-          value1:res.data.positiveCount,
-          unit1:'个',
-          title2:'金额',
-          value2:this.tool.formatAmount(this.tool.unitConversion(res.data.positiveOffsetAmount,10000),2),
-          unit2:'万元',
-          description:'依据：每个项目的偏差金额 = 项目成交金额 - 预计签约金额' + '\n' + ' ①项目：合计偏差金额为正数的项目数量' + '\n' + ' ②金额：合计每个项目的正数偏差金额',
-          color:'#E6A23C'
-        },
-        {
-          title:'项目成交金额合计',
-          value:this.tool.formatAmount(this.tool.unitConversion(res.data.dealAmount,10000),2),
-          unit:'万元',
-          description:'合计当前状态为已成交，并且项目成交时间在前12个月（不含当前月）的项目订单金额',
-          color: '#009966'
-        },
-        {
-          title:'失败项目数',
-          value:res.data.failTotalCount,
-          unit:'个',
-          description:'当前状态为已失败，并且失败操作时间在前12个月（不含当前月）的项目数量',
-          color:'#3874F6'
-        },
-        {
-          title:'预计成交负偏差',
-          title1:'项目',
-          value1:res.data.negativeCount,
-          unit1:'个',
-          title2:'金额',
-          value2:this.tool.formatAmount(this.tool.unitConversion(res.data.negativeOffsetAmount,10000),2),
-          unit2:'万元',
-          description:'依据：每个项目的偏差金额 = 项目成交金额 - 预计签约金额' + '\n' + ' ①项目：合计偏差金额为负数的项目数量' + '\n' + ' ②金额：合计每个项目的负数偏差金额',
-          color:'#E6A23C'
-        },
-        {
-          title:'预计签约金额合计',
-          value:this.tool.formatAmount(this.tool.unitConversion(res.data.signAmount,10000),2),
-          unit:'万元',
-          description:'合计当前状态为已成交，并且项目成交时间在前12个月（不含当前月）的项目预计签约金额',
-          color: '#009966'
-        },
-        {
-          title:'项目成交率',
-          value:Math.round((res.data.dealRate * 100)*100)/100,
-          unit:'%',
-          description:'项目成交率 = 成交项目数 ÷ （成交项目数 + 失败项目数）×100%',
-          color:'#3874F6'
-        },
-        {
-          title:'预计成交准确率',
-          value:Math.round((res.data.rightRate * 100)*100)/100,
-          unit:'%',
-          description:'依据：偏差率 = |（项目成交金额 - 预计签约金额）| ÷ 预计签约金额 × 100%' + '\n' + ' 预计成交准确率 = 偏差率≤15%的项目数 ÷ 成交项目数 × 100%',
-          color:'#E6A23C'
-        },
-      ]
-      this.futreData = res.data.array
-      this.$refs.futureTwelveMonthsRef.chartData(init,this.futreData)
+      if (res.code == 0){
+        this.tool.showMessage(res,()=>{})
+      }else {
+        this.previousData = [
+          {
+            title:'成交项目数',
+            value:res.data.dealTotalCount,
+            unit:'个',
+            description:'当前状态为已成交，并且项目成交时间在前12个月（不含当前月）的项目数量',
+            color:'#3874F6'
+          },
+          {
+            title:'预计成交正偏差',
+            title1:'项目',
+            value1:res.data.positiveCount,
+            unit1:'个',
+            title2:'金额',
+            value2:this.tool.formatAmount(this.tool.unitConversion(res.data.positiveOffsetAmount,10000),2),
+            unit2:'万元',
+            description:'依据：每个项目的偏差金额 = 项目成交金额 - 预计签约金额' + '\n' + ' ①项目：合计偏差金额为正数的项目数量' + '\n' + ' ②金额：合计每个项目的正数偏差金额',
+            color:'#E6A23C'
+          },
+          {
+            title:'项目成交金额合计',
+            value:this.tool.formatAmount(this.tool.unitConversion(res.data.dealAmount,10000),2),
+            unit:'万元',
+            description:'合计当前状态为已成交，并且项目成交时间在前12个月（不含当前月）的项目订单金额',
+            color: '#009966'
+          },
+          {
+            title:'失败项目数',
+            value:res.data.failTotalCount,
+            unit:'个',
+            description:'当前状态为已失败，并且失败操作时间在前12个月（不含当前月）的项目数量',
+            color:'#3874F6'
+          },
+          {
+            title:'预计成交负偏差',
+            title1:'项目',
+            value1:res.data.negativeCount,
+            unit1:'个',
+            title2:'金额',
+            value2:this.tool.formatAmount(this.tool.unitConversion(res.data.negativeOffsetAmount,10000),2),
+            unit2:'万元',
+            description:'依据：每个项目的偏差金额 = 项目成交金额 - 预计签约金额' + '\n' + ' ①项目：合计偏差金额为负数的项目数量' + '\n' + ' ②金额：合计每个项目的负数偏差金额',
+            color:'#E6A23C'
+          },
+          {
+            title:'预计签约金额合计',
+            value:this.tool.formatAmount(this.tool.unitConversion(res.data.signAmount,10000),2),
+            unit:'万元',
+            description:'合计当前状态为已成交，并且项目成交时间在前12个月（不含当前月）的项目预计签约金额',
+            color: '#009966'
+          },
+          {
+            title:'项目成交率',
+            value:Math.round((res.data.dealRate * 100)*100)/100,
+            unit:'%',
+            description:'项目成交率 = 成交项目数 ÷ （成交项目数 + 失败项目数）×100%',
+            color:'#3874F6'
+          },
+          {
+            title:'预计成交准确率',
+            value:Math.round((res.data.rightRate * 100)*100)/100,
+            unit:'%',
+            description:'依据：偏差率 = |（项目成交金额 - 预计签约金额）| ÷ 预计签约金额 × 100%' + '\n' + ' 预计成交准确率 = 偏差率≤15%的项目数 ÷ 成交项目数 × 100%',
+            color:'#E6A23C'
+          },
+        ]
+        this.futreData = res.data.array
+        this.$refs.futureTwelveMonthsRef.chartData(init,this.futreData)
+      }
     },
+    selectStage(val){
+      this.transactionParam.content.stagename = val
+      this.expectedTransaction(false)
+    }
   },
   mounted () {
    /* this.renderPie()*/