Skip to content

M
marketing
Commit c6d1c9b7 by chenxin
Options

fix: card-select filter 分页

parent 638aedda
Showing with 64 additions and 29 deletions
dist/index.html
<!DOCTYPE html><html><head><meta charset=utf-8><meta name=viewport content="width=device-width,initial-scale=1"><link rel="shortcut icon" href=./static/img/favicon.ico><title>GIC后台</title><link rel=stylesheet type=text/css href=static/fonts/iconfont.css><link rel=stylesheet type=text/css href=static/css/common.css><link rel=stylesheet href=//web-1251519181.file.myqcloud.com/components/element.2.12.0.css><link href=/marketing/static/css/main.aaae90571945b4744da03d6313965f5b.css rel=stylesheet></head><body><div id=app></div><script src=//web-1251519181.file.myqcloud.com/lib/vue/2.5.2/vue.min.js></script><script src=//web-1251519181.file.myqcloud.com/lib/vue-router/3.0.2/vue-router.min.js></script><script src=//web-1251519181.file.myqcloud.com/lib/vuex/3.1.0/vuex.min.js></script><script src=//web-1251519181.file.myqcloud.com/components/element.2.12.0.js></script><script src=//web-1251519181.file.myqcloud.com/components/header.2.0.35.js></script><script src=//web-1251519181.file.myqcloud.com/components/footer.2.0.04.js></script><script src=//web-1251519181.file.myqcloud.com/components/card.2.0.10.js></script><script src=//web-1251519181.file.myqcloud.com/components/store.2.0.01.js></script><script src=//web-1251519181.file.myqcloud.com/components/img-preview.2.0.00.js></script><script src=//web-1251519181.file.myqcloud.com/components/member-group.2.2.16.js></script><script src=//web-1251519181.file.myqcloud.com/components/store-card.2.0.18.js></script><script src=//web-1251519181.file.myqcloud.com/components/confirm-people.2.0.01.js></script><script src=//web-1251519181.file.myqcloud.com/components/people.2.0.42.js></script><script src=//web-1251519181.file.myqcloud.com/components/export-excel.2.0.13.js></script><script src=//web-1251519181.file.myqcloud.com/components/input.2.0.00.js></script><script src=//web-1251519181.file.myqcloud.com/components/delete.2.0.00.js></script><script src=//web-1251519181.file.myqcloud.com/components/selector.1.2.10.js></script><script type=text/javascript src=/marketing/static/js/manifest.665090acaa4c3c393587.js></script><script type=text/javascript src=/marketing/static/js/vendor.cbb380c2053ab598e892.js></script><script type=text/javascript src=/marketing/static/js/main.f19c0c2cec4f374b91d7.js></script></body></html>
\ No newline at end of file
<!DOCTYPE html><html><head><meta charset=utf-8><meta name=viewport content="width=device-width,initial-scale=1"><link rel="shortcut icon" href=./static/img/favicon.ico><title>GIC后台</title><link rel=stylesheet type=text/css href=static/fonts/iconfont.css><link rel=stylesheet type=text/css href=static/css/common.css><link rel=stylesheet href=//web-1251519181.file.myqcloud.com/components/element.2.12.0.css><link href=/marketing/static/css/main.d0df4bb7ccebec949f8aebeb09e62dcc.css rel=stylesheet></head><body><div id=app></div><script src=//web-1251519181.file.myqcloud.com/lib/vue/2.5.2/vue.min.js></script><script src=//web-1251519181.file.myqcloud.com/lib/vue-router/3.0.2/vue-router.min.js></script><script src=//web-1251519181.file.myqcloud.com/lib/vuex/3.1.0/vuex.min.js></script><script src=//web-1251519181.file.myqcloud.com/components/element.2.12.0.js></script><script src=//web-1251519181.file.myqcloud.com/components/header.2.0.35.js></script><script src=//web-1251519181.file.myqcloud.com/components/footer.2.0.04.js></script><script src=//web-1251519181.file.myqcloud.com/components/card.2.0.10.js></script><script src=//web-1251519181.file.myqcloud.com/components/store.2.0.01.js></script><script src=//web-1251519181.file.myqcloud.com/components/img-preview.2.0.00.js></script><script src=//web-1251519181.file.myqcloud.com/components/member-group.2.2.16.js></script><script src=//web-1251519181.file.myqcloud.com/components/store-card.2.0.18.js></script><script src=//web-1251519181.file.myqcloud.com/components/confirm-people.2.0.01.js></script><script src=//web-1251519181.file.myqcloud.com/components/people.2.0.42.js></script><script src=//web-1251519181.file.myqcloud.com/components/export-excel.2.0.13.js></script><script src=//web-1251519181.file.myqcloud.com/components/input.2.0.00.js></script><script src=//web-1251519181.file.myqcloud.com/components/delete.2.0.00.js></script><script src=//web-1251519181.file.myqcloud.com/components/selector.1.2.10.js></script><script type=text/javascript src=/marketing/static/js/manifest.06aabe4cef240885ea43.js></script><script type=text/javascript src=/marketing/static/js/vendor.cbb380c2053ab598e892.js></script><script type=text/javascript src=/marketing/static/js/main.f19c0c2cec4f374b91d7.js></script></body></html>
\ No newline at end of file
dist/static/js/manifest.665090acaa4c3c393587.js → dist/static/js/manifest.06aabe4cef240885ea43.js
!function(e){var r=window.webpackJsonp;window.webpackJsonp=function(t,c,a){for(var i,f,u,b=0,s=[];b<t.length;b++)f=t[b],n[f]&&s.push(n[f][0]),n[f]=0;for(i in c)Object.prototype.hasOwnProperty.call(c,i)&&(e[i]=c[i]);for(r&&r(t,c,a);s.length;)s.shift()();if(a)for(b=0;b<a.length;b++)u=o(o.s=a[b]);return u};var t={},n={13:0};function o(r){if(t[r])return t[r].exports;var n=t[r]={i:r,l:!1,exports:{}};return e[r].call(n.exports,n,n.exports,o),n.l=!0,n.exports}o.e=function(e){var r=n[e];if(0===r)return new Promise(function(e){e()});if(r)return r[2];var t=new Promise(function(t,o){r=n[e]=[t,o]});r[2]=t;var c=document.getElementsByTagName("head")[0],a=document.createElement("script");a.type="text/javascript",a.charset="utf-8",a.async=!0,a.timeout=12e4,o.nc&&a.setAttribute("nonce",o.nc),a.src=o.p+"static/js/"+({0:"card",1:"game",2:"wechat",3:"message",4:"ewash",5:"evaluation",6:"ecm",7:"activity",8:"recharge",9:"msg",10:"calllog"}[e]||e)+"."+{0:"41d3f7e3efa97b8b7fcb",1:"5603aa6bc3c455d7b51e",2:"f0b4c0e5c36f5ed6b7a8",3:"dbb7db1bf14e057fd6e0",4:"b9779b335b149b985836",5:"532be8ee883e509fee13",6:"393c92cf9310bf3051e4",7:"c7e6a74eba07ee933137",8:"cc0950432812606ca31b",9:"df16b0b3f7288e21ec0d",10:"4b68b26d138f9bc39980"}[e]+".js";var i=setTimeout(f,12e4);function f(){a.onerror=a.onload=null,clearTimeout(i);var r=n[e];0!==r&&(r&&r[1](new Error("Loading chunk "+e+" failed.")),n[e]=void 0)}return a.onerror=a.onload=f,c.appendChild(a),t},o.m=e,o.c=t,o.d=function(e,r,t){o.o(e,r)||Object.defineProperty(e,r,{configurable:!1,enumerable:!0,get:t})},o.n=function(e){var r=e&&e.__esModule?function(){return e.default}:function(){return e};return o.d(r,"a",r),r},o.o=function(e,r){return Object.prototype.hasOwnProperty.call(e,r)},o.p="/marketing/",o.oe=function(e){throw console.error(e),e}}([]);
\ No newline at end of file
!function(e){var r=window.webpackJsonp;window.webpackJsonp=function(t,c,a){for(var i,f,u,s=0,l=[];s<t.length;s++)f=t[s],n[f]&&l.push(n[f][0]),n[f]=0;for(i in c)Object.prototype.hasOwnProperty.call(c,i)&&(e[i]=c[i]);for(r&&r(t,c,a);l.length;)l.shift()();if(a)for(s=0;s<a.length;s++)u=o(o.s=a[s]);return u};var t={},n={13:0};function o(r){if(t[r])return t[r].exports;var n=t[r]={i:r,l:!1,exports:{}};return e[r].call(n.exports,n,n.exports,o),n.l=!0,n.exports}o.e=function(e){var r=n[e];if(0===r)return new Promise(function(e){e()});if(r)return r[2];var t=new Promise(function(t,o){r=n[e]=[t,o]});r[2]=t;var c=document.getElementsByTagName("head")[0],a=document.createElement("script");a.type="text/javascript",a.charset="utf-8",a.async=!0,a.timeout=12e4,o.nc&&a.setAttribute("nonce",o.nc),a.src=o.p+"static/js/"+({0:"card",1:"game",2:"wechat",3:"message",4:"ewash",5:"evaluation",6:"ecm",7:"activity",8:"recharge",9:"msg",10:"calllog"}[e]||e)+"."+{0:"4591a5ce7273285cc34a",1:"5603aa6bc3c455d7b51e",2:"f0b4c0e5c36f5ed6b7a8",3:"dbb7db1bf14e057fd6e0",4:"af57739585466796a11d",5:"532be8ee883e509fee13",6:"393c92cf9310bf3051e4",7:"c7e6a74eba07ee933137",8:"cc0950432812606ca31b",9:"df16b0b3f7288e21ec0d",10:"4b68b26d138f9bc39980"}[e]+".js";var i=setTimeout(f,12e4);function f(){a.onerror=a.onload=null,clearTimeout(i);var r=n[e];0!==r&&(r&&r[1](new Error("Loading chunk "+e+" failed.")),n[e]=void 0)}return a.onerror=a.onload=f,c.appendChild(a),t},o.m=e,o.c=t,o.d=function(e,r,t){o.o(e,r)||Object.defineProperty(e,r,{configurable:!1,enumerable:!0,get:t})},o.n=function(e){var r=e&&e.__esModule?function(){return e.default}:function(){return e};return o.d(r,"a",r),r},o.o=function(e,r){return Object.prototype.hasOwnProperty.call(e,r)},o.p="/marketing/",o.oe=function(e){throw console.error(e),e}}([]);
\ No newline at end of file
src/components/card-select/filterable.vue
<template>
<el-select :disabled="disabled" remote filterable clearable :remote-method="remoteMethod" @change="updateCId" size="small" :value="cId" placeholder="请输入卡券名称选择卡券">
<el-option v-for="item in tableList" :key="item.coupCardId" :label="`${item.cardName}（id: ...${item.coupCardId.slice(-5)}）`" :value="item.coupCardId"></el-option>
<el-select :disabled="disabled" v-loadmore="getMore" remote filterable clearable :remote-method="remoteMethod" @change="updateCId" size="small" v-model="cardId" placeholder="请输入卡券名称选择卡券">
<el-option v-for="(item, idx) in tableList" :key="idx" :label="`${item.cardName}（id: ...${item.coupCardId.slice(-5)}）`" :value="item.coupCardId"></el-option>
</el-select>
</template>
<script>
import { getCardListByName_, getCardDetail } from '@/service/api/cardApi.js';
import { getCardListByName, getCardDetail } from '@/service/api/cardApi.js';
export default {
name: 'card-select-filterable',
props: {
......@@ -15,20 +15,40 @@ export default {
data() {
return {
loading: false,
cardId: '',
info: {},
tableList: [],
search: ''
listParams: {
search: '',
currentPage: 1,
pageSize: 10
},
cardId: '',
total: 0,
nomore: false // 没有更多
};
},
watch: {
cId(val) {
if (!val) {
this.search = '';
this.tableList = [];
directives: {
loadmore: {
inserted(el, binding) {
// 获取element-ui定义好的scroll盒子
const SELECTDOWN_DOM = el.querySelector('.el-select-dropdown .el-select-dropdown__wrap');
SELECTDOWN_DOM.addEventListener('scroll', function() {
const CONDITION = this.scrollHeight - this.scrollTop <= this.clientHeight;
if (CONDITION) {
binding.value();
}
});
}
}
},
// watch: {
// cId(val) {
// if (!val) {
// this.cardId = val;
// this.listParams.search = '';
// this.tableList = [];
// }
// }
// },
methods: {
// 获取详情
getCardDetail(coupCardId) {
......@@ -47,29 +67,41 @@ export default {
updateCId(val) {
this.$emit('update:cId', val);
this.$emit('cIdUpdate'); // 触发父组件更新
if (!val) {
this.remoteMethod('');
}
},
// 模糊搜索
remoteMethod(search) {
this.search = search;
// search为空就不查了 太多了
if (search) {
this.getCardList();
} else {
this.tableList = [];
this.listParams.search = search;
this.listParams.currentPage = 1;
this.tableList = [];
this.nomore = false;
this.getCardList();
},
// 下一页
getMore() {
if (this.nomore) {
return;
}
this.listParams.currentPage = this.listParams.currentPage * 1 + 1;
this.getCardList();
},
getCardList() {
console.log('???????????????????????????????????????????');
if (this.nomore) {
return;
}
if (this.loading) {
return;
}
this.loading = true;
getCardListByName_({ search: this.search })
this.nomore = false;
getCardListByName(this.listParams)
.then(res => {
this.loading = false;
this.tableList = res.result || [];
const tableList = res.result.result ? this.tableList.concat(res.result.result) : [];
const total = res.result.totalCount;
this.tableList = tableList;
this.total = total;
this.nomore = total <= tableList.length || total - tableList.length < this.listParams.pagesize; // 没有下一页了
})
.catch(() => {
this.loading = false;
......
src/service/api/cardApi.js
......@@ -34,7 +34,7 @@ export const cardGetShelfs = params => requests(PREFIX + 'card-get-shelfs', para
export const getCardDetail = params => requests(PREFIX + 'get-card-detail', params);
//卡券营销--根据卡券名称模糊查询卡券列表
export const getCardListByName_ = params => requests(PREFIX + 'list-coupon-names', params);
export const getCardListByName = params => requests(PREFIX + 'list-coupon-names', params);
//卡券营销--卡券库--保存卡券
export const saveUpdateCard = params => requests(PREFIX + 'save-update-card', params);
......
src/views/card/partials/card-item.vue
......@@ -117,7 +117,7 @@ export default {
this.$router.push('/card/copy/' + this.item.coupCardId);
break;
case 7:
this.$router.push('/card/record/get?coupCardId=' + this.item.coupCardId);
this.$router.push('/card/record/get?coupCardId=' + this.item.coupCardId + '&new=1');
break;
}
},
......
src/views/card/record-get.vue
......@@ -16,7 +16,8 @@
<span class="vertical-middle">领取时间：</span><el-date-picker v-model="dateTime" :clearable="false" @change="changeTime" class="w250" type="daterange" range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期"></el-date-picker> <span class="vertical-middle">核销时间：</span><el-date-picker v-model="dateTime2" @change="refresh" class="w250" type="daterange" range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期"></el-date-picker>
</div>
<!-- 列表 -->
<el-table tooltipEffect="light" :data="recordList" style="width: 100%" @sort-change="sortList" empty-text="请选择单张卡券或开启全部卡券">
<el-table tooltipEffect="light" :data="recordList" style="width: 100%" @sort-change="sortList">
<div slot="empty">{{ listParams.coupCardId || listParams.allCouponFlag ? '暂无数据' : '请选择单张卡券或开启全部卡券' }}</div>
<el-table-column width="120" align="left" prop="receiveTime" label="领取时间" fixed="left" sortable="custom">
<template slot-scope="scope">
<p class="cell-time">
......@@ -154,6 +155,8 @@ export default {
if (this.$route.query.coupCardId) {
this.listParams.coupCardId = this.$route.query.coupCardId;
this.$refs.cdf.getCardDetail(this.listParams.coupCardId);
} else {
this.$refs.cdf.getCardList();
}
},
created() {
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment