<script setup>
import {ref} from 'vue';
import {backPage, isWXWeb} from "../utils/uils.js";

const {showBack, delta} = defineProps({
    showBack: {
        type: Boolean,
        default: true
    },
    delta: {
        type: Number,
        default: 1,
    }
});

const title = ref(document.title);
</script>

<template>
    <template v-if="!isWXWeb()">
        <view class="!flex justify-center items-center w-full h-[100rpx] bg-[#f9f9f9] fixed left-0 top-0 z-[1000]">
            <image
                v-if="showBack"
                @click="backPage(delta)"
                class="!w-[9px] !h-[17px] cursor-pointer !absolute left-[50rpx]"
                src="/static/icons/back.png">
            </image>

            <view class="title">
                <text v-if="!$slots.default">{{ title }}</text>
                <slot v-else></slot>
            </view>
        </view>

        <view class="h-[100rpx] w-full"></view>
    </template>
</template>

<style lang="scss" scoped>
.title {
    color: rgb(0, 0, 0);
    font-family: '思源黑体', sans-serif;
    font-size: 17px;
    font-weight: 500;
    line-height: 25px;
    letter-spacing: 0;
    text-align: center;
}
</style>
