out-rangetip.vue 698 Bytes
<template>
    <section class="out-rangetip" v-show="isOutRange">
        <span v-text="$t('outOfPrintRange')" />
    </section>
</template>
<script setup>
import { storeToRefs } from 'pinia';
import { useOutRangeTipStore } from '@/views/stores/useOutRangeTipStore';

const store = useOutRangeTipStore();
const { isOutRange } = storeToRefs(store);
</script>
<style lang="less">
.out-rangetip {
    position: absolute;
    top: 54px;
    width: 100vw;
    display: flex;
    justify-content: center;
    pointer-events: none;
    span {
        font-size: 22px;
        font-weight: 600;
        background-color: rgba(255, 255, 20, 0.7);
        color: red;
        padding: 10px;
    }
}
</style>