讲师管理审批编辑页面实现

src/views/lecturer/LecturerApproval.vue

@@ -87,9 +87,12 @@
             <template #bodyCell="{ record, column }">
               <template v-if="column.key === 'operation'">
                 <a-space >
+                  <a-button type="link" @click="goDdit(record)">编辑</a-button>
                   <a-button type="link" @click="() => handleLook(record, String(record.courseform))">查看</a-button>
-                  <a-button  type="link" @click="() => handleOperate(record, String(record.courseform))">审批</a-button>
+                  <!-- <a-button  type="link" @click="() => handleOperate(record, String(record.courseform))">审批</a-button> -->
                   <!-- <a-button type="link" @click="() => deleteModal(record, String(record.courseform))">删除</a-button> -->
+                  <a-button type="link" @click="submit(record)">提交</a-button>
+                  <a-button type="link" @click="withdraw(record)">撤回</a-button>
                 </a-space>
               </template>
             </template>
@@ -119,24 +122,45 @@
 <span class="line"></span>
 <span>讲师费用详情</span>
 <a-descriptions bordered :column="2" :contentStyle="rowCenter" :labelStyle="rowCenter">
-    <a-descriptions-item label="审批编号（未命名）">{{formParam.teacherName}}</a-descriptions-item>
-    <a-descriptions-item label="培训发生组织">{{formParam.trainOrg}}</a-descriptions-item>
-    <a-descriptions-item label="汇总周期" >{{formParam.summaryDate}}</a-descriptions-item>
-    <a-descriptions-item label="汇总金额">{{formParam.totalFee}}</a-descriptions-item>
-    <a-descriptions-item label="'提交时间(未命名)'">{{formParam.payableExpense}}</a-descriptions-item>
-
-    <a-descriptions-item label="状态">{{formParam.status=="A10"?'待审核' :formParam.status=="A20"?'已提交':formParam.status== "A30" ?'审核中':formParam.status== "E10" ?'审核打回':formParam.status=="S20"?'审核通过':''}}</a-descriptions-item>
+    <a-descriptions-item label="审批编号">{{formParam?.teacherName}}</a-descriptions-item>
+    <a-descriptions-item label="培训发生组织">{{formParam?.trainOrg}}</a-descriptions-item>
+    <a-descriptions-item v-if="activeKey==2" label="汇总周期" >{{formParam?.summaryDate}}</a-descriptions-item>
+    <a-descriptions-item label="提交时间">{{formParam?.payableExpense}}</a-descriptions-item>
+    <a-descriptions-item label="汇总金额">{{formParam?.totalFee}}</a-descriptions-item>
+    <a-descriptions-item label="状态">{{formParam?.status=="A10"?'待审核' :formParam?.status=="A20"?'已提交':formParam?.status== "A30" ?'审核中':formParam?.status== "E10" ?'审核打回':formParam?.status=="S20"?'审核通过':''}}</a-descriptions-item>
   </a-descriptions>
   <span class="line"></span>
-<span>审批详情</span>
-<div style="padding: 10px 0">
-          <a-table :header-cell-style="{ 'text-align': 'center' }" style="border: 1px solid #f2f6fe" :columns="columnsExamine"
-            :data-source="tableDataExamine" :loading="examinetableLoading" @expand="expandTable" :pagination="false">
-            <template #bodyCell="{ record, column }">
-            
-            </template>
-          </a-table>
+<!-- <span>审批详情</span> -->
+<a-tabs v-model:activeKey="activeKey">
+  <a-tab-pane key="1" tab="讲师费列表">
+    <div style="padding: 10px 0;">
+      <div style="display: flex;margin-bottom: 20px;">
+        <div style="margin-right:20px;">
+          <a-input style="height:40px;border-radius:8px;" v-model:value="userNoOrName" placeholder="请输入工号/讲师名称进行搜索" />
         </div>
+        <div style="margin-right:20px;">
+          <a-range-picker style="height:40px;border-radius:8px;" valueFormat="YYYY-MM-DD" format="YYYY-MM-DD" v-model:value="seeDateValue" />
+        </div>
+        <div style="margin-right:20px;">
+          <a-button style="margin-right:15px;height:40px;border-radius:8px;" type="primary" @click="searchTeacherFeeApprovalList()">搜索</a-button>
+          <a-button style="margin-right:15px;height:40px;border-radius:8px;" type="primary" @click="resetSearch()">重置</a-button>
+        </div>
+      </div>
+      <div style="padding-bottom:70px">
+        <a-table :scroll="{x:'max-content'}" :header-cell-style="{ 'text-align': 'center' }" style="border: 1px solid #f2f6fe" :columns="columnsExamine"
+          :data-source="tableDataExamine" :loading="examinetableLoading" @expand="expandTable" :pagination="false">
+        </a-table>
+      </div>
+    </div>
+  </a-tab-pane>
+  <a-tab-pane key="2" tab="讲师费审批记录" force-render>
+    <div style="padding-bottom:70px">
+        <a-table :header-cell-style="{ 'text-align': 'center' }" style="border: 1px solid #f2f6fe" :columns="columnsExamineTwo"
+          :data-source="tableDataExamine" :loading="examinetableLoading" @expand="expandTable" :pagination="false">
+        </a-table>
+      </div>
+  </a-tab-pane>
+</a-tabs>
   <div :style="{
         position: 'absolute',
         right: 0,
