提交

1

src/school/approval-manage/components/approval-item.module.less

@@ -42,26 +42,58 @@
       display: flex;
       flex-direction: row;
       align-items: center;
-      padding-bottom: 15px;
-      .headImgs {
-        width: 42px;
-        height: 42px;
-        border-radius: 50%;
-        overflow: hidden;
-        margin-right: 12px;
+      justify-content: space-between;
+      // padding-bottom: 15px;
+      .courseInfoLeft {
+        display: flex;
+        flex-direction: row;
+        align-items: center;
+        .headImgs {
+          width: 48px;
+          height: 48px;
+          border-radius: 50%;
+          overflow: hidden;
+          margin-right: 10px;
+        }
+        .infoMsg {
+          .infoMsgMain {
+            font-size: 16px;
+            font-weight: 600;
+            color: #333333;
+            line-height: 22px;
+          }
+          .infoMsgSub {
+            font-size: 12px;
+            font-weight: 500;
+            color: #ffffff;
+            line-height: 19px;
+            // padding: 1px 8px;
+            border-radius: 4px;
+            margin-top: 3px;
+            text-align: center;
+          }
+          .student {
+            background-color: #ff8057;
+          }
+          .teacher {
+            background-color: #64a9ff;
+          }
+        }
       }
-      .infoMsg {
-        .infoMsgMain {
+      .courseInfoRight {
+        display: flex;
+        flex-direction: row;
+        align-items: center;
+        .approvalType {
           font-size: 16px;
-          font-weight: 600;
+          font-weight: 500;
           color: #333333;
-          line-height: 22px;
+          // line-height: 22px;
+          margin-right: 16px;
         }
-        .infoMsgSub {
+        .icons {
           font-size: 12px;
-          font-weight: 400;
-          color: #777777;
-          line-height: 17px;
+          color: #d8d8d8;
         }
       }
     }

src/school/approval-manage/components/approval-item.tsx

@@ -23,23 +23,29 @@ export default defineComponent({
                 <img src={clockIcon} alt="" />
               </div>
               <p class={styles.leftTimer}>
-                {dayjs(props.item.startTime).format('YYYY-MM-DD hh:mm')}
-                {'-'}
-                {dayjs(props.item.endTime).format('hh:mm')}
+                {dayjs(props.item.createTime).format('YYYY-MM-DD hh:mm')}
               </p>
             </div>
-            <div class={styles.itemWrapTopRight}>
-              <Icon name="arrow"></Icon>
-            </div>
+            <div class={styles.itemWrapTopRight}></div>
           </div>
           <div class={styles.itemWrapBottom}>
             <div class={styles.courseInfo}>
-              <img class={styles.headImgs} src={defaultIcon} alt="" />
-              <div class={styles.infoMsg}>
-                <p class={styles.infoMsgMain}>
-                  {props.item.classGroupName}-{props.item.teacherName}
-                </p>
-                <p class={styles.infoMsgSub}>{props.item.orchestraName}</p>
+              <div class={styles.courseInfoLeft}>
+                <img class={styles.headImgs} src={defaultIcon} alt="" />
+                <div class={styles.infoMsg}>
+                  <p class={styles.infoMsgMain}>{props.item.nickName}</p>
+                  {props.item.clientType == 'STUDENT' ? (
+                    <p class={[styles.infoMsgSub, styles.student]}>学生</p>
+                  ) : (
+                    <p class={[styles.infoMsgSub, styles.teacher]}>老师</p>
+                  )}
+                </div>
+              </div>
+              <div class={styles.courseInfoRight}>
+                {props.item.leaveCategoryId == 1 ? <p class={styles.approvalType}>请假</p> : null}
+                {props.item.leaveCategoryId == 2 ? <p class={styles.approvalType}>退团</p> : null}
+
+                <Icon class={styles.icons} name="arrow"></Icon>
               </div>
             </div>
           </div>

src/school/approval-manage/components/end-approval.tsx

@@ -0,0 +1,87 @@
+import OEmpty from '@/components/o-empty'
+import dayjs from 'dayjs'
+import { List, PullRefresh, showToast } from 'vant'
+import { defineComponent, reactive, ref, onMounted } from 'vue'
+import { useRouter } from 'vue-router'
+import styles from './wait-approval.module.less'
+import request from '@/helpers/request'
+import ApprovalItem from './approval-item'
+export default defineComponent({
+  name: 'end-approval',
+  setup() {
+    const router = useRouter()
+    const forms = reactive({
+      page: 1,
+      rows: 20
+    })
+
+    const refreshing = ref(false)
+    const loading = ref(false)
+    const finished = ref(false)
+    const showContact = ref(false)
+    const list = ref([])
+
+    const getList = async () => {
+      console.log('getList')
+      loading.value = true
+      try {
+        if (refreshing.value) {
+          forms.page = 1
+          list.value = []
+          refreshing.value = false
+        }
+
+        const res = await request.post('/api-school/userLeaveRecord/page', {
+          data: { ...forms, hasHandle: true }
+        })
+
+        if (list.value.length > 0 && res.data.pages === 1) {
+          return
+        }
+        forms.page = res.data.current + 1
+        list.value = list.value.concat(res.data.rows || [])
+        showContact.value = list.value.length > 0
+        loading.value = false
+        finished.value = res.data.current >= res.data.pages
+      } catch (e: any) {
+        // console.log(e, 'e')
+        const message = e.message
+        showToast(message)
+        showContact.value = false
+        finished.value = true
+      }
+    }
+    const onRefresh = () => {
+      finished.value = false
+      // 重新加载数据
+      // 将 loading 设置为 true，表示处于加载状态
+      loading.value = true
+      getList()
+    }
+    onMounted(() => {
+      getList()
+    })
+    return () => (
+      <>
+        <div class={styles.approvalWrap}>
+          {showContact.value ? (
+            <PullRefresh v-model={refreshing.value} onRefresh={onRefresh}>
+              <List
+                v-model:loading={loading.value}
+                finished={finished.value}
+                finished-text="没有更多了"
+                onLoad={getList}
+              >
+                {list.value.map((item: any) => (
+                  <ApprovalItem item={item} type="end"></ApprovalItem>
+                ))}
+              </List>
+            </PullRefresh>
+          ) : (
+            <OEmpty />
+          )}
+        </div>
+      </>
+    )
+  }
+})

src/school/approval-manage/components/wait-approval.module.less

@@ -0,0 +1,3 @@
+.approvalWrap {
+  margin-top: 12px;
+}

src/school/approval-manage/components/wait-approval.tsx

@@ -32,7 +32,7 @@ export default defineComponent({
         }
 
         const res = await request.post('/api-school/userLeaveRecord/page', {
-          data: { ...forms }
+          data: { ...forms, hasHandle: false }
         })
 
         if (list.value.length > 0 && res.data.pages === 1) {
@@ -59,24 +59,29 @@ export default defineComponent({
       loading.value = true
       getList()
     }
+    onMounted(() => {
+      getList()
+    })
     return () => (
       <>
-        {showContact.value ? (
-          <PullRefresh v-model={refreshing.value} onRefresh={onRefresh}>
-            <List
-              v-model:loading={loading.value}
-              finished={finished.value}
-              finished-text="没有更多了"
-              onLoad={getList}
-            >
-              {list.value.map((item: any) => (
-                <ApprovalItem item={item} type="wait"></ApprovalItem>
-              ))}
-            </List>
-          </PullRefresh>
-        ) : (
-          <OEmpty />
-        )}
+        <div class={styles.approvalWrap}>
+          {showContact.value ? (
+            <PullRefresh v-model={refreshing.value} onRefresh={onRefresh}>
+              <List
+                v-model:loading={loading.value}
+                finished={finished.value}
+                finished-text="没有更多了"
+                onLoad={getList}
+              >
+                {list.value.map((item: any) => (
+                  <ApprovalItem item={item} type="wait"></ApprovalItem>
+                ))}
+              </List>
+            </PullRefresh>
+          ) : (
+            <OEmpty />
+          )}
+        </div>
       </>
     )
   }

src/school/approval-manage/index.tsx

@@ -4,6 +4,8 @@ import { Tabs, Tab } from 'vant'
 import { defineComponent, reactive, ref } from 'vue'
 import styles from './index.module.less'
 import { useRouter } from 'vue-router'
+import WaitApproval from './components/wait-approval'
+import EndApproval from './components/end-approval'
 const activeName = ref('wait')
 export default defineComponent({
   name: 'approval-manage',
@@ -17,10 +19,10 @@ export default defineComponent({
           <OHeader isBack={true}></OHeader>
           <Tabs v-model:active={activeName.value} class={styles.approvalTab}>
             <Tab name="wait" title="待审批">
-              待审批
+              <WaitApproval></WaitApproval>
             </Tab>
             <Tab name="end" title="已完成">
-              已完成
+              <EndApproval></EndApproval>
             </Tab>
           </Tabs>
         </OSticky>

src/school/attendance/components/attend-teacher.tsx

@@ -60,7 +60,7 @@ export default defineComponent({
           refreshing.value = false
         }
 
-        const res = await request.post('api-school/courseSchedule/teacherAttendance', {
+        const res = await request.post('/api-school/courseSchedule/teacherAttendance', {
           data: { ...forms }
         })