<template>
    <div class="data_box">
        <!-- 统计数据 -->
        <div class="data_box_item" :class="index == dataArr.length - 1 ? 'last' : ''" v-for="(item, index) in dataArr"
            :key="item.name">
            <div>
                <img src="@/assets/data.png" alt="">
            </div>
            <div class="right_data">
                <div> {{ item.name }}</div>
                <div style="margin-top: 6px;"> <span style="font-size: 24px;margin-right: 10px;">{{ item.num }}</span>批
                </div>
            </div>
        </div>
    </div>
</template>

<script>
export default {
    data() {
        return {
            dataArr:[
                {name:'生产批数',num:'24'},
                {name:'烧结生产批数',num:'10'},
                {name:'厂内批数',num:'6'},
                {name:'外协批数',num:'2'},
                {name:'绩效零件批数',num:'0'},
                {name:'入库批数',num:'10'},
            ],
        }
    },
    mounted() {

    },
    methods: {

    }
}
</script>

<style lang="scss" scoped>
.data_box {
    display: flex;
    padding: 20px;
    justify-content: space-between;
    border-top: 1px solid #eee;
    border-bottom: 1px solid #eee;

    .data_box_item {
        width: 16%;
        display: flex;
        align-items: center;
        justify-content: center;
        border-right: 1px solid #eee;

        .right_data {
            margin-left: 10px;
            display: flex;
            flex-direction: column;
            justify-content: space-between;
            // align-items: s;
        }

        &.last {
            border: none;
        }
    }
}
</style>