@@ -194,8 +218,10 @@
   </template>
   <script lang="jsx">
   import { reactive, toRefs, ref ,watch} from "vue";
+  import { useRouter } from "vue-router";
   import { message } from "ant-design-vue";
   import dayjs from "dayjs";
+  import dialog from '@/utils/dialog'
   import {
     RightOutlined,
     UpOutlined,
@@ -204,7 +230,7 @@
     DownloadOutlined
   } from '@ant-design/icons-vue';
   import ProjectManager from "@/components/project/ProjectManagerNew";
-  import {expenseBillList,queryById,getTeacherFeeApprovalList ,updateTeacherFee,updateStatusSubmit,approveTeacherFee,getTrainOrg} from "../../api/lecturerFeeManagement";
+  import {expenseBillList,queryById,getTeacherFeeApprovalList ,updateTeacherFee,updateStatusSubmit,approveTeacherFee,getTrainOrg,isConfirm} from "../../api/lecturerFeeManagement";
   import { getTeacherSystemList } from "../../api/Lecturer";
   // lecturerFeeManagement
   // import {getProjSt} from "../../api/indexProjStu";
@@ -220,7 +246,11 @@
       ProjectManager,
     },
     setup() {
+      const router = useRouter()
       const state = reactive({
+        userNoOrName: null,
+        seeDateValue: [],
+        activeKey: '1',
         moreid:1,
         byPid:null,
         currentPage1: 1,
@@ -429,7 +459,7 @@
           key: 'operation',
         elipsis: true, align: "right",
         fixed: "right",
-          width: 400,
+          width: 200,
           scopedSlots: { customRender: "action" },
         },
         
@@ -483,6 +513,7 @@
             state.tableDataTotal = Number(res.data.data.total);
             state.tableLoading=false 
             console.log("获取讲师tableData", tableData);
+            tableData.value.push({name:'xixixi',id:'111'})
         }) 
       };
       getTableDate()
@@ -546,6 +577,15 @@
           remark:null,
         }
       }
+      const goDdit = (record) => {
+        console.log(record,'record')
+        router.push({
+          path:'/LecturerAppEdit',
+          query:{
+            id:'5'
+          }
+        })
+      }
       //表格内查看数据操作
       const handleLook = (record) => {
         state.teachingdialog = true;
@@ -553,6 +593,36 @@
         TeacherSystem()
         gettableDataExamine( )
       }
+      const submit = (record) => {
+        console.log(record,'record')
+        dialog({
+          content: '确定要提交此条数据吗？',
+          ok: () => {
+            isConfirm({
+              id: record.id,
+              status: 1
+            }).then(res=>{
+              message.success('提交成功')
+              getTableDate();
+            })
+          }
+        })
+      }
+      const withdraw = (record) => {
+        console.log(record,'record')
+        dialog({
+          content: '确定要撤回此条数据吗？',
+          ok: () => {
+            isConfirm({
+              id: record.id,
+              status: 0
+            }).then(res=>{
+              message.success('撤回成功')
+              getTableDate();
+            })
+          }
+        })
+      }
       
       //详情
       const TeacherSystem=()=>{
@@ -573,51 +643,186 @@
             tableDataExamine.value = res.data.data.records
         }) 
       };
