<template>
  <!-- <headers title="查看更多" /> -->
  <view class="see-more-container">
    <block v-for="(item, index) in Teachs">
      <u-card :show-head="false" :show-foot="false" margin="0">
        <template #body>
          <u-section
            title="讲师介绍"
            font-size="34"
            :arrow="false"
            :right="false"
            line-color="#2979ff"
          />
          <view class="info">
            <u-image
              width="100rpx"
              height="100rpx"
              border-radius="10"
              :src="baseUrl + '/' + item.Url"
            />
            <view class="info-text">
              <text>{{ item.teachName }}</text>
              <text>{{ item.teachTle }}</text>
            </view>
          </view>
          <view class="detail">
            {{ item.teachMsg }}
          </view>
        </template>
      </u-card>
      <u-card :show-head="false" :show-foot="false" margin="0">
        <template #body>
          <u-section
            title="课程介绍"
            font-size="34"
            :arrow="false"
            :right="false"
            line-color="#2979ff"
          />
          <view class="detail">
            {{ item.courseMsg }}
          </view>
        </template>
      </u-card>
    </block>
  </view>
</template>

<script setup lang="ts">
// import headers from "@/components/header/index.vue"
import { useCourseStore } from "@/store/modules/courseStore"
import { baseUrl } from "@/utils/request"

const courseStore = useCourseStore()

const Teachs = computed(() => courseStore.getTeachs)
</script>

<style lang="scss" scoped>
.see-more-container {
  padding: 20rpx 30rpx;

  .u-card {
    margin-bottom: 24rpx !important;

    .info {
      display: flex;
      margin-top: 20rpx;

      .info-text {
        display: flex;
        flex-direction: column;
        margin-left: 20rpx;
        justify-content: space-around;

        text:nth-child(1) {
          font-size: 34rpx;
          font-weight: bold;
          color: #303133;
        }
      }
    }

    .detail {
      text-indent: 1em;
      margin-top: 30rpx;
      font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
      font-size: 28rpx;
      line-height: 1.25;
    }
  }
}
</style>
