Skip to content

M
marketing
Commit c2701155 by caoyanzhi
Options

Merge branch 'feature/3.0年后需求-卡券调整' into dev

parents 3c232eff 868dc2a5
Showing with 113 additions and 23 deletions
src/views/card/partials/card-item.vue
<template>
<li class="card-item inline-block" :style="'border:1px solid ' + item.cardColor">
<div class="card-item_head" :style="'background:' + item.cardColor">
<!-- gic定义的卡券类型(0:普通卡券, 1:e待洗, 2:好办卡券, 3:微盟外部券, 4:通用外部券 -->
<el-tooltip placement="top" v-if="item.gicCouponType == 3 || item.gicCouponType == 4">
<div style="max-width: 300px" slot="content">{{ item.gicCouponType | getTipText }}</div>
<span class="card-item_head-tip">外部券<i class="iconfont icon-xinxixianshi card-item_head-icon"></i></span>
</el-tooltip>
<h4>{{ item.cardName }}</h4>
<p>{{ item.subName }}</p>
</div>
......@@ -146,6 +151,15 @@ export default {
}
},
filters: {
getTipText(type) {
let result = '--';
if (type == 3) {
result = '当前卡券由微盟侧创建，由微盟侧进行卡券控制。在GIC侧只能用于卡券直投和只能营销。';
} else if (type == 4) {
result = '当前卡券由外部创建，由外部进行卡券控制，无法在GIC侧进行发放。';
}
return result;
},
filterUseCondition(val) {
var _useCondition = JSON.parse(val);
return (typeof _useCondition.sale_limit === 'undefined' ? '' : (typeof _useCondition.sale_limit.fee === 'undefined' ? '' : (_useCondition.sale_limit.fee ? '最低消费满' + _useCondition.sale_limit.fee : '无最低消费要求') + '；') + (typeof _useCondition.sale_limit.goods === 'undefined' ? '' : '消费指定商品' + _useCondition.sale_limit.goods + '；')) + (typeof _useCondition['goods'] === 'undefined' ? '' : (typeof _useCondition.goods.ok === 'undefined' ? '' : '适用商品（' + (_useCondition.goods.ok || '无') + ')；') + (typeof _useCondition.goods.no === 'undefined' ? '' : '不适用商品（' + (_useCondition.goods.no || '无') + ')；')) + (typeof _useCondition.only === 'undefined' || _useCondition.only == 0 ? '' : '不可与其他优惠共享');
......@@ -163,11 +177,30 @@ export default {
vertical-align: middle;
min-height: 376px;
&_head {
position: relative;
width: 100%;
text-align: center;
color: #fff;
background: #63b359;
padding: 10px 0;
.card-item_head-tip {
position: absolute;
top: -1px;
left: -1px;
width: 76px;
height: 24px;
line-height: 24px;
background: #d9e9f8;
border-radius: 3px 0px 16px 0px;
font-size: 12px;
font-weight: 400;
color: #1890ff;
cursor: default;
.card-item_head-icon {
margin-left: 5px;
font-size: 12px;
}
}
h4 {
font-size: 16px;
font-weight: 500;
......
src/views/card/partials/status-render.js
......@@ -14,8 +14,12 @@ export default Vue.component('render-temp', {
// 当前卡券是否 是长期有效||在投放有效期内
// putEffectiveMode 0：固定日期，1：长期
const canGroupSend = this.item.putEffectiveMode == 1 ? true : new Date() > new Date(this.item.putBeginDate) && new Date() < new Date(this.item.putEndDate);
const isWeimo = this.item.gicCouponType == 3;
const isCommon = this.item.gicCouponType == 4;
// 微盟外部券：领取记录、复制、投放、报表
// 通用外部券：领取记录、复制、报表
const bind1 =
canEdit && !isApiCreate && canGroupSend ? (
(canEdit && !isApiCreate && canGroupSend && !isCommon) || isWeimo ? (
<a title="投放" onClick={this.handler.bind(null, 1)}>
<i class="iconfont icon-daohang-" />
</a>
......@@ -27,27 +31,29 @@ export default Vue.component('render-temp', {
<i class="el-icon-tickets" />
</a>
);
const bind3 = !isApiCreate ? (
<a title="编辑" onClick={this.handler.bind(null, 3)}>
<i class="el-icon-edit" />
</a>
) : (
''
);
const bind4 = canEdit ? (
<a title="删除" onClick={this.handler.bind(null, 4)}>
<i class="el-icon-delete" />
</a>
) : (
''
);
const bind3 =
!isApiCreate && !isWeimo && !isCommon ? (
<a title="编辑" onClick={this.handler.bind(null, 3)}>
<i class="el-icon-edit" />
</a>
) : (
''
);
const bind4 =
canEdit && !isWeimo && !isCommon ? (
<a title="删除" onClick={this.handler.bind(null, 4)}>
<i class="el-icon-delete" />
</a>
) : (
''
);
const bind5 = (
<a title="详情" onClick={this.handler.bind(null, 5)}>
<i class="el-icon-document" />
</a>
);
const bind6 =
canEdit && !isApiCreate ? (
(canEdit && !isApiCreate) || isWeimo || isCommon ? (
<a title="复制" onClick={this.handler.bind(null, 6)}>
<i class="iconfont icon-wxcard-copy" />
</a>
......@@ -56,7 +62,7 @@ export default Vue.component('render-temp', {
);
const bind7 =
canEdit && !isApiCreate ? (
(canEdit && !isApiCreate) || isWeimo || isCommon ? (
<a style="position:relative;top:1px" title="领取记录" onClick={this.handler.bind(null, 7)}>
<i class="iconfont icon-tubiaozhizuomoban-" />
</a>
......
src/views/ecm/form.vue
......@@ -251,7 +251,7 @@
<section class="dm-form__wrap">
<h3 class="dm-title__label">营销事件</h3>
<!-- 只有实时才是单图文 -->
<marketing-event :readOnly="isInfo" ref="marketingEvent" @has-card="hasCard" v-if="ecmPlanId" :singleFlag="form.effectType === 0" :integralMultiple="form.effectAction === 'consume'" :ecmPlanId="ecmPlanId" :isSupportVar="form.effectType === 0" :code="code" :enabledMessageState="enabledMessageState" :cardLimitType="-1"></marketing-event>
<marketing-event :readOnly="isInfo" show-out-coupon-icon ref="marketingEvent" @has-card="hasCard" v-if="ecmPlanId" :singleFlag="form.effectType === 0" :integralMultiple="form.effectAction === 'consume'" :ecmPlanId="ecmPlanId" :isSupportVar="form.effectType === 0" :code="code" :enabledMessageState="enabledMessageState" :cardLimitType="-1"></marketing-event>
<!-- 只有非实时&&选择卡券了展示提示 -->
<div v-if="currentCard.comName && form.effectType != 0 && couponAutoGetFlag" class="fz13 regular-font-color line-height2" style="margin-left:120px;margin-top:30px;">
* 用户在领取卡券后需要<b class="bold">同步至ERP</b>，如果关闭用户<b class="bold">手动领取</b>，卡券在<b class="bold">批量投放</b>时会需要将卡券信息批量同步至ERP。 <br />
......
src/views/ecm/marketing-event/components/lib-card.vue
......@@ -22,9 +22,13 @@
</div>
</template>
</el-table-column>
<el-table-column :show-overflow-tooltip="true" width="140" align="left" prop="cardName" label="卡券名称">
<el-table-column width="140" align="left" prop="cardName" label="卡券名称">
<template slot-scope="scope">
<p style="line-height:22px;">{{ scope.row.cardName }}</p>
<el-tooltip v-if="scope.row.showTooltip" :content="scope.row.cardName" placement="top">
<span class="card-name" :style="{ 'max-width': showOutCouponIcon && (scope.row.gicCouponType == 3 || scope.row.gicCouponType == 4) ? '65px' : '115px' }">{{ scope.row.cardName }}</span>
</el-tooltip>
<span v-else class="card-name">{{ scope.row.cardName }}</span>
<i class="out-coupon-icon" v-if="showOutCouponIcon && (scope.row.gicCouponType == 3 || scope.row.gicCouponType == 4)">外部券</i>
<p style="line-height:20px;color:#909399;font-size:13px;">{{ scope.row.subName }}</p>
</template>
</el-table-column>
......@@ -71,6 +75,11 @@ export default {
cardLimitType: {
type: Number,
default: 1
},
// 是否展示外部券标识 true：展示 false不展示
showOutCouponIcon: {
type: Boolean,
default: false
}
},
computed: {
......@@ -113,6 +122,17 @@ export default {
this.getCardList();
},
methods: {
getTextWidth(text) {
const span = document.createElement('span');
span.innerHTML = text;
span.style.position = 'fixed';
span.style.zIndex = -1;
span.style.opacity = 0;
document.body.appendChild(span);
const width = span.offsetWidth;
document.body.removeChild(span);
return width;
},
handleSizeChange(val) {
this.listParams.pageSize = val;
this.getCardList();
......@@ -125,7 +145,11 @@ export default {
this.loading = true;
getCardList(this.listParams).then(res => {
if (res.errorCode === 0) {
this.tableList = res.result.result || [];
this.tableList = (res.result.result || []).map(el => {
// 如果是外部券，而且配置显示外部券标识，需要缩短cardName的显示长度
el.showTooltip = this.getTextWidth(el.cardName) > (this.showOutCouponIcon && (el.gicCouponType == 3 || el.gicCouponType == 4) ? 65 : 115);
return el;
});
this.total = res.result.totalCount;
}
this.loading = false;
......@@ -160,3 +184,25 @@ export default {
}
};
</script>
<style lang="scss" scoped>
.card-name {
display: inline-block;
vertical-align: middle;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
line-height: 22px;
}
.out-coupon-icon {
margin-left: 5px;
padding: 3px 4px;
background: #fff1f0;
border-radius: 2px;
border: 1px solid #ffa39e;
font-size: 12px;
font-weight: 400;
color: #f5222d;
font-style: normal;
}
</style>
src/views/ecm/marketing-event/index.vue
......@@ -32,7 +32,7 @@
</transition>
</div>
<!-- 弹窗组件 -->
<component :is="dialogCom" @sendItem="saveToList" :item="currentItem" :show.sync="dialogShow" :isSupportVar="isSupportVar" :cardLimitType="cardLimitType" :integralMultiple="integralMultiple" :singleFlag="singleFlag"></component>
<component :is="dialogCom" @sendItem="saveToList" :showOutCouponIcon="showOutCouponIcon" :item="currentItem" :show.sync="dialogShow" :isSupportVar="isSupportVar" :cardLimitType="cardLimitType" :integralMultiple="integralMultiple" :singleFlag="singleFlag"></component>
</section>
</template>
......@@ -125,6 +125,11 @@ export default {
// 只读
type: Boolean,
default: false
},
// 是否展示外部券标识，仅用于卡券选择器中控制外部券标识展示 true：展示 false不展示
showOutCouponIcon: {
type: Boolean,
default: false
}
},
data() {
......
src/views/ecm/scan-form.vue
......@@ -57,7 +57,7 @@
<h3 class="title mt46">营销事件</h3>
<div>
<!-- 只有实时才是单图文 -->
<marketing-event style="margin-top:0;" :readOnly="isInfo" ref="marketingEvent" @has-card="hasCard" v-if="ecmPlanId" :singleFlag="form.effectType === 0" :integralMultiple="form.effectAction === 'consume'" :ecmPlanId="ecmPlanId" :isSupportVar="form.effectType === 0" :code="code" :enabledMessageState="enabledMessageState" :cardLimitType="-1"></marketing-event>
<marketing-event style="margin-top:0;" show-out-coupon-icon :readOnly="isInfo" ref="marketingEvent" @has-card="hasCard" v-if="ecmPlanId" :singleFlag="form.effectType === 0" :integralMultiple="form.effectAction === 'consume'" :ecmPlanId="ecmPlanId" :isSupportVar="form.effectType === 0" :code="code" :enabledMessageState="enabledMessageState" :cardLimitType="-1"></marketing-event>
<!-- 只有存在卡券的情况下出现卡券通知方式 -->
<section v-if="currentCard.comName">
<h3 class="title mt46">卡券通知方式配置</h3>
......
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