orchestra-app/src/views/unit-test/unit-create/uni-test.tsx

import request from '@/helpers/request'
import { state } from '@/state'
import { Button, Empty, Grid, GridItem, Icon, showConfirmDialog, showToast } from 'vant'
import { defineComponent, onMounted, reactive, onUnmounted, ref } from 'vue'
import styles from './uni-test.module.less'
import { useRoute, useRouter } from 'vue-router'
import {
  listenerMessage,
  postMessage,
  promisefiyPostMessage,
  removeListenerMessage
} from '@/helpers/native-message'
import OEmpty from '@/components/o-empty'
import iconLook from './image/look.svg'
import iconCourse from '@/views/courseList/image/icon-course.png'
import { browser } from '@/helpers/utils'
export default defineComponent({
  name: 'uni-test',
  setup() {
    const route = useRoute()
    const router = useRouter()
    const browserInfo = browser()
    // const catchList = store
    const forms = ref({} as any)
    const data = reactive({
      loading: true,
      list: [] as any
    })
    const getList = async () => {
      data.loading = true
      try {
        const res: any = await request.post(
          state.platformApi + '/courseSchedule/queryUnitExamination',

          {
            requestType: 'form',
            data: {
              lessonCoursewareId: route.query.lessonCoursewareId,
              classGroupId: forms.value.classGroupId
            }
          }
        )
        //      classGroupId: forms.value.classGroupId
        data.list = res.data || []
      } catch (error) {}

      data.loading = false
    }
    onMounted(() => {
      forms.value = { ...JSON.parse(sessionStorage.getItem('unit-create') || '{}') } as any
      getList()
    })

    const handleClick = async (item: any) => {
      if (route.query.code === 'select') {
        console.log('选择课时')

        return
      }
      // 选择考试 看详情
      forms.value.testName = item.name
      forms.value.testId = item.id
      sessionStorage.setItem('unit-create', JSON.stringify(forms.value))
      router.push({ path: '/uni-last' })
    }

    return () => (
      <div style={{ paddingTop: '14px' }}>
        {data.list.length > 0 ? (
          <Grid gutter={14} columnNum={3} class={styles.grid}>
            {data.list.map((item: any) => {
              return (
                <GridItem>
                  <div class={styles.gridItem} onClick={() => handleClick(item)}>
                    <img src={iconCourse} class={styles.cover} />
                    <div class={styles.title}>
                      <div class={styles.coreTitle}>{item.name}</div>
                      {route.query.code !== 'select' && <div>已使用 {item.useNum} 次</div>}
                    </div>
                    {route.query.code !== 'select' ? (
                      <>
                        <div class={styles.num}>
                          查看
                          <Icon name="play-circle-o" class={styles.playIcon} />
                        </div>
                      </>
                    ) : null}

                    {route.query.code == 'select' && !item.unlock && (
                      <div class={styles.look} onClick={(e: Event) => e.stopPropagation()}>
                        <Icon name={iconLook} /> 未解锁
                      </div>
                    )}
                  </div>
                </GridItem>
              )
            })}
          </Grid>
        ) : (
          <OEmpty></OEmpty>
        )}
      </div>
    )
  }
})