Skip to content

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

二维码管理

parent ae11e34d
Hide whitespace changes
Inline Side-by-side
Showing with 1147 additions and 35 deletions
config/index.js
View file @ 6fa3b93d
......@@ -12,14 +12,14 @@ module.exports = {
//本地代理设置
proxyTable: {
'/api': {
target: 'http://local.base-api.sing.com', // 接口的域名
// target: 'https://wechat-test.changchangenglish.com/',
// target: 'http://local.base-api.sing.com', // 接口的域名
target: 'https://wechat-test.changchangenglish.com/',
changeOrigin: true, // 如果接口跨域，需要进行这个参数配置
}
},
// Various Dev Server settings
host: '10.1.21.181', // can be overwritten by process.env.HOST
host: 'localhost', // can be overwritten by process.env.HOST
port: 8080, // can be overwritten by process.env.PORT, if port is in use, a free one will be determined
autoOpenBrowser: false,
errorOverlay: true,
......
src/components/qrcode/dialog.vue
View file @ 6fa3b93d
<template>
<el-dialog
title="新建二维码"
width="600px"
:title="title"
width="800px"
:close-on-press-escape="false"
:close-on-click-modal="false"
:show-close="false"
:visible.sync="newObj.show">
<el-form label-width="100px">
<el-form-item label="名称">
<el-input v-model="form.title"/>
<el-input v-model="form.title" :disabled="newObj.readFlag"/>
</el-form-item>
<el-form-item label="推广码">
<el-input v-model="form.invite_code">
<el-input v-model="form.invite_code" :disabled="newObj.readFlag || newObj.editFlag">
<template slot="prepend">CC-SOURCE-</template>
</el-input>
</el-form-item>
<el-form-item label="状态">
<el-select v-model="form.status" placeholder="请选择">
<el-select v-model="form.status" placeholder="请选择" :disabled="newObj.readFlag">
<el-option v-for="item in statusOption"
:key="item.value"
:label="item.label"
......@@ -24,6 +27,7 @@
</el-form-item>
<el-form-item label="二维码类型">
<el-switch
:disabled="newObj.readFlag || newObj.editFlag"
v-model="form.type"
:active-value="1"
:inactive-value="2"
......@@ -39,6 +43,7 @@
</el-form-item>
<el-form-item label="结束时间" v-if="form.type === 2">
<el-date-picker
:disabled="newObj.readFlag || newObj.editFlag"
v-model="form.end_at"
type="datetime"
:picker-options="pickerOptions1"
......@@ -47,30 +52,143 @@
placeholder="选择日期">
</el-date-picker>
</el-form-item>
<el-tabs v-model="activeName" type="card">
<el-tab-pane label="自动回复" name="autoReply">
<el-button @click="addNew" style="float: right" v-if="!newObj.readFlag">添加＋</el-button>
<el-table
:data="list"
style="width: 100%;"
max-height="800">
<el-table-column
fixed
label="类型"
width="150">
<template slot-scope="scope">
{{scope.row.type | typeFilter}}
</template>
</el-table-column>
<el-table-column
label="内容">
<template slot-scope="scope">
<div v-if="scope.row.type === 'text'" v-html="scope.row.content.replace(/\/[\u4E00-\u9FA5]{1,3}/gi, emotion)"></div>
<a v-else-if="scope.row.type === 'image' && scope.row.content" :href="scope.row.content" target="_blank">
<img class="shotcut" :src="scope.row.content">
</a>
<div v-else-if="scope.row.type === 'video'">
<a :href="scope.row.content.down_url" target="_blank">{{scope.row.content.title}}</a>
</div>
<div v-else-if="scope.row.type === 'voice'">
<a :href="scope.row.content.down_url" target="_blank">{{scope.row.content.title}}</a>
</div>
<div v-else-if="scope.row.type === 'news'">
<div class="news-media">
<div v-for="(child, childIndex) in scope.row.content.news_item" style="position: relative">
<div v-if="scope.row.content.news_item.length === 1" class="single-cover">
<div class="title">{{child.title}}</div>
<img :src="child.thumb_url" style="width: 100%;margin-top: 20px;"/>
<div class="digest">{{child.digest}}</div>
<a class="preview" :href="child.url" target="_blank">
预览文章
</a>
</div>
<div v-else-if="scope.row.content.news_item.length > 1" class="clear-both bottomCover" style="position: relative">
<div v-if="childIndex === 0" class="muti-cover">
<img style="width: 100%;margin-top: 20px;" :src="child.thumb_url"/>
<div class="bottom-title">{{child.title}}</div>
</div>
<div class="next-cover clear-both" v-else>
<span class="next-title">{{child.title}}</span>
<img class="next-img" :src="child.thumb_url"/>
</div>
<a class="preview" :href="child.url" target="_blank">
预览文章
</a>
</div>
</div>
</div>
</div>
</template>
</el-table-column>
<el-table-column
fixed="right"
label="操作"
v-if="!newObj.readFlag && !$store.state.readonly"
width="200">
<template slot-scope="scope">
<el-button
@click.native.prevent="editRow(scope.$index, list)"
type="text"
size="small">
编辑
</el-button>
<el-button
@click.native.prevent="deleteRow(scope.$index, list)"
v-if="$store.state.deletePermission"
type="text"
size="small">
移除
</el-button>
</template>
</el-table-column>
</el-table>
</el-tab-pane>
</el-tabs>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button @click="newObj.show = false">取 消</el-button>
<el-button type="primary" @click="onSave">确 定</el-button>
<el-button @click="onCancel" v-if="!newObj.readFlag">取 消</el-button>
<el-button type="primary" @click="onSave" v-if="!newObj.readFlag">确 定</el-button>
<el-button type="primary" @click="onCancel" v-if="newObj.readFlag">确 定</el-button>
</span>
<dialog-com v-if="dialogObj.show" :dialogObj="dialogObj" @changeShow="changeShow" @reflash = "getReplyList"/>
</el-dialog>
</template>
<script>
import {createQrCodeApi} from "../../service/api";
import {createQrCodeApi,updateQrCodeApi} from "../../service/api";
import dialogCom from './focusReplyDialog'
export default {
props:[
'newObj'
],
components:{
dialogCom
},
filters: {
typeFilter(value){
if(!value) return '';
if(value === 'text') {
return '文字'
} else if(value === 'image') {
return '图片'
} else if(value === 'news'){
return '图文'
} else if(value === 'video'){
return '视频'
} else if(value === 'voice'){
return '语音'
} else {
return val
}
}
},
data(){
return {
title: '新建二维码',
activeName: 'autoReply',
form:{
title:null,
type:2,
invite_code:null,
status:0,
end_at:null
end_at:null,
id: null
},
dialogObj: {
show:false,
index: -1,
list: []
},
list: [],
pickerOptions1: {
disabledDate(time) {
let date = new Date();
......@@ -99,7 +217,40 @@
],
}
},
mounted(){
this.initDialog();
},
methods:{
allowEdit(){
},
initDialog(){
let _newObj = this.newObj;
this.form = {
title: _newObj.title,
type:_newObj.type,
invite_code:_newObj.invite_code,
status:_newObj.status,
end_at:_newObj.end_at,
id: _newObj.id
}
this.list = _newObj.list ? _newObj.list : [];
if(_newObj.readFlag){
this.title="查看二维码详情"
}
if(_newObj.editFlag){
this.title="编辑二维码详情"
}
if(!_newObj.readFlag && !_newObj.editFlag) {
this.title="新建二维码"
}
},
emotion (res) {
let word = res.replace(/\//gi,'')
const list = ['微笑', '撇嘴', '色', '发呆', '得意', '流泪', '害羞', '闭嘴', '睡', '大哭', '尴尬', '发怒', '调皮', '呲牙', '惊讶', '难过', '酷', '冷汗', '抓狂', '吐', '偷笑', '可爱', '白眼', '傲慢', '饥饿', '困', '惊恐', '流汗', '憨笑', '大兵', '奋斗', '咒骂', '疑问', '嘘', '晕', '折磨', '衰', '骷髅', '敲打', '再见', '擦汗', '抠鼻', '鼓掌', '糗大了', '坏笑', '左哼哼', '右哼哼', '哈欠', '鄙视', '委屈', '快哭了', '阴险', '亲亲', '吓', '可怜', '菜刀', '西瓜', '啤酒', '篮球', '乒乓', '咖啡', '饭', '猪头', '玫瑰', '凋谢', '示爱', '爱心', '心碎', '蛋糕', '闪电', '炸弹', '刀', '足球', '瓢虫', '便便', '月亮', '太阳', '礼物', '拥抱', '强', '弱', '握手', '胜利', '抱拳', '勾引', '拳头', '差劲', '爱你', 'NO', 'OK', '爱情', '飞吻', '跳跳', '发抖', '怄火', '转圈', '磕头', '回头', '跳绳', '挥手', '激动', '街舞', '献吻', '左太极', '右太极']
let index = list.indexOf(word)
return `<img src="https://res.wx.qq.com/mpres/htmledition/images/icon/emotion/${index}.gif" align="middle">`
},
onSave(){
let json = {
title:this.form.title,
......@@ -108,23 +259,170 @@
status:this.form.status,
end_at:this.form.end_at
};
createQrCodeApi(json).then(res=>{
this.$message('创建成功');
this.$emit('initPage');
this.form={
title:null,
type:2,
invite_code:null,
status:0,
end_at:null
};
this.newObj.show=false
if(this.list.length > 0) {
json.auto_reply = JSON.stringify(this.list)
}
if(this.form.id){
updateQrCodeApi(this.form.id, json).then(res=> {
this.$message('修改成功');
this.$emit('initPage');
this.form = {
title: null,
type: 2,
invite_code: null,
status: 0,
end_at: null
};
this.newObj.show = false
this.$emit("changeShow", false);
})
} else {
createQrCodeApi(json).then(res=>{
this.$message('创建成功');
this.$emit('initPage');
this.form={
title:null,
type:2,
invite_code:null,
status:0,
end_at:null
};
this.newObj.show=false
this.$emit("changeShow", false);
})
}
},
changeShow(val){
this.dialogObj.show = val;
},
getReplyList(form){
if(form.index === -1){
let _index = this.list.length === 0 ? -1 : this.list.length - 1
this.list.splice(_index + 1, 0, form.desc)
} else {
this.list.splice(form.index,1,form.desc)
}
},
editRow(index, row){
this.dialogObj = {
show: true,
index: index,
desc: this.list[index]
}
},
addNew(){
this.dialogObj = {
show: true,
index: -1,
desc: {}
}
},
onCancel(){
this.newObj.show = false
this.$emit("changeShow", false);
},
deleteRow(index , list){
this.$confirm('此操作将删除该文件, 是否继续?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
this.list.splice(index,1);
}).catch(()=>{
this.$message({
type: 'success',
message: '已取消删除!'
});
})
}
},
}
}
</script>
<style scoped>
.shotcut {
width: 50px;
}
.clear-both{
&:after{
content: '';
display: block;
clear: both;
}
}
.news-media {
padding: 10px;
width: 200px;
background-color: #fff;
}
.news-media img{
width: 100%;
}
.s-news img {
width: 50px;
float: right;
}
.title {
font-size: 16px;
font-weight: 400;
display: block;
line-height: 1.2;
color: #353535;
}
.digest {
padding-top: 12px;
color: #9A9A9A;
font-size: 14px;
}
.single-cover {
/*padding: 20px 15px 15px;*/
}
.muti-cover {
position: relative;
padding: 20px 15px 0 15px;
}
.bottom-title {
color: #FFFFFF;
background-color: rgba(0, 0, 0, 0.55);
position: absolute;
left: 15px;
right: 15px;
bottom: 0;
padding: 8px 12px;
}
.next-cover {
padding: 12px 15px;
position: relative;
}
.next-img {
float: right;
margin-left: 12px;
width: 60px !important;
height: 60px !important;
}
.next-title {
overflow: hidden;
font-weight: 400;
word-wrap: break-word;
-webkit-hyphens: auto;
-ms-hyphens: auto;
hyphens: auto;
color: #353535;
}
.single-cover:hover .preview,.bottomCover:hover .preview{
display: flex;
justify-content: center;
align-items: center;
color: #fff;
}
.preview {
display: none;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(0,0,0,0.5);
text-decoration: none;
}
</style>
src/components/qrcode/focusReplyDialog.vue 0 → 100644
View file @ 6fa3b93d
<template>
<el-dialog
title="自动回复"
center
:visible.sync="dialogObj.show"
width="800px"
append-to-body>
<div class="focus-reply">
<div class="content">
<div class="inner" v-loading="loading">
<ul class="weui-desktop-msg-sender__tabs">
<li class="weui-desktop-msg-sender__tab weui-desktop-msg-sender__tab_appmsg" :class="type === 'news' ? 'weui-desktop-msg-sender__tab_selected' : ''" @click="onChangeType('news')">图文</li>
<li class="weui-desktop-msg-sender__tab weui-desktop-msg-sender__tab_text" :class="type === 'text' ? 'weui-desktop-msg-sender__tab_selected' : ''" @click="onChangeType('text')">文字</li>
<li class="weui-desktop-msg-sender__tab weui-desktop-msg-sender__tab_img" :class="type === 'image' ? 'weui-desktop-msg-sender__tab_selected' : ''" @click="onChangeType('image')">图片</li>
<li class="weui-desktop-msg-sender__tab weui-desktop-msg-sender__tab_audio" :class="type === 'voice' ? 'weui-desktop-msg-sender__tab_selected' : ''" @click="onChangeType('voice')">语音</li>
<li class="weui-desktop-msg-sender__tab weui-desktop-msg-sender__tab_video" :class="type === 'video' ? 'weui-desktop-msg-sender__tab_selected' : ''" @click="onChangeType('video')">视频</li>
</ul>
<div class="inner-bottom">
<div class="img-action" v-if="type === 'image'">
<template v-if="imageContent ">
<img style="max-width: 80%;" v-if="imageContent.content" :src="imageContent.content"/>
</template>
<div class="display-b">
<div class="img-create-access" v-if="!showMedia">
<a href="javascript:;" class="img-create-access__link" @click="getMediaList('image')">从素材库中选择</a>
</div>
</div>
<div v-if="showMedia && mediaList.length > 0">
<el-table
:data="mediaList"
@row-click="onChooseMedia"
style="width: 100%">
<el-table-column
prop="name"
label="名称">
</el-table-column>
<el-table-column
prop="media_id"
label="mediaId">
</el-table-column>
<el-table-column
label="URL">
<template slot-scope="scope">
<a :href="scope.row.url" target="_blank">
<img style="width: 60px;" :src="scope.row.url"/>
</a>
</template>
</el-table-column>
</el-table>
<page :total="total" v-model="nowPage" :limit="limit" @pageChange="onPageChange"/>
</div>
</div>
<div class="img-action" v-if="type === 'news'">
<template v-if="newsContent && newsContent.content">
<div class="news-media">
<div v-for="(child, childIndex) in newsContent.content.news_item" style="position: relative">
<div v-if="newsContent.content.news_item.length === 1" class="single-cover">
<div class="title">{{child.title}}</div>
<img :src="child.thumb_url" style="width: 100%;margin-top: 20px;"/>
<div class="digest">{{child.digest}}</div>
<a class="preview" :href="child.url" target="_blank">
预览文章
</a>
</div>
<div v-else-if="newsContent.content.news_item.length > 1" class="clear-both bottomCover" style="position: relative">
<div v-if="childIndex === 0" class="muti-cover">
<img style="width: 100%;margin-top: 20px;" :src="child.thumb_url"/>
<div class="bottom-title">{{child.title}}</div>
</div>
<div class="next-cover clear-both" v-else>
<span class="next-title">{{child.title}}</span>
<img class="next-img" :src="child.thumb_url"/>
</div>
<a class="preview" :href="child.url" target="_blank">
预览文章
</a>
</div>
</div>
</div>
</template>
<div class="display-b">
<div class="img-create-access" v-if="!showMedia">
<a href="javascript:;" class="img-create-access__link" @click="getMediaList(type)">从素材库中选择</a>
</div>
</div>
<div v-if="showMedia && mediaList.length > 0">
<el-table
:data="mediaList"
@row-click="onChooseMedia"
style="width: 100%">
<el-table-column
prop="name"
label="名称">
</el-table-column>
<el-table-column
prop="media_id"
label="mediaId">
</el-table-column>
<el-table-column
label="图文"
className="news-media">
<template slot-scope="scope">
<div v-for="(child, childIndex) in scope.row.content.news_item" style="position: relative">
<div v-if="scope.row.content.news_item.length === 1" class="single-cover">
<div class="title">{{child.title}}</div>
<img :src="child.thumb_url" style="width: 100%;margin-top: 20px;"/>
<div class="digest">{{child.digest}}</div>
<a class="preview" :href="child.url" target="_blank">
预览文章
</a>
</div>
<div v-else-if="scope.row.content.news_item.length > 1" class="clear-both bottomCover" style="position: relative">
<div v-if="childIndex === 0" class="muti-cover">
<img style="width: 100%;margin-top: 20px;" :src="child.thumb_url"/>
<div class="bottom-title">{{child.title}}</div>
</div>
<div class="next-cover clear-both" v-else>
<span class="next-title">{{child.title}}</span>
<img class="next-img" :src="child.thumb_url"/>
</div>
<a class="preview" :href="child.url" target="_blank">
预览文章
</a>
</div>
</div>
</template>
</el-table-column>
</el-table>
<page2 :total="total" v-model="nowPage" :limit="limit" @pageChange="onPageChange"/>
</div>
</div>
<div class="img-action" v-if="type === 'video'" style="text-align: left">
<template v-if="videoContent && videoContent.content">
<a :href="videoContent.content.down_url" target="_blank" v-if="videoContent.content && videoContent.content.down_url">
{{videoContent.content.title}}
</a>
</template>
<div class="display-b">
<div class="img-create-access" v-if="!showMedia">
<a href="javascript:;" class="img-create-access__link" @click="getMediaList(type)">从素材库中选择</a>
</div>
</div>
<div v-if="showMedia && mediaList.length > 0">
<el-table
:data="mediaList"
@row-click="onChooseMedia"
style="width: 100%">
<el-table-column
prop="name"
label="名称">
</el-table-column>
<el-table-column
prop="media_id"
label="mediaId">
</el-table-column>
<el-table-column
label="URL">
<template slot-scope="scope">
<a :href="scope.row.info.down_url" target="_blank" v-if="scope.row.info && scope.row.info.down_url">
{{scope.row.info.title}}
</a>
</template>
</el-table-column>
</el-table>
<page3 :total="total" v-model="nowPage" :limit="limit" @pageChange="onPageChange"/>
</div>
</div>
<div class="img-action" v-if="type === 'voice'" style="text-align: left">
<div class="display-b">
<div class="img-create-access" v-if="!showMedia">
<a href="javascript:;" class="img-create-access__link" @click="getMediaList(type)">从素材库中选择</a>
</div>
</div>
<div v-if="showMedia && mediaList.length > 0">
<el-table
:data="mediaList"
@row-click="onChooseMedia"
style="width: 100%">
<el-table-column
prop="name"
label="名称">
</el-table-column>
<el-table-column
prop="media_id"
label="mediaId">
</el-table-column>
<el-table-column
label="URL">
<template slot-scope="scope">
<a :href="scope.row.info.down_url" target="_blank" v-if="scope.row.info && scope.row.info.down_url">
{{scope.row.info.title}}
</a>
</template>
</el-table-column>
</el-table>
<page4 :total="total" v-model="nowPage" :limit="limit" @pageChange="onPageChange"/>
</div>
</div>
<div class="inner-emotion_editor" v-else-if="type === 'text'">
<div class="inner-edit_area">
<el-input
type="textarea"
:autosize="{ minRows: 4, maxRows: 8}"
placeholder="请输入内容"
v-model="content">
</el-input>
</div>
<div style="float: right">
<el-popover
placement="bottom-end"
width="400"
:offset="10"
trigger="manual"
v-model="showEmotion">
<div>
<emotion @emotion="handleEmotion" :height="200" ></emotion>
</div>
<el-button @click="showEmotion = !showEmotion" slot="reference" type="text">
<span class="icon_emotion emotion_switch"></span>
</el-button>
</el-popover>
</div>
</div>
</div>
<div class="tool_bar">
<el-button @click="close">取 消</el-button>
<el-button class="weui-desktop-btn weui-desktop-btn_primary" @click="save">保存</el-button>
</div>
</div>
</div>
</div>
</el-dialog>
</template>
<script>
import {updateConfigApi,saveConfigApi,getMediaListApi,getConfigListApi,getTeacherListApi,uploadFileApi} from "../../service/api";
import page from '../framework/page'
import page2 from '../framework/page'
import page3 from '../framework/page'
import page4 from '../framework/page'
import emotion from '../framework/Emotion/index'
export default {
name: "focusReplyDialog",
props:[
'dialogObj'
],
data(){
return{
show: false,
loading:false,
showEmotion: false,
total:0,
nowPage:1,
limit: 3,
id: null,
form:{
index: -1,
desc: {}
},
content: '',
imageContent: '',
newsContent: '',
videoContent: '',
voiceContent: '',
type: 'news',
mediaList: [],
mediaListMock: [],
showMedia: false,
pickerOptions1: {
disabledDate(time) {
return !(time.getTime() > Date.now());
}
},
rules:{
value:[
{ required: true, message: '请输入规则名称', trigger: 'change' }
],
desc:[
{ required: true, message: '请输入回复内容', trigger: 'change' }
],
qr:[
{ required: true, message: '请输入二维码', trigger: 'change' }
]
},
imageList: [],
uploadShow: true
}
},
components:{
page,
page2,
page3,
page4,
emotion
},
mounted(){
this.initDialog();
},
filters: {
},
methods:{
handleEmotion (i) {
this.content += i
},
onChangeType(type){
this.type = type;
this.mediaList = [];
this.showMedia = false;
this.nowPage = 1;
},
initDialog(){
console.log('initDialog', this.dialogObj)
this.form.index = this.dialogObj.index
this.form.desc = this.dialogObj.desc
if (this.form.index === -1) {
this.type = 'news'
this.newsContent = ''
} else {
this.type = this.form.desc.type;
if (this.type === 'text') {
this.content = this.form.desc.content
} else {
let obj = {
type: this.type
}
if(this.form.desc.content) {
obj.content = this.form.desc.content
}
if(this.form.desc.media_id) {
obj.media_id = this.form.desc.media_id
}
if (this.type === 'image') {
this.imageContent = obj;
} else if (this.type ==='news') {
this.newsContent = obj
} else if (this.type === 'voice') {
this.voiceContent = obj
} else if (this.type === 'video') {
this.videoContent = obj
}
}
}
},
close(){
this.$emit("changeShow", false);
},
save(){
let json = this.form
if (this.type === 'text') {
if (!this.content) {
this.$message({
showClose: true,
message: '请输入文本内容'
});
return;
}
let obj = {
type : this.type,
content: this.content
};
json.desc = obj
} else if (this.type === 'image') {
if (!this.imageContent) {
this.$message({
showClose: true,
message: '请选择图片'
});
return
}
json.desc = this.imageContent
} else if (this.type === 'news') {
if (!this.newsContent) {
this.$message({
showClose: true,
message: '请选择图文'
});
return
}
json.desc = this.newsContent
}else if (this.type === 'video') {
if (!this.videoContent) {
this.$message({
showClose: true,
message: '请选择视频'
});
return
}
json.desc = this.videoContent
}
this.$emit("changeShow", false);
this.$emit("reflash", json)
},
onPageChange(val){
this.nowPage = val
this.getMediaList(this.type)
},
getMediaList(type){
let json = {
type: type,
page: this.nowPage,
limit: this.limit
};
this.loading = true;
getMediaListApi(json).then(res=>{
this.loading = false;
this.type = type;
this.total = res.total_count;
if (res.item.length === 0 ) {
this.$message({
showClose: true,
message: '暂无数据'
});
this.showMedia = false;
} else {
this.showMedia = true;
this.mediaList = res.item;
}
}).catch(() => {
this.loading = false;
this.showMedia = false;
})
},
onChooseMedia(val){
if(this.type === 'news') {
this.addContent(this.type, val.content, val.media_id);
} else if(this.type === 'video'){
this.addContent(this.type, val.info, val.media_id);
} else {
this.addContent(this.type, val.url, val.media_id);
}
this.showMedia = false;
},
addContent(type, content, mediaId) {
let obj = {};
if (content) {
obj = {
type: type,
content: content
};
}
if (mediaId) {
obj.media_id = mediaId;
}
if (type === 'news') {
this.newsContent = obj
} else if(type === 'video'){
this.videoContent = obj
} else{
this.imageContent = obj
}
}
}
}
</script>
<style scoped>
.focus-reply {
padding: 30px;
}
ul, ol {
padding-left: 0;
list-style-type: none;
}
.title {
color: #353535;
font-size: 20px;
font-weight: 400;
line-height: 1;
}
.content {
}
.inner {
position: relative;
border: 1px solid #E4E8EB;
background-color: #FFFFFF;
}
.inner-bottom {
border-top: 1px solid #E4E8EB;
}
.img-action {
padding: 17px 20px;
min-height: 215px;
text-align: center;
}
.img-create-access {
position: relative;
border: 2px dotted #E4E8EB;
width: 48.6%;
height: 211px;
text-align: center;
}
/*.img-create-access:first-child {*/
/*float: left;*/
/*}*/
.img-create-access__link {
display: inline-block;
vertical-align: middle;
color: #9A9A9A;
margin: 0 10px;
margin-top: 68px;
text-decoration: none;
}
.img-create-access__link:before {
content: " ";
display: block;
width: 36px;
height: 36px;
margin: 0 auto 5px;
background: transparent url(https://res.wx.qq.com/mpres/en_US/htmledition/pages/modules/msg_sender/images/icon36_add_gray.png) no-repeat 0 0;
}
.weui-desktop-msg-sender__tabs {
line-height: 38px;
background-color: #FFFFFF;
}
.sender__tab_selected {
color: #44B549;
}
.weui-desktop-msg-sender__tab:hover, .weui-desktop-msg-sender__tab_selected {
color: #44B549;
}
.weui-desktop-msg-sender__tab {
display: inline-block;
padding: 0 20px;
cursor: pointer;
}
.weui-desktop-msg-sender__tab:hover.weui-desktop-msg-sender__tab_text:before, .weui-desktop-msg-sender__tab_selected.weui-desktop-msg-sender__tab_text:before {
background-image: url(https://res.wx.qq.com/mpres/en_US/htmledition/pages/modules/msg_sender/svg/default/sender_text_current.svg);
}
.weui-desktop-msg-sender__tab_img:before {
background: transparent url(https://res.wx.qq.com/mpres/en_US/htmledition/pages/modules/msg_sender/svg/default/sender_img.svg) no-repeat 0 0;
}
.weui-desktop-msg-sender__tab:hover.weui-desktop-msg-sender__tab_img:before, .weui-desktop-msg-sender__tab_selected.weui-desktop-msg-sender__tab_img:before {
background-image: url(https://res.wx.qq.com/mpres/en_US/htmledition/pages/modules/msg_sender/svg/default/sender_img_current.svg);
}
.weui-desktop-msg-sender__tab_video:before {
background: transparent url(https://res.wx.qq.com/mpres/en_US/htmledition/pages/modules/msg_sender/svg/default/sender_video.svg) no-repeat 0 0;
}
.weui-desktop-msg-sender__tab:hover.weui-desktop-msg-sender__tab_video:before, .weui-desktop-msg-sender__tab_selected.weui-desktop-msg-sender__tab_video:before {
background-image: url(https://res.wx.qq.com/mpres/en_US/htmledition/pages/modules/msg_sender/svg/default/sender_video_current.svg);
}
.weui-desktop-msg-sender__tab_audio:before {
background: transparent url(https://res.wx.qq.com/mpres/en_US/htmledition/pages/modules/msg_sender/svg/default/sender_audio.svg) no-repeat 0 0;
}
.weui-desktop-msg-sender__tab:hover.weui-desktop-msg-sender__tab_audio:before, .weui-desktop-msg-sender__tab_selected.weui-desktop-msg-sender__tab_audio:before {
background-image: url(https://res.wx.qq.com/mpres/en_US/htmledition/pages/modules/msg_sender/svg/default/sender_audio_current.svg);
}
.weui-desktop-msg-sender__tab_appmsg:before {
background: transparent url(https://res.wx.qq.com/mpres/zh_CN/htmledition/pages/modules/msg_sender/svg/default/sender_appmsg3c96b5.svg) no-repeat 0 0;
}
.weui-desktop-msg-sender__tab:hover.weui-desktop-msg-sender__tab_appmsg:before, .weui-desktop-msg-sender__tab_selected.weui-desktop-msg-sender__tab_appmsg:before {
background-image: url(https://res.wx.qq.com/mpres/zh_CN/htmledition/pages/modules/msg_sender/svg/default/sender_appmsg_current3c96b5.svg);
}
.weui-desktop-msg-sender__tab:before {
content: " ";
display: inline-block;
width: 22px;
height: 20px;
vertical-align: middle;
margin: -0.2em 5px 0 0;
}
.tool_bar {
padding-top: 0;
padding-bottom: 50px;
/*margin-top: 40px;*/
margin-left: 20px;
}
.tool_bar > .weui-desktop-btn {
margin-right: 1em;
}
.weui-desktop-btn_primary {
background-color: #1AAD19;
border-color: #1AAD19;
color: #FFFFFF;
}
.weui-desktop-btn {
display: inline-block;
padding: 0 22px;
min-width: 54px;
line-height: 2.42857143;
vertical-align: middle;
text-align: center;
text-decoration: none;
border-radius: 3px;
font-size: 14px;
cursor: pointer;
border-width: 1px;
border-style: solid;
box-sizing: content-box;
}
.weui-desktop-popover__wrp {
display: inline;
position: relative;
font-size: 14px;
}
.weui-desktop-btn_default {
background-color: #FBFBFB;
border-color: #E4E8EB;
color: #353535;
}
.inner-emotion_editor {
margin: 2%;
}
.shotcut {
width: 50px;
}
.emotion_switch {
float: left;
height: 28px;
line-height: 999em;
overflow: hidden;
background: transparent url(https://res.wx.qq.com/mpres/en_US/htmledition/pages/modules/reply/images/icon_emotion_switch.png) no-repeat 0 0;
width: 20px;
height: 20px;
vertical-align: middle;
display: inline-block;
}
.display-b {
display: flex;
flex-flow: row nowrap;
justify-content: space-between;
align-items: center;
}
.my-teacher{
height: 150px;
line-height: 150px;
width: 50%;
margin-left: 25%;
border: 1px dashed #666;
margin-bottom: 10px;
}
.news-media {
padding: 10px;
width: 300px;
}
.news-media img{
width: 100%;
}
.s-news img {
width: 50px;
float: right;
}
.title {
font-size: 16px;
font-weight: 400;
display: block;
line-height: 1.2;
color: #353535;
}
.digest {
padding-top: 12px;
color: #9A9A9A;
font-size: 14px;
}
.single-cover {
/*padding: 20px 15px 15px;*/
}
.muti-cover {
position: relative;
padding: 20px 15px 0 15px;
}
.bottom-title {
color: #FFFFFF;
background-color: rgba(0, 0, 0, 0.55);
position: absolute;
left: 15px;
right: 15px;
bottom: 0;
padding: 8px 12px;
}
.next-cover {
padding: 12px 15px;
position: relative;
}
.next-img {
float: right;
margin-left: 12px;
width: 60px !important;
height: 60px !important;
}
.next-title {
overflow: hidden;
font-weight: 400;
word-wrap: break-word;
-webkit-hyphens: auto;
-ms-hyphens: auto;
hyphens: auto;
color: #353535;
}
.single-cover:hover .preview,.bottomCover:hover .preview{
display: flex;
justify-content: center;
align-items: center;
color: #fff;
}
.preview {
display: none;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(0,0,0,0.5);
text-decoration: none;
}
</style>
<style>
.clear-both:after{
content: '';
display: block;
clear: both;
}
.disabled .el-upload--picture-card {
display: none !important;
}
</style>
src/components/qrcode/index.vue
View file @ 6fa3b93d
......@@ -80,15 +80,35 @@
</a>
</template>
</el-table-column>
<el-table-column
fixed="right"
label="操作"
width="150">
<template slot-scope="scope">
<el-button
@click.native.prevent="editRow(scope.$index, list)"
type="text"
size="small"
v-if="!$store.state.readonly">
编辑
</el-button>
<el-button
@click.native.prevent="detail(scope.$index, list)"
type="text"
size="small">
查看详情
</el-button>
</template>
</el-table-column>
</el-table>
<page :nowPage="nowPage" :total="total" :limit="limit" @pageChange="onPageChange"/>
<dialog-div :newObj="newObj" @initPage="initPage"></dialog-div>
<dialog-div v-if="newObj.show" :newObj="newObj" @initPage="initPage" @changeShow="changeShow"></dialog-div>
</div>
</template>
<script>
import dialogDiv from './dialog'
import {getQrCodeListApi} from "../../service/api";
import {getQrCodeListApi,getQrCodeDetailUrlApi} from "../../service/api";
import {QRCODETYPE,QRSTATUS,QRTYPE} from "../../util/wordbook";
import page from '../framework/page'
export default {
......@@ -171,17 +191,85 @@
},
initPage(){
let json = {
title:this.searchFrom.title,
type:this.searchFrom.type,
code_type:this.searchFrom.code_type,
status:this.searchFrom.status,
limit: this.limit,
page: this.nowPage
};
if(this.searchFrom.title){
json.title = this.searchFrom.title
}
if(this.searchFrom.type){
json.type = this.searchFrom.type
}
if(this.searchFrom.code_type){
json.code_type = this.searchFrom.code_type
}
if(this.searchFrom.status){
json.status = this.searchFrom.status
}
getQrCodeListApi(json).then(res=>{
this.list = res.list;
this.total = res.total
this.list = res ? res.list : [];
this.total = res ? res.total : 0;
})
},
newQrcode(){
this.newObj = {
show: true,
title:null,
type:2,
invite_code:null,
status:0,
end_at:null
}
},
editRow(index, list){
let _obj = list[index]
getQrCodeDetailUrlApi(_obj.id).then(res=> {
this.newObj = {
title: res.title,
type: res.type,
invite_code: res.invite_code ? res.invite_code.split('-')[2] : '',
status: res.status,
end_at: res.end_at,
id: _obj.id
}
if(res.auto_reply){
this.newObj.list = JSON.parse(res.auto_reply)
}
this.newObj.editFlag = true;
this.newObj.show = true;
});
},
detail(index, list){
let _obj = list[index]
getQrCodeDetailUrlApi(_obj.id).then(res=> {
this.newObj = {
title: res.title,
type: res.type,
invite_code: res.invite_code ? res.invite_code.split('-')[2] : '',
status: res.status,
end_at: res.end_at,
id: _obj.id
}
if(res.auto_reply){
this.newObj.list = JSON.parse(res.auto_reply)
}
this.newObj.readFlag = true;
this.newObj.show = true;
});
},
changeShow(val){
this.newObj = {
show: false,
title:null,
type:2,
invite_code:null,
status:0,
end_at:null
}
},
getQrCodeDetail(id){
getQrCodeDetailUrlApi(id).then(res=> {
})
}
}
......
src/service/api.js
View file @ 6fa3b93d
......@@ -574,3 +574,13 @@ const getDefaultPeriodsUrl = '/api/admin/periods/default';
export const getDefaultPeriodsApi = function () {
return Vue.prototype.$fetch(getDefaultPeriodsUrl)
};
// 修改二维码管理
const updateQrCodeUrl = 'api/admin/wechat/qrcode';
export const updateQrCodeApi = function (id, json) {
return Vue.prototype.$put(`${updateQrCodeUrl}/${id}`,json)
};
// 获取二维码列表详情
const getQrCodeDetailUrl = 'api/admin/wechat/qrcode';
export const getQrCodeDetailUrlApi = function (id) {
return Vue.prototype.$fetch(`${getQrCodeDetailUrl}/${id}`)
};
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