<template>
  <view
    :style="{
      paddingTop: navbarRect.top + 'px',
      height: navbarRect.height + 'px',
    }"
    class="navbar"
  >
    <view class="left" @click="handleMsg()" v-if="title === '工作台'">
      <view class="msg-badge">
        <up-badge max="99" :value="count"></up-badge>
      </view>

      <up-image
        src="https://backend-common.obs.cn-east-3.myhuaweicloud.com/static/pages/message.png"
        width="42rpx"
        height="36rpx"
      ></up-image>
    </view>

    <view class="title">{{ title }}</view>
  </view>
</template>
<script setup lang="ts">
import {
  ProfileApi,
  ReceiveApi,
  ShipmentApi,
  PictureApi,
  ReceiveProductApi,
  DeviceApi,
  StockCardApi,
  GoodsApi,
  SupplierApi,
  CustomerApi,
  FinanceApi,
  MessageApi,
} from "@/services";
import { formatDate } from "@/utils";
import { UsersType } from "@/utils/enum";
import valid from "@/utils/validate";
console.log(
  ProfileApi,
  ReceiveApi,
  ShipmentApi,
  PictureApi,
  ReceiveProductApi,
  DeviceApi,
  StockCardApi,
  GoodsApi,
  SupplierApi,
  CustomerApi,
  FinanceApi,
  formatDate,
  UsersType,
  valid
);

const props = withDefaults(
  defineProps<{
    count: number;
    title: string;
  }>(),
  {
    count: 0,
  }
);

const navbarRect = reactive({
  height: 42,
  top: 48,
  msgCount: 10,
});
onMounted(() => {
  // #ifdef MP-WEIXIN
  let menuButtonInfo = uni.getMenuButtonBoundingClientRect();
  navbarRect.height = menuButtonInfo.height;
  navbarRect.top = menuButtonInfo.top;
  // #endif
});
const handleMsg = () => {
  uni.navigateTo({
    url: "/pagesLogin/message/index", // 要跳转到的页面路径
  });
};
</script>
<style lang="scss">
.navbar {
  background: #f9f9f9;
  // box-shadow: 0rpx 0rpx 10rpx 0rpx rgba(0, 0, 0, 0.18);
  padding: 15rpx;
  position: fixed;
  width: 100%;
  top: 0;
  left: 0;
  right: 0;
  z-index: 999;
  .left {
    position: absolute;
    margin-top: 10px;
    .msg-badge {
      margin-left: 20rpx;
      font-size: 16rpx;
      padding: 2px 4px;
      position: absolute;
      z-index: 9;
      margin-top: -10px;
    }
  }
  .title {
    font-size: 32rpx;
    font-family: Source Han Sans CN;
    font-weight: 500;
    color: #000000;
    line-height: 41rpx;
    text-align: center;
    padding: 5px;
  }
}
</style>
