Skip to content

A
admin-base
Commit e754a0bf authored by chenfenglei's avatar chenfenglei
Browse files
Options

公众号页面样式优化

parent 1e863357
Hide whitespace changes
Inline Side-by-side
Showing with 801 additions and 650 deletions
src/components/groupSend/index.vue
View file @ e754a0bf
...@@ -140,20 +140,20 @@ ...@@ -140,20 +140,20 @@
v-model="content"> v-model="content">
</el-input> </el-input>
</div> </div>
<div style="float: right"> <div style="float: right;margin-right:15px;">
<el-popover <el-popover
placement="bottom-end" placement="bottom-end"
width="400" width="400"
:offset="10" :offset="10"
trigger="manual" trigger="hover"
v-model="showEmotion"> v-model="showEmotion">
<div> <div>
<emotion @emotion="handleEmotion" :height="200" ></emotion> <emotion @emotion="handleEmotion" :height="200"></emotion>
</div> </div>
<el-button @click="showEmotion = !showEmotion" slot="reference" type="text"> <el-button @click="showEmotion = !showEmotion" slot="reference" type="text">
<span class="icon_emotion emotion_switch"></span> <span class="icon_emotion emotion_switch" ></span>
</el-button> </el-button>
</el-popover> </el-popover>
</div> </div>
</el-tab-pane> </el-tab-pane>
<el-tab-pane label="图片" name="image"> <el-tab-pane label="图片" name="image">
...@@ -384,545 +384,696 @@ ...@@ -384,545 +384,696 @@
</template> </template>
<script> <script>
import {uploadFileApi,getMsgListApi,sendMsgApi,getUserListApi,getMediaListApi} from "../../service/api"; import {
import page from '../framework/page' uploadFileApi,
import page2 from '../framework/page' getMsgListApi,
import pageImage from '../framework/page' sendMsgApi,
import pageVideo from '../framework/page' getUserListApi,
import emotion from '../framework/Emotion/index' getMediaListApi
import CommonJs from '../../util/common'; } from "../../service/api";
export default { import page from "../framework/page";
name: "index", import page2 from "../framework/page";
components: { import pageImage from "../framework/page";
page, import pageVideo from "../framework/page";
page2, import emotion from "../framework/Emotion/index";
pageImage, import CommonJs from "../../util/common";
pageVideo, export default {
emotion name: "index",
}, components: {
data() { page,
return { page2,
pageImage,
pageVideo,
emotion
},
data() {
return {
nowPage: 1,
total: 0,
limit: 10,
mediaPage: {
nowPage: 1, nowPage: 1,
total: 0, total: 0,
limit: 10, limit: 5
mediaPage: {
nowPage: 1,
total: 0,
limit: 5,
},
show: false,
loading: false,
activeName: 'text',
list: [],
content: '',
uploadShow: true,
imageList: [],
fileList: [],
imageContent: '',
videoContent: '',
searchFrom: {
type: 1,
is_test: false
},
tableData: [],
fileUid: null,
userDialog: {
total: 0,
limit: 10,
nowPage: 1,
show: false
},
userList: [],
searchUserFrom: {},
multipleSelection: [],
showEmotion: false,
showMedia: false,
showImage: false,
showVideo: false,
mediaList: [],
mediaImageList: [],
mediaVideoList: [],
mediaImagePage: {
nowPage: 1,
total: 0,
limit: 5,
},
mediaVideoPage: {
nowPage: 1,
total: 0,
limit: 5,
},
imageContent: null,
videoContent: null,
newsContent: null
}
},
filters: {
typeFilter(val){
if(!val) return;
if(val === 'text') return '文本';
if(val === 'image') return '图片';
if(val === 'video') return '视频';
if(val === 'news') return '图文';
}, },
typeListFilter(val){ show: false,
if (!val) return ''; loading: false,
if(val === 1) return '48时内关注但未购课用户'; activeName: "text",
if(val === 2) return '有体验课但没有正式课用户'; list: [],
if(val === 3) return '未试听用户'; content: "",
} uploadShow: true,
}, imageList: [],
methods: { fileList: [],
handleClick(tab) { imageContent: "",
this.activeName = tab.name; videoContent: "",
}, searchFrom: {
handleRemove(){ type: 1,
this.uploadShow = true is_test: false
this.imageList = []
this.imageContent = '';
}, },
handleRemoveVideo(){ tableData: [],
this.videoContent = ''; fileUid: null,
this.fileList = [] userDialog: {
total: 0,
limit: 10,
nowPage: 1,
show: false
}, },
beforeAvatarUpload(){ userList: [],
this.uploadShow = false searchUserFrom: {},
multipleSelection: [],
showEmotion: false,
showMedia: false,
showImage: false,
showVideo: false,
mediaList: [],
mediaImageList: [],
mediaVideoList: [],
mediaImagePage: {
nowPage: 1,
total: 0,
limit: 5
}, },
handleAvatarSuccess(res) { mediaVideoPage: {
this.imageList = [{name:res.data.url,url:process.env.IMAGE_URL_HEAD + res.data.url}] nowPage: 1,
total: 0,
limit: 5
}, },
uploadFile(a) { imageContent: null,
this.$store.dispatch('setProgress',{type:'new',id:a.file.uid}); videoContent: null,
uploadFileApi({file:a.file,type:'wechat'}).then(res=>{ newsContent: null
};
},
filters: {
typeFilter(val) {
if (!val) return;
if (val === "text") return "文本";
if (val === "image") return "图片";
if (val === "video") return "视频";
if (val === "news") return "图文";
},
typeListFilter(val) {
if (!val) return "";
if (val === 1) return "48时内关注但未购课用户";
if (val === 2) return "有体验课但没有正式课用户";
if (val === 3) return "未试听用户";
}
},
methods: {
handleClick(tab) {
this.activeName = tab.name;
},
handleRemove() {
this.uploadShow = true;
this.imageList = [];
this.imageContent = "";
},
handleRemoveVideo() {
this.videoContent = "";
this.fileList = [];
},
beforeAvatarUpload() {
this.uploadShow = false;
},
handleAvatarSuccess(res) {
this.imageList = [
{ name: res.data.url, url: process.env.IMAGE_URL_HEAD + res.data.url }
];
},
uploadFile(a) {
this.$store.dispatch("setProgress", { type: "new", id: a.file.uid });
uploadFileApi({ file: a.file, type: "wechat" })
.then(res => {
this.imageContent = { this.imageContent = {
content: res.media_id, content: res.media_id,
url: res.url url: res.url
} };
this.imageList = [{name:res.media_id,url:res.url}] this.imageList = [{ name: res.media_id, url: res.url }];
this.$message({ this.$message({
type: 'success', type: "success",
message: '上传成功!' message: "上传成功!"
}); });
}).catch(()=>{ })
.catch(() => {
this.$message({ this.$message({
type: 'error', type: "error",
message: '上传失败!' message: "上传失败!"
}); });
});
},
uploadVideo(a) {
uploadFileApi({ file: a.file, type: "wechat" })
.then(res => {
this.uploadVideoFile(a, res);
}) })
}, .catch(() => {
uploadVideo(a){
uploadFileApi({file:a.file,type:'wechat'}).then(res=>{
this.uploadVideoFile(a, res)
}).catch(()=>{
this.$message({ this.$message({
type: 'error', type: "error",
message: '上传失败!' message: "上传失败!"
}); });
}) });
}, },
uploadVideoFile(a,data) { uploadVideoFile(a, data) {
this.fileUid = a.file.uid; this.fileUid = a.file.uid;
this.loading = true; this.loading = true;
this.$store.dispatch('setProgress',{type:'new',id:a.file.uid}); this.$store.dispatch("setProgress", { type: "new", id: a.file.uid });
uploadFileApi({file:a.file,type:'local'}).then(res=>{ uploadFileApi({ file: a.file, type: "local" })
.then(res => {
this.videoContent = { this.videoContent = {
content: data.media_id, content: data.media_id,
url: process.env.IMAGE_URL_HEAD + res.url url: process.env.IMAGE_URL_HEAD + res.url
} };
this.fileList = [{name:res.name,url:process.env.IMAGE_URL_HEAD + res.url}] this.fileList = [
{ name: res.name, url: process.env.IMAGE_URL_HEAD + res.url }
];
this.loading = false; this.loading = false;
this.$message({ this.$message({
type: 'success', type: "success",
message: '上传成功!' message: "上传成功!"
}); });
this.$store.dispatch('setProgress',{type:'delete',id:a.file.uid}); this.$store.dispatch("setProgress", {
this.fileUid=null type: "delete",
}).catch(()=>{ id: a.file.uid
});
this.fileUid = null;
})
.catch(() => {
this.loading = false; this.loading = false;
this.$message({ this.$message({
type: 'error', type: "error",
message: '上传失败!' message: "上传失败!"
}); });
}) });
}, },
send(){ send() {
let json = {} let json = {};
json.type = this.searchFrom.type json.type = this.searchFrom.type;
let msgTips = this.searchFrom.is_test ? '发送筛选用户,' : '不发送筛选用户,'; let msgTips = this.searchFrom.is_test
if(this.searchFrom.type === 1){ ? "发送筛选用户,"
if(this.searchFrom.time && this.searchFrom.time.length > 0){ : "不发送筛选用户,";
console.log('this.searchFrom.time', this.searchFrom.time) if (this.searchFrom.type === 1) {
json.start_at = CommonJs.dateFmt(this.searchFrom.time[0],"yyyy-MM-dd hh:mm:ss"); if (this.searchFrom.time && this.searchFrom.time.length > 0) {
json.end_at = CommonJs.dateFmt(this.searchFrom.time[1],"yyyy-MM-dd hh:mm:ss"); console.log("this.searchFrom.time", this.searchFrom.time);
msgTips += '48时内关注但未购课用户(' + json.start_at + '～' + json.end_at + ','; json.start_at = CommonJs.dateFmt(
} else { this.searchFrom.time[0],
this.$message({ "yyyy-MM-dd hh:mm:ss"
type: 'error', );
message: '请选择时间!' json.end_at = CommonJs.dateFmt(
}); this.searchFrom.time[1],
return "yyyy-MM-dd hh:mm:ss"
} );
} else if (this.searchFrom.type === 2) { msgTips +=
msgTips += '有体验课但没有正式课用户,' "48时内关注但未购课用户(" +
} else if (this.searchFrom.type === 3) { json.start_at +
msgTips += '未试听用户,' "～" +
json.end_at +
",";
} else {
this.$message({
type: "error",
message: "请选择时间!"
});
return;
} }
if(this.searchFrom.user_ids){ } else if (this.searchFrom.type === 2) {
json.user_ids = this.searchFrom.user_ids msgTips += "有体验课但没有正式课用户,";
msgTips += '用户ID：'+ json.user_ids; } else if (this.searchFrom.type === 3) {
}else { msgTips += "未试听用户,";
}
if (this.searchFrom.user_ids) {
json.user_ids = this.searchFrom.user_ids;
msgTips += "用户ID：" + json.user_ids;
} else {
this.$message({
type: "error",
message: "请加入内部人员!"
});
return;
}
let _content = {};
_content.type = this.activeName;
if (this.activeName === "text") {
if (!this.content) {
this.$message({ this.$message({
type: 'error', type: "error",
message: '请加入内部人员!' message: "请输入文本!"
}); });
return; return;
} else {
_content.content = this.content;
} }
let _content = {} } else if (this.activeName === "image") {
_content.type = this.activeName; if (!this.imageContent) {
if (this.activeName === 'text') { this.$message({
if(!this.content) { type: "error",
this.$message({ message: "请上传图片!"
type: 'error', });
message: '请输入文本!' return;
}); } else {
return _content.content = this.imageContent.content;
} else { _content.url = this.imageContent.url;
_content.content = this.content;
}
} else if (this.activeName === 'image') {
if(!this.imageContent) {
this.$message({
type: 'error',
message: '请上传图片!'
});
return
} else {
_content.content = this.imageContent.content;
_content.url = this.imageContent.url;
}
} else if (this.activeName === 'video') {
if(!this.videoContent) {
this.$message({
type: 'error',
message: '请上传视频!'
});
return
} else {
_content.content = this.videoContent.content;
_content.url = this.videoContent.url
}
} else if (this.activeName === 'news'){
if (this.newsContent && this.newsContent.media_id) {
_content.content = this.newsContent.media_id
} else {
this.$message({
type: 'error',
message: '请选择图文!'
});
}
} }
json.content = JSON.stringify(_content) } else if (this.activeName === "video") {
json.is_test = this.searchFrom.is_test ? 2 : 1 if (!this.videoContent) {
console.log("json", json); this.$message({
this.$confirm(msgTips, '提示', { type: "error",
confirmButtonText: '确定', message: "请上传视频!"
cancelButtonText: '取消', });
type: 'warning' return;
}).then(() => { } else {
sendMsgApi(json).then((res)=>{ _content.content = this.videoContent.content;
_content.url = this.videoContent.url;
}
} else if (this.activeName === "news") {
if (this.newsContent && this.newsContent.media_id) {
_content.content = this.newsContent.media_id;
} else {
this.$message({
type: "error",
message: "请选择图文!"
});
}
}
json.content = JSON.stringify(_content);
json.is_test = this.searchFrom.is_test ? 2 : 1;
console.log("json", json);
this.$confirm(msgTips, "提示", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning"
})
.then(() => {
sendMsgApi(json).then(res => {
this.$message({ this.$message({
message: res, message: res,
type: 'success' type: "success"
}); });
this.show = false; this.show = false;
this.clearData(); this.clearData();
this.getMsgList(); this.getMsgList();
})
}).catch(() => {
this.$message({
type: 'info',
message: '已取消发送'
}); });
});
},
clearData(){
this.content = '';
this.videoContent = null;
this.imageContent = null;
this.newsContent = null;
this.activeName === 'text';
this.searchFrom = {};
this.fileList = [];
this.imageList = [];
},
getMsgList(){
let json = {
limit: this.limit,
page: this.nowPage
};
getMsgListApi(json).then((res)=>{
this.tableData = res.list;
this.total = res.total
}) })
}, .catch(() => {
onMediaPageChange(val){
this.mediaPage.nowPage = val
this.getMediaList()
},
onMediaSizeChange(){
this.mediaPage.nowPage = 1
this.mediaPage.limit = val
this.getMediaList()
},
onImagePageChange(val){
this.mediaImagePage.nowPage = val
this.getMediaList()
},
onImageSizeChange(val){
this.mediaImagePage.nowPage = 1
this.mediaImagePage.limit = val
this.getMediaList()
},
onVideoPageChange(val){
this.mediaVideoPage.nowPage = val
this.getMediaList()
},
onVideoSizeChange(val){
this.mediaVideoPage.nowPage = 1
this.mediaVideoPage.limit = val
this.getMediaList()
},
onPageChange(val){
this.nowPage = val
this.getMsgList()
},
onSizeChange(val){
this.nowPage = 1
this.limit = val
this.getMsgList()
},
getMsgResult(id){
if(!id) return;
let json = {
only_text: 1,
send_id: id
};
getMsgListApi(json).then((res)=>{
this.$message({
message: res,
type: 'success'
});
this.getMsgList();
})
},
getUser(){
let json = {
page: this.userDialog.nowPage,
limit: this.userDialog.limit
};
if (this.searchUserFrom.userId) {
json.user_id = this.searchUserFrom.userId
}
if (this.searchUserFrom.nickName) {
json.nickname = this.searchUserFrom.nickName
}
if (this.searchUserFrom.mobile) {
json.mobile = this.searchUserFrom.mobile
}
getUserListApi(json).then(res=>{
this.userList = res.list;
this.userDialog.total = res.total;
})
},
onUserPageChange(val){
this.userDialog.nowPage = val
this.getUser()
},
onUserSizeChange(val){
this.userDialog.nowPage = 1
this.userDialog.limit = val
this.getUser()
},
handleSelectionChange(val) {
this.multipleSelection = val;
},
onSelectUser(){
this.userDialog.show = true;
if(this.searchFrom.user_ids) {
this.multipleSelection = this.searchFrom.user_ids.split(',');
} else {
this.multipleSelection = []
}
this.getUser();
},
onConfirm(){
let _list = this.multipleSelection;
if(_list.length === 0) {
this.$message({ this.$message({
type: 'error', type: "info",
message: '请选择用户!' message: "已取消发送"
}); });
} else { });
let _userIds = []; },
_list.forEach((item)=>{ clearData() {
_userIds.push(item.user_id) this.content = "";
}) this.videoContent = null;
let _tmp = _userIds this.imageContent = null;
if (this.searchFrom.user_ids) { this.newsContent = null;
_tmp = _userIds.concat(this.stringToInt(this.searchFrom.user_ids.split(','))); this.activeName === "text";
} this.searchFrom = {};
let _result = this.dedupe(_tmp); this.fileList = [];
this.searchFrom.user_ids = _result.join(','); this.imageList = [];
this.userDialog.show = false; },
} getMsgList() {
}, let json = {
dedupe(array){ limit: this.limit,
return Array.from(new Set(array)); page: this.nowPage
}, };
stringToInt(list){ getMsgListApi(json).then(res => {
let _list = list || []; this.tableData = res.list;
_list = _list.map((val)=>{ this.total = res.total;
return parseInt(val, 10) });
}) },
return _list; onMediaPageChange(val) {
}, this.mediaPage.nowPage = val;
emotion (res) { this.getMediaList();
let word = res.replace(/\//gi,'') },
const list = ['微笑', '撇嘴', '色', '发呆', '得意', '流泪', '害羞', '闭嘴', '睡', '大哭', '尴尬', '发怒', '调皮', '呲牙', '惊讶', '难过', '酷', '冷汗', '抓狂', '吐', '偷笑', '可爱', '白眼', '傲慢', '饥饿', '困', '惊恐', '流汗', '憨笑', '大兵', '奋斗', '咒骂', '疑问', '嘘', '晕', '折磨', '衰', '骷髅', '敲打', '再见', '擦汗', '抠鼻', '鼓掌', '糗大了', '坏笑', '左哼哼', '右哼哼', '哈欠', '鄙视', '委屈', '快哭了', '阴险', '亲亲', '吓', '可怜', '菜刀', '西瓜', '啤酒', '篮球', '乒乓', '咖啡', '饭', '猪头', '玫瑰', '凋谢', '示爱', '爱心', '心碎', '蛋糕', '闪电', '炸弹', '刀', '足球', '瓢虫', '便便', '月亮', '太阳', '礼物', '拥抱', '强', '弱', '握手', '胜利', '抱拳', '勾引', '拳头', '差劲', '爱你', 'NO', 'OK', '爱情', '飞吻', '跳跳', '发抖', '怄火', '转圈', '磕头', '回头', '跳绳', '挥手', '激动', '街舞', '献吻', '左太极', '右太极'] onMediaSizeChange() {
let index = list.indexOf(word) this.mediaPage.nowPage = 1;
return `<img src="https://res.wx.qq.com/mpres/htmledition/images/icon/emotion/${index}.gif" align="middle">` this.mediaPage.limit = val;
}, this.getMediaList();
handleEmotion (i) { },
this.content += i onImagePageChange(val) {
}, this.mediaImagePage.nowPage = val;
onChooseMedia(val){ this.getMediaList();
console.log('onChooseMedia', val) },
if (this.type === 'image') { onImageSizeChange(val) {
this.imageContent = { this.mediaImagePage.nowPage = 1;
content: val.media_id, this.mediaImagePage.limit = val;
url: val.url this.getMediaList();
} },
this.imageList = [{name:val.media_id,url:val.url}] onVideoPageChange(val) {
this.showImage = false; this.mediaVideoPage.nowPage = val;
} else if (this.type === 'video'){ this.getMediaList();
this.videoContent = { },
content: val.media_id, onVideoSizeChange(val) {
url: val.info.down_url this.mediaVideoPage.nowPage = 1;
} this.mediaVideoPage.limit = val;
this.fileList = [{name:val.info.title,url:val.info.url}] this.getMediaList();
this.showVideo = false; },
} else if (this.type === 'news'){ onPageChange(val) {
this.newsContent = val this.nowPage = val;
this.showMedia = false; this.getMsgList();
},
onSizeChange(val) {
this.nowPage = 1;
this.limit = val;
this.getMsgList();
},
getMsgResult(id) {
if (!id) return;
let json = {
only_text: 1,
send_id: id
};
getMsgListApi(json).then(res => {
this.$message({
message: res,
type: "success"
});
this.getMsgList();
});
},
getUser() {
let json = {
page: this.userDialog.nowPage,
limit: this.userDialog.limit
};
if (this.searchUserFrom.userId) {
json.user_id = this.searchUserFrom.userId;
}
if (this.searchUserFrom.nickName) {
json.nickname = this.searchUserFrom.nickName;
}
if (this.searchUserFrom.mobile) {
json.mobile = this.searchUserFrom.mobile;
}
getUserListApi(json).then(res => {
this.userList = res.list;
this.userDialog.total = res.total;
});
},
onUserPageChange(val) {
this.userDialog.nowPage = val;
this.getUser();
},
onUserSizeChange(val) {
this.userDialog.nowPage = 1;
this.userDialog.limit = val;
this.getUser();
},
handleSelectionChange(val) {
this.multipleSelection = val;
},
onSelectUser() {
this.userDialog.show = true;
if (this.searchFrom.user_ids) {
this.multipleSelection = this.searchFrom.user_ids.split(",");
} else {
this.multipleSelection = [];
}
this.getUser();
},
onConfirm() {
let _list = this.multipleSelection;
if (_list.length === 0) {
this.$message({
type: "error",
message: "请选择用户!"
});
} else {
let _userIds = [];
_list.forEach(item => {
_userIds.push(item.user_id);
});
let _tmp = _userIds;
if (this.searchFrom.user_ids) {
_tmp = _userIds.concat(
this.stringToInt(this.searchFrom.user_ids.split(","))
);
} }
}, let _result = this.dedupe(_tmp);
getMediaList(){ this.searchFrom.user_ids = _result.join(",");
let type = this.activeName; this.userDialog.show = false;
let json = { }
type: type, },
page: this.mediaPage.nowPage, dedupe(array) {
limit: this.mediaPage.limit return Array.from(new Set(array));
},
stringToInt(list) {
let _list = list || [];
_list = _list.map(val => {
return parseInt(val, 10);
});
return _list;
},
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">`;
},
handleEmotion(i) {
this.content += i;
},
onChooseMedia(val) {
console.log("onChooseMedia", val);
if (this.type === "image") {
this.imageContent = {
content: val.media_id,
url: val.url
}; };
if(type === 'image'){ this.imageList = [{ name: val.media_id, url: val.url }];
json.page = this.mediaImagePage.nowPage this.showImage = false;
json.limit = this.mediaImagePage.limit } else if (this.type === "video") {
this.showImage = true; this.videoContent = {
}else if (type === 'video'){ content: val.media_id,
json.page = this.mediaVideoPage.nowPage url: val.info.down_url
json.limit = this.mediaVideoPage.limit };
this.showVideo = true; this.fileList = [{ name: val.info.title, url: val.info.url }];
}else if (type === 'news'){ this.showVideo = false;
json.page = this.mediaPage.nowPage } else if (this.type === "news") {
json.limit = this.mediaPage.limit this.newsContent = val;
this.showMedia = true; this.showMedia = false;
} }
this.loading = true; },
getMediaListApi(json).then(res=>{ getMediaList() {
let type = this.activeName;
let json = {
type: type,
page: this.mediaPage.nowPage,
limit: this.mediaPage.limit
};
if (type === "image") {
json.page = this.mediaImagePage.nowPage;
json.limit = this.mediaImagePage.limit;
this.showImage = true;
} else if (type === "video") {
json.page = this.mediaVideoPage.nowPage;
json.limit = this.mediaVideoPage.limit;
this.showVideo = true;
} else if (type === "news") {
json.page = this.mediaPage.nowPage;
json.limit = this.mediaPage.limit;
this.showMedia = true;
}
this.loading = true;
getMediaListApi(json)
.then(res => {
this.loading = false; this.loading = false;
this.type = type; this.type = type;
this.mediaList = res.item; this.mediaList = res.item;
this.mediaPage.total = res.total_count; this.mediaPage.total = res.total_count;
if(type === 'image'){ if (type === "image") {
this.mediaImageList = res.item; this.mediaImageList = res.item;
this.mediaImagePage.total = res.total_count; this.mediaImagePage.total = res.total_count;
}else if (type === 'video'){ } else if (type === "video") {
this.mediaVideoList = res.item; this.mediaVideoList = res.item;
this.mediaVideoPage.total = res.total_count; this.mediaVideoPage.total = res.total_count;
}else if (type === 'news'){ } else if (type === "news") {
this.mediaList = res.item; this.mediaList = res.item;
this.mediaPage.total = res.total_count; this.mediaPage.total = res.total_count;
} }
if (this.total === 0 ) { if (this.total === 0) {
this.$message({ this.$message({
showClose: true, showClose: true,
message: '暂无数据' message: "暂无数据"
}); });
} }
}).catch(() => {
this.loading = false;
}) })
}, .catch(() => {
defaultTime(){ this.loading = false;
let date = new Date(); });
let now_seconds = date.getTime();
let start_seconds = now_seconds - 48 * 60 * 60 * 1000;
this.searchFrom.time = [new Date (start_seconds),new Date (now_seconds)]
}
},
mounted(){
this.getMsgList();
this.defaultTime();
}, },
computed:{ defaultTime() {
progress(){ let date = new Date();
return this.$store.state.progressList.find(i=>{return i.id === this.fileUid}).num <100 ? this.$store.state.progressList.find(i=>{return i.id === this.fileUid}).num : 100 let now_seconds = date.getTime();
} let start_seconds = now_seconds - 48 * 60 * 60 * 1000;
this.searchFrom.time = [new Date(start_seconds), new Date(now_seconds)];
}
},
mounted() {
this.getMsgList();
this.defaultTime();
},
computed: {
progress() {
return this.$store.state.progressList.find(i => {
return i.id === this.fileUid;
}).num < 100
? this.$store.state.progressList.find(i => {
return i.id === this.fileUid;
}).num
: 100;
} }
} }
};
</script> </script>
<style scoped> <style scoped>
.index { .index {
padding: 20px 0; padding: 20px 0;
} }
.top { .top {
margin-bottom: 30px; margin-bottom: 30px;
margin-left: 20px; margin-left: 20px;
} }
.title { .title {
font-size: 16px; font-size: 16px;
font-weight: 400; font-weight: 400;
display: block; display: block;
line-height: 1.2; line-height: 1.2;
color: #353535; color: #353535;
} }
.inner-edit_area { .inner-edit_area {
width: 96%; width: 96%;
margin: 0 auto; margin: 0 auto;
} }
.upload-video { .upload-video {
width: 50%; width: 50%;
margin-left:2%; margin-left: 2%;
} }
.b-title { .b-title {
padding: 20px; padding: 20px;
color: #666; color: #666;
} }
.emotion_switch { .emotion_switch {
float: left; float: left;
height: 28px; height: 28px;
line-height: 999em; line-height: 999em;
overflow: hidden; 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; background: transparent
width: 20px; url(https://res.wx.qq.com/mpres/en_US/htmledition/pages/modules/reply/images/icon_emotion_switch.png)
height: 20px; no-repeat 0 0;
vertical-align: middle; width: 20px;
display: inline-block; height: 20px;
} vertical-align: middle;
.img { display: inline-block;
position: relative; }
width: 25%; .img {
position: relative;
width: 25%;
img { img {
width: 100%; width: 100%;
} }
...@@ -932,145 +1083,146 @@ ...@@ -932,145 +1083,146 @@
left: 50%; left: 50%;
display: none; display: none;
} }
} }
.img:hover img{ .img:hover img {
opacity: 0.3; opacity: 0.3;
} }
.img:hover .el-icon-delete{ .img:hover .el-icon-delete {
display: block; display: block;
} }
.tool_bar { .tool_bar {
float: right; float: right;
margin-top: 20px; margin-top: 20px;
} }
.choose_item { .choose_item {
box-sizing: border-box; box-sizing: border-box;
margin-bottom: 25px; margin-bottom: 25px;
color: rgb(136, 136, 136); color: rgb(136, 136, 136);
height: 148px; height: 148px;
line-height: 148px; line-height: 148px;
width: 148px; width: 148px;
text-align: center; text-align: center;
border: 1px dashed #c0ccda; border: 1px dashed #c0ccda;
border-radius: 6px; border-radius: 6px;
} }
.display-b { .display-b {
display: flex; display: flex;
flex-flow: row nowrap; flex-flow: row nowrap;
justify-content: space-between; justify-content: space-between;
align-items: center; align-items: center;
} }
.my-teacher { .my-teacher {
width: 25%; width: 25%;
height: 80px; height: 80px;
background-color: #eee; background-color: #eee;
line-height: 80px; line-height: 80px;
text-align: center; text-align: center;
margin-bottom: 10px; margin-bottom: 10px;
} }
.news-media { .news-media {
padding: 10px; padding: 10px;
width: 25%; width: 25%;
} }
.news-media img{ .news-media img {
width: 100%; width: 100%;
} }
.s-news img { .s-news img {
width: 50px; width: 50px;
float: right; float: right;
} }
.title { .title {
font-size: 16px; font-size: 16px;
font-weight: 400; font-weight: 400;
display: block; display: block;
line-height: 1.2; line-height: 1.2;
color: #353535; color: #353535;
} }
.digest { .digest {
padding-top: 12px; padding-top: 12px;
color: #9A9A9A; color: #9a9a9a;
font-size: 14px; font-size: 14px;
} }
.single-cover { .single-cover {
/*padding: 20px 15px 15px;*/ /*padding: 20px 15px 15px;*/
} }
.muti-cover { .muti-cover {
position: relative; position: relative;
padding: 20px 15px 0 15px; padding: 20px 15px 0 15px;
} }
.bottom-title { .bottom-title {
color: #FFFFFF; color: #ffffff;
background-color: rgba(0, 0, 0, 0.55); background-color: rgba(0, 0, 0, 0.55);
position: absolute; position: absolute;
left: 15px; left: 15px;
right: 15px; right: 15px;
bottom: 0; bottom: 0;
padding: 8px 12px; padding: 8px 12px;
} }
.next-cover { .next-cover {
padding: 12px 15px; padding: 12px 15px;
position: relative; position: relative;
} }
.next-img { .next-img {
float: right; float: right;
margin-left: 12px; margin-left: 12px;
width: 60px !important; width: 60px !important;
height: 60px !important; height: 60px !important;
} }
.next-title { .next-title {
overflow: hidden; overflow: hidden;
font-weight: 400; font-weight: 400;
word-wrap: break-word; word-wrap: break-word;
-webkit-hyphens: auto; -webkit-hyphens: auto;
-ms-hyphens: auto; -ms-hyphens: auto;
hyphens: auto; hyphens: auto;
color: #353535; color: #353535;
} }
.single-cover:hover .preview,.bottomCover:hover .preview{ .single-cover:hover .preview,
display: flex; .bottomCover:hover .preview {
justify-content: center; display: flex;
align-items: center; justify-content: center;
color: #fff; align-items: center;
} color: #fff;
.preview { }
display: none; .preview {
position: absolute; display: none;
top: 0; position: absolute;
left: 0; top: 0;
width: 100%; left: 0;
height: 100%; width: 100%;
background-color: rgba(0,0,0,0.5); height: 100%;
text-decoration: none; background-color: rgba(0, 0, 0, 0.5);
} text-decoration: none;
.f-bt { }
display: flex; .f-bt {
position: relative; display: flex;
justify-content: space-between; position: relative;
align-items: flex-start; justify-content: space-between;
} align-items: flex-start;
.ellip { }
overflow: hidden; .ellip {
text-overflow: ellipsis; overflow: hidden;
white-space: nowrap; text-overflow: ellipsis;
} white-space: nowrap;
.flex-start { }
display: flex; .flex-start {
flex-flow: row nowrap; display: flex;
justify-content: flex-start; flex-flow: row nowrap;
align-items: flex-start; justify-content: flex-start;
} align-items: flex-start;
}
</style> </style>
<style> <style>
.el-radio-group { .el-radio-group {
display: flex !important; display: flex !important;
flex-flow: column; flex-flow: column;
justify-content: flex-start; justify-content: flex-start;
align-items: flex-start; align-items: flex-start;
} }
.el-radio+.el-radio { .el-radio + .el-radio {
margin-left: 0 !important; margin-left: 0 !important;
} }
.el-radio { .el-radio {
margin-bottom: 6px; margin-bottom: 6px;
} }
</style> </style>
src/components/qrcode/focusReplyDialog.vue
View file @ e754a0bf
...@@ -239,7 +239,7 @@ ...@@ -239,7 +239,7 @@
placement="bottom-end" placement="bottom-end"
width="400" width="400"
:offset="10" :offset="10"
trigger="manual" trigger="hover"
v-model="showEmotion"> v-model="showEmotion">
<div> <div>
<emotion @emotion="handleEmotion" :height="200" ></emotion> <emotion @emotion="handleEmotion" :height="200" ></emotion>
......
src/components/system/admin.vue
View file @ e754a0bf
...@@ -293,8 +293,6 @@ ...@@ -293,8 +293,6 @@
return item.role_name == "管理员" return item.role_name == "管理员"
}) })
break; break;
default:
break;
} }
} }
this.adminList = res.list; this.adminList = res.list;
......
src/components/weChat/autoReply.vue
View file @ e754a0bf
...@@ -16,7 +16,7 @@ ...@@ -16,7 +16,7 @@
<template slot-scope="props"> <template slot-scope="props">
<el-form label-position="top" class="demo-table-expand"> <el-form label-position="top" class="demo-table-expand">
<el-form-item label="回复内容"> <el-form-item label="回复内容">
<div v-for="(item, index) in JSON.parse(props.row.desc)"> <div v-for="(item, index) in props.row.desc">
回复{{index+1}}({{item.type | type}})： 回复{{index+1}}({{item.type | type}})：
<span v-if="item.content && item.type==='text'"> <span v-if="item.content && item.type==='text'">
<span v-html="item.content.replace(/\/[\u4E00-\u9FA5]{1,3}/gi, emotion)"></span> <span v-html="item.content.replace(/\/[\u4E00-\u9FA5]{1,3}/gi, emotion)"></span>
...@@ -87,7 +87,7 @@ ...@@ -87,7 +87,7 @@
<el-table-column <el-table-column
label="回复内容"> label="回复内容">
<template slot-scope="scope"> <template slot-scope="scope">
{{ JSON.parse(scope.row.desc).length }} 条回复 {{scope.row.desc.length }} 条回复
</template> </template>
</el-table-column> </el-table-column>
<el-table-column <el-table-column
...@@ -152,7 +152,7 @@ ...@@ -152,7 +152,7 @@
} else if (value === 'news-item') { } else if (value === 'news-item') {
return '图文链接' return '图文链接'
} else { } else {
return val return value
} }
} }
}, },
......
src/components/weChat/autoReplyDialog.vue
View file @ e754a0bf
...@@ -5,7 +5,7 @@ ...@@ -5,7 +5,7 @@
center center
append-to-body append-to-body
:visible.sync="show" :visible.sync="show"
width="800px"> width="50%">
<div v-loading="loading"> <div v-loading="loading">
<el-form ref="form" :model="form" :rules="rules" > <el-form ref="form" :model="form" :rules="rules" >
<el-row> <el-row>
...@@ -23,7 +23,7 @@ ...@@ -23,7 +23,7 @@
<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>
<img v-else-if="item.type==='image' && item.content" :src="item.content"/> <img v-else-if="item.type==='image' && item.content" :src="item.content"/>
<span v-else-if="item.type==='image' && item.variable" class="msg-text">我的老师二维码</span> <span v-else-if="item.type==='image' && item.variable" class="msg-text" >我的老师二维码</span>
<a v-else-if="item.type==='video'" :href="item.content.down_url" target="_blank">{{item.content.title}}</a> <a v-else-if="item.type==='video'" :href="item.content.down_url" target="_blank">{{item.content.title}}</a>
<div v-else-if="item.type==='news' && item.content && item.content.news_item" class="news-media" style="display: inline-block"> <div v-else-if="item.type==='news' && item.content && item.content.news_item" class="news-media" style="display: inline-block">
<el-card :body-style="{ padding: '0px' }"> <el-card :body-style="{ padding: '0px' }">
...@@ -76,7 +76,7 @@ ...@@ -76,7 +76,7 @@
<i class="el-icon-delete" @click="onDelText(item, index)"></i> <i class="el-icon-delete" @click="onDelText(item, index)"></i>
</div> </div>
</template> </template>
<div class="msg_sender_wrp"> <div class="msg_sender_wrp" style="width:100%;">
<div> <div>
<i class="el-icon-circle-plus-outline" @click="onAddContent"></i> <i class="el-icon-circle-plus-outline" @click="onAddContent"></i>
</div> </div>
...@@ -106,7 +106,7 @@ ...@@ -106,7 +106,7 @@
placeholder="请输入内容" placeholder="请输入内容"
v-model="content"> v-model="content">
</el-input> </el-input>
<div style="float: right"> <div style="float:left;">
<el-popover <el-popover
placement="bottom-end" placement="bottom-end"
width="400" width="400"
...@@ -114,14 +114,14 @@ ...@@ -114,14 +114,14 @@
trigger="hover" trigger="hover"
v-model="showEmotion"> v-model="showEmotion">
<div> <div>
<emotion @emotion="handleEmotion" :height="200" ></emotion> <emotion @emotion="handleEmotion" :height="200"></emotion>
</div> </div>
<el-button @click="showEmotion = !showEmotion" slot="reference" type="text"> <el-button @click="showEmotion = !showEmotion" slot="reference" type="text">
<span class="icon_emotion emotion_switch"></span> <span class="icon_emotion emotion_switch" ></span>
</el-button> </el-button>
</el-popover> </el-popover>
<el-button v-if="form.key !== 'mini_keywords_reply'" @click="addTeacherName" type="warning" plain>添加老师名字</el-button> <el-button v-if="form.key !== 'mini_keywords_reply'" @click="addTeacherName" type="warning" plain style="margin-top: 10px;">添加老师名字</el-button>
<el-button v-if="form.key !== 'mini_keywords_reply'" @click="addTeacherAlias" type="success" plain>添加老师别名</el-button> <el-button v-if="form.key !== 'mini_keywords_reply'" @click="addTeacherAlias" type="success" plain style="margin-top: 10px;">添加老师别名</el-button>
</div> </div>
</template> </template>
<template v-if="type==='image'"> <template v-if="type==='image'">
...@@ -345,7 +345,7 @@ ...@@ -345,7 +345,7 @@
</template> </template>
<div class="tool_bar"> <div class="tool_bar">
<el-button @click="close">取 消</el-button> <el-button @click="close">取 消</el-button>
<el-button class="weui-desktop-btn weui-desktop-btn_primary" @click="confirm">确定</el-button> <el-button class="weui-desktop-btn weui-desktop-btn_primary el-button--primary" @click="confirm">确定</el-button>
</div> </div>
</div> </div>
</div> </div>
...@@ -874,9 +874,10 @@ ...@@ -874,9 +874,10 @@
display: inline-block; display: inline-block;
} }
.msg-item { .msg-item {
margin-bottom: 10px; margin: 30px 0;
width: 600px;
img { img {
width: 20%; width: 30%;
} }
} }
.msg-text { .msg-text {
......
src/components/weChat/focusReplyDialog.vue
View file @ e754a0bf
...@@ -228,7 +228,7 @@ ...@@ -228,7 +228,7 @@
placement="bottom-end" placement="bottom-end"
width="400" width="400"
:offset="10" :offset="10"
trigger="manual" trigger="hover"
v-model="showEmotion"> v-model="showEmotion">
<div> <div>
<emotion @emotion="handleEmotion" :height="200" ></emotion> <emotion @emotion="handleEmotion" :height="200" ></emotion>
......
src/components/weChat/index.vue
View file @ e754a0bf
...@@ -3324,10 +3324,10 @@ ...@@ -3324,10 +3324,10 @@
float: right; float: right;
} }
.title { .title {
font-size: 16px; /* font-size: 16px; */
font-weight: 400; font-weight: 400;
display: block; display: block;
line-height: 1.2; /* line-height: 1.2; */
color: #353535; color: #353535;
} }
.digest { .digest {
......
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