web-课程任务

schoolNewsWeb/src/views/admin/manage/study/StudyManagementView.vue

@@ -3,9 +3,7 @@
     <h1 class="page-title">学习管理</h1>
 
     <el-tabs v-model="activeTab">
-      <el-tab-pane label="学习任务发布" name="task-publish">
-        <TaskPublish />
-      </el-tab-pane>
+
       <el-tab-pane label="学习记录" name="task-records">
         <StudyRecords />
       </el-tab-pane>
@@ -16,7 +14,6 @@
 <script setup lang="ts">
 import { ref } from 'vue';
 import { ElTabs, ElTabPane } from 'element-plus';
-import TaskPublish from './components/TaskPublish.vue';
 import StudyRecords from './components/StudyRecords.vue';
 
 const activeTab = ref('task-publish');

schoolNewsWeb/src/views/admin/manage/study/TaskManageView.vue

@@ -0,0 +1,57 @@
+<template>
+  <div class="task-management">
+    <LearningTaskList
+      v-if="currentView === 'list'"
+      @add="handleAdd"
+      @edit="handleEdit"
+    />
+    <LearningTaskAdd
+      v-else-if="currentView === 'add' || currentView === 'edit'"
+      :task-i-d="currentTaskId"
+      @success="handleSuccess"
+      @cancel="handleCancel"
+    />
+  </div>
+</template>
+
+<script setup lang="ts">
+import { ref } from 'vue';
+import { LearningTaskList, LearningTaskAdd } from '@/views/task';
+import type { LearningTask } from '@/types/study';
+
+defineOptions({
+  name: 'TaskManageView'
+});
+
+type ViewType = 'list' | 'add' | 'edit';
+
+const currentView = ref<ViewType>('list');
+const currentTaskId = ref<string>();
+
+function handleAdd() {
+  currentView.value = 'add';
+  currentTaskId.value = undefined;
+}
+
+function handleEdit(task: LearningTask) {
+  currentView.value = 'edit';
+  currentTaskId.value = task.taskID;
+}
+
+function handleSuccess() {
+  currentView.value = 'list';
+  currentTaskId.value = undefined;
+}
+
+function handleCancel() {
+  currentView.value = 'list';
+  currentTaskId.value = undefined;
+}
+</script>
+
+<style lang="scss" scoped>
+.task-management {
+  height: 100%;
+  background: #f5f7fa;
+}
+</style>

schoolNewsWeb/src/views/admin/manage/study/TaskPublishView.vue

@@ -1,135 +0,0 @@
-<template>
-  <div class="task-publish">
-    <el-form :model="taskForm" :rules="taskRules" ref="taskFormRef" label-width="120px">
-      <el-form-item label="任务名称" prop="name">
-        <el-input v-model="taskForm.name" placeholder="请输入任务名称" />
-      </el-form-item>
-
-      <el-form-item label="任务描述" prop="description">
-        <el-input 
-          v-model="taskForm.description" 
-          type="textarea" 
-          :rows="4"
-          placeholder="请输入任务描述"
-        />
-      </el-form-item>
-
-      <el-form-item label="任务周期" prop="period">
-        <el-date-picker
-          v-model="taskForm.period"
-          type="daterange"
-          range-separator="至"
-          start-placeholder="开始日期"
-          end-placeholder="结束日期"
-        />
-      </el-form-item>
-
-      <el-form-item label="关联资源" prop="resources">
-        <el-button @click="showResourceSelector">选择资源</el-button>
-        <div class="selected-resources" v-if="taskForm.resources.length">
-          <el-tag 
-            v-for="resource in taskForm.resources" 
-            :key="resource.id"
-            closable
-            @close="removeResource(resource)"
-          >
-            {{ resource.name }}
-          </el-tag>
-        </div>
-      </el-form-item>
-
-      <el-form-item label="任务接受对象" prop="targets">
-        <el-radio-group v-model="taskForm.targetType">
-          <el-radio label="dept">按部门</el-radio>
-          <el-radio label="role">按权限</el-radio>
-          <el-radio label="user">选人员</el-radio>
-        </el-radio-group>
-        <el-button @click="showTargetSelector" style="margin-left: 16px;">
-          选择对象
-        </el-button>
-      </el-form-item>
-
-      <el-form-item>
-        <el-button type="primary" @click="handlePublish">发布任务</el-button>
-        <el-button @click="handleReset">重置</el-button>
-      </el-form-item>
-    </el-form>
-  </div>
-</template>
-
-<script setup lang="ts">
-import { ref } from 'vue';
-import { ElForm, ElFormItem, ElInput, ElDatePicker, ElButton, ElRadioGroup, ElRadio, ElTag, ElMessage, type FormInstance, type FormRules } from 'element-plus';
-
-const taskFormRef = ref<FormInstance>();
-
-const taskForm = ref({
-  name: '',
-  description: '',
-  period: null as [Date, Date] | null,
-  resources: [] as any[],
-  targetType: 'dept',
-  targets: [] as any[]
-});
-
-const taskRules: FormRules = {
-  name: [
-    { required: true, message: '请输入任务名称', trigger: 'blur' }
-  ],
-  description: [
-    { required: true, message: '请输入任务描述', trigger: 'blur' }
-  ],
-  period: [
-    { required: true, message: '请选择任务周期', trigger: 'change' }
-  ]
-};
-
-function showResourceSelector() {
-  // TODO: 显示资源选择器
-}
-
-function removeResource(resource: any) {
-  const index = taskForm.value.resources.indexOf(resource);
-  if (index > -1) {
-    taskForm.value.resources.splice(index, 1);
-  }
-}
-
-function showTargetSelector() {
-  // TODO: 显示对象选择器
-}
-
-async function handlePublish() {
-  if (!taskFormRef.value) return;
-  
-  try {
-    await taskFormRef.value.validate();
-    // TODO: 调用发布任务API
-    ElMessage.success('任务发布成功');
-    handleReset();
-  } catch (error) {
-    console.error('表单验证失败', error);
-  }
-}
-
-function handleReset() {
-  taskFormRef.value?.resetFields();
-  taskForm.value.resources = [];
-  taskForm.value.targets = [];
-}
-</script>
-
-<style lang="scss" scoped>
-.task-publish {
-  padding: 20px;
-  max-width: 800px;
-}
-
-.selected-resources {
-  margin-top: 12px;
-  display: flex;
-  flex-wrap: wrap;
-  gap: 8px;
-}
-</style>
-