<template>
  <view class="shop-item row" @click="triggerGoDetail">
    <view class="layout-shop-image relative overflow">
      <v-image  :src="item.image" class="screen_all"></v-image>
    </view>
    <view class="flex-all-1 flex shop-item-content overflow">
      <view class="shop-item-title line-2">{{item.title || '商品名称，商品名称'}}</view>
      <view class="flex-all-1"></view>
      <view class="row aCenter">
        <view class="flex-all-1">
          <text class="shop-price-group"><text class="shop-price-em">¥</text><text>{{item.price || '48.00'}}</text></text>
        </view>
        <text v-if="number" class="row aCenter shop-close-container">
          <text class="iconfont-close iconfont shop-close"></text>
          <text>1</text>
        </text>
      </view>
    </view>
  </view>
</template>

<script>
import vImage from '@/components/v-image/main.vue';
import { mapState } from 'vuex';
import props from './props';
import shop from '@/utils/controls/shop';
export default {
  name: "layout-ui-shop-item",
  computed:{
    ...mapState(['config'])
  },
  props,
  components:{
    vImage
  },
  methods:{
    triggerGoDetail(){
      if (this.goDetail) {
        return shop.goShopDetail(this.item);
      }
    }
  }
}
</script>

<style scoped lang="scss" src="./style.scss"></style>