TmOct5/ZhHealth
1
0
Fork 0
Code Issues Pull Requests Projects Releases 3 Wiki Activity

新增im聊天弹窗

Browse Source
This commit is contained in:
唐明明
2022-02-07 16:03:57 +08:00
parent 113bc91625
commit d2b9379d2b
13 changed files with 142 additions and 13 deletions
Download Patch File Download Diff File Expand all files Collapse all files

119
pages/im/components/sentPopups.nvue Normal file
View File

@@ -0,0 +1,119 @@
<template>
<view class="sent--popups" v-if="show">
<view class="sent--popups--item" @click="onPopupsItem('picture')">
<image class="sent--popups--icon" src="@/static/icon/popups-icon-00.png" mode="widthFix"></image>
<text class="sent--popups--text">相册</text>
</view>
<view class="sent--popups--item" @click="onPopupsItem('film')">
<image class="sent--popups--icon" src="@/static/icon/popups-icon-01.png" mode="widthFix"></image>
<text class="sent--popups--text">拍摄</text>
</view>
<view class="sent--popups--item" @click="onPopupsItem('video')">
<image class="sent--popups--icon" src="@/static/icon/popups-icon-02.png" mode="widthFix"></image>
<text class="sent--popups--text">视频通话</text>
</view>
<view class="sent--popups--item" @click="onPopupsItem('location')">
<image class="sent--popups--icon" src="@/static/icon/popups-icon-03.png" mode="widthFix"></image>
<text class="sent--popups--text">位置</text>
</view>
<view class="sent--popups--item" @click="onPopupsItem('redpacket')">
<image class="sent--popups--icon" src="@/static/icon/popups-icon-04.png" mode="widthFix"></image>
<text class="sent--popups--text">红包</text>
</view>
<view class="sent--popups--item" @click="onPopupsItem('file')">
<image class="sent--popups--icon" src="@/static/icon/popups-icon-05.png" mode="widthFix"></image>
<text class="sent--popups--text">文件</text>
</view>
</view>
</template>
<script>
export default {
data() {
return {
};
},
props:{
show: {
type: Boolean,
default: false
}
},
methods:{
onPopupsItem(type){
switch (type){
case 'picture':
uni.chooseImage({
count: 9,
sourceType: ['album'],
success: res => {
this.onSentValue(type, res.tempFilePaths)
}
})
break;
case 'film':
uni.chooseImage({
sourceType: ['camera'],
success: res => {
this.onSentValue(type, res.tempFilePaths)
}
})
break;
case 'video':
this.onSentValue(type, {})
break;
case 'location':
uni.chooseLocation({
success: res=> {
this.onSentValue(type, {
address: res.address,
longitude: res.longitude,
latitude: res.latitude,
name: res.name
})
}
})
break;
case 'redpacket':
console.log('红包')
break;
case 'file':
console.log('文件选择')
break;
}
},
// 处理返回
onSentValue(type, value){
this.$emit('onVlaue', { type, value })
this.show = false
}
}
}
</script>
<style lang="scss" scoped>
.sent--popups{
background: white;
padding: 30rpx 15rpx;
flex-wrap: wrap;
flex-direction: row;
&--item{
width: 150rpx;
margin: 15rpx;
}
&--text{
text-align: center;
font-size: 26rpx;
color: #555;
padding-top: 15rpx;
}
&--icon{
width: 110rpx;
height: 110rpx;
margin: 0 20rpx;
border-radius: 20rpx;
background: #F3F6FB;
}
}
</style>

2
pages/im/components/sentText.nvue
View File

@@ -1,7 +1,7 @@
<template>
<view class="text">
<input class="input" type="text" v-model="inputTxt" confirm-type="send" @confirm="sent" cursor-spacing="10" />
<button class="button" size="mini" :disabled="disabled" @click="sent">发送</button>
<!-- <button class="button" size="mini" :disabled="disabled" @click="sent">发送</button> -->
</view>
</template>