<template>
<view :class="props.class" class="header_info"
:style="{ height: appStore.navbarHeight + 'px',paddingTop: appStore.statusBarHeight + 'px'}"
>
  <view class="isBack" >
    <u-icon name="arrow-left" :color="color" size="24"  v-if="isBack" @click="goBack"></u-icon>
    <slot name="right"></slot>
  </view>
  <text class="font_size35 bold color_fff flex_1 text_align_center">{{title}}</text>
</view>
</template>

<script setup>
const props = defineProps({
  title: {
    type: String,
    default: "建材信息平台",
  },
  class: {
    type: String,
    default: 'flex-center',
  },
  isBack: {
    type: Boolean,
    default: false,
  },
  color: {
    type: String,
    default: '#ffffff',
  },
});

import { useAppStore } from "@/stores/app";
const appStore = useAppStore();

const goBack = () => {
  uni.navigateBack({
    delta: 1,
  });
}
</script>

<style scoped lang="scss">
.header_info{
  position: relative;
  .isBack{
    position: absolute;
    left: 0;
    bottom: 10px;
  }
}
</style>