fix:卡券 - 退券记录

src/router/modules/card.js

@@ -48,6 +48,12 @@ export default {
           name: '临时领取记录',
           component: () => import(/* webpackChunkName: "card" */ '../../views/card/record-cache.vue'),
           meta: {}
+        },
+        {
+          path: 'refund',
+          name: '退券记录',
+          component: () => import(/* webpackChunkName: "card" */ '../../views/card/refund-list.vue'),
+          meta: {}
         }
       ]
     },

src/router/modules/game.js

-/*
- * @Description: In User Settings Edit
- * @Author: your name
- * @Date: 2019-06-05 09:30:51
- * @LastEditTime: 2019-08-12 09:19:55
- * @LastEditors: Please set LastEditors
- */
 //游戏营销
-// import game from '../../views/game';
-
-// import dzp from '../../views/game/dzp/index.vue';
-// import dzpForm from '../../views/game/dzp/form.vue';
-// import dzpRecord from '../../views/game/dzp/record.vue';
-
-// import ggk from '../../views/game/ggk/index.vue';
-// import ggkForm from '../../views/game/ggk/form.vue';
-// import ggkRecord from '../../views/game/ggk/record.vue';
-
-// import ptyx from '../../views/game/ptyx/index.vue';
-// import ptyxForm from '../../views/game/ptyx/form.vue';
-// import ptyxRecord from '../../views/game/ptyx/record.vue';
-
-// import znm from '../../views/game/znm/index.vue';
-// import znmForm from '../../views/game/znm/form.vue';
-// import znmRecord from '../../views/game/znm/record.vue';
-
-// import klfl from '../../views/game/klfl/index.vue';
-// import klflForm from '../../views/game/klfl/form.vue';
-// import klflRecord from '../../views/game/klfl/record.vue';
-
 export default {
   path: 'game',
   name: '游戏营销',

src/router/routes.js

@@ -12,8 +12,6 @@ import game from './modules/game';
 import message from './modules/message';
 //卡券营销
 import card from './modules/card';
-//新卡券营销
-// import giccard from './modules/giccard'
 //智能营销
 import ecm from './modules/ecm';
 //模板消息

src/service/api/cardApi.js

@@ -45,6 +45,9 @@ export const cardPutOnRecord = params => requests(PREFIX + 'card-put-on-record',
 //卡券营销--卡券记录--投放记录/领取记录 - 投放记录 - 导出
 export const exportCardPutOnRecordExcel = config.api + PREFIX + 'export-card-put-on-record-excel';
 
+//卡券营销--卡券记录--退券列表
+export const refundPage = params => requests(PREFIX + 'page-back-coup-log', params);
+
 //卡券营销--卡券记录--投放记录--删除记录
 export const deleteCardPuton = params => requests(PREFIX + 'delete-card-puton', params);
 

src/views/card/refund-list.vue

+<template>
+  <section>
+    <div class="pb22 clearfix">
+      <el-date-picker class="w250" v-model="dateTime" type="daterange" range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期" @change="refresh"></el-date-picker>
+      <el-input v-model="listParams.search" class="w300" placeholder="卡券名称/卡券代码/会员信息" clearable @change="refresh"><i slot="prefix" class="el-input__icon el-icon-search"></i></el-input>
+      <el-button class="fr" type="primary" icon="iconfont icon-icon_yunxiazai fz14"> 下载Excel</el-button>
+    </div>
+    <el-table tooltipEffect="light" :data="tableList" style="width: 100%" v-loading="loading">
+      <el-table-column :show-overflow-tooltip="true" width="100" align="left" prop="sendBackTime" label="退券时间">
+        <template slot-scope="scope">
+          <p class="cell-time">
+            {{ formatDateTimeByType(scope.row.sendBackTime, 'yyyy-MM-dd-HH-mm', true).y }}<br />
+            <span>{{ formatDateTimeByType(scope.row.sendBackTime, 'yyyy-MM-dd-HH-mm', true).h }}</span>
+          </p>
+        </template>
+      </el-table-column>
+      <el-table-column :show-overflow-tooltip="true" min-width="120" align="left" prop="backOrderNumber" label="退券订单号">
+        <template slot-scope="scope">
+          <p class="gray">{{ scope.row.backOrderNumber || '--' }}</p>
+        </template>
+      </el-table-column>
+      <el-table-column :show-overflow-tooltip="true" width="120" align="left" prop="usedTime" label="原始订单时间">
+        <template slot-scope="scope">
+          <p class="cell-time">
+            {{ formatDateTimeByType(scope.row.usedTime, 'yyyy-MM-dd-HH-mm', true).y }}<br />
+            <span>{{ formatDateTimeByType(scope.row.usedTime, 'yyyy-MM-dd-HH-mm', true).h }}</span>
+          </p>
+        </template>
+      </el-table-column>
+      <el-table-column :show-overflow-tooltip="true" min-width="120" align="left" prop="oorderNumber" label="原始订单号">
+        <template slot-scope="scope">
+          <p class="gray">{{ scope.row.oorderNumber || '--' }}</p>
+        </template>
+      </el-table-column>
+      <el-table-column :show-overflow-tooltip="true" min-width="120" header-align="left" align="left" prop="memberId" label="会员信息">
+        <template slot-scope="scope">
+          <img class="vertical-middle table__avatar--40" :src="scope.row.thirdImgUrl || defaultAvatar" width="60" height="60" />
+          <div class="inline-block vertical-middle">
+            <p class="table-name--ellipsis">{{ scope.row.memberName || '--' }}</p>
+            <p class="fz13 gray">{{ scope.row.cardNum || '--' }}</p>
+          </div>
+        </template>
+      </el-table-column>
+      <el-table-column :show-overflow-tooltip="true" width="140" align="left" prop="cardType" label="卡券类型">
+        <template slot-scope="scope">
+          <p>{{ scope.row.cardType === 0 ? '抵金券' : scope.row.cardType === 1 ? '折扣券' : '兑换券' }}</p>
+        </template>
+      </el-table-column>
+      <el-table-column :show-overflow-tooltip="true" min-width="120" align="left" prop="cardCode" label="卡券代码"></el-table-column>
+      <el-table-column width="100" align="left" prop="status" label="卡券状态">
+        <template slot-scope="scope">
+          <span v-html="filterCardStatus(scope.row)"></span>
+        </template>
+      </el-table-column>
+    </el-table>
+    <el-pagination v-show="tableList.length" background class="dm-pagination" @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page="listParams.currentPage" :page-sizes="[20, 40, 60, 80]" :page-size="listParams.pageSize" layout="total, sizes, prev, pager, next" :total="total"></el-pagination>
+    <vue-gic-export-excel :dialogVisible.sync="dialogVisible" :dataArr="tableList" :type="2" :excelUrl="excelUrl" :params="params" :projectName="projectName"></vue-gic-export-excel>
+  </section>
+</template>
+<script>
+import { refundPage } from '@/service/api/cardApi.js';
+import { formatDateTimeByType } from '@/utils/index.js';
+import talbeMethods from '@/mixins/tableMethods.js';
+import filterAvater from '@/mixins/filterAvater.js';
+
+export default {
+  name: 'refund-list',
+  mixins: [talbeMethods, filterAvater],
+  data() {
+    return {
+      formatDateTimeByType,
+      dateTime: [,],
+      listParams: {
+        sendBackBeginTime: '',
+        sendBackEndTime: '',
+        search: '',
+        currentPage: 1,
+        pageSize: 20
+      },
+      total: 0,
+      loading: false,
+      tableList: [],
+      projectName: 'marketing', // 当前项目名
+      dialogVisible: false,
+      excelUrl: '', // 下载数据的地址
+      params: {} // 传递的参数
+    };
+  },
+  created() {
+    this.getTableList();
+    this.$store.commit('mutations_breadcrumb', [{ name: '营销管理', path: '' }, { name: '卡券营销', path: '' }, { name: '退券记录', path: '' }]); // eslint-disable-line
+  },
+  methods: {
+    // 加载列表
+    async getTableList() {
+      this.loading = true;
+      this.dataTimeFormat();
+      try {
+        let res = await refundPage(this.listParams);
+        this.tableList = res.result.result || [];
+        this.total = res.result.totalCount || 0;
+      } catch (err) {
+        this.$tips({ type: 'error', message: '加载列表失败' });
+      }
+      this.loading = false;
+    },
+    // 列表状态过滤器
+    // 8.优惠券状态（0：删除，1：正常，2：失效，3：已发放，4：已领取，5：已使用，6：已到期,7:已销毁, 8:已占用）
+    filterCardStatus(row) {
+      let _content = '';
+      if (row.status == 0) {
+        _content = `<div class="dm-status--info">已删除</div>`;
+      } else if (row.status == 1) {
+        _content = `<div class="dm-status--primary">正常</div>`;
+      } else if (row.status == 2) {
+        _content = `<div class="dm-status--info">已失效</div>`;
+      } else if (row.status == 3) {
+        _content = `<div class="dm-status--primary">已发放</div>`;
+      } else if (row.status == 4) {
+        _content = `<div class="dm-status--success">已领取</div>`;
+      } else if (row.status == 5) {
+        _content = `<div class="dm-status--success">已使用</div>`;
+      } else if (row.status == 6) {
+        _content = `<div class="dm-status--info">已到期</div>`;
+      } else if (row.status == 7) {
+        _content = `<div class="dm-status--info">已销毁</div>`;
+      } else if (row.status == 8) {
+        _content = `<div class="dm-status--info">已占用</div>`;
+      }
+      return _content;
+    },
+    /**-------辅助方法---------- */
+    dataTimeFormat() {
+      if (this.dateTime) {
+        this.listParams.sendBackBeginTime = formatDateTimeByType(this.dateTime[0], 'yyyy-MM-dd');
+        this.listParams.sendBackEndTime = formatDateTimeByType(this.dateTime[1], 'yyyy-MM-dd');
+      } else {
+        this.listParams.sendBackBeginTime = '';
+        this.listParams.sendBackEndTime = '';
+      }
+    }
+  }
+};
+</script>