health-front/pages_order/product/tabCourse/index.vue

<template>
  <view>
    <!-- 搜索栏 -->
    <view class="search">
      <uv-search 
        v-model="keyword"
        placeholder="请输入要查询的内容"
        placeholderColor="#C6C6C6"
        searchIconColor="#8B8B8B"
        :searchIconSize="40" 
        :inputStyle="{
          'font-family': 'PingFang SC',
          'font-weight': 400,
          'font-size': '28rpx',
          'line-height': 1.4,
          'padding': '12rpx 0',
        }"
        bgColor="#fff" 
        :showAction="false"
        @search="search"
      ></uv-search>
    </view>

    <view class="section">
      <view class="section-header">
        <!-- todo -->
        <sectionHeader :title="`直播 · 05月11日 12:00`" @showAll="jumpToLive"></sectionHeader>
      </view>
      <view style="padding: 0 32rpx;">
        <courseLiveCard v-for="item in liveList" :key="item.id" :data="item"></courseLiveCard>
      </view>
    </view>
    <view class="section">
      <sectionHeader title="推荐课程" @showAll="jumpToRecommendCourse"></sectionHeader>
      <courseRecommendView></courseRecommendView>
    </view>
  </view>
</template>

<script>
	import sectionHeader from '@/components/home/sectionHeader.vue'
  import courseLiveCard from './courseLiveCard.vue'
  import courseRecommendView from './courseRecommendView.vue'

  export default {
		components: {
      sectionHeader,
      courseLiveCard,
      courseRecommendView,
    },
    data() {
      return {
				keyword: '',
        liveList: [],
      }
    },
    mounted() {
      this.liveList = [
        {
          id: '001',
					url: '', 
          startTime: '2025-07-25 19:30:00',
        },
      ]
    },
    methods: {
			// 搜素
			search() {
        // todo
				uni.navigateTo({
					url: '/pages/index/category?search=' + this.keyword
				})
				this.keyword = ''
			},
      jumpToLive() {
        // todo
      },
      jumpToRecommendCourse() {
        // todo
      },
    },
  }
</script>

<style scoped lang="scss">
  @import '../styles/tab.scss';

</style>