Skip to content

M
marketing
Commit a3da492c by zhangmeng
Options

营销事件组件

parent f0b159f7
Showing with 920 additions and 277 deletions
src/router/modules/ecm.js
......@@ -2,6 +2,9 @@
import ecm from '../../views/ecm'
import ecmList from '../../views/ecm/list'
import addEdit from '../../views/ecm/addEdit'
import batchList from '../../views/ecm/batch-list'
import currentList from '../../views/ecm/current-list'
export default {
......@@ -35,7 +38,23 @@ export default {
type: 'add',
path:'/ecm/list'
}
}
},
{
path: 'batchlist',
name: '批次记录',
component: batchList,
meta: {
path:'/ecm/list'
}
},
{
path: 'currentlist',
name: '实时发送记录',
component: currentList,
meta: {
path:'/ecm/list'
}
},
]
}
......
src/service/api/ecmApi.js
......@@ -14,5 +14,20 @@ export const deleteEcm = (params) => requests(PREFIX + 'delete-ecm', params);
//智能营销--ECM营销引擎-- 新建/修改 回显智能引擎计划信息
export const getEcmInfo = (params) => requests(PREFIX + 'get-ecm-info', params);
//智能营销--ECM营销引擎-- 新建/修改 [保存]计划信息
// 智能营销--ECM营销引擎-- 新建/修改 [保存]计划信息
export const saveEcmInfo = (params) => requests(PREFIX + 'save-update-ecm', params);
// 智能营销--下线 TODO
export const offlineEcmPlan = (params) => requests(PREFIX + 'deprecate/ecm-plan-offline', params);
// 智能营销--记录--批次记录页面 TODO
export const ecmBatchSendInfos = (params) => requests(PREFIX + 'deprecate/ecm-batch-send-infos', params);
// 智能营销--记录--批次人员列表 TODO
export const ecmBatchSendDetails = (params) => requests(PREFIX + 'deprecate/ecm-batch-send-details', params);
// 智能营销--实时发送记录类型 TODO
export const ecmCurrentSendInfos = (params) => requests(PREFIX + 'deprecate/ecm-current-send-infos', params);
// 智能营销--实时发送人员列表 TODO
export const ecmCurrentSendDetails = (params) => requests(PREFIX + 'deprecate/ecm-current-send-details', params);
src/test/dmMarketing/api.js → src/test/dmMarketing/assets/api.js
......@@ -151,9 +151,11 @@ export const addGroupService = (params) => requests( PREFIX + 'save-marketing-we
// 智能营销--ECM营销引擎-- 新建/修改 --回显营销事件类型详情 TODO
export const getMarketingTypeDetails = (params) => requests( PREFIX + 'deprecate/get-marketing-type-details', params);
// 智能营销--新增/修改营销事件类型
export const saveUpdateMarketingType = (params) => requests( PREFIX + 'deprecate/save-update-marketing-type', params);
// 智能营销 --删除营销事件
export const deleteMarketingType = (params) => requests( PREFIX + 'deprecate/delete-marketing-Type', params);
//模板库--分页列表 （有效）
export const LoadTempList = (params) => requests(PREFIX + 'load-message-templateList', params);
src/test/dmMarketing/assets/emitter.js 0 → 100644
"use strict";
exports.__esModule = true;
function _broadcast(componentName, eventName, params) {
this.$children.forEach(function (child) {
var name = child.$options.componentName;
if (name === componentName) {
child.$emit.apply(child, [eventName].concat(params));
} else {
_broadcast.apply(child, [componentName, eventName].concat([params]));
}
});
}
exports.default = {
methods: {
dispatch: function dispatch(componentName, eventName, params) {
var parent = this.$parent || this.$root;
var name = parent.$options.componentName;
while (parent && (!name || name !== componentName)) {
parent = parent.$parent;
if (parent) {
name = parent.$options.componentName;
}
}
if (parent) {
parent.$emit.apply(parent, [eventName].concat(params));
}
},
broadcast: function broadcast(componentName, eventName, params) {
_broadcast.call(this, componentName, eventName, params);
}
}
};
src/test/dmMarketing/style/index.css → src/test/dmMarketing/assets/style/index.css
......@@ -8,6 +8,9 @@
.w240 {
width: 240px;
}
.w400{
width: 400px;
}
.w500{
width: 500px;
}
......@@ -18,9 +21,24 @@
.block{
display: block!important;
}
.gray-color{
.gray-color,.gray{
color:#909399;
}
.pb22 {
padding-bottom:22px;
}
.pb10 {
padding-bottom:10px;
}
.pl20 {
padding-left: 20px;
}
.pl10{
padding-left:10px;
}
.pr10{
padding-right:10px;
}
.fz13 {
font-size: 13px;
}
......@@ -33,6 +51,7 @@
.fr {
float: right;
}
.clearfix:after{
display: block;
clear: both;
......@@ -79,9 +98,6 @@
-webkit-line-clamp:3;
-webkit-box-orient:vertical
}
.pb22{
padding-bottom: 22px;
}
.blue {
color: #1890ff;
cursor: pointer;
......@@ -90,6 +106,14 @@
opacity: 0;
position: absolute;
}
.dm-pagination {
text-align: right;
margin: 24px 0 10px 0;
}
.text-left {
text-align: left;
}
/* reset样式end */
.dm-marketing__opt{
......@@ -118,6 +142,11 @@
color:#1890ff;
border:1px solid #1890ff;
}
.dm-marketing__opt--icon.el-icon-delete:hover {
color:#f56c6c;
border:1px solid #f56c6c;
}
.dm-marketing__opt--icon--bottom{
margin:20px 0 0 60px;
}
......@@ -256,7 +285,7 @@
margin-left: 10px;
}
.dm-img__item__wrap{
.dm-image__item__wrap{
display: inline-block;
margin-left: 10px;
vertical-align: middle;
......@@ -267,12 +296,12 @@
border-radius: 2px;
}
.dm-img__item__wrap > img {
.dm-image__item__wrap > img {
width: auto;
height: 100%;
}
.dm-app__item__wrap{
.dm-wxa__item__wrap{
display: inline-block;
position: relative;
width: 320px;
......@@ -284,19 +313,19 @@
border-radius:4px;
box-shadow: 0px 2px 8px 0px rgba(0,0,0,0.10);
}
.dm-app__item{
.dm-wxa__item{
padding:15px;
}
.dm-app__avatar {
.dm-wxa__avatar {
padding-bottom:15px;
}
.dm-app__avatar > img {
.dm-wxa__avatar > img {
width: 50px;
height: 50px;
border-radius: 50%;
vertical-align: middle;
}
.dm-app__avatar > span {
.dm-wxa__avatar > span {
vertical-align: middle;
max-width: 100px;
line-height: 20px;
......@@ -304,18 +333,18 @@
text-overflow: ellipsis;
}
.dm-app__item > img{
.dm-wxa__item > img{
display: inline-block;
width: 290px;
height: 163px;
margin: 20px 0 15px;
}
.dm-app__item--bottom > img {
.dm-wxa__item--bottom > img {
width: 14px;
height: 14px;
vertical-align: middle;
}
.dm-app__item--bottom > span {
.dm-wxa__item--bottom > span {
vertical-align: middle;
color: #909399;
font-size: 12px;
......@@ -380,8 +409,8 @@
}
/* tel msg */
.dm-msg__item__wrap,.dm-tel__item__wrap{
/* teltask message */
.dm-message__item__wrap,.dm-teltask__item__wrap{
width: 760px;
height: 94px;
margin:0 10px;
......@@ -390,12 +419,12 @@
display: inline-block;
vertical-align: middle;
}
.dm-msg__item,.dm-tel__item{
.dm-message__item,.dm-teltask__item{
padding: 15px;
display: inline-block;
vertical-align: middle;
}
.dm-msg__item--title,.dm-tel__item--title {
.dm-message__item--title,.dm-teltask__item--title {
font-size: 16px;
max-height: 36px;
line-height: 36px;
......@@ -406,7 +435,7 @@
-webkit-box-orient: vertical;
}
.dm-msg__item--content,.dm-tel__item--content {
.dm-message__item--content,.dm-teltask__item--content {
font-size: 14px;
color: #606266;
max-height: 30px;
......
src/test/dmMarketing/utils.js → src/test/dmMarketing/assets/utils.js
......@@ -69,3 +69,19 @@ export const formateDateTimeByType = (date, type = 'yyyy-MM-dd-HH-mm-ss') => {
}
return Math.ceil(len);
};
/*
* 一个汉字算一个字,两个英文/字母算一个字
*/
export const getByteVal2 = (val) => {
var returnValue = '';
var byteValLen = 0;
for (var i = 0; i < val.length; i++) {
if (val[i].match(/[^\x00-\xff]/ig) != null)
byteValLen += 1;
else
byteValLen += 0.5;
returnValue += val[i];
}
return returnValue;
}
src/test/dmMarketing/components/dm-delete.vue 0 → 100644
<template>
<el-popover class="el-button el-button--text"
placement="top"
width="160"
v-model="visible">
<p style="line-height:1.5;padding:10px 10px 20px;color:#606266;">{{tips}}</p>
<div style="text-align: right; margin: 0">
<el-button size="mini" type="text" @click="cancel">取消</el-button>
<el-button type="primary" size="mini" @click="confirm">确定</el-button>
</div>
<span slot="reference"><slot></slot></span>
</el-popover>
</template>
<script>
export default {
name:'dm-delete',
props:{
tips:{
type:String,
default:'是否删除?'
},
},
data() {
return {
visible: false,
};
},
methods:{
cancel() {
this.visible = false
},
confirm() {
this.visible = false
this.$emit('confirm')
}
}
}
</script>
src/test/dmMarketing/components/dm-input.vue 0 → 100644
<template>
<div class="dm-input" :class="{'disabled':disabled}">
<el-input
ref="elInput"
v-model="currentValue"
:placeholder="placeholder"
:size="size"
:resize="resize"
:name="name"
:form="form"
:id="id"
:maxlength="maxlength"
:minlength="minlength"
:readonly="readonly"
:autofocus="autofocus"
:disabled="disabled"
:type="type"
:autosize="autosize"
:rows="rows"
:autoComplete="autoComplete"
:max="max"
:min="min"
:step="step"
:validateEvent="validateEvent"
:suffixIcon="suffixIcon"
:prefixIcon="prefixIcon"
:label="label"
:clearable="clearable"
:tabindex="tabindex"></el-input>
<div class="dm-input__counter" :class="{'text-area':type === 'textarea'}">
<div class="dm-input__counter--inner">
<span class="cur">{{currentValue.length}}</span>
<span class="split"> / </span>
<span class="max">{{maxlength||0}}</span>
</div>
</div>
</div>
</template>
<script>
import emitter from '../assets/emitter.js';
export default {
name: 'dm-input',
props: {
// 自定义属性
// maxLength: Number,
// 原生属性
value: [String, Number],
placeholder: String,
size: String,
resize: String,
name: String,
form: String,
id: String,
maxlength: Number,
minlength: Number,
readonly: Boolean,
autofocus: Boolean,
disabled: Boolean,
type: {
type: String,
default: 'text'
},
autosize: {
type: [Boolean, Object],
default: false
},
rows: {
type: Number,
default: 2
},
autoComplete: {
type: String,
default: 'off'
},
max: {},
min: {},
step: {},
validateEvent: {
type: Boolean,
default: true
},
suffixIcon: String,
prefixIcon: String,
label: String,
clearable: {
type: Boolean,
default: false
},
tabindex: String
},
data() {
return {
currentValue: this.value,
};
},
// computed: {
// readonly() {
// return this.currentValue.length >= this.maxlength;
// }
// },
watch: {
value(val) {
if (val !== this.currentValue) {
this.currentValue = val;
}
},
currentValue(val) {
let value = '';
if (val.length > this.maxlength) {
value = val.slice(0, maxlength - 1);
} else {
value = val;
}
this.$emit('input', value);
this.dispatch('ElFormItem', 'el.form.change', [val]);
}
},
mixins: [emitter],
}
</script>
<style lang="scss" scoped>
.dm-input {
display: inline-block;
background: #fff;
width: 100%;
position: relative;
&.disabled {
background: #f5f7fa;
}
&__counter {
position: absolute;
bottom: 1px;
right: 10px;
height: 28px;
line-height: 12px;
font-size: 12px;
background: inherit;
opacity: 0.9;
&--inner{
display: flex;
align-items: center;
height: 100%;
& > span {
color:#909399;
}
}
}
&__counter.text-area {
bottom: -20px;
height: 20px;
right: 0;
}
}
</style>
src/test/dmMarketing/components/item-card.vue
<template>
<div class="inline-block">
<div class="dm-card__item__wrap">
<div class="dm-card__item" :style="{background:item.cardColor}">
<img class="dm-card__item__avatar" :src="loadErrorImg" alt="">
<img class="dm-card__item__avatar" :src="item.brandLogo || loadErrorImg" alt="">
<div class="inline-block">
<p class="dm-card__item__title">{{item.cardName}}</p>
<p class="dm-card__item__desc" v-if="item.cardEffectiveMode !== 0">领取后第{{item.startDay+1}}-{{item.limitDay+item.startDay}}天</p>
<p class="dm-card__item__desc" v-if="item.cardEffectiveMode === 0">{{formateDateTimeByType(item.beginDate,'yyyy-MM-dd')}} 至 {{formateDateTimeByType(item.endDate,'yyyy-MM-dd')}}</p>
</div>
</div>
<p class="dm-card__item--bottom">
<span>适用{{item.storeMode === 0 ? "所有门店" : (item.storeMode === 1 ? "部分分组" : "部分门店")}}</span>
</p>
</div>
<i class="el-icon-delete dm-marketing__opt--icon" @click="del"></i>
</div>
</template>
<script>
import {formateDateTimeByType} from '../utils.js'
import {formateDateTimeByType} from '../assets/utils.js'
export default {
name:'item-card',
data(){
......@@ -35,11 +31,6 @@ export default {
return {}
}
}
},
methods:{
del() {
this.$emit('del');
}
}
}
</script>
......
src/test/dmMarketing/components/item-img.vue → src/test/dmMarketing/components/item-image.vue
<template>
<span class="inline-block">
<span class="dm-img__item__wrap">
<img :src="item.qcloudImageUrl || loadErrorImg" alt="">
<span class="dm-image__item__wrap">
<img :src="item.qcloudImageUrl || loadErrorImg" alt="">
</span>
<i class="el-icon-delete dm-marketing__opt--icon" @click="del"></i>
</span>
</template>
<script>
export default {
name: 'item-img',
name: 'item-image',
props: {
item: {
type: Object,
......@@ -21,12 +18,7 @@ export default {
},
data() {
return {
loadErrorImg:require('../img/loaderror.png')
}
},
methods:{
del() {
this.$emit('del');
loadErrorImg:require('../assets/img/loaderror.png')
}
}
}
......
src/test/dmMarketing/components/item-sms.vue → src/test/dmMarketing/components/item-message.vue
<template>
<span class="inline-block">
<span class="dm-msg__item__wrap">
<div class="dm-msg__item">
<p class="dm-msg__item--title">{{item.title}}</p>
<p class="dm-msg__item--content">{{item.content}}</p>
<span class="dm-message__item__wrap">
<div class="dm-message__item">
<p class="dm-message__item--title">{{item.title}}</p>
<p class="dm-message__item--content">{{item.content}}</p>
</div>
</span>
<i class="el-icon-delete dm-marketing__opt--icon" @click="del"></i>
</span>
</template>
<script>
export default {
name: 'item-sms',
name: 'item-message',
props: {
item: {
type: Object,
......@@ -21,11 +18,6 @@ export default {
return {}
}
}
},
methods:{
del() {
this.$emit('del');
}
}
}
</script>
src/test/dmMarketing/components/item-img-text.vue → src/test/dmMarketing/components/item-teletext.vue
<template>
<div class="inline-block">
<div class="dm-imgText__item__wrap" >
<div v-for="(v,i) in item.itemList" :key="i">
<div class="dm-imgText__item" v-if="i === 0" @mouseover="v.maskShow = true" @mouseout="v.maskShow = false">
......@@ -15,17 +14,15 @@
</div>
</div>
</div>
<i class="el-icon-delete dm-marketing__opt--icon" @click="del"></i>
</div>
</template>
<script>
export default {
name:'item-img-text',
name:'item-teletext',
data(){
return {
maskShow:false,
loadErrorImg:require('../img/loaderror.png')
loadErrorImg:require('../assets/img/loaderror.png')
}
},
props:{
......@@ -44,11 +41,6 @@ export default {
v.maskShow = false
})
}
},
methods:{
del() {
this.$emit('del');
}
}
}
</script>
......
src/test/dmMarketing/components/item-tel.vue → src/test/dmMarketing/components/item-teltask.vue
<template>
<span class="inline-block">
<span class="dm-tel__item__wrap">
<div class="dm-tel__item">
<p class="dm-tel__item--title">{{item.title}} <span class="fz13 gray-color">任务逾期判定{{item.lateDays}}天之后</span></p>
<p class="dm-tel__item--content">{{item.describe}}</p>
<span class="dm-teltask__item__wrap">
<div class="dm-teltask__item">
<p class="dm-teltask__item--title">{{item.title}} <span class="fz13 gray-color">任务逾期判定{{item.lateDays}}天之后</span></p>
<p class="dm-teltask__item--content">{{item.content}}</p>
</div>
</span>
<i class="el-icon-edit dm-marketing__opt--icon" @click="edit"></i>
<i class="el-icon-delete dm-marketing__opt--icon" @click="del"></i>
</span>
</template>
<script>
export default {
name: 'item-tel',
name: 'item-teltask',
props: {
item: {
type: Object,
......@@ -22,14 +18,6 @@ export default {
return {}
}
}
},
methods:{
del() {
this.$emit('del');
},
edit() {
this.$emit('edit',this.item);
}
}
}
</script>
src/test/dmMarketing/components/item-text.vue
<template>
<span class="inline-block">
<span class="dm-text__wrap ellipsis-l2 inline-block" v-html="item.textarea"></span>
<i class="el-icon-edit dm-marketing__opt--icon" @click="edit"></i>
<i class="el-icon-delete dm-marketing__opt--icon" @click="del"></i>
</span>
<span class="dm-text__wrap ellipsis-l2 inline-block" v-html="item.content"></span>
</template>
<script>
export default {
......@@ -15,14 +11,6 @@ export default {
return {}
}
}
},
methods:{
del() {
this.$emit('del');
},
edit() {
this.$emit('edit');
}
}
}
</script>
src/test/dmMarketing/components/item-app.vue → src/test/dmMarketing/components/item-wxa.vue
<template>
<div class="inline-block">
<div class="dm-app__item__wrap" @mouseover="maskShow = true" @mouseout="maskShow = false">
<div class="dm-app__item">
<div class="dm-app__avatar">
<img :src="item.imageUrl || loadErrorImg" alt="">
<span>{{item.wechatContent.title}}</span>
<div class="dm-wxa__item__wrap" @mouseover="maskShow = true" @mouseout="maskShow = false">
<div class="dm-wxa__item">
<div class="dm-wxa__avatar">
<img :src="item.brandLogo || loadErrorImg" alt="">
<span>{{item.brandName}}</span>
</div>
<p class="ellipsis-l2">{{item.text}}</p>
<p class="ellipsis-l2">{{item.title}}</p>
<img :src="item.imageUrl || loadErrorImg" alt="" srcset="">
<p class="dm-app__item--bottom"><img src="../img/app-circle.svg" alt="" srcset=""><span> 小程序</span></p>
<p class="dm-wxa__item--bottom"><img src="../img/wxa-circle.svg" alt="" srcset=""><span> 小程序</span></p>
</div>
</div>
<i class="el-icon-edit dm-marketing__opt--icon" @click="edit"></i>
<i class="el-icon-delete dm-marketing__opt--icon" @click="del"></i>
</div>
</template>
<script>
export default {
name:'item-app',
name:'item-wxa',
data(){
return {
maskShow:false,
loadErrorImg:require('../img/loaderror.png')
loadErrorImg:require('../assets/img/loaderror.png')
}
},
props:{
......@@ -32,16 +28,7 @@ export default {
return {}
}
}
},
methods:{
del() {
this.$emit('del');
},
edit() {
}
}
}
</script>
src/test/dmMarketing/components/lib-card.vue
......@@ -38,7 +38,7 @@
</template>
<script>
import {getCardList} from '../api.js';
import {getCardList} from '../assets/api.js';
export default {
name:'lib-card',
props:{
......@@ -89,12 +89,15 @@ export default {
this.listParams.currentPage = val;
this.getCardList();
},
async getCardList() {
this.loading = true;
let res = await getCardList(this.listParams);
this.tableList = res.result.result || [];
this.total = res.result.totalCount;
getCardList() {
this.loading = true;
getCardList(this.listParams).then(res => {
if (res.errorCode === 0) {
this.tableList = res.result.result || [];
this.total = res.result.totalCount;
}
this.loading = false;
})
},
reset() {
this.listParams.searchParams = '';
......@@ -104,12 +107,12 @@ export default {
this.$emit('update:show',false);
},
rowClick(row) {
row.comName = 'item-card';
row.comName = 'card';
this.selectedData = row;
},
addItem() {
if (!this.selectedData.comName) {
this.$tips({type:'warning',message:'未选择卡券'});
this.$message({type:'warning',message:'未选择卡券'});
return;
}
this.$emit('sendItem',this.selectedData);
......
src/test/dmMarketing/components/lib-img.vue → src/test/dmMarketing/components/lib-image.vue
......@@ -4,7 +4,7 @@
<nav class="fl">
<h4 class="text-left pl10" ><el-button style="font-weight: 500;" size="small" type="text" icon="el-icon-plus" @click.stop="addGroup">新建分组</el-button></h4>
<ul class="dm-ilib-category">
<li v-for="(v,i) in groupsList" :key="i" @click="changeCate(v)" :class="{'active':listParams.wechatImageGroupId===v.wechatImageGroupId}"><span class="ellipsis-80">{{v.groupName}}</span><span class="fz10 gray"> ({{v.imageCount}})</span></li>
<li v-for="(v,i) in groupsList" :key="i" @click="changeGroup(v)" :class="{'active':listParams.wechatImageGroupId===v.wechatImageGroupId}"><span class="ellipsis-80">{{v.groupName}}</span><span class="fz10 gray"> ({{v.imageCount}})</span></li>
</ul>
</nav>
<article class="fr">
......@@ -36,8 +36,9 @@
</span>
</el-dialog>
</template>
<script>
import {loadImgList,addGroupService} from '../api.js';
import {loadImgList,addGroupService} from '../assets/api.js';
export default {
name:'lib-img',
props:{
......@@ -78,54 +79,35 @@ export default {
this.listParams.currentPage = val;
this.loadImgList();
},
changeCate(v){
this.listParams.wechatImageGroupId = v.wechatImageGroupId;
this.loadImgList();
},
async loadImgList() {
loadImgList() {
this.loading = true;
let res = await loadImgList(this.listParams);
this.total = res.result.page.totalCount;
this.currentGroup = res.result.currentGroup;
this.groupsMoveList = Object.assign([],res.result.groups);
this.groupsList = res.result.groups;
this.groupsList.unshift({wechatImageGroupId: "",groupName: "所有图片",imageCount: res.result.totalPicsCount })
this.imgList = [];
if (res.result.page.result) {
const resList = res.result.page.result;
this.$nextTick(_ => {
resList.map(v => {
this.imgList.push(v)
})
})
} else {
this.imgList = [];
}
this.loading = false;
},
//图片上传相关
handleRemove(file, fileList) {
console.log(file, fileList);
},
handlePreview(file) {
console.log(file);
},
handleExceed(files, fileList) {
this.$message.warning(`当前限制选择 3 个文件，本次选择了 ${files.length} 个文件，共选择了 ${files.length + fileList.length} 个文件`);
},
beforeRemove(file, fileList) {
return this.$confirm(`确定移除 ${ file.name }？`);
loadImgList(this.listParams).then(res => {
if (res.errorCode === 0) {
this.total = res.result.page.totalCount;
this.currentGroup = res.result.currentGroup;
this.groupsMoveList = Object.assign([],res.result.groups);
this.groupsList = res.result.groups;
this.groupsList.unshift({wechatImageGroupId: "",groupName: "所有图片",imageCount: res.result.totalPicsCount })
this.imgList = [];
if (res.result.page.result) {
const resList = res.result.page.result;
this.$nextTick(_ => {
resList.map(v => {
this.imgList.push(v)
})
})
} else {
this.imgList = [];
}
}
this.loading = false;
}).catch(err => {
this.$message({type:'warning',message:'获取图片列表错误'});
})
},
uploadSuccess(response,file,fileList) {
if (response.errorCode === 0) {
this.$tips({type:'warning',message:'上传成功'});
this.fileList = []
this.loadImgList();
} else {
this.$tips({type:'warning',message:response.message});
}
changeGroup(v){
this.listParams.wechatImageGroupId = v.wechatImageGroupId;
this.loadImgList();
},
addGroup() {
this.$prompt('', '新增分组', {
......@@ -139,28 +121,32 @@ export default {
this.addGroupService(value);
}).catch(err => {
console.log(err)
// this.$tips({
// type: 'info',
// message: '取消新增'
// });
});
},
async addGroupService(val) {
let res = await addGroupService({groupName:val});
this.$tips({type: 'success',message: '新增成功'});
this.loadImgList();
addGroupService(val) {
addGroupService({groupName:val}).then(res => {
if (res.errorCode === 0) {
this.$message({type: 'success',message: '新增成功'});
this.loadImgList();
} else {
this.$message({type: 'error',message: '新增失败'});
}
}).catch(err => {
this.$message({type: 'error',message: '新增失败'});
})
},
close() {
this.$emit('update:show',false);
},
rowClick(row) {
row.comName = 'item-img';
row.comName = 'image';
row.title = row.imageTitle;
this.selectedId = [row.imageId];
this.selectedData = row;
},
addItem() {
if (!this.selectedData.comName) {
this.$tips({type:'warning',message:'未选择图片'});
this.$message({type:'warning',message:'未选择图片'});
return;
}
this.$emit('sendItem',this.selectedData);
......
src/test/dmMarketing/components/lib-sms.vue → src/test/dmMarketing/components/lib-message.vue
<template>
<el-dialog title="选择短信" :visible.sync="show" width="800px" :before-close="close">
<div class="pb22 clearfix">
<div class="fl">共{{total}}条</div><el-input clearable v-model="listParams.search" class="w200" placeholder="请输入标题/作者" @change="refresh"><i slot="prefix" class="el-input__icon el-icon-search"></i></el-input>
<div class="fl"><span class="pr10">共{{total}}条</span><el-input clearable v-model="listParams.search" class="w200" placeholder="请输入标题/作者" @change="refresh"><i slot="prefix" class="el-input__icon el-icon-search"></i></el-input></div>
<div class="fr">
<el-button type="primary" @click="add">新建短信</el-button>
<el-button @click="refresh">刷新列表</el-button>
......@@ -10,7 +10,7 @@
<el-table tooltipEffect="light" :data="smsTempList" style="width: 100%" v-loading="loading" @row-click="rowClick">
<el-table-column :show-overflow-tooltip="false" :width="60" align="center" prop="smsTemplateId">
<template slot-scope="scope">
<div class="sms-record_left label-hidden">
<div class="label-hidden">
<el-radio v-model="selectedData" :label="scope.row" class="pr10"></el-radio>
</div>
</template>
......@@ -36,9 +36,9 @@
</template>
<script>
import {LoadTempList} from '@/service/api/messageApi.js';
import { LoadTempList } from '../assets/api.js';
export default {
name:'lib-sms',
name:'lib-message',
props:{
show:{
type:Boolean,
......@@ -72,18 +72,20 @@ export default {
LoadTempList() {
this.loading = true;
LoadTempList(this.listParams).then(res => {
this.smsTempList = res.result.result || [];
this.total = res.result.totalCount;
if (res.errorCode === 0) {
this.smsTempList = res.result && res.result.result || [];
this.total = res.result && res.result.totalCount;
}
this.loading = false;
})
this.loading = false;
},
rowClick(row) {
row.comName = 'item-sms';
row.comName = 'message';
this.selectedData = row;
},
addItem() {
if (!this.selectedData.comName) {
this.$tips({type:'warning',message:'未选择短信'});
this.$message({type:'warning',message:'未选择短信'});
return;
}
this.$emit('sendItem',this.selectedData);
......
src/test/dmMarketing/components/lib-img-text.vue → src/test/dmMarketing/components/lib-teletext.vue
......@@ -45,10 +45,10 @@
</template>
<script>
import {loadImgTextList} from '../api.js';
import {formateDateTimeByType} from '../utils.js'
import {loadImgTextList} from '../assets/api.js';
import {formateDateTimeByType} from '../assets/utils.js'
export default {
name:'lib-img-text',
name:'lib-teletext',
props:{
show:{
type:Boolean,
......@@ -74,7 +74,7 @@ export default {
methods:{
loadImgTextList() {
this.loading = true;
let res = loadImgTextList(this.listParams).then(res => {
loadImgTextList(this.listParams).then(res => {
if (res.errorCode === 0) {
this.textImgList = res.result.result || [];
this.total = res.result.totalCount;
......@@ -83,16 +83,19 @@ export default {
v.updateTimeStr = formateDateTimeByType(v.updateTime,'yyyy-MM-dd-HH-mm')
})
}
this.loading = false;
})
this.loading = false;
},
rowClick(row) {
row.comName = 'item-img-text';
row.comName = 'teletext';
row.title = row.itemList[0] && row.itemList[0].titleName;
console.log(row)
this.selectedData = row;
},
addItem() {
if (!this.selectedData.comName) {
this.$tips({type:'warning',message:'未选择图文消息'});
this.$message({type:'warning',message:'未选择图文消息'});
return;
}
this.$emit('sendItem',this.selectedData);
......
src/test/dmMarketing/components/lib-tel.vue → src/test/dmMarketing/components/lib-teltask.vue
<template>
<el-dialog title="编辑话务" :visible.sync="show" width="600px" :before-close="close">
<el-form ref="form" :model="form" label-width="100px" :rules="rules" v-loading="loading" >
<el-form-item label="话务任务标题" class="pb10 pt5">
<el-form ref="form" :model="form" label-width="110px" :rules="rules" v-loading="loading" >
<el-form-item label="话务任务标题" class="pb10" prop="title">
<dm-input class="w400" v-model="form.title" placeholder="限制20个字符" :maxlength="20"></dm-input>
</el-form-item>
<el-form-item label="话务任务内容" class="pb10">
<dm-input class="w400" :rows="4" type="textarea" v-model="form.describe" placeholder="限制200个字符" :maxlength="200"></dm-input>
<el-form-item label="话务任务内容" class="pb10" prop="content">
<dm-input class="w400" :rows="4" type="textarea" v-model="form.content" placeholder="限制200个字符" :maxlength="200"></dm-input>
</el-form-item>
<el-form-item label="任务逾期判定">
<el-form-item label="任务逾期判定" prop="lateDays">
<el-input-number controls-position="right" class="w400" v-model="form.lateDays"></el-input-number> 天之后
</el-form-item>
</el-form>
......@@ -19,9 +19,13 @@
</template>
<script>
import {getCardList} from '../api.js';
import {getCardList} from '../assets/api.js';
import dmInput from './dm-input.vue';
export default {
name:'lib-tel',
components:{
'dm-input':dmInput,
},
props:{
item:{
type:Object,
......@@ -38,21 +42,39 @@ export default {
return{
form:{
title:'',
describe:'',
lateDays:'',
content:'',
},
rules:{
title:{required:true,type:'string',message:'话务任务标题不能为空',trigger:'blur'},
content:{required:true,type:'string',message:'话务任务内容不能为空',trigger:'blur'},
lateDays:{required:true,type:'number',message:'任务逾期判定不能为空',trigger:'blur'}
},
rules:{},
loading:false
}
},
watch:{
show(val) {
this.form = {
title:'',
lateDays:'',
content:'',
};
if (val && this.item.ecmMarketingTypeRelationId) {
console.log('编辑')
this.form = JSON.parse(JSON.stringify(this.item))
}
}
},
methods:{
close() {
this.$refs.form.resetFields();
this.$emit('update:show',false);
},
addItem() {
this.form.comName = 'item-tel';
if (!this.form.title || !this.form.describe || !this.form.lateDays) {
this.$tips({type:'warning',message:'话务未填写完整'});
this.form.comName = 'teltask';
if (!this.form.title || !this.form.content) {
this.$message({type:'warning',message:'话务未填写完整'});
return;
}
this.$emit('sendItem',this.form);
......
src/test/dmMarketing/components/lib-text.vue
......@@ -91,7 +91,7 @@
</template>
<script>
import strLength from '@/utils/strlen';
import {getByteVal2,getByteVal,getZhLen} from '../assets/utils.js';
let qs = require('qs');
export default {
name: "lib-text",
......@@ -149,17 +149,21 @@
textNum:0,
textLength:10,
isEdit:false
isEdit:false,
copyObj:{}
}
},
watch:{
show(val) {
if (val && this.item.comName === 'item-text') {
this.textarea = '';
this.copyObj = {};
if (val && this.item.ecmMarketingTypeRelationId) {
console.log('编辑',this.item);
this.isEdit = true;
let copyObj = JSON.parse(JSON.stringify(this.item))
this.copyObj = JSON.parse(JSON.stringify(this.item))
// console.log(this.item)
this.textarea = copyObj.textarea;
this.textarea = this.copyObj.content;
var reg = /<a\s+href=['"]([^"]*)['"].*?[^>]*>(.*?)<\/a>/g;
if(reg.exec(this.textarea)!=null){
this.cancelLink = true;
......@@ -271,7 +275,7 @@
} else if(this.form.linkStyle==1){ // 小程序链接
this.xcxUrlObj.imageMediaId = this.imageMediaId
}
this.xcxUrlObj.comName = 'item-text';
this.xcxUrlObj.comName = 'text';
},
getAllMytext(){ // 文本框输入失去焦点时获得输入框的内容
this.textarea = this.$refs.myTextarea.innerHTML;
......@@ -297,7 +301,7 @@
this.xcxUrlObj.imageMediaId = this.imageMediaId
}
// console.log(this.xcxUrlObj);
this.xcxUrlObj.comName = 'item-text';
this.xcxUrlObj.comName = 'text';
},
linkSelect(val){
// console.log(val); // 获得小程序链接的结果对象
......@@ -330,7 +334,7 @@
} else if(this.form.linkStyle==1){ // 小程序链接
this.xcxUrlObj.imageMediaId = this.imageMediaId
}
this.xcxUrlObj.comName = 'item-text';
this.xcxUrlObj.comName = 'text';
this.addReplayDialog=false;
}
},
......@@ -408,7 +412,7 @@
self.xcxUrlObj.textarea = self.xcxUrlObj.textarea.replace(/undefined/g,'')
self.xcxUrlObj.comName = 'item-text';
self.xcxUrlObj.comName = 'text';
}
} else if (self.form.linkStyle==1){ // 小程序链接
if(self.imageMediaId == ''){
......@@ -434,24 +438,25 @@
var textContent = strLength.getByteVal2(self.$refs.myTextarea.innerText);
self.textNum = strLength.getZhLen(textContent);
self.xcxUrlObj.textNum = self.textNum;
self.xcxToolObj.comName = 'item-text';
self.xcxToolObj.comName = 'text';
}
},
addItem() {
if (!this.xcxUrlObj.comName || !this.xcxUrlObj.textarea) {
this.$tips({type:'warning',message:'请输入内容'});
this.$message({type:'warning',message:'请输入内容'});
return;
}
if (this.isEdit) {
this.$emit('editItem',JSON.parse(JSON.stringify(this.xcxUrlObj)))
} else {
this.$emit('sendItem',JSON.parse(JSON.stringify(this.xcxUrlObj)))
}
this.$emit('sendItem',JSON.parse(JSON.stringify({
...this.xcxUrlObj,
...this.copyObj,
content:this.xcxUrlObj.textarea
})))
this.close();
},
close() {
this.$nextTick(_ => {
this.textarea = '';
this.copyObj.content = '';
})
this.$emit('update:show',false);
},
......
src/test/dmMarketing/components/lib-app.vue → src/test/dmMarketing/components/lib-wxa.vue
......@@ -2,7 +2,7 @@
<el-dialog title="添加小程序链接" :visible.sync="show" width="600px" class="add-replay-content" :before-close="close">
<el-form label-position="right" ref="form" :model="form" label-width="100px">
<el-form-item class="text-content" label="文本内容">
<el-input v-model="form.text" @keyup.native="toInput(form.text,$event)" ></el-input>
<el-input v-model="form.title" @keyup.native="toInput(form.title,$event)" ></el-input>
<span class="text-num">{{inputNum}}/{{inputLength}}</span>
</el-form-item>
<div class="content-wrap">
......@@ -15,7 +15,7 @@
:show-file-list="false"
:on-success="handleAvatarSuccess"
:before-upload="beforeAvatarUpload">
<img v-if="imageUrl" :src="imageUrl" class="avatar">
<img v-if="form.imageUrl" :src="form.imageUrl" class="avatar">
<i v-else class="el-icon-plus avatar-uploader-icon"></i>
</el-upload>
<p>请上传长宽比为5:4的图片</p>
......@@ -51,26 +51,33 @@
</template>
<script>
import {getByteVal,getZhLen} from '../utils.js';
import {getByteVal,getZhLen} from '../assets/utils.js';
let qs = require('qs');
export default {
name:'lib-app',
name:'lib-wxa',
props:{
show:{
type:Boolean,
default:false
}
},
item:{
type:Object,
default(){
return {}
}
},
},
data(){
return {
form: {
text:'',
title:'',
linkStyle:'0',
url:''
url:'',
imageUrl: '',
mediaId:''
},
inputNum: 0, // 输入文字个数(两个字母/汉字算一个字)
inputLength: 20, // 限制最大字数
imageUrl: '',
preValue: '',
nextValue: '',
options1: [{
......@@ -84,11 +91,38 @@ export default {
wechatContent:{},
}
},
watch:{
show(val) {
this.form = {
title:'',
linkStyle:'0',
url:'',
imageUrl: '',
mediaId:''
}
this.preValue = '';
this.nextValue = '';
this.wechatContent = {};
if (val && this.item.ecmMarketingTypeRelationId) {
this.form = JSON.parse(JSON.stringify(this.item));
console.log('编辑',this.item)
const pagePath = this.form.pagePath ? JSON.parse(this.form.pagePath) : {};
this.wechatContent.type = pagePath.type;
this.wechatContent.objId = '';
this.wechatContent.title = pagePath.title;
this.wechatContent.pageType = pagePath.pageType;
this.preValue = pagePath.pageType;
this.getNextList(this.preValue).then(res => {
this.nextValue = pagePath.type;
})
}
}
},
methods:{
toInput(value,e) { // 控制字符数量
var that = this;
that.form.text = getByteVal(e.target.value,that.inputLength);
that.inputNum = getZhLen(that.form.text);
that.form.title = getByteVal(e.target.value,that.inputLength);
that.inputNum = getZhLen(that.form.title);
},
handleAvatarSuccess(res, file) {
},
......@@ -101,8 +135,8 @@ export default {
var data = res.data;
// console.log(data);
if(data.errorCode==0){
this.imageUrl = data.result.qcloudImageUrl;
this.imageMediaId = data.result.imageMediaId;
this.form.imageUrl = data.result.qcloudImageUrl;
this.form.mediaId = data.result.imageMediaId;
this.$message({
type:'success',
......@@ -140,42 +174,43 @@ export default {
},
// 获得链接类型的二级
getNextList(type){
this.axios.post('/api-plug/list-link-data', qs.stringify({
requestProject: 'gic-web',
linkScene:parseInt(type)
})).then((res)=> {//成功后回调
var data = res.data;
console.log(data);
if(data.errorCode==0){
this.options2 = data.result;
} else {
this.$message({
type:'error',
message:data.message
})
}
return new Promise((resolve,reject) => {
this.axios.post('/api-plug/list-link-data', qs.stringify({
requestProject: 'gic-web',
linkScene:parseInt(type)
})).then((res)=> {//成功后回调
var data = res.data;
console.log(data);
if(data.errorCode==0){
this.options2 = data.result;
resolve();
} else {
this.$message({
type:'error',
message:data.message
})
}
})
})
},
addItem() {
let sendData = {
comName:'item-app',
title:this.form.text,
// imageUrl:this.imageUrl,
mediaId:this.imageMediaId,
ecmMarketingTypeRelationId:this.item.ecmMarketingTypeRelationId,
comName:'wxa',
title:this.form.title,
mediaId:this.form.mediaId,
pagePath:JSON.stringify(this.wechatContent),
// text:this.form.text,
// url:this.form.url
}
if (!sendData.text) {
this.$tips({type:'warning',message:'简介未填写'});
if (!sendData.title) {
this.$message({type:'warning',message:'简介未填写'});
return;
}
if (!sendData.imageMediaId) {
this.$tips({type:'warning',message:'图片未上传'});
if (!sendData.mediaId) {
this.$message({type:'warning',message:'图片未上传'});
return;
}
if (!sendData.wechatContent.title) {
this.$tips({type:'warning',message:'链接选择'});
if (!sendData.pagePath) {
this.$message({type:'warning',message:'链接选择'});
return;
}
this.$emit('sendItem',sendData);
......@@ -196,12 +231,12 @@ export default {
.text-num{
position: absolute;
right: 10px;
bottom: 1px;
bottom: 2px;
color: #c0c4cc;
font-size: 12px;
background: #fff;
height: 30px;
line-height: 32px;
height: 28px;
line-height: 28px;
padding-left: 10px;
}
}
......
src/test/index.vue
......@@ -14,7 +14,7 @@
</div> -->
<div style="padding:20px;">
<p>营销事件组件</p>
<dm-marketing></dm-marketing>
<dm-marketing ecmPlanId="ff80808166817b0501669f9546db011f"></dm-marketing>
</div>
</div>
</template>
......
src/views/ecm/addEdit.vue
......@@ -116,7 +116,7 @@ export default {
data () {
return {
loading:false,
effectActionOptions:[{value:'subscribe',label:'关注触发'},{value:'authentication',label:'认证触发'}],
effectActionOptions:[{value:'subscribe',label:'关注触发'},{value:'authentication',label:'认证触发'},{value:'consume',label:'消费触发'}],
dayOptions:[
{value:0,label:'0:00'},
{value:1,label:'1:00'},
......
src/views/ecm/batch-list.vue 0 → 100644
<template>
<section class="dm-wrap">
<div class="pb22 clearfix">
<el-select class="dm-select" clearable="" v-model="listParams.effectType" placeholder="选择时效" @change="search">
<el-option v-for="(v,i) in effectTypeOption" :key="i" :label="v.label" :value="v.value"></el-option>
</el-select>
<el-select class="dm-select" clearable v-model="listParams.marketingType" placeholder="选择营销方式" @change="search">
<el-option v-for="(v,i) in marketingTypeOptions" :key="i" :label="v.label" :value="v.value"></el-option>
</el-select>
<el-select class="dm-select" clearable v-model="listParams.sceneSettingId" placeholder="选择营销场景" @change="search">
<el-option v-for="(v,i) in sceneSettingIdOptions" :key="v.sceneSettingId" :label="v.sceneName" :value="v.sceneSettingId"></el-option>
</el-select>
<el-select class="dm-select" clearable v-model="listParams.onlineStatus" placeholder="选择上线状态" @change="search">
<el-option v-for="(v,i) in onlineOptions" :key="i" :label="v.label" :value="v.value"></el-option>
</el-select>
<el-input v-model="listParams.searchName" class="w200" placeholder="输入计划名称" clearable @change="search"><i slot="prefix" class="el-input__icon el-icon-search"></i></el-input>
<el-button class="fr" type="primary" @click="$router.push('/ecm/add')">新建计划</el-button>
</div>
<el-table tooltipEffect="light" :data="tableList" style="width: 100%" v-loading="loading" element-loading-text="拼命加载中" >
<el-table-column v-for="(v,i) in tableHeader" :fixed="v.fixed" :show-overflow-tooltip="v.tooltip" :width="v.width" :min-width="v.minWidth" :align="v.align" :key="i" :prop="v.prop" :label="v.label" :formatter="v.formatter">
<template slot-scope="scope">
<span v-if="v.formatter" v-html="v.formatter(scope.row)"></span>
<span v-else>{{scope.row[v.prop]}}</span>
</template>
</el-table-column>
<el-table-column label="操作" align="left" width="220" fixed="right">
<template slot-scope="scope" >
<dm-delete v-if="scope.row.onlineStatus === 1" @confirm="offlineEcmPlan(scope.row)" tips="是否下线该计划?">
<el-button type="text">下线</el-button>
</dm-delete>
<el-button type="text" @click="editData(scope.row)">编辑</el-button>
<dm-delete v-if="scope.row.putonStatus !== 2" @confirm="delData(scope.row)" tips="是否删除该计划?">
<el-button type="text">删除</el-button>
</dm-delete>
<el-button type="text" @click="editData(scope.row)">记录</el-button>
</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="[10, 20, 30, 40]" :page-size="listParams.pageSize" layout="total, sizes, prev, pager, next" :total="total"></el-pagination>
</section>
</template>
<script>
import {ecmBatchSendInfos,ecmBatchSendDetails,deleteEcm,offlineEcmPlan} from '@/service/api/ecmApi.js';
import {sceneSettingList} from '@/service/api/commonApi.js';
const marketingTypeOptions = [{value:'',label:'所有发送类型'},{value:'card',label:'卡券营销'} ,{value:'message',label:'短信营销'} ,{value:'teletext',label:'图文营销'},{value:'text',label:'文本营销'},{value:'teltask',label:'话务'},{value:'image',label:'微信图片'}];
export default {
name: 'ecm',
data () {
return {
effectTypeOption:[{value:-1,label:'所有时效'},{value:0,label:'实时'},{value:1,label:'定时'}],
onlineOptions:[{value:'',label:'所有上线状态'},{value:0,label:'待上线'},{value:1,label:'已上线'},{value:2,label:'已下线'}],
sceneSettingIdOptions:[],
marketingTypeOptions,
infoParams:{
},
listParams:{
effectType:-1,
marketingType:'',
sceneSettingId:'',
onlineStatus:'',
searchName:'',
currentPage:1,
pageSize:20
},
total:0,
loading:false,
tableHeader:[
{label:'计划名称',prop:'ecmPlanName',minWidth:'120',align:'left',fixed:'left'},
{label:'时效',prop:'effectType',width:'120',align:'left',formatter(row){
return row.effectType?(`<span><i class="el-icon-time fz18 vertical-middle"></i><span class="vertical-middle"> 每天${row.effectTime}:00</span></span>`):'实时'
}},
{label:'营销方式',prop:'marketingType',minWidth:'120',align:'left'},
{label:'营销场景',prop:'sceneSettingName',width:'120',align:'left'},
{label:'营销人次',prop:'timesForPeople',width:'120',align:'left'},
{label:'上线状态',prop:'onlineStatus',width:'120',align:'left',formatter(row){
let result = '--';
switch (row.onlineStatus) {
case 0:
result = '<span class="dm-status--primary">待上线</span>';
break;
case 1:
result = '<span class="dm-status--success">已上线</span>';
break;
case 2:
result = '<span class="dm-status--info">已下线</span>';
break;
}
return result;
}},
],
tableList:[]
}
},
created() {
this.ecmBatchSendDetails();
this.sceneSettingList();
this.$store.commit('aside_handler',false);
this.$store.commit('mutations_breadcrumb',[{name:'营销管理',path:''},{name:'智能营销',path:'/ecm'}]);
},
methods: {
search() {
this.listParams.currentPage = 1;
this.ecmBatchSendDetails();
},
handleSizeChange(val) {
this.listParams.pageSize = val;
this.ecmBatchSendDetails();
},
handleCurrentChange(val) {
this.listParams.currentPage = val;
this.ecmBatchSendDetails();
},
async ecmBatchSendDetails() {
this.loading = true;
let res = await ecmBatchSendDetails(this.listParams);
console.log(res)
this.tableList = res.result.result || [];
this.total = res.result.totalCount;
this.loading = false;
},
//编辑
editData(row){
this.$router.push('/ecm/edit/'+row.ecmPlanId)
},
// 删除
async delData(row){
try {
let res = await deleteEcm({ecmPlanId:row.ecmPlanId});
if (res.errorCode === 0) {
this.$tips({type: 'success',message: '删除成功!'});
this.ecmBatchSendDetails();
} else {
this.$tips({type: 'error',message: res.message || '删除失败!'});
}
} catch (err) {
this.$tips({type: 'error',message: '删除失败!'});
}
},
// 下线
async offlineEcmPlan(row){
try {
let res = await offlineEcmPlan({ecmPlanId:row.ecmPlanId});
if (res.errorCode === 0) {
this.$tips({type: 'success',message: '下线成功!'});
this.ecmBatchSendDetails();
} else {
this.$tips({type: 'error',message: res.message || '下线失败!'});
}
} catch (err) {
this.$tips({type: 'error',message: '下线失败!'});
}
},
async sceneSettingList() {
let res = await sceneSettingList();
this.sceneSettingIdOptions = res.result;
this.sceneSettingIdOptions.unshift({sceneName:'所有营销场景',sceneSettingId:''})
}
}
}
</script>
src/views/ecm/current-list.vue 0 → 100644
<template>
<section class="dm-wrap">
<div class="pb22 clearfix">
<el-select class="dm-select" clearable="" v-model="listParams.effectType" placeholder="选择时效" @change="search">
<el-option v-for="(v,i) in effectTypeOption" :key="i" :label="v.label" :value="v.value"></el-option>
</el-select>
<el-select class="dm-select" clearable v-model="listParams.marketingType" placeholder="选择营销方式" @change="search">
<el-option v-for="(v,i) in marketingTypeOptions" :key="i" :label="v.label" :value="v.value"></el-option>
</el-select>
<el-select class="dm-select" clearable v-model="listParams.sceneSettingId" placeholder="选择营销场景" @change="search">
<el-option v-for="(v,i) in sceneSettingIdOptions" :key="v.sceneSettingId" :label="v.sceneName" :value="v.sceneSettingId"></el-option>
</el-select>
<el-select class="dm-select" clearable v-model="listParams.onlineStatus" placeholder="选择上线状态" @change="search">
<el-option v-for="(v,i) in onlineOptions" :key="i" :label="v.label" :value="v.value"></el-option>
</el-select>
<el-input v-model="listParams.searchName" class="w200" placeholder="输入计划名称" clearable @change="search"><i slot="prefix" class="el-input__icon el-icon-search"></i></el-input>
<el-button class="fr" type="primary" @click="$router.push('/ecm/add')">新建计划</el-button>
</div>
<el-table tooltipEffect="light" :data="tableList" style="width: 100%" v-loading="loading" element-loading-text="拼命加载中" >
<el-table-column v-for="(v,i) in tableHeader" :fixed="v.fixed" :show-overflow-tooltip="v.tooltip" :width="v.width" :min-width="v.minWidth" :align="v.align" :key="i" :prop="v.prop" :label="v.label" :formatter="v.formatter">
<template slot-scope="scope">
<span v-if="v.formatter" v-html="v.formatter(scope.row)"></span>
<span v-else>{{scope.row[v.prop]}}</span>
</template>
</el-table-column>
<el-table-column label="操作" align="left" width="220" fixed="right">
<template slot-scope="scope" >
<dm-delete v-if="scope.row.onlineStatus === 1" @confirm="offlineEcmPlan(scope.row)" tips="是否下线该计划?">
<el-button type="text">下线</el-button>
</dm-delete>
<el-button type="text" @click="editData(scope.row)">编辑</el-button>
<dm-delete v-if="scope.row.putonStatus !== 2" @confirm="delData(scope.row)" tips="是否删除该计划?">
<el-button type="text">删除</el-button>
</dm-delete>
<el-button type="text" @click="editData(scope.row)">记录</el-button>
</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="[10, 20, 30, 40]" :page-size="listParams.pageSize" layout="total, sizes, prev, pager, next" :total="total"></el-pagination>
</section>
</template>
<script>
import {loadEcmList,deleteEcm,offlineEcmPlan} from '@/service/api/ecmApi.js';
import {sceneSettingList} from '@/service/api/commonApi.js';
const marketingTypeOptions = [{value:'',label:'所有发送类型'},{value:'card',label:'卡券营销'} ,{value:'message',label:'短信营销'} ,{value:'teletext',label:'图文营销'},{value:'text',label:'文本营销'},{value:'teltask',label:'话务'},{value:'image',label:'微信图片'}];
export default {
name: 'ecm',
data () {
return {
effectTypeOption:[{value:-1,label:'所有时效'},{value:0,label:'实时'},{value:1,label:'定时'}],
onlineOptions:[{value:'',label:'所有上线状态'},{value:0,label:'待上线'},{value:1,label:'已上线'},{value:2,label:'已下线'}],
sceneSettingIdOptions:[],
marketingTypeOptions,
listParams:{
effectType:-1,
marketingType:'',
sceneSettingId:'',
onlineStatus:'',
searchName:'',
currentPage:1,
pageSize:20
},
total:0,
loading:false,
tableHeader:[
{label:'计划名称',prop:'ecmPlanName',minWidth:'120',align:'left',fixed:'left'},
{label:'时效',prop:'effectType',width:'120',align:'left',formatter(row){
return row.effectType?(`<span><i class="el-icon-time fz18 vertical-middle"></i><span class="vertical-middle"> 每天${row.effectTime}:00</span></span>`):'实时'
}},
{label:'营销方式',prop:'marketingType',minWidth:'120',align:'left'},
{label:'营销场景',prop:'sceneSettingName',width:'120',align:'left'},
{label:'营销人次',prop:'timesForPeople',width:'120',align:'left'},
{label:'上线状态',prop:'onlineStatus',width:'120',align:'left',formatter(row){
let result = '--';
switch (row.onlineStatus) {
case 0:
result = '<span class="dm-status--primary">待上线</span>';
break;
case 1:
result = '<span class="dm-status--success">已上线</span>';
break;
case 2:
result = '<span class="dm-status--info">已下线</span>';
break;
}
return result;
}},
],
tableList:[]
}
},
created() {
this.loadEcmList();
this.sceneSettingList();
this.$store.commit('aside_handler',false);
this.$store.commit('mutations_breadcrumb',[{name:'营销管理',path:''},{name:'智能营销',path:'/ecm'}]);
},
methods: {
search() {
this.listParams.currentPage = 1;
this.loadEcmList();
},
handleSizeChange(val) {
this.listParams.pageSize = val;
this.loadEcmList();
},
handleCurrentChange(val) {
this.listParams.currentPage = val;
this.loadEcmList();
},
async loadEcmList() {
this.loading = true;
let res = await loadEcmList(this.listParams);
console.log(res)
this.tableList = res.result.result || [];
this.total = res.result.totalCount;
this.loading = false;
},
//编辑
editData(row){
this.$router.push('/ecm/edit/'+row.ecmPlanId)
},
// 删除
async delData(row){
try {
let res = await deleteEcm({ecmPlanId:row.ecmPlanId});
if (res.errorCode === 0) {
this.$tips({type: 'success',message: '删除成功!'});
this.loadEcmList();
} else {
this.$tips({type: 'error',message: res.message || '删除失败!'});
}
} catch (err) {
this.$tips({type: 'error',message: '删除失败!'});
}
},
// 下线
async offlineEcmPlan(row){
try {
let res = await offlineEcmPlan({ecmPlanId:row.ecmPlanId});
if (res.errorCode === 0) {
this.$tips({type: 'success',message: '下线成功!'});
this.loadEcmList();
} else {
this.$tips({type: 'error',message: res.message || '下线失败!'});
}
} catch (err) {
this.$tips({type: 'error',message: '下线失败!'});
}
},
async sceneSettingList() {
let res = await sceneSettingList();
this.sceneSettingIdOptions = res.result;
this.sceneSettingIdOptions.unshift({sceneName:'所有营销场景',sceneSettingId:''})
}
}
}
</script>
src/views/ecm/list.vue
......@@ -26,14 +26,14 @@
</el-table-column>
<el-table-column label="操作" align="left" width="220" fixed="right">
<template slot-scope="scope" >
<dm-delete v-if="scope.row.onlineStatus === 1" @confirm="delData(scope.row)" tips="是否下线该计划?">
<dm-delete v-if="scope.row.onlineStatus === 1" @confirm="offlineEcmPlan(scope.row)" tips="是否下线该计划?">
<el-button type="text">下线</el-button>
</dm-delete>
<el-button type="text" @click="editData(scope.row)">编辑</el-button>
<dm-delete v-if="scope.row.putonStatus !== 2" @confirm="delData(scope.row)" tips="是否删除该计划?">
<el-button type="text">删除</el-button>
</dm-delete>
<el-button type="text" @click="editData(scope.row)">记录</el-button>
<el-button type="text" @click="toRecord(scope.row)">记录</el-button>
</template>
</el-table-column>
......@@ -42,7 +42,7 @@
</section>
</template>
<script>
import {loadEcmList,deleteEcm} from '@/service/api/ecmApi.js';
import {loadEcmList,deleteEcm,offlineEcmPlan} from '@/service/api/ecmApi.js';
import {sceneSettingList} from '@/service/api/commonApi.js';
const marketingTypeOptions = [{value:'',label:'所有发送类型'},{value:'card',label:'卡券营销'} ,{value:'message',label:'短信营销'} ,{value:'teletext',label:'图文营销'},{value:'text',label:'文本营销'},{value:'teltask',label:'话务'},{value:'image',label:'微信图片'}];
export default {
......@@ -122,6 +122,11 @@ export default {
editData(row){
this.$router.push('/ecm/edit/'+row.ecmPlanId)
},
// 记录
toRecord(row){
this.$router.push('/ecm/'+ (row.effectType ? 'batchlist' : 'currentlist'));
},
// 删除
async delData(row){
try {
let res = await deleteEcm({ecmPlanId:row.ecmPlanId});
......@@ -135,6 +140,20 @@ export default {
this.$tips({type: 'error',message: '删除失败!'});
}
},
// 下线
async offlineEcmPlan(row){
try {
let res = await offlineEcmPlan({ecmPlanId:row.ecmPlanId});
if (res.errorCode === 0) {
this.$tips({type: 'success',message: '下线成功!'});
this.loadEcmList();
} else {
this.$tips({type: 'error',message: res.message || '下线失败!'});
}
} catch (err) {
this.$tips({type: 'error',message: '下线失败!'});
}
},
async sceneSettingList() {
let res = await sceneSettingList();
this.sceneSettingIdOptions = res.result;
......
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