<script setup lang="ts">
import { onMounted, ref } from 'vue';
import './supplierListBox.less'
import shopIcon from '../../../../assets/image/shopIcon.png'
import { handleGetSupplierList } from '../../service';


// 供应商列表
let supplierList = ref<any>([])


onMounted(async () => {
    await handleGetData()
})


// 拿到数据的方法
const handleGetData = async () => {
    const req: any = {
        ProvinceCode: "530000",
        StatisticsMonth: "202505"
    }
    const data = await handleGetSupplierList(req)
    supplierList.value = data.slice(0, 9)
}


</script>

<template>
    <div class="supplierListBox">
        <div class="supplierListItem" v-for="(item, index) in supplierList" :key="index">
            <!-- <div class="supplierListLeft">
                <img class="supplierIcon" :src="item.Icon" />
            </div> -->

            <div class="supplierListRight">
                <div class="supplierListName">{{ item.SupplierName || '' }}</div>

                <div class="supplierListContent">
                    <img class="shopIcon" :src="shopIcon" />
                    <span class="shopValue">{{ item.VarietyCount }}</span>
                    <span class="shopUnit">种</span>
                </div>
            </div>
        </div>
    </div>
</template>