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




// 品牌列表
let brandList = ref<any>([])

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

const handGetData = async () => {
    const req: any = {
        BRAND_INDUSTRY: "",
        PROVINCE_CODE: "530000",
        BRAND_STATE: 1
    }
    const data = await handleGetCombineBrandList(req)
    // console.log('handGetDatahandGetDatahandGetData', data)
    brandList.value = data
}
</script>


<template>
    <div class="BrandListtBox">
        <div class="BrandListItem" v-for="(item, index) in brandList" :key="index">
            <div class="BrandListLeft">
                <img class="brandIcon" :src="item.BRAND_INTRO || defaultImg" />
            </div>
            <div class="BrandListRight">
                <div class="BrandListName">{{ item.BRAND_NAME }}</div>

                <div class="BrandListContent">
                    <img class="shopIcon" :src="shopIcon" />
                    <div class="rightBrand">
                        <span class="shopValue">{{ item.ServerpartList.length }}</span>
                        <span class="shopUnit">家</span>
                    </div>
                </div>
            </div>
        </div>
    </div>
</template>