import moment from 'moment'
export default {
  beforeCreate () {
    this.form = this.$form.createForm(this)
    this.form.getFieldDecorator('is_refund', { initialValue: false })
    this.form.getFieldDecorator('is_book_today', { initialValue: false })
    this.form.getFieldDecorator('is_restricted_sales', { initialValue: false })
    this.form.getFieldDecorator('is_reservation', { initialValue: false })
    this.form.getFieldDecorator('is_write_reservation_phone', { initialValue: false })
    this.form.getFieldDecorator('is_write_player_name', { initialValue: false })
    this.form.getFieldDecorator('is_write_player_identity', { initialValue: false })
    this.form.getFieldDecorator('show_qrcode', { initialValue: false })
  },
  computed: {
    tags () {
      return this.$store.state.app.tagList
    }
  },
  data () {
    return {
      previewImage: '',
      imageList: [],
      previewImageVisible: false,
      formItemLayout: {
        labelCol: {
          xs: { span: 24 },
          sm: { span: 8 }
        },
        wrapperCol: {
          xs: { span: 24 },
          sm: { span: 16 }
        }
      },
      formItemLayout2: {
        labelCol: {
          xs: { span: 24 },
          sm: { span: 4 }
        },
        wrapperCol: {
          xs: { span: 24 },
          sm: { span: 20 }
        }
      },
      config: {
        language: 'zh_cn',
        heightMin: 300,
        theme: 'green',
        toolbarSticky: false,
        imageUploadURL: this.uploadUrl,
        videoUploadURL: this.uploadUrl,
        events: {
          'froalaEditor.initialized': function () {
            // console.log('initialized')
          },
          'froalaEditor.image.uploaded': (e, editor, response) => {
            // console.log(e, editor, response)
          },
          'froalaEditor.contentChanged': (e, editor) => {
            // this.form.setFieldsValue({ description_content: editor.html.get() })
            // this.form.validateFields(['description_content'], (err, values) => {
            //   if (!err) {
            //     // console.log(values)
            //   }
            // })
          }
        }
      }
    }
  },
  props: {
    value: {
      type: Boolean,
      default: false
    },
    product: {
      type: Array,
      default: () => []
    }
  },
  methods: {
    moment,
    formatParams (values) {
      return {
        'type': 'BATCH',
        'name': values.name || '',
        'category': values.category,
        'price': values.price || 0,
        'show_qrcode': values.show_qrcode ? 1 : 0,
        'price_original': values.price_original || 0,
        'book_max': values.book_max,
        'book_min': values.book_min,
        'advance_days': values.advance_days || null,
        'delay_days': values.delay_days || null,
        'tags': values.tags,
        'need_realname': values.need_realname ? 1 : 0,
        'player_need_realname': values.player_need_realname ? 1 : 0,
        'purchase_separate': values.purchase_separate,
        'limit_identities': values.limit_identities ? 1 : [],
        'sale_time_end': values.sale_time_end ? values.sale_time_end.format('HH:mm:ss') : null,
        'sale_time_start': values.sale_time_start ? values.sale_time_start.format('HH:mm:ss') : null,
        'sell_startdate': values.sellDate[0].format('YYYY-MM-DD'),
        'sell_enddate': values.sellDate[1].format('YYYY-MM-DD'),
        'use_startdate': values.useDate[0].format('YYYY-MM-DD'),
        'use_enddate': values.useDate[1].format('YYYY-MM-DD'),
        'ticket_product_id': values.ticket_product_id || null,
        'use_valid_days': values.use_valid_days,
        'description': values.description || '',
        'other_notice': values.other_notice || '',
        'purchase_notice': values.purchase_notice || '',
        'use_notice': values.use_notice || '',
        'withdrawal_notice': values.withdrawal_notice || '',
        // 销售数量限制
        'is_restricted_sales': values.is_restricted_sales ? 1 : 0,
        'is_reservation': values.is_reservation ? 1 : 0,
        'is_write_reservation_phone': values.is_write_reservation_phone ? 1 : 0,
        'is_write_player_name': values.is_write_player_name ? 1 : 0,
        'is_write_player_identity': values.is_write_player_identity ? 1 : 0,
        'sales_volume': values.sales_volume,
        'total_sales_limit': values.total_sales_limit
      }
    },
    handleCancel () {
      this.$emit('input', false)
      this.form.resetFields()
      this.imageList = []
      this.purchase_content && (this.purchase_content = '')
      this.description_content && (this.description_content = '')
      this.withdrawal_content && (this.withdrawal_content = '')
      this.other_content && (this.other_content = '')
    },
    beforeImageUpload (file) {
      const isImage = file.type.indexOf('image') > -1
      if (!isImage) {
        this.$message.error('请选择图片格式的文件')
      }
      return isImage
    },
    handleImagePreview (file) {
      // console.log(file)
      this.previewImage = file.url || file.thumbUrl
      this.previewImageVisible = true
    },
    handleImageChange (info) {
      const fileList = info.fileList

      if (!info.file.status) {
        const index = fileList.findIndex(item => {
          return item.uid === info.file.uid
        })
        fileList.splice(index, 1)
      }

      this.imageList = fileList
    },
    handleImageCancel () {
      this.previewImageVisible = false
    }
  },
  watch: {
    description_content (val) {
      this.form.setFieldsValue({ description_content: val })
    },
    purchase_content (val) {
      this.form.setFieldsValue({ purchase_content: val })
    },
    withdrawal_content (val) {
      this.form.setFieldsValue({ withdrawal_content: val })
    },
    other_content (val) {
      this.form.setFieldsValue({ other_content: val })
    }
  }
}
