Skip to content

M
marketing
Commit f6cdc13d by caoyanzhi
Options

update: 弹窗推广

parent 459c3b7d
Showing with 47 additions and 24 deletions
src/views/pop/form.vue
......@@ -24,12 +24,10 @@
<div class="popBox">
<div class="form_detail">
<el-form-item label="投放内容：" required>
<el-form-item>
<el-radio-group v-model="pop.putonType" :disabled="pop.activeStatus == 2" @change="label => closeTypeChange(label, elIndex)">
<el-radio :label="1">图片</el-radio>
<el-radio :label="2">卡券</el-radio>
</el-radio-group>
</el-form-item>
<el-radio-group v-model="pop.putonType" :disabled="pop.activeStatus == 2" @change="label => closeTypeChange(label, elIndex)">
<el-radio :label="1">图片</el-radio>
<el-radio :label="2">卡券</el-radio>
</el-radio-group>
<!-- 投放内容 图片 -->
<div class="upload_box" v-if="pop.putonType === 1">
<el-form-item :prop="`content_${elIndex}`">
......@@ -50,7 +48,7 @@
</template>
</dm-upload-file>
</el-form-item>
<el-form-item label="跳转链接：" class="pop_img_link">
<el-form-item :prop="`link_${elIndex}`" label="跳转链接：" class="pop_img_link">
<el-tag :closable="pop.activeStatus != 2" type="info" @close="deleteImgLink(pop)" @click="setImgLink(pop)" style="margin-right: 10px;line-height: 20px;height: auto;color: #606266" v-if="pop.popupImageDetails.link && pop.popupImageDetails.link.id">
{{ pop.popupImageDetails.link.name }}
</el-tag>
......@@ -87,10 +85,10 @@
</el-tag>
<el-button type="text" :disabled="pop.activeStatus == 2" @click="setPutonPage(pop)">设置</el-button>
<el-dialog title="投放页面" :visible.sync="pop.putonPageDialog">
<el-select class="select-page" :value="pop.putonPageList[0] ? pop.putonPageList[0].id : ''" placeholder="请选择投放页面" @change="pageId => putonPageChange(pageId, pop.id)">
<el-select class="select-page" :value="pop.putonPageList[0] ? pop.putonPageList[0].id : ''" placeholder="请选择投放页面" @change="pageId => putonPageChange(pageId, pop.id, elIndex)">
<el-option v-for="page in putonPageList" :label="page.name" :value="page.id" :key="page.id"></el-option>
</el-select>
<el-select class="select-page" v-if="pop.putonPageList[0] && pop.putonPageList[0].type == 6" :value="pop.putonPageList[0] ? pop.putonPageList[0].customPageId : ''" placeholder="请选择投放页面" @change="pageId => customPageChange(pageId, pop.id)">
<el-select class="select-page" v-if="pop.putonPageList[0] && pop.putonPageList[0].type == 6" :value="pop.putonPageList[0] ? pop.putonPageList[0].customPageId : ''" placeholder="请选择投放页面" @change="pageId => customPageChange(pageId, pop.id, elIndex)">
<el-option v-for="page in customPageList" :label="page.title" :value="page.pageId" :key="page.pageId"></el-option>
</el-select>
<div slot="footer" class="dialog-footer">
......@@ -391,8 +389,6 @@ export default {
params.endTime = new Date(params.dateTime[1]).getTime();
delete params.dateTime;
params.popupList.map(pop => {
delete pop.linkToolsVisible;
delete pop.putonPageDialog;
pop.beginTime = new Date(pop.dateTime[0]).getTime();
pop.endTime = new Date(pop.dateTime[1]).getTime();
});
......@@ -410,7 +406,7 @@ export default {
});
}),
addPop() {
const index = this.group.popupList.length || 1;
const index = this.group.popupList.length;
// 投放内容
this.rules[`content_${index}`] = [
{
......@@ -423,8 +419,24 @@ export default {
} else if (item.popupCouponDetails && !item.popupCouponDetails.couponList) {
callback(new Error('请选择卡券'));
}
callback();
},
trigger: 'blur'
trigger: 'change'
}
];
// 跳转链接
this.rules[`link_${index}`] = [
{
required: true,
validator: (rule, value, callback) => {
const index = Number(rule.field.split('_')[1]);
const item = this.group.popupList[index];
if (!item.popupImageDetails.link.id) {
callback(new Error('请设置跳转链接'));
}
callback();
},
trigger: 'change'
}
];
// 定向人群
......@@ -437,8 +449,9 @@ export default {
if (item.popupMemberGroupList && !item.popupMemberGroupList.length) {
callback(new Error('请选择定向人群'));
}
callback();
},
trigger: 'blur'
trigger: 'change'
}
];
// 投放页面
......@@ -448,11 +461,12 @@ export default {
validator: (rule, value, callback) => {
const index = Number(rule.field.split('_')[1]);
const item = this.group.popupList[index];
if (item.pageList && !item.pageList.length) {
if (item.putonPageList && !item.putonPageList.length) {
callback(new Error('请选择投放页面'));
}
callback();
},
trigger: 'blur'
trigger: 'change'
}
];
// 投放时间
......@@ -465,8 +479,9 @@ export default {
if (!item.dateTime) {
callback(new Error('请选择投放时间'));
}
callback();
},
trigger: 'blur'
trigger: 'change'
}
];
// 弹出频次
......@@ -479,8 +494,9 @@ export default {
if (!item.popupType) {
callback(new Error('请选择弹出频次'));
}
callback();
},
trigger: 'blur'
trigger: 'change'
}
];
// 停留时间
......@@ -493,8 +509,9 @@ export default {
if (item.autoCloseFlag === '1' && !item.autoCloseDelay) {
callback(new Error('请输入停留时间'));
}
callback();
},
trigger: 'blur'
trigger: 'change'
}
];
// let sortNum = 0;
......@@ -507,6 +524,9 @@ export default {
}
}
},
resetField(field) {
this.$refs.form.validateField(field);
},
// 获取投放页面列表
getPopupLinkList() {
this.axios.get(`${config.api}/api-marketing/query-popup-link-list?requestProject=marketing`).then(res => {
......@@ -529,7 +549,7 @@ export default {
}
});
},
putonPageChange(pageId, popId) {
putonPageChange(pageId, popId, elIndex) {
const page = this.putonPageList.filter(item => item.id == pageId);
this.group.popupList.some(pop => {
if (pop.id == popId) {
......@@ -537,8 +557,9 @@ export default {
}
return pop.id == popId;
});
this.resetField(`putonPageList_${elIndex}`);
},
customPageChange(customPageId, popId) {
customPageChange(customPageId, popId, elIndex) {
const page = this.customPageList.filter(el => el.pageId == customPageId);
const { title, pageId } = page[0] || {};
this.group.popupList.some(pop => {
......@@ -548,6 +569,7 @@ export default {
}
return pop.id == popId;
});
this.resetField(`putonPageList_${elIndex}`);
},
showFileNameTip(text) {
const span = document.createElement('span');
......@@ -583,6 +605,7 @@ export default {
this.$tips({ type: 'success', message: '上传成功' });
this.group.popupList[elIndex].fileList = [{ name, size, imageUrl }];
this.group.popupList[elIndex].popupImageDetails.imageUrl = imageUrl;
this.resetField(`content_${elIndex}`);
} else {
this.$tips({ type: 'error', message: '上传失败' });
}
......@@ -613,13 +636,14 @@ export default {
closeTypeChange(label, elIndex) {
this.group.popupList[elIndex].fileList = [];
this.group.popupList[elIndex].popupImageDetails = { imageUrl: '', link: {} };
this.group.popupList[elIndex].popupCouponDetails.couponList = [];
this.group.popupList[elIndex].popupCouponDetails = { couponList: [], styleType: 1 };
},
// 定向人群筛选
handleDataTransferred(data, elIndex) {
console.log('transfer', data);
let item = this.group.popupList[elIndex];
item.popupMemberGroupList = [...data];
this.resetField(`popupMemberGroupList_${elIndex}`);
},
handleDataLeft(selectedData, selectionToRemove) {
console.log(selectedData, selectionToRemove);
......@@ -633,6 +657,7 @@ export default {
linkSelect(val, elIndex) {
this.group.popupList[elIndex].popupImageDetails.link = val;
this.group.popupList[elIndex].linkToolsVisible = false;
this.resetField(`link_${elIndex}`);
},
// 链接小工具 选择
deleteImgLink(pop) {
......@@ -722,12 +747,10 @@ export default {
.pop_img_link {
margin-top: 18px;
/deep/ .el-form-item__label {
width: 82px !important;
text-align: left;
line-height: 20px;
}
/deep/ .el-form-item__content {
margin-left: 80px !important;
line-height: 20px;
}
}
......
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