update: 营销记录

src/components/marketingRecord/components/all.scss

@@ -10,6 +10,9 @@
 .mb20 {
   margin-bottom: 20px;
 }
+.pb20 {
+  padding-bottom: 20px;
+}
 .mt5 {
   margin-top: 5px;
 }
@@ -21,4 +24,23 @@
 }
 .search {
   font-size: 0;
+  margin-bottom: 20px;
+}
+.pager {
+  text-align: right;
+  margin-top: 20px;
+}
+.min20 {
+  min-height: 100%;
+  padding-bottom: 20px;
+  box-sizing: border-box;
+}
+.marketing-message, .marketing-wechat, .marketing-card, .marketing-ecm {
+  height: 100%;
+}
+.table {
+  .pager {
+    text-align: right;
+    padding: 20px 0;
+  }
 }

src/components/marketingRecord/components/card.vue

 <template>
-  <div class="card mt5">
+  <div class="marketing-card mt5">
     <div class="search">
        投放时间：<el-date-picker :clearable="false" class="w256" value-format="yyyy-MM-dd" :pickerOptions="pickerOptions" v-model="launchTime" type="daterange" range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期" @change="change"></el-date-picker>
        领取时间：<el-date-picker class="ml10 w256" value-format="yyyy-MM-dd" :pickerOptions="pickerOptions" v-model="collectionTime" type="daterange" range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期" @change="change"></el-date-picker>
@@ -26,7 +26,7 @@
         style="width: 100%"
       >
         <el-table-column
-          v-for="(v, i) in tableHeader"
+          v-for="(v, i) in tableDatatableHeader"
           :key="i"
           :prop="v.prop"
           :min-width="v.minWidth"
