products/uni-shop/layout/layout-shop-item/main.vue

<template>
  <view class="shop-item row">
    <view class="layout-shop-image relative">
      <image src="/static/images/shop-background.png" class="layout-shop-background relative"></image>
      <view class="absolute row aCenter shop-logo-warp">
        <image src="/static/images/logo.jpg" class="layout-shop-logo"></image>
        <text class="shop-logo-name">{{config.name}}</text>
      </view>
      <view class="absolute shop-image">
        <image mode="aspectFill" :src="item.image" class="screen_all"></image>
      </view>
    </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">
        <text class="shop-price-group"><text class="shop-price-em">¥</text><text>{{item.sales_price}}</text></text>
        <view class="flex-all-1"></view>
        <v-step @input="input" @change="change" v-model="number" color="#666666" textColor="#666" v-if="numberEdit" type="shop"></v-step>
        <text v-else class="row aCenter shop-close-container">
          <text class="iconfont-close iconfont shop-close"></text>
          <text>{{item.number}}</text>
        </text>
      </view>
    </view>
  </view>
</template>

<script>
import vImage from '@/components/v-image/main.vue';
import vStep from '@/components/v-step/main.vue';
import { mapState } from 'vuex';
import props from './props';
export default {
  name: "layout-shop-item",
  computed:{
    ...mapState(['config'])
  },
  data(){
    return {
      number:1
    }
  },

  watch:{
    item(){
      if (this.item.id) {
        return this.setNumber(this.item.number);
      }
    }
  },

  methods:{
    setNumber(number){
      if (this.number !== number) {
        this.number = number;
      }
    },

    input(item){
      return this.$emit('input',{
        ...item,
        item:this.item
      });
    },

    change(item){
      return this.$emit('change',{
        ...item,
        item:this.item
      });
    }
  },

  created(){
    if (this.item.id) {
      return this.setNumber(this.item.number);
    }
  },

  props,
  components:{
    vImage,
    vStep
  }
}
</script>

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