<template>
  <a-modal
    :title="title"
    :width="800"
    :visible="visible"
    :confirmLoading="confirmLoading"
    @ok="handleOk"
    @cancel="handleCancel"
    okText="保存并安排任务"
    cancelText="关闭">

    <a-spin :spinning="confirmLoading">
      <a-form-model ref="form" :model="model" :rules="validatorRules">

        <!-- <a-form-model-item :labelCol="labelCol"  :wrapperCol="wrapperCol" label="任务类名" prop="jobClassName" hasFeedback >
          <a-input placeholder="请输入任务类名" v-model="model.jobClassName" />
        </a-form-model-item> -->
        <!-- <a-form-model-item :labelCol="labelCol" :wrapperCol="wrapperCol"  label="报表类型" prop="status">
          <j-dict-select-tag v-model="model.status" dictCode="report_type"/>
        </a-form-model-item> -->
        <a-form-model-item :labelCol="labelCol"  :wrapperCol="wrapperCol" label="报表类型" prop="description">
          <a-input placeholder="请输入报表类型" v-model="model.description" disabled/>
        </a-form-model-item>
        <!-- <a-form-model-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="Cron表达式" prop="cronExpression">
          <j-cron v-model="model.cronExpression"/>
          <j-easy-cron v-model="model.cronExpression" />
        </a-form-model-item> -->
        <a-form-model-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="生成报表时间" prop="time">
          <a-cascader :options="options" v-model="model.time" placeholder="请选择" @change="onChange"/>
        </a-form-model-item>
        <!-- <a-form-model-item  :labelCol="labelCol" :wrapperCol="wrapperCol" label="参数" prop="parameter" >
          <a-textarea placeholder="请输入参数" :rows="5" v-model="model.parameter" />
        </a-form-model-item> -->
        <a-form-model-item :labelCol="labelCol" :wrapperCol="wrapperCol"  label="状态" prop="status">
          <j-dict-select-tag type="radioButton" v-model="model.status" dictCode="quartz_status"/>
        </a-form-model-item>
      </a-form-model>
    </a-spin>
  </a-modal>
</template>

