update: 图片下载/作废置灰

src/views/salesleads/actCodeManage/staffActCode/actCodeDetail.vue

@@ -33,7 +33,7 @@
         <div v-if="codeInfo.statusFlag != 2" class="flex" style="padding-top:20px;">
           <el-button v-if="codeInfo.hmType == 2 && codeInfo.statusFlag == 1" icon="el-icon-download" type="primary" style="width:120px;margin-right: 12px;" @click="downloadQR">下载二维码</el-button>
           <el-button type="primary" plain style="width:98px;" @click="modifyCode">编辑</el-button>
-          <el-button type="danger" plain style="width:98px;margin-left: 20px; border-color: #F5222D;" @click="discardCode">作废</el-button>
+          <el-button class="button-discard" type="danger" plain :style="codeInfo.hmType == 2 && useMemberList.length > 0 ? '' : 'border-color: #F5222D;'" @click="discardCode" :disabled="codeInfo.hmType == 2 && useMemberList.length > 0">作废</el-button>
         </div>
       </div>
     </div>
@@ -47,7 +47,7 @@
     </div>
     <el-tabs v-model="activeName" type="card">
       <el-tab-pane label="详情信息" name="first">
-        <act-code-detail-info :enterprise-id="codeInfo.enterpriseId" :welcome-id="codeInfo.welcomeId" :hm-id="$route.query.hmId"></act-code-detail-info>
+        <act-code-detail-info :enterprise-id="codeInfo.enterpriseId" :welcome-id="codeInfo.welcomeId" :hm-id="$route.query.hmId" @useMemberList="useMemberData"></act-code-detail-info>
       </el-tab-pane>
       <el-tab-pane label="数据统计" name="second">
         <act-code-detail-statistics :hm-id="$route.query.hmId"></act-code-detail-statistics>
@@ -84,13 +84,28 @@ export default {
         { value: '正常-今日已达上限', style: 'warning' }
       ],
       statusIndex: 1,
