触达效果

src/views/ecm/touch-clue.vue

@@ -14,7 +14,7 @@
           <span v-for="(item, index) in listTabs" :key="index" :class="{ active: index == listTabsIndex }" @click="changeListTab(index)">{{ item }}</span>
         </div>
         <div class="tab2">
-          <span v-for="item in listTabsIndex == 1 ? touchTabs : taskTabs" :key="item.value" :class="{ active2: item.value == tabsIndex }" @click="changeTabs(item.value)">{{ item.name }}</span>
+          <span v-for="item in listTabsIndex == 1 ? touchTabs : taskTabs" :key="item.value" :class="{ active2: listTabsIndex == 1 ? item.value == tabsIndex : item.value == taskTabIndex }" @click="changeTabs(item.value)">{{ item.name }}</span>
         </div>
       </div>
       <el-table tooltipEffect="light" :data="tableList" style="width: 100%" element-loading-text="拼命加载中" @sort-change="sortChange" :style="{ marginTop: '20px', padding: '0 20px 0 22px' }">
@@ -83,6 +83,7 @@ export default {
       ],
       listTabs: ['任务完成情况', '触达效果'],
       tabsIndex: 0,
+      taskTabIndex: 1,
       listTabsIndex: 1,
       type: 1, // 1导购 2后台
       marketListData: [],
