<template> 
 | 
    <div class="page"> 
 | 
        <div class="page_title">半成品仓-03货位</div> 
 | 
        <div class="page_content"> 
 | 
            <div class="page_content_title"> 
 | 
                <span>锂电池 | WL0001 | PH238094023</span> 
 | 
                <span>400/500个</span> 
 | 
            </div> 
 | 
            <div class="page_content_item"> 
 | 
                <span>LK001:</span> 
 | 
                <span>100个</span> 
 | 
            </div> 
 | 
            <div class="page_content_item"> 
 | 
                <span>LK001:</span> 
 | 
                <span>100个</span> 
 | 
            </div> 
 | 
            <div class="page_content_item"> 
 | 
                <span>LK001:</span> 
 | 
                <span>100个</span> 
 | 
            </div> 
 | 
            <div class="page_content_item"> 
 | 
                <span>LK001:</span> 
 | 
                <span>100个</span> 
 | 
            </div> 
 | 
        </div> 
 | 
        <div class="page_h"></div> 
 | 
        <div class="page_footer"> 
 | 
            <div class="page_footer_jx">继续扫码</div> 
 | 
            <div class="page_footer_bc">保存</div> 
 | 
        </div> 
 | 
    </div> 
 | 
</template> 
 | 
  
 | 
<script setup lang="ts"> 
 | 
  
 | 
</script> 
 | 
  
 | 
<style lang="scss" scoped> 
 | 
.page { 
 | 
    width: 100%; 
 | 
    height: 100%; 
 | 
    position: absolute; 
 | 
    background: #F7F7F7; 
 | 
    .page_title { 
 | 
        padding: 30px; 
 | 
        font-size: 28px; 
 | 
        font-weight: 400; 
 | 
        color: #222222; 
 | 
    } 
 | 
    .page_content { 
 | 
        width: 100%; 
 | 
        padding: 30px; 
 | 
        box-sizing: border-box; 
 | 
        background: white; 
 | 
        .page_content_title { 
 | 
            display: flex; 
 | 
            align-items: center; 
 | 
            justify-content: space-between; 
 | 
            span { 
 | 
                &:nth-child(1) { 
 | 
                    font-size: 28px; 
 | 
                    font-weight: 400; 
 | 
                    color: #333333; 
 | 
                } 
 | 
                &:nth-child(2) { 
 | 
                    font-size: 28px; 
 | 
                    font-weight: 500; 
 | 
                    color: #4275FC; 
 | 
                } 
 | 
            } 
 | 
        } 
 | 
        .page_content_item { 
 | 
            display: flex; 
 | 
            align-items: center; 
 | 
            margin-top: 30px; 
 | 
            span { 
 | 
                &:nth-child(1) { 
 | 
                    font-size: 24px; 
 | 
                    font-weight: 400; 
 | 
                    color: #777777; 
 | 
                } 
 | 
                &:nth-child(2) { 
 | 
                    font-size: 24px; 
 | 
                    font-weight: 400; 
 | 
                    color: #333333; 
 | 
                } 
 | 
            } 
 | 
        } 
 | 
    } 
 | 
    .page_h { 
 | 
        height: 168px; 
 | 
    } 
 | 
    .page_footer { 
 | 
        width: 100%; 
 | 
        position: fixed; 
 | 
        bottom: 0; 
 | 
        left: 0; 
 | 
        display: flex; 
 | 
        align-items: center; 
 | 
        justify-content: space-between; 
 | 
        padding: 0 30px 68px 30px; 
 | 
        box-sizing: border-box; 
 | 
        .page_footer_jx { 
 | 
            width: 334px; 
 | 
            height: 88px; 
 | 
            background: #FFFFFF; 
 | 
            box-shadow: 0 0 12px 0 rgba(0, 0, 0, 0.08); 
 | 
            border-radius: 8px; 
 | 
            font-size: 30px; 
 | 
            font-weight: 500; 
 | 
            color: $nav-color; 
 | 
            display: flex; 
 | 
            align-items: center; 
 | 
            justify-content: center; 
 | 
        } 
 | 
        .page_footer_bc { 
 | 
            width: 334px; 
 | 
            height: 88px; 
 | 
            background: $nav-color; 
 | 
            box-shadow: 0 0 12px 0 rgba(0, 0, 0, 0.08); 
 | 
            border-radius: 8px; 
 | 
            color: #ffffff; 
 | 
            display: flex; 
 | 
            align-items: center; 
 | 
            justify-content: center; 
 | 
        } 
 | 
    } 
 | 
} 
 | 
</style> 
 |