h5-colexiu/src/tenant/music/list/list.tsx

import ColResult from '@/components/col-result'
import { SubjectEnum, useSubjectId } from '@/helpers/hooks'
import request from '@/helpers/request'
import { openDefaultWebView, state } from '@/state'
import { List } from 'vant'
import { defineComponent, reactive, ref } from 'vue'
import { useRoute, useRouter } from 'vue-router'
import Song from '../component/song'
import styles from './index.module.less'
import { getHttpOrigin } from '@/helpers/utils'

const noop = () => {}

export default defineComponent({
  name: 'list',
  props: {
    hideSearch: {
      type: Boolean,
      default: false
    },
    defauleParams: {
      type: Object,
      default: () => ({})
    },
    onItemClick: {
      type: Function,
      default: noop
    },
    teacherId: {
      type: String || Number,
      default: ''
    }
  },
  setup({ hideSearch, defauleParams, onItemClick, teacherId }, { expose }) {
    const route = useRoute()
    const router = useRouter()
    const tempParams: any = {}
    if (state.version) {
      tempParams.version = state.version || '' // 处理ios审核版本
      tempParams.platform =
        state.platformType === 'STUDENT' ? 'ios-student' : 'ios-teacher'
    }
    // 判断是否在搜索页面用过
    if (!hideSearch) {
      const getSubject: any = useSubjectId(SubjectEnum.SEARCH)
      tempParams.subjectIds = getSubject.id
    }
    //
    const params = reactive({
      search: (route.query.search as string) || '',
      exquisiteFlag: 1,
      musicTagIds: route.query.tagids || '',
      page: 1,
      ...defauleParams,
      ...tempParams
    })
    const data = ref<any>(null)
    const loading = ref(false)
    const finished = ref(false)
    const isError = ref(false)
    const apiSuffix = ref(
      state.platformType === 'STUDENT' ? '/api-student' : '/api-teacher'
    )

    const FetchList = async () => {
      if (loading.value) {
        return
      }
      loading.value = true
      isError.value = false
      const tempParams = {
        ...params,
        auditStatus: 'PASS',
        idAndName: params.search,
        createBy: teacherId
      }
      // if (state.platformType === 'TEACHER') {
      tempParams.myself = false
      // }

      try {
        const res = await request.post(`${apiSuffix.value}/music/sheet/list`, {
          data: tempParams
        })
        if (data.value) {
          const result = (data.value?.rows || []).concat(res.data.rows || [])
          data.value.rows = result
        }
        data.value = data.value || res.data
        params.page = res.data.pageNo + 1
        finished.value = res.data.pageNo >= res.data.totalPage
      } catch (error) {
        isError.value = true
      }
      loading.value = false
    }
    return () => (
      <List
        loading={loading.value}
        finished={finished.value}
        finished-text={data.value && data.value.rows.length ? '没有更多了' : ''}
        onLoad={FetchList}
        error={isError.value}
      >
        {data.value && data.value.rows.length ? (
          <div class={styles.alumnList}>
            <Song
              list={data.value.rows}
              onDetail={(item: any) => {
                if (onItemClick === noop) {
                  const url =
                    getHttpOrigin() +
                    location.pathname +
                    '#/music-detail?id=' +
                    item.id
                  openDefaultWebView(url, () => {
                    router.push({
                      path: '/music-detail',
                      query: {
                        id: item.id
                      }
                    })
                  })
                } else {
                  onItemClick?.(item)
                }
              }}
            />
          </div>
        ) : (
          !loading.value && (
            <ColResult tips="暂无曲目" classImgSize="SMALL" btnStatus={false} />
          )
        )}
      </List>
    )
  }
})