update: ai营销-数据统计

src/components/dm-new-member-group/index.vue

@@ -146,10 +146,13 @@ export default {
     }
   },
   watch: {
-    selectedIds(val) {
-      if (val.length) {
-        this.echoFlag = true;
-        this.getDefaultSelected(val);
+    selectedIds: {
+      immediate: true,
+      handler(val) {
+        if (val.length) {
+          this.echoFlag = true;
+          this.getDefaultSelected(val);
+        }
       }
     }
   },

src/service/api/aiApi.js

@@ -62,7 +62,6 @@ export const getComparativeData = params => requests('/api-marketing/statistics/
 
 // 人群规则回显
 export const getMemberCrowd = params => requests('/api-plug/query-member-crowd-new', params, true);
-export const getGroupByIds = params => requests('/gic-member-tag-web/member-tag-group/queryGroupByIds', params);
 
 // 活动转化数据
 export const getPlanStatistics = params => requests('/api-marketing/statistics/plan-statistics', params, true, false, 'get');

src/views/ai/ai-data-detail.vue

@@ -29,7 +29,7 @@
           <p>{{ formatDateTimeByType(row.aiTime, 'HH:mm:ss') || '--' }}</p>
         </template>
       </el-table-column>
-      <el-table-column label="短信发送时间" min-width="110px" prop="smsSendTime">
+      <el-table-column v-if="showSendTime" label="短信发送时间" min-width="110px" prop="smsSendTime">
         <template slot-scope="{ row }">
           <p>{{ formatDateTimeByType(row.smsSendTime, 'yyyy-MM-dd') || '--' }}</p>
           <p>{{ formatDateTimeByType(row.smsSendTime, 'HH:mm:ss') || '--' }}</p>
@@ -49,6 +49,7 @@ export default {
   data() {
     return {
       formatDateTimeByType,
+      showSendTime: false,
       search: {
         activityId: '',
         search: '', // 姓名、昵称 、手机号、会员卡号
@@ -62,6 +63,7 @@ export default {
   },
   created() {
     this.search.activityId = this.$route.params.id;
+    this.showSendTime = this.$route.query.flag == 1;
     this.getData();
   },
   methods: {

src/views/ai/ai-data-report.vue

@@ -5,11 +5,19 @@
       <activity-info @flag="getFlag" @filterJson="getFilterJson"></activity-info>
     </div>
     <div class="report-module">
-      <dm-sub-title> AI外呼数据<span class="title-tip">数据实时更新</span> </dm-sub-title>
+      <dm-sub-title class="module-title">
+        AI外呼数据
+        <span class="title-tip">数据实时更新</span>
+        <el-button class="to-page-button" type="text" @click="toDetailPage">查看详情</el-button>
+      </dm-sub-title>
       <ai-data :ai-data-show="flags"></ai-data>
     </div>
     <div class="report-module" v-if="flags.analyseFlag == 1">
-      <dm-sub-title> 活动转化数据<span class="title-tip">数据每天更新 1 次</span> </dm-sub-title>
+      <dm-sub-title class="module-title">
+        活动转化数据
+        <span class="title-tip">数据每天更新 1 次</span>
+        <el-button class="to-page-button" type="text" @click="toDetailPage">查看详情</el-button>
+      </dm-sub-title>
       <conversion :member-type="flags.memberType" :filter-json="filterJson"></conversion>
     </div>
   </div>
@@ -19,14 +27,6 @@
 import ActivityInfo from './ai-data-report/activity-info.vue';
 import AiData from './ai-data-report/ai-data.vue';
 import Conversion from './ai-data-report/conversion.vue';
-// 开启活动分析时，活动信息中展示分析天数
-
-// 开启活动分析时，AI外呼数据中展示活动费用
-// 发送挂机短信时，AI外呼数据中展示短信发送总数
-
-// 开启活动分析时，展示活动转化数据
-// 会员类型为0时，活动分析中对比项支持会员类型、会员等级、金字塔会员分层
-// 会员类型为1时，活动分析对比项支持客户分组
 export default {
   name: 'AiDataReport',
   components: { ActivityInfo, AiData, Conversion },
@@ -46,6 +46,9 @@ export default {
     },
     getFilterJson(filterJson) {
       this.filterJson = filterJson;
+    },
+    toDetailPage() {
+      this.$router.push(`/ai/ai-data-detail/${this.$route.params.id}?flag=${this.flags.smsFlag}`);
     }
   }
 };
@@ -60,12 +63,22 @@ export default {
     + .report-module {
       margin-top: 16px;
     }
-    .title-tip {
-      margin-left: 16px;
-      font-size: 12px;
-      font-weight: 400;
-      color: #606266;
-      line-height: 17px;
+    .module-title {
+      position: relative;
+      .title-tip {
+        margin-left: 16px;
+        font-size: 12px;
+        font-weight: 400;
+        color: #606266;
+        line-height: 17px;
+      }
+      .to-page-button {
+        position: absolute;
+        top: 50%;
+        right: 0;
+        z-index: 1;
+        transform: translate(0, -50%);
+      }
     }
   }
 }

src/views/ai/ai-data-report/activity-info.vue

@@ -23,7 +23,7 @@
         至
         {{ formatDateTimeByType(activityInfo.endDate, 'yyyy-MM-dd') || '--' }}
       </div>
-      <div class="activity-info-item">
+      <div class="activity-info-item" v-if="activityInfo.analyseFlag == 1">
         <span class="activity-info-label">活动分析天数：</span>
         触达之日起 {{ activityInfo.analyseDays || '--' }} 天
       </div>
@@ -31,32 +31,23 @@
     <div class="member-rule">
       <div class="member-rule-title">人群规则：</div>
       <ruleFilter class="member-rule-list" v-if="activityInfo.memberType == 0" :memberCrowdWidgetId="activityInfo.filterJson" />
-      <!-- <gic-new-member-group :visible="true" :defalt-selected="memberRule.selectValue"></gic-new-member-group> -->
-      <div class="member-rule-list" v-if="activityInfo.memberType == 1">
-        {{ memberRule }}
-        <!-- <div class="member-rule-item">生日范围：3月1日-3月31日</div>
-        <div class="member-rule-item">会员等级：银卡、金卡</div>
-        <div class="member-rule-item">金字塔会员分层：核心会员31-90天、潜力会员31-90天</div>
-        <div class="member-rule-item">会员服务门店：会员分组(华南直营、华北直营)</div> -->
-      </div>
+      <gic-new-member-group class="member-rule-list" v-if="activityInfo.memberType == 1" :selected-ids="activityInfo.filterJson"></gic-new-member-group>
     </div>
   </div>
 </template>
 
 <script>
 import { formatDateTimeByType } from '@/utils/index.js';
-import { getActivityInfo, getGroupByIds } from '@/service/api/aiApi.js';
+import { getActivityInfo } from '@/service/api/aiApi.js';
 import gicNewMemberGroup from '@/components/dm-new-member-group/index.vue';
 import ruleFilter from '@/components/dm-new-rule/ruleFilter.vue';
 
-// TODO 回显人群规则
 export default {
   name: 'ActivityInfo',
   components: { gicNewMemberGroup, ruleFilter },
   data() {
     return {
-      activityInfo: {},
-      memberRule: ''
+      activityInfo: {}
     };
   },
   filters: {
@@ -82,20 +73,12 @@ export default {
       getActivityInfo({ activityId, planId }).then(res => {
         this.activityInfo = res.result;
         this.$emit('flag', {
+          memberType: this.activityInfo.memberType,
           analyseFlag: this.activityInfo.analyseFlag, //1开0关 开启活动分析开关
           smsFlag: this.activityInfo.smsFlag //挂机短信1是0否
         });
         this.$emit('filterJson', this.activityInfo.filterJson);
-        this.getMemberCrowd();
       });
-    },
-    getMemberCrowd() {
-      const { memberType, filterJson } = this.activityInfo;
-      if (memberType == 1) {
-        getGroupByIds({ memberTagGroupIds: filterJson }).then(res => {
-          this.memberRule = res.result.filterFrontShow;
-        });
-      }
     }
   }
 };
@@ -136,18 +119,6 @@ export default {
         display: none;
       }
     }
-    // padding: 16px;
-    // background: #f7f8fa;
-    // border-radius: 4px;
-    // .member-rule-item {
-    //   font-size: 14px;
-    //   font-weight: 400;
-    //   color: #303133;
-    //   line-height: 20px;
-    //   + .member-rule-item {
-    //     margin-top: 10px;
-    //   }
-    // }
   }
 }
 </style>

src/views/ai/ai-data-report/ai-data.vue

@@ -200,7 +200,7 @@ export default {
             }
             // 活动不发送挂机短信时，数据指标不展示短信发送总数的字段
             // 活动未开启活动分析时，数据指标不展示活动费用
-            return !((this.aiDataShow.analyseFlag == 0 && item.key == 'sentMessagesNumber') || (this.aiDataShow.smsFlag == 0 && item.key == 'activityCost'));
+            return !((this.aiDataShow.smsFlag == 0 && item.key == 'sentMessagesNumber') || (this.aiDataShow.analyseFlag == 0 && item.key == 'activityCost'));
           });
         })
         .filter(el => el.length > 0);

