feat:增加项目/学习路径图评估管理列表部分数据接入

src/components/drawers/project/ProjectOnlineManage.vue

@@ -1,28 +1,29 @@
 <template>
   <a-drawer
+    v-if="Tvisible"
     :visible="Tvisible"
     class="drawerStyle ProjectOnlineManage"
     placement="right"
     width="60%"
     @after-visible-change="afterVisibleChange"
-  >
+  > 
     <div class="drawerMain">
       <div class="header">
         <div class="headerTitle">
           【{{
-            itemsType === 1
+            datasource.type === 1
               ? "在线"
-              : itemsType === 3
+              : datasource.type === 3
               ? "案例"
-              : itemsType === 6
+              : datasource.type === 6
               ? "直播"
-              : itemsType === 7
+              : datasource.type === 7
               ? "外链"
-              : itemsType === 8
+              : datasource.type === 8
               ? "讨论"
-              : itemsType === 9
+              : datasource.type === 9
               ? "活动"
-              : itemsType === 11
+              : datasource.type === 11
               ? "评估"
               : "-"
           }}】{{ title }}
@@ -34,7 +35,8 @@
         />
       </div>
       <div class="main">
-        <div class="endtime">起止时间：2022-07-21 14:00 ～ 2022-7-30 14:00</div>
+        <div v-if="datasource.type !==6 || datasource.type !==9 " class="endtime">起止时间：—</div>
+        <div v-else class="endtime">起止时间：{{datasource.startTime}} ～ {{datasource.endTime}}</div>
         <div class="search">
           <div class="sealeft">
             <div class="namecon" style="margin-right: 30px">
@@ -64,7 +66,7 @@
             <div
               class="btn btn1"
               style="margin-right: 20px"
-              @click="searchTaskList"
+              @click="searchTaskList" 
             >
               <div class="img1"></div>
               <div class="wz">搜索</div>
@@ -80,8 +82,8 @@
             <div class="img1"></div>
             <div class="wz">催促学习</div>
           </div>
-          <div class="btn btn2">
-            <div class="img2"></div>
+          <div class="btn btn2" @click="exportTaskStu"> 
+            <div class="img2"></div> 
             <div class="wz">导出数据</div>
           </div>
         </div>
@@ -90,7 +92,7 @@
             style="border: 1px solid #f2f6fe"
             :columns="tableDataFunc()"
             :data-source="tabledata"
-            :loading="tableDataTotal === -1 ? true : false"
+            :loading="tableDataTotalLoading"
             :scroll="{ x: 900 }"
             :pagination="false"
           />
@@ -104,7 +106,7 @@
                 :current="currentPage"
                 :total="tableDataTotal"
                 class="pagination"
-                @change="onChange"
+                @change="changePaginationStu"
                 v-if="tableDataTotal > 10"
               />
             </div>
@@ -112,8 +114,8 @@
         </div>
       </div>
       <div class="btnn">
-        <button class="btn1">取消</button>
-        <button class="btn2">确定</button>
+        <button class="btn1" @click="closeDrawer">取消</button>
+        <button class="btn2" @click="closeDrawer">确定</button>
       </div>
     </div>
   </a-drawer>
@@ -123,6 +125,7 @@
 import { toRefs, reactive, onMounted, onUnmounted } from "vue";
 import { message } from "ant-design-vue";
 // import * as api from "../../../api/index";
