<template>
    <div class="page flex min-h-full flex-col bg-contain bg-no-repeat bg-[#F5F6F8]">
        <!-- <n-page-header
            class="header"
            :class="[scrollY ? 'bg-white dark:bg-black' : '']"
            title="智能体"
            @back="handleBack"
        >
            <template #extra>
                <div class="w-[22px]"></div>
            </template>
        </n-page-header> -->
        <agent-pannel></agent-pannel>
    </div>
</template>

<script setup lang="ts">
import { NPageHeader } from 'naive-ui'
import { useRouter } from 'vue-router'
import { AgentPannel } from '@/components/common'
import bgImg from '@/assets/png-beij.png'
import { useWindowScroll } from '@vueuse/core'
import { computed } from 'vue'

const router = useRouter()
function handleBack() {
    router.back()
}
const { y } = useWindowScroll()

const scrollY = computed(() => {
    return y.value
})
</script>

<style lang="less" scoped>
.page {
    color: var(--n-text-color);
}

:deep(.n-page-header) {
    height: 50px;
    padding: 0 22px;
    .n-page-header__main {
        flex-grow: 1;
        .n-page-header__title {
            flex-grow: 1;
            text-align: center;
        }
    }
}

.header {
    position: sticky;
    top: 0;
    z-index: 20;
}
</style>
