<template>
  <div class="intro-pic-form">
    <div class="form">
      <Form :label-width="86">
        <FormItem label="图片上传" :limit="20">
          <picUpload :hideUpload="isDetail" ref="info-upload" tips="只能上传jpg/png文件，建议尺寸为960*600，且单张不超过500kb，最多20张" :limit="20" :preUploads="preUploads" :hasUploads="hasUploads" />
        </FormItem>
      </Form>
    </div>
  </div>
</template>

<script>
import picUpload from '@/components/upload'
export default {
  props: {
    isDetail: Boolean,
    form: Object
  },
  data () {
    return {
      preUploads: [],
      hasUploads: []
    }
  },
  components: {
    picUpload
  },
  mounted () {
    this.$watch('form.introduceImage', function (newVal) {
      if (this.isDetail) {
        this.hasUploads = JSON.parse(newVal)
      }
    }, {
      immediate: true
    })
  },
  methods: {
    async validate () {
      if (this.hasUploads.length > 0 || this.preUploads.length > 0) {
        return true
      }
      this.$Message.error('请上传介绍图片')
      return false
    },
    async submit () {
      let res = await this.$refs['info-upload'].uploadfiles()

      this.form.introduceImage = JSON.stringify(this.hasUploads)
    },
  }
}
</script>