1

src/api/index.js

@@ -106,4 +106,26 @@ export function getStudentLeaveList(data) {
         method: 'post',
         data
     })
+}
+/**
+ * 申请作废
+ * @param {JSON参数} data
+ */
+export function invalidReceiptInfo(data) {
+    return request({
+        url: '/AppletIndex/InvalidReceipt',
+        method: 'post',
+        data
+    })
+}
+/**
+ * 申请详情
+ * @param {JSON参数} data
+ */
+export function getEduReceiptInfo(data) {
+    return request({
+        url: "/AppletIndex/GetEduReceiptInfo",
+        method: 'post',
+        data
+    })
 }
\ No newline at end of file

src/pages/course/askForLeave.vue

@@ -221,6 +221,11 @@ export default {
       },
     });
     let methods = {
+      jumpPage() {
+        uni.navigateTo({
+          url: "/pages/course/askForLeaveList",
+        });
+      },
       //显示请假类型弹出层
       show() {
         data.showType = true;
@@ -325,7 +330,10 @@ export default {
           data.leaveMsg.ReceiptFileList.push(item.url);
         });
         let res = await setStudentLeave(data.leaveMsg);
-        console.log("293", res);
+        if (res) {
+          Toast.success(res.Message);
+          that.jumpPage();
+        }
       },
     };
     watch(data.checkboxVal, (newVal) => {

src/pages/course/askForLeaveDetail.vue

@@ -102,6 +102,7 @@ import {
   computed,
   onMounted,
 } from "vue";
+import { getEduReceiptInfo } from "../../api/index";
 export default {
   setup() {
     let data = reactive({
@@ -143,16 +144,23 @@ export default {
         },
       ],
     });
-    let methods = {};
+    let methods = {
+      async getDetail(id) {
+        let res = await getEduReceiptInfo({ Id: id });
+      },
+    };
+    let that = methods;
     return {
       ...toRefs(data),
       ...methods,
     };
   },
-  onLoad() {
+  onLoad(options) {
+    let { ctx } = getCurrentInstance();
     uni.setNavigationBarTitle({
-      title: "请假",
+      title: "请假详情",
     });
+    ctx.getDetail(options.id);
   },
 };
 </script>

src/pages/course/askForLeaveList.vue

 <template>
   <view class="con">
-    <view
-      v-for="(item, index) in data"
-      :key="index"
-      class="leave-item"
-      @click="jumpPage"
+    <van-empty description="暂无请假申请" v-if="data.length === 0" />
+    <scroll-view
+      :scroll-top="0"
+      scroll-y="true"
+      class="scroll-box"
+      @scrolltolower="lower"
+      v-if="data.length > 0"
     >
-      <view class="top flex flex_start_center">
-        <van-image
-          round
-          width="55rpx"
-          height="55rpx"
-          src="https://img.yzcdn.cn/vant/cat.jpeg"
-          style="margin-right: 20rpx"
-          class="flex flex_start_center"
-        />
-        <view class="grow one_line name">{{ item.name }}</view>
-        <view class="date">{{ item.createTime }}</view>
-      </view>
-      <view class="flex flex_between_center margin-t-b-15">
-        <view class="flex label-next"
-          ><view class="label">请假类型</view>{{ item.type }}</view
+      <view v-for="(item, index) in data" :key="index" class="leave-item">
+        <view class="top flex flex_start_center" @click="jumpPage(item.Id)">
+          <van-image
+            round
+            width="55rpx"
+            fit="cover"
+            height="55rpx"
+            src="https://img.yzcdn.cn/vant/cat.jpeg"
+            style="margin-right: 20rpx"
+            class="flex flex_start_center"
+          />
+          <view class="grow one_line name">{{ item.CreateByName }}的请假</view>
+          <view class="date">{{ item.CreateTime }}</view>
+        </view>
+        <view class="flex flex_between_center margin-t-b-15">
+          <view class="flex label-next"
+            ><view class="label">请假类型</view>
+            <text v-if="item.DataObj.LeaveType === 1">事假</text>
+            <text v-if="item.DataObj.LeaveType === 2">病假</text>
+          </view>
+          <view
+            class="status"
+            :class="{
+              status1: item.VerifyStatus === 4,
+              status2: item.VerifyStatus === 6,
+              status3: item.VerifyStatus === 0,
+            }"
+            >{{ item.AuditStatusName }}</view
+          >
+        </view>
+        <view class="flex label-next margin-t-b-15"
+          ><view class="label">开始时间</view
+          >{{ item.DataObj.LeaveInfoList[0].ClassDate }}
+          {{ item.DataObj.LeaveInfoList[0].StartTime }}</view
+        >
+        <view class="flex label-next margin-t-b-15"
+          ><view class="label">结束时间</view
+          >{{
+            item.DataObj.LeaveInfoList[item.DataObj.LeaveInfoList.length - 1]
+              .ClassDate
+          }}
+          {{
+            item.DataObj.LeaveInfoList[item.DataObj.LeaveInfoList.length - 1]
+              .EndTime
+          }}</view
+        >
+        <view class="flex label-next margin-t-b-15 one_line" style="width: 80%"
+          ><view class="label">请假事由</view
+          >{{ item.DataObj.Remarks || "无" }}</view
+        >
+
+        <van-button
+          type="danger"
+          size="mini"
+          class="invalid-btn"
+          plain
+          v-if="item.VerifyStatus === 0"
+          @click="invalidApply(item)"
+          >作废</van-button
         >
-        <view class="status">{{ item.status }}</view>
       </view>
-      <view class="flex label-next margin-t-b-15"
-        ><view class="label">开始时间</view>{{ item.startTime }}</view
-      >
-      <view class="flex label-next margin-t-b-15"
-        ><view class="label">结束时间</view>{{ item.endTime }}</view
-      >
-      <view class="flex label-next margin-t-b-15"
-        ><view class="label">请假事由</view>{{ item.reason }}</view
-      >
-    </view>
+      <Loadmore :state="pageState" />
+    </scroll-view>
     <van-toast id="van-toast" />
+    <van-dialog id="van-dialog" />
   </view>
 </template>
 
@@ -48,48 +86,81 @@ import {
   watch,
   computed,
   onMounted,
+  inject,
 } from "vue";
+import { getStudentLeaveList, invalidReceiptInfo } from "../../api/index";
+import Loadmore from "../../components/loadmore.vue";
+import Dialog from "../../wxcomponents/vant/dialog/dialog";
 export default {
+  components: {
+    Loadmore,
+  },
   setup() {
+    let Toast = inject("$toast");
     let data = reactive({
-      data: [
-        {
-          name: "李思思的请假",
-          headerImg: "",
-          createTime: "2021.08.20",
-          type: "事假",
-          startTime: "2021-07-20  09:35",
-          endTime: "2021-07-20  09:35",
-          reason: "家中有事",
-          status: "审批已通过",
-        },
-        {
-          name: "李思思的请假",
-          headerImg: "",
-          createTime: "2021.08.20",
-          type: "事假",
-          startTime: "2021-07-20  09:35",
-          endTime: "2021-07-20  09:35",
-          reason: "家中有事",
-          status: "审批已通过",
-        },
-      ],
+      data: [],
+      pageState: "more",
       msg: {
         pageIndex: 1,
-        pageSize: 20,
+        pageSize: 12,
+        rowsPerPage: 12,
       },
+      PageCount: 0,
     });
 
     let methods = {
-      jumpPage() {
+      jumpPage(id) {
         uni.navigateTo({
-          url: "/pages/course/askForLeaveDetail",
+          url: "/pages/course/askForLeaveDetail?id=" + id,
         });
       },
+      lower(e) {
+        if (data.msg.pageIndex < data.PageCount) {
+          data.pageState = "loading";
+          data.msg.pageIndex++;
+          that.getList();
+        }
+      },
+      reload() {
+        data.msg.pageIndex = 1;
+        that.getList();
+      },
+      async getList() {
+        let res = await getStudentLeaveList(data.msg);
+        data.data = res.Data.PageData;
+        data.PageCount = res.Data.PageCount;
+        if (data.msg.pageIndex === res.Data.PageCount) {
+          data.pageState = "none";
+        } else {
+          data.pageState = "more";
+        }
+      },
+      invalidApply(item) {
+        Dialog.confirm({
+          title: "提示信息",
+          message: "是否要作废此申请?",
+        })
+          .then(async (e) => {
+            //确认
+            let delMsg = {
+              Id: item.Id,
+            };
+            let res = await invalidReceiptInfo(delMsg);
+            if (res) {
+              Toast.success(res.Message);
+              that.reload();
+            }
+          })
+          .catch(() => {
+            //取消
+          });
+      },
     };
     onMounted(() => {
+      that.getList();
       console.log("12343434");
     });
+    let that = methods;
     return {
       ...toRefs(data),
       ...methods,
@@ -97,7 +168,7 @@ export default {
   },
   onLoad() {
     uni.setNavigationBarTitle({
-      title: "请假",
+      title: "请假列表",
     });
   },
 };
@@ -106,14 +177,19 @@ export default {
 
 <style scoped>
 .con {
+  height: 100vh;
   box-sizing: border-box;
   font-family: PingFang SC;
-  padding: 30rpx;
+  padding: 30rpx 0;
 }
 .leave-item {
+  box-sizing: border-box;
+  width: 690rpx;
   padding: 20rpx 30rpx;
+  margin: 0 auto;
   margin-bottom: 30rpx;
   box-shadow: 0rpx 4rpx 10rpx 0rpx rgba(36, 36, 36, 0.2);
+  position: relative;
 }
 .top {
   border-bottom: 1rpx solid #e2e2e2;
@@ -138,6 +214,15 @@ export default {
   font-weight: 500;
   color: #00df9f;
 }
+.status1 {
+  color: #ff3816;
+}
+.status2 {
+  color: #111111;
+}
+.status3 {
+  color: #4fc08d;
+}
 .label {
   font-size: 24rpx;
   font-family: PingFang SC;
@@ -155,4 +240,14 @@ export default {
   margin-top: 15rpx;
   margin-bottom: 15rpx;
 }
+.scroll-box {
+  height: 100%;
+  width: 100%;
+}
+.invalid-btn {
+  position: absolute;
+  right: 30rpx;
+  bottom: 20rpx;
+  z-index: 10;
+}
 </style>

src/pages/index/index.vue

@@ -181,7 +181,7 @@ export default {
           desc: "李琴",
           img: "https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/educationStu/icon6.png",
           bgcolor: "#FFE7E6",
-          jumpUrl: "",
+          jumpUrl: "/pages/course/askForLeaveList",
         },
       ],
       testList: [