jiuyiUniapp/jiuyi2/pages/news/group-chat/book.vue

96 lines
1.8 KiB
Vue

<script setup>
/**
* 选择好友
*/
import {
useStore,
} from 'vuex'
import {
ref,
computed,
reactive,
onMounted,
inject,
getCurrentInstance,
watch,
} from 'vue'
// 工具库
import util from '@/common/js/util.js'
// 腾讯云聊天
import TencentCloudChat from '@tencentcloud/chat';
//
import api from '@/api/index.js'
//
const props = defineProps({
// 列表数据
list: {
type: Array,
},
})
const {
proxy
} = getCurrentInstance();
// 已选择的视频id
const ids = defineModel('ids')
//
const store = useStore()
const userinfo = computed(() => {
let result = store.state.userinfo
return result
})
/**
* 点击用户
* @param {Object} item 当前用户信息
*/
function handleUser(item) {
console.log('handleUser', item)
const findIndex = ids.value.findIndex(node => node == item.userID)
if (findIndex >= 0) ids.value.splice(findIndex, 1)
else ids.value.push(item.userID)
}
</script>
<template>
<view class="firendBox pr">
<view class="list bfff">
<view class="li" v-for="(item, index) in list" :key="index" @click="handleUser(item)">
<view class="item rows ptb20 pl30 pr50">
<image class="wh80 avatar cir" :src="item.profile.avatar" mode="aspectFill" />
<view class="name thd f1 ml20 c333 f32">{{item.remark || item.profile.nick}}</view>
<uni-icons type="circle-filled" size="40rpx" color="#20D200" v-if="ids.includes(item.userID)" />
<uni-icons type="circle" size="40rpx" color="#ccc" v-else />
</view>
</view>
</view>
<view class="mtb20 nomore">到底啦~</view>
</view>
</template>
<style lang="scss" scoped>
// 朋友列表
.firendBox {
height: 100%;
.scroll {
height: 100%;
}
// 列表项
.li {
.letter {
background-color: #eee;
}
}
// 子集
.child {
.item+.item {
border-top: 2rpx solid #eee;
}
}
}
</style>