增加重要事件海报制作页面

This commit is contained in:
gaolu
2019-11-27 10:17:29 +08:00
parent 6949f2ce94
commit e289d878e4
12 changed files with 810 additions and 2 deletions

View File

@@ -0,0 +1,26 @@
import request from '@/assets/js/utils/request'
import getUrl from '@/assets/js/utils/get-url'
//事件列表
export function getEvent(data) {
return request({
url: getUrl('/customer/agent/event/getEvent', 1),
method: 'post',
data
})
}
export function saveOrUpdate(data) {
return request({
url: getUrl('/customer/agent/event/saveOrUpdate', 1),
method: 'post',
data
})
}
export function deleteEvent(data) {
return request({
url: getUrl('/customer/agent/event/deleteEvent', 1),
method: 'post',
data
})
}

View File

@@ -0,0 +1,29 @@
import request from '@/assets/js/utils/request'
import getUrl from '@/assets/js/utils/get-url'
//获取海报类型
export function getPosterType(data) {
return request({
url: getUrl('/media/pster/getPosterType', 1),
method: 'post',
data
})
}
//海报列表查询
export function getPosterList(data) {
return request({
url: getUrl('/media/pster/getPosterList', 1),
method: 'post',
data
})
}
//海报详情
export function getPosterInfo(data) {
return request({
url: getUrl('/media/pster/getPosterInfo', 1),
method: 'post',
data
})
}

View File

@@ -2,7 +2,7 @@
const signContract = () => import('@/views/ebiz/agentEenter/SignContract') const signContract = () => import('@/views/ebiz/agentEenter/SignContract')
const letterOfKnow = () => import('@/views/ebiz/agentEenter/LetterOfKnow') const letterOfKnow = () => import('@/views/ebiz/agentEenter/LetterOfKnow')
const healthNotice = () => import('@/views/ebiz/agentEenter/HealthNotice') const healthNotice = () => import('@/views/ebiz/agentEenter/HealthNotice')
const letterOfCommitment = () => import('@/views/ebiz/agentEenter/LetterOfCommitment') const letterOfCommitment = () => import('@/views/ebiz/agentEenter/letterOfCommitment')
const messageLetterOfCommitment = () => import('@/views/ebiz/agentEenter/MessageLetterOfCommitment') const messageLetterOfCommitment = () => import('@/views/ebiz/agentEenter/MessageLetterOfCommitment')
const illegalLetterOfCommitment = () => import('@/views/ebiz/agentEenter/IllegalLetterOfCommitment') const illegalLetterOfCommitment = () => import('@/views/ebiz/agentEenter/IllegalLetterOfCommitment')
const guarantee = () => import('@/views/ebiz/agentEenter/Guarantee') const guarantee = () => import('@/views/ebiz/agentEenter/Guarantee')

View File

@@ -7,4 +7,6 @@ import serve from './serve'
import common from './common' import common from './common'
import product from './product' import product from './product'
import agentEenter from './agentEenter.js' import agentEenter from './agentEenter.js'
export default [...proposal, ...sale, ...customer, ...my, ...serve, ...common, ...product, ...agentEenter] //根据需要进行删减 import milestone from './milestone'
import poster from './poster'
export default [...proposal, ...sale, ...customer, ...my, ...serve, ...common, ...product, ...agentEenter, ...milestone, ...poster] //根据需要进行删减

View File

@@ -0,0 +1,34 @@
//重要事件 定义相关组件
const list = () => import('@/views/ebiz/milestone/milestoneList')
const addMilestone = () => import('@/views/ebiz/milestone/addMilestone')
const editMilestone = () => import('@/views/ebiz/milestone/editMilestone')
export default [
{
path: '/milestone/list',
name: 'milestoneList',
component: list,
meta: {
title: '事件列表',
index: 1
}
},
{
path: '/milestone/add',
name: 'addMilestone',
component: addMilestone,
meta: {
title: '新增事件',
index: 1
}
},
{
path: '/milestone/edit',
name: 'editMilestone',
component: editMilestone,
meta: {
title: '编辑事件',
index: 1
}
},
]