+import * as api from '../../../api/indexTaskManage';
 export default {
   name: "ProjectOnlineManage",
 
@@ -135,6 +138,10 @@ export default {
       type: String,
       default: "",
     },
+    levelName: {
+      type: String,
+      default: "",
+    },
     projectTaskId: {
       type: Number,
       default: null,
@@ -143,6 +150,12 @@ export default {
       type: Number,
       default: null,
     },
+    datasource: {
+      type: Object,
+      default: function () {
+        return {};
+      },
+    },
   },
 
   setup(props, ctx) {
@@ -153,97 +166,101 @@ export default {
       pageSize: 10,
       currentPage: 1,
       tableDataTotal: 0,
-      projectName: null,
+      projectName: "",
       projectNameList: [
+        // {
+        //   id: 1,
+        //   value: "-1",
+        //   label: "未开始",
+        // },
         {
           id: 1,
-          value: "-1",
-          label: "未开始",
-        },
-        {
-          id: 2,
           value: "0",
           label: "未完成",
         },
         {
-          id: 3,
+          id: 2,
           value: "1",
           label: "已完成",
         },
       ],
-      tabledata: [
-        {
-          workNum: "123",
-          userName: "li",
-          deptName: "开发",
-          jobName: "前端开发",
-          time: "2022-07-22 14:00:30",
-          status: "已完成",
-        },
-      ],
+      tabledata: [],
+      tableDataTotalLoading: true, // 表格loading加载配置
     });
     const tableDataFunc = () => {
-      if (
-        props.itemsType == 1 ||
-        props.itemsType == 3 ||
-        props.itemsType == 6 ||
-        props.itemsType == 7 ||
-        props.itemsType == 8 ||
-        props.itemsType == 9 ||
-        props.itemsType == 11
-      ) {
-        const columns = [
-          {
-            title: "工号",
-            dataIndex: "workNum",
-            key: "workNum",
-            width: 50,
-            align: "center",
-            className: "h head",
-          },
-          {
-            title: "姓名",
-            dataIndex: "userName",
-            key: "userName",
-            width: 50,
-            align: "center",
-            className: "h head",
-          },
-          {
-            title: "所在部门",
-            dataIndex: "deptName",
-            key: "deptName",
-            width: 60,
-            align: "center",
-            className: "h",
-          },
-          {
-            title: "所在岗位",
-            dataIndex: "jobName",
-            key: "jobName",
-            width: 60,
-            align: "center",
-            className: "h",
-          },
-          {
-            title: "完成时间",
-            dataIndex: "time",
-            key: "time",
-            width: 100,
-            align: "center",
-            className: "h",
-          },
-          {
-            title: "任务状态",
-            dataIndex: "status",
-            key: "status",
-            width: 60,
-            align: "center",
-            className: "h",
-          },
-        ];
-        return columns;
-      }
+      const columns = [
+        {
+          title: "工号",
+          dataIndex: "studentUserNo",
+          key: "studentUserNo",
+          width: 50,
+          align: "center",
+          className: "h head",
+        },
+        {
+          title: "姓名",
+          dataIndex: "studentName",
+          key: "studentName",
+          width: 50,
+          align: "center",
+          className: "h head",
+        },
+        {
+          title: "所在部门",
+          dataIndex: "studentDepartName",
+          key: "studentDepartName",
+          width: 60,
+          align: "center",
+          className: "h",
+        },
+        {
+          title: "所在岗位",
+          dataIndex: "studentJobName",
+          key: "studentJobName",
+          width: 60,
+          align: "center",
+          className: "h",
+        },
+        {
+          title: "学员关卡",
+          dataIndex: "currentStageName",
+          key: "currentStageName",
+          width: 60,
+          align: "center",
+          className: "h",
+          customRender: (text) => {
+              return (
+                <div class="racona">
+                  <span> {props.levelName}</span>
+                </div>
+              );
+            }
+        },
+        {
+          title: "完成时间",
+          dataIndex: "endStudyTime",
+          key: "endStudyTime",
+          width: 100,
+          align: "center",
+          className: "h",
+        },
+        {
+          title: "任务状态",
+          dataIndex: "status",
+          key: "status",
+          width: 60,
+          align: "center",
+          className: "h",
+          customRender: (text) => {
+              return (
+                <div class="racona">
+                  <span> {text.record.status==0?"未完成":"已完成"}</span>
+                </div>
+              );
+            }
+        },
+      ];
+      return columns;
     };
 
     const closeDrawer = () => {
@@ -255,7 +272,9 @@ export default {
     };
     const afterVisibleChange = (bol) => {
       if (bol == true) {
-        // getManageList();
+        console.log('当前是什么类型',props.datasource.type)
+        state.tableDataTotalLoading = true;
+        getData();
       }
     };
     const selectProjectName = (value) => {
@@ -270,6 +289,82 @@ export default {
       console.log("Page: ", pageNumber);
     };
 
+    // 获取数据
+    function getData() {
+      if(props.datasource.type==11){
+        // 此处为获取评估学员的接口 - 如后续还有用到此接口的公共任务可直接在if里面加||判断即可
+        console.log('我是传递的查询参数',{
+          pageNo:state.currentPage,
+          pageSize:state.pageSize,
+          currentStageId:props.datasource.stageId,
+          type: 1,
+          pid: props.datasource.projectId,
+          status: state.projectName,
+          studentName: state.name
+        })
+        api.AssessmentManagementMessage({
+          pageNo:state.currentPage,
+          pageSize:state.pageSize,
+          currentStageId:props.datasource.stageId,
+          type: 1,
+          pid: props.datasource.projectId,
+          status: state.projectName,
+          studentName: state.name
+        }).then(res=>{
+          console.log(res)
+          if(res.status==200){
+            state.tabledata = res.data.data.records;
+            state.tableDataTotal =res.data.data.total;
+            state.tableDataTotalLoading = false;
+          }
+        }).catch(err=>{
+          console.log(err)
+          state.tableDataTotalLoading = false;
+          state.tabledata = [];
+        })
+      }else{
+        state.tableDataTotalLoading = false;
+        state.tabledata =  [];
+      }
+    }
+
+    // 搜索按钮
+    function searchTaskList() {
+      state.currentPage = 1;
+      state.tableDataTotalLoading = true;
+      getData();
+    }
+    // 重置按钮
+    function resetTaskList() {
+      state.tableDataTotalLoading = true;
+      state.currentPage = 1;
+      state.name = ""; 
+      state.projectName = "";
+      getData();
+    }
+
+    //分页
+    const changePaginationStu = (page) => {
+        state.tableDataTotalLoading = true;
+        state.currentPage = page;
+        getData();
+      };
+    
+    // 导出数据
+    function exportTaskStu() {
+      api.ExportTaskStudent({
+        pageNo:state.currentPage,
+        pageSize:state.pageSize,
+        currentStageId:props.datasource.stageId,
+        type: 1,
+        pid: props.datasource.projectId
+      }).then(res=>{
+        console.log(res)
+      }).catch(err=>{
+        console.log(err)
+      })
+    }
+
     return {
       ...toRefs(state),
       selectProjectName,
@@ -280,6 +375,10 @@ export default {
       onMounted,
       onUnmounted,
       onChange,
+      searchTaskList,
+      resetTaskList,
+      changePaginationStu,
+      exportTaskStu
     };
   },
 };
@@ -517,3 +616,4 @@ export default {
   }
 }
 </style>
+