You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
zhishifufei_php/application/admin/view/wechat/reply/add_keyword.php

327 lines
20 KiB

10 months ago
{extend name="public/container"}
{block name="head_top"}
<link rel="stylesheet" type="text/css" href="{__ADMIN_PATH}css/main.css" />
<script src="{__FRAME_PATH}js/bootstrap.min.js"></script>
<script src="{__FRAME_PATH}js/content.min.js"></script>
<script src="{__ADMIN_PATH}frame/js/ajaxfileupload.js"></script>
<script src="{__PLUG_PATH}moment.js"></script>
{/block}
{block name="content"}
<div class="layui-fluid">
<div class="layui-row layui-col-space15">
<div class="layui-col-md12">
<div class="layui-card">
<div class="layui-card-body">
<div id="app" class="row">
<div class="col-sm-12">
<div class="wechat-reply-wrapper">
<div class="ibox-title"><p>{{msg}}</p></div>
<div class="ibox-content clearfix">
<div class="view-wrapper col-sm-4">
<div class="mobile-header">公众号</div>
<section class="view-body" style="overflow:scroll;">
<div class="time-wrapper"><span class="time">9:36</span></div>
<div class="view-item text-box clearfix" :class="{show:type=='text'}">
<div class="avatar fl"><img src="{__ADMIN_PATH}images/head.gif" /></div>
<div class="box-content fl">
{{dataGroup.text.content}}
</div>
</div>
<div class="view-item news-box" :class="{show:type=='news'}" v-if="dataGroup.news.length >0">
<div class="vn-content" v-if="dataGroup.news.length ==1">
<div class="vn-title">{{dataGroup.news[0].title}}</div>
<div class="vn-time">{{dataGroup.news[0].date}}</div>
<div class="vn-picture" :style="{backgroundImage: 'url('+dataGroup.news[0].image+')'}"></div>
<div class="vn-picture-info">{{dataGroup.news[0].description}}</div>
<div class="vn-more">
<a :href="dataGroup.news[0].url">阅读原文</a>
</div>
</div>
<div class="vn-content" v-else>
<div class="con-item-box">
<div class="vn-picture" :style="{backgroundImage: 'url('+dataGroup.news[0].image+')'}"></div>
<div class="first-title">{{dataGroup.news[0].title}}</div>
</div>
<div class="con-item-list clearfix" v-for="(newinfos,index) in dataGroup.news" v-if="index>0">
<div class="list-tit-info fl">{{newinfos.title}}</div>
<div class="list-pic fr" :style="{backgroundImage: 'url('+newinfos.image+')'}"></div>
</div>
</div>
</div>
<div class="view-item text-box clearfix" :class="{show:type=='image'}">
<div class="avatar fl"><img src="{__ADMIN_PATH}images/head.gif" /></div>
<div class="box-content fl">
<img class="picbox" :src="dataGroup.image.src" alt="" />
</div>
</div>
</section>
</div>
<div class="control-wrapper col-sm-8">
<section>
<form action="" method="post" enctype="multipart/form-data">
<div class="control-title">{{msg}}</div>
<div class="control-body">
<div class="form-group clearfix">
<label class="col-sm-2 tips" for="">关键字</label>
<div class="col-sm-10 group-item">
<input style="resize: none;width: 100%;padding: 6px 12px;" v-model="keyword" type="text" name="keyword" placeholder="请输入关键字" />
</div>
</div>
<div class="form-group clearfix">
<label class="col-sm-2 control-label tips" for="">规则状态</label>
<div class="group-item col-sm-10">
<div class="radio i-checks" style="display:inline;margin-left: 16px;">
<label class="" style="padding-left: 0;">
<input style="position: relative;top: 1px;left: 3px;" checked="checked" v-model="status" type="radio" value="1" name="status">
启用</label>
</div>
<div class="radio i-checks" style="display:inline;margin-left: 32px;">
<label class="" style="padding-left: 0;">
<input style="position: relative;top: 1px;left: 3px;" type="radio" value="0" v-model="status" name="status">
禁用
</label>
</div>
</div>
</div>
<div class="form-group clearfix">
<label class="col-sm-2 tips" for="">消息类型</label>
<div class="col-sm-10 group-item">
<select class="form-control m-b" v-model="type" name="account">
<option value="text">文字消息</option>
<option value="image">图片消息</option>
<option value="news">图文消息</option>
<option value="voice">声音消息</option>
</select>
</div>
</div>
<div class="control-main">
<!-- 文字 -->
<div class="control-item control-main-txt" :class="{show:type=='text'}">
<div class="form-group clearfix">
<label class="col-sm-2 tips" for="">规则内容</label>
<div class="col-sm-10 group-item">
<textarea v-model="dataGroup.text.content" name="" id="" cols="30" rows="10" placeholder="请输入内容"></textarea>
</div>
</div>
</div>
<input id="file" type="file" name="file" style="display: none;" />
<!-- 图文 -->
<div class="control-item control-main-news" :class="{show:type=='news'}">
<div class="form-group clearfix">
<label class="col-sm-2 tips" for="">选取图文</label>
<div class="col-sm-10 group-item" @click="selectNews" style="cursor: pointer;"><span>选择图文消息</span></div>
</div>
</div>
<!-- 图片 -->
<div class="control-item control-main-picture" :class="{show:type=='image'}">
<div class="form-group clearfix">
<label class="col-sm-2 tips" for="">图片地址</label>
<div class="col-sm-10 group-item">
<input v-model="dataGroup.image.src" class="form-control" readonly type="text" placeholder="请上传图片"/>
<span id="flag" class="file-btn" @click="uploadImg">上传</span>
</div>
</div>
<div class="tips-info">
<span>文件最大2Mb,支持bmp/png/jpeg/jpg/gif格式</span>
<div class="upload-img"><img src="" alt="" /><span>上传图片</span></div>
</div>
</div>
<!-- 音乐 -->
<div class="control-item control-main-music" :class="{show:type=='voice'}">
<div class="form-group clearfix">
<label class="col-sm-2 tips" for="">上传声音</label>
<div class="col-sm-10 group-item">
<input class="form-control" type="text" readonly placeholder="请上传音乐文件或输入音乐URL地址" v-model="dataGroup.voice.src"/>
<span class="file-btn" @click="uploadMusic">上传</span>
</div>
</div>
</div>
</div>
</div>
<div style="text-align: center;"><button type="button" class="btn btn-w-m btn-primary" @click="submit">提交</button></div>
</form>
</section>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
{/block}
{block name="script"}
<script type="text/javascript">
$eb = parent._mpApi, $upload = $('#file');
$eb.mpFrame.start(function (Vue) {
var $http = $eb.axios;
const vm = new Vue({
data: {
add:'',
used_key:"",
keyword:"",
status: 1,
msg: '新建关键字回复',
type: 'text',
textBox: '',
pic: '',
dataGroup:{
text:{
content:''
},
image:{
src:''
},
voice:{
src:''
},
news:[]
},
uploadColl: function () {
},
uploadLink: ''
},
methods: {
submit: function(){
if(!this.check()) return false;
window.vm = this;
$eb.axios.post("{:Url('save_keyword',array('dis'=>$dis))}",{key:this.keyword,status:this.status,data:this.dataGroup[this.type],type:this.type}).then(function(res){
if(res.status == 200 && res.data.code == 200){
$eb.message('success','设置成功!');
setTimeout(function () {
window.history.go(-1);
},800);
}
else
$eb.message('error',res.data.msg || '设置失败!');
}).catch(this.returnError);
},
check: function(){
var dataGroup = this.dataGroup;
if(this.keyword.trim() == '')
return this.returnError('请输入关键字');
if(this.keyword.trim() == 'subscribe')
return this.returnError('请重新输入关键字');
if(this.keyword.trim() == 'default')
return this.returnError('请重新输入关键字');
switch (this.type){
case 'text':
if(dataGroup.text.content == '')
return this.returnError('请输入文字消息内容');
break;
case 'image':
if(dataGroup.image.src == '')
return this.returnError('请上传图片');
break;
case 'news':
if(dataGroup.news.length < 1)
return this.returnError('请选择图文消息');
break;
case 'voice':
if(dataGroup.voice.src == '')
return this.returnError('请上传声音');
break;
}
return true;
},
returnError:function(err){
$eb.message('error',err);
return false;
},
uploadImg: function () {
var vm = this;
this.uploadLink = "{:Url('upload_img')}";
$('#file').attr('accept','image/*');
this.uploadColl = function(pic){
vm.dataGroup.image.src = pic;
};
$('#file').trigger('click');
},
uploadMusic:function(){
var vm = this;
this.uploadLink = "{:Url('upload_file')}";
$('#file').attr('accept','audio/*');
this.uploadColl = function(pic){
vm.dataGroup.voice.src = pic;
};
$('#file').trigger('click');
},
upload: function () {
var vm = this;
$('#file').on('change', function () {
$.ajaxFileUpload({
url: vm.uploadLink,
type: 'post',
secureuri: false, //一般设置为false
data:{'file':'file'},
fileElementId: 'file', // 上传文件的id、name属性名
dataType: 'json', //返回值类型,一般设置为json、application/json
success: function (data, status) {
if(data.code == 200){
vm.uploadColl && vm.uploadColl(data.data);
$eb.message('success','上传成功!');
}else{
$eb.message('error',data.msg);
}
vm.upload();
},
error: function (data, status, e) {
$eb.message('error','上传失败!');
vm.upload();
}
});
});
},
selectNews:function(){
var vm = this,i;
parent._selectNews$eb = function(data){
var newsList = [];
data.new.map(function(news){
newsList.push({
title:news.title,
description:news.synopsis,
url:news.url,
image:news.image_input,
date:moment(news.add_time*1000).format('M月D日'),
id:news.id
});
});
vm.dataGroup.news = newsList;
delete parent._selectNews$eb;
$eb.closeModalFrame(i);
};
i = $eb.createModalFrame('选择图文消息',"{:Url('admin/wechat.wechatNewsCategory/select',['callback'=>'_selectNews$eb'])}",{w:975});
}
},
mounted: function () {
window.vm = this;
this.used_key = "{$key}";
this.upload();
res= {$replay_arr};
if(res.id > 0){
window.vm.type = res.type;
window.vm.status = res.status;
if(res.type == 'image') {
window.vm.dataGroup.image.src = res.data.src;
}else if(res.type == 'text'){
window.vm.dataGroup.text.content = res.data.content;
}else if(res.type == 'voice'){
window.vm.dataGroup.voice.src = res.data.src;
}else if(res.type == 'news'){
window.vm.dataGroup.news = res.data;
}
if(window.vm.used_key){
window.vm.keyword = res.key;
}
}
}
});
vm.$mount(document.getElementById('app'));
});
</script>
{/block}