<script setup lang="ts">
import { useUserStore } from "@/store";
const emit = defineEmits(['toggleNotOpen']);
const userStore = useUserStore();
function navigateTo(url: string) {
  if(userStore.checkLogin()) {
    uni.navigateTo({
      url,
    });
  }
}
</script>

<template>
  <view class="flex items-center">
    <view @click="navigateTo('/pages-user/pages/message/index')" class="w-40rpx h-40rpx mr-42rpx relative">
      <view v-if="userStore.isLogin && userStore.unreadMessageCount > 0" class="w-32rpx h-32rpx bg-#E23636 absolute z-2 top--16rpx right--16rpx rounded-50% text-24rpx text-#fff text-center line-height-32rpx">{{ userStore.unreadMessageCount }}</view>
      <image src="@img/chef/114.png" class="w-40rpx h-40rpx"></image>
    </view>
    <image @click="emit('toggleNotOpen')" src="@img/chef/115.png" class="w-40rpx h-40rpx"></image>
  </view>
</template>

<style scoped lang="scss">

</style>