<script>
  import { httpAction } from '@/api/manage'
  // import JCron from "@/components/jeecg/JCron";
  import cronValidator from "@/components/jeecg/JEasyCron/validator";

  export default {
    name: "QuartzJobModal",
    components: {
      // JCron,
    },
    data () {
      return {
        title:"操作",
        buttonStyle: 'solid',
        visible: false,
        model: {},
        labelCol: {
          xs: { span: 24 },
          sm: { span: 5 },
        },
        wrapperCol: {
          xs: { span: 24 },
          sm: { span: 16 },
        },
        cron: {
          label: '',
          value: ''
        },
        options: [],
        confirmLoading: false,
        validatorRules: {
          cronExpression: [
            {required: true, message: '请输入cron表达式!'},
            {validator: cronValidator,}
          ],
          jobClassName: [{required: true, message: '请输入任务类名!'}]
        },
        url: {
          add: "/sys/quartzJob/add",
          edit: "/sys/quartzJob/edit",
        },
      }
    },
    created () {
    },
    methods: {
      add() {
        // 统一设置默认值
        this.edit({
          cronExpression: '* * * * * ? *',
          status: 0,
        })
      },
      edit (record) {
        console.log(record)
        if (record.parameter == 'day') {
          this.dayOption()
        }
        if (record.parameter == 'month') {
          this.monthOption()
        }
        if (record.parameter == 'year') {
          this.yearOption()
        }
        this.visible = true;
        this.$nextTick(() => {
          this.$refs.form.resetFields()
          let cronExpression = record.cronExpression.split(" ");
          console.log(cronExpression);
          this.model = Object.assign({}, record)
          if (record.parameter == 'day') {
            this.model.time = []
            this.model.time.push("每日", Number(cronExpression[2]))
          }
          if (record.parameter == 'month') {
            this.model.time = []
            this.model.time.push("每月", Number(cronExpression[3]), Number(cronExpression[2]))
          }
          if (record.parameter == 'year') {
            this.model.time = []
            this.model.time.push("每年", Number(cronExpression[4]), Number(cronExpression[3]), Number(cronExpression[2]))
          }
           console.log(77,this.model);
        })
      },
      // 日报表
      dayOption(){
        let time = Array.from({length: 24}, (_, index) => ({
            value: index,
            label: `${index}:00`
        }));
        this.options = [
          {
            value: '每日',
            label: '每日',
            children: time,
          },
        ]
      },
      // 月报表
      monthOption(){
        let time = Array.from({length: 24}, (_, index) => ({
            value: index,
            label: `${index}:00`
        }));
        let day = Array.from({length: 28}, (_, index) => ({
            value: index + 1,
            label: `${index + 1}号`,
            children: time
        }));
        this.options = [
          {
            value: '每月',
            label: '每月',
            children: day,
          },
        ]
      },
      // 年报表数据处理
      mGetDate(year, month) {
        var d = new Date(year, month, 0);
        return d.getDate();
      },
      getFormatYear() {
        let time = Array.from({length: 24}, (_, index) => ({
            value: index,
            label: `${index}:00`
        }));
        let date = new Date()
        const year = date.getFullYear() // 获取当前年份
        // 每年12个月 这是固定的
        const list = Array.from({
            length: 12
        }, (item, index) => {
            let month = index + 1
            // month = month.padStart(2, '0')
            return {
                value: month,
                label: `${month}月`,
                children: Array.from({
                    length: this.mGetDate(year, month, 0)
                }, (m, mIndex) => {
                    let day = mIndex + 1
                    // day = day.padStart(2, '0')
                    return {
                        value: day,
                        label: `${day}号`,
                        children: time,
                    }
                })
            }
        })
        // console.log(list)
        return list
      },
      // 年报表
      yearOption(){
        let month = this.getFormatYear()
        console.log(111,month)
        this.options = [
          {
            value: '每年',
            label: '每年',
            children: month,
          },
        ]
      },
      close () {
        this.$emit('close');
        this.visible = false;
      },
      handleOk () {
        var _this = this
        // 触发表单验证
        this.$refs.form.validate((ok, err) => {
          if (ok) {
            _this.$confirm({
              title: '提示',
              content: '是否确定提交',
              okButtonProps: {
                style: {
                  backgroundColor: '#008cd6',
                  fontSize: '16px',
                }
              },
              cancelButtonProps: {
                style: {
                  fontSize: '16px',
                }
              },
              onOk() {
                _this.submit()
              },
              onCancel() {},
            });
          }
        })
      },
      submit(){
        var that = this
        // that.confirmLoading = true;
        let httpurl = '';
        let method = '';
        if(!this.model.id){
          httpurl+=this.url.add;
          method = 'post';
        }else{
          httpurl+=this.url.edit;
          method = 'put';
        }

        console.log('提交参数',this.model)
        let time = this.model.time
        if (this.model.parameter == 'day') {
          this.model.cronExpression = "0 0 " + time[1] +" * * ? *"
        }
        if (this.model.parameter == 'month') {
          this.model.cronExpression = "0 0 " + time[2] + " " + time[1] +" * ? *"
        }
        if (this.model.parameter == 'year') {
          this.model.cronExpression = "0 0 " + time[3] + " " + time[2] + " " + time[1] +" ? *"
        }
        console.log('处理后参数',this.model)
        httpAction(httpurl,this.model,method).then((res)=>{
          if(res.success){
            that.$message.success(res.message);
            that.$emit('ok');
            that.close();
          }else{
            that.$message.warning(res.message);
          }
        }).finally(() => {
          that.confirmLoading = false;
        })
      },
      handleCancel () {
        this.close()
      },
      onChange(value) {
        this.model ={...this.model}
      },
    }
  }
</script>

<style scoped>

</style>