<script setup>
import { ref } from 'vue'

const footerText = import.meta.env.VITE_APP_FOOTER || ''
</script>

<template>
    <v-footer app class="footer-component">
        <v-container fluid class="pa-0">
            <v-row align="center" justify="center">
                <v-col cols="12" class="text-center" style="display: flex;align-items: center;justify-content: space-between;">
                    <span class="float-left text-caption">{{ footerText }}</span>
                    <span class="float-right text-caption">版本：3.0.0</span>
                </v-col>
            </v-row>
        </v-container>
    </v-footer>
</template>

<style lang="scss" scoped>
.footer-component {
    border-top: 1px solid rgba(var(--v-border-color), var(--v-border-opacity));
    background-color: rgb(var(--v-theme-surface)) !important;
    height: 45px;

    .footer-text {
        color: rgba(var(--v-theme-on-surface), var(--v-medium-emphasis-opacity));
        font-size: 0.875rem;
    }
}
</style>
