nml_mobile/src/pages/stxk/jz/index.vue

<script setup>
import { getCountDownTime } from '~/utils/day';
import { paddingLeft } from '~/utils/string';
import { child } from '~/store/child';
// import { children } from '~/store/children';
import getTeamInfo from '~/store/team';

const children = JSON.parse(sessionStorage.getItem('children'))
console.log('children :>> ', children);

function handleNavLeftClick() {
  router.replace('/home')
}

function handleNavRightClick() {
  router.push('/stxk/jz/wd')
}
if (location.search) {
  location.search = "";
}

const router = useRouter()
function handleClickCard(item) {
  router.push(`/stxk/jz/kcxq/${item.kk_id}`)
}

let loading = $ref(true)
let kxq_code = $ref()
getTeamInfo.then(
  (res) => {
    kxq_code = res.kxq_code
    loading = false
  }
)

function test(item) {
  return JSON.parse(item.kk_teacher || '{}')?.name ?? '-'
}

// 判断当前时间在报名时间前，报名时间内，报名时间后
// 参数 startTime: 开始时间
// 参数 endTime: 结束时间
function getBmStatus(startTime, endTime) {
  const now = new Date().getTime()
  const start = new Date(startTime).getTime()
  const end = new Date(endTime).getTime()
  if (now < start) {
    return 0
  } else if (now >= start && now <= end) {
    return 1
  } else if (now > end) {
    return 2
  }
}

</script>

<template>
  <van-sticky>
    <van-nav-bar title="社团选课" right-text="我的社团课程" @click-right="handleNavRightClick" left-arrow
      @click-left="handleNavLeftClick">
    </van-nav-bar>
  </van-sticky>


  <van-skeleton :row="3" :loading="loading">
    <remote-list url="/khfw/kcgl/index"
      :d="{ token: child.token, kxq_code, grade: children?.map(child => child.cm_info.map(({ grade }) => grade).join(','))?.join(',') }">
      <template #default="{ row: item }">
        <!--  :desc="item.desc" -->
        <van-card :price="item.kk_kcfy" :desc="`讲师：${test(item)}`" :title="item.kk_name" :thumb="item.kk_img"
          @click="handleClickCard(item)">
          <template #tag>

            <van-count-down v-if="getBmStatus(item.kk_bmkssj, item.kk_bmjssj) === 0"
              :time="getCountDownTime(item.kk_bmkssj)">
              <template #default="timeData">
                <span class="bg-opacity-50 text-light-900 bg-dark-900 px-1">
                  {{ paddingLeft(timeData.days * 24 + timeData.hours) }}:{{ paddingLeft(timeData.minutes)
                  }}:{{ paddingLeft(timeData.seconds) }}
                </span>
              </template>
            </van-count-down>

            <div class="text-white bg-blue-500 px-1 rounded-r-4px bg-opacity-60 leading-4"
              v-else-if="getBmStatus(item.kk_bmkssj, item.kk_bmjssj) === 1">报名中</div>
            <div class="text-white bg-red-500 px-1 rounded-r-4px bg-opacity-60 leading-4"
              v-else-if="getBmStatus(item.kk_bmkssj, item.kk_bmjssj) === 2">报名结束</div>
          </template>
          <template #num>
            <span>{{ item.khfw_kcbmxx.count }}人报名</span>
          </template>
        </van-card>
      </template>
    </remote-list>
  </van-skeleton></template>