fix:任务管理

src/views/hr/workload/index.vue

@@ -1,9 +1,9 @@
+<!--任务管理-->
 <template>
-  <h1>>说明：任务具体分配给某个人，至少简单的任务分配，并非项目中的任务列表，暂时调用项目中的任务列表，并不完全，</h1>
-  <h1>目前需要新建一个任务表，表中的内容。。。。</h1>
   <GiPageLayout>
+    <a-button type="primary" style="margin-bottom: 16px" @click="openAddModal">发布任务</a-button>
     <GiTable
-      row-key="id"
+      row-key="taskId"
       title="任务记录"
       :data="dataList"
       :columns="tableColumns"
@@ -13,6 +13,7 @@
       @page-change="onPageChange"
       @page-size-change="onPageSizeChange"
       @refresh="search"
+      @row-click="onRowClick"
     >
       <template #top>
         <GiForm
@@ -24,18 +25,62 @@
           @reset="reset"
         />
       </template>
-      <!-- 任务状态显示 -->
       <template #status="{ record }">
         <a-tag :color="getTaskStatusColor(record.status)">{{ getTaskStatusText(record.status) }}</a-tag>
       </template>
-      <!-- 操作列 -->
       <template #action="{ record }">
         <a-space>
-          <a-link @click="editRecord(record)">编辑</a-link>
+          <a-link @click.stop="onRowClick(record)">详情</a-link>
-          <a-link status="danger" @click="deleteRecord(record)">删除</a-link>
+          <a-link status="danger" @click.stop="deleteRecord(record)">删除</a-link>
         </a-space>
       </template>
     </GiTable>
+    <!-- 发布任务弹窗 -->
+    <a-modal v-model:visible="showAddModal" title="发布任务" @ok="handleAddTask" @cancel="showAddModal = false">
+      <a-form :model="addForm" label-width="90px">
+        <a-form-item label="任务ID">
+          <a-input v-model="addForm.taskId" disabled />
+        </a-form-item>
+        <a-form-item label="任务描述">
+          <a-input v-model="addForm.remark" placeholder="请输入任务描述" />
+        </a-form-item>
+        <a-form-item label="创建时间">
+          <a-input v-model="addForm.createTime" disabled />
+        </a-form-item>
+      </a-form>
+    </a-modal>
+    <!-- 任务详情弹窗 -->
+    <a-modal v-model:visible="showDetailModal" title="任务详情" @ok="handleUpdateTask" @cancel="showDetailModal = false" :footer="false">
+      <a-form :model="detailForm" label-width="90px">
+        <a-form-item label="任务ID">
+          <a-input v-model="detailForm.taskId" disabled />
+        </a-form-item>
+        <a-form-item label="任务描述">
+          <a-input v-model="detailForm.remark" />
+        </a-form-item>
+        <a-form-item label="分配岗位">
+          <a-select v-model="detailForm.deptName" :options="deptOptions" allow-clear placeholder="请选择岗位" />
+        </a-form-item>
+        <a-form-item label="分配人员">
+          <a-select v-model="detailForm.mainUserId" :options="userOptions" allow-clear placeholder="请选择人员" />
+        </a-form-item>
+        <a-form-item label="任务状态">
+          <a-input :value="getTaskStatusText(detailForm.status)" disabled />
+        </a-form-item>
+        <a-form-item label="创建时间">
+          <a-input v-model="detailForm.createTime" disabled />
+        </a-form-item>
+        <a-form-item label="完成时间">
+          <a-input v-model="detailForm.finishTime" disabled />
+        </a-form-item>
+      </a-form>
+      <template #footer>
+        <a-space style="float: right">
+          <a-button status="danger" @click="handleDeleteTask">删除</a-button>
+          <a-button type="primary" @click="handleUpdateTask">确定</a-button>
+        </a-space>
+      </template>
+    </a-modal>
   </GiPageLayout>
 </template>
 
@@ -43,13 +88,13 @@
 import { ref, reactive, onMounted } from 'vue'
 import { Message } from '@arco-design/web-vue'
 import type { TableColumnData } from '@arco-design/web-vue'
-import { listTask } from '@/apis/project/task'
+// import { listTask } from '@/apis/project/task' // 接口调用处注释
 
 // 任务状态映射
-// status：0未开始，1进行中，2已完成，3已取消
+// 0未分配，1已分配，2已完成，3已取消
 const statusOptions = [
-  { label: '未开始', value: 0 },
+  { label: '未分配', value: 0 },
-  { label: '进行中', value: 1 },
+  { label: '已分配', value: 1 },
   { label: '已完成', value: 2 },
   { label: '已取消', value: 3 }
 ]
@@ -64,14 +109,26 @@ const getTaskStatusColor = (status: number) => {
 }
 const getTaskStatusText = (status: number) => {
   const textMap: Record<number, string> = {
-    0: '未开始',
+    0: '未分配',
-    1: '进行中',
+    1: '已分配',
     2: '已完成',
     3: '已取消'
   }
   return textMap[status] || status
 }
 
