fix(打卡): 修复计数打卡目标选择和样式问题
修复在确认任务时person_type赋值顺序问题,避免重复调用fetchTargetList 优化目标列表组件样式,防止文本选择和右键菜单
Showing
2 changed files
with
23 additions
and
15 deletions
| 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 13:53:45 | 4 | + * @LastEditTime: 2025-12-16 14:17:38 |
| 5 | * @FilePath: /mlaj/src/components/count/CheckinTargetList.vue | 5 | * @FilePath: /mlaj/src/components/count/CheckinTargetList.vue |
| 6 | * @Description: 打卡动态对象列表组件 | 6 | * @Description: 打卡动态对象列表组件 |
| 7 | --> | 7 | --> |
| ... | @@ -20,15 +20,23 @@ | ... | @@ -20,15 +20,23 @@ |
| 20 | <template v-if="targetList.length > 0"> | 20 | <template v-if="targetList.length > 0"> |
| 21 | <div v-for="(item, index) in targetList" :key="index" | 21 | <div v-for="(item, index) in targetList" :key="index" |
| 22 | class="px-4 py-1.5 rounded-full text-sm transition-colors duration-200 border cursor-pointer select-none relative" | 22 | class="px-4 py-1.5 rounded-full text-sm transition-colors duration-200 border cursor-pointer select-none relative" |
| 23 | - :style="selectedTargets.some(t => t.id === item.id) ? { | 23 | + :style="[ |
| 24 | - backgroundColor: '#4caf50', | 24 | + selectedTargets.some(t => t.id === item.id) ? { |
| 25 | - color: '#ffffff', | 25 | + backgroundColor: '#4caf50', |
| 26 | - borderColor: '#4caf50' | 26 | + color: '#ffffff', |
| 27 | - } : { | 27 | + borderColor: '#4caf50' |
| 28 | - backgroundColor: '#ffffff', | 28 | + } : { |
| 29 | - color: '#4b5563', | 29 | + backgroundColor: '#ffffff', |
| 30 | - borderColor: '#e5e7eb' | 30 | + color: '#4b5563', |
| 31 | - }" | 31 | + borderColor: '#e5e7eb' |
| 32 | + }, | ||
| 33 | + { | ||
| 34 | + '-webkit-touch-callout': 'none', | ||
| 35 | + '-webkit-user-select': 'none', | ||
| 36 | + 'user-select': 'none' | ||
| 37 | + } | ||
| 38 | + ]" | ||
| 39 | + @contextmenu.prevent | ||
| 32 | @click="onClick(item)" | 40 | @click="onClick(item)" |
| 33 | @touchstart="onTouchStart(item)" | 41 | @touchstart="onTouchStart(item)" |
| 34 | @touchend="onTouchEnd" | 42 | @touchend="onTouchEnd" | ... | ... |
| ... | @@ -256,6 +256,7 @@ const onConfirmTask = ({ selectedOptions }) => { | ... | @@ -256,6 +256,7 @@ const onConfirmTask = ({ selectedOptions }) => { |
| 256 | selectedTaskValue.value = [option.value] | 256 | selectedTaskValue.value = [option.value] |
| 257 | isMakeup.value = !!option.is_makeup | 257 | isMakeup.value = !!option.is_makeup |
| 258 | showTaskPicker.value = false | 258 | showTaskPicker.value = false |
| 259 | + personType.value = option.person_type | ||
| 259 | 260 | ||
| 260 | // 动态表单字段映射 | 261 | // 动态表单字段映射 |
| 261 | if (option.field_list && Array.isArray(option.field_list)) { | 262 | if (option.field_list && Array.isArray(option.field_list)) { |
| ... | @@ -276,7 +277,7 @@ const onConfirmTask = ({ selectedOptions }) => { | ... | @@ -276,7 +277,7 @@ const onConfirmTask = ({ selectedOptions }) => { |
| 276 | unitField.type = 'textarea' | 277 | unitField.type = 'textarea' |
| 277 | } | 278 | } |
| 278 | } else { | 279 | } else { |
| 279 | - // 如果没有配置字段,使用默认字段 (兼容旧数据或Mock) | 280 | + // 如果没有配置字段,使用默认字段 |
| 280 | dynamicFormFields.value = [ | 281 | dynamicFormFields.value = [ |
| 281 | { id: 'name', label: '姓名', type: 'text', required: true }, | 282 | { id: 'name', label: '姓名', type: 'text', required: true }, |
| 282 | { id: 'city', label: '城市', type: 'textarea', required: true }, | 283 | { id: 'city', label: '城市', type: 'textarea', required: true }, |
| ... | @@ -293,8 +294,7 @@ const onConfirmTask = ({ selectedOptions }) => { | ... | @@ -293,8 +294,7 @@ const onConfirmTask = ({ selectedOptions }) => { |
| 293 | 294 | ||
| 294 | // 如果是计数打卡,根据选中的作业ID查询计数对象 | 295 | // 如果是计数打卡,根据选中的作业ID查询计数对象 |
| 295 | if (taskType.value === 'count') { | 296 | if (taskType.value === 'count') { |
| 296 | - fetchTargetList(option.person_type) | 297 | + fetchTargetList(personType.value) |
| 297 | - personType.value = option.person_type | ||
| 298 | } | 298 | } |
| 299 | } | 299 | } |
| 300 | 300 | ||
| ... | @@ -902,12 +902,12 @@ onMounted(async () => { | ... | @@ -902,12 +902,12 @@ onMounted(async () => { |
| 902 | if (option) { | 902 | if (option) { |
| 903 | selectedTaskText.value = option.text | 903 | selectedTaskText.value = option.text |
| 904 | isMakeup.value = !!option.is_makeup | 904 | isMakeup.value = !!option.is_makeup |
| 905 | + personType.value = option.person_type | ||
| 905 | } | 906 | } |
| 906 | 907 | ||
| 907 | // 如果是计数打卡,根据选中的作业ID查询计数对象 | 908 | // 如果是计数打卡,根据选中的作业ID查询计数对象 |
| 908 | if (taskType.value === 'count') { | 909 | if (taskType.value === 'count') { |
| 909 | - fetchTargetList(option.person_type) | 910 | + fetchTargetList(personType.value) |
| 910 | - personType.value = option.person_type | ||
| 911 | } | 911 | } |
| 912 | } | 912 | } |
| 913 | 913 | ... | ... |
-
Please register or login to post a comment