24
src/router/ebiz/poster.js Normal file
View File

@@ -0,0 +1,24 @@
//保全 定义相关组件
const posterList = () => import('@/views/ebiz/poster/PosterList')
const posterPreview = () => import('@/views/ebiz/poster/PosterPreview')
export default [
{
path: '/poster/posterList',
name: 'posterList',
component: posterList,
meta: {
title: '海报制作',
index: 1
}
},
{
path: '/poster/posterPreview',
name: 'posterPreview',
component: posterPreview,
meta: {
title: '海报预览',
index: 2
}
}
]

View File

@@ -20,6 +20,10 @@
保单列表 保单列表
<i class="van-icon van-icon-arrow v-middle"></i> <i class="van-icon van-icon-arrow v-middle"></i>
</li> </li>
<li @click="goMilestone">
重要事件
<i class="van-icon van-icon-arrow v-middle"></i>
</li>
</ul> </ul>
<van-button type="danger" class="bottom-btn" @click="delBtn" v-no-more-click="1000">删除客户</van-button> <van-button type="danger" class="bottom-btn" @click="delBtn" v-no-more-click="1000">删除客户</van-button>
</div> </div>
@@ -122,6 +126,17 @@ export default {
}) })
.catch(err => {}) .catch(err => {})
}, },
goMilestone() {
this.$jump({
flag: 'h5',
extra: {
url: location.origin + '/#/milestone/list'
},
routerInfo: {
path: '/milestone/list'
}
})
},
delBtn() { delBtn() {
let $this = this let $this = this
let data = { let data = {

View File

@@ -0,0 +1,152 @@
<template>
<div class="addMilesone fs15">
<van-cell-group>
<van-field v-model="noticeDate" label="提醒日期" v-validate="'required'" name="提醒日期" placeholder="请选择" @click="show = true" :readonly="true"/>
</van-cell-group>
<van-cell-group>
<van-field v-model="noticeTime" label="提醒时间" v-validate="'required'" name="提醒时间" placeholder="请选择" @click="timeShow = true" :readonly="true"/>
</van-cell-group>
<van-cell-group>
<van-field v-model="eventContent" label="事件内容" v-validate="'required'" name="事件内容" placeholder="请输入" class="text" type="textarea"/>
</van-cell-group>
<van-button type="danger" @click="save" class="bottom-btn fs16">保存</van-button>
<van-popup v-model="show" position="bottom">
<van-datetime-picker
v-model="currentDate"
type="date"
@confirm="ok"
@cancel="cancel"
:min-date="minDate"
:formatter="formatter"
/>
</van-popup>
<van-popup v-model="timeShow" position="bottom">
<van-datetime-picker
v-model="currentTime"
type="time"
@confirm="okTime"
@cancel="cancelTime"
:filter="filter"
/>
</van-popup>
</div>
</template>
<script>
import Vue from 'vue';
import { Field,CellGroup,DatetimePicker,Popup } from 'vant';
import { saveOrUpdate } from '@/api/ebiz/milestone/milestone.js'
Vue.use(Field).use(CellGroup).use(DatetimePicker).use(Popup);
export default {
name: 'addMilestone',
data(){
return{
noticeDate: '',
noticeTime: '',
eventContent: '',
show: false,
timeShow:false,
currentDate: new Date(),
minDate:new Date(),
currentTime: '12:00'
}
},
mounted(){
},
methods:{
save(){
this.$validator.validate().then(valid => {
if(true === valid){
this.save1()
}else{
this.$toast(this.$validator.errors.all()[0])
}
})
},
save1(){
let $this = this
let data = {
id: null, //事件id 新增传null 修改必传
agentCode: "demoData",//代理人编码
customerNumber: localStorage.getItem('customerNumber'),// 客户号
eventContent: $this.eventContent,// 事件内容
noticeDate: $this.noticeDate,//提示日期 yyyy-MM-dd
noticeTime: $this.noticeTime,// 提示时间 HH:mm:ss
noticeStatus: "00"// 提示状态 00 未提醒(固定)
}
console.log(123,data)
saveOrUpdate(data)
.then(res => {
if (res.content.result == 0) {
$this.$toast('保存成功')
setTimeout(()=>{
this.$jump({
flag: 'h5',
extra: {
url: location.origin + '/#/milestone/list'
},
routerInfo: {
path: '/milestone/list'
}
})
},100)
}
})
.catch(err => {$this.$toast('保存失败')})
},
cancel(){
this.show = false;
},
ok(value){
this.show = false;
var date = new Date(value)
var year = date.getFullYear()
var month = date.getMonth() + 1
var day = date.getDate()
if (month < 10) {
month = '0' + month
}
if (day < 10) {
day = '0' + day
}
this.noticeDate = year + '-' + month + '-' + day
},
okTime(value){
console.log(value)
this.timeShow = false;
this.noticeTime = value
},
cancelTime(){
this.timeShow = false;
},
formatter(type, value) {
if (type === 'year') {
return `${value}`;
} else if (type === 'month') {
return `${value}`
}else if (type === 'day') {
return `${value}`
}
return value;
},
filter(type, options) {
if (type === 'minute') {
return options.filter(option => option % 15 === 0)
}
return options;
}
}
}
</script>
<style scoped>
.addMilesone{
height: 100%;
background-color: #fff
}
.text{
min-height: 22vw
}
</style>

View File

@@ -0,0 +1,159 @@
<template>
<div class="editMilesone">
<van-cell-group>
<van-field v-model="noticeDate" label="提醒日期" v-validate="'required'" name="提醒日期" placeholder="请选择" @click="show = true" :readonly="true"/>
</van-cell-group>
<van-cell-group>
<van-field v-model="noticeTime" label="提醒时间" v-validate="'required'" name="提醒时间" placeholder="请选择" @click="timeShow = true" :readonly="true"/>
</van-cell-group>
<van-cell-group>
<van-field v-model="eventContent" label="事件内容" v-validate="'required'" name="事件内容" placeholder="请输入" class="text" type="textarea"/>
</van-cell-group>
<van-button type="danger" @click="save" class="bottom-btn fs16">保存</van-button>
<van-popup v-model="show" position="bottom">
<van-datetime-picker
v-model="currentDate"
type="date"
@confirm="ok"
@cancel="cancel"
:min-date="minDate"
:formatter="formatter"
/>
</van-popup>
<van-popup v-model="timeShow" position="bottom">
<van-datetime-picker
v-model="currentTime"
type="time"
@confirm="okTime"
@cancel="cancelTime"
:filter="filter"
/>
</van-popup>
</div>
</template>
<script>
import Vue from 'vue';
import { Field,CellGroup,DatetimePicker,Popup } from 'vant';
import { saveOrUpdate } from '@/api/ebiz/milestone/milestone.js'
Vue.use(Field).use(CellGroup).use(DatetimePicker).use(Popup);
export default {
name: 'editMilestone',
data(){
return{
noticeDate: '',
noticeTime: '',
eventContent: '',
show: false,
timeShow:false,
currentDate: new Date(),
minDate:new Date(),
currentTime: '12:00',
item: ''
}
},
mounted(){
// this.item = JSON.parse(decodeURIComponent(this.$route.query.item))
let item = JSON.parse(localStorage.getItem('milestone'))
this.item = item
this.noticeDate = item.noticeDate
this.noticeTime = item.noticeTime
this.eventContent = item.eventContent
},
methods:{
save(){
this.$validator.validate().then(valid => {
if(true === valid){
this.save1()
}else{
this.$toast(this.$validator.errors.all()[0])
}
})
},
save1(){
let $this = this
let data = {
id: $this.item.id, //事件id 新增传null 修改必传
agentCode: "demoData",//代理人编码
customerNumber: localStorage.getItem('customerNumber'),// 客户号
eventContent: $this.eventContent,// 事件内容
noticeDate: $this.noticeDate,//提示日期 yyyy-MM-dd
noticeTime: $this.noticeTime,// 提示时间 HH:mm:ss
noticeStatus: "00"// 提示状态 00 未提醒(固定)
}
console.log(123,data)
saveOrUpdate(data)
.then(res => {
if (res.content.result == 0) {
$this.$toast('保存成功')
setTimeout(()=>{
this.$jump({
flag: 'h5',
extra: {
url: location.origin + '/#/milestone/list'
},
routerInfo: {
path: '/milestone/list'
}
})
},100)
}
})
.catch(err => {$this.$toast('保存失败')})
},
cancel(){
this.show = false;
},
ok(value){
this.show = false;
var date = new Date(value)
var year = date.getFullYear()
var month = date.getMonth() + 1
var day = date.getDate()
if (month < 10) {
month = '0' + month
}
if (day < 10) {
day = '0' + day
}
this.date = year + '-' + month + '-' + day
},
okTime(value){
console.log(value)
this.timeShow = false;
this.time = value
},
cancelTime(){
this.timeShow = false;
},
formatter(type, value) {
if (type === 'year') {
return `${value}`;
} else if (type === 'month') {
return `${value}`
}else if (type === 'day') {
return `${value}`
}
return value;
},
filter(type, options) {
if (type === 'minute') {
return options.filter(option => option % 15 === 0)
}
return options;
}
}
}
</script>
<style scoped>
.editMilesone{
height: 100%;
background-color: #fff
}
.text{
min-height: 22vw
}
</style>

View File

@@ -0,0 +1,176 @@
<template>
<div class="milestone pb45">
<van-list
v-model="loading"
:finished="finished"
finished-text="没有更多了"
@load="onLoad"
>
<div class="bg-white radius5 mh15 pr15 pl10 mb20 mt5 pt10 fs15" v-for="(item,index) in list" :key="index">
<van-row class="card-row">
<van-col span="6" >提醒日期</van-col>
<van-col span="18" >{{item.noticeDate}} </van-col>
</van-row>
<van-row class="card-row">
<van-col span="6" >提醒时间</van-col>
<van-col span="18" >{{item.noticeTime}} </van-col>
</van-row>
<van-row class="card-row">
<van-col span="6" >时间内容</van-col>
<van-col span="18" class="product">{{item.eventContent}} </van-col>
</van-row>
<van-row class="card-row">
<van-col span="6" >提醒状态</van-col>
<van-col span="18" :class="item.noticeStatus=='01'?'remind':'not'">{{item.noticeStatus=='00'?'未到提醒时间':item.noticeStatus=='01'?'已提醒':'提醒异常'}} </van-col>
</van-row>
<van-row class="text-right pv5 card-title">
<van-button type="info" plain @click="edit(item)" size="small" class="mr5" round>编辑</van-button>
<van-button type="info" plain @click="del(item)" size="small" class="mr5" round>删除</van-button>
</van-row>
</div>
</van-list>
<van-button type="danger" @click="addMilestone" class="bottom-btn fs16">新增事件</van-button>
</div>
</template>
<script>
import { getEvent, deleteEvent} from '@/api/ebiz/milestone/milestone.js'
import { Dialog, List,Toast,Row, Col,} from 'vant'
export default {
name: 'milestoneList',
components: {
[List.name]: List,
[Row.name]: Row,
[Col.name]: Col,
},
data(){
return{
list:[{
noticeDate: '2019-11-25',
noticeTime: '16:30',
eventContent: '拉风的水果放到热客户服务而我没问为啥的市场纳斯达克vjuf',
noticeStatus: '01'
},
{
noticeDate: '2019-11-25',
noticeTime: '16:30',
eventContent: '拉风的水果放到热客户服务而我没问为啥的市场纳斯达克vjuf',
noticeStatus: '00'
},
{
noticeDate: '2019-11-25',
noticeTime: '18:30',
eventContent: '拉风的水果放到热客户服务而我没问为啥的市场纳斯达克vjuf',
noticeStatus: '00'
}],
loading: false,
finished: false,
pageNum:1
}
},
mounted(){
},
methods:{
onLoad() {
let $this = this
let data = {
pageSize: '10',
pageNum: $this.pageNum,
customerNumber: localStorage.getItem('customerNumber'),//代理人编码
agentCode: "demoData" //客户号
}
getEvent(data)
.then(res => {
if (res.content.result == 0) {
$this.pageNum++
$this.list = $this.proposalList.concat(res.content.pageInfo.list)
if ($this.list.length < res.content.pageInfo.total) {
that.loading = false
that.finished = false
} else {
that.finished = true
that.loading = false
}
}
})
.catch(err => {})
},
edit(item){
localStorage.setItem('milestone', JSON.stringify(item))
this.$jump({
flag: 'h5',
extra: {
url: location.origin + '/#/milestone/edit'
},
routerInfo: {
path: '/milestone/edit'
}
})
// item=encodeURIComponent(JSON.stringify(item))
// this.$jump({
// flag: 'h5',
// extra: {
// url: location.origin + `/#/milestone/edit?item=${item}`,
// needRefresh: '1'
// },
// routerInfo: {
// path: `/milestone/edit?item=${item}`
// }
// })
},
addMilestone() {
this.$jump({
flag: 'h5',
extra: {
url: location.origin + '/#/milestone/add'
},
routerInfo: {
path: '/milestone/add'
}
})
},
del(item){
let data = {
id : item.id
}
Dialog.confirm({
message: '是否确认删除?',
})
.then(() => {
deleteEvent(data).then(res=>{
if(res.content.result==0){
this.pageNum = 1
this.list=[]
;[this.loading, this.finished] = [true, false]
this.onLoad()
}else{
this.$toast(res.resultMessage)
}
})
})
.catch(() => {})
}
}
}
</script>
<style scoped>
.card-row{
line-height: 8vw;
padding: 0 0.1rem;
box-sizing: border-box;
}
.not{
color: red;
}
.remind{
color: rgb(117, 184, 17)
}
.card-title{
border-top:1px solid #dfdfdf;
}
</style>

View File

@@ -0,0 +1,111 @@
<template>
<div class="poster-list-container">
<van-sticky>
<van-tabs :line-width="45" v-model="active" @change="tabChange" sticky>
<van-tab :name="index" :title="item.name" v-for="(item, index) in posterTypeList" :key="index">
<!-- <img src="@/assets/images/u10199.png" /> -->
</van-tab>
</van-tabs>
</van-sticky>
<van-grid :border="false" :column-num="3">
<van-grid-item v-for="(item, index) in posterList" :key="index">
<img :src="item.posterNarrowUrl | urlFormat" @click="posterPreview(item.posterId)" />
</van-grid-item>
</van-grid>
</div>
</template>
<script>
import { Tab, Tabs, Sticky, Grid, GridItem } from 'vant'
import { getPosterType, getPosterList } from '@/api/ebiz/poster/poster'
import config from '@/config'
export default {
name: 'posterList',
components: {
[Tab.name]: Tab,
[Tabs.name]: Tabs,
[Sticky.name]: Sticky,
[Grid.name]: Grid,
[GridItem.name]: GridItem
},
data() {
return {
posterTypeList: [{name:'增员'},{name:'节日'},{name:'生日'}], //海报类型
active: '0',
posterType: '',
srcUrl: '@/images/u10199.png',
pageNum: 1,
pageSize: 10,
posterList: [] // 海报列表
}
},
created() {
this.getPosterTypeList()
},
methods: {
// 获取海报类型
async getPosterTypeList() {
let res = await getPosterType({})
if (res.result == 0) {
this.posterTypeList = res.content.paterTypeList
this.posterType = res.content.paterTypeList[0].code
this.getPosterList()
} else {
this.$toast(res.resultMessage)
}
},
// 海报列表查询
async getPosterList() {
let param = {
posterInfoDTO: {
posterType: this.posterType
},
pageNum: this.pageNum,
pageSize: this.pageSize
}
console.log(param)
let res = await getPosterList(param)
if (res.result == 0) {
this.posterList = res.pageInfo.list
} else {
this.$toast(res.resultMessage)
}
},
tabChange(name, title) {
this.posterType = this.posterTypeList[name].code
this.pageNum= 1,
this.pageSize= 10,
this.posterList=[]
this.getPosterList()
console.log(name, title)
},
posterPreview(id) {
this.$jump({
flag: 'h5',
extra: {
url: location.origin + `/#/poster/posterPreview?id=${id}`
},
routerInfo: {
path: `/poster/posterPreview?id=${id}`
}
})
}
},
filters: {
urlFormat(url) {
console.log((config.imgDomain + `/returnImageStream?a=b.jpg&imgPath=${url}`).replace(/\+/g, '%2B'))
return (config.imgDomain + `/returnImageStream?a=b.jpg&imgPath=${url}`).replace(/\+/g, '%2B')
}
}
}
</script>
<style lang="scss" scoped>
.poster-list-container {
img {
width: 100%;
}
}
</style>

View File

@@ -0,0 +1,80 @@
<template>
<div class="poster-preview-container">
<div class="flex align-items-c justify-content-c top30 relative">
<img class="w300" :src="posterInfo.posterUrl | urlFormat" alt="" />
<div class="poster-info w300 white absolute fs14 bottom0" style="background:rgba(0,0,0,.5)">
<p class="p5 mt5 ml5">{{ manageComName || '国富人寿保险股份有限公司' }}</p>
<p class="p5 ml5">{{ userName }}</p>
<p class="p5 mb5 ml5">{{ userMobile }}</p>
</div>
</div>
<van-button type="danger" size="large" @click="shareFriends" v-if="!isWeixin" class="mt50">分享</van-button>
</div>
</template>
<script>
import { getPosterInfo } from '@/api/ebiz/poster/poster'
import { getAgentInfo } from '@/api/ebiz/my/my'
import config from '@/config'
export default {
name: 'posterPreview',
data() {
let isWeixin = this.$utils.device().isWeixin //判断环境
return {
srcUrl: '',
isWeixin,
id: '',
posterInfo: {},
userName: '', // 代理人姓名
userMobile: '', // 用户手机号
manageComName: '' // 公司名称
}
},
async created() {
if (this.isWeixin) {
localStorage.token = this.$route.query.token
}
let res = await getAgentInfo({})
if (res.result == 0) {
this.userName = res.name
this.userMobile = res.phoneNo
this.manageComName = res.manageComName
this.id = this.$route.query.id
this.getPosterDetail()
}
},
methods: {
shareFriends() {
// eslint-disable-next-line no-undef
EWebBridge.webCallAppInJs('bridge', {
flag: 'share',
extra: {
title: `国富人寿竭诚为您服务`,
content: '您收到一封海报, 点击查看',
url: location.origin + '/#/poster/posterPreview?token=' + localStorage.token,
img: this.$assetsUrl + 'images/logo.png'
}
})
},
async getPosterDetail() {
let res = await getPosterInfo({
posterInfoDTO: {
posterId: this.id
}
})
if (res.result == 0) {
this.posterInfo = res.infoDTOList[0]
} else {
this.$toast(res.resultMessage)
}
}
},
filters: {
urlFormat(url) {
return (config.imgDomain + `/returnImageStream?a=b.jpg&imgPath=${url}`).replace(/\+/g, '%2B')
}
}
}
</script>
<style lang="scss" scoped></style>