feat(打卡): 改进感恩表单数据复用逻辑
自动选中上次使用的感恩对象并优化选中逻辑 移除不再需要的gratitude_form_list处理代码 添加调试日志帮助追踪表单初始化过程
Showing
5 changed files
with
58 additions
and
14 deletions
| 1 | /* | 1 | /* |
| 2 | * @Date: 2025-06-06 09:26:16 | 2 | * @Date: 2025-06-06 09:26:16 |
| 3 | * @LastEditors: hookehuyr hookehuyr@gmail.com | 3 | * @LastEditors: hookehuyr hookehuyr@gmail.com |
| 4 | - * @LastEditTime: 2025-12-17 10:31:54 | 4 | + * @LastEditTime: 2025-12-17 10:59:17 |
| 5 | * @FilePath: /mlaj/src/api/checkin.js | 5 | * @FilePath: /mlaj/src/api/checkin.js |
| 6 | * @Description: 签到模块相关接口 | 6 | * @Description: 签到模块相关接口 |
| 7 | */ | 7 | */ |
| ... | @@ -195,6 +195,6 @@ export const getCheckinTeacherCheckedDatesAPI = (params) => fn(fetch.get(Api.CH | ... | @@ -195,6 +195,6 @@ export const getCheckinTeacherCheckedDatesAPI = (params) => fn(fetch.get(Api.CH |
| 195 | /** | 195 | /** |
| 196 | * @description: 复用感恩表单数据 | 196 | * @description: 复用感恩表单数据 |
| 197 | * @param subtask_id 小作业ID | 197 | * @param subtask_id 小作业ID |
| 198 | - * @returns | 198 | + * @returns data: { gratitude_form_list 感恩表单数据 [{id,name,city,unit,其他信息字段}], last_used_list 最近使用的表单数据 [{id,name,city,unit,其他信息字段}] } |
| 199 | */ | 199 | */ |
| 200 | export const reuseGratitudeFormAPI = (params) => fn(fetch.post(Api.CHECKIN_TEACHER_REUSE_GRATITUDE_FORM, params)) | 200 | export const reuseGratitudeFormAPI = (params) => fn(fetch.post(Api.CHECKIN_TEACHER_REUSE_GRATITUDE_FORM, params)) | ... | ... |
| ... | @@ -70,9 +70,14 @@ const localFields = ref([]) | ... | @@ -70,9 +70,14 @@ const localFields = ref([]) |
| 70 | // 监听弹窗显示状态、字段配置和初始值的变化 | 70 | // 监听弹窗显示状态、字段配置和初始值的变化 |
| 71 | watch([() => props.show, () => props.fields, () => props.initialValues], ([showVal, fieldsVal, initialValuesVal]) => { | 71 | watch([() => props.show, () => props.fields, () => props.initialValues], ([showVal, fieldsVal, initialValuesVal]) => { |
| 72 | if (showVal) { | 72 | if (showVal) { |
| 73 | + console.log('AddTargetDialog open:', { | ||
| 74 | + fields: fieldsVal, | ||
| 75 | + initialValues: initialValuesVal | ||
| 76 | + }) | ||
| 73 | // 初始化字段,添加 value 属性 | 77 | // 初始化字段,添加 value 属性 |
| 74 | localFields.value = fieldsVal.map(field => { | 78 | localFields.value = fieldsVal.map(field => { |
| 75 | const val = (initialValuesVal && initialValuesVal[field.id]); | 79 | const val = (initialValuesVal && initialValuesVal[field.id]); |
| 80 | + console.log(`Field ${field.id} init value:`, val); | ||
| 76 | return { | 81 | return { |
| 77 | ...field, | 82 | ...field, |
| 78 | value: val || '' | 83 | value: val || '' | ... | ... |
| 1 | <!-- | 1 | <!-- |
| 2 | * @Date: 2025-12-16 11:44:27 | 2 | * @Date: 2025-12-16 11:44:27 |
| 3 | * @LastEditors: hookehuyr hookehuyr@gmail.com | 3 | * @LastEditors: hookehuyr hookehuyr@gmail.com |
| 4 | - * @LastEditTime: 2025-12-16 23:26:18 | 4 | + * @LastEditTime: 2025-12-17 11:27:12 |
| 5 | * @FilePath: /mlaj/src/components/count/CheckinTargetList.vue | 5 | * @FilePath: /mlaj/src/components/count/CheckinTargetList.vue |
| 6 | * @Description: 打卡动态对象列表组件 | 6 | * @Description: 打卡动态对象列表组件 |
| 7 | --> | 7 | --> |
| ... | @@ -25,7 +25,7 @@ | ... | @@ -25,7 +25,7 @@ |
| 25 | <div v-for="(item, index) in targetList" :key="index" | 25 | <div v-for="(item, index) in targetList" :key="index" |
| 26 | class="px-4 py-1.5 rounded-full text-sm transition-colors duration-200 border cursor-pointer select-none relative" | 26 | class="px-4 py-1.5 rounded-full text-sm transition-colors duration-200 border cursor-pointer select-none relative" |
| 27 | :style="[ | 27 | :style="[ |
| 28 | - selectedTargets.some(t => t.id === item.id) ? { | 28 | + selectedTargets.some(t => (t.id && item.id && t.id == item.id) || (!t.id && t.name === item.name)) ? { |
| 29 | backgroundColor: '#4caf50', | 29 | backgroundColor: '#4caf50', |
| 30 | color: '#ffffff', | 30 | color: '#ffffff', |
| 31 | borderColor: '#4caf50' | 31 | borderColor: '#4caf50' | ... | ... |
| ... | @@ -398,9 +398,9 @@ export function useCheckin() { | ... | @@ -398,9 +398,9 @@ export function useCheckin() { |
| 398 | if (data?.gratitude_count) { | 398 | if (data?.gratitude_count) { |
| 399 | gratitudeCount.value = data.gratitude_count | 399 | gratitudeCount.value = data.gratitude_count |
| 400 | } | 400 | } |
| 401 | - if (data?.gratitude_form_list && Array.isArray(data.gratitude_form_list)) { | 401 | + // if (data?.gratitude_form_list && Array.isArray(data.gratitude_form_list)) { |
| 402 | - gratitudeFormList.value = data.gratitude_form_list | 402 | + // gratitudeFormList.value = data.gratitude_form_list |
| 403 | - } | 403 | + // } |
| 404 | 404 | ||
| 405 | // 更新选中的任务显示 | 405 | // 更新选中的任务显示 |
| 406 | if (subTaskId.value) { | 406 | if (subTaskId.value) { |
| ... | @@ -422,9 +422,9 @@ export function useCheckin() { | ... | @@ -422,9 +422,9 @@ export function useCheckin() { |
| 422 | } | 422 | } |
| 423 | 423 | ||
| 424 | // 2. 恢复选中的对象 | 424 | // 2. 恢复选中的对象 |
| 425 | - if (gratitudeFormList.value.length > 0 && handlers.setTargets) { | 425 | + // if (gratitudeFormList.value.length > 0 && handlers.setTargets) { |
| 426 | - handlers.setTargets(gratitudeFormList.value) | 426 | + // handlers.setTargets(gratitudeFormList.value) |
| 427 | - } | 427 | + // } |
| 428 | 428 | ||
| 429 | // 3. 恢复次数 | 429 | // 3. 恢复次数 |
| 430 | if (gratitudeCount.value && handlers.setCount) { | 430 | if (gratitudeCount.value && handlers.setCount) { | ... | ... |
| ... | @@ -224,11 +224,44 @@ const taskType = computed(() => route.query.task_type) | ... | @@ -224,11 +224,44 @@ const taskType = computed(() => route.query.task_type) |
| 224 | // 作业选择相关 | 224 | // 作业选择相关 |
| 225 | const showTaskPicker = ref(false) | 225 | const showTaskPicker = ref(false) |
| 226 | const taskOptions = ref([]) | 226 | const taskOptions = ref([]) |
| 227 | +// 上次打卡的感恩表单数据 | ||
| 228 | +const lastUsedTargetList = ref([]) | ||
| 227 | 229 | ||
| 228 | const fetchTargetList = async (subtask_id) => { | 230 | const fetchTargetList = async (subtask_id) => { |
| 229 | const { code, data } = await reuseGratitudeFormAPI({ subtask_id }) | 231 | const { code, data } = await reuseGratitudeFormAPI({ subtask_id }) |
| 230 | if (code) { | 232 | if (code) { |
| 231 | - targetList.value = data || [] | 233 | + targetList.value = data.gratitude_form_list || [] |
| 234 | + lastUsedTargetList.value = data.last_used_list || [] | ||
| 235 | + | ||
| 236 | + // 自动选中上次使用的对象 | ||
| 237 | + if (lastUsedTargetList.value.length > 0) { | ||
| 238 | + // 找出 lastUsedTargetList 中存在于 targetList 的项(并获取 targetList 中的完整对象引用) | ||
| 239 | + const validTargets = [] | ||
| 240 | + | ||
| 241 | + lastUsedTargetList.value.forEach(lastItem => { | ||
| 242 | + const targetItem = targetList.value.find(t => | ||
| 243 | + (lastItem.id && t.id && t.id == lastItem.id) || | ||
| 244 | + (!lastItem.id && lastItem.name === t.name) | ||
| 245 | + ) | ||
| 246 | + | ||
| 247 | + if (targetItem) { | ||
| 248 | + // 标记为已确认,避免再次弹出确认框 | ||
| 249 | + targetItem.has_confirmed = true | ||
| 250 | + validTargets.push(targetItem) | ||
| 251 | + } | ||
| 252 | + }) | ||
| 253 | + | ||
| 254 | + // 将这些项加入 selectedTargets(去重) | ||
| 255 | + validTargets.forEach(item => { | ||
| 256 | + const exists = selectedTargets.value.some(t => | ||
| 257 | + (item.id && t.id && t.id == item.id) || | ||
| 258 | + (!item.id && t.name === item.name) | ||
| 259 | + ) | ||
| 260 | + if (!exists) { | ||
| 261 | + selectedTargets.value.push(item) | ||
| 262 | + } | ||
| 263 | + }) | ||
| 264 | + } | ||
| 232 | } | 265 | } |
| 233 | } | 266 | } |
| 234 | 267 | ||
| ... | @@ -293,6 +326,8 @@ const onConfirmTask = async ({ selectedOptions }) => { | ... | @@ -293,6 +326,8 @@ const onConfirmTask = async ({ selectedOptions }) => { |
| 293 | 326 | ||
| 294 | // 如果是计数打卡,根据选中的作业ID查询计数对象 | 327 | // 如果是计数打卡,根据选中的作业ID查询计数对象 |
| 295 | if (taskType.value === 'count') { | 328 | if (taskType.value === 'count') { |
| 329 | + // 切换作业时,清空之前选中的对象,避免混淆 | ||
| 330 | + selectedTargets.value = [] | ||
| 296 | await fetchTargetList(selectedTaskValue.value[0]) | 331 | await fetchTargetList(selectedTaskValue.value[0]) |
| 297 | } | 332 | } |
| 298 | } | 333 | } |
| ... | @@ -953,15 +988,19 @@ onMounted(async () => { | ... | @@ -953,15 +988,19 @@ onMounted(async () => { |
| 953 | await fetchTargetList(id) | 988 | await fetchTargetList(id) |
| 954 | } | 989 | } |
| 955 | }, | 990 | }, |
| 956 | - setTargets: (list) => { | 991 | + // setTargets: (list) => { |
| 957 | - selectedTargets.value = list | 992 | + // // 只有当 list 不为空时才覆盖,避免覆盖掉 fetchTargetList 中设置的默认选中项 |
| 958 | - }, | 993 | + // if (list && list.length > 0) { |
| 994 | + // selectedTargets.value = list | ||
| 995 | + // } | ||
| 996 | + // }, | ||
| 959 | setCount: (val) => { | 997 | setCount: (val) => { |
| 960 | countValue.value = val | 998 | countValue.value = val |
| 961 | } | 999 | } |
| 962 | }) | 1000 | }) |
| 963 | 1001 | ||
| 964 | console.warn(selectedTaskValue.value); | 1002 | console.warn(selectedTaskValue.value); |
| 1003 | + console.warn(selectedTargets.value); | ||
| 965 | }) | 1004 | }) |
| 966 | </script> | 1005 | </script> |
| 967 | 1006 | ... | ... |
-
Please register or login to post a comment