src/views/ai/ai-data-report/conversion.vue

@@ -245,20 +245,39 @@ export default {
       });
     },
     getMemberCrowd() {
-      getMemberCrowd({ memberCrowdWidgetId: this.filterJson }).then(res => {
-        const filterFrontShow = JSON.parse(res.result.filterFrontShow || '[]');
-        this.comparative.options = filterFrontShow
-          .filter(el => el.columnKey != 'mainStoreId')
-          .map(el => {
-            // 对比项 1会员类型、2会员等级、3金字塔、4会员分组
-            const valueMap = { wxMember: 1, gradeId: 2, tagGroup: 3 };
-            return {
-              label: el.chainNodeName,
-              value: valueMap[el.columnKey],
-              children: el.columnKey == 'wxMember' ? el.selectList : el.selectList.reduce((result, el) => result.concat(el.data), [])
-            };
-          });
-      });
+      this.comparative.options = [];
+      if (this.memberType == 0) {
+        getMemberCrowd({ memberCrowdWidgetId: this.filterJson }).then(res => {
+          const filterFrontShow = JSON.parse(res.result.filterFrontShow || '[]');
+          this.comparative.options = filterFrontShow
+            .filter(el => el.columnKey != 'mainStoreId')
+            .map(el => {
+              // 对比项 1会员类型、2会员等级、3金字塔、4会员分组
+              const valueMap = { wxMember: 1, gradeId: 2, tagGroup: 3 };
+              return {
+                label: el.chainNodeName,
+                value: valueMap[el.columnKey],
+                children: el.columnKey == 'wxMember' ? el.selectList : el.selectList.reduce((result, el) => result.concat(el.data), [])
+              };
+            });
+        });
+      } else if (this.memberType == 1) {
+        this.axios.get(`/gic-member-tag-web/member-tag-group/queryGroupByIds?requestProject=memberTag&memberTagGroupIds=${this.filterJson}`).then(res => {
+          const { errorCode, result } = res.data;
+          if (errorCode == 1 && Array.isArray(result)) {
+            this.comparative.options.push({
+              label: '客户分组',
+              value: 1,
+              children: result.map(el => {
+                return {
+                  key: el.memberTagGroupId,
+                  value: el.groupName
+                };
+              })
+            });
+          }
+        });
+      }
     },
     getComparativeData() {
       this.comparative.loading = true;