DigitalScholl/Learun.Framework.Ultimate V7/LearunApp-2.2.0/components/learun-mpui/learun-ui-mp/upload.vue

<template>
  <view class="cu-form-group">
    <view class="grid col-4 grid-square flex-sub">
      <view v-for="(path, index) in value" @tap="viewImg" :key="index" class="bg-img">
        <image :src="path" mode="aspectFill"></image>
        <view v-if="!readonly" @tap.stop="delImg(index)" class="cu-tag bg-red">
          <l-icon type="close" style="width: 18px;height: 24px;font-size: 24px;" />
        </view>
      </view>

      <view v-if="!readonly && value.length < Number(number)" @tap="chooseImg" class="solids">
        <l-icon type="cameraadd" />
      </view>
    </view>
  </view>
</template>

<script>
export default {
  name: 'l-upload',

  props: {
    number: { default: 1 },
    readonly: {},
    value: { default: () => [] }
  },

  methods: {
    delImg(index) {
      const newList = JSON.parse(JSON.stringify(this.value))
      newList.splice(index, 1)
      this.$emit('input', newList)
      this.$emit('change')
      this.$emit('del')
    },

    chooseImg() {
      uni.chooseImage({
        count: Number(this.number),
        sizeType: ['original', 'compressed'],
        sourceType: ['album', 'camera'],
        success: ({ tempFilePaths }) => {
          const newList = JSON.parse(JSON.stringify(this.value || [])).concat(tempFilePaths)
          this.$emit('input', newList)
          this.$emit('change')
          this.$emit('add')
        }
      })
    },

    viewImg(index) {
      uni.previewImage({
        urls: this.value,
        current: this.value[index]
      })
    }
  }
}
</script>