<template>
	<view>
		<cu-custom bgImage="/static/bg.png" :isBack="false" v-if="user?.deptId=='103'">
			<template v-slot:content>
				THW-IM
			</template>
		</cu-custom>
		<view class="cu-list menu-avatar tab-bar-mar">
			<view class="cu-item bg-cyan" :class="modalName==='move-box-'+ index?'move-cur':''"
				:style="chat.top?'background-color:#f8f8f8':''" v-for="(chat, index) in chatStore.chats" :key="chat.id"
				@touchstart="handleListTouchStart" @tap="handleSend(chat.id)" @touchmove="handleListTouchMove"
				@touchend="handleListTouchEnd" :data-target="'move-box-' + index">
				<vim-avatar :img="chat.avatar" :name="chat.name" :is-group="chat.type === ChatType.GROUP" />
				<view class="content">
					<view class="text-grey">{{ chat.name }}</view>
					<view class="text-gray text-sm text-cut">
						{{ chatLastMessage[chat.id] }}
					</view>
				</view>
				<view class="chat-right">
					<view class="text-center">
						<view class="cu-tag round bg-orange sm" v-if="chat.unreadCount>0">{{ chat.unreadCount }}</view>
						<view class="cu-tag bg-gray radius sm" v-if="chatLastTime[chat.id]">
							{{formatDistanceToNow(chatLastTime[chat.id], {
              locale: zhCN,
              addSuffix: false,
            })}}
						</view>
					</view>
					<view class="text-center" v-if="immunityList.includes(chat.id)">
						<view class="cuIcon-notice_forbid_fill text-gray"></view>
					</view>
				</view>
				<view class="move">
					<view class="bg-red" @tap.stop="chatStore.delChat(chat.id)">删除</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script setup lang="ts">
	import type Message from '@/mode/Message'
	import Auth from "@/api/Auth";
	import { onLoad } from '@dcloudio/uni-app';
	import UserApi from '@/api/UserApi';
	import { useChatStore } from "@/store/chatStore";
	import { useImmunityStore } from "@/store/immunityStore";
	import CuCustom from '@/colorui/components/cu-custom.vue'
	import { handleListTouchEnd, handleListTouchMove, handleListTouchStart, modalName } from "@/hooks/useMoveMenu";
	import { onMounted } from "vue";
	import VimAvatar from "@/components/VimAvatar.vue";
	import { formatDistanceToNow } from "date-fns";
	import { zhCN } from "date-fns/locale";
	import { storeToRefs } from "pinia";
	import ChatType from "@/utils/ChatType";
	import {
		useUserStore
	} from '@/store/userStore'
	const userStore = useUserStore()

	const chatStore = useChatStore();
	const immunityStore = useImmunityStore();
	const { chatLastMessage, chatLastTime, chatUnreadId } = storeToRefs(chatStore)
	const { immunityList } = storeToRefs(immunityStore)


	//发送消息
	const handleSend = (id : string) => {
		uni.navigateTo({
			url: '/pages/chat/chat?id=' + id
		})
	}
	// 从淘号玩跳转
	onLoad((options) => {
		var token = options?.token;
		var id = options?.id;
		var data = options?.data;
		if (token != '' && token != undefined) {
			Auth.setToken(token);
			return UserApi.currentUser().then(response => {
				const user = response.data;
				userStore.setUser(user);
				if (data) {
					userStore.setDetails(data);
				}
				uni.setStorageSync('userId', response.data.id)
				UserApi.getUser(id).then((res) => {
					chatStore.openChat({
						id: res.data.id,
						name: res.data.name,
						avatar: res.data.avatar,
						type: ChatType.FRIEND,
						unreadCount: 0,
						isLoading: false,
						loaded: true,
					});
					uni.navigateTo({
						url: '/pages/chat/chat?id=' + res.data.id + '&type=' + ChatType.FRIEND
					})
				});
			})
		}
	})

	onMounted(() => {
		chatStore.setOpenChatId(null);
	})
	//当前用户
	const user = userStore.getUser()
</script>
<style scoped>
	.cu-item:active {
		background-color: #aaaaaa;
	}

	.chat-right {
		width: 140upx
	}
</style>