Skip to content

A
admin-base
Commit d33e62c0 authored by 王's avatar 王
Browse files
Options

自动回复

parent 3a8c0e47
Show whitespace changes
Inline Side-by-side
Showing with 286 additions and 93 deletions
src/components/weChat/autoReply.vue
View file @ d33e62c0
...@@ -10,12 +10,13 @@ ...@@ -10,12 +10,13 @@
style="width: 100%"> style="width: 100%">
<el-table-column type="expand"> <el-table-column type="expand">
<template slot-scope="props"> <template slot-scope="props">
<el-form label-position="left" class="demo-table-expand"> <el-form label-position="top" class="demo-table-expand">
<el-form-item label="关键词">
<span>{{ props.row.value }}</span>
</el-form-item>
<el-form-item label="回复内容"> <el-form-item label="回复内容">
<div v-for="(item, index) in JSON.parse(props.row.desc)">{{ item.content }}</div> <div v-for="(item, index) in JSON.parse(props.row.desc)">
<span>内容：{{ item.content }}</span>
<span v-if="item.teacher_id"> 老师ID：{{item.teacher_id}}</span>
<span v-if="item.start_at"> 开课时间：{{item.start_at}}</span>
</div>
</el-form-item> </el-form-item>
</el-form> </el-form>
</template> </template>
......
src/components/weChat/autoReplyDialog.vue
View file @ d33e62c0
...@@ -18,7 +18,7 @@ ...@@ -18,7 +18,7 @@
</el-row> </el-row>
<el-row> <el-row>
<el-col :span="4"><label>回复内容</label></el-col> <el-col :span="4"><label>回复内容</label></el-col>
<el-col :span="8"> <el-col :span="20">
<template v-if="form.desc"> <template v-if="form.desc">
<div v-for="(item, index) in JSON.parse(form.desc)" class="msg-item"> <div v-for="(item, index) in JSON.parse(form.desc)" class="msg-item">
<span class="msg-text" v-if="item.type==='text'">{{item.content}}</span> <span class="msg-text" v-if="item.type==='text'">{{item.content}}</span>
...@@ -28,18 +28,64 @@ ...@@ -28,18 +28,64 @@
</div> </div>
</template> </template>
<div class="msg_sender_wrp"> <div class="msg_sender_wrp">
<i class="el-icon-circle-plus-outline" @click="showType = true"></i> <div>
<ul class="weui-desktop-msg-sender__tabs" v-if="showType"> <i class="el-icon-circle-plus-outline" @click="onAddContent"></i>
<!--<li class="weui-desktop-msg-sender__tab weui-desktop-msg-sender__tab_appmsg" @click="getMediaList('news')">图文消息</li>--> </div>
<li class="weui-desktop-msg-sender__tab weui-desktop-msg-sender__tab_text" @click="editContent()">文字</li> <el-dialog
<li class="weui-desktop-msg-sender__tab weui-desktop-msg-sender__tab_img" @click="getMediaList('image')">图片</li> width="30%"
<!--<li class="weui-desktop-msg-sender__tab weui-desktop-msg-sender__tab_audio" @click="getMediaList('voice')">语音</li>--> :title="title"
<!--<li class="weui-desktop-msg-sender__tab weui-desktop-msg-sender__tab_video" @click="getMediaList('video')">视频</li>--> :visible.sync="showType"
</ul> :close-on-click-modal="false"
:close-on-press-escape="false"
:show-close="false"
append-to-body>
<div>
<el-tabs v-if="showType" v-model="type" type="card">
<el-tab-pane label="文字" name="text"></el-tab-pane>
<el-tab-pane label="图片" name="image"></el-tab-pane>
</el-tabs>
<!--<ul class="weui-desktop-msg-sender__tabs" v-if="showType">-->
<!--&lt;!&ndash;<li class="weui-desktop-msg-sender__tab weui-desktop-msg-sender__tab_appmsg" @click="getMediaList('news')">图文消息</li>&ndash;&gt;-->
<!--<li class="weui-desktop-msg-sender__tab weui-desktop-msg-sender__tab_text" @click="onChangeTab('text')">文字</li>-->
<!--<li class="weui-desktop-msg-sender__tab weui-desktop-msg-sender__tab_img" @click="onChangeTab('image')">图片</li>-->
<!--&lt;!&ndash;<li class="weui-desktop-msg-sender__tab weui-desktop-msg-sender__tab_audio" @click="getMediaList('voice')">语音</li>&ndash;&gt;-->
<!--&lt;!&ndash;<li class="weui-desktop-msg-sender__tab weui-desktop-msg-sender__tab_video" @click="getMediaList('video')">视频</li>&ndash;&gt;-->
<!--</ul>-->
<div v-if="showType" class="more-info">
<el-form-item label="老师">
<el-select v-model="teacher_id" placeholder="请选择老师" clearable>
<el-option
v-for="(data,index) in teacherList"
:key="index"
:label="data.name"
:value="data.id">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="上课时间">
<el-date-picker
v-model="start_at"
format="yyyy-MM-dd"
value-format="yyyy-MM-dd"
type="date"
:picker-options="pickerOptions1"
placeholder="选择上课时间">
</el-date-picker>
</el-form-item>
<template v-if="type=== 'text'">
<el-input
type="textarea"
:autosize="{ minRows: 4, maxRows: 8}"
placeholder="请输入内容"
v-model="content">
</el-input>
</template>
<template v-if="type==='image'">
<div style="margin-bottom: 25px;color: 888;" v-if="!imageContent.url" @click="getMediaList('image')">+从素材库中选择</div>
<div v-if="imageContent.url" class="img">
<img :src="imageContent.url"/>
<i class="el-icon-delete" @click="imageContent={url:'',media_id:''}"></i>
</div> </div>
</el-col>
</el-row>
</el-form>
<div v-if="showMedia && mediaList.length > 0"> <div v-if="showMedia && mediaList.length > 0">
<el-table <el-table
:data="mediaList" :data="mediaList"
...@@ -62,11 +108,24 @@ ...@@ -62,11 +108,24 @@
</template> </template>
</el-table-column> </el-table-column>
</el-table> </el-table>
<page :total="total" v-model="nowPage"/> <page :total="total" v-model="nowPage" :limit="limit" @pageChange="onPageChange"/>
</div>
</template>
<div class="tool_bar">
<el-button @click="close">取 消</el-button>
<el-button class="weui-desktop-btn weui-desktop-btn_primary" @click="confirm">确定</el-button>
</div>
</div>
</div>
</el-dialog>
</div> </div>
</el-col>
</el-row>
</el-form>
<span slot="footer" class="dialog-footer"> <span slot="footer" class="dialog-footer">
<el-button @click="show = false">取 消</el-button> <el-button @click="show = false">取 消</el-button>
<el-button type="primary" @click="save">确 定</el-button> <el-button type="primary" @click="save">保 存</el-button>
</span> </span>
</div> </div>
</el-dialog> </el-dialog>
...@@ -75,7 +134,7 @@ ...@@ -75,7 +134,7 @@
</template> </template>
<script> <script>
import {updateConfigApi,saveConfigApi,getMediaListApi} from "../../service/api"; import {updateConfigApi,saveConfigApi,getMediaListApi,getTeacherListApi} from "../../service/api";
import page from '../framework/page' import page from '../framework/page'
export default { export default {
name: "dialogObj", name: "dialogObj",
...@@ -84,22 +143,37 @@ ...@@ -84,22 +143,37 @@
], ],
data(){ data(){
return{ return{
title: '',
show:false, show:false,
id: '', id: '',
loading:true, loading:true,
showType: false, showType: false,
showTextContent: false, showTextContent: false,
total:0, total:0,
nowPage:0, nowPage:1,
limit: 5,
type:'text', type:'text',
form:{ form:{
key:'keywords_reply', key:'keywords_reply',
value:'', value:'',
desc:'' desc:''
}, },
teacher_id: '',
start_at: '',
textContent: '', textContent: '',
mediaList: [], mediaList: [],
showMedia: false, showMedia: false,
teacherList: [],
content: '',
imageContent: {
url: '',
media_id: ''
},
pickerOptions1: {
disabledDate(time) {
return !(time.getTime() > Date.now());
}
},
rules:{ rules:{
value:[ value:[
{ required: true, message: '请输入规则名称', trigger: 'change' } { required: true, message: '请输入规则名称', trigger: 'change' }
...@@ -117,6 +191,11 @@ ...@@ -117,6 +191,11 @@
page page
}, },
methods:{ methods:{
getTeacher(){
getTeacherListApi({page: 1, limit: 1000}).then(res=>{
this.teacherList = res.list
})
},
save(){ save(){
let json = {} let json = {}
console.log('this.form', this.form) console.log('this.form', this.form)
...@@ -162,9 +241,16 @@ ...@@ -162,9 +241,16 @@
if (mediaId) { if (mediaId) {
obj.media_id = mediaId; obj.media_id = mediaId;
} }
if (this.teacher_id) {
obj.teacher_id = this.teacher_id
}
if (this.start_at) {
obj.start_at = this.start_at
}
_desc.push(obj); _desc.push(obj);
_form.desc = JSON.stringify(_desc); _form.desc = JSON.stringify(_desc);
this.form = _form; this.form = _form;
this.showType = false;
}, },
initDialog(){ initDialog(){
this.show = this.dialogObj.show; this.show = this.dialogObj.show;
...@@ -176,12 +262,63 @@ ...@@ -176,12 +262,63 @@
this.loading = false; this.loading = false;
this.showType = false; this.showType = false;
}, },
onPageChange(val){
this.nowPage = val
this.getMediaList(this.type)
},
onChangeTab(type){
this.type = type;
},
onAddContent(){
console.log('onAddContent')
this.title = '添加回复';
this.content='';
this.imageContent = {
url: '',
media_id: ''
};
this.teacher_id = '';
this.start_at = '';
this.showType = true;
},
close(){
this.content='';
this.imageContent = {
url: '',
media_id: ''
};
this.teacher_id = '';
this.start_at = '';
this.showType = false;
},
confirm(){
if(this.type === 'text') {
if(!this.content){
this.$message({
showClose: true,
message: '请输入文本内容'
});
} else {
this.addContent('text', this.content, '');
}
} else if (this.type === 'image') {
if (!this.imageContent.url) {
this.$message({
showClose: true,
message: '请选择图片'
});
} else {
this.addContent(this.type, this.imageContent.url, this.imageContent.media_id);
}
}
},
getMediaList(type){ getMediaList(type){
let json = { let json = {
type: type, type: type,
page: this.nowPage page: this.nowPage,
limit: this.limit
}; };
this.showType = false; // this.showType = false;
this.loading = true; this.loading = true;
this.showMedia = true; this.showMedia = true;
getMediaListApi(json).then(res=>{ getMediaListApi(json).then(res=>{
...@@ -215,10 +352,9 @@ ...@@ -215,10 +352,9 @@
inputValue: item.content inputValue: item.content
}).then(({value}) => { }).then(({value}) => {
let newDesc = JSON.parse(_form.desc); let newDesc = JSON.parse(_form.desc);
let _desc = { let _desc = newDesc[index]
type: 'text', _desc.type = 'text';
content: value _desc.content = value;
};
newDesc.splice(index,1,_desc); newDesc.splice(index,1,_desc);
_form.desc = JSON.stringify(newDesc); _form.desc = JSON.stringify(newDesc);
}) })
...@@ -247,7 +383,8 @@ ...@@ -247,7 +383,8 @@
this.form = _form; this.form = _form;
}, },
onChooseMedia(val){ onChooseMedia(val){
this.addContent(this.type, val.url, val.media_id); // this.addContent(this.type, val.url, val.media_id);
this.imageContent = val
this.showMedia = false; this.showMedia = false;
} }
}, },
...@@ -255,7 +392,8 @@ ...@@ -255,7 +392,8 @@
dialogObj:{ dialogObj:{
handler: function () { handler: function () {
this.loading = true; this.loading = true;
this.initDialog() this.initDialog();
this.getTeacher();
}, },
deep: true deep: true
}, },
...@@ -270,6 +408,9 @@ ...@@ -270,6 +408,9 @@
@import "../../util/public"; @import "../../util/public";
.msg-item { .msg-item {
margin-bottom: 10px; margin-bottom: 10px;
img {
width: 20%;
}
} }
.msg-text { .msg-text {
margin-right: 20px; margin-right: 20px;
...@@ -280,15 +421,15 @@ ...@@ -280,15 +421,15 @@
margin-top: 30px; margin-top: 30px;
} }
.msg_sender_wrp { .msg_sender_wrp {
display: flex; /*display: flex;*/
flex-flow: row wrap; /*flex-flow: row wrap;*/
justify-content: flex-start; /*justify-content: flex-start;*/
align-items: center; /*align-items: center;*/
height: 48px; /*height: 48px;*/
/*position: absolute;*/ /*position: absolute;*/
/*left: 100%;*/ /*left: 100%;*/
/*top: 50%;*/ /*top: 50%;*/
width: 500px; /*width: 500px;*/
/*z-index: 500;*/ /*z-index: 500;*/
/*-ms-transform: translateY(-50%);*/ /*-ms-transform: translateY(-50%);*/
/*transform: translateY(-50%);*/ /*transform: translateY(-50%);*/
...@@ -335,4 +476,29 @@ ...@@ -335,4 +476,29 @@
.weui-desktop-msg-sender__tab_video:before { .weui-desktop-msg-sender__tab_video:before {
background: transparent url(https://mp.weixin.qq.com/mpres/en_US/htmledition/pages/modules/msg_sender/svg/default/sender_video3f92fe.svg) no-repeat 0 0; background: transparent url(https://mp.weixin.qq.com/mpres/en_US/htmledition/pages/modules/msg_sender/svg/default/sender_video3f92fe.svg) no-repeat 0 0;
} }
.more-info {
}
.img {
position: relative;
width: 25%;
img {
width: 100%;
}
.el-icon-delete {
position: absolute;
top: 50%;
left: 50%;
display: none;
}
}
.img:hover img{
opacity: 0.3;
}
.img:hover .el-icon-delete{
display: block;
}
.tool_bar {
margin-top: 20px;
}
</style> </style>
src/components/weChat/focusReplyDialog.vue
View file @ d33e62c0
...@@ -5,6 +5,30 @@ ...@@ -5,6 +5,30 @@
:visible.sync="dialogObj.show" :visible.sync="dialogObj.show"
width="800px"> width="800px">
<div class="focus-reply"> <div class="focus-reply">
<div class="header">
<el-form label-width="120px" inline>
<el-form-item label="老师">
<el-select v-model="teacher_id" placeholder="请选择" clearable>
<el-option
v-for="(data,index) in teacherList"
:key="index"
:label="data.name"
:value="data.id">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="上课时间" prop="start_at">
<el-date-picker
v-model="start_at"
format="yyyy-MM-dd"
value-format="yyyy-MM-dd"
type="date"
:picker-options="pickerOptions1"
placeholder="选择日期">
</el-date-picker>
</el-form-item>
</el-form>
</div>
<div class="content"> <div class="content">
<div class="inner" v-loading="loading"> <div class="inner" v-loading="loading">
<ul class="weui-desktop-msg-sender__tabs"> <ul class="weui-desktop-msg-sender__tabs">
...@@ -39,7 +63,7 @@ ...@@ -39,7 +63,7 @@
</template> </template>
</el-table-column> </el-table-column>
</el-table> </el-table>
<page :total="total" v-model="nowPage"/> <page :total="total" v-model="nowPage" :limit="limit" @pageChange="onPageChange"/>
</div> </div>
</div> </div>
<div class="inner-emotion_editor" v-else-if="type === 'text'"> <div class="inner-emotion_editor" v-else-if="type === 'text'">
...@@ -67,7 +91,7 @@ ...@@ -67,7 +91,7 @@
</template> </template>
<script> <script>
import {updateConfigApi,saveConfigApi,getMediaListApi,getConfigListApi} from "../../service/api"; import {updateConfigApi,saveConfigApi,getMediaListApi,getConfigListApi,getTeacherListApi} from "../../service/api";
import page from '../framework/page' import page from '../framework/page'
export default { export default {
name: "focusReplyDialog", name: "focusReplyDialog",
...@@ -80,6 +104,7 @@ ...@@ -80,6 +104,7 @@
loading:false, loading:false,
total:0, total:0,
nowPage:1, nowPage:1,
limit: 5,
id: null, id: null,
list: [], list: [],
index: -1, index: -1,
...@@ -92,21 +117,16 @@ ...@@ -92,21 +117,16 @@
imageContent: '', imageContent: '',
type: 'text', type: 'text',
mediaList: [], mediaList: [],
mediaListMock: [ mediaListMock: [],
{
"media_id": "hQb3Pbdb4E5Ivxi2sagL5sTdtW5W9pKJNA6Z8nBo6Ao",
"name": "xx.jpg",
"update_time": 1535351431,
"url": "http://mmbiz.qpic.cn/mmbiz_jpg/qNgYSw5sicibUGtiaRYRY9QEZUoqgGdvkTE5Zvg58tUciaAXFslmwuiadgU6turtsF7mXFeicKa9RQTTG1gKSLqPiabpA/0?wx_fmt=jpeg"
},
{
"media_id": "hQb3Pbdb4E5Ivxi2sagL5p2poL7GllXYm4SETNmf210",
"name": "z.jpg",
"update_time": 1535351316,
"url": "http://mmbiz.qpic.cn/mmbiz_jpg/qNgYSw5sicibUGtiaRYRY9QEZUoqgGdvkTE5mTOB0jnmfdH30s54N5FIr2Tsbd9QcBFDiapicYWJ6sCZRMGTIlj179g/0?wx_fmt=jpeg"
}
],
showMedia: false, showMedia: false,
teacher_id: '',
teacherList: [],
start_at: '',
pickerOptions1: {
disabledDate(time) {
return !(time.getTime() > Date.now());
}
},
rules:{ rules:{
value:[ value:[
{ required: true, message: '请输入规则名称', trigger: 'change' } { required: true, message: '请输入规则名称', trigger: 'change' }
...@@ -124,11 +144,17 @@ ...@@ -124,11 +144,17 @@
page page
}, },
mounted(){ mounted(){
this.initDialog() this.initDialog();
this.getTeacher();
}, },
filters: { filters: {
}, },
methods:{ methods:{
getTeacher(){
getTeacherListApi({page: 1, limit: 1000}).then(res=>{
this.teacherList = res.list
})
},
initDialog(){ initDialog(){
if (this.dialogObj.id) { if (this.dialogObj.id) {
this.id = this.dialogObj.id; this.id = this.dialogObj.id;
...@@ -142,6 +168,8 @@ ...@@ -142,6 +168,8 @@
this.content = '' this.content = ''
} else { } else {
this.type = this.list[this.index].type; this.type = this.list[this.index].type;
this.teacher_id = this.list[this.index].teacher_id ? this.list[this.index].teacher_id : '';
this.start_at = this.list[this.index].start_at ? this.list[this.index].start_at : '';
if (this.type === 'text') { if (this.type === 'text') {
this.content = this.list[this.index].content this.content = this.list[this.index].content
} else if (this.type === 'image') { } else if (this.type === 'image') {
...@@ -172,6 +200,12 @@ ...@@ -172,6 +200,12 @@
type : this.type, type : this.type,
content: this.content content: this.content
}; };
if (this.teacher_id) {
obj.teacher_id = this.teacher_id
}
if (this.start_at) {
obj.start_at = this.start_at
}
if (this.index > -1) { if (this.index > -1) {
_desc[this.index] = obj _desc[this.index] = obj
} else { } else {
...@@ -185,6 +219,12 @@ ...@@ -185,6 +219,12 @@
}); });
return return
} }
if (this.teacher_id) {
this.imageContent.teacher_id = this.teacher_id
}
if (this.start_at) {
this.imageContent.start_at = this.start_at
}
if (this.index > -1) { if (this.index > -1) {
_desc[this.index] = this.imageContent _desc[this.index] = this.imageContent
} else { } else {
...@@ -213,10 +253,15 @@ ...@@ -213,10 +253,15 @@
}) })
} }
}, },
onPageChange(val){
this.nowPage = val
this.getMediaList(this.type)
},
getMediaList(type){ getMediaList(type){
let json = { let json = {
type: type, type: type,
page: this.nowPage page: this.nowPage,
limit: this.limit
}; };
this.loading = true; this.loading = true;
getMediaListApi(json).then(res=>{ getMediaListApi(json).then(res=>{
...@@ -254,26 +299,7 @@ ...@@ -254,26 +299,7 @@
obj.media_id = mediaId; obj.media_id = mediaId;
} }
this.imageContent = obj this.imageContent = obj
},
getList(){
getConfigListApi({key: this.form.key}).then(res => {
if (res.total > 0) {
this.id = res.list[0].id;
let _desc = JSON.parse(res.list[0].desc);
this.list = _desc || [];
this.type = _desc[0].type;
if (this.type === 'text') {
this.content = _desc[0].content
} else if (this.type === 'image') {
this.imageContent = {
type: 'image',
content: _desc[0].content,
media_id: _desc[0].media_id
}
}
} }
})
},
} }
} }
</script> </script>
......
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