feat:各审核的各操作

src/views/examine/CourseReviewed.vue

@@ -16,7 +16,7 @@
             <div class="inpbox1">
               <a-select
                 v-model:value="valueproj"
-                placeholder="请输入内容分类"
+                placeholder="请选择内容分类"
                 @change="handleChangeproj"
                 :options="optionsproj"
               />
@@ -48,11 +48,11 @@
           </div>
         </div>
         <div class="tmplh_btn">
-          <div class="btn btn1">
+          <div class="btn btn1" @click="search">
             <div class="search"></div>
             <div class="btnText btnText1">搜索</div>
           </div>
-          <div class="btn btn2">
+          <div class="btn btn2" @click="reset">
             <div class="search"></div>
             <div class="btnText btnText2">重置</div>
           </div>
@@ -66,16 +66,31 @@
             :loading="tableDataTotal === -1 ? true : false"
             expandRowByClick="true"
             @expand="expandTable"
+            :scroll="{ x: 1300 }"
             :pagination="false"
           />
         </div>
+        <div class="tableBox">
+          <div class="pa">
+            <a-pagination
+              v-if="total > 10"
+              showSizeChanger="true"
+              show-quick-jumper
+              :pageSize="pageSize"
+              v-model:current="currentPage"
+              :total="total"
+              class="pagination"
+              @change="changePagination"
+            />
+          </div>
+        </div>
       </div>
     </div>
   </div>
 </template>
 <script>
-import { reactive, toRefs } from "vue";
-
+import { reactive, toRefs, onMounted } from "vue";
+import { courseListView } from "../../api/indexAudit";
 export default {
   name: "CoursereViewed",
 
@@ -83,18 +98,20 @@ export default {
     const state = reactive({
       optionsproj: [
         {
-          value: "jack",
+          value: "0",
           label: "Jack",
         },
         {
-          value: "rose",
+          value: "1",
           label: "rose",
         },
       ],
       valueproj: null,
       valuecreater: null,
       valuename: null,
-
+      currentPage: 1,
+      total: null,
+      pageSize: 10,
       columns1: [
         {
           title: "序号",
@@ -155,21 +172,92 @@ export default {
         },
       ],
       tableData1: [
-        {
-          number: "1",
-          name: "课程1",
-          type: "在线",
-          content: "领导力/领导业务",
-          status: "通过",
-          creater: "-",
-          time: "-",
-          msg: "-",
-        },
+        // {
+        //   number: "1",
+        //   name: "课程1",
+        //   type: "在线",
+        //   content: "领导力/领导业务",
+        //   status: "通过",
+        //   creater: "-",
+        //   time: "-",
+        //   msg: "-",
+        // },
       ],
     });
-
+    const getList = (obj) => {
+      let objn = obj || {
+        auditStatus: 0,
+        categoryId: 0,
+        createName: "",
+        name: "",
+        pageNo: state.currentPage,
+        pageSize: 10,
+      };
+      courseListView(objn)
+        .then((res) => {
+          console.log("获取已审核课程成功", res);
+          let result = res.data.data.rows;
+          state.total = res.data.data.total;
+          setTableData(result);
+        })
+        .catch((err) => {
+          console.log("获取已审核课程失败", err);
+        });
+    };
+    const setTableData = (table) => {
+      let data = table;
+      let array = [];
+      data.map((item) => {
+        let obj = {
+          number: item.offcourseId,
+          name: item.name,
+          type: item.type == 1 ? "线上" : "线下",
+          content: item.categoryId,
+          status: item.auditStatus == 2 ? "通过" : "拒绝",
+          creater: item.createName,
+          time: "-",
+          msg: item.description,
+        };
+        array.push(obj);
+      });
+      state.tableData1 = array;
+    };
+    const search = () => {
+      let obj = {
+        auditStatus: 0,
+        categoryId: state.valueproj,
+        createName: state.valuecreater,
+        name: state.valuename,
+        pageNo: state.currentPage,
+        pageSize: 10,
+      };
+      getList(obj);
+    };
+    const reset = () => {
+      (state.valueproj = null),
+        (state.valuecreater = null),
+        (state.valuename = null),
+        getList();
+    };
+    const handleChangeproj = (value, item) => {
+      console.log(value, item);
+      state.valueproj = item.value;
+    };
+    const changePagination = (pagina) => {
+      state.currentPage = pagina;
+      getList();
+    };
+    onMounted(() => {
+      getList();
+    });
     return {
       ...toRefs(state),
+      getList,
+      setTableData,
+      search,
+      handleChangeproj,
+      reset,
+      changePagination,
     };
   },
 };
@@ -191,11 +279,13 @@ export default {
         .inpbox {
           display: flex;
           margin-top: 32px;
+          flex-wrap: wrap;
           .inpbox1 {
             display: flex;
             justify-content: center;
             align-items: center;
             margin-right: 24px;
+            margin-top: 10px;
             .ant-select-selector {
               border-radius: 8px;
               width: 270px;
@@ -210,8 +300,8 @@ export default {
       }
       .tmplh_btn {
         display: flex;
-        margin-left: 38px;
-        margin-top: 32px;
+        // margin-left: 38px;
+        margin-top: 42px;
         .btn {
           padding: 0px 26px 0px 26px;
           height: 38px;
@@ -219,7 +309,7 @@ export default {
           display: flex;
           align-items: center;
           justify-content: center;
-          margin-left: 14px;
+          margin-right: 14px;
           cursor: pointer;
           flex-shrink: 0;
           .search {
@@ -296,6 +386,12 @@ export default {
           }
         }
       }
+      .pa {
+        width: 100%;
+        margin-top: 20px;
+        display: flex;
+        justify-content: center;
+      }
     }
   }
 }