<template>
    <el-form-item label="">
        <el-checkbox v-model="taskData.isCreateTask">{{props.label}}</el-checkbox>
    </el-form-item>
    <div v-if="taskData.isCreateTask" class="createQuickTask">
        <el-form-item label="下次跟进：" prop="task.taskBeginTime">
            <el-date-picker
                clearable
                v-model="taskData.taskBeginTime"
                type="datetime"
                value-format="YYYY-MM-DD HH:mm:ss"
                placeholder="请选择下次跟进时间"
                :disabled-date='disabledDates'
                style="width: 100%;"
            >
            </el-date-picker>
        </el-form-item>
        <el-form-item label="任务主题：" prop="task.taskContent">
            <el-input style="width: 100%" v-model="taskData.taskContent" placeholder="请输入任务主题" />
        </el-form-item>
        <el-form-item label="任务目的：" prop="task.objectiveValue">
                <SelectDict v-model="taskData.objectiveValue" placeholder="选择任务目的"
                            dictCode="objective_value"></SelectDict>
            </el-form-item>
        <el-form-item label="紧要程度：" prop="priorityGrade">
            <SelectDict type="radio" selectedFirst v-model="taskData.priorityGrade" dictCode="task_priority_grade"></SelectDict>
        </el-form-item>
        <el-form-item label="跟进人员：" prop="task.ownerBy">
            <SelectUser v-model="taskData.ownerBy" placeholder="请选择跟进人员"></SelectUser>
        </el-form-item>
        <el-form-item label="任务标记：">
            <SelectDict type="custom" v-model="taskData.markTag" selectedFirst dictCode="task_mark_tag">
                <template #default="data">
                    <div class="sign-div flex-center">
                        <div
                            class="sign flex"
                            v-for="item in data.data"
                            :key="item.value"
                            :style="{ background: item.value }"
                            @click="taskData.markTag = item.value"
                        >
                            <i-ep-check color="#FFF" v-if="taskData.markTag == item.value" />
                        </div>
                    </div>
                </template>
            </SelectDict>
        </el-form-item>
        <el-form-item label="任务提醒：" prop="task.remindType">
            <SelectDict v-model="taskData.remindType" placeholder="请选择任务提醒" dictCode="task_remind_type"></SelectDict>
        </el-form-item>
        <el-form-item label="提醒方式：" prop="task.remindModels">
            <SelectDict type="checkbox" disabledItem="site" selectedFirst v-model="taskData.remindModels" dictCode="task_remind_mode"></SelectDict>
        </el-form-item>
    </div>
</template>

<script setup lang="ts">
    import { TaskForm } from '@/api/task/types';
    import useUserStore from '@/store/modules/user';

    const props = defineProps({
        label: {
            type: String,
            default: '创建跟进任务'
        },

    })
    const isCreateTask = ref(false)
    const taskData = defineModel<TaskForm>()

    const disabledDates = (time:Date) => {
        // 选择今天以及今天之后的日期
        return time.getTime() < Date.now() - 8.64e7// 如果没有后面的-8.64e7就是不可以选择今天
    }

    onMounted(() => {
        const { userInfo } = useUserStore();
        taskData.value.ownerBy = userInfo.id
        taskData.value.taskStatus = 0
    })
</script>

<style scoped lang="scss">
    .el-form-item{
        :deep(.el-radio--default){
            margin-right: 15px;
        }
    }
</style>
