<template>
  <view class="upload-model flex row wrap">
    <view
        v-for="(item,index) in uploadData"
        :key="index"
        class="upload-item relative"
        :style="{
          width:avgWidth+'rpx',
          height:avgWidth+'rpx',
          'margin-right':((index + 1)%row===0?0:margin)+'rpx',
          'margin-top': ((index < row)?0:margin)+'rpx'
        }"
    >
      <image :src="item.src" class="upload-image" mode="aspectFill"></image>
      <view class="img-close center" >
        <image @click.stop="deleteImage(index)" mode="aspectFill" :src="require('./images/delete.png')" class="img-close-icon"></image>
      </view>
    </view>
    <view
        :style="{
          width:avgWidth+'rpx',
          height:avgWidth+'rpx',
          'margin-top': ((uploadLength < row)?0:margin)+'rpx'
        }"
        @click="selectImage"
        v-show="!hidden"
    >
      <view v-if="!custom" class="select-image upload-item upload-view flex center">
        <image :src="require('./images/upload.png')" class="select-upload"></image>
        <text class="select-title">添加图片</text>
        <text class="select-number">(最多{{max}}张)</text>
      </view>
      <slot v-else>

      </slot>

    </view>

  </view>

</template>

<script>
import props from "./props";
import mixins from './mixins';
export default {
  props,
  mixins
}
</script>

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

</style>