integrated_traffic_uniapp/pages/application/onlinexxks/curriculum_schedule.vue

<template>
  <view>
    <cu-custom bgColor="bg-gradual-blueness" :isBack="true">
      <block slot="backText">返回</block>
      <block slot="content">课程列表</block>
    </cu-custom>
    <view class="container">
      <scroll-view @scrolltolower="scrolltolower" scroll-y style="height: calc(100vh - 65upx)">
        <view v-for="(item, index) in list" :key="index">
          <view class="list-item">
            <view class="image">
              <image :src="baseImgPath+item.COVERPATH" alt="" />
            </view>
            <view class="text">
              <view class="title line-2">{{ item.CURRICULUMNAME }}</view>
              <view class="class line-2">
                {{ item.CURRICULUMINTRODUCE }}
              </view>
              <view class="button">
                <button class="cu-btn round bg-blue" @click="learnNow(item.CLASSCURRICULUM_ID)">立即学习</button>
              </view>
            </view>
          </view>
        </view>
      </scroll-view>
    </view>
  </view>
</template>

<script>
import {basePath, loginUser,baseImgPath} from "@/common/tool";

export default {
  data() {
    return {
      baseImgPath,
      list: [],
      showCount: 10,
      currentPage: 1,
      totalPage: 0,
      CLASS_ID:'',
      POST_ID:'',
      STUDENT_ID:'',
      ISFACE: "0",
    }
  },
  onLoad(options) {
    this.CLASS_ID = options.CLASS_ID
    this.POST_ID = options.POST_ID
    this.STUDENT_ID = options.STUDENT_ID
  },
  onShow() {
    this.list = []
    this.currentPage = 1
    this.totalPage = 0
    this.showCount = 10
    this.getData()
  },
  methods: {
    scrolltolower() {
      this.currentPage++
      if (this.totalPage >= this.currentPage) {
        this.getData()
      }
    },
    getData() {
      uni.showLoading({
        title: '请稍候'
      })
      uni.request({
        url: basePath + '/app/stagestudentrelation/getClassCurriculum',
        method: 'POST',
        dataType: 'json',
        header: {
          'Content-type': 'application/x-www-form-urlencoded'
        },
        data: {
          CORPINFO_ID: loginUser.CORPINFO_ID,
          USER_ID: loginUser.USER_ID,
          showCount: this.showCount,
          currentPage: this.currentPage,
          CLASS_ID: this.CLASS_ID,
          POST_ID: this.POST_ID,
        },
        success: (res) => {
          uni.hideLoading(); //结束加载中动画
          var resData = res.data;
          if ("success" == resData.result) {
            this.list = [...this.list,...resData.varList];
            this.ISFACE = resData.classInfo.ISFACE;
          }
        }
      });
    },
    learnNow(CLASSCURRICULUM_ID){
      uni.navigateTo({
        url: '/pages/application/onlinexxks/video_study?CLASSCURRICULUM_ID='+CLASSCURRICULUM_ID+'&CLASS_ID='+this.CLASS_ID+'&STUDENT_ID='+this.STUDENT_ID+'&ISFACE='+this.ISFACE
      })
    }
  },
}
</script>

<style scoped lang="scss">
.container {
  box-sizing: border-box;
  padding: 0 20upx 20upx;
  background-color: #fff;
  .list-item {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    box-shadow: none;
    border-bottom: 1upx solid #eee;
    border-radius: 0;
    padding: 20upx;

    .image {
      width: 240upx;
      height: 160upx;

      image {
        width: 240upx;
        height: 160upx;
      }
    }

    .text {
      width: 100%;
      margin-left: 20upx;
      display: flex;
      flex-direction: column;
      justify-content: space-between;

      .title {
        font-weight: bold;
      }

      .class {
        color: #999;
        font-size: 30upx;
      }

      .button {
        display: flex;
        flex-direction: row;
        justify-content: flex-end;
      }
    }
  }
}
</style>