<template>
    <section class="box-sjtj">
        <section class="content">
            <section class="left">
                <MOSTY.Assort :title="'特种设备'" style="padding: 0;" />
                <section class="flex">
                    <section class="left-tj">
                        <Sjtj :info="pageData.defaultList1" :isShowTip="false" :isShowBottom="false" :width="250"
                            mb="6px" />
                    </section>
                </section>
            </section>
        </section>
    </section>
</template>
<script setup>
import * as MOSTY from "@/components/MyComponents/index"
import Sjtj from '@/views/dataReportWork/aqjypx/components/sjtj.vue'
import { postApi } from "@/api/tobAcco_api.js";
import { reactive, onMounted } from "vue";
const props = defineProps({
    obj: {
        type: Object,
        default: () => { }
    }
});
const pageData = reactive({
    defaultList1: [
        { title: '电梯数', num: 0, dm: '200501', icon: 'ccss/icon_01.png' },
        { title: '锅炉数', dm: '200502', num: 0, icon: 'ccss/icon_01.png' },
        { title: '压力容器数', dm: '200503', num: 0, icon: 'ccss/icon_02.png' },
        { title: '压力管道数', dm: '200504', num: 0, icon: 'ccss/icon_03.png' },
        { title: '场内机动车', dm: '200505', num: 0, icon: 'ccss/icon_04.png' },
        { title: '起重机械', dm: '200506', num: 0, icon: 'ccss/icon_04.png' },
        { title: '工业气瓶', dm: '200507', num: 0, icon: 'ccss/icon_04.png' },
    ],
})
onMounted(() => {
    getscsbsscount()
})
const getscsbsscount = () => {
    postApi(props.obj, '/mosty-jcgl/sbglTzsb/countTbSbglTzsb').then(res => {
        if (res.length > 0) {
            res.forEach((item) => {
                let _item1 = pageData.defaultList1.find(v => v.dm == item.dm)
                if (_item1) {
                    _item1.num = item.count || 0
                }
            });
        }
    })
}
const filtterNum = num => {
    return (num || 0).toString().replace(/(\d)(?=(?:\d{3})+$)/g, '$1,');
}
defineExpose({ getscsbsscount })
</script>

<style lang="scss" scoped>
.left-tj {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.box-sjtj {
    background-color: #fff;
    width: 100%;
    padding: 0 16px 7px 16px;
    box-sizing: border-box;

    .content {
        // display: flex;

        .left {
            flex: 1;
            // border-right: 1px solid #EBEEF5;
            padding-right: 8px;
            box-sizing: border-box;

            .flex {
                display: flex;
                align-items: center;
                justify-content: space-between;



                .right-tj {
                    flex: 1;
                    margin-left: 13px;
                }
            }
        }

        .center {
            flex: 1;
            // border-right: 1px solid #EBEEF5;
            padding-right: 8px;
            box-sizing: border-box;
            margin-left: 12px;

            .flex {
                display: flex;
                justify-content: space-between;

                .left-tj {
                    flex: 1;
                }

                .right-tj {
                    flex: 1;
                    margin-left: 13px;
                }
            }
        }

        .right {
            flex: 1;
            margin-left: 12px;
        }
    }
}
</style>