ykt-team-wxapp/pages/home/team-mate.vue
2026-01-20 19:36:49 +08:00

75 lines
2.3 KiB
Vue

<template>
<view class="mt-12 px-15 flex items-center justify-between">
<view class="text-lg font-semibold text-dark">团队成员</view>
<view class="flex items-center" @click="toTeamDetail()">
<view class="mr-5 text-base text-gray">团队详情</view>
<uni-icons type="right" color="#999"></uni-icons>
</view>
</view>
<view class="px-15 mt-10">
<scroll-view scroll-x="true">
<view class="flex flex-nowrap pb-5 border-b">
<view v-for="i in teamates" :key="i.userid"
class="flex flex-shrink-0 min-w-120 p-10 mr-10 rounded-sm border-auto text-primary bg-white"
@click="toHomePage(i)">
<image class="flex-shrink-0 avatar mr-5" :src="i.avatar || '/static/default-avatar.png'" />
<view class="flex-grow flex flex-col">
<view class="text-lg font-semibold text-dark whitespace-nowrap">
{{ i.anotherName }}
</view>
<view class="text-base text-gray truncate">
医生
</view>
<view v-if="i.canAddFriend" class="w-80 text-base leading-none border text-center text-dark rounded-full"
@click.stop="toQrcode(i)">
添加好友
</view>
</view>
</view>
</view>
</scroll-view>
</view>
</template>
<script setup>
import { computed } from 'vue'
const props = defineProps({
team: {
type: Object,
default: () => ({})
}
})
const teamates = computed(() => {
const friendlyMembers = props.team && Array.isArray(props.team.friendlyMembers) ? props.team.friendlyMembers : [];
const memberList = props.team && Array.isArray(props.team.memberList) ? props.team.memberList : [];
return memberList.map(i => ({ ...i, canAddFriend: friendlyMembers.includes(i.userid) }))
})
function toHomePage(item) {
uni.navigateTo({ url: `/pages/team/homepage?userid=${item.userid}&corpId=${item.corpId}` })
}
function toQrcode(item) {
uni.navigateTo({ url: `/pages/team/friend?userid=${item.userid}&corpId=${item.corpId}` })
}
function toTeamDetail() {
uni.navigateTo({ url: `/pages/team/team-detail?teamId=${props.team.teamId}&corpId=${props.team.corpId}&corpName=${encodeURIComponent(props.team.corpName)}` })
}
</script>
<style scoped>
.avatar {
width: 120rpx;
height: 128rpx;
}
.min-w-120 {
min-width: 240rpx;
}
.w-80 {
width: 160rpx;
}
</style>