<template>
    <el-dialog v-model="visible" title="设置应填报日期" @closed="$emit('closed')">
        <el-form ref="formRef" :model="form" :rules="rules" label-width="110px">
            <el-row>
                <el-col :span="24">
                    <el-form-item label="应填报日期" prop="ytbDate">
                        <el-input-number v-model="form.ytbDate" :min="1" :max="28" :controls="false" placeholder="请输入应填报日期(为每月1日至28日中一天)"></el-input-number>
                    </el-form-item>
                </el-col>
            </el-row>
        </el-form>

        <template #footer>
            <el-button :loading="isSaving" type="primary" @click="submit">确 定</el-button>
        </template>
    </el-dialog>
</template>

<script>
import API from "@/api/policy/progress";

export default {
    emits: ["success", "closed"],
    
    data() {
        return {
            visible: false,
            isSaving: false,

            form: {
                ytbDate: null
            },

            rules: {
                ytbDate: [{ required: true, message: "请输入应填报日期" }]
            }
        }
    },

    methods: {
        open(data) {
            this.form.ytbDate = data;
            this.visible = true;
            return this;
        },
        
        // 表单提交方法
        submit() {
            this.$refs.formRef.validate(valid => {
                if (valid) {
                    this.isSaving = true;
                    API.condition.edit(this.form).then(() => {
                        this.isSaving = false;
                        this.visible = false;
                        ElMessage.success("操作成功");
                        this.$emit("success");
                    }).catch(() => this.isSaving = false);
                } else {
                    return false;
                }
            });
        }
    }
}
</script>