@@ -115,7 +116,13 @@ export default {
       this.getTableList();
     },
     changeTabs(index) {
-      this.tabsIndex = index;
+      if (this.listTabsIndex == 1) {
+        if (this.tabsIndex == index) return;
+        this.tabsIndex = index;
+      } else {
+        if (this.taskTabIndex == index) return;
+        this.taskTabIndex = index;
+      }
       this.getTableFirstData();
     },
     changeListTab(index) {
@@ -126,15 +133,15 @@ export default {
       let meth;
       if (this.type == 1) meth = ecmGuideCluesTable;
       else if (this.type == 2) meth = ecmHeadGuideCluesTable;
-      meth({ ecmPlanId: 1 }).then(res => {
-        let data = res.result;
+      meth({ ecmPlanId: this.$route.query.id }).then(res => {
+        let data = res.result || {};
         if (this.type == 1) {
           // 导购线索时，加入一个标识，方便组件判断，同时计算任务完成率
           data.taskRate = (data.cplTaskTotalCnt / data.taskCnt) * 100;
           data.flag = true;
         }
-        data.touchRate = parseFloat(((data.touchMbrNum / data.planMbrNum) * 100).toFixed(2));
-        data.transformRate = parseFloat(((data.convMbrNum / data.touchMbrNum) * 100).toFixed(2));
+        data.touchRate = data ? parseFloat(((data.touchMbrNum / data.planMbrNum) * 100).toFixed(2)) : 0;
+        data.transformRate = data ? parseFloat(((data.convMbrNum / data.touchMbrNum) * 100).toFixed(2)) : 0;
         this.marketListData = [{ ...data }];
       });
     },
@@ -149,6 +156,7 @@ export default {
             fixed: 'left',
             formatter(row) {
               let color = '#F0F5FF';
+              if (!row) return;
               if (row.index == 1) {
                 color = '#F5222D';
               } else if (row.index == 2) {
@@ -179,6 +187,7 @@ export default {
             align: 'left',
             fixed: 'left',
             formatter(row) {
+              if (!row) return;
               let color = '#F0F5FF';
               if (row.index == 1) {
                 color = '#F5222D';
@@ -204,7 +213,7 @@ export default {
     },
     getTableList() {
       let meth;
-      let params = { ecmPlanId: 1, pageNum: this.currentPage, pageSize: this.pageSize, orderBy: this.orderBy ? this.orderBy : '' };
+      let params = { ecmPlanId: this.$route.query.id, pageNum: this.currentPage, pageSize: this.pageSize, orderBy: this.orderBy ? this.orderBy : '' };
       if (this.type == 2) {
         // 后台线索
         meth = ecmHeadCluesTaskTab;
@@ -214,7 +223,7 @@ export default {
         if (this.listTabsIndex == 0) {
           // 任务完成情况
           meth = ecmGuideCluesTaskTable;
-          params.taskType = this.tabsIndex;
+          params.taskType = this.taskTabIndex;
         } else {
           if (this.tabsIndex == 0) {
             // 整体计划tab是单独的接口
@@ -231,18 +240,18 @@ export default {
           // 任务完成情况无表头
           let resetArr = [];
           resetArr[0] = this.tableFirstData;
-          this.tableList = resetArr.concat(res.result.result);
+          res.result.result && (this.tableList = resetArr.concat(res.result.result));
         } else {
-          this.tableList = res.result.result;
+          this.tableList = res.result.result || [];
         }
         this.total = res.result.totalCount;
-        this.getTableHeader();
         this.loading = false;
       });
+      this.tableList.length && this.getTableHeader();
     },
     getTableFirstData() {
       let meth;
-      let params = { ecmPlanId: 1 };
+      let params = { ecmPlanId: this.$route.query.id };
       if (this.type == 2) meth = ecmHeadCluesTaskTabHead;
       else {
         if (this.listTabsIndex == 1) {

src/views/ecm/touch-components/market-list.vue

@@ -23,15 +23,15 @@
       <div class="right" :class="[isCluePage ? 'cluePage' : '']">
         <div v-if="!isCluePage">
           <p>计划人次</p>
-          <p>{{ item.planMbrTimes.toLocaleString() }}</p>
+          <p>{{ item.planMbrTime && item.planMbrTimes.toLocaleString() }}</p>
         </div>
         <div>
           <p>{{ isCluePage ? '计划触达人数' : '计划人数' }}</p>
-          <p>{{ item.planMbrNum.toLocaleString() }}</p>
+          <p>{{ item.planMbrNum && item.planMbrNum.toLocaleString() }}</p>
         </div>
         <div v-if="isCluePage && item.flag">
           <p>
-            任务完成率<span>（任务总数 {{ item.taskCnt.toLocaleString() }}）</span>
+            任务完成率<span>（任务总数 {{ item.taskCnt && item.taskCnt.toLocaleString() }}）</span>
           </p>
           <p>{{ item.taskRate ? item.taskRate.toFixed(2) + '%' : '-' }}</p>
         </div>
@@ -39,17 +39,17 @@
           <p>
             触达人数<span>（触达率 {{ item.touchRate + '%' }}）</span>
           </p>
-          <p>{{ item.touchMbrNum.toLocaleString() }}</p>
+          <p>{{ item.touchMbrNum && item.touchMbrNum.toLocaleString() }}</p>
         </div>
         <div>
           <p>
             转化人数<span :class="{ active: item.isSales == 0 && data[0].transformRate < data[1].transformRate }">（转化率 {{ item.transformRate + '%' }}）</span>
           </p>
-          <p>{{ item.convMbrNum.toLocaleString() }}</p>
+          <p>{{ item.convMbrNum && item.convMbrNum.toLocaleString() }}</p>
         </div>
         <div>
           <p>转化订单数</p>
-          <p>{{ item.convOrderCnt.toLocaleString() }}</p>
+          <p>{{ item.convOrderCnt && item.convOrderCnt.toLocaleString() }}</p>
         </div>
         <div>
           <p>转化收益</p>

src/views/ecm/touch-components/touch-charts.vue

@@ -96,11 +96,10 @@ export default {
     },
     getChartData() {
       let meth;
-      console.log('charts', this.type);
       if (this.type == 0) meth = ecmTouchEffectColumnDiagram;
       else if (this.type == 1) meth = ecmGuideCluesColumnDiagram;
       else meth = ecmHeadCluesColumnDiagram;
-      meth({ ecmPlanId: 1 }).then(res => {
+      meth({ ecmPlanId: this.$route.query.id }).then(res => {
         this.chartData = res.result.map(item => {
           if (item.name == '线索转化收益') {
             item.rate = item.vaule * 1;

src/views/ecm/touch-effect.vue

@@ -76,7 +76,8 @@ export default {
       marketListData: [],
       funnelData: [],
       clueRate: [],
-      loading: true
+      loading: true,
+      ecmPlanId: ''
     };
   },
   components: {
@@ -85,6 +86,7 @@ export default {
     funnel
   },
   mounted() {
+    this.ecmPlanId = this.$route.params.id;
     let planName = this.$route.query.name;
     this.$store.commit('mutations_breadcrumb', [{ name: '营销管理', path: '' }, { name: '智能营销', path: '/ecm' }, { name: `${planName} - 触达效果` }]); // eslint-disable-line
     this.getMarketList();
@@ -94,11 +96,12 @@ export default {
     toClue(type) {
       let planName = this.$route.query.name;
       let id = this.$route.params.id;
+      this.ecmPlanId = id;
       // type 1为导购线索 2为后台线索
       this.$router.push({ path: '/ecm/clue', query: { planName, id, type } });
     },
     getMarketList() {
-      ecmTouchEffectTable({ ecmPlanId: 1 }).then(res => {
+      ecmTouchEffectTable({ ecmPlanId: this.ecmPlanId }).then(res => {
         this.marketListData = res.result.map(item => {
           item.touchRate = parseFloat(((item.touchMbrNum / item.planMbrNum) * 100).toFixed(2));
           item.transformRate = parseFloat(((item.convMbrNum / item.touchMbrNum) * 100).toFixed(2));
@@ -107,7 +110,7 @@ export default {
       });
     },
     getFunnelData() {
-      ecmTouchEffectFunnelChart({ ecmPlanId: 1 }).then(res => {
+      ecmTouchEffectFunnelChart({ ecmPlanId: this.ecmPlanId }).then(res => {
         this.funnelData = this.formatFunnelData(res.result);
         this.clueRate = res.result.map(item => {
           if (item.线索转化收益) {