import AddWorkTimesModal from './AddWorkTimesModal'
import EditWorkTimesModal from './EditWorkTimesModal'
import { setAppointDate } from '@/api/project'

export default {
  beforeCreate () {
    this.form = this.$form.createForm(this)
    this.form.getFieldDecorator('worktimes', {
      initialValue: []
    })
    this.form.getFieldDecorator('support_reservation', { initialValue: false })
  },
  data () {
    return {
      content: '',
      fileInfo: null,
      previewImage: '',
      imageList: [],
      previewVideo: '',
      videoList: [],
      addWorkTimesVisible: false,
      editWorkTimesVisible: false,
      currentWorkTime: null,
      currentWorkTimeIndex: null,
      worktimes: [],
      workTimesItem: {
        validateStatus: '',
        help: ''
      },
      formItemLayout: {
        labelCol: {
          xs: { span: 24 },
          sm: { span: 4 }
        },
        wrapperCol: {
          xs: { span: 24 },
          sm: { span: 16 }
        }
      },
      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({ introduction_content: editor.html.get() })
            this.form.validateFields(['introduction_content'], (err, values) => {
              if (!err) {
                // console.log(values)
              }
            })
          }
        }
      },
      params: {
        address: 'string',
        adv_position_id: 0,
        announcement: 'string',
        introduction_content: 'string',
        introduction_title: 'string',
        name: 'string',
        opening_time: 'string',
        pictures: [
          {
            'size': 0,
            'url': 'string'
          }
        ],
        subtitl: 'string',
        support_reservatio: true,
        tag: [
          0
        ],
        videos: [
          {
            'size': 0,
            'url': 'string'
          }
        ],
        worktimes: []
      }
    }
  },
  components: {
    AddWorkTimesModal,
    EditWorkTimesModal
  },
  props: {
    value: {
      type: Boolean,
      default: false
    },
    tags: {
      type: Array,
      default: () => []
    }
  },
  filters: {
    workTimesType (value) {
      const type = {
        SPECIAL_DAY: '日期范围',
        LEGAL_HOLIDAY: '法定日',
        SPECIAL_WEEKDAY: '每周',
        SPECIAL_MONTHDAY: '每月'
      }
      return type[value]
    },
    weekDays (value) {
      const type = ['周一', '周二', '周三', '周四', '周五', '周六', '周日']
      const days = Array.isArray(value) ? value.map(i => {
        return type[i]
      }).join(' ,') : type[value]
      return days
    },
    monthDays (val) {
      const value = JSON.parse(JSON.stringify(val))
      const days = Array.isArray(value) ? value.sort((a, b) => {
        return a - b
      }).join(' , ') : value
      return days
    },
    legalType (value) {
      const type = {
        EVERYDAY: '每天',
        HOLIDAY: '节假日',
        REST: '休息日',
        WORKING: '工作日',
        value: 'WORKING'
      }
      return type[value]
    }
  },
  methods: {
    addWorkTime (data) {
      const worktimes = JSON.parse(JSON.stringify(this.worktimes))
      worktimes.push(data)
      this.worktimes = worktimes
      this.validateWorkTimes()
    },
    updateWorkTime (data) {
      this.worktimes.splice(this.currentWorkTimeIndex, 1, data)
    },
    eidtWorkTime (data, index) {
      this.currentWorkTime = Object.assign({}, data)
      this.currentWorkTimeIndex = index
      this.editWorkTimesVisible = true
    },
    deleteWorkTime (index) {
      const worktimes = this.worktimes
      worktimes.splice(index, 1)
      this.worktimes = worktimes
    },
    setWorkTimes () {
      this.params.worktimes = this.formatWorksTimes(this.worktimes)
      setAppointDate(this.params).then(res => {
        console.log('%c [ res ]-153', 'font-size:13px; background:pink; color:#bf2c9f;', res)
        this.$message.success('保存成功!')
      })
    },
    formatWorksTimes (worktimes) {
      const allWorktimes = []
      worktimes.forEach(item => {
        // 拆分数组
        if (Array.isArray(item.day)) {
          item.day.forEach(i => {
            allWorktimes.push(Object.assign({}, item, { day: i }))
          })
        } else {
          allWorktimes.push(item)
        }
      })
      return allWorktimes
    },
    validateWorkTimes () {
      if (this.worktimes.length === 0) {
        this.workTimesItem = {
          help: '请至少添加一项',
          validateStatus: 'error'
        }
        return false
      } else {
        this.workTimesItem = {
          help: ''
        }
        return true
      }
    },
    handleCancel () {
      this.$emit('input', false)
      this.form.resetFields()
      this.imageList = []
      this.introduction_content && (this.introduction_content = '')
    }
  },
  watch: {
    introduction_content (val) {
      this.form.setFieldsValue({ introduction_content: val })
    }
  }
}
