Skip to content

M
mallapp
Commit 68468494 authored by Mac's avatar Mac
Browse files
Options

朋友圈

parent cdd502d8
Hide whitespace changes
Inline Side-by-side
Showing with 401 additions and 57 deletions
pages.json
View file @ 68468494
......@@ -478,6 +478,8 @@
"path":"mydetails"//动态详情
},{
"path":"friendcircle"//朋友圈
},{
"path":"medynamic"//我的互动消息
}]
},
//抖音商品短视频
......
pages/friendcircle/friendcircle.vue
View file @ 68468494
......@@ -182,15 +182,60 @@
display: flex;
align-items: center;
justify-content: center;
}
.friendcircle .mynews-top {
width: 100%;
height: 60px;
display: flex;
align-items: center;
justify-content: center;
position: fixed;
left: 0;
top: 0;
background: #FFF;
z-index: 2;
}
.friendcircle .top-box {
padding: 0 12px;
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
height: 30px;
border-radius: 15px;
background: #40766E;
font-size: 14px;
color: #FFFFFF;
position: relative;
}
.friendcircle .badgestyle{
padding: 0 5px;
font-size: 11px;
color: #FFFFFF;
position: absolute;
right: -5px;
top: -5px;
background: #C92B2B;
border-radius: 8px;
}
</style>
<template>
<div class='friendcircle'>
<div class='friendcircle'>
<view class="mynews-top" v-if="Messagecount>0">
<view class="top-box" @click="gomymessage()">
<image src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/wodehufong.png" mode="widthFix" style="width: 16px;height: auto;"></image>
<text style="margin-left: 6px;">我的互动消息</text>
<view class="badgestyle">
{{Messagecount>99?'99+':Messagecount}}
</view>
</view>
</view>
<u-empty v-if="g.length == 0" text="暂无动态" mode="list"></u-empty>
<view v-if="g.length > 0" style="
height: calc(100vh);width: calc(100vw)
overflow: hidden;
">
<view v-if="g.length > 0" :style="{'width':'100vw','overflow':'hidden','margin-top':Messagecount>0?'60px':'0','height':Messagecount>0?calc('100vh-60px'):'100vh',}">
<scroll-view :scroll-y="true" :enable-back-to-top="true" :enable-flex="true" @scroll='inputscroll' @scrolltolower="lower"
:style="{ height: '100%' }">
<view class="ftBox" v-for="(x, i) in g" :key="i">
......@@ -226,9 +271,10 @@
</view>
</view>
</view>
<view v-if="x.fileType==3" class="audios">
<view class="andiostyle" @click.stop="playVoice(x)">
<image src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/Sound.png" mode="widthFix" style="width: 19px;height: auto;"></image>
<view v-if="x.fileType==3" class="audios" @click.stop="playVoice(x,i)">
<view class="andiostyle" >
<image v-if="x.playshow==false" src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/Sound.png" mode="widthFix" style="width: 19px;height: auto;"></image>
<image v-if="x.playshow==true" src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/bofanggif.gif" mode="widthFix" style="width: 19px;height: auto;"></image>
</view>
</view>
<view class="text" style="font-size: 11px;" v-if="x.address && x.address!=''">
......@@ -358,7 +404,9 @@
},
choiceId: 0,//保存评论和点赞时候的id
show:false,
user:'',//点击用户保存的数据
user:'',//点击用户保存的数据
Messagecount:0,
playindex:0,
}
},
created() {
......@@ -395,6 +443,14 @@
} else {
this.init();
}
},
onShow(){
if (!this.u) {
} else {
this.getDMCount();
}
},
methods: {
init() {
......@@ -408,7 +464,7 @@
this.loading = false;
this.count = res.data.count;
res.data.pageData.forEach(x => {
x.nowbofo = false;
x.playshow = false;
x.dianshow = false;
})
this.g = this.g.concat(res.data.pageData);
......@@ -416,9 +472,23 @@
if (this.page_count == 1) {
this.status = "nomore";
}
}
}
this.getDMCount()
}
);
},
getDMCount(){
this.request2({
url: '/api/AppletEducation/GetDynamicMessageCount',
data: {}
},
res => {
if (res.resultCode == 1) {
this.Messagecount = res.data
};
}
);
},
enlarge(file) {
// 全屏
......@@ -429,19 +499,30 @@
},
//语音播放
playVoice(x) {
playVoice(x,i) {
let that = this
if (innerAudioContext.src != x.files[0]) { //如果切换听其他的语音
innerAudioContext.stop();
this.nowbofo = false
this.nowbofo = false;
this.g[this.playindex].playshow=false;
this.playindex= i
}else{
this.playindex= i
}
innerAudioContext.src = x.files[0];
if (this.nowbofo == false) {
innerAudioContext.play()
this.nowbofo = true
this.nowbofo = true;
this.g[i].playshow=true
innerAudioContext.onEnded(()=>{
innerAudioContext.stop()
this.nowbofo == false
this.g[this.playindex].playshow=false
})
} else {
innerAudioContext.pause();
this.nowbofo = false
this.nowbofo = false;
this.g[i].playshow=false
}
},
getList() {
......@@ -626,7 +707,13 @@
data: this.user.item.content,
});
},
gomymessage(){//我的动态消息
innerAudioContext.stop();
uni.navigateTo({
url: '/pages/friendcircle/medynamic'
})
}
}
}
</script>
pages/friendcircle/medynamic.vue 0 → 100644
View file @ 68468494
<style>
.mynews {
width: 100%;
height: 100vh;
background: #FFF;
}
.mynews .ftBox {
width: 100%;
padding: 0 15px;
margin-top: 20px;
display: flex;
flex-direction: row;
align-items: flex-start;
justify-content: space-between;
}
.mynews .ftBox-left{
margin-right: 15px;
}
.mynews .ftBox-center{
width: 1;
flex: 1;
margin-right: 5px;
}
.mynews .ftBox-right{
width: 80px;
height: 80px;
border-radius: 5px;
overflow: hidden;
}
.mynews .ftBox-right-text{
width: 100%;
height: 100%;
border-radius: 5px;
font-size: 14px;
color: #333333;
background: #F5F5F5;
}
.mynews .text{
font-size: 14px;
color: #A68237;
}
</style>
<template>
<div class='mynews'>
<u-empty v-if="g.length == 0" text="暂无动态" mode="list"></u-empty>
<view v-if="g.length > 0" style="
height: 100vh ;width: calc(100vw)
overflow: hidden;
">
<scroll-view :scroll-y="true" :enable-back-to-top="true" :enable-flex="true" @scrolltolower="lower" :style="{ height: '100%' }">
<view class="ftBox" v-for="(x, i) in g" :key="i" @click="godetails(x)">
<view class="ftBox-left">
<u-avatar :src="x.crearteEmPhoto" size='80' mode="square"></u-avatar>
</view>
<view class="ftBox-center">
<view class="text">
{{x.createEmName}}
</view>
<view v-if="x.realtionType==1">
<view>{{x.replyName==''?'回复了':'评论了'}} <text class="text" style="margin-left: 3px;">{{x.replyName}}</text></view>
<view>
{{x.commentContent}}
</view>
</view>
<view v-if="x.realtionType==2">
<u-icon name="like-o" :size="30" color="#000000"></u-icon>
</view>
<view style="font-size: 11px;color: #B0B0B0;">{{x.createTime}}</view>
</view>
<view class="ftBox-right" >
<view class="ftBox-right-text" style="padding: 6px;" v-if="x.fileType==0">
{{x.content}}
</view>
<view class="ftBox-right-text" v-if="x.fileType==1">
<image :src="x.coverPhoto" mode='aspectFill' style="width: 100%;height: 100%;border-radius: 5px;"></image>
</view>
<view class="ftBox-right-text" v-if="x.fileType==2" style="position: relative;">
<video id="myVideo" :src="x.coverPhoto" style="width: 100%;height: 100%;border-radius: 5px;" :controls='false'
:show-center-play-btn='false'></video>
<view style="width: 100%;height: 100%;position: absolute;left: 0;top: 0;display: flex;align-items: center;justify-content: center;"
>
<u-icon name="play-circle-o" :size="50" color="#FFF"></u-icon>
</view>
</view>
<view class="ftBox-right-text" v-if="x.fileType==3" style="display: flex;align-items: center;justify-content: center;background: #BBA16B;">
<image src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/mic.png" mode='aspectFill' style="width: 27px;height: 40px;border-radius: 5px;"></image>
</view>
</view>
</view>
<u-loadmore :status="status" :load-text="loadText" :font-size="24" :margin-top="20" :margin-bottom="20" bg-color="#FFF" />
</scroll-view>
</view>
</view>
</div>
</template>
<script>
const innerAudioContext = uni.createInnerAudioContext();
export default {
data() {
return {
pageTitle: "我的互动消息",
showAuth: false,
msg: {
pageIndex: 1,
pageSize: 10,
},
mainColor: "",
secondary: '',
pricecolor: '',
page_count: 1,
g: [],
loading: false,
status: "loadmore",
count: 0,
loadText: {
loadmore: "轻轻上拉，加载更多",
loading: "努力加载中",
nomore: "没有更多了",
},
windowWidth: 0,
}
},
created() {
this.contentHeight = this.$utils.calcContentHeight(-40) + "px";
this.mainColor = this.$uiConfig.mainColor;
this.secondary = this.$uiConfig.secondary;
this.pricecolor = this.$uiConfig.pricecolor;
this.windowWidth = this.$utils.SystemInfo().windowWidth;
},
mounted() {
let currentPages = getCurrentPages();
let u = "/" + currentPages[currentPages.length - 1].route;
let pages = wx.getStorageSync("basedata") ?
wx.getStorageSync("basedata").bar_title : [];
pages.forEach((x) => {
if (x.value == u) {
this.pageTitle = x.new_name ? x.new_name : x.name;
}
});
uni.setNavigationBarTitle({
title: this.pageTitle,
});
this.init()
},
onLoad() {
},
methods: {
init() {
this.loading = true;
this.request2({
url: '/api/AppletEducation/AboutMeDynamicList',
data: this.msg
},
res => {
if (res.resultCode == 1) {
this.loading = false;
this.count = res.data.count;
this.g = this.g.concat(res.data.pageData);
this.page_count = res.data.pageCount;
if (this.page_count == 1) {
this.status = "nomore";
}
}
}
);
},
lower(e) {
console.log(2)
if (this.msg.pageIndex < this.page_count) {
this.msg.pageIndex++;
this.status = "loading";
this.init();
} else {
this.status = "nomore";
}
},
godetails(x){
uni.navigateTo({
url: '/pages/friendcircle/mydetails?ID=' + x.id
})
}
}
}
</script>
pages/friendcircle/my-news.vue
View file @ 68468494
......@@ -29,7 +29,8 @@
border-radius: 15px;
background: #40766E;
font-size: 14px;
color: #FFFFFF;
color: #FFFFFF;
position: relative;
}
.mynews .ftBox {
......@@ -120,25 +121,26 @@
align-items: center;
margin-top: 10px;
justify-content: space-between;
}
.mynews .badgestyle{
padding: 1px 4px;
font-size: 11px;
color: #FFFFFF;
position: absolute;
right: -5px;
top: -5px;
background: #C92B2B;
border-radius: 8px;
}
</style>
<template>
<div class='mynews'>
<view class="mynews-top">
<view class="top-box">
<image src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/wodehufong.png" mode="widthFix" style="width: 16px;height: auto;"></image>
<text style="margin-left: 6px;">我的互动消息</text>
</view>
</view>
<!-- 发布动态按钮 -->
<floatbutton :list='list' openIcon='https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/fabupyq.png'
background='#40766E' openText='发布' bottom='80' @click='btnclick'></floatbutton>
<u-empty v-if="g.length == 0" text="暂无动态" mode="list"></u-empty>
<view v-if="g.length > 0" style="
height: calc(100vh - 60px);width: calc(100vw)
overflow: hidden;
margin-top: 60px;
">
<view v-if="g.length > 0" :style="{'width':'100vw','overflow':'hidden','margin-top':Messagecount>0?'60px':'0','height':Messagecount>0?calc('100vh-60px'):'100vh'}">
<scroll-view :scroll-y="true" :enable-back-to-top="true" :enable-flex="true" @scrolltolower="lower" :style="{ height: '100%' }">
<view class="ftBox" v-for="(x, i) in g" :key="i" @click="godetails(x)">
<view class="jiazu" v-if="x.YearTime!=''">{{x.YearTime}}年</view>
......@@ -151,8 +153,8 @@
<view class="inter-r-o" v-if="x.fileType==0">
{{x.content}}
</view>
<view class="inter-r-t wrap" v-if="x.fileType==1">
<view class="inter-r-t-l">
<view class="inter-r-t wrap" v-if="x.fileType==1" >
<view class="inter-r-t-l" @click.stop="previewImage(0,x.files)">
<image :src="x.files[0]" v-if="x.files.length==1" mode='aspectFill' style="width: 100%;height: 100%;"></image>
<view v-if="x.files.length==2" v-for="(item, iq) in x.files" :key="iq" :style="{'margin-right':(iq%2 ==0)?'2px':'0',width:'34px','height':'100%'}">
<image :src="item" mode='aspectFill' style="width: 100%;height: 100%;"></image>
......@@ -182,7 +184,7 @@
<video id="myVideo" :src="x.files[0]" style="width: 70px;height: 70px;" :controls='false'
:show-center-play-btn='false'></video>
<view style="width: 100%;height: 100%;position: absolute;left: 0;top: 0;display: flex;align-items: center;justify-content: center;"
@click="enlarge(x.files[0])">
@click.stop="enlarge(x.files[0])">
<u-icon name="play-circle-o" :size="50" color="#FFF"></u-icon>
</view>
</view>
......@@ -196,8 +198,9 @@
<view>
{{x.content}}
</view>
<view class="andiostyle" @click.stop="playVoice(x)">
<image src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/Sound.png" mode="widthFix" style="width: 19px;height: auto;"></image>
<view class="andiostyle" @click.stop="playVoice(x,i)">
<image v-if="x.playshow==false" src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/Sound.png" mode="widthFix" style="width: 19px;height: auto;"></image>
<image v-if="x.playshow==true" src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/bofanggif.gif" mode="widthFix" style="width: 19px;height: auto;"></image>
</view>
</view>
......@@ -267,7 +270,9 @@
url: 'https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/Sound.png'
},
],
nowbofo: false,
nowbofo: false,
Messagecount:0,
playindex:0,
}
},
created() {
......@@ -302,9 +307,11 @@
};
this.showAuth = true;
} else {
this.init();
this.init();
}
},
},
methods: {
init() {
this.loading = true;
......@@ -317,22 +324,24 @@
this.loading = false;
this.count = res.data.count;
res.data.pageData.forEach(x => {
x.nowbofo = false;
x.playshow = false;
})
this.g = this.g.concat(res.data.pageData);
this.page_count = res.data.pageCount;
if (this.page_count == 1) {
this.status = "nomore";
}
}
};
}
);
},
},
btnclick(item) {
if (item.type == 2) {
this.upvideo()
} else {
uni.navigateTo({
uni.navigateTo({
url: '/pages/friendcircle/release?type=' + item.type
})
innerAudioContext.stop();
......@@ -398,19 +407,30 @@
innerAudioContext.stop();
},
//语音播放
playVoice(x) {
let that = this
playVoice(x,i) {
if (innerAudioContext.src != x.files[0]) { //如果切换听其他的语音
innerAudioContext.stop();
this.nowbofo = false
this.nowbofo = false;
this.g[this.playindex].playshow=false;
this.playindex= i
}else{
this.playindex= i
}
innerAudioContext.src = x.files[0];
if (this.nowbofo == false) {
innerAudioContext.play()
this.nowbofo = true
this.nowbofo = true
this.g[i].playshow=true
innerAudioContext.onEnded(()=>{
innerAudioContext.stop()
this.nowbofo == false
this.g[this.playindex].playshow=false
})
} else {
innerAudioContext.pause();
this.nowbofo = false
this.nowbofo = false
this.g[i].playshow=false
}
},
getList() {
......@@ -419,7 +439,7 @@
this.init();
},
lower(e) {
console.log(2)
if (this.msg.pageIndex < this.page_count) {
this.msg.pageIndex++;
this.status = "loading";
......@@ -442,6 +462,20 @@
url: '/pages/friendcircle/mydetails?ID=' + x.id
})
innerAudioContext.stop();
},
gomymessage(){//我的动态消息
innerAudioContext.stop();
uni.navigateTo({
url: '/pages/friendcircle/medynamic'
})
},
//图片预览
previewImage(index, images) {
uni.previewImage({
urls: images,
current: index,
});
},
}
}
......
pages/friendcircle/mydetails.vue
View file @ 68468494
......@@ -287,7 +287,7 @@
</view>
<!-- 输入框 -->
<view class="comment" >
<input type="text" v-model="commentMsg.Content" :placeholder='placeholder' class="commentinput" :focus='focu'>
<input type="text" v-model="commentMsg.Content" :placeholder='placeholder' class="commentinput" @blur='blurc' :focus='focu'>
<view class="comment-pl" :style="{background:mainColor}" @click="addComment">评论</view>
</view>
......@@ -484,6 +484,10 @@
}
);
},
blurc(){
this.commentMsg.Content = '';
this.placeholder = '评论';
},
mydelete(){//删除自己的回复
this.request2({
url: '/api/AppletEducation/DynamicDeleteComment',
......
pages/friendcircle/release.vue
View file @ 68468494
......@@ -187,13 +187,14 @@
<!-- 音频 -->
<view class="audio" v-if='addMsg.FileType==3'>
<view class="audio-o" @click="statraudio()" v-if="addMsg.FileList.length==0">
<image src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/Sound2.png" mode="widthFix" style="width: 20px;height: auto;"></image>
<image src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/Sound.png" mode="widthFix" style="width: 20px;height: auto;"></image>
<text style="margin-left: 10px;">语音录制</text>
<text style="color: #BBBBBB;">（点击进入录制页面）</text>
</view>
<view v-if="addMsg.FileList.length>0" class="audio-o" style="justify-content: space-around;width: 100%;">
<view class="audio-ot" @click="playVoice">
<image src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/Sound2.png" mode="widthFix" style="width: 20px;height: auto;"></image>
<image v-if="playshow==false" src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/Sound.png" mode="widthFix" style="width: 20px;height: auto;"></image>
<image v-if="playshow==true" src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/bofanggif.gif" mode="widthFix" style="width: 20px;height: auto;"></image>
<text>{{reDate2!=reDate?(reDate2+'/'):''}}{{reDate}}</text>
</view>
<view style="font-size: 14px;color: #40766E;" @click="reset">
......@@ -245,7 +246,8 @@
@longpress="onStartRecoder"
@touchend="onEndRecoder"
>
<image src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/mic.png" mode="widthFix" style="width: 37px;height: auto;"></image>
<image v-if="gifshow==false" src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/mic.png" mode="widthFix" style="width: 37px;height: auto;"></image>
<image v-if="gifshow==true" src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/luyin.gif" mode="widthFix" style="width: 37px;height: auto;"></image>
</view>
<text class="now-date">{{ reDate }}</text>
<view class="as-btn">
......@@ -300,7 +302,9 @@
min: 0,
voicePath:'',
nowbofo:false,//播放状态
videoContext:null
videoContext:null,
gifshow:false,
playshow:false
}
},
......@@ -396,11 +400,8 @@
});
},
uploadSuccessHandler(data, index, lists) {
console.log(this.addMsg.FileList)
let r = JSON.parse(data);
this.addMsg.FileList.push(r.data);
console.log(this.addMsg.FileList)
},
onRemove1(index) {
this.addMsg.FileList.splice(index, 1);
......@@ -416,6 +417,7 @@
scope: 'scope.record',
success(r) {
console.log(r)
that.reDate = '00:00'
that.audioshow = true;
},fail(){
wx.showModal({
......@@ -431,6 +433,7 @@
icon: 'success',
duration: 1000
})
that.reDate = '00:00'
that.audioshow = true;
} else {
wx.showToast({
......@@ -453,6 +456,7 @@
}
})
}else{
that.reDate = '00:00'
that.audioshow = true;
}
}
......@@ -518,6 +522,7 @@
// 开始录制
onStartRecoder () {
console.log('长按')
this.gifshow = true
recorderManager.start({
duration: 600000,
format:'mp3'
......@@ -525,23 +530,25 @@
},
// 录制结束
onEndRecoder () {
this.gifshow = false
recorderManager.stop()
},
// 播放暂停录音
playVoice() {
let that = this
console.log(innerAudioContext.src)
innerAudioContext.src = this.voicePath;
if (this.nowbofo== false) {
this.playstartDate()
this.nowbofo=true
this.nowbofo=true;
this.playshow =true
} else {
console.log('暂停')
innerAudioContext.pause();
clearInterval(that.timer)
this.nowbofo=false
this.nowbofo=false;
this.playshow =false
}
},
playstartDate(){
......@@ -551,6 +558,7 @@
this.min = 0
}
innerAudioContext.play()
this.playshow =true
this.timer = setInterval(() => {
this.sec++
if (this.sec >= 60) {
......@@ -565,6 +573,7 @@
let _m = this.min < 10 ? '0' + this.min : this.min
this.reDate2 = _m + ':' + _s
if(this.reDate2==this.reDate){
this.playshow =false
innerAudioContext.stop();//视频播放完停止
this.nowbofo=false;//控制播放的字段
clearInterval(this.timer)
......
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