Skip to content

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

1

parent 5dd19d1f
Hide whitespace changes
Inline Side-by-side
Showing with 451 additions and 176 deletions
pages.json
View file @ 6b4c4ac8
...@@ -474,6 +474,10 @@ ...@@ -474,6 +474,10 @@
"path":"my-news"//我的动态 "path":"my-news"//我的动态
},{ },{
"path":"enlargevideo"//视频放大 "path":"enlargevideo"//视频放大
},{
"path":"mydetails"//动态详情
},{
"path":"friendcircle"//朋友圈
}] }]
}, },
//抖音商品短视频 //抖音商品短视频
......
pages/friendcircle/friendcircle.vue
View file @ 6b4c4ac8
...@@ -8,170 +8,303 @@ ...@@ -8,170 +8,303 @@
.friendcircle .ftBox { .friendcircle .ftBox {
width: 100%; width: 100%;
padding: 0 15px; padding: 0 15px;
margin-top: 20px; margin-top: 20px;
display: flex; display: flex;
flex-direction: row; flex-direction: row;
align-items: flex-start; align-items: flex-start;
} }
.friendcircle .ftBox-left{ .friendcircle .ftBox-left{
margin-right: 15px; margin-right: 15px;
}
.friendcircle .ftBox-right{
width: 1;
flex: 1;
flex-direction: column;
} }
.friendcircle .text{ .friendcircle .ftBox-right{
color: #A68237; width: 1;
font-size: 12px; flex: 1;
} flex-direction: column;
.friendcircle .text2{ }
font-size: 12px; .friendcircle .text{
color: #333333; color: #A68237;
} font-size: 12px;
.friendcircle .r-sj{ }
font-size: 11px; .friendcircle .text2{
color: #B0B0B0; font-size: 12px;
display: flex;flex-direction: row; color: #333333;
align-items: center; }
justify-content: space-between; .friendcircle .r-sj{
position: relative; font-size: 11px;
} color: #B0B0B0;
.friendcircle .r-sj-d{ display: flex;flex-direction: row;
width: 24px; align-items: center;
height: 17px; justify-content: space-between;
background: #F5F5F5; position: relative;
border-radius: 3px; }
display: flex;flex-direction: row; .friendcircle .r-sj-d{
align-items: center;justify-content: space-around;padding:0 3px; width: 24px;
height: 17px;
} background: #F5F5F5;
.friendcircle .dian{ border-radius: 3px;
width: 4px;height: 4px;border-radius: 2px;background: #737373; display: flex;flex-direction: row;
} align-items: center;justify-content: space-around;padding:0 3px;
.diancaoz{
width: 110px; }
height: 30px; .friendcircle .dian{
background: #000000; width: 4px;height: 4px;border-radius: 2px;background: #737373;
border-radius: 4px; }
display: flex; .diancaoz{
flex-direction: row; width: 110px;
align-items: center; height: 30px;
justify-content: space-around; background: #000000;
position: absolute; border-radius: 4px;
right: 26px; display: flex;
bottom: -5px; flex-direction: row;
font-size: 11px; align-items: center;
color: #FFFFFF; justify-content: space-around;
} position: absolute;
.dianrow{ right: 26px;
display: flex;flex-direction: row; bottom: -5px;
align-items: center; font-size: 11px;
} color: #FFFFFF;
.dianrow text{margin-left: 3px;} }
.friendcircle .imgmode{ .dianrow{
display: flex; display: flex;flex-direction: row;
flex-direction: row; align-items: center;
flex-wrap: wrap; }
.dianrow text{margin-left: 3px;}
.friendcircle .imgmode{
display: flex;
flex-direction: row;
flex-wrap: wrap;
}
.friendcircle .fileimg{
width: 100%;height: 100%;
}
.friendcircle .imgc{
width: 100%;height: 100%;
background: rgba(0, 0, 0, 0.2);
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
position: absolute;
left: 0;
top:0;
font-size: 30px;
color: #FFFFFF;
}
.friendcircle .audios{
width: 500rpx;
height: 27px;
border-radius: 5px;
padding: 0 15px;
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-between;
background: #EBEBEB;
}
.friendcircle .friendarea{
position: relative;
width: 100%;
background: #F5F5F5;
border-radius: 5px;
margin-top: 10px;
}
.friendcircle .sjx{
width: 0;
height: 0;
border-left: 6px solid transparent;
border-right: 6px solid transparent;
border-bottom: 8px solid #F5F5F5;
position: absolute;
left: 10px;
top:-6px;
}
.friendcircle .areagood{
width: 100%;
padding: 10px;
display: flex;flex-direction: row;
align-items: flex-start;
}
.areagood-r{
width: 1;
flex:1;
margin-left: 10px;
}
.friendcircle .comment{
width: 100%;
height: 55px;
padding: 0 15px;
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-between;
position: fixed;
left: 0;
bottom: 0;
background: #FFF;
z-index: 9;
}
.friendcircle .comment-pl{
width: 56px;
height: 26px;
font-size: 13px;
color: #FFF;
display: flex;
align-items: center;
justify-content: center;
border-radius: 3px;
}
.friendcircle .commentinput{
width: calc(100vw - 120px);
height: 30px;
background: #F3FAF8;
border-radius: 15px;
font-size: 13px;
padding: 0 10px;
}
.friendcircle .comment-list{
width: 100%;
} }
.friendcircle .fileimg{ .popup-box{
width: 100%;height: 100%; width: 100%;
border-top-right-radius: 8px;
border-top-left-radius: 8px;
background: #FFF;
} }
.friendcircle .imgc{ .popup-box-item{
width: 100%;height: 100%; width: 100%;
background: rgba(0, 0, 0, 0.2); height: 40px;
border-bottom: 1px solid #E7E7E7;
display: flex; display: flex;
flex-direction: row;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
position: absolute;
left: 0;
top:0;
font-size: 30px;
color: #FFFFFF;
} }
</style> </style>
<template> <template>
<div class='friendcircle'> <div class='friendcircle'>
<u-empty v-if="g.length == 0" text="暂无动态" mode="list"></u-empty> <u-empty v-if="g.length == 0" text="暂无动态" mode="list"></u-empty>
<view v-if="g.length > 0" style=" <view v-if="g.length > 0" style="
height: calc(100vh);width: calc(100vw) height: calc(100vh);width: calc(100vw)
overflow: hidden; overflow: hidden;
"> ">
<scroll-view :scroll-y="true" :enable-back-to-top="true" :enable-flex="true" @scrolltolower="lower" :style="{ height: '100%' }"> <scroll-view :scroll-y="true" :enable-back-to-top="true" :enable-flex="true" @scroll='inputscroll' @scrolltolower="lower"
<view class="ftBox" v-for="(x, i) in g" :key="i" > :style="{ height: '100%' }">
<view class="ftBox-left"> <view class="ftBox" v-for="(x, i) in g" :key="i">
<u-avatar :src="x.crearteEmPhoto" size='80' mode="square"></u-avatar> <view class="ftBox-left">
</view> <u-avatar :src="x.crearteEmPhoto" size='80' mode="square"></u-avatar>
<view class="ftBox-right">
<view class="text" style="font-size: 14px;font-weight: bold;margin-bottom: 5px;">{{x.createEmName}}</view>
<view class="text2" style="font-size: 14px;margin-bottom: 5px;">{{x.content}}</view>
<!-- 图片模式 -->
<view class="imgmode" v-if="x.fileType==1" >
<view v-if="x.files.length==1" style="width: 150px;height:200px;margin-bottom: 6px;" @click="previewImage(0,x.files)">
<image :src="x.files[0]" mode="aspectFill" class="fileimg"></image>
</view>
<view v-if="x.files.length==2 || x.files.length==4" v-for="(item, iq) in x.files" :key="iq"
@click="previewImage(iq,x.files)"
style="width: 240rpx;height:240rpx;margin-bottom: 6px;margin-right: 6px;">
<image :src="item" mode="aspectFill" class="fileimg"></image>
</view>
<view v-if="(x.files.length==3 || x.files.length>4) && iq<9" v-for="(item, iq) in x.files" :key="iq"
@click="previewImage(iq,x.files)"
style="width: 160rpx;height:160rpx;margin-bottom: 6px;margin-right: 6px;position: relative;">
<image :src="item" mode="aspectFill" class="fileimg" ></image>
<view class="imgc" v-if="iq==8 && x.files.length>9">
9+
</view>
</view>
</view>
<view class="imgmode" v-if="x.fileType==2">
<view style="width: 100px;height:120px;margin-bottom: 6px;position: relative;" >
<video id="myVideo" :src="x.files[0]" style="width: 100%;height: 100%;" :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])">
<u-icon name="play-circle-o" :size="50" color="#FFF"></u-icon>
</view>
</view>
</view>
<view>
</view>
<view class="r-sj">
<text>{{x.createTime}}</text>
<view class="r-sj-d" @click="getdian(x,i)">
<view class="dian"></view>
<view class="dian"></view>
</view>
<view class="diancaoz" v-if="x.dianshow==true">
<view class="dianrow" @click="dianzan(x,i)">
<u-icon name="like-o" :size="30" color="#FFF"></u-icon>
<text>
{{x.hasLike==false ?'赞':'取消'}}
</text>
</view>
<view class="dianrow" @click="pinglun(x,i)">
<u-icon name="comment-circle-o" :size="30" color="#FFF"></u-icon>
<text>
评论
</text>
</view>
</view>
</view>
</view> </view>
</view> <view class="ftBox-right">
<view class="text" style="font-size: 14px;font-weight: bold;margin-bottom: 5px;">{{x.createEmName}}</view>
<view class="text2" style="font-size: 14px;margin-bottom: 5px;">{{x.content}}</view>
<!-- 图片模式 -->
<view class="imgmode" v-if="x.fileType==1">
<view v-if="x.files.length==1" style="width: 150px;height:200px;margin-bottom: 6px;" @click="previewImage(0,x.files)">
<image :src="x.files[0]" mode="aspectFill" class="fileimg"></image>
</view>
<view v-if="x.files.length==2 || x.files.length==4" v-for="(item, iq) in x.files" :key="iq" @click="previewImage(iq,x.files)"
style="width: 240rpx;height:240rpx;margin-bottom: 6px;margin-right: 6px;">
<image :src="item" mode="aspectFill" class="fileimg"></image>
</view>
<view v-if="(x.files.length==3 || x.files.length>4) && iq<9" v-for="(item, iq) in x.files" :key="iq" @click="previewImage(iq,x.files)"
style="width: 160rpx;height:160rpx;margin-bottom: 6px;margin-right: 6px;position: relative;">
<image :src="item" mode="aspectFill" class="fileimg"></image>
<view class="imgc" v-if="iq==8 && x.files.length>9">
9+
</view>
</view>
</view>
<view class="imgmode" v-if="x.fileType==2">
<view style="width: 100px;height:120px;margin-bottom: 6px;position: relative;">
<video id="myVideo" :src="x.files[0]" style="width: 100%;height: 100%;" :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])">
<u-icon name="play-circle-o" :size="50" color="#FFF"></u-icon>
</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>
</view>
<view class="r-sj">
<text>{{x.createTime}}</text>
<view class="r-sj-d" @click="getdian(x,i)">
<view class="dian"></view>
<view class="dian"></view>
</view>
<view class="diancaoz" v-if="x.dianshow==true">
<view class="dianrow" @click="dianzan(x,i)">
<u-icon name="like-o" :size="30" color="#FFF"></u-icon>
<text>
{{x.hasLike==false ?'赞':'取消'}}
</text>
</view>
<view class="dianrow" @click="pinglun(x,i)">
<u-icon name="comment-circle-o" :size="30" color="#FFF"></u-icon>
<text>
评论
</text>
</view>
</view>
</view>
<view class="friendarea" v-if="(x.likeList && x.likeList.length>0) || x.commentList && x.commentList.length>0">
<!-- //三角形 -->
<view class="sjx"></view>
<view class="areagood" v-if=" x.likeList.length>0" :style="{'border-bottom':x.commentList.length>0?'1px solid rgb(226, 226, 226)':0}">
<u-icon name="like-o" :size="30" color="#737373"></u-icon>
<view class="areagood-r text">
<text v-for="(item, iq) in x.likeList" :key="iq">{{item.empName}}{{x.likeList.length!=iq+1?'、':''}}</text>
</view>
</view>
<view class="areagood" v-if=" x.commentList.length>0">
<u-icon name="comment-o" :size="30" color="#737373" style='margin-top: 2px;'></u-icon>
<view class="areagood-r">
<view v-for="(item, iq) in x.commentList" :key="iq" style="width: 100%;margin-bottom: 10px;" @click="huifu(x,i,item,iq)">
<view class="text comment-list">
{{item.empName}}
<text style="color: #333333;margin: 0 3px;" v-if="item.byReplayEmpId>0">回复</text>
{{item.byReplayEmpId>0?item.byReplayEmpName:''}}
</view>
<view class="text2">{{item.content}}</view>
</view>
</view>
</view>
</view>
</view>
</view>
<!-- 输入框 -->
<view class="comment" v-if="focu==true">
<input type="text" v-model="commentMsg.Content" :placeholder='placeholder' class="commentinput" :focus='focu'>
<view class="comment-pl" :style="{background:mainColor}" @click="addComment">评论</view>
</view>
<u-loadmore :status="status" :load-text="loadText" :font-size="24" :margin-top="20" :margin-bottom="20" bg-color="#FFF" /> <u-loadmore :status="status" :load-text="loadText" :font-size="24" :margin-top="20" :margin-bottom="20" bg-color="#FFF" />
</scroll-view> </scroll-view>
</view> </view>
<auth v-if="showAuth" @changeuserinfo="reloadUserinfo" @gbAuth='gbAuth'></auth> <auth v-if="showAuth" @changeuserinfo="reloadUserinfo" @gbAuth='gbAuth'></auth>
<u-popup v-model="show" mode="bottom" border-radius='14'>
<view class="popup-box">
<view class="popup-box-item" @click="paste()">
复制
</view>
<view class="popup-box-item" @click="mydelete()">
删除
</view>
<view style="width: 100%;height: 10px;background: #E7E7E7;"></view>
<view class="popup-box-item" @click="show=false" style="height: 45px;">
取消
</view>
</view>
</u-popup>
</view> </view>
</div> </div>
</template> </template>
...@@ -189,10 +322,10 @@ ...@@ -189,10 +322,10 @@
showAuth: false, showAuth: false,
msg: { msg: {
pageIndex: 1, pageIndex: 1,
pageSize: 15, pageSize: 15,
UserTeacher:0, UserTeacher: 0,
CreateBy:'', CreateBy: '',
UserId:0, UserId: 0,
}, },
mainColor: "", mainColor: "",
secondary: '', secondary: '',
...@@ -208,8 +341,19 @@ ...@@ -208,8 +341,19 @@
nomore: "没有更多了", nomore: "没有更多了",
}, },
windowWidth: 0, windowWidth: 0,
nowbofo: false, nowbofo: false,
placeholder: '评论',
focu: false, //是否获取焦点
commentMsg: {
ArticleId: 0,
CommentId: 0,
Content: '',
},
choiceId: 0,//保存评论和点赞时候的id
show:false,
user:'',//点击用户保存的数据
} }
}, },
created() { created() {
...@@ -217,8 +361,8 @@ ...@@ -217,8 +361,8 @@
this.mainColor = this.$uiConfig.mainColor; this.mainColor = this.$uiConfig.mainColor;
this.secondary = this.$uiConfig.secondary; this.secondary = this.$uiConfig.secondary;
this.pricecolor = this.$uiConfig.pricecolor; this.pricecolor = this.$uiConfig.pricecolor;
this.windowWidth = this.$utils.SystemInfo().windowWidth; this.windowWidth = this.$utils.SystemInfo().windowWidth;
this.msg.UserId=uni.getStorageSync("mall_UserInfo").UserId ? uni.getStorageSync("mall_UserInfo").UserId :0; this.msg.UserId = uni.getStorageSync("mall_UserInfo").UserId ? uni.getStorageSync("mall_UserInfo").UserId : 0;
}, },
mounted() { mounted() {
let currentPages = getCurrentPages(); let currentPages = getCurrentPages();
...@@ -259,7 +403,7 @@ ...@@ -259,7 +403,7 @@
this.loading = false; this.loading = false;
this.count = res.data.count; this.count = res.data.count;
res.data.pageData.forEach(x => { res.data.pageData.forEach(x => {
x.nowbofo = false; x.nowbofo = false;
x.dianshow = false; x.dianshow = false;
}) })
this.g = this.g.concat(res.data.pageData); this.g = this.g.concat(res.data.pageData);
...@@ -295,10 +439,10 @@ ...@@ -295,10 +439,10 @@
}, },
getList() { getList() {
this.msg.pageIndex = 1; this.msg.pageIndex = 1;
this.g = []; this.g = [];
this.init(); this.init();
}, },
lower(e) { lower(e) {
console.log(2) console.log(2)
if (this.msg.pageIndex < this.page_count) { if (this.msg.pageIndex < this.page_count) {
this.msg.pageIndex++; this.msg.pageIndex++;
...@@ -316,30 +460,155 @@ ...@@ -316,30 +460,155 @@
//关闭登录窗口 //关闭登录窗口
gbAuth() { gbAuth() {
uni.navigateBack() uni.navigateBack()
},
getdian(x, i) { //点击点点
this.g[i].dianshow = !this.g[i].dianshow;
this.$forceUpdate()
},
dianzan(x, i) { //点赞
this.choiceId = x.id;
let url = '';
if (x.hasLike == false) {
url = '/api/AppletEducation/DynamicLike'
} else {
url = '/api/AppletEducation/DynamicCancelLike'
}
this.request2({
url: url,
data: {
articleId: x.id
}
},
res => {
if (res.resultCode == 1) {
this.g[i].hasLike = !this.g[i].hasLike;
this.g[i].dianshow = false; //隐藏按钮
this.init2(1)
}
}
);
},
pinglun(x, i) { //评论
this.focu = true;
this.choiceId = x.id;
this.$forceUpdate()
this.g[i].dianshow = false; //隐藏按钮
this.commentMsg = {
ArticleId: x.id,
CommentId: 0,
Content: '',
}
},
inputscroll() { //滚动时触发
//初始化内容
this.focu = false;
this.commentMsg.Content = '';
this.placeholder = '评论';
}, },
getdian(x,i){//点击点点 huifu(x,i,item,iq){
this.g[i].dianshow = !this.g[i].dianshow; this.user={
this.$forceUpdate() x:x,
}, i:i,
dianzan(x,i){//点赞 item:item,
iq:iq,
}
if(this.msg.UserId == this.user.item.empId){//自己点自己的时候处理
this.show=true
}
},
pinglun(x,i){//评论
}, },
//图片预览 mydelete(){//删除自己的回复
previewImage(index, images) { this.request2({
uni.previewImage({ url: '/api/AppletEducation/DynamicDeleteComment',
urls: images, data: {commentId:this.user.item.commentId}
current: index, },
}); res => {
if (res.resultCode == 1) {
this.g[this.user.i].commentList.splice(this.user.iq,1)
uni.showToast({
title: res.message,
icon: 'none',
duration: 2000
});
this.show = false;
}
}
);
},
addComment() {
if (this.commentMsg.Content == '') {
uni.showToast({
title: '请输入评论',
icon: 'none',
duration: 2000
});
return
}
this.request2({
url: '/api/AppletEducation/DynamicComment',
data: this.commentMsg
},
res => {
if (res.resultCode == 1) {
this.focu = false;
this.commentMsg.Content = '';
this.placeholder = '评论';
this.init2(2)
}
}
);
},
init2(type) { //根据id去查询当前的数据 只更新当前数据
this.request2({
url: '/api/AppletSchool/DynamicList',
data: {
pageIndex: 1,
pageSize: 1,
UserTeacher: 0,
CreateBy: '',
UserId: 0,
Id: this.choiceId
}
},
res => {
if (res.resultCode == 1) {
this.g.forEach((x, j) => {
if (res.data.pageData[0].id == x.id) {
if (type == 2) { //评论
this.g[j].commentList = res.data.pageData[0].commentList
} else if (type == 1) { //点赞
this.g[j].likeList = res.data.pageData[0].likeList;
}
}
})
}
}
);
},
//图片预览
previewImage(index, images) {
uni.previewImage({
urls: images,
current: index,
});
},
enlarge(file) {
uni.navigateTo({
url: '/pages/friendcircle/enlargevideo?file=' + file
})
}, },
enlarge(file){ paste(){//复制
uni.navigateTo({ uni.setClipboardData({
url: '/pages/friendcircle/enlargevideo?file=' + file data: this.user.item.content,
}) });
} },
} }
} }
</script> </script>
pages/friendcircle/my-news.vue
View file @ 6b4c4ac8
...@@ -442,7 +442,7 @@ ...@@ -442,7 +442,7 @@
url: '/pages/friendcircle/mydetails?ID=' + x.id url: '/pages/friendcircle/mydetails?ID=' + x.id
}) })
innerAudioContext.stop(); innerAudioContext.stop();
} },
} }
} }
</script> </script>
pages/goods/list.vue
View file @ 6b4c4ac8
...@@ -44,14 +44,14 @@ ...@@ -44,14 +44,14 @@
<u-empty text="没有找到商品信息" font-size="36" mode="list" ></u-empty> <u-empty text="没有找到商品信息" font-size="36" mode="list" ></u-empty>
</view> </view>
<!-- <view class="quick" v-if="!loading"> <view class="quick" v-if="!loading">
<view class="item"> <!-- <view class="item">
<u-icon name="cart-o" size="48" color="#333" /> <u-icon name="cart-o" size="48" color="#333" />
</view> </view> -->
<view class="item" @click="goTop"> <view class="item" @click="goTop">
<u-icon name="arrow-up" size="48" color="#333" /> <u-icon name="arrow-up" size="48" color="#333" />
</view> </view>
</view> --> </view>
</view> </view>
</template> </template>
......
pages/index/index.vue
View file @ 6b4c4ac8
...@@ -185,7 +185,9 @@ ...@@ -185,7 +185,9 @@
educationteacher educationteacher
}, },
onLoad(options) { onLoad(options) {
uni.navigateTo({
url: '/pages/friendcircle/friendcircle'
})
let that = this; let that = this;
uni.getSystemInfo({ uni.getSystemInfo({
success(res) { success(res) {
......
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