<template>
  <up-tabbar
    :value="value"
    :fixed="true"
    :zIndex="99"
    :placeholder="true"
    activeColor="#3CC7C0"
    :safeAreaInsetBottom="true"
  >
    <up-tabbar-item text="临床病例库"  @click="handleClick">
         <image
      class="u-page__item__slot-icon"
      slot="active-icon"
      :src="ku_on"
    ></image>
     <image
      class="u-page__item__slot-icon"
      slot="inactive-icon"
       :src="ku"
    ></image>
    </up-tabbar-item>
    <up-tabbar-item text="互动病例"  @click="handleClick">
        <image
      class="u-page__item__slot-icon"
      slot="active-icon"
      :src="group_on"
    ></image>
     <image
      class="u-page__item__slot-icon"
      slot="inactive-icon"
       :src="group"
    ></image>
    </up-tabbar-item>
    <up-tabbar-item text="病例交流"  @click="handleClick">
       <image
      class="u-page__item__slot-icon"
      slot="active-icon"
      width="47rpx"
      height="47rpx"
      :src="talk_on"
    ></image>
    <image
       width="47rpx"
       height="47rpx"
      class="u-page__item__slot-icon"
      slot="inactive-icon"
      :src="talk"
    ></image>
    </up-tabbar-item>
  </up-tabbar>
</template>

<script setup>
import group from "@/static/group.png";
import ku from "@/static/ku.png";
import ku_on from "@/static/ku_on.png";
import group_on from "@/static/group_on.png";
import talk from "@/static/talk.png";
import talk_on from "@/static/talk_on.png";
import { ref } from "vue";
const props=defineProps({
  value: {
    type: Number,
    default: 0,
  }
});
const handleClick = (e) => {
   if(e==1){
      uni.navigateTo({
      url: "/pages/case/case",
    });
   }
};
</script>

<style scoped>
.u-page__item__slot-icon{
  width: 47rpx;
  height: 47rpx;
}
</style>