-      scrollTop: 0
-      // scrollStyle: 'position:fixed;top:110px;z-index:1;padding-bottom:0;height:40px;background:yellow;'
+      scrollTop: 0,
+      useMemberList: []
     };
   },
   methods: {
     downloadQR() {
-      window.open(this.codeInfo.wxQrcode);
+      const downloadFile = (fileName, content) => {
+        const url = content;
+        const x = new XMLHttpRequest();
+        x.open('GET', url, true);
+        x.responseType = 'blob';
+        x.onload = function(e) {
+          const blob = new Blob([x.response]);
+          let url = window.URL.createObjectURL(blob);
+          let a = document.createElement('a');
+          a.href = url;
+          a.download = fileName + '.png';
+          a.click();
+        };
+        x.send();
+      };
+      downloadFile(this.codeInfo.hmId + '_' + this.codeInfo.name, this.codeInfo.wxQrcode);
     },
     modifyCode() {
       this.$router.push(`/actCodeEdit?hmId=${this.$route.query.hmId}`);
@@ -119,26 +134,6 @@ export default {
       that.loading = true;
       getRequest('/haoban-manage3-web/hm/qrcode/detail', { hmId: that.$route.query.hmId })
         .then(res => {
-          // let res = {
-          //   data: {
-          //     errorCode: 1,
-          //     result: {
-          //       name: '测试活码好的可以',
-          //       hmId: '727363646474849483332',
-          //       statusFlag: 1,
-          //       overFlag: 1,
-          //       hmType: 2,
-          //       creatorName: '少见多怪',
-          //       createTime: 182736347383,
-          //       passFlag: 0,
-          //       welcomeId: 'b680a2cf18b742cc9f4560f6195c9ec6',
-          //       enterpriseId: '5bd929fd3b2c49deaa1184bcb0d669b3',
-          //       wxQrcode: '',
-          //       memberLabelName: '稍加稳得',
-          //       hmGroupName: '测试分组'
-          //     }
-          //   }
-          // };
           let resData = res.data;
           that.loading = false;
           if (resData.code == 0) {
@@ -159,8 +154,10 @@ export default {
     scrollMethod: _throttle(function() {
       // 节流会不自然 左右不滑动
       this.scrollTop = document.getElementById('hb-layout-pager-one').scrollTop;
-      // console.log(this.scrollTop);
-    }, 100)
+    }, 100),
+    useMemberData(data) {
+      this.useMemberList = data;
+    }
   },
   mounted() {
     let that = this;
@@ -205,4 +202,8 @@ export default {
   width: 100%;
   // left: 50px;
 }
+.button-discard {
+  width: 98px;
+  margin-left: 20px;
+}
 </style>

src/views/salesleads/actCodeManage/staffActCode/actCodeDetailStatistics.vue

@@ -81,7 +81,6 @@ export default {
   data() {
     return {
       loading: false,
-      // dateList: [],
       dateList: [
         // { bizDate: '2018/8/1', 新增人数: 4623 }
         // { bizDate: '2018/8/2', 新增人数: 6145 },
@@ -130,9 +129,6 @@ export default {
           let resData = res.data;
           that.loading = false;
           if (resData.code == 0) {
-            ((resData.result || {}).dateList || []).map(function(date) {
-              date['新增人数'] = date.addNum;
-            });
             that.overViewData = resData.result || {};
             return;
           }

src/views/salesleads/actCodeManage/staffActCode/actCodeRecord.vue

@@ -115,7 +115,6 @@ export default {
      */
     sortChange(column, prop, order) {
       const that = this;
-      console.log(column.order);
       that.currentPage = 1;
       that.sortType = column.order == 'ascending' ? 'asc' : 'desc'; // 默认倒序
       that.getTableList();
@@ -155,7 +154,7 @@ export default {
         clerkId,
         startTime,
         endTime,
-        addChannel: linkId ? 1 : hmId ? 2 : 0,
+        addChannel: linkId ? 1 : hmId ? 2 : 0, // 不具备传0
         createTimeOrder: that.sortType || ''
       };
       postJsonRequest('/haoban-manage3-web/hm/qrcode/wxUserAddLog/list', para)

src/views/salesleads/actCodeManage/staffActCode/newAddChart.vue

@@ -71,7 +71,7 @@ export default {
         bizDate: {
           alias: '日期' //别名
         },
-        新增人数: {
+        addNum: {
           alias: '新增人数'
         }
       });
@@ -95,7 +95,7 @@ export default {
           }
         }
       });
-      this.chart.axis('新增人数', {
+      this.chart.axis('addNum', {
         grid: {
           line: {
             type: 'line',
@@ -115,22 +115,42 @@ export default {
           }
         }
       });
+      this.chart.tooltip({
+        showCrosshairs: true,
+        shared: true,
+        itemTpl: `<div style="margin-bottom: 10px;list-style:none;">
+            <span style="background-color:{color};" class="g2-tooltip-marker"></span>
+            {name}: {value}
+            </div>`
+      });
       // 图例
       this.chart.legend({
         custom: true,
         position: 'top-left',
-        items: [{ name: '新增人数', value: '新增人数', marker: { symbol: 'line', style: { stroke: '#4B74E8', lineWidth: 12, lineHeight: 8 } } }]
+        items: [{ name: '新增人数', value: 'addNum', marker: { symbol: 'line', style: { stroke: '#4B74E8', lineWidth: 12, lineHeight: 8 } } }]
       });
       if (this.charData.length > 1) {
         this.chart
           .line()
-          .position('bizDate*新增人数')
-          .color('#4B74E8');
+          .position('bizDate*addNum')
+          .color('#4B74E8')
+          .tooltip('addNum', addNum => {
+            return {
+              name: '新增人数',
+              value: addNum
+            };
+          });
       } else {
         this.chart
           .point()
-          .position('bizDate*新增人数')
-          .color('#4B74E8');
+          .position('bizDate*addNum')
+          .color('#4B74E8')
+          .tooltip('addNum', addNum => {
+            return {
+              name: '新增人数',
+              value: addNum
+            };
+          });
       }
 
       this.chart.removeInteraction('legend-filter'); // 自定义图例，移除默认的分类图例筛选交互

src/views/salesleads/components/actCodeDetailInfo.vue

@@ -173,7 +173,6 @@ export default {
           if (resData.code == 0) {
             that.total = resData.result.totalCount || 0;
             that.useMemberData = resData.result.result || [];
-            // that.total = resData.result.pageInfo ? resData.result.pageInfo.total : 0;
             return;
           }
           errMsg.errorMsg(resData);
@@ -199,6 +198,9 @@ export default {
       if (!newData || newData.length <= 0) return;
       that.welcomeId = newData || '';
       that.getwelcomeInfo();
+    },
+    useMemberData: function(newData, oldData) {
+      this.$emit('useMemberList', newData);
     }
   }
 };