Hooke / mlaj

Go to a project
Toggle navigation Toggle navigation pinning
hookehuyr
682e5bb5 1 parent ba42faae

refactor(CheckinDetailPage): 移除mock数据并优化作品类型获取逻辑 

将临时mock的富文本数据移除，改为从任务详情中获取作品类型数据
当没有作品类型数据时，默认显示4种基本类型
Inline Side-by-side
Showing 1 changed file with 15 additions and 85 deletions
......@@ -315,78 +315,21 @@ const getTaskDetail = async (month) => {
if (code) {
taskDetail.value = data
// TODO: 临时 mock 富文本数据，后续替换为真实数据
// if (!taskDetail.value.description) {
// taskDetail.value.description = `
// <div class="rich-content">
// <h2 style="color: #2563eb; margin-bottom: 16px; font-size: 20px; font-weight: 600;">📚 本周学习任务</h2>
// <p style="margin-bottom: 16px; line-height: 1.6; color: #374151;">
// 同学们好！本周我们将学习<strong style="color: #dc2626;">Vue3 组合式 API</strong>的核心概念。请大家认真完成以下任务：
// </p>
// <div style="background: linear-gradient(135deg, #fef3c7 0%, #fde68a 100%); padding: 16px; border-radius: 12px; margin: 16px 0; border-left: 4px solid #f59e0b;">
// <h3 style="color: #92400e; margin: 0 0 8px 0; font-size: 16px;">⚠️ 重要提醒</h3>
// <p style="margin: 0; color: #78350f;">请在截止日期前提交作业，逾期将影响成绩评定。</p>
// </div>
// <h3 style="color: #059669; margin: 24px 0 12px 0; font-size: 18px;">📋 具体要求：</h3>
// <ol style="margin: 16px 0; padding-left: 24px; color: #374151; line-height: 1.8;">
// <li style="margin-bottom: 8px;">
// <strong>理论学习：</strong>观看课程视频，理解 <code style="background: #f3f4f6; padding: 2px 6px; border-radius: 4px; color: #dc2626;">ref</code> 和 <code style="background: #f3f4f6; padding: 2px 6px; border-radius: 4px; color: #dc2626;">reactive</code> 的区别
// </li>
// <li style="margin-bottom: 8px;">
// <strong>实践操作：</strong>完成课后练习，创建一个简单的计数器组件
// </li>
// <li style="margin-bottom: 8px;">
// <strong>拓展思考：</strong>思考组合式 API 相比选项式 API 的优势
// </li>
// </ol>
// <div style="text-align: center; margin: 24px 0;">
// <img src="https://cdn.ipadbiz.cn/mlaj/images/vue3-composition-api.jpg"
// alt="Vue3 组合式 API 示意图"
// style="max-width: 100%; height: auto; border-radius: 12px; box-shadow: 0 4px 12px rgba(0,0,0,0.1);" />
// <p style="margin-top: 8px; color: #6b7280; font-size: 14px; font-style: italic;">
// Vue3 组合式 API 架构图
// </p>
// </div>
// <div style="background: linear-gradient(135deg, #dbeafe 0%, #bfdbfe 100%); padding: 16px; border-radius: 12px; margin: 20px 0;">
// <h4 style="color: #1e40af; margin: 0 0 12px 0; font-size: 16px;">💡 学习提示</h4>
// <ul style="margin: 0; padding-left: 20px; color: #1e3a8a;">
// <li style="margin-bottom: 6px;">可以参考官方文档进行学习</li>
// <li style="margin-bottom: 6px;">建议先理解概念，再动手实践</li>
// <li style="margin-bottom: 6px;">遇到问题可以在群里讨论</li>
// </ul>
// </div>
// <blockquote style="border-left: 4px solid #10b981; background: #f0fdf4; padding: 16px; margin: 20px 0; border-radius: 0 8px 8px 0;">
// <p style="margin: 0; color: #065f46; font-style: italic; line-height: 1.6;">
// "学而时习之，不亦说乎？" —— 希望大家能够在实践中加深对知识的理解。
// </p>
// </blockquote>
// <div style="text-align: center; margin: 24px 0;">
// <img src="https://cdn.ipadbiz.cn/mlaj/images/coding-example.png"
// alt="代码示例"
// style="max-width: 100%; height: auto; border-radius: 8px; border: 2px solid #e5e7eb;" />
// </div>
// <div style="background: #fef2f2; border: 1px solid #fecaca; border-radius: 8px; padding: 16px; margin: 20px 0;">
// <h4 style="color: #dc2626; margin: 0 0 8px 0; font-size: 16px;">📅 截止时间</h4>
// <p style="margin: 0; color: #991b1b; font-weight: 500;">
// 2024年12月31日 23:59
// </p>
// </div>
// <p style="margin-top: 24px; color: #6b7280; text-align: center; font-size: 14px;">
// 祝大家学习愉快！有问题随时联系老师 👨‍🏫
// </p>
// </div>
// `
// }
// 获取作品类型数据
if (data.attachment_type.length) {
attachmentTypeOptions.value = Object.entries(data.attachment_type).map(([key, value]) => ({
key,
value
}))
} else {
// 显示4种类型
attachmentTypeOptions.value = [
{ key: 'text', value: '文本' },
{ key: 'image', value: '图片' },
{ key: 'audio', value: '音频' },
{ key: 'video', value: '视频' }
]
}
}
}
......@@ -676,19 +619,6 @@ onMounted(async () => {
getTaskDetail(dayjs().format('YYYY-MM'));
}
// 获取作品类型数据
try {
const { code, data } = await getTeacherFindSettingsAPI()
if (code && data.task_attachment_type) {
attachmentTypeOptions.value = Object.entries(data.task_attachment_type).map(([key, value]) => ({
key,
value
}))
}
} catch (error) {
console.error('获取作品类型数据失败:', error)
}
// 初始化编辑数据
await initEditData()
})
......