boss页面增加展开按钮

src/api/TaskManagement/index.ts

@@ -5,9 +5,9 @@ import request from '@/utils/request'
  * */
 
 // 查询任务列表
-export const ApiTasks = (boss_id: string) => {
+export const ApiTasks = (boss_id: string, page: number, page_size: number) => {
   return request({
-    url: `/api/tasks/${boss_id}`,
+    url: `/api/tasks/${boss_id}?page=${page}&page_size=${page_size}`,
     method: 'get'
   })
 }

src/views/BoosAccountManagement/components/ViewTheTaskListDetails.vue

@@ -43,6 +43,13 @@
         </template>
       </el-table-column>
     </el-table>
+    <pagination
+      v-if="total > 0"
+      v-model:total="total"
+      v-model:page="queryParams.pageNum"
+      v-model:limit="queryParams.pageSize"
+      @pagination="fetchData"
+    />
   </div>
 </template>
 
@@ -59,14 +66,20 @@ const props = defineProps({
 })
 
 const roleList = ref<any[]>()
-
+const total = ref(0)
+const queryParams = reactive<any>({
+  pageNum: 1,
+  pageSize: 10
+})
 // 获取数据
 function fetchData() {
-  ApiTasks(props.bossId).then((res: any) => {
+  ApiTasks(props.bossId, queryParams.pageNum, queryParams.pageSize).then((res: any) => {
     roleList.value = res.data
   })
 }
-
+defineExpose({
+  fetchData
+})
 onMounted(() => {
   fetchData()
 })

src/views/BoosAccountManagement/index.vue

@@ -57,6 +57,7 @@
           <template #default="scope">
             <ViewTheTaskListDetails
               v-if="expandedRowKeys.includes(scope.row.id)"
+              ref="taskListRef"
               :boss-id="scope.row.id"
             ></ViewTheTaskListDetails>
           </template>
@@ -81,7 +82,7 @@
           header-align="center"
         >
           <template #default="scope">
-            <el-tag v-if="scope.row.worker_online" type="success">
+            <el-tag v-if="scope.row.is_logged_in" type="success">
               {{ '在线' }}
             </el-tag>
             <el-tag v-else type="danger">
@@ -170,14 +171,23 @@
             >
               招聘
             </el-button>
+            <!--            <el-button-->
+            <!--              type="primary"-->
+            <!--              size="small"-->
+            <!--              link-->
+            <!--              icon="edit"-->
+            <!--              @click="onDetails(scope.row.id)"-->
+            <!--            >-->
+            <!--              查看任务-->
+            <!--            </el-button>-->
             <el-button
               type="primary"
               size="small"
               link
               icon="edit"
-              @click="onDetails(scope.row.id)"
+              @click="handleExpandTask(scope.row.id)"
             >
-              查看任务
+              展开任务
             </el-button>
             <el-button
               type="danger"
@@ -223,6 +233,8 @@ defineOptions({
 const { startTimer, stopTimer } = createTimer()
 
 const queryFormRef = ref()
+const dataTableRef = ref()
+const taskListRef = ref()
 
 const loading = ref(false)
 const total = ref(0)
@@ -344,19 +356,19 @@ const onUserDeleteDepartment = (id: string) => {
   )
 }
 
-const onDetails = (id: string) => {
-  functionDialogBox(
-    ViewTheTaskListDetails,
-    {
-      bossId: id
-    },
-    {
-      title: '任务列表',
-      width: '1200',
-      footerVisible: false
-    }
-  )
-}
+// const onDetails = (id: string) => {
+//   functionDialogBox(
+//     ViewTheTaskListDetails,
+//     {
+//       bossId: id
+//     },
+//     {
+//       title: '任务列表',
+//       width: '1200',
+//       footerVisible: false
+//     }
+//   )
+// }
 
 const onApiTasksAdd = (id: string, task_type: string, params: string) => {
   // functionDialogBox(
@@ -378,8 +390,9 @@ const onApiTasksAdd = (id: string, task_type: string, params: string) => {
 
   ApiTasksAdd({ params, task_type, boss_id: id })
     .then(() => {
-      ElMessage.success('提交成功')
+      ElMessage.success('操作成功')
       handleResetQuery()
+      refreshTaskList()
     })
     .finally(() => (loading.value = false))
 }
@@ -387,11 +400,18 @@ function handleExpandChange(row: any, expandedRows: any[]) {
   expandedRowKeys.value = expandedRows.map((item) => item.id)
 }
 
-// const onApiTasksTaskId = (task_id: string) => {
-//   ApiTasksTaskId(task_id).then((res: any) => {
-//     console.log(res, 'res')
-//   })
-// }
+const handleExpandTask = (rowId: string) => {
+  // 找到对应的行数据
+  const targetRow = roleList.value?.find((item) => item.id === rowId)
+  if (targetRow && dataTableRef.value) {
+    dataTableRef.value.toggleRowExpansion(targetRow)
+  }
+}
+
+const refreshTaskList = () => {
+  // 调用子组件的 fetchData 方法
+  taskListRef.value?.fetchData()
+}
 
 onMounted(() => {
   // handleQuery()