<template>
  <el-form :model="form" ref="form" label-width="100px" :rules="rules">
    <el-form-item label="外呼时间" prop="holiday_day" required>
      节日前
      <el-input-number class="w100" style="margin:0 5px;" v-model="form.holiday_day" controls-position="right" :max="30" :min="1" size="small" />
      天内外呼完成
      <span class="tips">由于外呼线路有限，为保证外呼触达率，建议外呼时间周期不小于5</span>
    </el-form-item>
    <el-form-item label="外呼时段" required>
      <el-radio v-model="form.callFlag" :label="0">默认时段</el-radio>
      <el-radio v-model="form.callFlag" :label="1">自定义时段</el-radio>
      <div v-show="form.callFlag == 0" style="line-height: 20px;">
        每天 09:00-20:00
      </div>
      <defineTime v-show="form.callFlag == 1" ref="defineTime" :data="form.callTime" />
    </el-form-item>
    <el-form-item label="活动有效期" required>
      <span v-if="!activeTime" class="tips" style="font-size: 14px;margin:0">设置【节日日期】和【外呼时间】后自动生成</span>
      <span v-else>{{ activeTime }}</span>
    </el-form-item>
  </el-form>
</template>

<script>
import defineTime from './defineTime.vue';
import { formatDateTimeByType } from '@/utils/index';

export default {
  data() {
    return {
      formatDateTimeByType,
      form: {
        holiday_day: '', // 节日时间
        callFlag: 0, //外呼时段 0 默认 1 自定义
        callTime: [{}] // 自定义时段
      },
      rules: {}
    };
  },
  props: {
    data: {
      type: Object,
      default: () => {}
    }
  },
  watch: {
    data(val) {
      if (val) {
        this.form = JSON.parse(JSON.stringify(val));
      }
    }
  },
  computed: {
    activeTime() {
      let str = '';
      return str;
    }
  },
  components: {
    defineTime
  },
  methods: {
    submit() {
      return new Promise(async resolve => {
        const res = await this.$refs.defineTime.submit();
        let arr = [];
        if (!res) return;
        res.timeRangeList.forEach(item => {
          if (Object.keys(item).length) {
            arr.push(`${item.startTime}-${item.endTime}`);
          }
        });
        this.$refs.form.validate(val => {
          if (val) {
            const { callFlag, callTime } = this.form;
            const obj = {
              callFlag,
              callTime
            };
            if (arr.length) {
              obj.callTime = arr;
            }
            resolve(obj);
          } else {
            resolve(false);
          }
        });
      });
    }
  }
};
</script>

<style></style>
