Skip to content

X
x-training-new
提交 79418788 authored 作者: lihuihui's avatar lihuihui
浏览文件
操作

update

上级 2a2c1b2b
隐藏空白字符变更
内嵌 并排
正在显示 包含 137 行增加 和 154 行删除
src/components/base/StepTab.vue
浏览文件 @ 79418788
......@@ -33,11 +33,12 @@ export default {
props: {
tabList: {
type: Array
}
},
index: { type: Number }
},
data() {
return {
activeTab: 0
activeTab: this.index || 0
}
},
methods: {
......
src/modules/market-tools/components/mail/MailStepFour.vue
浏览文件 @ 79418788
<template>
<div class="four-box">
<div class="card" v-for="(item, index) in data.one" :key="index">
<div class="card" v-for="(item, index) in data.stepOne" :key="index">
<div class="title">{{ item.cardTitle }}</div>
<div class="ul-list">
<div class="li" v-for="(cItem, cIndex) in item.form.personAttribute" :key="cIndex + 'c'">
......@@ -13,16 +13,38 @@
</div>
</div>
</div>
<div class="card">
<div class="title">营销方案</div>
<div class="ul-list">
<div class="li">
<div class="icon"></div>
<div class="text">计划类型：{{ data.stepTwo.index ? '条件触发' : '单次触发' }}</div>
</div>
<template v-if="data.stepTwo.index">
<div class="li" v-for="(item, index) in data.stepTwo.list[0].form.triggerList" :key="index">
<div class="icon"></div>
<div class="text">当用户做过
{{ item.list.find(i => i.value === item.triggerValue).label }}
对目标用户进行触达</div>
</div>
</template>
<template v-else>
<div class="li">
<div class="icon"></div>
<div class="text">触发时间：{{ data.stepTwo.date }} {{ data.stepTwo.time }}</div>
</div>
</template>
</div>
</div>
<div class="card">
<div class="title">展示内容</div>
<div class="content">
<div class="bg"></div>
<div class="card-dom">
<div class="title" :style="`${getPosition(data.three.titleParams.position)}${data.three.titleParams.style}`">{{ data.three.titleParams.textValue }}</div>
<div class="describe" :style="`${getPosition(data.three.describeParams.position)}${data.three.describeParams.style}`">{{ data.three.describeParams.textValue }}</div>
<div class="btn" :style="`${getPosition(data.three.btnParams.position)}${data.three.btnParams.style}`">{{ data.three.btnParams.textValue }}</div>
<!-- {{ data.three.imgParams.position }} -->
<div class="img" :style="`background: url(${data.three.imgParams.url});background-size:cover;${getPosition(data.three.imgParams.position)}`"></div>
<div class="title" :style="`${getPosition(data.stepThree.titleParams.position)}${data.stepThree.titleParams.style}`">{{ data.stepThree.titleParams.textValue }}</div>
<div class="describe" :style="`${getPosition(data.stepThree.describeParams.position)}${data.stepThree.describeParams.style}`">{{ data.stepThree.describeParams.textValue }}</div>
<div class="btn" :style="`${getPosition(data.stepThree.btnParams.position)}${data.stepThree.btnParams.style}`">{{ data.stepThree.btnParams.textValue }}</div>
<div class="img" :style="`background: url(${data.stepThree.imgParams.url});background-size:cover;${getPosition(data.stepThree.imgParams.position)}`"></div>
</div>
</div>
</div>
......@@ -97,6 +119,7 @@ export default {
<style lang="scss" scoped>
.four-box {
margin-bottom: 20px;
.card {
background: rgba(250, 250, 250, 0.39);
border: 1px solid #e8e8e8;
......
src/modules/market-tools/components/mail/MailStepOne.vue
浏览文件 @ 79418788
<template>
<div class="main_content">
<CardList class="box-card" v-for="(item, index) in stepOneList" :key="index" :cardList="item" />
<CardList class="box-card" v-for="(item, index) in data" :key="index" :cardList="item" />
<!-- <div class="step_next step_btn" @click="handleNext">下一步</div> -->
</div>
</template>
......@@ -13,11 +13,7 @@ export default {
CardList
},
props: {
activeStep: {
type: Number,
default: 0
},
stepOneList: {
data: {
type: Array
}
},
......@@ -28,7 +24,7 @@ export default {
// 下一步
handleStepOne() {
let flag = true
this.stepOneList.forEach(item =>
this.data.forEach(item =>
item.form.personAttribute.forEach(it => {
if (it.equal === '' || it.personal === '' || it.range === '') {
flag = false
......
src/modules/market-tools/components/mail/MailStepThree.vue
浏览文件 @ 79418788
......@@ -161,7 +161,6 @@ export default {
describeParams: this.describeParams,
btnParams: this.btnParams
}
console.log(params, 'params')
for (const data in params) {
if (params[data].show !== false) {
this.$message({
......
src/modules/market-tools/components/mail/MailStepTwo.vue
浏览文件 @ 79418788
<template>
<div>
<StepTab :tabList="tabList" @tabActive="handleTab">
<StepTab :tabList="tabList" @tabActive="handleTab" :index="data.index">
<template #plan_title>计划类型</template>
<template #trigger_title>触发条件</template>
<template #trigger_con>
<div v-if="showIndex === 0">
<div v-if="data.index == 0">
在 &nbsp;&nbsp;
<el-date-picker v-model="times" type="datetime" placeholder="选择日期" value-format="yyyy-MM-dd">
<el-date-picker v-model="data.date" type="datetime" placeholder="选择日期" value-format="yyyy-MM-dd">
</el-date-picker>
&nbsp;&nbsp;
<el-time-picker v-model="times2" arrow-control placeholder="选择时间" size="mini" value-format="HH:mm:ss">
<el-time-picker v-model="data.time" arrow-control placeholder="选择时间" size="mini" value-format="HH:mm:ss">
</el-time-picker>
&nbsp;&nbsp;对目标用户进行触达
</div>
<div v-if="showIndex === 1">
<StepTodoList :form="stepTwoList" />
<div v-if="data.index == 1">
<StepTodoList :form="data.list" />
</div>
</template>
</StepTab>
......@@ -27,23 +27,11 @@ import StepTodoList from './StepTodoList.vue'
export default {
components: { StepTab, StepTodoList },
props: {
stepTwoList: {
type: Array
},
time: {
type: String
},
time2: {
type: String
}
data: { type: Object }
},
data() {
return {
times: '',
times2: '',
caseId: '',
showIndex: 0,
// tab切换列表
tabList: [
{
......@@ -56,43 +44,29 @@ export default {
iconActive: 'https://webapp-pub.ezijing.com/x-training-new/tab_icon22.png',
tabName: '条件触发'
}
],
activeIndexName: ''
]
}
},
mounted() {
this.times = this.time
this.times2 = this.time2
},
methods: {
handleTab(index) {
this.showIndex = index
this.data.index = index
},
handleStepTwo() {
this.$emit('getTime', this.times, this.times2)
if (this.showIndex === 0) {
this.activeIndexName = '单次触发'
} else {
this.activeIndexName = '条件触发'
}
this.$emit('getShowIndex', this.activeIndexName)
let flag = true
if (this.showIndex === 1) {
this.stepTwoList[0].form.triggerList.forEach(item => {
if (this.data.index === 1) {
this.data.list[0].form.triggerList.forEach(item => {
if (item.triggerValue === '') {
flag = false
}
})
} else if (this.showIndex === 0) {
if (this.times === '' || this.times2 === '') {
}
if (this.data.index === 0) {
if (this.data.date === '' || this.data.time === '') {
flag = false
}
}
if (!flag) {
this.$message.warning('请完善改步骤后才能进入下一步')
}
!flag && this.$message.warning('请完善改步骤后才能进入下一步')
return flag
}
}
......
src/modules/market-tools/components/mobileSms/SmsStepThree.vue
浏览文件 @ 79418788
......@@ -3,23 +3,32 @@
<div class="content-left">
<div class="card-textarea">
<div class="title">推送标题</div>
<textarea placeholder="请输入"></textarea>
<textarea v-model="form.title" placeholder="请输入"></textarea>
</div>
<div class="card-textarea">
<div class="title">推送内容</div>
<textarea placeholder="请输入"></textarea>
<textarea v-model="form.content" placeholder="请输入"></textarea>
</div>
</div>
<div class="content-right">
<div class="right-box">
<div class="text">{{ `【${form.title}】${form.content}` }}</div>
</div>
</div>
</div>
</template>
<script>
export default {}
export default {
data() {
return {
form: {
title: '',
content: ''
}
}
}
}
</script>
<style lang="scss" scoped>
......@@ -61,12 +70,25 @@ export default {}
width: 588px;
padding: 55px 0;
box-sizing: border-box;
.right-box{
.right-box {
margin: 0 auto;
width: 236px;
height: 474px;
background: url(https://webapp-pub.ezijing.com/x-training-new/phone-sms.png);
background-size: 100% 100%;
position: relative;
.text {
padding: 9px;
box-sizing: border-box;
background: #e9e9eb;
border-radius: 10px;
width: 148px;
position: absolute;
top: 110px;
left: 25px;
font-size: 9px;
color: #333333;
}
}
}
}
......
src/modules/market-tools/views/Mail.vue
浏览文件 @ 79418788
......@@ -3,29 +3,14 @@
<ToolCard class="main_content">
<Step :activeStep="activeStep" class="pt50-pl60" />
<div style="flex: 1">
<MailStepOne
v-if="activeStep === 0"
class="pt-50"
:activeStep="activeStep"
:stepOneList="stepOneList"
ref="mailStepOne"
/>
<MailStepTwo
v-if="activeStep === 1"
class="pt-50"
:stepTwoList="stepTwoList"
:time="time"
:time2="time2"
@getTime="getTime"
@getShowIndex="getShowIndex"
ref="mailStepTwo"
/>
<MailStepThree :data="stepThreeData" ref="mailStepThree" v-if="activeStep === 2" />
<MailStepFour :data="{ one: stepOneList, two: stepTwoList, three: stepThreeData, time: { t1: time, t2: time2 } }" class="step-four" v-if="activeStep === 3"></MailStepFour>
<MailStepOne v-if="activeStep === 0" class="pt-50" :data="form.stepOne" ref="mailStepOne" />
<MailStepTwo v-if="activeStep === 1" class="pt-50" :data="form.stepTwo" ref="mailStepTwo" />
<MailStepThree :data="form.stepThree" ref="mailStepThree" v-if="activeStep === 2" />
<MailStepFour :data="form" class="step-four" v-if="activeStep === 3"></MailStepFour>
<div class="main_content_btn">
<div class="step_prev step_btn" @click="handlePrev" v-if="activeStep > 0">上一步</div>
<div class="step_next step_btn" @click="handleNext" v-if="activeStep >= 0 && activeStep < 2">下一步</div>
<div class="step_finished step_btn" @click="handlePreview" v-if="activeStep === 2">点击生成预览</div>
<div class="step_finished step_btn" @click="handleNext" v-if="activeStep === 2">点击生成预览</div>
<div class="step_finished step_btn" @click="handlePlan" v-if="activeStep === 3">执行营销计划</div>
</div>
</div>
......@@ -36,7 +21,7 @@
<script>
import stepOne from '@/utils/stepOne'
import stepTwo from '@/utils/stepTwo'
import { cacheReport, getReportDetail, checkRecord } from '../api'
import { cacheReport, getReportDetail, checkRecord, submitReport } from '../api'
import ToolCard from '@/components/base/ToolCard.vue'
import MailStepOne from '../components/mail/MailStepOne.vue'
import Step from '@/components/base/Step.vue'
......@@ -54,81 +39,85 @@ export default {
},
data() {
return {
// 所有步骤的数据
form: {
stepOne: stepOne,
stepTwo: {
index: 0,
list: stepTwo,
date: '',
time: ''
},
stepThree: {}
},
// 当前步骤的索引
activeStep: 0,
stepOneList: [],
stepTwoList: [],
stepThreeData: {},
time: '',
caseId: '',
times: '',
times2: '',
time2: '',
activeIndexName: ''
// 答题id
caseId: ''
}
},
methods: {
getShowIndex(name) {
this.activeIndexName = name
},
// 获取第二步时间
getTime(val, val2) {
this.time = val
this.time2 = val2
},
// 上一步
handlePrev() {
this.activeStep--
},
// 下一步
handleNext() {
if (this.activeStep === 0) {
if (this.$refs.mailStepOne.handleStepOne()) {
// 保存步骤信息
this.handleStep(0)
}
} else if (this.activeStep === 1) {
if (this.$refs.mailStepTwo.handleStepTwo()) {
this.handleStep(1)
}
// 找到对应步骤，调用组件内部方法检查未填
switch (this.activeStep) {
case 0:
this.$refs.mailStepOne.handleStepOne() && this.handleStep()
break
case 1:
this.$refs.mailStepTwo.handleStepTwo() && this.handleStep()
break
case 2:
if (this.$refs.mailStepThree.makePreview() !== false) {
this.form.stepThree = this.$refs.mailStepThree.makePreview()
this.handleStep()
}
break
}
},
//
// 保存步骤信息
handleStep(val) {
handleStep() {
const reports = {
activeStep: parseInt(val),
activeStep: this.activeStep + 1,
type: 2,
commit_report: [
{ stepOneList: this.stepOneList },
{ form: this.stepTwoList },
{ time: this.time, time2: this.time2 },
{ stepThreeData: this.stepThreeData }
]
commit_report: this.form
}
cacheReport(this.$store.state.case.id, { reports: JSON.stringify(reports) }).then(res => {
this.caseId = res.data.id
this.activeStep++
})
},
// 预览
handlePreview() {
const isData = this.$refs.mailStepThree.makePreview()
if (isData !== false) {
this.stepThreeData = this.$refs.mailStepThree.makePreview()
this.handleStep(2)
// 提交
handlePlan() {
const reports = {
id: this.caseId || this.$route.query.id,
reports: JSON.stringify({
type: 2,
commit_report: this.form
})
}
submitReport(reports).then(res => {
if (res.code === 0) {
this.$router.push({
path: '/works-show/history',
query: {
type: 3
}
})
}
})
},
handlePlan() {},
// 获取步骤信息回显
getReportDetail(id) {
getReportDetail(id).then(res => {
if (res.data.detail.answer.type === 2) {
this.activeStep = res.data.detail.answer.activeStep
this.stepOneList = res.data.detail.answer.commit_report[0].stepOneList
this.time = res.data.detail.answer.commit_report[2].time || ''
this.time2 = res.data.detail.answer.commit_report[2].time2 || ''
this.stepTwoList = res.data.detail.answer.commit_report[1].form
this.form = res.data.detail.answer.commit_report
}
})
},
......@@ -136,34 +125,13 @@ export default {
checkRecord() {
checkRecord(this.$store.state.case.id, 2).then(res => {
if (res.data.status === true) {
const answerList = res.data.items.filter(item => item.type === 2)
if (res.data.items.length && answerList.length) {
this.activeStep = answerList[0].answer.activeStep
this.stepOneList = answerList[0].answer.commit_report[0].stepOneList || stepOne
if (answerList[0].answer.commit_report[1].form.length) {
this.stepTwoList = answerList[0].answer.commit_report[1].form
} else {
this.stepTwoList = stepTwo
}
this.time = answerList[0].answer.commit_report[2].time || this.times
this.time2 = answerList[0].answer.commit_report[2].time2 || this.times2
this.stepThreeData = answerList[0].answer.commit_report[3].stepThreeData || {}
console.log(this.stepThreeData, '213')
} else {
this.initStepList()
const answerList = res.data.items.find(item => item.type === 2)
this.activeStep = answerList.answer.activeStep || 0
if (Object.keys(answerList).length) {
this.form = answerList.answer.commit_report
}
} else {
this.initStepList()
}
})
},
// 初始化步骤列表
initStepList() {
this.stepOneList = stepOne
this.stepTwoList = stepTwo
this.time = this.times
this.time2 = this.times2
}
},
mounted() {
......
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论