进入uniapp
This commit is contained in:
90
im-uniapp/wx/favorites/add.vue
Normal file
90
im-uniapp/wx/favorites/add.vue
Normal file
@@ -0,0 +1,90 @@
|
||||
<template>
|
||||
<view class="friendsCircle-send">
|
||||
<watermark></watermark>
|
||||
<form @submit="subform">
|
||||
<view class="friendsCircle-send-item">
|
||||
<textarea class="friendsCircle-send-textarea" auto-height placeholder="建议反馈..." maxlength="200" v-model="form.content"></textarea>
|
||||
</view>
|
||||
<view class="friendsCircle-send-item">
|
||||
<zmm-upload-image v-model:fileList="form.images" :limit="9"></zmm-upload-image>
|
||||
</view>
|
||||
</form>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
form:{
|
||||
images:[],
|
||||
content:''
|
||||
}
|
||||
};
|
||||
},
|
||||
onLoad() {},
|
||||
methods: {
|
||||
subform(e) {
|
||||
var rules = {
|
||||
content: {
|
||||
rules: [{
|
||||
checkType: "required",
|
||||
errorMsg: "请填写内容"
|
||||
}]
|
||||
}
|
||||
};
|
||||
var formData = JSON.parse(JSON.stringify(this.form));
|
||||
var checkRes = this.$zmmFormCheck.check(formData, rules);
|
||||
formData.images=JSON.stringify(formData.images)
|
||||
if (checkRes) {
|
||||
this.$http.request({//手机+密码
|
||||
url: '/common/feedback',
|
||||
method: 'POST',
|
||||
data:JSON.stringify(formData),
|
||||
success: (res) => {
|
||||
if (res.data.code == 200) {
|
||||
uni.showToast({
|
||||
title:'提交成功',
|
||||
icon:'success'
|
||||
})
|
||||
this.form={
|
||||
images:[],
|
||||
content:''
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: this.$zmmFormCheck.error,
|
||||
icon: "none",
|
||||
position: 'bottom'
|
||||
});
|
||||
}
|
||||
}
|
||||
},
|
||||
onNavigationBarButtonTap(e) {
|
||||
switch (e.index) {
|
||||
case 0:
|
||||
this.subform()
|
||||
break;
|
||||
default:
|
||||
break;
|
||||
}
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.friendsCircle-send{
|
||||
padding:24rpx 46rpx;
|
||||
}
|
||||
.friendsCircle-send-item{
|
||||
margin-bottom: 24rpx;
|
||||
}
|
||||
.friendsCircle-send-textarea{
|
||||
width: 100%;
|
||||
line-height: 48rpx;
|
||||
min-height: 240rpx;
|
||||
}
|
||||
</style>
|
||||
462
im-uniapp/wx/favorites/index.vue
Normal file
462
im-uniapp/wx/favorites/index.vue
Normal file
@@ -0,0 +1,462 @@
|
||||
<template>
|
||||
<view class="bgColor">
|
||||
<watermark></watermark>
|
||||
<view class="favorites-wx">
|
||||
<view class="favorites-wx-top">
|
||||
<view class="favorites-wx-top-item" v-for="(v,i) in types" :key="i" @click="clickType(v)">{{v.label}}</view>
|
||||
<view class="favorites-wx-tips">点击预览，按住卡片向左滑动操作</view>
|
||||
</view>
|
||||
<uni-swipe-action>
|
||||
<uni-swipe-action-item class="favorites-uni-swipe-action-item" v-for="(v,i) in list" :key="i">
|
||||
<view class="favorites-wx-item">
|
||||
<view class="favorites-wx-content favorites-wx-content-text" v-if="v.collectType=='TEXT'">
|
||||
<view class="favorites-wx-text">
|
||||
{{v.content}}
|
||||
</view>
|
||||
</view>
|
||||
<view class="favorites-wx-content favorites-wx-content-img" v-if="v.collectType=='IMAGE'">
|
||||
<image :src="returnParse(v.content).url" @click="$fc.previewImagesolo(returnParse(v.content).url)" mode="aspectFill"></image>
|
||||
</view>
|
||||
<view class="favorites-wx-content favorites-wx-content-video" v-if="v.collectType=='VIDEO'">
|
||||
<view class="favorites-wx-content-video-img" @click="openVideo(returnParse(v.content).url)">
|
||||
<image :src="returnParse(v.content).img" mode="aspectFill"></image>
|
||||
<view class="favorites-wx-content-video-icon">
|
||||
<text class="wxfont bofang"></text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="favorites-wx-content favorites-wx-content-location" v-if="v.collectType=='LOCATION'">
|
||||
<view class="favorites-wx-content-location-box" @click="goMap({latitude:returnParse(v.content).latitude,longitude:returnParse(v.content).longitude})">
|
||||
<view class="favorites-wx-content-location-box-name">{{returnParse(v.content).name}}</view>
|
||||
<view class="favorites-wx-content-location-box-address">{{returnParse(v.content).address}}</view>
|
||||
<image class="favorites-wx-content-location-box-map" src="../../static/wx/map.png" mode="aspectFit"></image>
|
||||
</view>
|
||||
</view>
|
||||
<view class="favorites-wx-content favorites-wx-content-voice" v-if="v.collectType=='VOICE'">
|
||||
<view class="favorites-wx-content-voice-box">
|
||||
<view class="favorites-wx-content-voice-content" @click="playVOICE(returnParse(v.content).url)">
|
||||
<text>{{returnParse(v.content).time}}</text>
|
||||
<text class="wxfont yuyin"></text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="favorites-wx-content" v-if="v.collectType=='CARD'">
|
||||
<view class="favorites-wx-content-card" @click="goAddfriend(returnParse(v.content))">
|
||||
<view class="favorites-wx-content-card-top">
|
||||
<image class="favorites-wx-content-card-top-img" :src="returnParse(v.content).avatar"></image>
|
||||
<view class="favorites-wx-content-card-top-content">
|
||||
<view class="favorites-wx-content-card-title">{{returnParse(v.content).name}}</view>
|
||||
<view class="favorites-wx-content-card-no">{{returnParse(v.content).chatNo}}</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="favorites-wx-content-card-card">名片</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="favorites-wx-bottom">
|
||||
<text>{{userinfo.nickName}}</text>
|
||||
<text>{{userinfo.createTime}}</text>
|
||||
</view>
|
||||
</view>
|
||||
<template v-slot:right>
|
||||
<view class="favorites-wx-action-item">
|
||||
<view class="favorites-wx-action-item-btn favorites-wx-delete" @click="favoritesDeleta(v,i)">删除</view>
|
||||
<view v-if="type=='2'" class="favorites-wx-action-item-btn favorites-wx-view" @click="clickitem(v,i)">发送</view>
|
||||
</view>
|
||||
</template>
|
||||
</uni-swipe-action-item>
|
||||
</uni-swipe-action>
|
||||
<uni-load-more v-show="list.length>0" :status="queryParams.status"></uni-load-more>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
emits:['clickitem'],
|
||||
data() {
|
||||
return {
|
||||
queryParams: {
|
||||
refreshing: false,
|
||||
status: 'more',
|
||||
pageNum: 1,
|
||||
pageSize: 10
|
||||
},
|
||||
list:[],
|
||||
innerAudioContext:'',
|
||||
paused:false,
|
||||
types:[{
|
||||
label:'全部',
|
||||
value:''
|
||||
},{
|
||||
label:'文字',
|
||||
value:'TEXT'
|
||||
},{
|
||||
label:'图片',
|
||||
value:'IMAGE'
|
||||
},{
|
||||
label:'视频',
|
||||
value:'VIDEO'
|
||||
},{
|
||||
label:'位置',
|
||||
value:'LOCATION'
|
||||
},{
|
||||
label:'语音',
|
||||
value:'VOICE'
|
||||
},{
|
||||
label:'名片',
|
||||
value:'CARD'
|
||||
}]
|
||||
};
|
||||
},
|
||||
props:{
|
||||
type:{
|
||||
type:String,
|
||||
default:'1'//1列表 2聊天窗口
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.queryParams.refreshing=true
|
||||
this.getList('')
|
||||
},
|
||||
computed:{
|
||||
userinfo() {
|
||||
return this.$store.state.userInfo;
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
clickitem(e,i){
|
||||
this.$emit('clickitem',e,i)
|
||||
},
|
||||
favoritesDeleta(e,i){
|
||||
uni.showModal({
|
||||
title: '警告',
|
||||
content: '是否确认删除收藏',
|
||||
success: (res)=> {
|
||||
if (res.confirm) {
|
||||
this.$http.request({
|
||||
url: '/collect/remove/'+e.collectId,
|
||||
success: (res) => {
|
||||
if (res.data.code == 200) {
|
||||
this.list.splice(i,1)
|
||||
}
|
||||
}
|
||||
});
|
||||
} else if (res.cancel) {
|
||||
|
||||
}
|
||||
}
|
||||
});
|
||||
},
|
||||
goAddfriend(e){
|
||||
uni.navigateTo({
|
||||
url:'../personInfo/detail?param='+e.userId+'&source=2'
|
||||
})
|
||||
},
|
||||
returnParse(txt) {
|
||||
return JSON.parse(txt);
|
||||
},
|
||||
getList(e){
|
||||
uni.showLoading();
|
||||
this.queryParams.status='loading'
|
||||
this.$fc.loadMore({
|
||||
url: '/collect/list?collectType='+e,
|
||||
queryParams: this.queryParams
|
||||
}).then(res => {
|
||||
this.queryParams = res.queryParams;
|
||||
if (res.status=='3') {
|
||||
this.list=[]
|
||||
return
|
||||
}
|
||||
if (res.status=='0') {
|
||||
return
|
||||
}
|
||||
var rows = res.list;
|
||||
var list = [];
|
||||
for (var i = 0; i < rows.length; i++) {
|
||||
var item = rows[i];
|
||||
list.push(item);
|
||||
}
|
||||
if (res.status=='2') {
|
||||
this.list = list;
|
||||
}
|
||||
if (res.status=='1') {
|
||||
this.list = this.list.concat(list);
|
||||
}
|
||||
});
|
||||
},
|
||||
playVOICE(url){
|
||||
if(this.paused){
|
||||
this.innerAudioContext.destroy()
|
||||
this.paused=!this.paused
|
||||
return
|
||||
}
|
||||
this.innerAudioContext = uni.createInnerAudioContext();
|
||||
// var url='https://www.w3school.com.cn/i/horse.ogg'
|
||||
this.innerAudioContext.sessionCategory='soloAmbient'
|
||||
this.innerAudioContext.src = url;
|
||||
this.innerAudioContext.play()
|
||||
|
||||
this.innerAudioContext.onPlay(() => {
|
||||
// console.log('播放')
|
||||
this.paused=true
|
||||
})
|
||||
this.innerAudioContext.onPause(() => {
|
||||
// console.log('暂停')
|
||||
this.paused=false
|
||||
this.innerAudioContext.destroy()
|
||||
})
|
||||
},
|
||||
goMap(e) {
|
||||
uni.openLocation({
|
||||
latitude: e.latitude,
|
||||
longitude: e.longitude,
|
||||
success: function() {}
|
||||
});
|
||||
},
|
||||
openVideo(url){
|
||||
this.$fc.plusDownload({onlinePath:url}).then(res=>{
|
||||
this.$fc.plusOpenFile({filePath:res})
|
||||
})
|
||||
},
|
||||
clickType(e){
|
||||
this.queryParams.refreshing=true
|
||||
this.getList(e.value)
|
||||
}
|
||||
},
|
||||
onPullDownRefresh() {
|
||||
this.queryParams.refreshing=true
|
||||
this.getList('');
|
||||
},
|
||||
onReachBottom() {
|
||||
this.getList('');
|
||||
},
|
||||
onNavigationBarButtonTap(e) {
|
||||
switch (e.index) {
|
||||
case 0:
|
||||
uni.showToast({
|
||||
title:'添加',
|
||||
icon:'none'
|
||||
})
|
||||
break;
|
||||
default:
|
||||
break;
|
||||
}
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.bgColor{
|
||||
background: #EDEDED;
|
||||
}
|
||||
.favorites-wx{
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
.favorites-wx-item{
|
||||
flex: 1;
|
||||
display: flex;flex-direction: column;
|
||||
margin:0 24rpx;
|
||||
background-color: #fff;
|
||||
border-radius: 12rpx;
|
||||
padding: 38rpx;
|
||||
}
|
||||
.favorites-wx-content{
|
||||
display: flex;flex-direction: row;
|
||||
}
|
||||
.favorites-wx-bottom{
|
||||
display: flex;flex-direction: row;align-items: center;
|
||||
margin-top: 12rpx;
|
||||
}
|
||||
.favorites-wx-bottom text{
|
||||
margin-right: 24rpx;
|
||||
font-size: 24rpx;
|
||||
color: #999;
|
||||
}
|
||||
.favorites-wx-top{
|
||||
margin: 24rpx;
|
||||
padding: 24rpx;
|
||||
display: flex;flex-direction: row;flex-wrap: wrap;
|
||||
background-color: #fff;
|
||||
border-radius: 12rpx;
|
||||
margin-bottom: 24rpx;
|
||||
}
|
||||
.favorites-wx-top-item{
|
||||
color: #5F698C;
|
||||
width: 33.333%;
|
||||
box-sizing: border-box;
|
||||
padding: 0 24rpx;
|
||||
margin: 24rpx 0;
|
||||
text-align: center;
|
||||
overflow: hidden;
|
||||
}
|
||||
.favorites-wx-top-item:nth-child(3n-1){
|
||||
border-left: 1px #ddd solid;
|
||||
border-right: 1px #ddd solid;
|
||||
}
|
||||
.favorites-wx-content-text{}
|
||||
.favorites-wx-text{
|
||||
color: #333;
|
||||
font-size: 32rpx;
|
||||
}
|
||||
.favorites-wx-content-img image{
|
||||
width: 160rpx;
|
||||
height: 160rpx;
|
||||
}
|
||||
|
||||
|
||||
.favorites-wx-content-video{
|
||||
|
||||
}
|
||||
.favorites-wx-content-video-img,.favorites-wx-content-video-img image{
|
||||
width: 160rpx;
|
||||
height: 160rpx;
|
||||
position: relative;
|
||||
}
|
||||
.favorites-wx-content-video-icon{
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%,-50%);
|
||||
display: flex;flex-direction: row;justify-content: center;align-items: center;
|
||||
}
|
||||
.favorites-wx-content-video-icon text{
|
||||
font-size: 64rpx;
|
||||
color: #dddddd;
|
||||
text-shadow: 0px 0px 5px rgba(0,0,0,0.3);
|
||||
}
|
||||
.favorites-wx-content-location{
|
||||
}
|
||||
.favorites-wx-content-location-box {
|
||||
border: 1px #f6f6f6 solid;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
width: 100%;
|
||||
border-radius: 12rpx;
|
||||
padding: 24rpx;
|
||||
}
|
||||
.favorites-wx-content-location-box-name {
|
||||
font-size: 28rpx;
|
||||
color: #101010;
|
||||
font-weight: bold;
|
||||
}
|
||||
.favorites-wx-content-location-box-address {
|
||||
font-size: 26rpx;
|
||||
color: #666;
|
||||
margin-bottom: 12rpx;
|
||||
}
|
||||
.favorites-wx-content-location-box-map {
|
||||
background-color: #e5ffff;
|
||||
overflow: hidden;
|
||||
width: 100%;
|
||||
height: 150rpx;
|
||||
}
|
||||
.favorites-wx-content-voice-box{
|
||||
display: flex;flex-direction: row;align-items: center;flex-wrap: wrap;
|
||||
}
|
||||
.favorites-wx-content-voice{}
|
||||
.favorites-wx-content-voice-vmove{
|
||||
animation: scalevVoice 1s linear infinite;
|
||||
transform: scale(1);
|
||||
}
|
||||
@keyframes scalevVoice {
|
||||
0% {
|
||||
transform: scale(1);
|
||||
}
|
||||
50% {
|
||||
transform: scale(1.3);
|
||||
}
|
||||
100% {
|
||||
transform: scale(1);
|
||||
}
|
||||
}
|
||||
.favorites-wx-content-voice-tras{
|
||||
display: flex;flex-direction: row;align-items: center;
|
||||
}
|
||||
.favorites-wx-content-voice-tras text{
|
||||
padding:6rpx 12rpx;
|
||||
font-size: 24rpx;
|
||||
background-color: #eee;
|
||||
border-radius: 12rpx;
|
||||
color: #bcbcbc;
|
||||
margin:0 12rpx;
|
||||
}
|
||||
.favorites-wx-content-voice-content{
|
||||
padding:12rpx 24rpx;
|
||||
border-radius: 12rpx;
|
||||
background-color: #4cd964;
|
||||
display: flex;flex-direction: row;align-items: center;
|
||||
}
|
||||
.favorites-wx-content-voice-text{
|
||||
width: 100%;
|
||||
font-size: 26rpx;
|
||||
color: #666;
|
||||
word-break: break-all;
|
||||
}
|
||||
.favorites-wx-content-card{
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
border: 1px #f6f6f6 solid;
|
||||
padding: 24rpx;
|
||||
border-radius: 12rpx;
|
||||
}
|
||||
.favorites-wx-content-card-top{
|
||||
display: flex;flex-direction: row;align-items: center;
|
||||
}
|
||||
.favorites-wx-content-card-top-img{
|
||||
width: 80rpx;
|
||||
min-width: 80rpx;
|
||||
height: 80rpx;
|
||||
margin-right: 24rpx;
|
||||
border-radius: 6rpx;
|
||||
}
|
||||
.favorites-wx-content-card-top-content{
|
||||
overflow: hidden;
|
||||
display: flex;flex-direction: column;
|
||||
}
|
||||
.favorites-wx-content-card-title{
|
||||
color: #070707;
|
||||
font-size: 32rpx;
|
||||
}
|
||||
.favorites-wx-content-card-no{
|
||||
font-size: 24rpx;
|
||||
color: #999;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
.favorites-wx-content-card-card{
|
||||
font-size: 24rpx;
|
||||
color: #666;
|
||||
margin-top: 24rpx;
|
||||
}
|
||||
.favorites-wx-view{
|
||||
background-color: #00aaff;
|
||||
}
|
||||
.favorites-wx-delete{
|
||||
background-color: #F55C23;
|
||||
}
|
||||
.favorites-wx-action-item-btn{
|
||||
color: #fff;
|
||||
padding:0 24rpx;
|
||||
flex: 1;
|
||||
display: flex;flex-direction: row;justify-content: center;align-items: center;
|
||||
}
|
||||
.favorites-wx-action-item{
|
||||
box-sizing: border-box;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
.favorites-uni-swipe-action-item{
|
||||
margin-bottom: 24rpx;
|
||||
}
|
||||
.favorites-uni-swipe-action-item:nth-last-child(1){
|
||||
margin-bottom: 0;
|
||||
}
|
||||
.favorites-wx-tips{
|
||||
width: 100%;
|
||||
color: #999;
|
||||
font-size: 24rpx;
|
||||
text-align: center;
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user