+// 示例岗位和人员
+const deptOptions = [
+  { label: '开发', value: '开发' },
+  { label: '测试', value: '测试' },
+  { label: '运维', value: '运维' }
+]
+const userOptions = [
+  { label: '张三', value: '张三' },
+  { label: '李四', value: '李四' },
+  { label: '王五', value: '王五' }
+]
+
 // 搜索表单
 let searchForm = reactive({
   taskName: '',
@@ -137,28 +194,117 @@ const pagination = reactive({
   showPageSize: true
 })
 
-// 获取任务数据
+// 发布任务弹窗
+const showAddModal = ref(false)
+const addForm = reactive({
+  taskId: '',
+  remark: '',
+  createTime: ''
+})
+const openAddModal = () => {
+  addForm.taskId = Date.now().toString()
+  addForm.remark = ''
+  addForm.createTime = new Date().toLocaleString()
+  showAddModal.value = true
+}
+const handleAddTask = () => {
+  if (!addForm.remark) {
+    Message.warning('请输入任务描述')
+    return
+  }
+  const newTask = {
+    taskId: addForm.taskId,
+    taskName: addForm.remark,
+    mainUserId: '',
+    deptName: '',
+    remark: addForm.remark,
+    status: 0, // 未分配
+    createTime: addForm.createTime,
+    finishTime: ''
+  }
+  allData.value.unshift(newTask)
+  filterAndPaginate()
+  showAddModal.value = false
+  Message.success('任务发布成功')
+}
+
+// 任务详情弹窗
+const showDetailModal = ref(false)
+const detailForm = reactive({
+  taskId: '',
+  taskName: '',
+  mainUserId: '',
+  deptName: '',
+  remark: '',
+  status: 0,
+  createTime: '',
+  finishTime: ''
+})
+let detailIndex = -1
+const onRowClick = (record: any) => {
+  Object.assign(detailForm, record)
+  detailIndex = allData.value.findIndex(item => item.taskId === record.taskId)
+  showDetailModal.value = true
+}
+const handleUpdateTask = () => {
+  if (detailIndex !== -1) {
+    allData.value[detailIndex] = { ...detailForm }
+    filterAndPaginate()
+    showDetailModal.value = false
+    Message.success('任务更新成功')
+  }
+}
+const handleDeleteTask = () => {
+  if (detailIndex !== -1) {
+    allData.value.splice(detailIndex, 1)
+    filterAndPaginate()
+    showDetailModal.value = false
+    Message.success('任务已删除')
+  }
+}
+
+// 获取任务数据（用示例数据，接口调用处注释）
 const fetchTaskList = async () => {
   loading.value = true
   try {
-    const params: any = {
+    // const res = await listTask(params)
-      page: searchForm.page,
+    // const rows = res?.rows || res?.data?.rows || []
-      pageSize: searchForm.size,
+    // allData.value = rows
-      taskName: searchForm.taskName,
+    // 示例数据：
-      mainUserId: searchForm.responsiblePerson,
+    allData.value = [
-      status: searchForm.status
+      {
-    }
+        taskId: '1710000000000',
-    // 移除空参数
+        taskName: '示例任务A',
-    Object.keys(params).forEach(key => {
+        mainUserId: '张三',
-      if (params[key] === '' || params[key] === undefined) delete params[key]
+        deptName: '开发',
-    })
+        remark: '开发新功能',
-    const res = await listTask(params)
+        status: 1,
-    // 兼容后端返回格式，优先rows，其次data
+        createTime: '2024-05-01 10:00:00',
-    const rows = res?.rows || res?.data?.rows || []
+        finishTime: ''
-    console.log('后端返回数据:', res) // 只打印一次原始数据
+      },
-    allData.value = rows
+      {
+        taskId: '1710000000001',
+        taskName: '示例任务B',
+        mainUserId: '',
+        deptName: '',
+        remark: '待分配任务',
+        status: 0,
+        createTime: '2024-05-02 11:00:00',
+        finishTime: ''
+      },
+      {
+        taskId: '1710000000002',
+        taskName: '示例任务C',
+        mainUserId: '李四',
+        deptName: '测试',
+        remark: '测试任务',
+        status: 2,
+        createTime: '2024-05-03 09:00:00',
+        finishTime: '2024-05-05 18:00:00'
+      }
+    ]
     filterAndPaginate()
-    pagination.total = rows.length
+    pagination.total = allData.value.length
   } catch (e) {
     Message.error('获取任务数据失败')
   } finally {
@@ -192,7 +338,7 @@ const filterAndPaginate = () => {
 // 搜索和重置
 const search = async () => {
   pagination.current = 1
-  await fetchTaskList()
+  filterAndPaginate()
 }
 
 const reset = async () => {
@@ -204,7 +350,7 @@ const reset = async () => {
     size: 10
   })
   pagination.current = 1
-  await fetchTaskList()
+  filterAndPaginate()
 }
 
 // 分页处理
@@ -219,13 +365,14 @@ const onPageSizeChange = (size: number) => {
   filterAndPaginate()
 }
 
-// 操作方法
+// 删除操作（表格操作列）
-const editRecord = (record: any) => {
-  Message.info(`编辑任务: ${record.taskName}`)
-}
-
 const deleteRecord = (record: any) => {
-  Message.info(`删除任务: ${record.taskName}`)
+  const idx = allData.value.findIndex(item => item.taskId === record.taskId)
+  if (idx !== -1) {
+    allData.value.splice(idx, 1)
+    filterAndPaginate()
+    Message.success('任务已删除')
+  }
 }
 
 onMounted(() => {