<template>
    <el-form ref="formRef" :model="formData" label-width="110px" :rules="formRules">
        <el-row>
            <el-col :span="8">
                <el-form-item label="wcdd">
                    <el-input v-model="formData.qjts" clearable placeholder="请输入请假天数" />
                </el-form-item>
            </el-col>
            <el-col :span="8">
                <el-form-item label="开始时间" prop="kssj">
                    <el-date-picker class="flex-1 !flex" v-model="formData.kssj" clearable type="datetime"
                        value-format="YYYY-MM-DD HH:mm:ss" placeholder="请选择开始时间">
                    </el-date-picker>
                </el-form-item>
            </el-col>
            <el-col :span="8">
                <el-form-item label="结束时间" prop="jssj">
                    <el-date-picker class="flex-1 !flex" v-model="formData.jssj" clearable type="datetime"
                        value-format="YYYY-MM-DD HH:mm:ss" placeholder="请选择结束时间">
                    </el-date-picker>
                </el-form-item>
            </el-col>
            <el-col :span="8">
                <el-form-item label="外出天数">
                    <el-input v-model="formData.qjts" clearable placeholder="请输入请假天数" />
                </el-form-item>
            </el-col>
            <el-col :span="8">
                <el-form-item label="外出事由" prop="wcsy">
                    <el-input v-model="formData.wcsy" clearable placeholder="请输入请假事由" type="textarea" />
                </el-form-item>
            </el-col>
            <el-col :span="24">
                <el-form-item label="附件">
                    <uploadAnnex :form-data="formData"></uploadAnnex>
                </el-form-item>
            </el-col>

        </el-row>

    </el-form>
</template>

<script setup>
import uploadAnnex from './../../../components/uploadAnnex/index.vue'
const qjlxList = reactive(['事假', '年假', '调休假', '病假', '婚假', '产假', '陪产假', '其他'])
const formData = ref({})
const formRef = ref(null)

// 表单验证
const formRules = reactive({
    qjlx: [{
        required: true,
        message: '不可为空',
        trigger: ['blur']
    }],
    kssj: [{
        required: true,
        message: '不可为空',
        trigger: ['blur']
    }],
    jssj: [{
        required: true,
        message: '不可为空',
        trigger: ['blur']
    }],
    wcsy: [{
        required: true,
        message: '不可为空',
        trigger: ['blur']
    }],
})


</script>