student-course-item.tsx 1.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051
  1. import { defineComponent, reactive, ref } from 'vue'
  2. import styles from './studnet-course-item.module.less'
  3. import clockIcon from '@/school/attendance/images/clock-icon.png'
  4. import passIcon from '../images/pass-icon.png'
  5. import unpassIcon from '../images/unpass-icon.png'
  6. import msgIcon from '@/school/images/msg-icon.png'
  7. import { Icon, ActionSheet } from 'vant'
  8. import dayjs from 'dayjs'
  9. import { useRouter } from 'vue-router'
  10. export default defineComponent({
  11. props: ['item', 'type'],
  12. name: 'student-course-item',
  13. setup(props) {
  14. const router = useRouter()
  15. const onAdjust = () => {
  16. router.push({ path: '/course-adjust', query: { id: props.item.id, isBack: 'true' } })
  17. }
  18. return () => (
  19. <>
  20. <div class={styles.itemWrap}>
  21. <div class={styles.itemWrapTop}>
  22. <div class={styles.itemWrapTopLeft}>
  23. <div class={styles.clockWrap}>
  24. <img src={clockIcon} alt="" />
  25. </div>
  26. <p class={styles.leftTimer}>
  27. {dayjs(props.item.startTime).format('YYYY-MM-DD HH:mm')} -
  28. {dayjs(props.item.endTime).format('HH:mm')}
  29. </p>
  30. </div>
  31. </div>
  32. <div class={styles.itemWrapBottom}>
  33. <div>
  34. <p class={styles.itemWrapBottomMain}>
  35. {props.item.className}-{props.item.teacherName}
  36. </p>
  37. <p class={styles.itemWrapBottomSub}>{props.item.orchestraName}</p>
  38. </div>
  39. <div class={styles.itemWrapBottomRight}>
  40. {props.type == 'STUDENT' ? null : (
  41. <div class={styles.rejectBtn} onClick={onAdjust}>
  42. 调整
  43. </div>
  44. )}
  45. </div>
  46. </div>
  47. </div>
  48. </>
  49. )
  50. }
  51. })