Commit f2bd423a by 汤强勇
parents 0fe749f5 88be03e5
This source diff could not be displayed because it is too large. You can view the blob instead.
......@@ -23,3 +23,13 @@
color: #73879c;
text-align: center;
}
.fr {
float: right;
}
.step {
background-color: rgba(52, 73, 94, 1);
color: #fff;
border-color: rgba(52, 73, 94, 1);
width: 35px;
height: 35px;
}
......@@ -4,14 +4,15 @@ import Vue from 'vue'
import App from './App'
import router from './router'
import ElementUI from 'element-ui'
import 'assets/styles/reset.css'
import 'assets/styles/common.css'
import './assets/styles/reset.css'
import './assets/styles/common.css'
import 'element-ui/lib/theme-chalk/index.css'
import Axios from 'axios'
import * as filters from './filters'
import { http } from './plugin'
// 引入echarts
import echarts from 'echarts'
Vue.use(ElementUI)
Vue.use(http)
Object.keys(filters).forEach(key => {
......
......@@ -15,29 +15,17 @@
<img src="./../../../assets/images/picture.png" class="iconimg">
</el-col>
<el-col :span="18" class="subtitle-tips">
<p>在微信触达域中,公众号作为最通用的触达渠道,微信为品牌号提供了适配大批量会员触达的图文素材触达方式。</p>
<p>
<span>
<i class="el-icon-check"></i>
</span>
通过会员标签画像分群的分批精准推送,建议编辑不同的图文素材面向不同的会员群体。</p>
<p>
<span>
<i class="el-icon-check"></i>
</span>
最大化的利用微信“用户每月只能接受4条”的规则限制,通过舞象云实现多次投放,但每日上限为100次。</p>
<p>
<span>
<i class="el-icon-check"></i>
</span>
大批量的微信消息推送,微信端控制最大为80W/分钟,平台将进行资源的动态优化,请耐心等待,推送成功后将发送邮件通知。</p>
<p>在微信触达域中,公众号作为最通用的触达渠道,微信为品牌号提供了 <span class="star-red">适配大批量会员触达</span> 的图文素材触达方式。</p>
<p><span><i class="el-icon-check"></i></span> 通过会员标签画像分群的分批精准推送,建议编辑不同的图文素材面向不同的会员群体。前往 <a href="#">微信公众平台</a> -管理-素材管理</p>
<p><span><i class="el-icon-check"></i></span> 最大化的利用微信“用户每月只能接受4条”的规则限制,通过舞象云实现多次投放,但每日上限为 <span class="star-red">100次</span></p>
<p><span><i class="el-icon-check"></i></span> 大批量的微信消息推送,微信端控制最大为80W/分钟,平台将进行资源的动态优化,请耐心等待,推送成功后将发送邮件通知。</p>
</el-col>
</el-row>
</div>
</template>
<style lang="stylus" scoped>
.marketing-title
height 177px
height 220px
background-color #fff
.top-left
height 50px
......@@ -56,10 +44,11 @@
height 130px
.subtitle-img
.iconimg
padding 20px 0 0 70px
padding 50px 0 0 70px
.subtitle-tips
padding-top 30px
color #73879C
.tips-wechat
padding 30px
p
height 30px
line-height 30px
</style>
<template>
<div style="height: 800px;">
<el-steps direction="vertical" :active="1">
<el-step></el-step>
<el-step ></el-step>
<el-step ></el-step>
<el-step ></el-step>
<el-step ></el-step>
</el-steps>
</div>
</template>
<style lang='stylus' scoped>
>>>.el-step__icon
background-color rgba(52, 73, 94, 1)
color #fff
border-color rgba(52, 73, 94, 1)
width 35px
height 35px
>>>.el-step.is-vertical .el-step__line
left 17px
width 3px
height 150px
top 38px
background-color rgba(52, 73, 94, 1)
</style>
<template>
<div>
<el-form ref="form" :model="form" label-width="100px">
<el-form-item label="新建推送名称">
<span><span class="star-red">*</span> 推送名称仅供数据中心操作记录查询,您推送的会员将不会看到此信息。</span>
</el-form-item>
<el-form-item label="推送名称">
<!-- <el-input v-model="form.name" placeholder="请输入推送名称,10字以内"></el-input> -->
</el-form-item>
<el-form-item label="选择推送素材">
<span><span class="star-red">*</span> 推送素材需前往<a href="#">微信公众平台</a>-管理-素材管理维护。</span>
<el-upload class="upload-demo" drag action="https://jsonplaceholder.typicode.com/posts/" multiple>
<i class="el-icon-plus" style="font-size:50px;margin-top:30px"></i>
<div class="el-upload__text">添加微信素材</div>
<div class="el-upload__tip" slot="tip">只能上传jpg/png文件,且不超过500kb</div>
</el-upload>
</el-form-item>
<el-form-item label="选择推送范围">
<el-radio-group v-model="form.resource">
<el-radio label="全体推送"></el-radio>
<el-radio label="精准推送"></el-radio>
<div>
<el-tag>标签一454545454545454545454545</el-tag>
</div>
</el-radio-group>
</el-form-item>
<el-form-item label="预览推送数量">
<span><span class="star-red">*</span>实际推送成功数量将略有偏差,选中多个标签为同时满足选中标签群体的会员。推送人数必须大于1人。</span>
<div>
<el-button>选中标签,预览</el-button>
<span>统计中,请稍候</span>
</div>
<div>
<el-button>重新预览</el-button>
<span>188 人</span>
<span>标签会员数: 188 人</span>
<span>其中,关注公众号: 188 人</span>
<span>已推送4次会员: 188 人</span>
</div>
</el-form-item>
<el-form-item label="执行推送任务">
<span><span class="star-red">*</span>填写邮箱后,勾选免责说明,确认进行推送,推送完成后将发送邮件通知至指定邮箱。</span>
<el-checkbox v-model="checked">本次推送为t测试组商户123自发行为,发放内容请遵守国家相关法律规定..</el-checkbox>
</el-form-item>
<el-form-item label="指定接收邮箱">
<el-input v-model="input" type="email" placeholder="请输入您要接收任务信息的邮箱"></el-input>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="onSubmit">确认推送</el-button>
</el-form-item>
</el-form>
</div>
</template>
<script>
export default {
data () {
return {
form: {
name: '',
region: '',
date1: '',
date2: '',
delivery: false,
type: [],
resource: '',
desc: ''
},
input: '',
checked: true,
dialogImageUrl: '',
dialogVisible: false
}
},
methods: {
onSubmit () {
console.log('submit!')
},
handleRemove (file, fileList) {
console.log(file, fileList)
},
handlePictureCardPreview (file) {
this.dialogImageUrl = file.url
this.dialogVisible = true
}
}
}
</script>
<template>
<div class="marketing">
<add-desc></add-desc>
<!-- 步骤 -->
<el-row></el-row>
<div style="height: 300px;">
<el-steps direction="vertical" :active="1">
<el-step title="新建推送名称" description="88888">
</el-step>
<el-step title="选择推送素材"></el-step>
<el-step title="选择推送范围" description="这是一段很长很长很长的描述性文字"></el-step>
<el-step title="预览推送数量"></el-step>
<el-step title="执行推送任务"></el-step>
</el-steps>
</div>
<el-row>
<el-col :span="2">
<step></step>
</el-col>
<el-col :span="20" :offset="1">
<step-info></step-info>
</el-col>
</el-row>
</div>
</template>
<script>
import AddDesc from './components/AddDesc'
import Step from './components/Step'
import StepInfo from './components/StepInfo'
export default {
components: {
AddDesc
AddDesc,
Step,
StepInfo
}
}
</script>
......
......@@ -4,7 +4,7 @@
<el-row :gutter="20" v-for="(item,index) in datalist" :key="index">
<el-col :span="6">
<div class="article-img">
<img :src="item.img" class="img-size">
<img :src="article1" class="img-size">
</div>
</el-col>
<el-col :span="10">
......@@ -36,21 +36,25 @@
</template>
<script>
import ArticleChart from './ArticleChart'
import article1 from './../../../../static/image/article1.png'
export default {
data () {
return {
datalist: []
datalist: [],
article1
}
},
components: {
ArticleChart
ArticleChart,
article1
},
created () {
this.GetArticleDetail()
},
methods: {
GetArticleDetail () {
this.axios.get('static/article-details.json').then(res => {
this.axios.get('http://rap2api.taobao.org/app/mock/115626/getArticleDetails').then(res => {
this.datalist = res.data.datalist
})
}
......
......@@ -23,7 +23,7 @@ export default {
},
methods: {
getDataList () {
this.axios.get('static/materialist.json').then(res => {
this.axios.get('http://rap2api.taobao.org/app/mock/115626/getMateriaList').then(res => {
if (res && res.data) {
this.datalist = res.data.datalist
}
......
......@@ -28,7 +28,7 @@ export default {
},
methods: {
GetMaterianDatail () {
this.axios.get('static/materian-details.json').then(res => {
this.axios.get('http://rap2api.taobao.org/app/mock/115626/getMaterialDetails').then(res => {
this.datalist = res.data.datalist[0]
})
}
......
......@@ -44,7 +44,7 @@ export default {
},
methods: {
GetPushDetail () {
this.axios.get('static/msg-mass.json').then(res => {
this.axios.get('http://rap2api.taobao.org/app/mock/115626/getTemplateList').then(res => {
if (res && res.data) {
this.dataList = res.data.dataList
}
......
<template>
<div class="temp-list clear">
<div class="temp-button">
<el-button type="text">重置</el-button>
<el-button type="primary">查询</el-button>
</div>
<el-row class="temp-input">
<el-col :span="2">
<div>推送名称:</div>
</el-col>
<el-col :span="4">
<div>
<el-input v-model="input" placeholder="请输入内容"></el-input>
</div>
</el-col>
<el-col :span="2" :offset="2">
<div>推送时间:</div>
</el-col>
<el-col :span="6">
<div>
<el-date-picker v-model="value6" type="daterange" range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期">
</el-date-picker>
</div>
</el-col>
</el-row>
<el-row class="temp-input">
<el-col :span="2">
<div class="">推送人数:</div>
</el-col>
<el-col :span="4">
<div>
<el-input v-model="input" placeholder="请输入内容"></el-input>
</div>
</el-col>
<el-col :span="1">
<div>
-
</div>
</el-col>
<el-col :span="4">
<div>
<el-input v-model="input" placeholder="请输入内容"></el-input>
</div>
</el-col>
<el-col :span="3" :offset="2">
<div>创建推送节点:</div>
</el-col>
<el-col :span="4">
<div>
<el-select v-model="value" placeholder="请选择">
<el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value">
</el-option>
</el-select>
</div>
</el-col>
<el-row>
<div class="temp-button fr">
<el-button type="text">重置</el-button>
<el-button type="primary">查询</el-button>
</div>
</el-row>
<el-form :inline="true" :model="form" class="demo-form-inline" style="min-width:1480px;">
<el-row class="temp-input">
<el-col :span="10">
<el-form-item label="推送名称:">
<el-input v-model="form.user" placeholder="审批人"></el-input>
</el-form-item>
</el-col>
<el-col :span="14">
<el-form-item label="活动时间">
<el-date-picker type="date" placeholder="选择日期" v-model="form.date1"></el-date-picker>
<span class="line time-line" :span="2">-</span>
<el-time-picker type="fixed-time" placeholder="选择时间" v-model="form.date2"></el-time-picker>
</el-form-item>
</el-col>
</el-row>
<el-row class="temp-input">
<el-col :span="10">
<el-form-item label="活动时间">
<el-date-picker type="date" placeholder="选择日期" v-model="form.date1"></el-date-picker>
<span class="line time-line" :span="2">-</span>
<el-time-picker type="fixed-time" placeholder="选择时间" v-model="form.date2"></el-time-picker>
</el-form-item>
</el-col>
<el-col :span="14">
<el-form-item label="推送名称:">
<el-select v-model="value" placeholder="请选择">
<el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value">
</el-option>
</el-select>
</el-form-item>
</el-col>
</el-row>
</el-form>
<el-table :data="dataList">
<el-table-column prop="id" label="推送名称" width="140">
</el-table-column>
......@@ -86,6 +73,10 @@ export default {
input: '',
value6: '',
dataList: [],
form: {
name: '',
region: ''
},
options: [
{
value: '选项1',
......@@ -127,8 +118,13 @@ export default {
}
</script>
<style lang="stylus" scoped>
>>>.el-input__inner
min-width 220px
.temp-list
.temp-button
height 50px
// float right
width 120px
.time-line
margin-left 20px
margin-right 20px
</style>
{
"datalist": [
{
"img": "static/image/article1.png",
"title": "马云张勇",
"readnum": 1111,
"readtime": 6,
"originreadnum": 111,
"originreadtime": 77
},
{
"img": "static/image/article2.png",
"title": "全面揭秘阿里",
"readnum": 6,
"readtime": 2,
"originreadnum": 111,
"originreadtime": 9
},
{
"img": "static/image/article3.png",
"title": "7-eleven",
"readnum": 2,
"readtime": 8,
"originreadnum": 111,
"originreadtime": 1
}
]
}
{
"datalist": [
{
"imgUrl": "./../../../assets/images/img1.png"
},
{
"imgUrl": "./../../../assets/images/img2.png"
},
{
"imgUrl": "./../../../assets/images/img3.png"
},
{
"imgUrl": "./../../../assets/images/img1.png"
},
{
"imgUrl": "./../../../assets/images/img2.png"
},
{
"imgUrl": "./../../../assets/images/img3.png"
}
]
}
{
"datalist": [
{
"img": "https://ss3.bdstatic.com/70cFv8Sh_Q1YnxGkpoWK1HF6hhy/it/u=3338860012,664035936&fm=27&gp=0.jpg",
"sendnum": 12111124,
"readnum": 1111,
"readtime": 12111121,
"originreadnum": 111,
"originreadtime": 5785111412
},
{
"img": "https://ss3.bdstatic.com/70cFv8Sh_Q1YnxGkpoWK1HF6hhy/it/u=3338860012,664035936&fm=27&gp=0.jpg",
"sendnum": 2222,
"readnum": 222,
"readtime": 22222,
"originreadnum": 122224545,
"originreadtime": 22222
},
{
"img": "https://ss3.bdstatic.com/70cFv8Sh_Q1YnxGkpoWK1HF6hhy/it/u=3338860012,664035936&fm=27&gp=0.jpg",
"sendnum": 333,
"readnum": 3333,
"readtime": 3,
"originreadnum": 33,
"originreadtime": 5733385412
}
]
}
{
"dataList": [
{
"name": "sdfsdf",
"template": "微信营销",
"time": "2018-10-18 17:20:47",
"type": "全体推送",
"state": "推送ing",
"num": "23",
"suc": "0",
"node": "测试组商户",
"result": "推送chenggong"
},
{
"name": "sdfsdf",
"template": "微信营销",
"time": "2018-10-18 17:20:47",
"type": "全体推送",
"state": "推送完成",
"num": "23",
"suc": "0",
"node": "测试组商户",
"result": "推送失败"
},
{
"name": "sdfsdf",
"template": "微信营销",
"time": "2018-10-18 17:20:47",
"type": "全体推送",
"state": "推送完成",
"num": "23",
"suc": "0",
"node": "测试组商户",
"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