<!-- 选择已浏览的商品 -->
<template>
    <view class="jy-browsed">
        <checkbox-group @change="checkboxChange">
            <view v-for="(item, index) in 1" :key="index">
                <view class="select-card">
                    <view class="date f28 c333">7月2日</view>
                    <view class="checkbox-list" v-for="(item2, index2) in item" :key="index2">
                        <checkbox :value="item2 + ''" backgroundColor="#ffffff" iconColor="#ffffff"
                            activeBackgroundColor="#F8BA4D" activeBorderColor="#F8BA4D" color="#FFCC33"
                            style="transform:scale(0.7)" />
                        <JyCommodityInformation :showType="3"></JyCommodityInformation>
                    </view>
                </view>
                <line></line>
            </view>
        </checkbox-group>
        <JyBottomBtn @click="sendCommodity">发送商品</JyBottomBtn>
    </view>
</template>

<script setup>
import { ref } from 'vue'
import JyCommodityInformation from '@/components/public/jy-commodity-information/index.vue'
import JyBottomBtn from '@/components/public/jy-bottom-button'
import { eventBus } from '@/components/public/event-bus.js'
const checkList = ref([])
const checkboxChange = (e) => {
    checkList.value = e.detail.value
}
const sendCommodity = () => {
    eventBus.emit('changeShop', checkList.value)
    uni.navigateBack();
}
</script>
<style scoped lang="scss">
.select-card {
    background-color: #fff;
    margin-bottom: 40rpx;
}

.checkbox-list {
    display: flex;
    flex-direction: row;
    align-items: center;
    padding: 0 20rpx;
}

.date {
    margin: 24rpx 24rpx 0 24rpx;

}

::v-deep .uni-checkbox-input {
    border-radius: 50%
}
</style>