1406 lines
85 KiB
PHP
1406 lines
85 KiB
PHP
@extends('layouts.base')
|
||
@section('title', '基础设置')
|
||
@section('content')
|
||
<link rel="stylesheet" href="{{resource_get('plugins/new-poster/views/admin/index.css')}}">
|
||
<link rel="stylesheet" href="{{resource_get('plugins/new-poster/views/admin/edit.css')}}">
|
||
<link rel="stylesheet" href="{{static_url('css/public-number.css')}}">
|
||
|
||
<style>
|
||
/* 导航 */
|
||
.el-radio-button .el-radio-button__inner,.el-radio-button:first-child .el-radio-button__inner {border-radius: 4px 4px 4px 4px;border-left: 0px;}
|
||
.el-radio-button__inner{border:0;}
|
||
.el-radio-button:last-child .el-radio-button__inner {border-radius: 4px 4px 4px 4px;}
|
||
.upload-boxed .el-icon-close {position: absolute;top: -5px;right: -5px;color: #fff;background: #333;border-radius: 50%;cursor: pointer;}
|
||
.el-radio__inner { border: 1px solid #cfcfcf;}
|
||
.edit-poster .el-form-item__label{width:20%!important}
|
||
.edit-poster .el-form-item__content{margin-left:20%!important}
|
||
|
||
</style>
|
||
<div class="all">
|
||
<div id="app" v-cloak>
|
||
<el-form ref="form" :model="form" :rules="rules" label-width="15%">
|
||
<div class="vue-head">
|
||
<el-radio-group v-model="order_type">
|
||
<el-radio-button label="1">海报设置</el-radio-button>
|
||
<el-radio-button label="2" v-if="poster_type==1">权限设置</el-radio-button>
|
||
<el-radio-button label="3" v-if="poster_type==1">推送设置</el-radio-button>
|
||
<el-radio-button label="4" v-if="poster_type==1">奖励设置</el-radio-button>
|
||
<el-radio-button label="5" v-if="poster_type==1">通知设置</el-radio-button>
|
||
<el-radio-button label="6" v-if="poster_type==1">推广设置</el-radio-button>
|
||
<el-radio-button label="7" v-if="poster_type==1||poster_type==2||poster_type==5||poster_type==7||poster_type==16">海报中心</el-radio-button>
|
||
</el-radio-group>
|
||
</div>
|
||
<div v-show="order_type==1">
|
||
<div class="vue-head">
|
||
<div class="vue-main-title">
|
||
<div class="vue-main-title-left"></div>
|
||
<div class="vue-main-title-content">基础设置</div>
|
||
</div>
|
||
<div class="vue-main-form">
|
||
<el-form-item label="海报名称" prop="title">
|
||
<el-input v-model="form.title" style="width:70%;" ref="title"></el-input>
|
||
</el-form-item>
|
||
<el-form-item label="关键词" prop="keyword" v-if="poster_type==1">
|
||
<el-input v-model="form.keyword" style="width:70%;" ref="keyword"></el-input>
|
||
<div class="tip">接入微信公众号有效，公众号触发生成海报的关键词</div>
|
||
</el-form-item>
|
||
<el-form-item label="是否启用" prop="status" v-if="poster_type == 1">
|
||
<el-switch v-model="form.status" :active-value="1" :inactive-value="0"></el-switch>
|
||
</el-form-item>
|
||
<el-form-item label="会员中心显示" prop="center_show" v-if="poster_type!=30">
|
||
<el-checkbox-group v-model="form.center_show">
|
||
<el-checkbox label="1" @change="changeCenterShow()">微信公众号</el-checkbox>
|
||
<el-checkbox label="5" @change="changeCenterShow()">H5</el-checkbox>
|
||
<el-checkbox label="2" @change="changeCenterShow()">微信小程序</el-checkbox>
|
||
<el-checkbox label="7" @change="changeCenterShow()">商城APP</el-checkbox>
|
||
<el-checkbox label="0" @change="changeCenterShow('other')">不显示</el-checkbox>
|
||
</el-checkbox-group>
|
||
|
||
<div class="tip">开启状态：会员中心推广二维码显示该海报图片</div>
|
||
</el-form-item>
|
||
<el-form-item label="APP分享页面显示" prop="app_share_show" v-if="poster_type == 7 || poster_type == 16">
|
||
<el-switch v-model="form.app_share_show" :active-value="1" :inactive-value="0"></el-switch>
|
||
<div class="tip">开启状态：APP分享页面显示该海报图片</div>
|
||
</el-form-item>
|
||
<el-form-item label="是否前端生成" prop="is_ago" v-if="poster_type!=30">
|
||
<el-switch v-model="form.is_ago" :active-value="1" :inactive-value="0"></el-switch>
|
||
</el-form-item>
|
||
<el-form-item label="标签" prop="">
|
||
<!-- 回显选择标签-->
|
||
<div v-if="form.label">
|
||
<el-tag closable :disable-transitions="false" @close="handleClose(tag)">
|
||
[[form.label]]
|
||
</el-tag>
|
||
</div>
|
||
<el-popover placement="top" width="200" v-model="label_show">
|
||
<el-input v-model="label_word" size="mini" placeholder="请输入标签名"></el-input>
|
||
<div style="text-align: right; margin: 10px 0">
|
||
<el-button size="mini" type="text" @click="label_show = false">取消</el-button>
|
||
<el-button type="primary" size="mini" @click="sureAddLabel">确定</el-button>
|
||
</div>
|
||
<el-button plain type="primary" slot="reference" icon="el-icon-plus" size="small">添加标签</el-button>
|
||
</el-popover>
|
||
<el-popover placement="right" width="400" v-model="history_show">
|
||
<div>
|
||
<el-input v-model="label_word" size="mini" placeholder="请输入标签名" style="width:70%"></el-input>
|
||
<el-button type="primary" size="mini" @click="getLabel()">搜索</el-button>
|
||
</div>
|
||
<div class="label-history" style="min-height:200px;overflow:auto;margin:10px 0;">
|
||
<!-- 循环标签 -->
|
||
<div style="display:flex;flex-wrap:wrap">
|
||
<div v-for="(item,index) in label_list" :key="index" @click="chooseLabel(item)" :style="{color:item.name==form.label?'#29BA9C':''}" style="margin:5px 10px;font-weight: 400;cursor: pointer;">[[item.name]]</div>
|
||
</div>
|
||
</div>
|
||
<el-row>
|
||
<el-col align="right">
|
||
<el-pagination layout="prev, pager, next,jumper" @current-change="getLabel" :total="label_total"
|
||
:page-size="label_per_page" :current-page="label_current_page" background
|
||
></el-pagination>
|
||
</el-col>
|
||
</el-row>
|
||
<el-button type="text" slot="reference" @click="getLabel()" size="small" style="color:#ff9b19;margin-left:20px">历史标签</el-button>
|
||
</el-popover>
|
||
|
||
</el-form-item>
|
||
|
||
</div>
|
||
</div>
|
||
<div class="vue-head" style="margin-top:20px">
|
||
<div class="vue-main-title">
|
||
<div class="vue-main-title-left"></div>
|
||
<div class="vue-main-title-content">海报设计</div>
|
||
</div>
|
||
<div class="vue-main-form">
|
||
<div style="width:85%;margin:auto;display:flex;margin-bottom:30px;">
|
||
<div style="width: 320px;height: 504px;border: 1px solid #ccc;position: relative;">
|
||
<img v-if="form.background_url" :src="form.background_url" alt="" style="width:100%;height:100%;">
|
||
<drag-resize
|
||
v-for="(rect, index) in rects"
|
||
:key="index"
|
||
:w="rect.width"
|
||
:h="rect.height"
|
||
:x="rect.left"
|
||
:y="rect.top"
|
||
:axis="rect.axis"
|
||
:is-active="rect.active"
|
||
:minw="rect.minw"
|
||
:minh="rect.minh"
|
||
:is-draggable="rect.draggable"
|
||
:is-resizable="rect.resizable"
|
||
:parent-limitation="rect.parentLim"
|
||
:aspect-ratio="rect.aspectRatio"
|
||
:z="rect.zIndex"
|
||
:content-class="rect.class"
|
||
v-on:activated="activateEv(index)"
|
||
v-on:deactivated="deactivateEv(index)"
|
||
v-on:dragging="changePosition($event, index)"
|
||
v-on:resizing="changeSize($event, index)"
|
||
style="position: absolute;"
|
||
>
|
||
<!-- 头像 -->
|
||
<img v-if="rect.type=='head'" :src="head_url" alt="" style="width:100%;height:100%;">
|
||
<!-- 关注二维码 -->
|
||
<img v-if="poster_type==1&&rect.type=='qr'" :src="qr_url" alt="" style="width:100%;height:100%;">
|
||
<!-- 关注二维码 -->
|
||
<!-- 商城二维码 -->
|
||
<img v-if="poster_type==1&&rect.type=='shopqr'" :src="qr_shop" alt="" style="width:100%;height:100%;">
|
||
<!-- 商城二维码 -->
|
||
<!-- 小程序二维码 -->
|
||
<img v-if="poster_type==2&&rect.type=='qr'" :src="qr_url" alt="" style="width:100%;height:100%;">
|
||
<!-- 小程序二维码 -->
|
||
<!-- H5二维码 -->
|
||
<img v-if="poster_type==5&&rect.type=='qr'" :src="qr_shop" alt="" style="width:100%;height:100%;">
|
||
<!-- H5二维码 -->
|
||
<!-- APP二维码 -->
|
||
<img v-if="(poster_type==7 || poster_type==16) &&rect.type=='qr'" :src="app_qr_url" alt="" style="width:100%;height:100%;">
|
||
<!-- APP二维码 -->
|
||
<img v-if="rect.type=='img'" :src="rect.src_url" alt="" style="width:100%;height:100%;">
|
||
<!-- 企业成员二维码 -->
|
||
<img v-if="poster_type==30&&rect.type=='customer_qr'" :src="qr_url" alt="" style="width:100%;height:100%;">
|
||
|
||
<div v-if="rect.type=='nickname'"
|
||
:style="{color:rect.color,fontSize:rect.size+'px'}"
|
||
style="width:100%;height:100%;"
|
||
>
|
||
昵称
|
||
</div>
|
||
<div v-if="rect.type=='invite'"
|
||
:style="{color:rect.color,fontSize:rect.size+'px'}"
|
||
style="width:100%;height:100%;"
|
||
>
|
||
A1H3U5GF
|
||
</div>
|
||
<div v-if="rect.type=='mid'"
|
||
:style="{color:rect.color,fontSize:rect.size+'px'}"
|
||
style="width:100%;height:100%;"
|
||
>
|
||
8888
|
||
</div>
|
||
<div v-if="rect.type=='customer_activity'"
|
||
:style="{color:rect.color,fontSize:rect.size+'px'}"
|
||
style="width:100%;height:100%;"
|
||
>
|
||
活动名称
|
||
</div>
|
||
</drag-resize>
|
||
|
||
</div>
|
||
<div class="edit-poster" style="flex:1;margin-left:10%">
|
||
<!-- <div>背景图片</div> -->
|
||
<el-form-item label="背景图片" prop="background">
|
||
<div class="upload-box" @click="openUpload('background')" v-if="!form.background_url">
|
||
<i class="el-icon-plus" style="font-size:32px"></i>
|
||
</div>
|
||
<div @click="openUpload('background')" class="upload-boxed" v-if="form.background_url" style="height:236.25px">
|
||
<img :src="form.background_url" alt="" style="width:150px;height:236.25px;border-radius: 5px;cursor: pointer;">
|
||
<i class="el-icon-close" @click.stop="clearImg('background')" title="点击清除图片"></i>
|
||
<div class="upload-boxed-text">点击重新上传</div>
|
||
</div>
|
||
<div class="tip">建议背景图片尺寸: 640*1008
|
||
<span v-if="isDecorate">
|
||
<span @click.stop="jumpUrl" style="color: #196dfa;font-weight: 600;margin-left: 15px;cursor:pointer;">图片智能在线设计</span><i class="el-icon-question" style="color:#196dfa;margin-left:2px;" @click="showIntroduce = true;"></i>
|
||
</span>
|
||
</div>
|
||
</el-form-item>
|
||
<el-form-item label="海报元素" prop="">
|
||
<el-button size="small" @click="addEle('head')">头像</el-button>
|
||
<el-button size="small" @click="addEle('nickname')">昵称</el-button>
|
||
<el-button size="small" @click="addEle('qr')" v-if="poster_type==1">关注二维码</el-button>
|
||
<el-button size="small" @click="addEle('shopqr')" v-if="poster_type==1">商城二维码</el-button>
|
||
<el-button size="small" @click="addEle('qr')" v-if="poster_type==2">小程序二维码</el-button>
|
||
<el-button size="small" @click="addEle('qr')" v-if="poster_type==5">商城二维码</el-button>
|
||
<el-button size="small" @click="addEle('qr')" v-if="poster_type==7 || poster_type==16">APP二维码</el-button>
|
||
<el-button size="small" @click="addEle('img')">图片</el-button>
|
||
<el-button size="small" @click="addEle('invite')">邀请码</el-button>
|
||
<el-button size="small" @click="addEle('mid')">会员ID</el-button>
|
||
<el-button size="small" @click="addEle('customer_activity')" v-if="poster_type==30">活动名称</el-button>
|
||
<el-button size="small" @click="addEle('customer_qr')" v-if="poster_type==30">企业成员二维码</el-button>
|
||
<el-button type="text" icon="iconfont icon-ht_operation_delete" @click="delEle" title="删除当前元素" style="color:#F56C6C"></el-button>
|
||
</el-form-item>
|
||
<!-- 昵称设置项、邀请码、会员ID -->
|
||
<div v-if="choosed_obj.type=='nickname' || choosed_obj.type=='invite' || choosed_obj.type=='mid'">
|
||
<el-form-item label="文字颜色" prop="">
|
||
<el-color-picker v-model="choosed_obj.color" style="display:inline-block"></el-color-picker>
|
||
</el-form-item>
|
||
<el-form-item label="文字大小" prop="">
|
||
<el-input v-model="choosed_obj.size" style="width:200px">
|
||
<template slot="append">PX</template>
|
||
</el-input>
|
||
</el-form-item>
|
||
</div>
|
||
<!-- 图片设置项 -->
|
||
<div v-if="choosed_obj.type=='img'">
|
||
<el-form-item label="图片设置" prop="">
|
||
<div class="upload-box" @click="openUpload('src',2)" v-if="!choosed_obj.src_url">
|
||
<i class="el-icon-plus" style="font-size:32px"></i>
|
||
</div>
|
||
<div @click="openUpload('src',2)" class="upload-boxed" v-if="choosed_obj.src_url" style="height:150px">
|
||
<img :src="choosed_obj.src_url" alt="" style="width:150px;height:150px;border-radius: 5px;cursor: pointer;">
|
||
<i class="el-icon-close" @click.stop="clearImg('src',2)" title="点击清除图片"></i>
|
||
<div class="upload-boxed-text">点击重新上传</div>
|
||
</div>
|
||
</el-form-item>
|
||
</div>
|
||
<!-- 小程序二维码设置项 -->
|
||
<div v-if="choosed_obj.type=='qr'&&poster_type==2">
|
||
<el-form-item label="小程序二维码链接跳转" prop="">
|
||
<el-input v-model="choosed_obj.mini_link" style="width:300px;"></el-input>
|
||
<el-button @click="showLink('mini','mini_link',2)">选择链接</el-button>
|
||
<div class="tip">默认跳转小程序首页</div>
|
||
</el-form-item>
|
||
</div>
|
||
<!-- H5二维码设置项 -->
|
||
<div v-if="choosed_obj.type=='qr'&&poster_type==5">
|
||
<el-form-item label="二维码链接跳转" prop="">
|
||
<el-input v-model="choosed_obj.h5_link" style="width:300px;"></el-input>
|
||
<el-button @click="showLink('link','h5_link',5)">选择链接</el-button>
|
||
<div class="tip">默认跳转商城首页</div>
|
||
</el-form-item>
|
||
</div>
|
||
<!-- 公众号关注二维码设置项 -->
|
||
<div v-if="choosed_obj.type=='shopqr'&&poster_type==1">
|
||
<el-form-item label="二维码链接跳转" prop="">
|
||
<el-input v-model="choosed_obj.h5_link" style="width:300px;"></el-input>
|
||
<el-button @click="showLink('link','h5_link',5)">选择链接</el-button>
|
||
<div class="tip">默认跳转商城首页</div>
|
||
</el-form-item>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<el-form-item label="" prop="wait_reminder" v-if="poster_type==1">
|
||
<template slot="label">
|
||
<div style="line-height:30px">用户生成海报时等待文字</div>
|
||
<div style="line-height:30px">（微信公众号关键词回复）</div>
|
||
</template>
|
||
<el-input v-model="form.wait_reminder" rows="5" type="textarea" style="width:70%;" ref="wait_reminder" placeholder="默认：您的专属海报正在拼命生成中，请稍等片刻...">
|
||
</el-input>
|
||
<div>
|
||
<el-button size="mini" @click="addContent('nickname','wait_reminder')" ref="nickname">会员昵称</el-button>
|
||
<el-button size="mini" @click="addLink('link','wait_reminder')">链接</el-button>
|
||
</div>
|
||
</el-form-item>
|
||
<el-form-item label="" prop="disable_reminder" v-if="poster_type==1">
|
||
<template slot="label">
|
||
<div style="line-height:30px">海报禁用时回复文字</div>
|
||
<div style="line-height:30px">（微信公众号关键词回复）</div>
|
||
</template>
|
||
<el-input v-model="form.disable_reminder" rows="5" type="textarea" style="width:70%;" ref="disable_reminder" placeholder="默认：该海报已经失效，请尝试其他海报">
|
||
</el-input>
|
||
<div>
|
||
<el-button size="mini" @click="addContent('nickname','disable_reminder')" ref="nickname">会员昵称</el-button>
|
||
<el-button size="mini" @click="addLink('link','disable_reminder')">链接</el-button>
|
||
</div>
|
||
</el-form-item>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- 权限设置 -->
|
||
<div v-show="order_type==2">
|
||
<div class="vue-main">
|
||
<div class="vue-main-title">
|
||
<div class="vue-main-title-left"></div>
|
||
<div class="vue-main-title-content">基础设置</div>
|
||
</div>
|
||
<div class="vue-main-form">
|
||
<el-form-item label="开放权限" prop="is_open">
|
||
<el-radio v-model="form.is_open" :label="0">不允许</el-radio>
|
||
<el-radio v-model="form.is_open" :label="1">允许</el-radio>
|
||
<div class="tip">是否允许没有发展下线资格的用户生成自己的海报</div>
|
||
<div class="tip"><span style="color:#f00">*</span>由于每个公众号的永久二维码数量有限，建议不要开放权限</div>
|
||
</el-form-item>
|
||
<el-form-item label="未开放权限时的提示" prop="not_open_reminder">
|
||
<el-input v-model="form.not_open_reminder" style="width:70%;" ref="not_open_reminder" placeholder="默认：您还没有发展下线的资格，努力去拥有资格，获得您的专属海报吧！"></el-input>
|
||
<div>
|
||
<el-button size="mini" @click="addContent('nickname','not_open_reminder','input')" ref="nickname">会员昵称</el-button>
|
||
</div>
|
||
</el-form-item>
|
||
<el-form-item label="未开放权限时的说明链接" prop="not_open_reminder_url">
|
||
<el-input v-model="form.not_open_reminder_url" style="width:70%;"></el-input>
|
||
</el-form-item>
|
||
</div>
|
||
</div>
|
||
|
||
</div>
|
||
<!-- 推送设置 -->
|
||
<div v-show="order_type==3" v-if="poster_type==1">
|
||
<div class="vue-main">
|
||
<div class="vue-main-title">
|
||
<div class="vue-main-title-left"></div>
|
||
<div class="vue-main-title-content">基础设置</div>
|
||
</div>
|
||
<div class="vue-main-form">
|
||
<el-form-item label="海报推送" prop="response_status">
|
||
<el-switch v-model="form.response_status" :active-value="1" :inactive-value="0"></el-switch>
|
||
<div class="tip">提示：开启后，如果关注的会员有权限或者权限设置开放权限设置为允许，当用户扫海报关注公众号状态下则自动推送该会员专属海报！</div>
|
||
</el-form-item>
|
||
<hr>
|
||
<el-form-item label="推送类型" prop="response_type">
|
||
<el-radio v-model="form.response_type" :label="0">图文推送</el-radio>
|
||
<el-radio v-model="form.response_type" :label="1">文本推送</el-radio>
|
||
</el-form-item>
|
||
<!-- 图文 -->
|
||
<div v-if="!form.response_type">
|
||
<el-form-item label="推送标题" prop="response_title">
|
||
<el-input v-model="form.response_title" style="width:70%;" placeholder="如果这里设置为空，则用户扫码推荐者的海报二维码后，系统不推荐内容"></el-input>
|
||
</el-form-item>
|
||
<el-form-item label="推送封面" prop="response_thumb">
|
||
<div class="upload-box" @click="openUpload('response_thumb')" v-if="!form.response_thumb_url">
|
||
<i class="el-icon-plus" style="font-size:32px"></i>
|
||
</div>
|
||
<div @click="openUpload('response_thumb')" class="upload-boxed" v-if="form.response_thumb_url" style="height:150px">
|
||
<img :src="form.response_thumb_url" alt="" style="width:150px;height:150px;border-radius: 5px;cursor: pointer;">
|
||
<i class="el-icon-close" @click.stop="clearImg('response_thumb')" title="点击清除图片"></i>
|
||
<div class="upload-boxed-text">点击重新上传</div>
|
||
</div>
|
||
</el-form-item>
|
||
<el-form-item label="推送描述" prop="response_desc">
|
||
<el-input type="textarea" rows="5" v-model="form.response_desc" style="width:70%;"></el-input>
|
||
</el-form-item>
|
||
<el-form-item label="推送链接" prop="response_url">
|
||
<el-input v-model="form.response_url" style="width:70%;" placeholder="默认为商城首页链接"></el-input>
|
||
</el-form-item>
|
||
</div>
|
||
<!-- 文本 -->
|
||
<div v-if="form.response_type">
|
||
<el-form-item label="推送消息" prop="response_text">
|
||
<el-input type="textarea" rows="5" v-model="form.response_text" ref="response_text" style="width:70%;"></el-input>
|
||
<div>
|
||
<el-button size="mini" @click="addContent('nickname','response_text')">会员昵称</el-button>
|
||
<el-button size="mini" @click="addLink('link','response_text')">链接</el-button>
|
||
<el-button size="mini" @click="addContent('shopname','response_text')">商城名称</el-button>
|
||
<el-button size="mini" @click="addContent('credit','response_text')">积分数量</el-button>
|
||
<el-button size="mini" @click="addContent('bonus','response_text')">现金金额</el-button>
|
||
<el-button size="mini" @click="addContent('coupon_name','response_text')">优惠券名称</el-button>
|
||
<el-button size="mini" @click="addContent('coupon_num','response_text')">优惠券张数</el-button>
|
||
<el-popover placement="right" width="300">
|
||
<div style="margin:10px 0;line-height:24px;font-weight: 500;">
|
||
<div>你好，[用户昵称]</div>
|
||
<div>感谢您关注[商城名称]</div>
|
||
<div>分享下方海报，邀请好友关注：</div>
|
||
<div>[积分数量]个[[shop_credit1]]，[现金金额]元，[优惠券名称][优惠券张数]张的奖励！</div>
|
||
<div>快去分享你的专属海报↓↓↓</div>
|
||
|
||
</div>
|
||
<el-button size="mini" type="text" slot="reference" icon="el-icon-info">查看示例</el-button>
|
||
</el-popover>
|
||
</div>
|
||
</el-form-item>
|
||
</div>
|
||
|
||
</div>
|
||
</div>
|
||
|
||
</div>
|
||
<!-- 奖励设置 -->
|
||
<div v-show="order_type==4">
|
||
<div class="vue-main">
|
||
<div class="vue-main-title">
|
||
<div class="vue-main-title-left"></div>
|
||
<div class="vue-main-title-content">基础设置</div>
|
||
</div>
|
||
<div class="vue-main-form">
|
||
<el-form-item label="推荐者奖励" prop="">
|
||
</el-form-item>
|
||
<el-form-item :label="shop_credit1" prop="recommender_credit">
|
||
<el-input v-model="form.recommender_credit" style="width:70%;"></el-input>
|
||
</el-form-item>
|
||
<el-form-item label="现金" prop="recommender_bonus">
|
||
<el-input v-model="form.recommender_bonus" style="width:70%;"></el-input>
|
||
</el-form-item>
|
||
<el-form-item label="优惠券" prop="">
|
||
<el-input :value="coupon_word1" style="width:calc(70% - 180px)" disabled></el-input>
|
||
<!-- recommender_coupon_id+recommender_coupon_name -->
|
||
<el-button type="primary" @click="openCoupon('1')">选择优惠券</el-button>
|
||
<el-button type="text" style="color:#F56C6C" @click="clearCoupon('1')">清除选择</el-button>
|
||
</el-form-item>
|
||
<el-form-item label="优惠券张数" prop="recommender_coupon_num">
|
||
<el-input v-model="form.recommender_coupon_num" style="width:70%;"></el-input>
|
||
</el-form-item>
|
||
|
||
<el-form-item label="关注者奖励" prop="">
|
||
</el-form-item>
|
||
<el-form-item :label="shop_credit1" prop="subscriber_credit">
|
||
<el-input v-model="form.subscriber_credit" style="width:70%;"></el-input>
|
||
</el-form-item>
|
||
<el-form-item label="现金" prop="subscriber_bonus">
|
||
<el-input v-model="form.subscriber_bonus" style="width:70%;"></el-input>
|
||
</el-form-item>
|
||
<!-- subscriber_coupon_id+subscriber_coupon_name -->
|
||
<el-form-item label="优惠券" prop="subscriber_coupon_name">
|
||
<el-input :value="coupon_word2" style="width:calc(70% - 180px)" disabled></el-input>
|
||
<el-button type="primary" @click="openCoupon('2')">选择优惠券</el-button>
|
||
<el-button type="text" style="color:#F56C6C" @click="clearCoupon('2')">清除选择</el-button>
|
||
</el-form-item>
|
||
<el-form-item label="优惠券张数" prop="subscriber_coupon_num">
|
||
<el-input v-model="form.subscriber_coupon_num" style="width:70%;"></el-input>
|
||
</el-form-item>
|
||
|
||
<el-form-item label="奖励现金方式" prop="bonus_method">
|
||
<el-radio v-model="form.bonus_method" :label="1">余额</el-radio>
|
||
<el-radio v-model="form.bonus_method" :label="2">微信钱包</el-radio>
|
||
<div class="tip">如果奖励现金，可以选择打款到用户余额或者是微信钱包（微信钱包需要开通微信支付,并在后台上传证书）</div>
|
||
</el-form-item>
|
||
</div>
|
||
</div>
|
||
|
||
</div>
|
||
<!-- 奖励设置 -->
|
||
<div v-show="order_type==5" v-if="poster_type==1">
|
||
<div class="vue-main">
|
||
<div class="vue-main-title">
|
||
<div class="vue-main-title-left"></div>
|
||
<div class="vue-main-title-content">基础设置</div>
|
||
</div>
|
||
<div class="vue-main-form">
|
||
<el-form-item label="推荐者的奖励通知-内容" prop="recommender_award_notice">
|
||
<el-input type="textarea" rows="5" v-model="form.recommender_award_notice" ref="recommender_award_notice" style="width:70%;"></el-input>
|
||
<div>
|
||
<el-button size="mini" @click="addContent('s_nickname','recommender_award_notice')">扫码者昵称</el-button>
|
||
<el-button size="mini" @click="addContent('credit','recommender_award_notice')">积分数量</el-button>
|
||
<el-button size="mini" @click="addContent('bonus','recommender_award_notice')">现金金额</el-button>
|
||
<el-button size="mini" @click="addContent('coupon_name','recommender_award_notice')">优惠券名称</el-button>
|
||
<el-button size="mini" @click="addContent('coupon_num','recommender_award_notice')">优惠券张数</el-button>
|
||
<el-popover placement="right" width="300">
|
||
<div style="margin:10px 0;line-height:24px;font-weight: 500;">
|
||
<div>[扫码者昵称]通过您的二维码关注公众号，恭喜您可获得[积分数量]个积分，[现金金额]元，[优惠券名称][优惠券张数]张的奖励！</div>
|
||
<div>继续加油哟！</div>
|
||
</div>
|
||
<el-button size="mini" type="text" slot="reference" icon="el-icon-info">查看示例</el-button>
|
||
</el-popover>
|
||
</div>
|
||
</el-form-item>
|
||
<el-form-item label="关注者的奖励通知-内容" prop="subscriber_award_notice">
|
||
<el-input type="textarea" rows="5" v-model="form.subscriber_award_notice" ref="subscriber_award_notice" style="width:70%;"></el-input>
|
||
<div>
|
||
<el-button size="mini" @click="addContent('t_nickname','subscriber_award_notice')">推荐者昵称</el-button>
|
||
<el-button size="mini" @click="addContent('credit','subscriber_award_notice')">积分数量</el-button>
|
||
<el-button size="mini" @click="addContent('bonus','subscriber_award_notice')">现金金额</el-button>
|
||
<el-button size="mini" @click="addContent('coupon_name','subscriber_award_notice')">优惠券名称</el-button>
|
||
<el-button size="mini" @click="addContent('coupon_num','subscriber_award_notice')">优惠券张数</el-button>
|
||
<el-popover placement="right" width="300">
|
||
<div style="margin:10px 0;line-height:24px;font-weight: 500;">
|
||
<div>恭喜您通过扫[推荐者昵称]的二维码关注公众号，可获得[积分数量]个积分，[现金金额]元，[优惠券名称][优惠券张数]张的奖励！</div>
|
||
<div>分享可获得更多奖励哟！</div>
|
||
</div>
|
||
<el-button size="mini" type="text" slot="reference" icon="el-icon-info">查看示例</el-button>
|
||
</el-popover>
|
||
</div>
|
||
</el-form-item>
|
||
|
||
</div>
|
||
</div>
|
||
|
||
</div>
|
||
<!-- 分销设置 -->
|
||
<div v-show="order_type==6" v-if="poster_type==1">
|
||
<div class="vue-main">
|
||
<div class="vue-main-title">
|
||
<div class="vue-main-title-left"></div>
|
||
<div class="vue-main-title-content">基础设置</div>
|
||
</div>
|
||
<div class="vue-main-form">
|
||
<el-form-item label="扫码关注成为下线" prop="auto_sub">
|
||
<el-radio v-model="form.auto_sub" :label="1">是</el-radio>
|
||
<el-radio v-model="form.auto_sub" :label="0">否</el-radio>
|
||
<div class="tip">如果扫码用户之前不存在分销关系，那么扫码关注后直接成为推荐人的下线</div>
|
||
</el-form-item>
|
||
</div>
|
||
</div>
|
||
|
||
</div>
|
||
<!-- 海报中心 -->
|
||
<div v-show="order_type==7">
|
||
<div class="vue-main">
|
||
<div class="vue-main-title">
|
||
<div class="vue-main-title-left"></div>
|
||
<div class="vue-main-title-content">基础设置</div>
|
||
</div>
|
||
<div class="vue-main-form">
|
||
<el-form-item label="是否在海报中心显示">
|
||
<el-switch v-model="form.is_show_center" :active-value="1" :inactive-value="0"></el-switch>
|
||
</el-form-item>
|
||
<el-form-item label="海报中心效果图显示">
|
||
<el-radio v-model="form.design_img_show" :label="0">背景图</el-radio>
|
||
<el-radio v-model="form.design_img_show" :label="1">自定义图片</el-radio>
|
||
</el-form-item>
|
||
<el-form-item v-if="form.design_img_show==1">
|
||
<div v-if="!form.design_img_url">
|
||
<div class="upload-box" @click="openUpload('design_img')">
|
||
<i class="el-icon-plus" style="font-size:32px"></i>
|
||
</div>
|
||
<div class="tip">建议尺寸：640*1008</div>
|
||
</div>
|
||
<div @click="openUpload('design_img')" class="upload-boxed" v-if="form.design_img_url" style="height:150px">
|
||
<img :src="form.design_img_url" alt="" style="width:150px;height:150px;border-radius: 5px;cursor: pointer;">
|
||
<i class="el-icon-close" @click.stop="clearImg('design_img')" title="点击清除图片"></i>
|
||
<div class="upload-boxed-text">点击重新上传</div>
|
||
<div class="tip">建议尺寸：640*1008</div>
|
||
</div>
|
||
</el-form-item>
|
||
</div>
|
||
</div>
|
||
|
||
</div>
|
||
|
||
</el-form>
|
||
<!-- 分页 -->
|
||
<div class="vue-page">
|
||
<div class="vue-center">
|
||
<el-button type="primary" @click="submitForm('form')">提交</el-button>
|
||
<el-button @click="goBack">返回</el-button>
|
||
</div>
|
||
</div>
|
||
<!-- 选择优惠券 -->
|
||
<el-dialog :visible.sync="coupon_show" width="850px" center title="选择优惠券">
|
||
<div>
|
||
<el-input v-model="coupon_word" style="width:70%"></el-input>
|
||
<el-button @click="searchCoupon" type="primary">搜索</el-button>
|
||
</div>
|
||
<el-table :data="coupon_list" style="width: 100%;height:500px;overflow:auto" id="goods-list">
|
||
|
||
<el-table-column label="ID" prop="id" align="center" width="150px"></el-table-column>
|
||
<el-table-column label="优惠券">
|
||
<template slot-scope="scope">
|
||
<div>
|
||
<div style="color:#333;font-weight:500">[[scope.row.name]]</div>
|
||
</template>
|
||
</el-table-column>
|
||
<el-table-column label="选择" prop="id" align="center" width="150px">
|
||
<template slot-scope="scope">
|
||
<el-button size="small" @click="chooseCoupon(scope.row)">选择</el-button>
|
||
</template>
|
||
</el-table-column>
|
||
</el-table>
|
||
<el-row>
|
||
<el-col align="right">
|
||
<el-pagination layout="prev, pager, next,jumper" @current-change="searchCoupon" :total="coupon_total"
|
||
:page-size="coupon_per_page" :current-page="coupon_current_page" background
|
||
></el-pagination>
|
||
</el-col>
|
||
</el-row>
|
||
|
||
<span slot="footer" class="dialog-footer">
|
||
<el-button @click="coupon_show = false">取 消</el-button>
|
||
</span>
|
||
</el-dialog>
|
||
<el-dialog :visible.sync="link_show" width="850px" center title="插入链接">
|
||
<el-form ref="link_form" :model="link_form" label-width="15%">
|
||
<el-form-item label="链接标题" prop="title">
|
||
<el-input v-model="link_form.title" style="width:70%;" placeholder="请输入链接显示的文字"></el-input>
|
||
</el-form-item>
|
||
<el-form-item label="链接地址" prop="content">
|
||
<el-input v-model="link_form.content" style="width:70%;" placeholder="以https://开头"></el-input>
|
||
</el-form-item>
|
||
</el-form>
|
||
|
||
<span slot="footer" class="dialog-footer">
|
||
<el-button type="primary" @click="sureAddLink">确 定</el-button>
|
||
<el-button @click="link_show = false">取 消</el-button>
|
||
</span>
|
||
</el-dialog>
|
||
<upload-img :upload-show="uploadShow" :name="chooseImgName" @replace="changeProp" @sure="sureImg"></upload-img>
|
||
<pop :show="show" @replace="changeLink" @add="parHref"></pop>
|
||
<program :pro="pro" @replacepro="changeprogram" @addpro="parpro"></program>
|
||
<introduce v-model="showIntroduce" v-show="showIntroduce"></introduce>
|
||
</div>
|
||
</div>
|
||
@include('public.admin.uploadImg')
|
||
@include('public.admin.vueDragResize')
|
||
@include('public.admin.pop')
|
||
@include('public.admin.program')
|
||
@include('public.admin.new-poster-introduce')
|
||
<script>
|
||
const CktUrl = "{!! $ckt_url !!}"; //* 创客贴url
|
||
const IsDecorate = "{!! $is_decorate !!}";
|
||
</script>
|
||
|
||
<script>
|
||
const qr_url = `{!! resource_get('plugins/new-poster/assets/img/qr.png') !!}`;
|
||
const head_url = `{!! resource_get('plugins/new-poster/assets/img/head.jpg') !!}`;
|
||
const thumb_url = `{!! resource_get('plugins/new-poster/assets/img/img.jpg') !!}`;
|
||
const app_qr_url = `{!! resource_get('plugins/new-poster/assets/img/qr_app_share.jpg') !!}`;
|
||
const qr_shop = `{!! resource_get('plugins/new-poster/assets/img/qr_shop.jpg') !!}`;
|
||
const invite = `{!! resource_get('plugins/new-poster/assets/img/qr_shop.jpg') !!}`;
|
||
let data = {!! json_encode($data)?:'[]' !!};
|
||
let poster = {!! json_encode($poster)?:'{}' !!};
|
||
let shop_credit1 = {!! json_encode($shop_credit1)?:' ' !!};
|
||
let is_copy = {!! $is_copy?:0 !!};
|
||
let id = 0;
|
||
let supplement = {};
|
||
if(data==null) {
|
||
data = [];
|
||
}
|
||
if(poster==null) {
|
||
poster = {};
|
||
}
|
||
else{
|
||
if(poster.supplement && poster.supplement!=null) {
|
||
supplement = poster.supplement;
|
||
}
|
||
id = poster.id;
|
||
}
|
||
if(shop_credit1==null) {
|
||
shop_credit1 = "";
|
||
}
|
||
var app = new Vue({
|
||
el:"#app",
|
||
delimiters: ['[[', ']]'],
|
||
name: 'test',
|
||
data() {
|
||
return{
|
||
showIntroduce:false,
|
||
id:id,
|
||
poster_type:1,
|
||
label_word:"",
|
||
label_show:false,
|
||
history_show:false,
|
||
label_list:[],
|
||
label_total:0,
|
||
label_per_page:0,
|
||
label_current_page:0,
|
||
|
||
shop_credit1:shop_credit1,//积分字样
|
||
|
||
show:false,//是否开启公众号弹窗
|
||
pro:false ,//是否开启小程序弹窗
|
||
chooseLink:'',
|
||
chooseMiniLink:'',
|
||
link_type:1,
|
||
|
||
coupon_word:"",
|
||
coupon_show:false,
|
||
coupon_list:[],
|
||
coupon_total:0,
|
||
coupon_per_page:0,
|
||
coupon_current_page:0,
|
||
|
||
coupon_type:0,
|
||
|
||
rects:[],
|
||
data:data,
|
||
zIndex:0,//全局层次
|
||
choosed_obj:{},
|
||
choosed_index:-1,
|
||
qr_url :qr_url,
|
||
head_url :head_url,
|
||
thumb_url:thumb_url,
|
||
app_qr_url:app_qr_url,
|
||
qr_shop:qr_shop,
|
||
invite:invite,
|
||
listWidth:"",
|
||
listHeight:"",
|
||
color1:'1',
|
||
order_type:1,
|
||
|
||
link_show:false,
|
||
link_ref : "",
|
||
link_form:{
|
||
|
||
},
|
||
|
||
form:{
|
||
// poster
|
||
title:poster.title || "",
|
||
keyword:poster.keyword || "",
|
||
status:poster.status || 0,
|
||
center_show:poster.center_show&&poster.center_show.length>=0?poster.center_show:[],//会员中心显示
|
||
app_share_show:poster.app_share_show || 0,
|
||
is_ago:poster.is_ago || 0,
|
||
background:poster.background || "",
|
||
background_url:poster.background_url || "",
|
||
is_open:poster.is_open || 0,
|
||
response_status:poster.response_status || 0,//推送状态
|
||
response_type:poster.response_type || 0,
|
||
response_title:poster.response_title || "",//推送
|
||
response_thumb:poster.response_thumb || "",
|
||
response_thumb_url:poster.response_thumb_url || "",
|
||
response_text:poster.response_text || "",
|
||
label:(poster.label&&poster.label!=null)?poster.label.name:"",
|
||
label_id:poster.label_id || "",
|
||
response_desc:poster.response_desc || "",
|
||
response_url:poster.response_url || "",
|
||
auto_sub:poster.auto_sub == 0 ?0: 1,//扫码关注成为下线
|
||
// poster_supplement
|
||
wait_reminder:supplement.wait_reminder || "",
|
||
disable_reminder:supplement.disable_reminder || "",
|
||
not_open_reminder:supplement.not_open_reminder || "",
|
||
not_open_reminder_url:supplement.not_open_reminder_url || "",
|
||
recommender_credit:supplement.recommender_credit || "",//奖励
|
||
recommender_bonus:supplement.recommender_bonus || "",
|
||
recommender_coupon_id:supplement.recommender_coupon_id || "",
|
||
recommender_coupon_name:supplement.recommender_coupon_name || "",
|
||
recommender_coupon_num:supplement.recommender_coupon_num || "",
|
||
subscriber_credit:supplement.subscriber_credit || "",
|
||
subscriber_bonus:supplement.subscriber_bonus || "",
|
||
subscriber_coupon_id:supplement.subscriber_coupon_id || "",
|
||
subscriber_coupon_name:supplement.subscriber_coupon_name || "",
|
||
subscriber_coupon_num:supplement.subscriber_coupon_num || "",
|
||
bonus_method:supplement.bonus_method || 1,//奖励现金方式
|
||
recommender_award_title:supplement.recommender_award_title || "",// 通知
|
||
recommender_award_notice:supplement.recommender_award_notice || "",
|
||
subscriber_award_title:supplement.subscriber_award_title || "",
|
||
subscriber_award_notice:supplement.subscriber_award_notice || "",
|
||
is_show_center: poster.is_show_center==0?0: 1,
|
||
design_img_show: poster.design_img_show==1?1:0,
|
||
design_img: poster.design_img || '',
|
||
design_img_url: poster.design_img_url || '',
|
||
},
|
||
|
||
coupon_word1:"",
|
||
coupon_word2:"",
|
||
|
||
uploadShow:false,
|
||
chooseImgName:'',
|
||
img_type:"",
|
||
submit_url:'',
|
||
showVisible:false,
|
||
|
||
loading: false,
|
||
rules:{
|
||
keyword:{ required: true, message: '请输入关键字'}
|
||
},
|
||
isDecorate:IsDecorate,
|
||
is_copy:is_copy,
|
||
}
|
||
},
|
||
computed: {
|
||
formResponseStatus() {
|
||
return this.form.response_status;
|
||
},
|
||
formResponseType() {
|
||
return this.form.response_type;
|
||
}
|
||
},
|
||
created() {
|
||
|
||
},
|
||
mounted() {
|
||
if(this.id) {
|
||
this.submit_url = '{!! yzWebFullUrl('plugin.new-poster.admin.poster.edit') !!}'
|
||
if(this.form.recommender_coupon_id) {
|
||
this.coupon_word1 = `【ID:】`+this.form.recommender_coupon_id+``+this.form.recommender_coupon_name;
|
||
}
|
||
if(this.form.subscriber_coupon_id) {
|
||
this.coupon_word2 = `【ID:】`+this.form.subscriber_coupon_id+``+this.form.subscriber_coupon_name;
|
||
}
|
||
}
|
||
else {
|
||
this.submit_url = '{!! yzWebFullUrl('plugin.new-poster.admin.poster.add') !!}'
|
||
}
|
||
this.poster_type = this.getParam('poster_type');
|
||
this.setPosterView(this.data);
|
||
|
||
},
|
||
methods: {
|
||
setPosterView(data) {
|
||
data.forEach((item,index) => {
|
||
let width = parseInt(item.width);
|
||
let height = parseInt(item.height);
|
||
let top = parseInt(item.top);
|
||
let left =parseInt(item.left);
|
||
if(item.type=='head') {
|
||
this.rects.push(
|
||
{zIndex:this.zIndex+1,type:item.type,width:width,height:width,left:left,top:top,axis:"both",active:false,minw:40,minh:40,draggable:true,resizable:true,parentLim:true,aspectRatio:true,class:""}
|
||
)
|
||
}
|
||
else if(item.type=='invite') {
|
||
let size = parseInt(item.size);
|
||
this.rects.push(
|
||
{zIndex:this.zIndex+1,type:item.type,color:item.color,size:size,width:width,height:height,left:left,top:top,axis:"both",active:false,minw:100,minh:20,draggable:true,resizable:true,parentLim:false,aspectRatio:false,class:""}
|
||
)
|
||
}
|
||
else if(item.type=='mid') {
|
||
let size = Number(item.size.split('p')[0]);
|
||
this.rects.push(
|
||
{zIndex:this.zIndex+1,type:item.type,color:item.color,size:size,width:width,height:height,left:left,top:top,axis:"both",active:false,minw:40,minh:40,draggable:true,resizable:true,parentLim:true,aspectRatio:false,class:""}
|
||
)
|
||
}
|
||
else if(item.type=="nickname") {
|
||
let size = Number(item.size.split('p')[0]);
|
||
this.rects.push(
|
||
{zIndex:this.zIndex+1,type:item.type,color:item.color,size:size,width:width,height:height,left:left,top:top,axis:"both",active:false,minw:40,minh:40,draggable:true,resizable:true,parentLim:true,aspectRatio:false,class:""}
|
||
)
|
||
}
|
||
else if(item.type=="img") {
|
||
this.rects.push(
|
||
{zIndex:this.zIndex+1,type:item.type,src:item.src,src_url:item.src_url,width:width,height:height,left:left,top:top,axis:"both",active:false,minw:40,minh:40,draggable:true,resizable:true,parentLim:true,aspectRatio:false,class:""}
|
||
)
|
||
}
|
||
else if(item.type=='qr') {
|
||
if(this.poster_type==1 || this.poster_type==7 || this.poster_type==16) {
|
||
this.rects.push(
|
||
{zIndex:this.zIndex+1,type:item.type,width:width,height:width,left:left,top:top,axis:"both",active:false,minw:40,minh:40,draggable:true,resizable:true,parentLim:true,aspectRatio:true,class:""}
|
||
)
|
||
}
|
||
else if(this.poster_type==2) {
|
||
this.rects.push(
|
||
{zIndex:this.zIndex+1,type:item.type,mini_link:item.mini_link,width:width,height:width,left:left,top:top,axis:"both",active:false,minw:40,minh:40,draggable:true,resizable:true,parentLim:true,aspectRatio:true,class:""}
|
||
)
|
||
}
|
||
else if(this.poster_type==5) {
|
||
this.rects.push(
|
||
{zIndex:this.zIndex+1,type:item.type,h5_link:item.h5_link,width:width,height:width,left:left,top:top,axis:"both",active:false,minw:40,minh:40,draggable:true,resizable:true,parentLim:true,aspectRatio:true,class:""}
|
||
)
|
||
}
|
||
}
|
||
else if(item.type=='shopqr') {
|
||
this.rects.push(
|
||
{zIndex:this.zIndex+1,type:item.type,h5_link:item.h5_link,width:width,height:width,left:left,top:top,axis:"both",active:false,minw:40,minh:40,draggable:true,resizable:true,parentLim:true,aspectRatio:true,class:""}
|
||
)
|
||
}
|
||
else if(item.type=="customer_activity") {
|
||
let size = Number(item.size.split('p')[0]);
|
||
this.rects.push(
|
||
{zIndex:this.zIndex+1,type:item.type,color:item.color,size:size,width:width,height:height,left:left,top:top,axis:"both",active:false,minw:40,minh:40,draggable:true,resizable:true,parentLim:true,aspectRatio:false,class:""}
|
||
)
|
||
}
|
||
else if(item.type=='customer_qr') {
|
||
if(this.poster_type==30) {
|
||
this.rects.push(
|
||
{zIndex:this.zIndex+1,type:item.type,width:width,height:width,left:left,top:top,axis:"both",active:false,minw:40,minh:40,draggable:true,resizable:true,parentLim:true,aspectRatio:true,class:""}
|
||
)
|
||
}
|
||
}
|
||
this.zIndex++;
|
||
})
|
||
},
|
||
getLabel() {
|
||
let url = '{!! yzWebFullUrl('plugin.new-poster.admin.poster.getLabelList') !!}';
|
||
if(this.label_word) {
|
||
url = '{!! yzWebFullUrl('plugin.new-poster.admin.poster.searchLabel') !!}';
|
||
}
|
||
let loading = this.$loading({target:document.querySelector(".label-history"),background: 'rgba(0, 0, 0, 0)'});
|
||
this.$http.post(url,{label_kwd:this.label_word}).then(function (response) {
|
||
if (response.data.result){
|
||
this.label_list = response.data.data.list.data;
|
||
this.label_total = response.data.data.list.total;
|
||
this.label_per_page = response.data.data.list.per_page;
|
||
this.label_current_page = response.data.data.list.current_page;
|
||
}
|
||
else {
|
||
this.$message({message: response.data.msg,type: 'error'});
|
||
}
|
||
loading.close();
|
||
},function (response) {
|
||
this.$message({message: response.data.msg,type: 'error'});
|
||
loading.close();
|
||
}
|
||
);
|
||
},
|
||
|
||
sureAddLabel() {
|
||
if(this.label_word == "") {
|
||
this.$message.error("请输入标签")
|
||
return;
|
||
}
|
||
this.$http.post('{!! yzWebFullUrl('plugin.new-poster.admin.poster.addLabel') !!}',{label:{name:this.label_word}}).then(response => {
|
||
if (response.data.result) {
|
||
this.$message({type: 'success',message: '操作成功!'});
|
||
this.form.label = this.label_word;
|
||
this.form.label_id = response.data.data.label.id;
|
||
this.label_word = "";
|
||
this.label_show = false;
|
||
} else {
|
||
this.$message({message: response.data.msg,type: 'error'});
|
||
}
|
||
},response => {
|
||
});
|
||
},
|
||
handleClose() {
|
||
this.form.label = "";
|
||
},
|
||
chooseLabel(item) {
|
||
this.history_show = false;
|
||
this.form.label = item.name;
|
||
this.form.label_id = item.id;
|
||
|
||
},
|
||
|
||
submitForm(formName) {
|
||
console.log('提交')
|
||
let that = this;
|
||
let json = {
|
||
poster:{
|
||
poster_type:this.poster_type,
|
||
title:this.form.title,
|
||
keyword:this.form.keyword,
|
||
status:this.form.status,
|
||
label_id:this.form.label_id,
|
||
center_show:this.form.center_show,
|
||
app_share_show:this.form.app_share_show,
|
||
is_ago:this.form.is_ago,
|
||
is_open:this.form.is_open,
|
||
background:this.form.background,
|
||
response_status:this.form.response_status,
|
||
response_type:this.form.response_type,
|
||
response_title:this.form.response_title,
|
||
response_thumb:this.form.response_thumb,
|
||
response_thumb_url:this.form.response_thumb_url,
|
||
response_desc:this.form.response_desc,
|
||
response_url:this.form.response_url,
|
||
response_text:this.form.response_text,
|
||
auto_sub:this.form.auto_sub,
|
||
is_show_center:this.form.is_show_center,
|
||
design_img_show:this.form.design_img_show,
|
||
design_img:this.form.design_img,
|
||
},
|
||
poster_supplement:{
|
||
wait_reminder:this.form.wait_reminder,
|
||
disable_reminder:this.form.disable_reminder,
|
||
not_open_reminder:this.form.not_open_reminder,
|
||
not_open_reminder_url:this.form.not_open_reminder_url,
|
||
recommender_credit:this.form.recommender_credit,
|
||
recommender_bonus:this.form.recommender_bonus,
|
||
recommender_coupon_id:this.form.recommender_coupon_id,
|
||
recommender_coupon_name:this.form.recommender_coupon_name,
|
||
recommender_coupon_num:this.form.recommender_coupon_num,
|
||
subscriber_credit:this.form.subscriber_credit,
|
||
subscriber_bonus:this.form.subscriber_bonus,
|
||
subscriber_coupon_id:this.form.subscriber_coupon_id,
|
||
subscriber_coupon_name:this.form.subscriber_coupon_name,
|
||
subscriber_coupon_num:this.form.subscriber_coupon_num,
|
||
bonus_method:this.form.bonus_method,
|
||
recommender_award_title:this.form.recommender_award_title,
|
||
recommender_award_notice:this.form.recommender_award_notice,
|
||
subscriber_award_title:this.form.subscriber_award_title,
|
||
subscriber_award_notice:this.form.subscriber_award_notice,
|
||
},
|
||
data:[],
|
||
};
|
||
this.rects.forEach((item,index) => {
|
||
|
||
if(item.type=='nickname') {
|
||
json.data.push({width:item.width+'px',height:item.height+'px',top:item.top+'px',left:item.left+'px',type:item.type,size:item.size+'px',color:item.color})
|
||
}
|
||
else if(item.type=='invite') {
|
||
json.data.push({width:item.width+'px',height:item.height+'px',top:item.top+'px',left:item.left+'px',type:item.type,size:item.size+'px',color:item.color})
|
||
}
|
||
else if(item.type=='mid') {
|
||
json.data.push({width:item.width+'px',height:item.height+'px',top:item.top+'px',left:item.left+'px',type:item.type,size:item.size+'px',color:item.color})
|
||
}
|
||
else if(item.type=='head') {
|
||
json.data.push({width:item.width+'px',height:item.height+'px',top:item.top+'px',left:item.left+'px',type:item.type})
|
||
}
|
||
else if(item.type=='img') {
|
||
json.data.push({width:item.width+'px',height:item.height+'px',top:item.top+'px',left:item.left+'px',type:item.type,src:item.src,src_url:item.src_url})
|
||
}
|
||
else if(item.type=='shopqr') {
|
||
json.data.push({width:item.width+'px',height:item.height+'px',top:item.top+'px',left:item.left+'px',type:item.type,h5_link:item.h5_link})
|
||
}
|
||
|
||
else if(item.type=='qr') {
|
||
if(this.poster_type == 1 || this.poster_type == 7 || this.poster_type == 16) {
|
||
json.data.push({width:item.width+'px',height:item.height+'px',top:item.top+'px',left:item.left+'px',type:item.type})
|
||
}
|
||
else if(this.poster_type == 2) {
|
||
json.data.push({width:item.width+'px',height:item.height+'px',top:item.top+'px',left:item.left+'px',type:item.type,mini_link:item.mini_link})
|
||
}
|
||
else if(this.poster_type == 5) {
|
||
json.data.push({width:item.width+'px',height:item.height+'px',top:item.top+'px',left:item.left+'px',type:item.type,h5_link:item.h5_link})
|
||
}
|
||
}
|
||
if(item.type=='customer_activity') {
|
||
json.data.push({width:item.width+'px',height:item.height+'px',top:item.top+'px',left:item.left+'px',type:item.type,size:item.size+'px',color:item.color})
|
||
}
|
||
else if(item.type=='customer_qr') {
|
||
if(this.poster_type == 30) {
|
||
json.data.push({width:item.width+'px',height:item.height+'px',top:item.top+'px',left:item.left+'px',type:item.type})
|
||
}
|
||
}
|
||
});
|
||
let json1 = {
|
||
form_data : json,
|
||
}
|
||
if(this.id) {
|
||
json1.id = this.id
|
||
}
|
||
if(this.is_copy) {
|
||
json1.is_copy = this.is_copy;
|
||
}
|
||
console.log('123123123123', json1)
|
||
this.$refs[formName].validate((valid) => {
|
||
if (valid) {
|
||
let loading = this.$loading({target:document.querySelector(".content"),background: 'rgba(0, 0, 0, 0)'});
|
||
this.$http.post(this.submit_url, json1).then(response => {
|
||
if (response.data.result) {
|
||
this.$message({type: 'success',message: '操作成功!'});
|
||
this.goBack();
|
||
} else {
|
||
this.$message({message: response.data.msg,type: 'error'});
|
||
}
|
||
loading.close();
|
||
},response => {
|
||
loading.close();
|
||
});
|
||
}
|
||
else {
|
||
if(!this.form.keyword) {
|
||
this.$message.error('请输入关键字')
|
||
}
|
||
console.log('error submit!!');
|
||
return false;
|
||
}
|
||
});
|
||
},
|
||
|
||
goBack() {
|
||
history.go(-1)
|
||
},
|
||
|
||
|
||
openUpload(str,img_type) {
|
||
this.chooseImgName = str;
|
||
this.uploadShow = true;
|
||
this.img_type = img_type;
|
||
},
|
||
changeProp(val) {
|
||
if(val == true) {
|
||
this.uploadShow = false;
|
||
}
|
||
else {
|
||
this.uploadShow = true;
|
||
}
|
||
},
|
||
sureImg(name,image,image_url) {
|
||
if(this.img_type) {
|
||
this.rects[this.choosed_index][name] = image;
|
||
this.rects[this.choosed_index][name+'_url'] = image_url;
|
||
this.choosed_obj[name] = image;
|
||
this.choosed_obj[name+'_url'] = image_url;
|
||
this.$forceUpdate();
|
||
|
||
}
|
||
else {
|
||
this.form[name] = image;
|
||
this.form[name+'_url'] = image_url;
|
||
}
|
||
console.log(this.rects)
|
||
},
|
||
clearImg(str,type) {
|
||
|
||
if(type) {
|
||
this.rects[this.choosed_index][str] = "";
|
||
this.rects[this.choosed_index][str+'_url'] = "";
|
||
this.choosed_obj[str] = "";
|
||
this.choosed_obj[str+'_url'] = "";
|
||
}
|
||
else {
|
||
this.form[str] = "";
|
||
this.form[str+'_url'] = "";
|
||
}
|
||
this.$forceUpdate();
|
||
},
|
||
openCoupon(type) {
|
||
this.coupon_type = type;
|
||
this.coupon_show = true;
|
||
},
|
||
searchCoupon() {
|
||
|
||
this.$http.post('{!! yzWebFullUrl('plugin.new-poster.admin.poster.getCouponByWord') !!}',{coupon_kwd:this.coupon_word}).then(response => {
|
||
if (response.data.result) {
|
||
this.coupon_list = response.data.data.list.data;
|
||
this.coupon_total = response.data.data.list.total;
|
||
this.coupon_per_page = response.data.data.list.per_page;
|
||
this.coupon_current_page = response.data.data.list.current_page;
|
||
} else {
|
||
this.$message({message: response.data.msg,type: 'error'});
|
||
}
|
||
},response => {
|
||
});
|
||
},
|
||
chooseCoupon(row) {
|
||
if(this.coupon_type==1) {
|
||
this.form.recommender_coupon_id = row.id;
|
||
this.form.recommender_coupon_name = row.name;
|
||
this.coupon_word1 = `【ID:】`+this.form.recommender_coupon_id+``+this.form.recommender_coupon_name;
|
||
}
|
||
else if(this.coupon_type==2) {
|
||
this.form.subscriber_coupon_id = row.id;
|
||
this.form.subscriber_coupon_name = row.name;
|
||
this.coupon_word2 = `【ID:】`+this.form.subscriber_coupon_id+``+this.form.subscriber_coupon_name;
|
||
}
|
||
this.coupon_show = false;
|
||
console.log(this.form)
|
||
},
|
||
clearCoupon(type) {
|
||
if(type==1) {
|
||
this.form.recommender_coupon_id = "";
|
||
this.form.recommender_coupon_name = "";
|
||
this.coupon_word1 = "";
|
||
}
|
||
else if(type==2) {
|
||
this.form.subscriber_coupon_id = "";
|
||
this.form.subscriber_coupon_name = "";
|
||
this.coupon_word2 = "";
|
||
}
|
||
},
|
||
addEle(type) {
|
||
let is_true = false;
|
||
let choose_index = -1;
|
||
this.rects.some((item,index) => {
|
||
if(item.type == type) {
|
||
is_true = true;
|
||
choose_index = index
|
||
return true
|
||
}
|
||
})
|
||
if(is_true) {
|
||
this.rects[choose_index].active = true;
|
||
return false;
|
||
}
|
||
if(type=="nickname") {
|
||
this.rects.push(
|
||
{zIndex:this.zIndex+1,type:type,color:"#f00",size:20,width:130,height:30,left:0,top:0,axis:"both",active:false,minw:40,minh:40,draggable:true,resizable:true,parentLim:true,aspectRatio:false,class:""}
|
||
)
|
||
}
|
||
if(type=="invite") {
|
||
this.rects.push(
|
||
{zIndex:this.zIndex+1,type:type,color:"#f00",size:20,width:110,height:30,left:0,top:0,axis:"both",active:false,minw:100,minh:22,draggable:true,resizable:true,parentLim:true,aspectRatio:false,class:""}
|
||
)
|
||
}
|
||
if(type=="mid") {
|
||
this.rects.push(
|
||
{zIndex:this.zIndex+1,type:type,color:"#f00",size:20,width:54,height:30,left:0,top:0,axis:"both",active:false,minw:40,minh:40,draggable:true,resizable:true,parentLim:true,aspectRatio:false,class:""}
|
||
)
|
||
}
|
||
if(type=="img"){
|
||
this.rects.push(
|
||
{zIndex:this.zIndex+1,type:type,src:thumb_url,src_url:thumb_url,width:100,height:100,left:0,top:0,axis:"both",active:false,minw:40,minh:40,draggable:true,resizable:true,parentLim:true,aspectRatio:true,class:""}
|
||
)
|
||
}
|
||
if(type=="head") {
|
||
this.rects.push(
|
||
{zIndex:this.zIndex+1,type:type,width:100,height:100,left:0,top:0,axis:"both",active:false,minw:40,minh:40,draggable:true,resizable:true,parentLim:true,aspectRatio:true,class:""}
|
||
)
|
||
}
|
||
if(type=="qr"&&(this.poster_type==1||this.poster_type==7||this.poster_type==16)){
|
||
this.rects.push(
|
||
{zIndex:this.zIndex+1,type:type,width:100,height:100,left:0,top:0,axis:"both",active:false,minw:40,minh:40,draggable:true,resizable:true,parentLim:true,aspectRatio:true,class:""}
|
||
)
|
||
}
|
||
if(type=="qr"&&this.poster_type==2){
|
||
this.rects.push(
|
||
{zIndex:this.zIndex+1,type:type,mini_link:"/pages/index/index",width:100,height:100,left:0,top:0,axis:"both",active:false,minw:40,minh:40,draggable:true,resizable:true,parentLim:true,aspectRatio:true,class:""}
|
||
)
|
||
}
|
||
if(type=="qr"&&this.poster_type==5){
|
||
this.rects.push(
|
||
{zIndex:this.zIndex+1,type:type,h5_link:"",width:100,height:100,left:0,top:0,axis:"both",active:false,minw:40,minh:40,draggable:true,resizable:true,parentLim:true,aspectRatio:true,class:""}
|
||
)
|
||
}
|
||
if(type=="shopqr"&&this.poster_type==1){
|
||
this.rects.push(
|
||
{zIndex:this.zIndex+1,type:type,h5_link:"",width:100,height:100,left:0,top:0,axis:"both",active:false,minw:40,minh:40,draggable:true,resizable:true,parentLim:true,aspectRatio:true,class:""}
|
||
)
|
||
}
|
||
if(type=="customer_activity") {
|
||
this.rects.push(
|
||
{zIndex:this.zIndex+1,type:type,color:"#f00",size:20,width:130,height:30,left:0,top:0,axis:"both",active:false,minw:40,minh:40,draggable:true,resizable:true,parentLim:true,aspectRatio:false,class:""}
|
||
)
|
||
}
|
||
if(type=="customer_qr"&& this.poster_type== 30 ){
|
||
this.rects.push(
|
||
{zIndex:this.zIndex+1,type:type,width:100,height:100,left:0,top:0,axis:"both",active:false,minw:40,minh:40,draggable:true,resizable:true,parentLim:true,aspectRatio:true,class:""}
|
||
)
|
||
}
|
||
this.zIndex++;
|
||
},
|
||
delEle() {
|
||
console.log(this.rects);
|
||
let list = JSON.parse(JSON.stringify(this.rects));
|
||
list.splice(this.choosed_index,1);
|
||
console.log(list);
|
||
this.rects = [];
|
||
// 样式处理
|
||
setTimeout(() => {
|
||
list.forEach((item,index) => {
|
||
this.rects.push(item)
|
||
})
|
||
},10)
|
||
this.choosed_obj = {};
|
||
console.log(this.rects);
|
||
this.choosed_index = -1;
|
||
|
||
},
|
||
activateEv(index) {
|
||
console.log(index);
|
||
if(this.choosed_index!=-1) {
|
||
this.rects[this.choosed_index].active = false;
|
||
}
|
||
this.choosed_obj = this.rects[index];
|
||
this.choosed_index = index;
|
||
this.rects[index].active = true;
|
||
},
|
||
|
||
deactivateEv(index) {
|
||
console.log(index)
|
||
// this.rects[index].active = false;
|
||
// this.choosed_index!=-1;
|
||
},
|
||
changePosition(newRect, index) {
|
||
this.rects[index].top = newRect.top;
|
||
this.rects[index].left = newRect.left;
|
||
this.rects[index].width = newRect.width;
|
||
this.rects[index].height = newRect.height;
|
||
|
||
},
|
||
changeSize(newRect, index) {
|
||
this.rects[index].top = newRect.top;
|
||
this.rects[index].left = newRect.left;
|
||
this.rects[index].width = newRect.width;
|
||
this.rects[index].height = newRect.height;
|
||
|
||
},
|
||
// 添加关键词
|
||
addContent(name,ref,type) {
|
||
let words = "";
|
||
if(name=='nickname'){
|
||
words = "[会员昵称]";
|
||
}
|
||
if(name=='s_nickname'){
|
||
words = "[扫码者昵称]";
|
||
}
|
||
if(name=='credit'){
|
||
words = "[积分数量]";
|
||
}
|
||
if(name=='bonus'){
|
||
words = "[现金金额]";
|
||
}
|
||
if(name=='coupon_name'){
|
||
words = "[优惠券名称]";
|
||
}
|
||
if(name=='coupon_num'){
|
||
words = "[优惠券张数]";
|
||
}
|
||
if(name=='t_nickname'){
|
||
words = "[推荐者昵称]";
|
||
}
|
||
if(name=='shopname'){
|
||
words = "[商城名称]";
|
||
}
|
||
|
||
|
||
|
||
this.insertInputTxt(name,words,ref,type)
|
||
},
|
||
insertInputTxt(name1,words,ref,type) {
|
||
|
||
let name = "";
|
||
if(type) {
|
||
console.log(this.$refs[ref])
|
||
name = this.$refs[ref].$refs[type];
|
||
}
|
||
else {
|
||
name = this.$refs[ref].$refs.textarea;
|
||
}
|
||
var startPos = name.selectionStart;
|
||
console.log(startPos);
|
||
var endPos = name.selectionEnd;
|
||
if (startPos === undefined || endPos === undefined) return
|
||
var txt = name.value;
|
||
var result = txt.substring(0, startPos) + words + txt.substring(endPos)
|
||
name.value = result;
|
||
name.focus();
|
||
name.selectionStart = startPos + words.length;
|
||
name.selectionEnd = startPos + words.length;
|
||
console.log(name.value)
|
||
console.log(ref)
|
||
this.form[ref] = name.value;
|
||
|
||
},
|
||
|
||
addLink(name,ref,type) {
|
||
this.link_show = true;
|
||
this.link_ref = ref;
|
||
this.link_type = type
|
||
},
|
||
sureAddLink() {
|
||
let title = this.link_form.title;
|
||
let content = this.link_form.content;
|
||
let words = `<a href="`+content+`">`+title+`</a>`
|
||
this.insertInputTxt('link',words,this.link_ref,this.link_type);
|
||
this.link_show = false;
|
||
},
|
||
showLink(type,name,link_type) {
|
||
if(type=="link") {
|
||
this.chooseLink = name;
|
||
this.show = true;
|
||
}
|
||
else {
|
||
this.chooseMiniLink = name;
|
||
this.pro = true;
|
||
}
|
||
this.link_type = link_type;
|
||
},
|
||
changeProp(val) {
|
||
if(val == true) {
|
||
this.uploadShow = false;
|
||
}
|
||
else {
|
||
this.uploadShow = true;
|
||
}
|
||
},
|
||
//弹窗显示与隐藏的控制
|
||
changeLink(item){
|
||
this.show=item;
|
||
},
|
||
//当前链接的增加
|
||
parHref(child,confirm){
|
||
this.show=confirm;
|
||
// this.form.link=child;
|
||
if(this.link_type!=5) {
|
||
this.form[this.chooseLink] = child;
|
||
}
|
||
else {
|
||
this.rects[this.choosed_index]['h5_link'] = child;
|
||
this.$forceUpdate();
|
||
}
|
||
},
|
||
changeprogram(item){
|
||
this.pro=item;
|
||
},
|
||
parpro(child,confirm){
|
||
this.pro=confirm;
|
||
// this.form.prolink=child;
|
||
if(this.link_type!=2) {
|
||
this.form[this.chooseMiniLink] = child;
|
||
}
|
||
else {
|
||
this.rects[this.choosed_index]['mini_link'] = child;
|
||
this.$forceUpdate();
|
||
}
|
||
|
||
},
|
||
|
||
getParam(name) {
|
||
var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i");
|
||
var r = window.location.search.substr(1).match(reg);
|
||
if (r != null) return unescape(r[2]);
|
||
return null;
|
||
},
|
||
changeCenterShow(type) {
|
||
if(type=="other"&&this.form.center_show.indexOf(0)>=-1) {
|
||
this.form.center_show = [];
|
||
this.form.center_show.push(0);
|
||
}
|
||
else {
|
||
let arr = []
|
||
for(let i=0;i<this.form.center_show.length;i++) {
|
||
if(this.form.center_show[i]!=0) {
|
||
arr.push(this.form.center_show[i])
|
||
}
|
||
}
|
||
this.form.center_show = arr;
|
||
}
|
||
console.log(this.form.center_show)
|
||
this.$forceUpdate();
|
||
},
|
||
jumpUrl() {
|
||
window.open(CktUrl);
|
||
},
|
||
},
|
||
})
|
||
|
||
</script>
|
||
@endsection
|