| | |
| | | <template> |
| | | <el-calendar |
| | | v-loading="dayTaskLoading" |
| | | v-model="dateValue" |
| | | :range="dateRange" |
| | | @update:model-value="onDateChange" |
| | |
| | | task: { |
| | | type: Object, |
| | | default: () => {} |
| | | }, |
| | | dayTaskList: { |
| | | type: Array, |
| | | default: () => [] |
| | | } |
| | | }); |
| | | const emit = defineEmits(['dateChange']); |
| | | // 选中日期 |
| | | const dateValue = ref(new Date()); |
| | | const dateValue = ref(); |
| | | // 日历标题 |
| | | const title = computed(() => { |
| | | if (props.task) { |
| | |
| | | |
| | | /********************** 任务数据 *********************************/ |
| | | |
| | | // 获取日任务统计信息 |
| | | const dayTaskLoading = ref(false); |
| | | const dayTaskList = ref([]); |
| | | function fetchDayTasks(topTaskId) { |
| | | dayTaskLoading.value = true; |
| | | taskApi |
| | | .fetchDayTasks(topTaskId) |
| | | .then((res) => { |
| | | dayTaskList.value = res; |
| | | }) |
| | | .finally(() => (dayTaskLoading.value = false)); |
| | | } |
| | | watch( |
| | | () => props.dayTaskList, |
| | | (nV, oV) => { |
| | | if (nV != oV && dateValue.value) { |
| | | onDateChange(dateValue.value); |
| | | } |
| | | }, |
| | | { immediate: false } |
| | | ); |
| | | |
| | | // // 获取日任务统计信息 |
| | | // const dayTaskLoading = ref(false); |
| | | // const dayTaskList = ref([]); |
| | | // function fetchDayTasks() { |
| | | // dayTaskLoading.value = true; |
| | | // return taskApi |
| | | // .fetchDayTasks(props.task.tguid) |
| | | // .then((res) => { |
| | | // dayTaskList.value = res; |
| | | // // 如果已选日期存在,在重新获取日任务统计信息后,再次触发点击事件 |
| | | // if (dateValue.value) { |
| | | // onDateChange(dateValue.value); |
| | | // } |
| | | // }) |
| | | // .finally(() => (dayTaskLoading.value = false)); |
| | | // } |
| | | |
| | | // 日任务数据展示 |
| | | const compMap = new Map(); |
| | |
| | | return compMap.get(key).value; |
| | | } |
| | | const result = computed(() => { |
| | | return dayTaskList.value.find((v) => { |
| | | return props.dayTaskList.find((v) => { |
| | | return dayjs(v.date).isSame(dayjs(day)); |
| | | }); |
| | | }); |
| | |
| | | if (isDayEnable(e)) { |
| | | const day = dayjs(e).format('YYYY-MM-DD'); |
| | | const t = computeDayTask(day); |
| | | emit('dateChange', t); |
| | | emit('dateChange', t, day); |
| | | } |
| | | } |
| | | |
| | | // 总任务统计 |
| | | const taskStatistic = computed(() => { |
| | | const res = { total: 0, complete: 0, changed: 0 }; |
| | | dayTaskList.value.forEach((e) => { |
| | | props.dayTaskList.forEach((e) => { |
| | | res.total += e.totalTaskNum; |
| | | res.complete += e.completeTaskNum; |
| | | res.changed += e.changedTaskNum; |
| | |
| | | }); |
| | | /********************** 初始化 *********************************/ |
| | | |
| | | watch( |
| | | () => props.task, |
| | | (nV) => { |
| | | if (nV.tguid) { |
| | | fetchDayTasks(nV.tguid); |
| | | } |
| | | }, |
| | | { immediate: true } |
| | | ); |
| | | // watch( |
| | | // () => props.task, |
| | | // (nV) => { |
| | | // if (nV && nV.tguid) { |
| | | // fetchDayTasks(); |
| | | // } |
| | | // }, |
| | | // { immediate: true } |
| | | // ); |
| | | |
| | | // defineExpose({ fetchDayTasks }); |
| | | </script> |
| | | <style scoped> |
| | | .li-01 { |