first commit

历届学生/逯帅帅/项目开发/上课项目/uniapp在包河/pages/about/about.vue

@@ -0,0 +1,104 @@
+<template lang="pug">
+  ul
+    li(v-for='item in liveArr' @click="enterInfo(item)")
+      .li-top
+        img(class='context' :src='item.coverimage')
+        // 右上角
+        img(v-if='item.status == 10' class='state' src='/static/img/icon/live_lab_ing.png')
+        img(v-else-if='item.status == 3' class='state' src='/static/img/icon/live_lab_notice_big.png')
+        img(v-else='item.status == 1 || 2' class='playback' src='/static/img/icon/live_lab_playback_big.png')
+        .time(v-if='item.status == 10') 直播时间：{{item.start_time}}
+        .subscribe(v-if='item.status == 3') {{item.appointment_count}}人预约
+        .subscribe(v-else-if='item.status == 1 || 2') {{item.appointment_count}}人看过
+        .subscribe(v-else='item.status == 10') {{item.appointment_count}}人在看
+      span {{item.title}}
+</template>
+
+<script>
+export default {
+  created () {
+    this.liveList()
+  },
+  data () {
+    return {
+      liveArr: []
+    }
+  },
+
+  methods: {
+    async liveList () {
+      let res = await this.$http.index.liveList({
+
+      })
+      this.liveArr = res.list
+      console.log(res)
+    },
+    enterInfo(item) {
+      uni.navigateTo({
+        url: `/pages/videolive/videolive?id=${item.id}`,
+      });
+    },
+
+  }
+
+}
+</script>
+
+<style scoped lang="less">
+ul{
+  margin-top: 31rpx;
+  border-top: 1rpx solid #f5f5f5;
+  padding-left: 21rpx;
+  padding-right: 23rpx;
+  li{
+    position: relative;
+    margin-bottom: 0.533rem;
+    .li-top {
+      .context {
+        width: 702rpx;
+        height: 309rpx;
+      }
+      .state {
+        position: absolute;
+        top: 14rpx;
+        right: 14rpx;
+        width: 114rpx;
+        height: 36rpx;
+      }
+      .playback {
+        position: absolute;
+        top: 14rpx;
+        right: 14rpx;
+        width: 60rpx;
+        height: 36rpx;
+      }
+      .time {
+        position: absolute;
+        top: 40%;
+        left: 50%;
+        transform: translate(-50%, -50%);
+        width: 280rpx;
+        height: 40rpx;
+        background-color: #000000;
+        border-radius: 20rpx;
+        opacity: 0.7;
+        align-items: center;
+        text-align: center;
+        color: #fff;
+        font-size: 22rpx;
+      }
+      .subscribe {
+        position: absolute;
+        right: 13rpx;
+        bottom: 12rpx;
+        font-size: 22rpx;
+        color: #ffffff;
+      }
+    }
+  }
+  span {
+    display: block;
+    font-size: 30rpx;
+  }
+}
+</style>