<!--pages/collect/index.wxml-->

<tabs tabs="{{tabs}}" bindtabsItemChange="handleTabsItemChange">

    <block wx:if="{{tabs[0].isActive}}">

        <view class="first_tab">

            <navigator class="goods_item" wx:for="{{collect}}" wx:key="goods_id" url="/pages/goods_detail/index?goods_id={{item.goods_id}}">

                <!--左侧图片容器-->

                <view class="img_wrap">

                    <image mode="widthFix" src="{{item.goods_small_logo}}"></image>

                </view>

                <!--右侧信息容器-->

                <view class="info_wrap">

                    <text class="goods_name">{{item.goods_name}}</text>

                    <text class="goods_price">{{item.goods_price}}</text>

                </view>

            </navigator>

        </view>

    </block>

    <block wx:if="{{tabs[1].isActive}}">2</block>

    <block wx:if="{{tabs[2].isActive}}">3</block>

    <block wx:if="{{tabs[3].isActive}}">4</block>

</tabs>

.first_tab .goods_item {

  display: flex;

  border-bottom: 1px solid #ccc;

  padding: 10rpx 5rpx; }

  .first_tab .goods_item .img_wrap {

    flex: 2;

    display: flex;

    justify-content: center;

    align-items: center; }

    .first_tab .goods_item .img_wrap image {

      width: 70%; }

  .first_tab .goods_item .info_wrap {

    flex: 3;

    display: flex;

    flex-direction: column;

    justify-content: space-around;

    padding-top: 15rpx; }

    .first_tab .goods_item .info_wrap .goods_name {

      overflow: hidden;

      text-overflow: ellipsis;

      display: -webkit-box;

      -webkit-line-clamp: 2;

      -webkit-box-orient: vertical; }

    .first_tab .goods_item .info_wrap .goods_price {

      color: var(--themeColor);

      font-size: 32rpx; }