-      //二级页面
-      const columnsExamine = ref([
+    const columnsExamineTwo = ref([
       {
-          title: '审批人 ',
-          dataIndex: 'teacherName',
-          key: 'teacherName',
-        elipsis: true, align: "center",
+        title: '审批层级 ',
+        dataIndex: 'name',
+        key: 'name',
+        elipsis: true,
+        align: "center",
+        width: 120,
+      },
+      {
+        title: '层级审批人 ',
+        dataIndex: 'name',
+        key: 'name',
+        elipsis: true,
+        align: "center",
+        width: 120,
+      },
+      {
+        title: '操作 ',
+        dataIndex: 'name',
+        key: 'name',
+        elipsis: true,
+        align: "center",
+        width: 120,
+      },
+      {
+        title: '审批人 ',
+        dataIndex: 'name',
+        key: 'name',
+        elipsis: true,
+        align: "center",
+        width: 120,
+      },
+      {
+        title: '审批时间 ',
+        dataIndex: 'name',
+        key: 'name',
+        elipsis: true,
+        align: "center",
+        width: 120,
+      },
+      {
+        title: '审批建议 ',
+        dataIndex: 'name',
+        key: 'name',
+        elipsis: true,
+        align: "center",
+        width: 120,
+      },
+    ])
+      //二级页面
+    const columnsExamine = ref([
+      {
+          title: '讲师姓名 ',
+          dataIndex: 'name',
+          key: 'name',
+          elipsis: true,
+          align: "center",
           width: 120,
         },
         {
-          title: '审批状态 ',
-          dataIndex: 'status',
-          key: 'status',
-        elipsis: true, align: "center",
+          title: '讲师工号 ',
+          dataIndex: 'userNo',
+          key: 'userNo',
+          elipsis: true,
+          align: "center",
+          width: 120,
+        },
+        {
+          title: '课程名称 ',
+          dataIndex: 'courseName',
+          key: 'courseName',
+          elipsis: true,
+          align: "center",
+          width: 200,
+        },
+        {
+          title: '培训发生组织',
+          dataIndex: 'trainOrg',
+          key: 'trainOrg',
+          elipsis: true,
+          align: "center",
+          width: 120,
+        },
+        
+        {
+          title: '授课时长 ',
+          dataIndex: 'teachingTime',
+          key: 'teachingTime',
+          elipsis: true,
+          align: "center",
+          width: 120,
+          
+        },
+        {
+          title: '授课时间 ',
+          dataIndex: 'teachingTime',
+          key: 'teachingTime',
+          elipsis: true,
+          align: "center",
+          width: 120,
+          
+        },
+        {
+          title: '讲师体系',
+          dataIndex: 'systemName',
+          key: 'systemName',
+          elipsis: true,
+          align: "center",
+          width: 120,
+        },
+        {
+          title: '讲师级别 ',
+          dataIndex: 'levelName',
+          key: 'levelName',
+          elipsis: true,
+          align: "center",
+          width: 120,
+        },
+        {
+          title: '发薪地 ',
+          dataIndex: 'teacherpayrollPlace',
+          key: 'teacherpayrollPlace',
+          elipsis: true,
+          align: "center",
+          width: 120,
+        },
+        {
+          title: '基准课酬 ',
+          dataIndex: 'teacherlevelPay',
+          key: 'teacherlevelPay',
+          elipsis: true,
+          align: "center",
+          width: 120,
+        },
+        {
+          title: '计划费用 ',
+          dataIndex: 'expense',
+          key: 'expense',
+          elipsis: true,
+          align: "center",
+          width: 120,
+        },
+        {
+          title: '参训人数 ',
+          dataIndex: 'studentNum',
+          key: 'studentNum',
+          elipsis: true,
+          align: "center",
+          width: 120,
+        },
+        {
+          title: '评分 ',
+          dataIndex: 'courseAssess',
+          key: 'courseAssess',
+          elipsis: true,
+          align: "center",
+          width: 120,
+        },
+        {
+          title: '课程类型 ',
+          dataIndex: ' courseType',
+          key: ' courseType',
+          elipsis: true,
+          align: "center",
           width: 120,
           customRender: (value) => {
             return (
               <div>
-                {value.record.status == "A10" || value.record.status == "A20" ||value.record.status == "A30" ||value.record.status == "E10"||value.record.status == "S20"
+                {value.record. courseType == "1" || value.record. courseType == "2"|| value.record.courseTypeype == "3"
                   ? {
-                    "A10": "待审核",
-                    "A20": "已提交",
-                    "A30": "审核中",
-                    "E10": "审核打回",
-                    "S20": "审核通过",
-                  }[value.record.status + ""] || ""
+                    "1": "项目开课",
+                    "2": "路径开课",
+                    "3": "面授开课",
+                  }[value.record. courseType + ""] || ""
                   : "-"}
               </div>
             )
           }
         },
-        {
-          title: '审批时间 ',
-          dataIndex: 'teacherName',
-          key: 'teacherName',
-        elipsis: true, align: "center",
-          width: 120,
-        },
-        {
-          title: '备注 ',
-          dataIndex: 'remark',
-          key: 'remark',
-        elipsis: true, align: "center",
-          width: 120,
-        },
       ])
       function managerChange(e, l, d, t, orgName) {
       console.log(e, l);
@@ -658,12 +863,16 @@
         searchReset,
         columns,
         columnsExamine,
+        columnsExamineTwo,
         tableData,
         tableDataExamine,
         changePagination,
         addTeacher,
         cancelTeachingDialog,
         handleLook,
+        submit,
+        withdraw,
+        goDdit,
         cancel,
         handleOperate,
         closehandleOperate,