@@ -72,7 +72,7 @@ export default {
       collectionTime: [],
       search: {
         putBeginTime: '',  // 投放开始时间
-        endputEndTimeTime: '', // 投放结束时间
+        putEndTime: '', // 投放结束时间
         receiveBeginTime: '', // 领取开始时间
         receiveEndTime: '', // 结束
         search: '', // 卡券代码
@@ -89,8 +89,8 @@ export default {
     change() {
       const { currentPage, pageSize } = this.tableData;
       const { launchTime, collectionTime } = this;
-      this.search.putBeginTime = launchTime ? ( typeof launchTime[0] == 'string ' ? launchTime[0] : this.dateformat(launchTime[0], 'yyyy-MM-dd')) : null;
-      this.search.endputEndTimeTime = launchTime ? ( typeof launchTime[0] == 'string ' ? launchTime[1] : this.dateformat(launchTime[1], 'yyyy-MM-dd')) : null;
+      this.search.putBeginTime = launchTime ? ( typeof launchTime[0] == 'string ' ? launchTime[0] : this.dateformat(new Date(launchTime[0]), 'yyyy-MM-dd')) : null;
+      this.search.putEndTime = launchTime ? ( typeof launchTime[0] == 'string ' ? launchTime[1] : this.dateformat(new Date(launchTime[1]), 'yyyy-MM-dd')) : null;
       this.search.receiveBeginTime = collectionTime ? collectionTime[0] : null;
       this.search.receiveEndTime = collectionTime ? collectionTime[1] : null;
       const commonObj = { currentPage, pageSize };

src/components/marketingRecord/components/ecm.vue

 <template>
-  <div class="ecm mt5">
+  <div class="marketing-ecm mt5">
     <div class="search">
       <el-input
         v-model="search.search"
@@ -87,8 +87,8 @@ export default {
   methods: {
     change() {
       const { currentPage, pageSize } = this.tableData;
-      this.search.beginTime = this.time ? ( typeof this.time[0] == 'string ' ? this.time[0] : this.dateformat(this.time[0], 'yyyy-MM-dd')) : null;
-      this.search.endTime = this.time ? ( typeof this.time[0] == 'string ' ? this.time[1] : this.dateformat(this.time[1], 'yyyy-MM-dd')) : null;
+      this.search.beginTime = this.time ? ( typeof this.time[0] == 'string ' ? this.time[0] : this.dateformat(new Date(this.time[0]), 'yyyy-MM-dd')) : null;
+      this.search.endTime = this.time ? ( typeof this.time[0] == 'string ' ? this.time[1] : this.dateformat(new Date(this.time[1]), 'yyyy-MM-dd')) : null;
       const commonObj = { currentPage, pageSize };
       this.$emit("changeSearch", Object.assign({}, this.search, commonObj));
     }

src/components/marketingRecord/components/message.vue

 <template>
-  <div class="message mt5">
+  <div class="marketing-message mt5">
     <div class="search">
        <el-date-picker value-format="yyyy-MM-dd" class="w256" :pickerOptions="pickerOptions" v-model="time" type="daterange" range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期" @change="change"></el-date-picker>
        <el-select class="ml10 w160" v-model="search.sysType" placeholder="所有模板类型" clearable @change="change">
@@ -14,7 +14,7 @@
         style="width: 100%"
       >
         <el-table-column
-          v-for="(v, i) in tableHeader"
+          v-for="(v, i) in tableData.tableHeader"
           :key="i"
           :prop="v.prop"
           :min-width="v.minWidth"
@@ -71,8 +71,8 @@ export default {
   methods: {
     change() {
       const { currentPage, pageSize } = this.tableData;
-      this.search.beginTime = this.time ? ( typeof this.time[0] == 'string ' ? this.time[0] : this.dateformat(this.time[0], 'yyyy-MM-dd')) : null;
-      this.search.endTime = this.time ? ( typeof this.time[0] == 'string ' ? this.time[1] : this.dateformat(this.time[1], 'yyyy-MM-dd')) : null;
+      this.search.beginTime = this.time ? ( typeof this.time[0] == 'string ' ? this.time[0] : this.dateformat(new Date(this.time[0]), 'yyyy-MM-dd')) : null;
+      this.search.endTime = this.time ? ( typeof this.time[0] == 'string ' ? this.time[1] : this.dateformat(new Date(this.time[1]), 'yyyy-MM-dd')) : null;
       const commonObj = { currentPage, pageSize };
       this.$emit("changeSearch", Object.assign({}, this.search, commonObj));
     }

src/components/marketingRecord/components/wechat.vue

 <template>
-  <div class="wechat mt5">
+  <div class="marketing-wechat mt5">
     <div class="search">
        <el-date-picker value-format="yyyy-MM-dd" class="w256" :pickerOptions="pickerOptions" v-model="time" type="daterange" range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期" @change="change"></el-date-picker>
        <el-select class="ml10 w160" v-model="search.contentType" placeholder="所有素材类型" clearable @change="change">
@@ -14,7 +14,7 @@
         style="width: 100%"
       >
         <el-table-column
-          v-for="(v, i) in tableHeader"
+          v-for="(v, i) in tableData.tableHeader"
           :key="i"
           :prop="v.prop"
           :min-width="v.minWidth"
@@ -72,8 +72,8 @@ export default {
   methods: {
     change() {
       const { currentPage, pageSize } = this.tableData;
-      this.search.beginTime = this.time ? ( typeof this.time[0] == 'string ' ? this.time[0] : this.dateformat(this.time[0], 'yyyy-MM-dd')) : null;
-      this.search.endTime = this.time ? ( typeof this.time[0] == 'string ' ? this.time[1] : this.dateformat(this.time[1], 'yyyy-MM-dd')) : null;
+      this.search.beginTime = this.time ? ( typeof this.time[0] == 'string ' ? this.time[0] : this.dateformat(new Date(this.time[0]), 'yyyy-MM-dd')) : null;
+      this.search.endTime = this.time ? ( typeof this.time[0] == 'string ' ? this.time[1] : this.dateformat(new Date(this.time[1]), 'yyyy-MM-dd')) : null;
       const commonObj = { currentPage, pageSize };
       this.$emit("changeSearch", Object.assign({}, this.search, commonObj));
     }

src/components/marketingRecord/index.vue

 <template>
   <div class="marketing-record">
-    <div class="min100">
+    <div class="min20">
       <nav-path :navpath="navpath"></nav-path>
       <div class="marketing-container">
         <div class="tabs" v-loading="load">
@@ -31,6 +31,7 @@ import cardRecord from "./components/card.vue";
 import wechatRecord from "./components/wechat.vue";
 import messageRecord from "./components/message.vue";
 import { doFetch, doFetchqs } from "@/components/axios/api";
+import { dateformat } from '@/utils/formatTime';
 import url from "@/components/axios/url";
 const { ecmLogPage, cardLogPage, messageLogPage, wechatLogPage, cardChannelType  } = url;
 export default {
@@ -122,26 +123,47 @@ export default {
       this.loading = false;
     },
     getTableHeader() {
-      this.ecmTableData.TableHeader = [
+      this.ecmTableData.tableHeader = [
         {
-          label: "createDate",
-          prop: "提交时间",
+          label: "提交时间",
+          prop: "createDate",
           minWidth: 120,
           formatter(row) {
-            return `${this.dateformat(row.createDate, 'yyyy-MM-dd hh-mm-ss')}`;
+            return `${dateformat(new Date(row.createDate), 'yyyy-MM-dd hh:mm:ss')}`;
           }
         },
         { label: "计划名称", prop: "ecmName", minWidth: 120 },
-        { label: "营销方式", prop: "marketingType", minWidth: 120 },
-        { label: "营销内容", prop: "", minWidth: 120 }
+        { label: "营销方式", prop: "marketingType", minWidth: 120, formatter(row) {
+          const type = row.marketingType;
+          switch(type) {
+            case 'integral':
+              return '积分';
+            case 'message':
+              return '短信';
+            case 'teltask':
+              return '话务';
+            case 'qfxx':
+              return '群发任务';
+            case 'teletext':
+              return '图文消息';
+            case 'image':
+              return '图片';
+            case 'text':
+              return '文本消息';
+            case 'wxa':
+              return '小程序';
+            case 'card':
+              return '卡券';
+          }
+        } }
       ];
-      this.cardTableData.TableHeader = [
+      this.cardTableData.tableHeader = [
         {
           label: "投放时间",
           prop: "createDate",
           minWidth: 120,
           formatter(row) {
-           return `${this.dateformat(row.createDate, 'yyyy-MM-dd hh-mm-ss')}`;
+           return `${dateformat(new Date(row.createDate), 'yyyy-MM-dd hh:mm:ss')}`;
           }
         },
         {
@@ -149,39 +171,66 @@ export default {
           prop: "receiveTime",
           minWidth: 120,
           formatter(row) {
-            return `${this.dateformat(row.receiveTime, 'yyyy-MM-dd hh-mm-ss')}`;
+            return `${dateformat(new Date(row.receiveTime), 'yyyy-MM-dd hh:mm:ss')}`;
           }
         },
         { label: "卡券名称", prop: "cardName", minWidth: 120, },
         { label: "卡券代码", prop: "cardCode", minWidth: 120, },
-        { label: "卡券类型", prop: "cardType", minWidth: 120,},
+        { label: "卡券类型", prop: "cardType", minWidth: 120, formatter(row) {
+          const type = row.cardType;
+          switch(type) {
+            case 1:
+              return '抵金券';
+            case 2:
+              return '折扣券';
+            case 3:
+              return '兑换券';
+            }
+          }
+        },
         { label: "投放途径", prop: "receiveCode", minWidth: 120, },
         { label: "来源明细", prop: "", minWidth: 120, }
       ];
-      this.messageTableData.TableHeader = [
+      this.messageTableData.tableHeader = [
         {
           label: "发送时间",
           prop: "createDate",
           minWidth: 120,
           formatter(row) {
-            return `${this.dateformat(row.createDate, 'yyyy-MM-dd hh-mm-ss')}`;
+            return `${dateformat(new Date(row.createDate), 'yyyy-MM-dd hh:mm:ss')}`;
           }
         },
-        { label: "模板类型", prop: "smsType", minWidth: 120, },
+        { label: "模板类型", prop: "smsType", minWidth: 120, formatter(row) {
+          return row.smsType == 1 ? '营销短信' : '普通短信'
+        } },
         { label: "模板名称", prop: "smsTitle", minWidth: 120, },
-        { label: "模板内容", prop: "smsContent", minWidth: 120, }
+        { label: "模板内容", prop: "smsContent", minWidth: 120 }
       ];
-      this.wechatTableData.TableHeader = [
+      this.wechatTableData.tableHeader = [
         {
           label: "提交时间",
           prop: "createDate",
           minWidth: 120,
           formatter(row) {
-            return `${this.dateformat(row.createDate, 'yyyy-MM-dd hh-mm-ss')}`;
+            return `${dateformat(row.createDate, 'yyyy-MM-dd hh-mm-ss')}`;
+          }
+        },
+        { label: "素材类型", prop: "contentType",minWidth: 120, formatter(row) {
+            const type = row.contentType;
+            switch(type) {
+              case 0:
+                return '图文消息';
+              case 1:
+                return '文本消息';
+              case 2:
+                return '图片';
+              }
           }
         },
-        { label: "素材类型", prop: "contentType",minWidth: 120 },
-        { label: "素材标题", prop: "title",minWidth: 120 }
+        { label: "素材标题/文本内容", prop: "title",minWidth: 120,formatter(row) {
+           return row.title;
+        }
+       }
       ];
     },
     // 设置表格数据
@@ -203,7 +252,7 @@ export default {
     },
     // 子组件任何筛选项发生改变, 包括tab切换、父组件初始化都会触发
     onChange(params) {
-      console.log(params);
+      params.memberId = this.$route.query.memberId || '';
       this.getTableData(this.tabsIndex, params);
     }
   }
@@ -224,9 +273,6 @@ export default {
   }
 }
 
-.marketing-record {
-  height: 100%;
-}
 .w160 {
   width: 160px;
 }